|
@@ -3,25 +3,33 @@
|
|
|
<div class="operateJournal">
|
|
|
<!-- 搜索框 -->
|
|
|
<div class="table-page-search-wrapper">
|
|
|
- <a-form layout="inline">
|
|
|
- <a-row :gutter="48">
|
|
|
- <a-col :md="8" :sm="24">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
+ <a-row :gutter="15">
|
|
|
+ <a-col :md="6" :sm="24">
|
|
|
<a-form-item label="操作时间">
|
|
|
- <a-range-picker :format="dateFormat" show-time :placeholder="['开始时间', '结束时间']" v-model="time" @change="onChange" />
|
|
|
+ <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :md="6" :sm="24">
|
|
|
- <a-form-item label="操作人"><a-input allowClear v-model.trim="searchData.queryWord" placeholder="请输入" /></a-form-item>
|
|
|
+ <a-form-item label="操作信息">
|
|
|
+ <a-input allowClear v-model.trim="queryParam.actDesc" placeholder="请输入操作信息" />
|
|
|
+ </a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :md="6" :sm="24">
|
|
|
- <a-button style="margin-right: 10px;" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
- <a-button type="" @click="resetForm">重置</a-button>
|
|
|
+ <a-form-item label="操作人">
|
|
|
+ <a-input allowClear v-model.trim="queryParam.actorName" placeholder="请输入操作人" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="6" :sm="24">
|
|
|
+ <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="operateJournal-refresh">查询</a-button>
|
|
|
+ <a-button style="margin-left: 5px" @click="resetSearchForm" :disabled="disabled" id="operateJournal-reset">重置</a-button>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
</a-form>
|
|
|
</div>
|
|
|
<!-- 列表 -->
|
|
|
<s-table
|
|
|
+ class="sTable"
|
|
|
ref="table"
|
|
|
size="default"
|
|
|
rowKey="id"
|
|
@@ -36,95 +44,75 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import moment from 'moment'
|
|
|
+import getDate from '@/libs/getDate'
|
|
|
import { STable } from '@/components'
|
|
|
import { journalList } from '@/api/OperateJournal.js'
|
|
|
-import getDate from '@/libs/getDate'
|
|
|
-import moment from 'moment'
|
|
|
+import rangeDate from '@/views/common/rangeDate.vue'
|
|
|
export default {
|
|
|
name: 'OperateJournal',
|
|
|
- components: { STable },
|
|
|
+ components: { STable, rangeDate },
|
|
|
data () {
|
|
|
return {
|
|
|
- // 列表
|
|
|
- form: this.$form.createForm(this, {
|
|
|
- name: 'OperateJournal'
|
|
|
- }),
|
|
|
- time: [moment(getDate.getToday().starttime, this.dateFormat), moment(getDate.getToday().endtime, this.dateFormat)],
|
|
|
- searchData: {
|
|
|
- beginDate: null, // 查询的开始时间
|
|
|
- endDate: null, // 查询的结束时间
|
|
|
- queryWord: '' // 操作人
|
|
|
+ advanced: false, // 高级搜索 展开/关闭
|
|
|
+ disabled: false, // 查询、重置按钮是否可操作
|
|
|
+ time: [
|
|
|
+ moment(getDate.getThreeday().starttime, this.dateFormat),
|
|
|
+ moment(getDate.getThreeday().endtime, this.dateFormat)
|
|
|
+ ],
|
|
|
+ queryParam: {
|
|
|
+ beginDate: getDate.getThreeday().starttime, // 查询的开始时间
|
|
|
+ endDate: getDate.getThreeday().endtime, // 查询的结束时间
|
|
|
+ actDesc: '',
|
|
|
+ actorName: ''
|
|
|
},
|
|
|
- dateFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
+ dateFormat: 'YYYY-MM-DD',
|
|
|
columns: [
|
|
|
- {
|
|
|
- title: '序号',
|
|
|
- dataIndex: 'no',
|
|
|
- minWidth: '40',
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '操作人',
|
|
|
- dataIndex: 'actorName',
|
|
|
- minWidth: '100',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'actorName' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: 'IP',
|
|
|
- dataIndex: 'ip',
|
|
|
- minWidth: '100',
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '日志明细',
|
|
|
- dataIndex: 'actDesc',
|
|
|
- minWidth: '100',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'actDesc' }
|
|
|
- }
|
|
|
+ { title: '序号', dataIndex: 'no', width: 80, align: 'center', fixed: 'left' },
|
|
|
+ { title: '操作时间', dataIndex: 'actDate', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: 'IP', dataIndex: 'ip', width: 200, align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '操作人', dataIndex: 'actorName', align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
|
|
|
+ { title: '操作信息', dataIndex: 'actDesc', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true }
|
|
|
],
|
|
|
// 加载数据方法 必须为 Promise 对象
|
|
|
loadData: parameter => {
|
|
|
- this.searchData.beginDate == null ? (this.searchData.beginDate = getDate.getToday().starttime) : null
|
|
|
- this.searchData.endDate == null ? (this.searchData.endDate = getDate.getToday().endtime) : null
|
|
|
- return journalList(Object.assign(parameter, this.searchData)).then(res => {
|
|
|
- const no = (res.data.data.pageNo - 1) * res.data.data.pageSize
|
|
|
- for (let i = 0; i < res.data.data.list.length; i++) {
|
|
|
- const _item = res.data.data.list[i]
|
|
|
- _item.no = no + i + 1
|
|
|
+ this.disabled = true
|
|
|
+ this.queryParam.beginDate = this.queryParam.beginDate + ' 00:00:00'
|
|
|
+ this.queryParam.endDate = this.queryParam.endDate + ' 23:59:59'
|
|
|
+ return journalList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
+ const data = res.data
|
|
|
+ const no = (data.pageNo - 1) * data.pageSize
|
|
|
+ for (var i = 0; i < data.list.length; i++) {
|
|
|
+ data.list[i].no = no + i + 1
|
|
|
}
|
|
|
- return res.data.data
|
|
|
+ this.disabled = false
|
|
|
+ return data
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- moment,
|
|
|
- // 操作时间change
|
|
|
- onChange (dates, dateStrings) {
|
|
|
- this.searchData.beginDate = dateStrings[0]
|
|
|
- this.searchData.endDate = dateStrings[1]
|
|
|
+ // 时间 change
|
|
|
+ dateChange (date) {
|
|
|
+ this.queryParam.beginDate = date[0]
|
|
|
+ this.queryParam.endDate = date[1]
|
|
|
},
|
|
|
// 重置
|
|
|
- resetForm () {
|
|
|
- this.searchData.beginDate = getDate.getToday().starttime
|
|
|
- this.searchData.endDate = getDate.getToday().endtime
|
|
|
- this.time = [moment(getDate.getToday().starttime, this.dateFormat), moment(getDate.getToday().endtime, this.dateFormat)]
|
|
|
- this.searchData.queryWord = ''
|
|
|
+ resetSearchForm () {
|
|
|
+ this.$refs.rangeDate.resetDate(this.time)
|
|
|
+ this.queryParam.beginDate = getDate.getThreeday().starttime
|
|
|
+ this.queryParam.endDate = getDate.getThreeday().endtime
|
|
|
+ this.queryParam.actDesc = ''
|
|
|
+ this.queryParam.actorName = ''
|
|
|
this.$refs.table.refresh(true)
|
|
|
}
|
|
|
}
|
|
|
- // beforeRouteEnter (to, from, next) {
|
|
|
- // next(vm => {
|
|
|
- // // const todayDate= [getDate.getToday().starttime, getDate.getToday().endtime]
|
|
|
- // // console.log(todayDate)
|
|
|
- // // vm.searchData.beginDate = getDate.getToday().starttime
|
|
|
- // // vm.searchData.endDate = getDate.getToday().endtime
|
|
|
- // // console.log(vm.searchData.beginDate, '--------------', vm.searchData.endDate )
|
|
|
- // })
|
|
|
- // }
|
|
|
}
|
|
|
</script>
|
|
|
-
|
|
|
-<style></style>
|
|
|
+<style lang="less">
|
|
|
+ .operateJournal{
|
|
|
+ .sTable{
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|