|
@@ -0,0 +1,149 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-form :model="queryParams" ref="queryForm" :inline="true">
|
|
|
+ <el-form-item label="操场类别" prop="operatorType">
|
|
|
+ <el-select v-model="queryParams.operatorType" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in queryParamsList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="操作状态" prop="status">
|
|
|
+ <el-select v-model="queryParams.status" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in statusList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="操作时间" prop="operTime">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="queryParams.data"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ type="datetimerange"
|
|
|
+ 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-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
+ <el-button icon="el-icon-download" size="mini" @click="downloadExcel">导出</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-table :data="listData">
|
|
|
+ <el-table-column prop="operId" label="日志编号" />
|
|
|
+ <el-table-column prop="operUserId" label="用户Id" />
|
|
|
+ <el-table-column prop="title" label="操作标题" />
|
|
|
+ <el-table-column prop="operIp" label="IP"/>
|
|
|
+ <el-table-column prop="status" label="操作状态">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag v-if="scope.row.status === 0" type="success">正常</el-tag>
|
|
|
+ <el-tag v-if="scope.row.status === 1" type="success">异常</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="operatorType" label="操作类别">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.operatorType === 0">其他</span>
|
|
|
+ <span v-if="scope.row.operatorType === 1">后台</span>
|
|
|
+ <span v-if="scope.row.operatorType === 2">app端</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="operName" label="操作人员"/>
|
|
|
+ <el-table-column prop="operTime" label="操作时间"/>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页 -->
|
|
|
+ <pagination v-show="total > 0" :total="total" :page.sync="queryParams.page" :limit.sync="queryParams.limit"
|
|
|
+ @pagination="getList" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {selectByPage,downloadExcel} from "@/api/log/operLog"
|
|
|
+import webUtil from "@/api/log/webUtil"
|
|
|
+export default {
|
|
|
+ name: "operate_log",
|
|
|
+ data(){
|
|
|
+ return{
|
|
|
+ // 遮罩层
|
|
|
+ loading: true,
|
|
|
+ // 表格树数据
|
|
|
+ listData: [],
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ data:[],
|
|
|
+ startTime: undefined,
|
|
|
+ endTime: undefined,
|
|
|
+ operatorType: undefined,
|
|
|
+ status: undefined,
|
|
|
+ },
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ statusList:[
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ label: '正常'
|
|
|
+ },{
|
|
|
+ value: 1,
|
|
|
+ label: '异常'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ queryParamsList:[
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ label: '其他'
|
|
|
+ },{
|
|
|
+ value: 1,
|
|
|
+ label: '后台'
|
|
|
+ },{
|
|
|
+ value: 2,
|
|
|
+ label: 'app端'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ downloadExcel() {
|
|
|
+ //单击下载
|
|
|
+ console.log('query data',this.queryBody)
|
|
|
+ let url='/oper/log/downloadExcel';
|
|
|
+ webUtil.downloadXls(url,this.queryParams,"操作日志");
|
|
|
+ },
|
|
|
+ getList(){
|
|
|
+ selectByPage(this.queryParams).then(resp =>{
|
|
|
+ this.listData = resp.data.records
|
|
|
+ this.total = resp.data.total;
|
|
|
+ this.loading = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleQuery(){
|
|
|
+ this.queryParams.startTime = this.queryParams.data[0]
|
|
|
+ this.queryParams.endTime = this.queryParams.data[1]
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ resetQuery(){
|
|
|
+ this.queryParams={
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ data:[],
|
|
|
+ startTime: undefined,
|
|
|
+ endTime: undefined,
|
|
|
+ operatorType: undefined,
|
|
|
+ status: undefined,
|
|
|
+ }
|
|
|
+ this.handleQuery()
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|