From 7c20fd15b7fbc2bd5756b39d5ab655cc849ffcc3 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期三, 16 七月 2025 22:39:23 +0800
Subject: [PATCH] 添加时间筛选

---
 src/views/systemSetting/device/point/index.vue |  128 ++++++++++++++++++++++++------------------
 1 files changed, 72 insertions(+), 56 deletions(-)

diff --git a/src/views/systemSetting/device/point/index.vue b/src/views/systemSetting/device/point/index.vue
index d7d4b94..2f11ed6 100644
--- a/src/views/systemSetting/device/point/index.vue
+++ b/src/views/systemSetting/device/point/index.vue
@@ -4,8 +4,15 @@
       <department-aside @selectedDepartment="selectedDepartment" />
     </el-aside>
 
-    <el-container>
-      <el-header style="display: flex; flex-direction: column; height: 120px">
+    <el-container class="point-container">
+      <el-header
+        style="
+          display: flex;
+          flex-direction: column;
+          height: 120px;
+          padding: 0 40px;
+        "
+      >
         <div
           style="display: flex; justify-content: space-between; height: 80px"
         >
@@ -28,7 +35,7 @@
         <div
           v-for="item in videoData"
           :key="item.id"
-          style="position: relative"
+          style="position: relative; height: 350px"
         >
           <div class="video-title">{{ item.name }}{{ item.community }}</div>
 
@@ -104,30 +111,32 @@
         .catch((err) => this.$message.error(err));
     },
     loadVideo(item) {
-      if (item.platResourceId) {
+      if (item.code || item.platResourceId) {
         if (Hls.isSupported()) {
           var video = document.getElementById(item.id);
           var hls = new Hls();
-          videoPoint.getVideoPointUrl(item.platResourceId).then((res) => {
-            if (res.code === 0) {
-              hls.loadSource(res.data);
-              hls.attachMedia(video);
-              this.videoList.push(video);
-              // hls.on(Hls.Events.MANIFEST_PARSED, function () {
-              //   // video.play();
-              //   document.body.addEventListener(
-              //     "click",
-              //     function () {
-              //       video.play();
-              //     },
-              //     false
-              //   );
-              // });
-              setTimeout(() => {
-                video.play();
-              }, 2000);
-            }
-          });
+          videoPoint
+            .getVideoPointUrl(item.code || item.platResourceId)
+            .then((res) => {
+              if (res.code === 0) {
+                hls.loadSource(res.data);
+                hls.attachMedia(video);
+                this.videoList.push(video);
+                // hls.on(Hls.Events.MANIFEST_PARSED, function () {
+                //   // video.play();
+                //   document.body.addEventListener(
+                //     "click",
+                //     function () {
+                //       video.play();
+                //     },
+                //     false
+                //   );
+                // });
+                setTimeout(() => {
+                  video.play();
+                }, 2000);
+              }
+            });
         }
       } else {
         this.$message.error("鏆傛棤瑙嗛");
@@ -146,28 +155,35 @@
     },
   },
   beforeDestroy() {
-    videoList.forEach((element) => {
+    this.videoList.forEach((element) => {
       element.push();
     });
   },
 };
 </script>
 <style lang="scss" scoped>
+.point-container {
+  margin-left: 5px;
+  border: 1px solid #ccc;
+  padding: 10px;
+}
 .button-one {
   height: 40px;
   width: 80px;
-  margin-left: 20px;
+  //margin-left: 20px;
   padding: 0;
-  background-color: #09152f;
+  // background-color: #09152f;
   color: rgb(75, 155, 183);
   border: 1px solid rgb(75, 155, 183);
 }
-
+.title {
+  color: #333;
+}
 .button-two {
   height: 40px;
   width: 80px;
   padding: 0;
-  background-color: #09152f;
+  // background-color: #09152f;
   color: rgb(75, 155, 183);
   border: 1px solid rgb(75, 155, 183);
 }
@@ -178,7 +194,7 @@
   height: 40px;
   width: 80px;
   padding: 0;
-  background-color: #09152f;
+  // background-color: #09152f;
   color: rgb(75, 155, 183);
   border: 1px solid rgb(75, 155, 183);
 }
@@ -239,17 +255,17 @@
 }
 
 .el-pagination {
-  &::v-deep li,
-  &::v-deep .btn-prev,
-  &::v-deep .btn-next {
-    background-color: #071f39;
-    color: #4b9bb7;
-  }
+  // &::v-deep li,
+  // &::v-deep .btn-prev,
+  // &::v-deep .btn-next {
+  //   background-color: #071f39;
+  //   color: #4b9bb7;
+  // }
 
-  &::v-deep .active {
-    background-color: #409eff;
-    color: #fff;
-  }
+  // &::v-deep .active {
+  //   background-color: #409eff;
+  //   color: #fff;
+  // }
 }
 
 .bottonThird {
@@ -264,24 +280,24 @@
   cursor: pointer;
 }
 
-::v-deep .el-header {
-  background-color: #09152f;
-  color: #000;
-  line-height: 60px;
-}
+// ::v-deep .el-header {
+//   background-color: #09152f;
+//   color: #000;
+//   line-height: 60px;
+// }
 
-::v-deep .el-aside {
-  background-color: #09152f;
-}
+// ::v-deep .el-aside {
+//   background-color: #09152f;
+// }
 
-::v-deep .el-menu {
-  background-color: #09152f;
-}
+// ::v-deep .el-menu {
+//   background-color: #09152f;
+// }
 
-::v-deep .el-main,
-::v-deep .el-footer {
-  background-color: #09152f;
-}
+// ::v-deep .el-main,
+// ::v-deep .el-footer {
+//   background-color: #09152f;
+// }
 
 ::v-deep .el-tree-node__label {
   line-height: 30px;
@@ -307,4 +323,4 @@
 video::-webkit-media-controls-toggle-closed-captions-button {
   display: none;
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0