From 7a98d6724da914d86b6ec2912dba9bfdf2423c39 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期二, 22 二月 2022 15:14:27 +0800
Subject: [PATCH] 添加rtsp用户信息urlencode功能

---
 src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue |  187 ++++++++++++++++++++++++++++++++++------------
 1 files changed, 139 insertions(+), 48 deletions(-)

diff --git a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
index 464e7ea..0449fbb 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
@@ -261,11 +261,11 @@
                       v-for="(label, index) in data.LableLst"
                       :key="index"
                     >
-                      {{
-                        label.Desc +
-                        (index == data.LableLst.length - 1 ? "" : "锛�")
-                      }}
+                      {{ label.Desc }}
                     </span>
+                  </div>
+                  <div v-else-if="hasError(data)" class="has-error">
+                    <span>{{ errWord(data) }}</span>
                   </div>
                   <div v-else class="no-error">
                     <span>鏃犲紓甯�</span>
@@ -319,9 +319,16 @@
       <div class="content" v-show="showType == 'list'">
         <el-table
           :data="tableData"
+          stripe
           fit
           ref="elTable"
           @row-click="checkVideoDetail"
+          :header-cell-style="{
+            background: '#2D52D7',
+            color: '#fff',
+            height: '50px',
+            padding: 0,
+          }"
         >
           <el-table-column label="鍚嶇О" prop="VideoName" sortable width="500">
             <template slot-scope="scope" style="cursor: pointer">
@@ -590,7 +597,6 @@
         }
       });
       Object.assign(query, ...filterQuerys);
-
       getlst(query).then((res) => {
         if (_this.showType == "list") {
           _this.tableTotal = res.total;
@@ -601,7 +607,7 @@
           _this.tabData = _this.tabData.map(function (item) {
             const set = new Set();
             item.LableLst.forEach(function (label) {
-              label.Desc.split("锛�").forEach(function (d) {
+              label.Desc.split(",").forEach(function (d) {
                 set.add(d);
               });
             });
@@ -627,7 +633,7 @@
         StartDate: this.searchTime[0],
         EndDate: this.searchTime[1],
         PageIndex:
-          this.showType == "list" ? this.curTablePage : this.showType == "list",
+          this.showType == "list" ? this.curTablePage : this.curTabPage,
         PageSize:
           this.showType == "list" ? this.tablePageSize : this.tabPageSize,
         IsDetail: this.showType == "list",
@@ -658,7 +664,7 @@
           _this.tabData = _this.tabData.map(function (item) {
             const set = new Set();
             item.LableLst.forEach(function (label) {
-              label.Desc.split("锛�").forEach(function (d) {
+              label.Desc.split(",").forEach(function (d) {
                 set.add(d);
               });
             });
@@ -705,6 +711,43 @@
           });
         });
       });
+    },
+    errWord(data) {
+      let text;
+      data.EventLst.forEach((item, i) => {
+        if (
+          item.state == 0 &&
+          item.Event.indexOf("杩涘嚭绔�") == -1 &&
+          item.Event.indexOf("淇″彿鏈�") == -1 &&
+          item.Event.indexOf("杩囧垎鐩�") == -1
+        ) {
+          text = item.Event;
+        }
+      });
+      return text || "鏈墜姣�";
+    },
+    hasError(data) {
+      let status = true;
+      if (!data.EventLst || data.EventLst.length == 0) {
+        return false;
+      }
+
+      data.EventLst.forEach((item) => {
+        if (
+          item.Event.indexOf("鐬湜") > -1 ||
+          item.Event.indexOf("浜烘暟鍙樺寲") > -1
+        ) {
+          status = false;
+          false;
+        }
+      });
+
+      if (!status) {
+        return false;
+      }
+
+      const t = data.EventLst.some((x) => x.state == 0);
+      return t && data.IsOperate == "1";
     },
     toggleFollow(data) {
       data.IsFollow == "0" ? (data.IsFollow = "1") : (data.IsFollow = "0");
@@ -885,8 +928,10 @@
 .search-for-video-analyze {
   background-color: #f4f6f9;
   margin: 0 5px;
+  margin-bottom: 10px;
   * {
     box-sizing: content-box;
+    color: #425277;
   }
   .el-input__inner {
     border: 1px solid #d7dce8;
@@ -894,6 +939,8 @@
   }
   .flex-box {
     display: flex;
+    height: 18px;
+    line-height: 18px;
   }
   .filter-area {
     background: #fff;
@@ -976,7 +1023,6 @@
       .config {
         display: flex;
         flex-wrap: no-wrap;
-        cursor: pointer;
         border-bottom: 1px solid #d7dce8;
         .title {
           padding: 10px 20px;
@@ -1011,9 +1057,9 @@
                 padding: 0 10px;
                 text-align: left;
                 width: fit-content;
+                cursor: pointer;
               }
               &:hover > .option-name {
-                // outline: 1px solid #a8b7ee;
                 background: #e2e7f9;
                 span {
                   color: #2d52d7;
@@ -1052,7 +1098,7 @@
           .more {
             margin-top: 7px;
             padding: 0px 6px;
-
+            cursor: pointer;
             margin-right: 10px;
             width: 46px;
             height: 25px;
@@ -1066,6 +1112,7 @@
           .multCheck {
             margin-top: 7px;
             width: 44px;
+            cursor: pointer;
             height: 23px;
             line-height: 23px;
             padding: 0px 12px;
@@ -1077,14 +1124,6 @@
             span {
               color: #ee4e6e;
             }
-            // &:hover {
-            //   color: #7695ec;
-            //   border-color: #7695ec;
-            // }
-            // &.checked {
-            //   color: #409eff;
-            //   border-color: #409eff;
-            // }
           }
         }
         .el-menu.el-menu--horizontal {
@@ -1151,16 +1190,21 @@
         .show-type {
           display: flex;
           .list span {
-            font-size: 20px;
+            font-size: 18px;
+            line-height: 20px;
           }
           .type {
-            font-size: 18px;
-            padding: 2px 4px 0px 4px;
+            font-size: 17px;
             border-radius: 4px;
+            cursor: pointer;
+            height: 20px;
+            width: 20px;
+            line-height: 19px;
+
             &.menu {
-              margin-right: 10px;
+              margin-right: 5px;
               span {
-                font-size: 15px;
+                font-size: 14px;
               }
             }
             &.current {
@@ -1178,26 +1222,30 @@
       .el-table__row {
         cursor: pointer;
       }
+      .el-table {
+        border: none;
+        margin-bottom: 20px;
+      }
       .el-col {
         margin-bottom: 10px;
       }
       .card {
-        cursor: pointer;
         position: relative;
         text-align: left;
         background: #fff;
         border-radius: 0 0 5px 5px;
-        height: 360px;
+        height: 368px;
         margin-bottom: 10px;
         border: 1px solid#CCD9F0;
         &:hover {
           box-shadow: 3px 3px 4px #d3def2;
         }
         .video-wrap {
+          cursor: pointer;
           border-radius: 3px;
           width: 100%;
-          padding-top: 56.25%;
-          height: 0;
+          // padding-top: 56.25%;
+          height: 57%;
           position: relative;
           img {
             position: absolute;
@@ -1208,27 +1256,58 @@
           }
         }
         .video-info {
-          padding: 10px;
+          padding: 14px;
           .base-info {
             > div {
               margin-bottom: 1px;
             }
             label {
-              color: #999;
+              color: #808dab;
               padding-right: 8px;
+              line-height: 16px;
+            }
+            span {
+              font-weight: bold;
+              color: #425277;
+              line-height: 16px;
             }
           }
           .mark-info {
             margin: 10px 0;
             color: #3d68e1;
             .abnormal {
-              color: red;
               overflow: hidden;
               text-overflow: ellipsis;
               white-space: nowrap;
+              .abnormal-label {
+                display: inline-block;
+                border: 1px solid;
+                border: 1px solid #bf3a3a;
+                border-radius: 2px;
+                color: #bf3a3a;
+                padding: 0 3px;
+                margin-right: 3px;
+              }
             }
             .event-tag {
-              margin-top: 10px;
+              margin-top: 8px;
+              .el-tag.el-tag--info {
+                background-color: #96a0b7;
+                border-color: #96a0b7;
+                color: #fff;
+                cursor: pointer;
+                height: 19px;
+                padding: 0 5px;
+              }
+            }
+            .has-error {
+              width: fit-content;
+              background: #bf3a3a;
+              padding: 1px 5px;
+              border-radius: 2px;
+              span {
+                color: #fff;
+              }
             }
             .no-error {
               width: fit-content;
@@ -1256,28 +1335,27 @@
           font-size: 20px;
           right: 10px;
           bottom: 10px;
-          i {
-            color: #c7d0e5;
-          }
-          .follow {
-            color: #f90741;
-          }
         }
       }
+      .el-table--striped
+        .el-table__body
+        tr.el-table__row--striped
+        td.el-table__cell {
+        background: #f4f6f9;
+      }
       .el-table {
-        border: 1px solid #dedede;
         th {
           background: #f5f5f5;
           color: #333;
         }
-        .operation {
-          cursor: pointer;
-          .star {
-            color: #ccc;
-          }
-          .follow {
-            color: #409eff;
-          }
+        th.el-table__cell > .cell {
+          color: #fff;
+        }
+        .el-table__row > td {
+          border: none;
+        }
+        th.is-leaf {
+          border: none;
         }
       }
       .pagination-center {
@@ -1286,12 +1364,23 @@
         padding: 10px 0 20px;
       }
     }
+    .star {
+      font-size: 20px;
+      i {
+        color: #c7d0e5;
+      }
+      .follow {
+        color: #f90741;
+      }
+    }
     .el-dialog__wrapper {
       top: -22px;
     }
     .dialog-video {
       .el-dialog {
         width: 1340px;
+        top: 70px;
+        transform: none;
       }
       .el-dialog__body {
         background: #eaeaea;
@@ -1301,7 +1390,8 @@
       .el-dialog__header {
         padding: 0px;
         .el-dialog__headerbtn {
-          top: 6px;
+          top: 10px;
+          font-size: 20px;
         }
       }
       .title-partment {
@@ -1342,6 +1432,7 @@
     }
     .dialog-event {
       z-index: 2096 !important;
+
       .el-dialog {
         width: 1000px;
         height: 800px;

--
Gitblit v1.8.0