From f80e0de9f67505c7acf706e42a9bf36da971ba2b Mon Sep 17 00:00:00 2001
From: zer0Black <lxtalx@gmail.com>
Date: Sun, 25 Jun 2023 14:18:32 +0800
Subject: [PATCH] =?UTF-8?q?=E6=93=8D=E4=BD=9C=E6=97=A5=E5=BF=97=E5=88=86?=
 =?UTF-8?q?=E4=B8=BA=E4=B8=A4=E4=B8=AA=E6=96=87=E4=BB=B6=EF=BC=9A=E7=99=BB?=
 =?UTF-8?q?=E5=BD=95=E6=97=A5=E5=BF=97=E5=92=8C=E6=93=8D=E4=BD=9C=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jero-web/src/views/system/LogList.vue         | 217 +-----------------
 .../src/views/system/log/LoginLogList.vue     | 175 ++++++++++++++
 .../src/views/system/log/OperatorLogList.vue  | 196 ++++++++++++++++
 3 files changed, 383 insertions(+), 205 deletions(-)
 create mode 100644 jero-web/src/views/system/log/LoginLogList.vue
 create mode 100644 jero-web/src/views/system/log/OperatorLogList.vue

diff --git a/jero-web/src/views/system/LogList.vue b/jero-web/src/views/system/LogList.vue
index 410dfc62..49e99743 100644
--- a/jero-web/src/views/system/LogList.vue
+++ b/jero-web/src/views/system/LogList.vue
@@ -2,227 +2,34 @@
   <a-card :bordered="false">
     <!--导航区域-->
     <div>
-      <a-tabs defaultActiveKey="1" @change="callback">
-        <a-tab-pane tab="登录日志" key="1"></a-tab-pane>
-        <a-tab-pane tab="操作日志" key="2"></a-tab-pane>
+      <a-tabs defaultActiveKey="1">
+        <a-tab-pane tab="登录日志" key="1">
+          <login-log-list></login-log-list>
+        </a-tab-pane>
+        <a-tab-pane tab="操作日志" key="2">
+          <operator-log-list></operator-log-list>
+        </a-tab-pane>
       </a-tabs>
     </div>
-
-    <!-- 查询区域 -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row :gutter="24">
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="搜索日志">
-              <a-input placeholder="请输入搜索关键词" v-model="queryParam.keyWord"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="10">
-            <a-form-item label="创建时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-range-picker
-                style="width: 210px"
-                v-model="queryParam.createTimeRange"
-                format="YYYY-MM-DD"
-                :placeholder="['开始时间', '结束时间']"
-                @change="onDateChange"
-                @ok="onDateOk"
-              />
-            </a-form-item>
-          </a-col>
-          <a-col :md="5" :sm="8" v-if="tabKey === '2'">
-            <a-form-item label="操作类型" style="left: 10px">
-              <j-dict-select-tag v-model="queryParam.operateType" placeholder="请选择操作类型" dictCode="operate_type"/>
-            </a-form-item>
-          </a-col>
-
-          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-            <a-col :md="6" :sm="24" >
-                <a-button type="primary"  style="left: 10px" @click="searchQuery" icon="search">查询</a-button>
-                <a-button type="primary"  @click="searchReset" icon="reload" style="margin-left: 8px;left: 10px">重置</a-button>
-            </a-col>
-          </span>
-
-        </a-row>
-      </a-form>
-    </div>
-
-    <!-- table区域-begin -->
-    <a-table
-      ref="table"
-      size="middle"
-      rowKey="id"
-      :columns="columns"
-      :dataSource="dataSource"
-      :pagination="ipagination"
-      :loading="loading"
-      @change="handleTableChange">
-
-      <div v-show="queryParam.logType === '2'" slot="expandedRowRender" slot-scope="record" style="margin: 0">
-        <div style="margin-bottom: 5px"><a-badge status="success" style="vertical-align: middle;"/><span style="vertical-align: middle;">请求方法:{{ record.method }}</span></div>
-        <div><a-badge status="processing" style="vertical-align: middle;"/><span style="vertical-align: middle;">请求参数:{{ record.requestParam }}</span></div>
-      </div>
-      <!-- 字符串超长截取省略号显示-->
-      <span slot="logContent" slot-scope="text">
-          <j-ellipsis :value="text" :length="40"/>
-        </span>
-    </a-table>
-    <!-- table区域-end -->
   </a-card>
 </template>
 
 <script>
-import { filterObj } from '@/utils/util'
-import { JeroListMixin } from '@/mixins/JeroListMixin'
-import JEllipsis from '@/components/jero/JEllipsis'
+import LoginLogList from './log/LoginLogList'
+import OperatorLogList from './log/OperatorLogList'
 
 export default {
   name: 'LogList',
-  mixins: [JeroListMixin],
   components: {
-    JEllipsis
+    LoginLogList,
+    OperatorLogList
   },
   data () {
     return {
-      description: '这是日志管理页面',
-      // 查询条件
-      queryParam: {
-        ipInfo: '',
-        createTimeRange: [],
-        logType: '1',
-        keyWord: ''
-      },
-      tabKey: '1',
-      // 表头
-      columns: [
-        {
-          title: '#',
-          dataIndex: '',
-          key: 'rowIndex',
-          align: 'center',
-          customRender: function (t, r, index) {
-            return parseInt(index) + 1
-          }
-        },
-        {
-          title: '日志内容',
-          align: 'left',
-          dataIndex: 'logContent',
-          scopedSlots: { customRender: 'logContent' },
-          sorter: true
-        },
-        {
-          title: '操作人ID',
-          dataIndex: 'userid',
-          align: 'center',
-          sorter: true
-        },
-        {
-          title: '操作人名称',
-          dataIndex: 'username',
-          align: 'center',
-          sorter: true
-        },
-        {
-          title: 'IP',
-          dataIndex: 'ip',
-          align: 'center',
-          sorter: true
-        },
-        {
-          title: '耗时(毫秒)',
-          dataIndex: 'costTime',
-          align: 'center',
-          sorter: true
-        },
-        {
-          title: '日志类型',
-          dataIndex: 'logType_dictText',
-          /* customRender:function (text) {
-              if(text==1){
-                return "登录日志";
-              }else if(text==2){
-                return "操作日志";
-              }else{
-                return text;
-              }
-            }, */
-          align: 'center'
-        },
-        {
-          title: '创建时间',
-          dataIndex: 'createTime',
-          align: 'center',
-          sorter: true
-        }
-      ],
-      operateColumn:
-        {
-          title: '操作类型',
-          dataIndex: 'operateType_dictText',
-          align: 'center'
-        },
-      labelCol: {
-        xs: { span: 1 },
-        sm: { span: 2 }
-      },
-      wrapperCol: {
-        xs: { span: 10 },
-        sm: { span: 16 }
-      },
-      url: {
-        list: '/sys/log/page'
-      }
+
     }
   },
   methods: {
-    getQueryParams () {
-      const param = Object.assign({}, this.queryParam, this.isorter)
-      param.field = this.getQueryField()
-      param.pageNo = this.ipagination.current
-      param.pageSize = this.ipagination.pageSize
-      delete param.createTimeRange // 时间参数不传递后台
-      if (this.superQueryParams) {
-        param.superQueryParams = encodeURI(this.superQueryParams)
-        param.superQueryMatchType = this.superQueryMatchType
-      }
-      return filterObj(param)
-    },
-
-    // 重置
-    searchReset () {
-      const that = this
-      const logType = that.queryParam.logType
-      that.queryParam = {} // 清空查询区域参数
-      that.queryParam.logType = logType
-      that.loadData(this.ipagination.current)
-    },
-    // 日志类型
-    callback (key) {
-      // 动态添加操作类型列
-      if ((key + '') === '2') {
-        this.tabKey = '2'
-        this.columns.splice(7, 0, this.operateColumn)
-      } else if (this.columns.length === 9) {
-        this.tabKey = '1'
-        this.columns.splice(7, 1)
-      }
-
-      const that = this
-
-      that.queryParam = {} // 清空查询区域参数
-      that.queryParam.logType = key
-      that.loadData()
-    },
-    onDateChange: function (value, dateString) {
-      console.log(dateString[0], dateString[1])
-      this.queryParam.createTime_begin = dateString[0]
-      this.queryParam.createTime_end = dateString[1]
-    },
-    onDateOk (value) {
-      console.log(value)
-    }
   }
 }
 </script>
diff --git a/jero-web/src/views/system/log/LoginLogList.vue b/jero-web/src/views/system/log/LoginLogList.vue
new file mode 100644
index 00000000..f39b6c53
--- /dev/null
+++ b/jero-web/src/views/system/log/LoginLogList.vue
@@ -0,0 +1,175 @@
+<template>
+  <a-card :bordered="false">
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+
+          <a-col :md="6" :sm="8">
+            <a-form-item label="搜索日志">
+              <a-input placeholder="请输入搜索关键词" v-model="queryParam.keyWord"></a-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :md="6" :sm="10">
+            <a-form-item label="创建时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-range-picker
+                style="width: 210px"
+                v-model="queryParam.createTimeRange"
+                format="YYYY-MM-DD"
+                :placeholder="['开始时间', '结束时间']"
+                @change="onDateChange"
+                @ok="onDateOk"
+              />
+            </a-form-item>
+          </a-col>
+
+          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-col :md="6" :sm="24" >
+                <a-button type="primary"  style="left: 10px" @click="searchQuery" icon="search">查询</a-button>
+                <a-button type="primary"  @click="searchReset" icon="reload" style="margin-left: 8px;left: 10px">重置</a-button>
+            </a-col>
+          </span>
+
+        </a-row>
+      </a-form>
+    </div>
+
+    <!-- table区域-begin -->
+    <a-table
+      ref="table"
+      size="middle"
+      rowKey="id"
+      :columns="columns"
+      :dataSource="dataSource"
+      :pagination="ipagination"
+      :loading="loading"
+      @change="handleTableChange">
+
+      <!-- 字符串超长截取省略号显示-->
+      <span slot="logContent" slot-scope="text">
+          <j-ellipsis :value="text" :length="40"/>
+        </span>
+    </a-table>
+    <!-- table区域-end -->
+  </a-card>
+</template>
+
+<script>
+import { filterObj } from '@/utils/util'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import JEllipsis from '@/components/jero/JEllipsis'
+
+export default {
+  name: 'LoginLogList',
+  mixins: [JeroListMixin],
+  components: {
+    JEllipsis
+  },
+  data () {
+    return {
+      description: '这是日志管理页面',
+      // 查询条件
+      queryParam: {
+        ipInfo: '',
+        createTimeRange: [],
+        logType: '1',
+        keyWord: ''
+      },
+      // 表头
+      columns: [
+        {
+          title: '#',
+          dataIndex: '',
+          key: 'rowIndex',
+          align: 'center',
+          customRender: function (t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '日志内容',
+          align: 'left',
+          dataIndex: 'logContent',
+          scopedSlots: { customRender: 'logContent' },
+          sorter: true
+        },
+        {
+          title: '操作人ID',
+          dataIndex: 'userid',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: '操作人名称',
+          dataIndex: 'username',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: 'IP',
+          dataIndex: 'ip',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: '日志类型',
+          dataIndex: 'logType_dictText',
+          align: 'center'
+        },
+        {
+          title: '创建时间',
+          dataIndex: 'createTime',
+          align: 'center',
+          sorter: true
+        }
+      ],
+      labelCol: {
+        xs: { span: 1 },
+        sm: { span: 2 }
+      },
+      wrapperCol: {
+        xs: { span: 10 },
+        sm: { span: 16 }
+      },
+      url: {
+        list: '/sys/log/page'
+      }
+    }
+  },
+  methods: {
+    getQueryParams () {
+      const param = Object.assign({}, this.queryParam, this.isorter)
+      param.field = this.getQueryField()
+      param.pageNo = this.ipagination.current
+      param.pageSize = this.ipagination.pageSize
+      delete param.createTimeRange // 时间参数不传递后台
+      if (this.superQueryParams) {
+        param.superQueryParams = encodeURI(this.superQueryParams)
+        param.superQueryMatchType = this.superQueryMatchType
+      }
+      return filterObj(param)
+    },
+
+    // 重置
+    searchReset () {
+      const that = this
+      const logType = that.queryParam.logType
+      that.queryParam = {} // 清空查询区域参数
+      that.queryParam.logType = logType
+      that.loadData(this.ipagination.current)
+    },
+    onDateChange: function (value, dateString) {
+      console.log(dateString[0], dateString[1])
+      this.queryParam.createTime_begin = dateString[0]
+      this.queryParam.createTime_end = dateString[1]
+    },
+    onDateOk (value) {
+      console.log(value)
+    }
+  }
+}
+</script>
+<style scoped>
+  @import '~@assets/less/common.less';
+</style>
diff --git a/jero-web/src/views/system/log/OperatorLogList.vue b/jero-web/src/views/system/log/OperatorLogList.vue
new file mode 100644
index 00000000..968a1523
--- /dev/null
+++ b/jero-web/src/views/system/log/OperatorLogList.vue
@@ -0,0 +1,196 @@
+<template>
+  <a-card :bordered="false">
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+
+          <a-col :md="6" :sm="8">
+            <a-form-item label="搜索日志">
+              <a-input placeholder="请输入搜索关键词" v-model="queryParam.keyWord"></a-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :md="6" :sm="10">
+            <a-form-item label="创建时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-range-picker
+                style="width: 210px"
+                v-model="queryParam.createTimeRange"
+                format="YYYY-MM-DD"
+                :placeholder="['开始时间', '结束时间']"
+                @change="onDateChange"
+                @ok="onDateOk"
+              />
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="8">
+            <a-form-item label="操作类型" style="left: 10px">
+              <j-dict-select-tag v-model="queryParam.operateType" placeholder="请选择操作类型" dictCode="operate_type"/>
+            </a-form-item>
+          </a-col>
+
+          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-col :md="6" :sm="24" >
+                <a-button type="primary"  style="left: 10px" @click="searchQuery" icon="search">查询</a-button>
+                <a-button type="primary"  @click="searchReset" icon="reload" style="margin-left: 8px;left: 10px">重置</a-button>
+            </a-col>
+          </span>
+
+        </a-row>
+      </a-form>
+    </div>
+
+    <!-- table区域-begin -->
+    <a-table
+      ref="table"
+      size="middle"
+      rowKey="id"
+      :columns="columns"
+      :dataSource="dataSource"
+      :pagination="ipagination"
+      :loading="loading"
+      @change="handleTableChange">
+
+      <div slot="expandedRowRender" slot-scope="record" style="margin: 0">
+        <div style="margin-bottom: 5px"><a-badge status="success" style="vertical-align: middle;"/><span style="vertical-align: middle;">请求方法:{{ record.method }}</span></div>
+        <div><a-badge status="processing" style="vertical-align: middle;"/><span style="vertical-align: middle;">请求参数:{{ record.requestParam }}</span></div>
+      </div>
+      <!-- 字符串超长截取省略号显示-->
+      <span slot="logContent" slot-scope="text">
+          <j-ellipsis :value="text" :length="40"/>
+        </span>
+    </a-table>
+    <!-- table区域-end -->
+  </a-card>
+</template>
+
+<script>
+import { filterObj } from '@/utils/util'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import JEllipsis from '@/components/jero/JEllipsis'
+
+export default {
+  name: 'OperatorLogList',
+  mixins: [JeroListMixin],
+  components: {
+    JEllipsis
+  },
+  data () {
+    return {
+      description: '这是日志管理页面',
+      // 查询条件
+      queryParam: {
+        ipInfo: '',
+        createTimeRange: [],
+        logType: '2',
+        keyWord: ''
+      },
+      // 表头
+      columns: [
+        {
+          title: '#',
+          dataIndex: '',
+          key: 'rowIndex',
+          align: 'center',
+          customRender: function (t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '日志内容',
+          align: 'left',
+          dataIndex: 'logContent',
+          scopedSlots: { customRender: 'logContent' },
+          sorter: true
+        },
+        {
+          title: '操作人ID',
+          dataIndex: 'userid',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: '操作人名称',
+          dataIndex: 'username',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: 'IP',
+          dataIndex: 'ip',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: '耗时(毫秒)',
+          dataIndex: 'costTime',
+          align: 'center',
+          sorter: true
+        },
+        {
+          title: '日志类型',
+          dataIndex: 'logType_dictText',
+          align: 'center'
+        },
+        {
+          title: '创建时间',
+          dataIndex: 'createTime',
+          align: 'center',
+          sorter: true
+        }
+      ],
+      operateColumn:
+        {
+          title: '操作类型',
+          dataIndex: 'operateType_dictText',
+          align: 'center'
+        },
+      labelCol: {
+        xs: { span: 1 },
+        sm: { span: 2 }
+      },
+      wrapperCol: {
+        xs: { span: 10 },
+        sm: { span: 16 }
+      },
+      url: {
+        list: '/sys/log/page'
+      }
+    }
+  },
+  methods: {
+    getQueryParams () {
+      const param = Object.assign({}, this.queryParam, this.isorter)
+      param.field = this.getQueryField()
+      param.pageNo = this.ipagination.current
+      param.pageSize = this.ipagination.pageSize
+      delete param.createTimeRange // 时间参数不传递后台
+      if (this.superQueryParams) {
+        param.superQueryParams = encodeURI(this.superQueryParams)
+        param.superQueryMatchType = this.superQueryMatchType
+      }
+      return filterObj(param)
+    },
+
+    // 重置
+    searchReset () {
+      const that = this
+      const logType = that.queryParam.logType
+      that.queryParam = {} // 清空查询区域参数
+      that.queryParam.logType = logType
+      that.loadData(this.ipagination.current)
+    },
+    onDateChange: function (value, dateString) {
+      console.log(dateString[0], dateString[1])
+      this.queryParam.createTime_begin = dateString[0]
+      this.queryParam.createTime_end = dateString[1]
+    },
+    onDateOk (value) {
+      console.log(value)
+    }
+  }
+}
+</script>
+<style scoped>
+  @import '~@assets/less/common.less';
+</style>