ssi/ui/src/views/auditManager/operlogTotal/index.vue

<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="操作时间">
        <el-date-picker
          v-model="dateRange"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      </el-form-item>
    </el-form>

    <div style="padding-top: 10px">
      <vxe-table
        ref="tables"
        :loading="loading"
        align="center"
        class="mytable-style"
        auto-resize
        border
        resizable
        export-config
        highlight-current-row
        show-overflow
        max-height="700"
        :data="list"
      >
        <vxe-table-column field="day" title="日期"/>
        <vxe-table-column field="syscount" title="系统类型次数"/>
        <vxe-table-column field="bizcount" title="业务类型次数"/>
        <vxe-table-column field="success" title="成功次数"/>
        <vxe-table-column field="fail" title="失败次数"/>
        <vxe-table-column field="ips" title="ip个数"/>
      </vxe-table>
    </div>
  </div>
</template>

<script>

import {debounce} from "lodash";

export default {
  name: "Logininfor",
  data() {
    return {
      showTable: true,
      // 遮罩层
      loading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 选择用户名
      selectName: "",
      // 显示搜索条件
      showSearch: true,
      // 表格数据
      list: [],
      // 日期范围
      dateRange: [],
      // 默认排序
      defaultSort: {prop: 'loginTime', order: 'descending'},
      // 查询参数
      queryParams: {},
      sortOrder: 'loginTime&asc',
    };
  },
  created() {
  },
  methods: {
    /** 查询登录日志列表 */
    getList: debounce(async function () {
      if (this.dateRange == null || this.dateRange.length == 0) {
        this.$message({
          type: 'warning',
          message: '请选择统计时间范围!'
        });
        return
      }
      let dateDiff = new Date(this.dateRange[1]).getTime() - new Date(this.dateRange[0]).getTime()
      let dayDiff = Math.ceil(dateDiff / (24 * 3600 * 1000))
      if (dayDiff > 31) {
        this.$message.warning("最多只能统计31天的数据哦!")
        return
      }

      let sysTime
      let lk
      await this.$axios.get('/sysPolicyController/getLicenseKey').then((res) => {
        sysTime = res.data.sysTime
        lk = res.data.lk
      }).catch((error) => {
      })

      this.loading = true;
      var searchParams = {
        startLoginTime: this.dateRange[0],
        endLoginTime: this.dateRange[1],
        sysTime: sysTime,
        lk: lk
      }
      await this.$axios.get('/sysOperlogController/sysOperlogTotal',
        {params: searchParams}).then((res) => {
        if (res.code == 0) {
          this.list = res.data
          if (res.data == '') {
            this.showTable = false
          } else {
            this.showTable = true
          }
        } else if (res.code == 1) {
          this.$message.error(res.data)
        }
        this.loading = false
      }).catch((error) => {
        this.loading = false;
      })
    }, 1000),
    /** 搜索按钮操作 */
    handleQuery() {
      this.getList();
    }
  }
};
</script>