beiHai-ui/src/views/approveManagement/components/approveOperationLogManagement.vue

<!--审核操作日志管理-->
<template>
  <div class="systemBase">
    <div>
      <div style="margin-top: 10px;  border-bottom: 1px solid #d5d5d5;">
        <el-form ref="searchData1" :inline="true" :model="search" :rules="ruleValidateSearch">
          <!-- <el-form-item  label-width="80px" >
                      <div style="font-size: 16px; padding: 0px 20px;">计量操作日志管理
                      </div>
                  </el-form-item> -->
          <el-form-item prop="operator" label="操作人" >
            <el-input v-model="search.operator" clearable filterable collapse-tags size="small"
               style="width:120px;"></el-input>
          </el-form-item>
          <el-form-item label="创建日期" prop="times">
          <el-date-picker v-model="search.times[0]" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date"
            placeholder="开始日期" size="mini" style="width: 140px" :default-time="'00:00:00'">
          </el-date-picker>
          <span>至</span>
          <el-date-picker v-model="search.times[1]" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date"
            placeholder="结束日期" size="mini" style="width: 140px" :default-time="'23:59:59'">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
            <el-button icon="el-icon-search" type="primary" size="mini" @click="searchDatas"  style="margin-right: 10px;"
               >查询</el-button>
          <el-button icon="el-icon-refresh" type="info" plain size="mini" :disable="disSearch"
              @click="reset">重置</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-row>
        <el-col :span="24">
          <div class="common-table-div">
            <el-table v-loading="dataLoading" :row-class-name="tableRowClassName" ref="dataTable" highlight-current-row
              border :height="tableHeight" @selection-change="handleSelectionChange" :data="table.list"
              :icore-filter-flag="icoreFilterFlag"
              :exchangeFilterMap="{ 'meterNoteSource': { '0': '智能计量终端', '1': '自助取码终端', '2': '计量监控终端', '3': '微信小程序', '4': '远程计量终端' } }">
              <el-table-column type="index" label="序号" fixed="left" align="center"></el-table-column>
              <!-- <el-table-column type="selection" width="55" align="center"></el-table-column> -->
              <el-table-column sortable :show-overflow-tooltip="true" prop="operationModule" label="操作模块"
                min-width="200" align="center"></el-table-column>
              <el-table-column sortable :show-overflow-tooltip="true" prop="operator" label="操作人" min-width="110"
                align="left"></el-table-column>
              <!-- <el-table-column sortable :show-overflow-tooltip="true" prop="operationDescription" label="操作描述"
                min-width="300" align="left"></el-table-column> -->
              <el-table-column sortable :show-overflow-tooltip="true" prop="operationTime" label="操作时间" min-width="160"
                align="center"></el-table-column>
              <el-table-column sortable :show-overflow-tooltip="true" prop="ipAddress" label="IP地址" min-width="110"
                align="left"></el-table-column>
                <el-table-column sortable :show-overflow-tooltip="true" prop="queryParams" label="报文参数" min-width="400"
                align="left"></el-table-column>
            </el-table>
          </div>
          <div class="common-foot-style">
            <el-pagination v-loading="dataLoading" @size-change="pageSizeChange" @current-change="pageCurrentChange"
              :current-page="page.pageNum" :page-sizes="[100, 500, 1000]" :page-size="page.pageSize"
              layout="total, sizes, prev, pager, next, jumper" :total="page.totalPage">
            </el-pagination>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
import { formatDate } from '@/utils/util.js';
export default {
  data() {
    return {
      dataLoading: false,
      operateLoading: false,
      icoreFilterFlag: true,
      baseSpotNameItem: [],
      page: {
        pageSize: 500,
        pageNum: 1,
        totalPage: 0
      },
      table: {
        list: []
      },
      multipleSelection: [],
      tableHeight: 0,
      search: {
        operator: '',
        times: [null, null],
      },
      // ruleValidateSearch: {
      //    envDate: [{ 
      //      required: true, 
      //      validator: this.endTimeVerify, 
      //      trigger: 'blur' 
      //    }],
      //    startTime: [{
      //      required: true, 
      //      validator: this.strTimeVerify, 
      //      trigger: 'blur' 
      //    }]
      // },
      activeMenu: ''
    }
  },
  created() {
    this.tableHeight = (window.innerHeight - 220) > 400 ? window.innerHeight - 220 : 400
    this.activeMenu = window.top.localStorage.getItem('activeMenu')
  },
  mounted() {
    // this.getDataList();
    this.searchDatas()
    this.getBaseSpotNameItem()
  },
  methods: {
    endTimeVerify(rule, value, callback) {
      //   if (this.search.strDate && !this.search.envDate) {
      //    callback(new Error('结束时间不能为空！'));
      //  } else 
      if (this.search.endTime) {
        if (Date.parse(this.search.times[1]) > Date.parse(this.search.times[0])) {
          callback();
        } else {
          callback(new Error('结束时间不得早于开始时间！'));
        }
      } else {
        callback();
      }
    },
    strTimeVerify(rule, value, callback) {
      //  if (this.search.envDate && !this.search.strDate) {
      //    callback(new Error('开始时间不能为空！'));
      //  } else {
      //    callback()
      //  }
    },
    searchDatas() {
      this.page.pageNum = 1;
      this.searchData()
    },
    searchData() {
      this.$refs['searchData1'].validate((valid) => {
        if (valid) {
          this.dataLoading = true;
         this.search.times[0] = this.search.times[0] === null ? null : (this.search.times[0] + ' 00:00:00')
         this.search.times[1] = this.search.times[1] === null ? null : (this.search.times[1] + ' 23:59:59')
          let obj = {
            operator: this.search.operator,
            startTime: this.search.times[0],
            endTime: this.search.times[1],
            pageIndex: this.page.pageNum,
            pageSize: this.page.pageSize
          }
          this.axios.post('pass/testManagement/v1/approveoperationlogs/queryLogPage', obj, { individualType: "json" })
            .then(res => {
              console.log('logmanagement......', res)
              this.dataLoading = false;
              this.table.list = res.data.list;
              this.page.totalPage = res.data.total;
            }).catch(e => {
              this.dataLoading = false;
            });
        }
      })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    getTableHeight(dom) {
      return (window.innerHeight - dom.offsetTop);
    },
    pageSizeChange(size) {
      this.page.pageSize = size;
      this.searchData()
    },

    pageCurrentChange(index) {
      this.page.pageNum = index;
      this.searchData()
    },
    getDataList() {
      this.dataLoading = true;
      let obj ={
        pageIndex: this.page.pageNum,
        pageSize: this.page.pageSize,
      }
      this.axios.post('pass/testManagement/v1/approveoperationlogs/queryLogPage', obj, { individualType: "json" })
            .then(res => {
          this.dataLoading = false;
          this.table.list = res.data.list;
          this.page.totalPage = res.data.total;
        }).catch(e => {
          this.dataLoading = false;
        });
    },
    tableRowClassName({
      row,
      rowIndex
    }) {
      if (row.validFlag === '0') {
        return 'error-row2';
      }
      return '';
    },
    getBaseSpotNameItem() {
      this.axios.get('pass/systemBase/v1/meterbasespotinfos/noPage' + '?validFlag=1')
        .then(res => {
          this.baseSpotNameItem = res.data;
        })
    }
  }
}
</script>
<style scoped></style>