feat(system): 优化系统日志页面布局和功能

- 修改系统日志页面的列配置，增加固定列和对齐方式
- 优化表格组件的样式和功能，支持右列固定和自定义样式
- 调整分页配置，统一表格相关属性

web/src/views/system/alarmLog.vue

@@ -1,9 +1,6 @@
 <template>
   <div class="alarmLog">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @operateForm="operateForm"
-    ></searchBox>
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>
 
     <div class="content-table">
       <ComTable
@@ -11,17 +8,17 @@
         :table-data="tableData"
         @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
-        :table-option="tableOption"
         :page-option="pageOption"
-        :table-h="tableH"
       >
         <template #type="record">
-          <span>{{ ['其它','系统日志','操作日志','设备日志'][record.type] }}</span>
+          <span>{{ ['其它', '系统日志', '操作日志', '设备日志'][record.type] }}</span>
         </template>
         <template #status="record">
-          <span><a-tag :color="record.status ? 'red' : 'green'">{{
-                record.status ? '异常' : '正常'
-              }}</a-tag></span>
+          <span
+            ><a-tag :color="record.status ? 'red' : 'green'">{{
+              record.status ? '异常' : '正常'
+            }}</a-tag></span
+          >
         </template>
 
         <template #action="record">
@@ -29,7 +26,7 @@
         </template>
       </ComTable>
     </div>
-  <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
       <!-- action:edit add -->
       <EditCom
         :record="formState"
@@ -47,11 +44,11 @@ import { getReq, postReq } from '@/request/api.js'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 export default {
   name: '',
   components: {
-    EditCom,
+    EditCom
   },
   props: {},
   data() {
@@ -64,7 +61,8 @@ export default {
         page: 1
       },
       btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      tableData: []
     }
   },
   computed: {},
@@ -80,7 +78,7 @@ export default {
   },
 
   mounted() {
-    this.operateList = this.$getBtns(['查看',  '删除'])
+    this.operateList = this.$getBtns(['查看'])
     // this.btnOptionList = this.$getBtns(['新增'])
     this.getList()
   },
@@ -119,22 +117,21 @@ export default {
     },
     async operateForm(type, record = {}) {
       this.formStatus = type
-    
-      if(type=='edit'||type=='read'){ 
+
+      if (type == 'edit' || type == 'read') {
         await this.getRuleFormInfo(record)
 
         this.formModal = true
         this.formState = record
-      }else if(type=='del'){
-        this.handleDelete([record.device_id],this.getList)
-      }else if(type=='back'){
+      } else if (type == 'del') {
+        this.handleDelete([record.device_id], this.getList)
+      } else if (type == 'back') {
         this.formModal = false
         this.getList()
       }
-      
     },
     //  删除操作
-    async handleDelete(id,callback) {
+    async handleDelete(id, callback) {
       const that = this
       Modal.confirm({
         title: '你确认删除数据吗?',
@@ -142,10 +139,10 @@ export default {
 
         async onOk() {
           try {
-            const res = await getReq('/deleteUser',{user_id:id})
+            const res = await getReq('/deleteUser', { user_id: id })
             if (res.errcode === 0) {
               this.$message.success(res.errmsg)
-              this.pageOption.page=1
+              this.pageOption.page = 1
               callback()
             } else {
               throw res
@@ -161,8 +158,6 @@ export default {
       })
     },
     async getRuleFormInfo(record) {
-      
-
       const row = record || {}
 
       for (let e of alarmlogOptions) {
@@ -183,8 +178,6 @@ export default {
           //   const attrs=JSON.parse(row.attrs||"{}")
           //   e.ruleForm[i.key] = attrs[i.key]
           // }
-          
-
         }
       }
     },
@@ -202,7 +195,7 @@ export default {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/device.vue

@@ -48,7 +48,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 import {deviceTypeList} from '@/utils/config'
 export default { 
@@ -170,7 +170,7 @@ export default {
     //  删除操作
     async handleDelete(id,callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),
 
@@ -234,7 +234,7 @@ export default {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/log.vue

@@ -1,9 +1,6 @@
 <template>
-  <div class="alarmlog">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @operateForm="operateForm"
-    ></searchBox>
+  <div class="syslog">
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>
 
     <div class="content-table">
       <ComTable
@@ -11,13 +8,14 @@
         :table-data="tableData"
         @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
-        :table-option="tableOption"
         :page-option="pageOption"
-        :table-h="tableH"
       >
-        <template #gender="record">
-          <!-- 0:女; 1:男 -->
-          <span>{{ ['女', '男'][record.gender] }}</span>
+        <template #status="record">
+          <span>
+            <a-tag :color="record.status ? 'red' : 'green'">{{
+              record.status ? '异常' : '正常'
+            }}</a-tag>
+            </span>
         </template>
 
         <template #action="record">
@@ -38,7 +36,7 @@
 </template>
 
 <script>
-import { columnList, userOptions } from '../../../public/config/columnList'
+import { columnList, syslogOptions } from '../../../public/config/columnList'
 import { getReq, postReq } from '@/request/api.js'
 
 import EditCom from '@/components/EditCom.vue'
@@ -61,13 +59,14 @@ export default {
         page: 1
       },
       btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      tableData: []
     }
   },
   computed: {},
   created() {
     let info = []
-    let col = columnList.find((i) => i.page == 'alarmlog').columns
+    let col = columnList.find((i) => i.page == 'syslog').columns
     if (col.length) {
       col.forEach((item) => {
         info.push(this.$setWidth(item))
@@ -77,8 +76,8 @@ export default {
   },
 
   mounted() {
-    this.operateList = this.$getBtns(['查看', '修改', '删除'])
-    this.btnOptionList = this.$getBtns(['新增'])
+    this.operateList = this.$getBtns(['查看'])
+    // this.btnOptionList = this.$getBtns(['新增'])
     this.getList()
   },
 
@@ -95,7 +94,7 @@ export default {
       }
 
       try {
-        const res = await getReq('/queryUserList', params)
+        const res = await getReq('/querySystemLogList', params)
         if (res.errcode === 0) {
           this.$refs.comTable.loading = false
 
@@ -114,41 +113,25 @@ export default {
         //统一处理报错提示
       }
     },
-    operateForm(type, record = {}) {
-      console.log(record, record.id, 'rrrrrrrrrr')
+    async operateForm(type, record = {}) {
       this.formStatus = type
-      switch (type) {
-      case 'add':
-        this.formModal = true
-        this.formState = {}
-        this.getRuleFormInfo()
 
-        break
-      case 'edit':
-      case 'read':
+      if (type == 'edit' || type == 'read') {
+        await this.getRuleFormInfo(record)
+
         this.formModal = true
         this.formState = record
-        this.getRuleFormInfo(record)
-        break
-
-      case 'del':
-        this.handleDelete([record.user_id], this.getList)
-
-        break
-
-      case 'back':
+      } else if (type == 'del') {
+        this.handleDelete([record.device_id], this.getList)
+      } else if (type == 'back') {
         this.formModal = false
         this.getList()
-        break
-
-      default:
-        break
       }
     },
     //  删除操作
     async handleDelete(id, callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),
 
@@ -173,27 +156,13 @@ export default {
       })
     },
     async getRuleFormInfo(record) {
-      function getInfo(data, url) {
-        return new Promise((reslove, reject) => {
-          getReq(data, url).then((res) => {
-            reslove(res.data)
-          })
-        })
-      }
+      const row = record || {}
 
-      let row = {}
-      if (record && record.user_id) {
-        // row = await getInfo({ id: record.id },'/queryUserList')
-        this.record = record
-        row = record
-        // this.type='edit'
+      for (let e of syslogOptions) {
+        for (let i of e.list) {
+          e.ruleForm[i.key] = row[i.key] || ''
+        }
       }
-      userOptions.forEach((e, index) => {
-        e.list.forEach((i) => {
-          e.ruleForm[i.key] = row ? row[i.key] : ''
-          e.ruleForm.id = row.id
-        })
-      })
     },
     handlePagesizeChange(pageOption) {
       this.pageOption.pageSize = pageOption.pageSize
@@ -205,11 +174,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.user {
+.syslog {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/permission.vue

@@ -49,7 +49,7 @@ import { getReq, postReq } from '@/request/api.js'
 
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 export default {
   name: '',
   components: {

web/src/views/system/policy.vue

@@ -234,7 +234,7 @@ export default {
 
 <style lang="scss" scoped>
 .policy {
-  width: 100%;
+  // width: 100%;
   height: 100%;
   padding: 0 15px;
   .content-table {

web/src/views/system/role.vue

@@ -52,7 +52,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/service.vue

@@ -45,7 +45,7 @@ import { getReq, postReq } from '@/request/api.js'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/station.vue

@@ -52,7 +52,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/user.vue

@@ -42,20 +42,13 @@
 <script>
 import { columnList, userOptions } from '../../../public/config/columnList'
 import { getReq, postReq } from '@/request/api.js'
-import ComTable from '@/components/ComTable'
-import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
-import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',
   components: {
-    searchBox,
     EditCom,
-    ComTable,
-    OperateCom
   },
   props: {},
   data() {
@@ -155,7 +148,7 @@ export default {
     //  删除操作
     async handleDelete(id,callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),