From 4a800a8fc83c6bd1f86a8e847b079a51a7532c09 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 20 七月 2022 15:05:58 +0800
Subject: [PATCH] 修复国标配置的bug

---
 src/pages/syslog/views/operationLog.vue |  264 ++++++++++++++++++++++++++--------------------------
 1 files changed, 130 insertions(+), 134 deletions(-)

diff --git a/src/pages/syslog/views/operationLog.vue b/src/pages/syslog/views/operationLog.vue
index f904cfb..639d73e 100644
--- a/src/pages/syslog/views/operationLog.vue
+++ b/src/pages/syslog/views/operationLog.vue
@@ -23,14 +23,15 @@
             v-model="fuzzySearch"
             size="small"
             class="input-with-select"
+            @keyup.enter.native="getOperationLog(1)"
           >
-            <span
-              class="icon iconfont"
-              @click="getOperationLog(1)"
-              slot="append"
-            >
+            <span class="icon iconfont icon_clear" @click="clearSearch" slot="append" v-if="fuzzySearch">
+              &#xe785;
+            </span>
+            <span class="icon iconfont icon_search" @click="getOperationLog(1)" slot="append">
               &#xe714;
             </span>
+
             <!-- <el-button
               slot="append"
               icon="el-icon-search"
@@ -43,20 +44,9 @@
         <div class="bar">
           <div class="name">鎿嶄綔妯″潡锛�</div>
 
-          <el-select
-            v-model="curModule"
-            placeholder="璇烽�夋嫨"
-            size="small"
-            @change="moduleChange"
-          >
+          <el-select v-model="curModule" placeholder="璇烽�夋嫨" size="small" @change="moduleChange" value-key="proc_name">
             <el-option label="鍏ㄩ儴" :value="''"> </el-option>
-            <el-option
-              v-for="item in moduleOptions"
-              :key="item.proc_name"
-              :label="item.proc_name"
-              :value="item.proc_name"
-            >
-            </el-option>
+            <el-option v-for="(item, i) in moduleOptions" :key="i" :label="item.name_zh" :value="item"> </el-option>
           </el-select>
         </div>
         <div class="bar">
@@ -69,30 +59,13 @@
             @change="getOperationLog(1)"
           >
             <!-- :disabled="gongnengOptions.length==0" -->
-            <el-option
-              v-for="item in gongnengOptions"
-              :key="item.name"
-              :label="item.name"
-              :value="item.name"
-            >
-            </el-option>
+            <el-option v-for="(item, i) in gongnengOptions" :key="i" :label="item.name" :value="item.name"> </el-option>
           </el-select>
         </div>
         <div class="bar">
           <div class="name">鎿嶄綔缁撴灉锛�</div>
-          <el-select
-            v-model="result"
-            placeholder="璇烽�夋嫨"
-            size="small"
-            @change="getOperationLog(1)"
-          >
-            <el-option
-              v-for="item in resultOptions"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
-            </el-option>
+          <el-select v-model="result" placeholder="璇烽�夋嫨" size="small" @change="getOperationLog(1)">
+            <el-option v-for="(item, i) in resultOptions" :key="i" :label="item.label" :value="item.value"> </el-option>
           </el-select>
         </div>
       </div>
@@ -105,9 +78,12 @@
         :data="tableData"
         :header-cell-style="{ background: '#f8f8f8', color: '#222222' }"
         style="width: 100%"
+        border
       >
-        <el-table-column :align="'center'" label="搴忓彿" type="index" width="50">
-        </el-table-column>
+        <template slot="empty">
+          <img :src="png" class="empty_img" alt="" />
+        </template>
+        <el-table-column :align="'center'" label="搴忓彿" type="index" width="50"> </el-table-column>
         <el-table-column
           :align="'center'"
           sortable
@@ -115,41 +91,12 @@
           prop="add_time"
           label="鎿嶄綔鏃堕棿"
         ></el-table-column>
-        <el-table-column
-          sortable
-          :align="'center'"
-          prop="userName"
-          label="鐢ㄦ埛鍚�"
-        ></el-table-column>
-        <el-table-column
-          :align="'center'"
-          sortable
-          prop="module"
-          label="鎿嶄綔妯″潡"
-        ></el-table-column>
-        <el-table-column
-          :align="'center'"
-          prop="function"
-          label="鎿嶄綔鍔熻兘"
-        ></el-table-column>
-        <el-table-column
-          :align="'center'"
-          sortable
-          prop="result"
-          label="鎿嶄綔缁撴灉"
-        ></el-table-column>
-        <el-table-column
-          :align="'center'"
-          prop="msg"
-          min-width="100px"
-          label="璇︾粏淇℃伅"
-        ></el-table-column>
-        <el-table-column
-          :align="'center'"
-          sortable
-          prop="ip"
-          label="IP"
-        ></el-table-column>
+        <el-table-column sortable :align="'center'" prop="userName" label="鐢ㄦ埛鍚�"></el-table-column>
+        <el-table-column :align="'center'" sortable prop="module" label="鎿嶄綔妯″潡"></el-table-column>
+        <el-table-column :align="'center'" prop="function" label="鎿嶄綔鍔熻兘"></el-table-column>
+        <el-table-column :align="'center'" sortable prop="result" label="鎿嶄綔缁撴灉"></el-table-column>
+        <el-table-column :align="'center'" prop="msg" min-width="100px" label="璇︾粏淇℃伅"></el-table-column>
+        <el-table-column :align="'center'" sortable prop="ip" label="IP"></el-table-column>
       </el-table>
     </div>
 
@@ -167,13 +114,15 @@
 </template>
 
 <script>
-import { deleteDate } from "@/api/system";
-import { pad0 } from "@/api/utils";
-import { queryOperationLog, getOperations, getModules } from "@/api/log";
+import { deleteDate } from "@/api/system"
+import { pad0 } from "@/api/utils"
+import { queryOperationLog, getOperations, getModules } from "@/api/log"
 
 export default {
+  name: "operationLog",
   data() {
     return {
+      png: require("../../../../public/images/syslog/娌℃暟鎹�.png"),
       loading: false,
       loadingText: "",
       input3: "",
@@ -184,16 +133,16 @@
       resultOptions: [
         {
           value: "",
-          label: "鍏ㄩ儴",
+          label: "鍏ㄩ儴"
         },
         {
           value: "鎴愬姛",
-          label: "鎴愬姛",
+          label: "鎴愬姛"
         },
         {
           value: "澶辫触",
-          label: "澶辫触",
-        },
+          label: "澶辫触"
+        }
       ],
       value: "",
       page: 1,
@@ -205,95 +154,106 @@
       timeStart: "",
       timeEnd: "",
       fuzzySearch: "",
-      total: 0,
-    };
+      total: 0
+    }
   },
   mounted() {
-    this.getTimeRange();
-    this.getOperationLog();
-    this.getOptions();
+    this.getTimeRange()
+    this.getOperationLog()
+    this.getOptions()
   },
   methods: {
     handleSizeChange(val) {
-      this.pageSize = val;
-      this.getOperationLog();
+      this.pageSize = val
+      this.getOperationLog()
     },
     handleCurrentChange(val) {
-      this.page = val;
-      this.getOperationLog();
+      this.page = val
+      this.getOperationLog()
     },
     moduleChange(val) {
-      this.getOperationLog(1);
-      this.gongneng = "";
+      this.getOperationLog(1)
+      this.gongneng = ""
       getOperations({
-        module: this.curModule,
+        module: val.proc_name
       }).then((res) => {
-        this.gongnengOptions = res.data;
-      });
+        this.gongnengOptions = res.data
+      })
     },
     getOptions() {
       getModules().then((res) => {
-        this.moduleOptions = res.data;
-      });
+        const indexArr = []
+        res.data.forEach((item, index) => {
+          if (item.proc_name == "") {
+            indexArr.push(index)
+          }
+        })
+        if (indexArr.length != 0) {
+          indexArr.forEach((i) => {
+            res.data.splice(i)
+          })
+        }
+        this.moduleOptions = res.data
+      })
     },
     choseRange(item, i) {
       switch (item) {
         case "浠婃棩":
-          this.getTimeRange();
-          break;
+          this.getTimeRange(24 * 60 * 60 * 1000)
+          break
         case "杩戜笁澶�":
-          this.getTimeRange(24 * 60 * 60 * 1000 * 3);
-          break;
+          this.getTimeRange(24 * 60 * 60 * 1000 * 3)
+          break
         case "杩戜竷澶�":
-          this.getTimeRange(24 * 60 * 60 * 1000 * 7);
-          break;
+          this.getTimeRange(24 * 60 * 60 * 1000 * 7)
+          break
         case "杩戜竴涓湀":
-          this.getTimeRange(24 * 60 * 60 * 1000 * 30);
-          break;
+          this.getTimeRange(24 * 60 * 60 * 1000 * 30)
+          break
         case "杩戝叚涓湀":
-          this.getTimeRange(24 * 60 * 60 * 1000 * 30 * 6);
-          break;
+          this.getTimeRange(24 * 60 * 60 * 1000 * 30 * 6)
+          break
         default:
-          break;
+          break
       }
-      this.getOperationLog(1);
-      this.activeDateChoise = i;
+      this.getOperationLog(1)
+      this.activeDateChoise = i
     },
     getOperationLog(typ) {
       if (typ == 1) {
-        this.page = 1;
+        this.page = 1
       }
       queryOperationLog({
         timeStart: this.timeStart,
         timeEnd: this.timeEnd,
         page: this.page,
         pageSize: this.pageSize,
-        module: this.curModule,
+        module: this.curModule.name_zh,
         function: this.gongneng,
         result: this.result,
-        fuzzySearch: this.fuzzySearch,
+        fuzzySearch: this.fuzzySearch
       }).then((res) => {
-        this.tableData = res.data.logs;
-        this.total = res.data.total;
-      });
+        this.tableData = res.data.logs
+        this.total = res.data.total
+      })
     },
     getTimeStr(date) {
-      var month = pad0(date.getMonth() + 1); //鏈�
-      var day = pad0(date.getDate()); //鏃�
-      var hour = pad0(date.getHours()); //鏃�
-      var minute = pad0(date.getMinutes()); //鍒�
-      var second = pad0(date.getSeconds()); //绉�
-      return `${date.getFullYear()}-${month}-${day} ${hour}:${minute}:${second}`;
+      var month = pad0(date.getMonth() + 1) //鏈�
+      var day = pad0(date.getDate()) //鏃�
+      return `${date.getFullYear()}-${month}-${day}`
     },
     getTimeRange(gap) {
-      var preDay;
-      preDay = gap
-        ? new Date(new Date().getTime() - gap)
-        : new Date(new Date().setHours(0, 0, 0, 0));
-      this.timeStart = this.getTimeStr(preDay);
+      var date = new Date()
+      var preDay = new Date(new Date().getTime() - gap + 24 * 60 * 60 * 1000)
+      this.timeStart = this.getTimeStr(preDay) + " 00:00:00"
+      this.timeEnd = this.getTimeStr(date) + " 23:59:59"
     },
-  },
-};
+    clearSearch() {
+      this.fuzzySearch = ""
+      this.getOperationLog(1)
+    }
+  }
+}
 </script>
 <style lang="scss">
 .op-log {
@@ -358,6 +318,10 @@
         display: flex;
         align-items: center;
 
+        .icon_clear:hover {
+          color: #4e94ff;
+        }
+
         .input-with-select {
           width: 100%;
           height: 100%;
@@ -368,13 +332,14 @@
             border: 2px solid #f2f2f7;
             border-right: none;
 
-            // &:focus + .el-input-group__append {
-            //   border-color: #409eff;
-            // }
+            &:focus,
+            &:focus + .el-input-group__append {
+              border-color: #409eff;
+            }
           }
 
           .el-input-group__append {
-            //    transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+            transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
             background-color: #fff;
             border: 2px solid #f2f2f7;
             border-radius: 0 18px 18px 0;
@@ -431,16 +396,47 @@
     border-radius: 5px;
     padding: 12px;
     background-color: white;
+    .empty_img {
+      margin: 80px auto;
+      width: 164px;
+    }
     .tableBox {
+      border: none;
+      &::before,
+      &::after {
+        display: none;
+      }
+      tr {
+        td:first-child {
+          border-radius: 4px 0 0 4px;
+        }
+        td:last-child {
+          border-radius: 0 4px 4px 0;
+        }
+        &.current-row td {
+          background-color: #4e94ff !important;
+          color: #fff;
+        }
+        &:hover td {
+          background-color: rgb(242, 242, 247);
+        }
+      }
       th {
         padding: 0 !important;
         height: 40px;
         line-height: 40px;
+        border-color: #fff !important;
+        border-right: 2px solid #fff;
+        border-radius: 4px;
+        font-size: 12px;
+        background: #f2f2f7;
       }
       td {
         padding: 0 !important;
         height: 34px;
         line-height: 34px;
+        border: none;
+        font-size: 12px;
       }
     }
   }

--
Gitblit v1.8.0