bug修改

src/views/iot/videoDiagnosis/detail.vue

@@ -7,12 +7,15 @@
         border
         :label-style="labelStyle"
         :contentStyle="content_style"
-        ><el-descriptions-item label="监控主机">{{
-          data.hostName
-        }}</el-descriptions-item>
+      >
+        <el-descriptions-item label="监控主机">{{
+            data.hostName
+          }}
+        </el-descriptions-item>
         <el-descriptions-item label="通道名称">{{
-          data.channelName
-        }}</el-descriptions-item>
+            data.channelName
+          }}
+        </el-descriptions-item>
 
         <!-- <el-descriptions-item label="IP地址">{{
           data.channelIp
@@ -20,71 +23,71 @@
       </el-descriptions>
       <el-tabs type="border-card">
         <el-tab-pane label="录像存储情况">
-<!--          <el-descriptions
-            title="录像存储天数"
-            :column="3"
-            border
-            :label-style="labelStyle"
-            :contentStyle="content_style"
-            v-if="data.storage == null || data.storage.planDays == null"
-          >
-            <el-descriptions-item label="存储状态"> 未知 </el-descriptions-item>
-          </el-descriptions>
-          <div v-else>
-            <el-descriptions
-              title="录像存储天数"
-              :column="3"
-              border
-              :label-style="labelStyle"
-              :contentStyle="content_style"
-            >
-              <el-descriptions-item label="计划存储"
-                >{{ data.storage.planDays }}天</el-descriptions-item
-              >
-              <el-descriptions-item label="实际存储"
-                >{{ data.storage.realDays }}天</el-descriptions-item
-              >
-              <el-descriptions-item label="最早录像存储日期">{{
-                data.storage.earliestTime
-                  ? dayjs(data.storage.earliestTime).format("YYYY年M月D日")
-                  : ""
-              }}</el-descriptions-item>
-            </el-descriptions>
-            <el-descriptions :column="1">
-              <el-descriptions-item label="存储状态">
-                &lt;!&ndash;          <time-line></time-line>&ndash;&gt;
-                <ul class="legend-box">
-                  <li>
-                    <i class="legend" style="background-color: green"></i>
-                    <span>录像完整</span>
-                  </li>
-                  <li>
-                    <i class="legend" style="background-color: orange"></i>
-                    <span>部分丢失</span>
-                  </li>
-                  <li>
-                    <i class="legend" style="background-color: red"></i>
-                    <span>全部丢失</span>
-                  </li>
-                  <li>
-                    <i class="legend" style="background-color: #cbd5e0"></i>
-                    <span>计划录像天数</span>
-                  </li>
-                </ul>
-              </el-descriptions-item>
-            </el-descriptions>
+          <!--          <el-descriptions
+                      title="录像存储天数"
+                      :column="3"
+                      border
+                      :label-style="labelStyle"
+                      :contentStyle="content_style"
+                      v-if="data.storage == null || data.storage.planDays == null"
+                    >
+                      <el-descriptions-item label="存储状态"> 未知 </el-descriptions-item>
+                    </el-descriptions>
+                    <div v-else>
+                      <el-descriptions
+                        title="录像存储天数"
+                        :column="3"
+                        border
+                        :label-style="labelStyle"
+                        :contentStyle="content_style"
+                      >
+                        <el-descriptions-item label="计划存储"
+                          >{{ data.storage.planDays }}天</el-descriptions-item
+                        >
+                        <el-descriptions-item label="实际存储"
+                          >{{ data.storage.realDays }}天</el-descriptions-item
+                        >
+                        <el-descriptions-item label="最早录像存储日期">{{
+                          data.storage.earliestTime
+                            ? dayjs(data.storage.earliestTime).format("YYYY年M月D日")
+                            : ""
+                        }}</el-descriptions-item>
+                      </el-descriptions>
+                      <el-descriptions :column="1">
+                        <el-descriptions-item label="存储状态">
+                          &lt;!&ndash;          <time-line></time-line>&ndash;&gt;
+                          <ul class="legend-box">
+                            <li>
+                              <i class="legend" style="background-color: green"></i>
+                              <span>录像完整</span>
+                            </li>
+                            <li>
+                              <i class="legend" style="background-color: orange"></i>
+                              <span>部分丢失</span>
+                            </li>
+                            <li>
+                              <i class="legend" style="background-color: red"></i>
+                              <span>全部丢失</span>
+                            </li>
+                            <li>
+                              <i class="legend" style="background-color: #cbd5e0"></i>
+                              <span>计划录像天数</span>
+                            </li>
+                          </ul>
+                        </el-descriptions-item>
+                      </el-descriptions>
 
-            <div class="calendar-box">
-              <Calendar
-                :startDate="calenderStartDate"
-                :endDate="data.storage.lastTime"
-                :full="data.storage.fullDates"
-                :paritialLoss="data.storage.partialLossDates"
-                :allLoss="data.storage.allLostDates"
-                @select="onSelectDate"
-              ></Calendar>
-            </div>
-          </div>-->
+                      <div class="calendar-box">
+                        <Calendar
+                          :startDate="calenderStartDate"
+                          :endDate="data.storage.lastTime"
+                          :full="data.storage.fullDates"
+                          :paritialLoss="data.storage.partialLossDates"
+                          :allLoss="data.storage.allLostDates"
+                          @select="onSelectDate"
+                        ></Calendar>
+                      </div>
+                    </div>-->
           <div style="height: 10px"></div>
           <el-descriptions
             title="录像完整性"
@@ -94,7 +97,7 @@
             :contentStyle="content_style"
             v-if="integrity == null || integrity.state == null"
           >
-            <el-descriptions-item label="检测结果"> 未知 </el-descriptions-item>
+            <el-descriptions-item label="检测结果"> 未知</el-descriptions-item>
           </el-descriptions>
           <div v-else>
             <el-descriptions
@@ -105,17 +108,21 @@
               :contentStyle="content_style"
             >
               <el-descriptions-item label="检测结果">{{
-                getLabel(videoIntegrityState, integrity.state)
-              }}</el-descriptions-item>
+                  getLabel(videoIntegrityState, integrity.state)
+                }}
+              </el-descriptions-item>
               <el-descriptions-item label="录像日期">{{
-                dayjs(integrity.recordDate).format("YYYY年M月D日")
-              }}</el-descriptions-item>
+                  dayjs(integrity.recordDate).format("YYYY年M月D日")
+                }}
+              </el-descriptions-item>
               <el-descriptions-item label="丢失时长">{{
-                lostDurationText(integrity.loseDuration)
-              }}</el-descriptions-item>
+                  lostDurationText(integrity.loseDuration)
+                }}
+              </el-descriptions-item>
               <el-descriptions-item label="更新时间">{{
-                dayjs(integrity.updateTime).format("YYYY年M月D日H时m分")
-              }}</el-descriptions-item>
+                  dayjs(integrity.updateTime).format("YYYY年M月D日H时m分")
+                }}
+              </el-descriptions-item>
             </el-descriptions>
             <el-descriptions :column="1">
               <el-descriptions-item label="丢失时段">
@@ -159,7 +166,7 @@
             :contentStyle="content_style"
             v-if="data.quality == null || data.quality.quality == null"
           >
-            <el-descriptions-item label="检测结果"> 未知 </el-descriptions-item>
+            <el-descriptions-item label="检测结果"> 未知</el-descriptions-item>
           </el-descriptions>
           <div v-else>
             <el-descriptions
@@ -170,11 +177,13 @@
               :contentStyle="content_style"
             >
               <el-descriptions-item label="检测结果">{{
-                getLabel(videoDiagnosisState, data.quality.quality)
-              }}</el-descriptions-item>
+                  getLabel(videoDiagnosisState, data.quality.quality)
+                }}
+              </el-descriptions-item>
               <el-descriptions-item label="更新时间">{{
-                dayjs(data.quality.updateTime).format("YYYY年M月D日H时m分")
-              }}</el-descriptions-item>
+                  dayjs(data.quality.updateTime).format("YYYY年M月D日H时m分")
+                }}
+              </el-descriptions-item>
               <el-descriptions-item
                 label="诊断截图"
                 v-if="data.quality.quality == 1"
@@ -186,7 +195,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.signalLost"
-                        >视频信号</el-tag
+                      >视频信号
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -194,7 +204,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.occlude"
-                        >遮挡</el-tag
+                      >遮挡
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -202,7 +213,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.blurry"
-                        >模糊</el-tag
+                      >模糊
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -210,7 +222,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.colorCast"
-                        >偏色</el-tag
+                      >偏色
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -218,7 +231,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.snowflake"
-                        >雪花</el-tag
+                      >雪花
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -226,7 +240,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.stripe"
-                        >条纹</el-tag
+                      >条纹
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -234,7 +249,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.contrast"
-                        >对比度</el-tag
+                      >对比度
+                      </el-tag
                       >
                     </li>
                     <li>
@@ -242,7 +258,8 @@
                         size="small"
                         type="danger"
                         v-if="data.quality.brightness"
-                        >亮度</el-tag
+                      >亮度
+                      </el-tag
                       >
                     </li>
                   </ul>
@@ -280,12 +297,12 @@
 import ProgressBar from "./ProgressBar";
 import Calendar from "./Calendar.vue";
 import dayjs from "dayjs";
-import { detail } from "@/api/iot/videoDiagnosis.js";
-import { getLabel } from "@/views/commonOption.js";
-import { integrity } from "@/api/iot/videoDiagnosis";
+import {detail} from "@/api/iot/videoDiagnosis.js";
+import {getLabel} from "@/views/commonOption.js";
+import {integrity} from "@/api/iot/videoDiagnosis";
 
 export default {
-  components: { ProgressBar, Calendar },
+  components: {ProgressBar, Calendar},
   data() {
     return {
       isShow: false,
@@ -331,6 +348,7 @@ export default {
     dayjs,
     getLabel,
     async show(hostCode, channelCode) {
+      this.reset();
       detail(hostCode, channelCode).then((r) => {
         let data = r.data;
         data.hostCode = hostCode;
@@ -382,6 +400,13 @@ export default {
       (this.timeCells = []), //录像时间块
         (this.lostData = []);
     },
+    reset() {
+      this.id = null;
+      this.integrity = {};
+      this.data = {};
+      this.timeCells = [];
+      this.lostData = [];
+    },
     onSelectDate(date) {
       this.getIntegrity(this.data.hostCode, this.data.channelCode, date);
     },
@@ -494,12 +519,14 @@ export default {
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
+
     > li {
       display: flex;
       flex-direction: row;
       justify-content: flex-start;
       align-items: center;
       margin-right: 20px;
+
       i {
         margin-right: 5px;
       }
@@ -511,10 +538,12 @@ export default {
       margin-right: 5px;
     }
   }
+
   .time-line-box {
     width: 100%;
     padding: 0 80px 50px 80px;
   }
+
   .calendar-box {
     width: 100%;
     display: flex;
@@ -524,13 +553,16 @@ export default {
     //  width: 30%;
     //}
   }
+
   .el-calendar-table .el-calendar-day {
     padding: 5px;
     height: auto;
   }
+
   .el-calendar__button-group {
     display: none;
   }
+
   .legend {
     display: block;
     width: 14px;

src/views/iot/videoDiagnosis/index.vue

@@ -46,7 +46,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item label="录像存储状态" prop="daysState">
+<!--          <el-form-item label="录像存储状态" prop="daysState">
             <el-select
               v-model="queryParams.daysState"
               clearable
@@ -59,7 +59,7 @@
                 :value="dict.value"
               />
             </el-select>
-          </el-form-item>
+          </el-form-item>-->
           <el-form-item label="视频诊断状态" prop="diagnosisState">
             <el-select
               v-model="queryParams.diagnosisState"