<template> 
 | 
  <div shadow="never" class="fa-card-a"> 
 | 
    <div class="mod-sys__log-operation"> 
 | 
      <zt-table-wraper ref="tableObj" query-url="/sys/log/operation/page" delete-url="/sys/log/operation" 
 | 
                       v-slot="{ table }"> 
 | 
            <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()"> 
 | 
              <el-form-item> 
 | 
                <el-select v-model="dataForm.status" :placeholder="$t('logOperation.status')" clearable> 
 | 
                  <el-option :label="$t('logOperation.status0')" :value="0"></el-option> 
 | 
                  <el-option :label="$t('logOperation.status1')" :value="1"></el-option> 
 | 
                </el-select> 
 | 
              </el-form-item> 
 | 
              <el-form-item label="时间范围"> 
 | 
                <el-date-picker type="daterange" v-model="dateVals" value-format="yyyy-MM-dd" range-separator="至" 
 | 
                                start-placeholder="开始日期" end-placeholder="结束日期" 
 | 
                                :clearable="true" :editable="false" @change="pickerChange"> 
 | 
                </el-date-picker> 
 | 
              </el-form-item> 
 | 
              <el-form-item> 
 | 
                <zt-button class="admin-query-button" type="query" @click="table.query()"/> 
 | 
                <el-button type="primary" @click="deleteHandle()">删除</el-button> 
 | 
                <zt-button type="export" @click="exportHandle()"/> 
 | 
              </el-form-item> 
 | 
            </el-form> 
 | 
            <el-table v-loading="table.dataLoading" 
 | 
                      v-adaptive="{bottomOffset:70}" 
 | 
                      height="650px" 
 | 
                      style="margin-top: 10px" 
 | 
                      :data="table.dataList" border @sort-change="table.sortChangeHandle" 
 | 
                      @selection-change="handleSelectionChange"> 
 | 
              <el-table-column type="selection" width="60" align="center"/> 
 | 
              <el-table-column prop="creatorName" :label="$t('logOperation.creatorName')"/> 
 | 
              <el-table-column prop="operation" :label="$t('logOperation.operation')"/> 
 | 
              <el-table-column prop="requestUri" :label="$t('logOperation.requestUri')"/> 
 | 
              <el-table-column prop="requestMethod" :label="$t('logOperation.requestMethod')"/> 
 | 
              <el-table-column prop="requestParams" :label="$t('logOperation.requestParams')" width="150" 
 | 
                               :show-overflow-tooltip="true"/> 
 | 
              <el-table-column prop="requestTime" :label="$t('logOperation.requestTime')" sortable="custom" > 
 | 
                <template v-slot="{ row }"> 
 | 
                  {{ `${row.requestTime}ms` }} 
 | 
                </template> 
 | 
              </el-table-column> 
 | 
              <el-table-column prop="status" :label="$t('logOperation.status')" sortable="custom"> 
 | 
                <template v-slot="{ row }"> 
 | 
                  <el-tag v-if="row.status === 0" size="small" type="danger">{{ $t('logOperation.status0') }}</el-tag> 
 | 
                  <el-tag v-else size="small" type="success">{{ $t('logOperation.status1') }}</el-tag> 
 | 
                </template> 
 | 
              </el-table-column> 
 | 
              <el-table-column prop="ip" :label="$t('logOperation.ip')"/> 
 | 
              <el-table-column prop="userAgent" :label="$t('logOperation.userAgent')" width="150" 
 | 
                               :show-overflow-tooltip="true"/> 
 | 
              <el-table-column prop="createDate" :label="$t('logOperation.createDate')" sortable="custom" width="180"/> 
 | 
            </el-table> 
 | 
      </zt-table-wraper> 
 | 
    </div> 
 | 
  </div> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
  import Cookies from 'js-cookie' 
 | 
  import qs from 'qs' 
 | 
  
 | 
  export default { 
 | 
    data() { 
 | 
      return { 
 | 
        dataForm: { 
 | 
          status: '', 
 | 
          startCreateTime: '', 
 | 
          endCreateTime: '' 
 | 
        }, 
 | 
        dateVals: [], 
 | 
        selection: [], 
 | 
        generate: [], 
 | 
        Ids: '' 
 | 
      } 
 | 
    }, 
 | 
    mounted() { 
 | 
      // let data = { 
 | 
      //   startCreateTime: this.gmtStart ? this.gmtStart[0] : "", 
 | 
      //   endCreateTime: this.gmtStart ? this.gmtStart[1] : "", 
 | 
      //   ...this.dataForm 
 | 
      // }; 
 | 
      // delete data.gmtStart; 
 | 
      // this.dataForm = data 
 | 
      // this.defaultDate() 
 | 
    }, 
 | 
    methods: { 
 | 
      // 列表多选 
 | 
    handleSelectionChange(selection) { 
 | 
      this.selection = selection 
 | 
      var arr = selection.map(v => v.id) 
 | 
      this.Ids = arr.join(",") 
 | 
      this.generate = selection 
 | 
    }, 
 | 
      async deleteHandle() { 
 | 
        if (await this.$tip.confirm("是否删除所有【满足条件】的操作日志数据" )){ 
 | 
           var Ids = this.selection.map(v => v.id); 
 | 
           var ids = { 
 | 
             Ids: Ids.join(",") 
 | 
           }; 
 | 
           let params = qs.stringify({ 
 | 
             'token': Cookies.get('token'), 
 | 
             'status': this.dataForm.status, 
 | 
             'startCreateTime': this.dataForm.startCreateTime, 
 | 
             'endCreateTime': this.dataForm.endCreateTime 
 | 
           }) 
 | 
           let apiURL = `/sys/log/operation/delete` 
 | 
           // window.location.href = `${window.SITE_CONFIG['apiURL']}${apiURL}?${params}` 
 | 
           let res = await this.$http.get(`/sys/log/operation/delete?${params}`) 
 | 
           console.log(res) 
 | 
           if (res.success) { 
 | 
             await this.$tip.success() 
 | 
             this.$refs.tableObj.query() 
 | 
           } 
 | 
         } 
 | 
      }, 
 | 
      exportHandle() { 
 | 
        this.$confirm('是否导出所有的操作日志数据', '提示', { 
 | 
          confirmButtonText: '确定', 
 | 
          cancelButtonText: '取消', 
 | 
          type: 'warning' 
 | 
        }).then(() => { 
 | 
          let params = qs.stringify({ 
 | 
            'token': Cookies.get('token'), 
 | 
            'status': this.dataForm.status, 
 | 
            'startCreateTime': this.dataForm.startCreateTime, 
 | 
            'endCreateTime': this.dataForm.endCreateTime 
 | 
          }) 
 | 
          let apiURL = `/sys/log/operation/export` 
 | 
          window.location.href = `${window.SITE_CONFIG['apiURL']}${apiURL}?${params}` 
 | 
          // this.exportExcel(apiURL,params) 
 | 
        }).then(() => { 
 | 
          this.$message({ 
 | 
            message: '导出成功', 
 | 
            type: 'success' 
 | 
          }) 
 | 
        }) 
 | 
      }, 
 | 
      // defaultDate() { 
 | 
      //   // 获取新的时间(2019.4.12) 
 | 
      //   let date = new Date() 
 | 
      //   // 字符串拼接,开始时间,结束时间 
 | 
      //   let end = date.getFullYear().toString() + '-' + (date.getMonth() + 1).toString() + '-' + date.getDate().toString() 
 | 
      //   date.setMonth(date.getMonth() - 1) 
 | 
      //   let beg = date.getFullYear().toString() + '-' + (date.getMonth() + 1).toString() + '-' + date.getDate().toString() 
 | 
      //   this.dataForm.startCreateTime = beg 
 | 
      //   this.dataForm.endCreateTime = end 
 | 
      //   this.dateVals = [beg, end] // 将值设置给插件绑定的数据 
 | 
      // }, 
 | 
      pickerChange() { 
 | 
        if (this.dateVals !== null){ 
 | 
          this.dataForm.startCreateTime = this.dateVals[0] 
 | 
          this.dataForm.endCreateTime = this.dateVals[1] 
 | 
        }else { 
 | 
          this.dataForm.startCreateTime = '' 
 | 
          this.dataForm.endCreateTime = '' 
 | 
        } 
 | 
      }, 
 | 
      // exportExcel (apiURL, params = {}) { 
 | 
      //   return new Promise((resolve, reject) => { 
 | 
      //     console.log(`${apiURL} 请求数据,参数=>`, JSON.stringify(params)) 
 | 
      //     axios.defaults.headers['content-type'] = 'application/json;charset=UTF-8' 
 | 
      //     this.$http({ 
 | 
      //       method: 'get', 
 | 
      //       url: apiURL, // 请求地址 
 | 
      //       data: params, // 参数 
 | 
      //       responseType: 'blob' // 表明返回服务器返回的数据类型 
 | 
      //     }).then( 
 | 
      //       response => { 
 | 
      //         resolve(response.data) 
 | 
      //         let blob = new Blob([response.data], { 
 | 
      //           type: 'application/vnd.ms-excel' 
 | 
      //         }) 
 | 
      //         console.log(blob) 
 | 
      //         let fileName = Date.parse(new Date()) + '.xlsx' 
 | 
      //         if (window.navigator.msSaveOrOpenBlob) { 
 | 
      //           // console.log(2) 
 | 
      //           navigator.msSaveBlob(blob, fileName) 
 | 
      //         } else { 
 | 
      //           // console.log(3) 
 | 
      //           var link = document.createElement('a') 
 | 
      //           link.href = window.URL.createObjectURL(blob) 
 | 
      //           link.download = fileName 
 | 
      //           link.click() 
 | 
      //           //释放内存 
 | 
      //           window.URL.revokeObjectURL(link.href) 
 | 
      //         } 
 | 
      //       }, 
 | 
      //       err => { 
 | 
      //         reject(err) 
 | 
      //       } 
 | 
      //     ) 
 | 
      //   }) 
 | 
      // } 
 | 
    } 
 | 
  } 
 | 
</script> 
 |