flx：日志新增变更前后字段

src/util/nowDate/index.js

@@ -1,70 +1,80 @@
 export default function getDate() {
-  // 获取当前日期
+    // 获取当前日期
-  let date = new Date();
+    let date = new Date();
 
-  // 获取当前月份
+    // 获取当前月份
-  let nowMonth = date.getMonth() + 1;
+    let nowMonth = date.getMonth() + 1;
 
-  // 获取当前是几号
+    // 获取当前是几号
-  let strDate = date.getDate();
+    let strDate = date.getDate();
 
-  // 添加分隔符“-”
+    // 添加分隔符“-”
-  let separator = "-";
+    let separator = "-";
 
-  // 对月份进行处理，1-9月在前面添加一个“0”
+    // 对月份进行处理，1-9月在前面添加一个“0”
-  if (nowMonth >= 1 && nowMonth <= 9) {
+    if (nowMonth >= 1 && nowMonth <= 9) {
-    nowMonth = "0" + nowMonth;
+        nowMonth = "0" + nowMonth;
-  }
+    }
 
-  // 对月份进行处理，1-9号在前面添加一个“0”
+    // 对月份进行处理，1-9号在前面添加一个“0”
-  if (strDate >= 0 && strDate <= 9) {
+    if (strDate >= 0 && strDate <= 9) {
-    strDate = "0" + strDate;
+        strDate = "0" + strDate;
-  }
+    }
 
-  // 最后拼接字符串，得到一个格式为(yyyy-MM-dd)的日期
+    // 最后拼接字符串，得到一个格式为(yyyy-MM-dd)的日期
-  // const nowDate = date.getFullYear() + separator + nowMonth + separator + strDate;
+    // const nowDate = date.getFullYear() + separator + nowMonth + separator + strDate;
-  const nowDate = date.getFullYear() + separator + nowMonth;
+    const nowDate = date.getFullYear() + separator + nowMonth;
-  // const theSecondDay = date.getFullYear() + separator + nowMonth + separator + (strDate + 1);
+    // const theSecondDay = date.getFullYear() + separator + nowMonth + separator + (strDate + 1);
-  // return { nowDate, theSecondDay }
+    // return { nowDate, theSecondDay }
-  return nowDate;
+    return nowDate;
 }
 
 export function getNowTime() {
-  let dateTime
+    let dateTime
-  let yy = new Date().getFullYear()
+    let yy = new Date().getFullYear()
-  let mm = new Date().getMonth() + 1
+    let mm = new Date().getMonth() + 1
-  let dd = new Date().getDate()
+    let dd = new Date().getDate()
-  let hh = new Date().getHours()
+    let hh = new Date().getHours()
-  let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
+    let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
-  let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
+    let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
-  dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
+    dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
-  return dateTime
+    return dateTime
 }
 
 // 格式化时间
 export function dateFormat(oDate, fmt) {
-  var o = {
+    var o = {
-      "M+": oDate.getMonth() + 1, //月份
+        "M+": oDate.getMonth() + 1, //月份
-      "d+": oDate.getDate(), //日
+        "d+": oDate.getDate(), //日
-      "h+": oDate.getHours(), //小时
+        "h+": oDate.getHours(), //小时
-      "m+": oDate.getMinutes(), //分
+        "m+": oDate.getMinutes(), //分
-      "s+": oDate.getSeconds(), //秒
+        "s+": oDate.getSeconds(), //秒
-      "q+": Math.floor((oDate.getMonth() + 3) / 3), //季度
+        "q+": Math.floor((oDate.getMonth() + 3) / 3), //季度
-      "S": oDate.getMilliseconds()//毫秒
+        "S": oDate.getMilliseconds() //毫秒
-  };
+    };
-  if (/(y+)/.test(fmt)) {
+    if (/(y+)/.test(fmt)) {
-      fmt = fmt.replace(RegExp.$1, (oDate.getFullYear() + "").substr(4 - RegExp.$1.length));
+        fmt = fmt.replace(RegExp.$1, (oDate.getFullYear() + "").substr(4 - RegExp.$1.length));
-  }
+    }
-  for (var k in o) {
+    for (var k in o) {
-      if (new RegExp("(" + k + ")").test(fmt)) {
+        if (new RegExp("(" + k + ")").test(fmt)) {
-          fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
-      }
+        }
-  }
+    }
-  return fmt;
+    return fmt;
 }
 
 // 根据下标返回英文字母(用作试题答案)
 export function filterAnswer(index) {
-  const englishUppercaseWord = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split('')
+    const englishUppercaseWord = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split('')
-  return englishUppercaseWord[index];
+    return englishUppercaseWord[index];
 }
+
+// 用来判断数据是否为json格式
+export function isJSON(str) {
+    try {
+        JSON.parse(str);
+    } catch (e) {
+        return false;
+    }
+    return true;
+}

src/views/companyAdmin/operationLog.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="fullHeight">
-    <div class="searchBox whiteBlock">
+    <div class="searchBox whiteBlock" v-if="dialogFormVisible">
       <el-form
         :inline="true"
         size="medium"
@@ -46,7 +46,7 @@
         </el-form-item>
       </el-form>
     </div>
-    <div class="table_wrap whiteBlock">
+    <div class="table_wrap whiteBlock" v-if="dialogFormVisible">
       <el-table class="tables" style="height: calc(100% - 80px);" :data="tableData">
         <el-table-column
           type="index"
@@ -94,6 +94,19 @@
           label="操作员姓名"
           align="center"
         ></el-table-column>
+        <el-table-column label="操作" align="center">
+          <template slot-scope="scope">
+            <div class="tableBtns">
+              <div class="operationText last" @click="deilBtn(scope.row)">
+                <i
+                  class="el-icon-tickets"
+                  style="color: #8dacfa; font-size: 16px; margin-right: 2px"
+                ></i>
+                <span>查看详情</span>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
       </el-table>
       <el-pagination
         style="margin-top: 40px;"
@@ -108,6 +121,39 @@
         background
       ></el-pagination>
     </div>
+    <div class="whiteBlock" style="height: 100%" v-else>
+      <el-page-header
+        @back="goBack"
+        :content="dialogTitle"
+        class="backText"
+      ></el-page-header>
+      <el-form class="form-box">
+        <el-form-item label="操作时间：" :label-width="formLabelWidthDetail">
+          {{ detailRow.operCreateTime }}
+        </el-form-item>
+        <el-form-item label="操作描述：" :label-width="formLabelWidthDetail">
+          {{ detailRow.operDesc }}
+        </el-form-item>
+        <el-form-item label="功能模块：" :label-width="formLabelWidthDetail">
+          {{ detailRow.operModul }}
+        </el-form-item>
+        <el-form-item label="操作IP：" :label-width="formLabelWidthDetail">
+          {{ detailRow.operIp }}
+        </el-form-item>
+        <el-form-item label="请求URL：" :label-width="formLabelWidthDetail">
+          {{ detailRow.operUri }}
+        </el-form-item>
+        <el-form-item label="操作员姓名：" :label-width="formLabelWidthDetail">
+          {{ detailRow.realName }}
+        </el-form-item>
+        <el-form-item label="数据变更前：" :label-width="formLabelWidthDetail">
+          {{ detailRow.dataChangeBefore }}
+        </el-form-item>
+        <el-form-item label="数据变更后：" :label-width="formLabelWidthDetail">
+          {{ detailRow.dataChangeAfter }}
+        </el-form-item>
+      </el-form>
+    </div>
   </div>
 </template>
 <script>
@@ -126,6 +172,10 @@ export default {
       pageNo: 1,
       pageSize: 10,
       daterange: [],
+      dialogFormVisible: true,
+      dialogTitle: "",
+      detailRow: {},
+      formLabelWidthDetail: "110px",
     };
   },
   mounted() {
@@ -133,6 +183,16 @@ export default {
     this.getListData();
   },
   methods: {
+    goBack() {
+      this.dialogFormVisible = true;
+    },
+    deilBtn(val) {
+      console.log("!!!!!!!!!!!!!!!!!!", val);
+      this.dialogFormVisible = false;
+      // 详细
+      this.dialogTitle = "详细";
+      this.detailRow = val;
+    },
     exportFn() {
       let requestData = {
         sn: this.$store.state.projectSn,
@@ -249,4 +309,96 @@ export default {
     },
   },
 };
-</script>
+</script>
+<style lang="less" scoped>
+.form-box {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  max-height: calc(100% - 50px);
+  overflow-y:scroll;
+
+  /deep/.el-form-item {
+    width: 50%;
+    padding-right: 10px;
+    box-sizing: border-box;
+  }
+
+  // /deep/.el-col-12{
+  //     padding-left: 20px;
+  // }
+  /deep/.el-input__inner {
+    width: 100%;
+  }
+
+  /deep/.el-select {
+    width: 100%;
+  }
+
+  /deep/.el-cascader {
+    width: 100%;
+  }
+}
+// 美化滚动条
+.form-box::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+.form-box::-webkit-scrollbar-track {
+  width: 6px;
+  background: rgba(#101F1C, 0.1);
+  -webkit-border-radius: 2em;
+  -moz-border-radius: 2em;
+  border-radius: 2em;
+}
+
+.form-box::-webkit-scrollbar-thumb {
+  background-color: rgba(144,147,153,.5);
+  background-clip: padding-box;
+  min-height: 28px;
+  -webkit-border-radius: 2em;
+  -moz-border-radius: 2em;
+  border-radius: 2em;
+  transition: background-color .3s;
+  cursor: pointer;
+}
+
+.form-box::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(144,147,153,.3);
+}
+
+.tables {
+  min-height: 0;
+  max-height: calc(100% - 56px);
+}
+.table_wrap {
+  position: relative;
+}
+.pagerBox {
+  margin-top: 0;
+  position: absolute;
+  bottom: 10px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.backText {
+  padding: 8px 0;
+  padding-left: 10px;
+
+  /deep/.el-page-header__content {
+    font-size: 14px;
+  }
+}
+.dark {
+  /deep/.el-page-header__content {
+    color: #fff;
+  }
+
+  /deep/ .print-btn {
+    background: none;
+    color: #262d47;
+    font-size: 14px;
+  }
+}
+</style>

src/views/userCenter/userCenter/componentsModule/dataListData.vue

@@ -51,7 +51,7 @@
         <el-table-column label="操作IP" align="center" prop="operIp" />
         <el-table-column label="请求URL" align="center" prop="operUri" />
         <el-table-column label="操作员姓名" align="center" prop="realName" />
-        <!-- <el-table-column label="操作" align="center">
+        <el-table-column label="操作" align="center">
           <template slot-scope="scope">
             <div class="tableBtns">
               <div class="operationText last" @click="deilBtn(scope.row)">
@@ -63,7 +63,7 @@
               </div>
             </div>
           </template>
-        </el-table-column> -->
+        </el-table-column>
       </el-table>
       <el-pagination
         class="pagerBox"
@@ -103,10 +103,10 @@
           {{ detailRow.realName }}
         </el-form-item>
         <el-form-item label="数据变更前：" :label-width="formLabelWidthDetail">
-          {{ detailRow.operModul }}
+          {{ detailRow.dataChangeBefore }}
         </el-form-item>
         <el-form-item label="数据变更后：" :label-width="formLabelWidthDetail">
-          {{ detailRow.operModul }}
+          {{ detailRow.dataChangeAfter }}
         </el-form-item>
       </el-form>
     </div>