提交

src/views/Jugou/Jugou.vue

@@ -34,13 +34,18 @@
     <br />
     <el-card>
       <div style="padding: 0 100px">
-        <video
-          controls
-          autoplay
-          ref="video"
-          @timeupdate="timeupdate"
-          :src="videoUrl"
-        ></video>
+        <div style="position: relative;">
+          <video
+            controls
+            autoplay
+            ref="video"
+            @timeupdate="timeupdate"
+            @error="videoerror"
+            @canplay="videoload"
+            :src="videoUrl"
+          />
+          <img v-show="videoerrorStart" class="videoerror" src="../../assets/img/videoerror.png" />
+        </div>
         <div style="position: relative;">
           <div
             class="chart"
@@ -126,6 +131,7 @@ export default {
   name: "Channel",
   data() {
     return {
+      videoerrorStart: false,
       list: [],
       select: -1,
       channel: "",
@@ -237,7 +243,7 @@ export default {
         dataZoom: [
           {
             maxSpan: 10,
-            minSpan: 10,
+            minSpan: 1,
             type: "slider",
             show: true,
             realtime: true,
@@ -337,6 +343,7 @@ export default {
             yAxisIndex: 0,
             stack: "one",
             data: Irdata,
+            sampling: "lttb",
             emphasis: {
               focus: "series",
             },
@@ -348,6 +355,7 @@ export default {
             name: "流出",
             type: "bar",
             yAxisIndex: 0,
+            sampling: "lttb",
             stack: "one",
             data: Icdata,
             emphasis: {
@@ -407,6 +415,12 @@ export default {
       }
       nowDate - new Date(newDate) > 0 ? (this.date = newDate) : "";
     },
+    videoerror() {
+      this.videoerrorStart = true;
+    },
+    videoload(){
+      this.videoerrorStart = false;
+    }
   },
   components: {},
 };
@@ -458,4 +472,13 @@ export default {
   vertical-align: middle;
   border-radius: 10px;
 }
+.Jugou .videoerror {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+video::-webkit-media-controls-timeline {
+  display: none;
+}
 </style>