From 7f800e5ec8d0b9edf242eb2a76bc0ae68cdd0f17 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A7=9C=E7=8E=89=E7=90=A6?=
 <7507756+jiang_yuqi@user.noreply.gitee.com>
Date: Sat, 23 Mar 2024 22:34:26 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/projectVideo.vue | 2971 +++++++++++++++++++-----------------
 vue.config.js              |    4 +-
 2 files changed, 1550 insertions(+), 1425 deletions(-)

diff --git a/src/pages/projectVideo.vue b/src/pages/projectVideo.vue
index 6dab831..2337fae 100644
--- a/src/pages/projectVideo.vue
+++ b/src/pages/projectVideo.vue
@@ -1,9 +1,9 @@
 <template>
-    <div class="project-video">
-            <div class="screen-content">
-                <!-- <div class="analyse-equipment analyse-equipment-position">视频监控</div> -->
-                <el-row>
-                    <!-- <el-col :span="6">
+  <div class="project-video">
+    <div class="screen-content">
+      <!-- <div class="analyse-equipment analyse-equipment-position">视频监控</div> -->
+      <el-row>
+        <!-- <el-col :span="6">
                         <module-one-1-1 label="视频概况" :amplify="true" name="amplify-spjk">
                             <div class="equipment-list-max">
                                 <el-row>
@@ -64,1473 +64,1598 @@
                             </div>
                         </module-one-2-1>                        
                     </el-col> -->
-                    <el-col :span="4">
-                        <module-one-3-1 label="视频列表">
-                            <div class="video-list-max">
-                                <div class="video-list-min">
-                                    <div class="video-list-for" v-for="item in videoListData">
-                                        <ul class="video-list-ul" v-show="item.type">
-                                            <li :class="video.type==true?'active':''" v-for="(video,idx) in item.videoList" @click.stop="handlePlay(video,idx)">
-                                                <button :class="video.signalState == 1?'video-state-zx':'video-state-lx'"></button>
-                                                <span>{{video.videoName}}</span>
-                                            </li>
-                                        </ul>
-                                    </div>
-                                </div>
-                            </div>
-                        </module-one-3-1>
-                    </el-col>
-                    <el-col :span="20">
-                        <module-one-video>
-                            <div class="video-enlarge-max" v-if="videoType">
-                                <div class="video-enlarge-title">
-                                    <div>
-                                        <span v-cloak>{{ videoReturnData.videoName }}</span>
-                                        <label v-if="videoReturnData.signalState == 1" class="color-green">（在线）</label>
-                                        <label v-if="videoReturnData.signalState != 1" class="police-data">（离线）</label>
-                                    </div>
-                                    <div></div>
-                                </div>
-                                <div class="video-enlarge-content">
-                                    <div class="videoView" v-if="showVideoView0">
-                                        <div id="vd01" ></div>
-                                        <!--
+        <el-col :span="4">
+          <module-one-3-1 label="视频列表">
+            <div class="video-list-max">
+              <div class="video-list-min">
+                <div class="video-list-for" v-for="item in videoListData">
+                  <ul class="video-list-ul" v-show="item.type">
+                    <li
+                      :class="video.type == true ? 'active' : ''"
+                      v-for="(video, idx) in item.videoList"
+                      @click.stop="handlePlay(video, idx)"
+                    >
+                      <button
+                        :class="
+                          video.signalState == 1 ? 'video-state-zx' : 'video-state-lx'
+                        "
+                      ></button>
+                      <span>{{ video.videoName }}</span>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+            </div>
+          </module-one-3-1>
+        </el-col>
+        <el-col :span="20">
+          <module-one-video>
+            <div class="video-enlarge-max" v-if="videoType">
+              <div class="video-enlarge-title">
+                <div>
+                  <span v-cloak>{{ videoReturnData.videoName }}</span>
+                  <label v-if="videoReturnData.signalState == 1" class="color-green"
+                    >（在线）</label
+                  >
+                  <label v-if="videoReturnData.signalState != 1" class="police-data"
+                    >（离线）</label
+                  >
+                </div>
+                <div></div>
+              </div>
+              <div class="video-enlarge-content">
+                <div class="videoView" v-if="showVideoView0">
+                  <div id="vd01" v-if="parentVM.vd01Flag"></div>
+                  <!--
                                         <H265Player :url="url0" @on-error="handleOnError0" />
                                         -->
-                                    </div>
-                                    <div class="videoView videoViewError" v-if="showVideoView0 == false">
-                                        设备0通道链接失败！请及时检查！
-                                    </div>
-                                    <div class="videoView" v-if="showVideoView1">
-                                        <!--
+                </div>
+                <div class="videoView videoViewError" v-if="showVideoView0 == false">
+                  设备0通道链接失败！请及时检查！
+                </div>
+                <div class="videoView" v-if="showVideoView1">
+                  <!--
                                         <H265Player :url="url1" @on-error="handleOnError1" />
                                         -->
-                                        <div id="vd02" ></div>
-                                    </div>
-                                    <div class="videoView videoViewError" v-if="showVideoView1 == false">
-                                        设备1通道链接失败！请及时检查！
-                                    </div>
-                                    <div class="videoView" v-if="showVideoView2">
-                                        <!--
+                  <div id="vd02" v-if="parentVM.vd02Flag"></div>
+                </div>
+                <div class="videoView videoViewError" v-if="showVideoView1 == false">
+                  设备1通道链接失败！请及时检查！
+                </div>
+                <div class="videoView" v-if="showVideoView2">
+                  <!--
                                         <H265Player :url="url2" @on-error="handleOnError2" />
                                         -->
-                                        <div id="vd03" ></div>
-                                    </div>
-                                    <div class="videoView videoViewError" v-if="showVideoView2 == false">
-                                        设备2通道链接失败！请及时检查！
-                                    </div>
-                                    <div class="videoView" v-if="showVideoView3">
-                                        <!--
+                  <div id="vd03" v-if="parentVM.vd03Flag"></div>
+                </div>
+                <div class="videoView videoViewError" v-if="showVideoView2 == false">
+                  设备2通道链接失败！请及时检查！
+                </div>
+                <div class="videoView" v-if="showVideoView3">
+                  <!--
                                         <H265Player :url="url3" @on-error="handleOnError3" />
                                         -->
-                                        <div id="vd04" ></div>
-                                    </div>
-                                    <div class="videoView videoViewError" v-if="showVideoView3 == false">
-                                        设备3通道链接失败！请及时检查！
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="video-enlarge-max" v-if="vehicleType">                                
-                                <div class="video-vehicle-table">                                    
-                                    <el-table :data="vehicleMonitorData" class="elTable">                                        
-                                        <el-table-column label="进出场照片">
-                                            <template slot-scope="scope">
-                                                <el-row>
-                                                    <el-col :span="6">
-                                                        <div class="vehicle-jin-img-max">
-                                                            <div class="vehicle-jin-img-bgd">
-                                                                <img :src="scope.row.photoUrl" v-if="scope.row.photoUrl">
-                                                            </div>
-                                                            <div class="vehicle-time" v-cloak>{{ scope.row.uploadTime }}</div>
-                                                        </div>
-                                                    </el-col>
-                                                    <el-col :span="6">
-                                                        <div class="vehicle-jin-img-max">
-                                                            <div class="vehicle-jin-img-bgd">
-                                                                <img :src="scope.row.photoUrl2" v-if="scope.row.photoUrl2">
-                                                            </div>
-                                                            <div class="vehicle-time" v-cloak>{{ scope.row.uploadTime2 }}
-                                                            </div>
-                                                        </div>
-                                                    </el-col>
-                                                    <el-col :span="6">
-                                                        <div class="vehicle-jin-img-max">
-                                                            <div class="vehicle-jin-img-bgd">
-                                                                <img :src="scope.row.photoUrl3" v-if="scope.row.photoUrl3">
-                                                            </div>
-                                                            <div class="vehicle-time" v-cloak>{{ scope.row.uploadTime3 }}
-                                                            </div>
-                                                        </div>
-                                                    </el-col>
-                                                    <el-col :span="6">
-                                                        <div class="vehicle-jin-img-max">
-                                                            <div class="vehicle-jin-img-bgd">
-                                                                <img :src="scope.row.photoUrl4" v-if="scope.row.photoUrl4">
-                                                            </div>
-                                                            <div class="vehicle-time" v-cloak>{{ scope.row.uploadTime4 }}
-                                                            </div>
-                                                        </div>
-                                                    </el-col>
-                                                </el-row>
-                                            </template>
-                                        </el-table-column>
-                                       
-                                    </el-table>
-                                </div>
-                            </div>
-                        </module-one-video>
-                    </el-col>
-                </el-row>
+                  <div id="vd04" v-if="parentVM.vd04Flag"></div>
+                </div>
+                <div class="videoView videoViewError" v-if="showVideoView3 == false">
+                  设备3通道链接失败！请及时检查！
+                </div>
+              </div>
             </div>
-        </div>
+            <div class="video-enlarge-max" v-if="vehicleType">
+              <div class="video-vehicle-table">
+                <el-table :data="vehicleMonitorData" class="elTable">
+                  <el-table-column label="进出场照片">
+                    <template slot-scope="scope">
+                      <el-row>
+                        <el-col :span="6">
+                          <div class="vehicle-jin-img-max">
+                            <div class="vehicle-jin-img-bgd">
+                              <img :src="scope.row.photoUrl" v-if="scope.row.photoUrl" />
+                            </div>
+                            <div class="vehicle-time" v-cloak>
+                              {{ scope.row.uploadTime }}
+                            </div>
+                          </div>
+                        </el-col>
+                        <el-col :span="6">
+                          <div class="vehicle-jin-img-max">
+                            <div class="vehicle-jin-img-bgd">
+                              <img
+                                :src="scope.row.photoUrl2"
+                                v-if="scope.row.photoUrl2"
+                              />
+                            </div>
+                            <div class="vehicle-time" v-cloak>
+                              {{ scope.row.uploadTime2 }}
+                            </div>
+                          </div>
+                        </el-col>
+                        <el-col :span="6">
+                          <div class="vehicle-jin-img-max">
+                            <div class="vehicle-jin-img-bgd">
+                              <img
+                                :src="scope.row.photoUrl3"
+                                v-if="scope.row.photoUrl3"
+                              />
+                            </div>
+                            <div class="vehicle-time" v-cloak>
+                              {{ scope.row.uploadTime3 }}
+                            </div>
+                          </div>
+                        </el-col>
+                        <el-col :span="6">
+                          <div class="vehicle-jin-img-max">
+                            <div class="vehicle-jin-img-bgd">
+                              <img
+                                :src="scope.row.photoUrl4"
+                                v-if="scope.row.photoUrl4"
+                              />
+                            </div>
+                            <div class="vehicle-time" v-cloak>
+                              {{ scope.row.uploadTime4 }}
+                            </div>
+                          </div>
+                        </el-col>
+                      </el-row>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </div>
+          </module-one-video>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
 </template>
 
 <script>
-
-import '../components/module/module-one-2-1'
-import '../components/module/module-one-3-1'
-import '../components/module/module-one-0-5'
-import '../components/module/module-one-video'
-import '../components/staff-survey-chart'
-import '../components/classify-bar'
-import '../components/amplify/shipinguanli/amplify-spjk'
-import debounce from 'lodash.debounce'
+import "../components/module/module-one-2-1";
+import "../components/module/module-one-3-1";
+import "../components/module/module-one-0-5";
+import "../components/module/module-one-video";
+import "../components/staff-survey-chart";
+import "../components/classify-bar";
+import "../components/amplify/shipinguanli/amplify-spjk";
+import debounce from "lodash.debounce";
 export default {
-    data() {
-        return {
-            //视频概况
-            cqNum: 0,
-            dgNum: 0,
-            aiNum: 0,
-            offLineNum: 0,
+  data() {
+    return {
+      //视频概况
+      cqNum: 0,
+      dgNum: 0,
+      aiNum: 0,
+      offLineNum: 0,
 
-            videoTotalNum: 0,
-            onLineNum: 0,
-            onLinePer: 0,
-            dayOffLineNum: 0,
-            monthOffLineNum: 0,
-            safetyEducationData: [
-                { text: "视频在线率", value: 0 },
-            ],
-            legendData: ['离线路数', '在线路数'],
-            classifyBarData: [],
-            //项目视频预警
-            rowStyle: {
-                color: '#B6CFEF',
-                fontSize: '12px',
-                height: '32px'
-            },
-            warningInterval: '',
-            warningTableData: [],
+      videoTotalNum: 0,
+      onLineNum: 0,
+      onLinePer: 0,
+      dayOffLineNum: 0,
+      monthOffLineNum: 0,
+      safetyEducationData: [{ text: "视频在线率", value: 0 }],
+      legendData: ["离线路数", "在线路数"],
+      classifyBarData: [],
+      //项目视频预警
+      rowStyle: {
+        color: "#B6CFEF",
+        fontSize: "12px",
+        height: "32px",
+      },
+      warningInterval: "",
+      warningTableData: [],
 
-            //视频场布图分布点位
-            VideoDistribution: [],
-            //视频列表
-            videoListData: [],
+      //视频场布图分布点位
+      VideoDistribution: [],
+      //视频列表
+      videoListData: [],
 
-            videoReturnData: {},
-            videoType: true,
-            ptz: false,
-            autoPlay: false,
-            //车辆列表
-            vehicleListData: [],
-            vehicleReturnData: {},
-            vehicleType: false,
-            //监控视频
-            mvNav: 1,
-            //车辆监控数据
-            vehicleMonitorData: [],
-            //视频组件
-            isplay: true,
-            videoHost: "https://video.makalu.cc",
-            h5s: "",
-            hls: new Hls(),
-            hlsvideo: undefined,
-            rtmpVideo: "",
-            exception: false,
-            exMsg: "数据加载异常，请刷新重试...",
-            initCount: 0,
-            pubKey: "",
-            restartInit: false,
-            initError: false,
-            oWebControl: undefined,
-            token: "",
-            type: "hls",
-            width: 1124,
-            height: 850,
-            videoMapStyle: {
-                background: 'url("images/field_layout_video.png") no-repeat center/100% auto'
-            },
-            projectId: "163",
-            showVideo: false,
-            currentIndex: null,
-            request:
-                "http://111.21.209.230:7086/live/cameraid/{{videoDvrNumber}}${{passage}}/substream/2.m3u8",
-            url0: "",
-            url1: "",
-            url2: "",
-            url3: "",
-            showVideoView0: true,
-            showVideoView1: true,
-            showVideoView2: true,
-            showVideoView3: true,
-            videoPassageList: [],
-            videoDvrNumber: null,
-            projectInfo:null,
-            dept:null,
-            videoPassageList:[],
-            projectInfos:[],
-            players:[]
-        }
-    },
-    mounted() {
-        this.$bus.$on("projectChange", debounce(res => {
-            this.projectInfo=res;
-            this.initVideoMenu();
-        }));
-        this.$bus.$on("loadProjects", debounce(prjs => {
-            this.projectInfos = prjs;
-            //this.initVideoMenu();
-        }))
-        this.$bus.$on("deptChange", debounce(dept => {
-            this.dept = dept;
-            //this.initVideoMenu();
-        })); 
-        if(this.$root.hasInitHeader){
-            this.initMe();
-        }
-        this.$nextTick(()=>{
-            for(let i=1;i<=4;i++){
-                let player = new WasmPlayer(null, 'vd0'+i, null,{
-                    Height:true
-                })
-                this.players.push(player);
-           }
-           console.log(">>>>>>",this.players)
+      videoReturnData: {},
+      videoType: true,
+      ptz: false,
+      autoPlay: false,
+      //车辆列表
+      vehicleListData: [],
+      vehicleReturnData: {},
+      vehicleType: false,
+      //监控视频
+      mvNav: 1,
+      //车辆监控数据
+      vehicleMonitorData: [],
+      //视频组件
+      isplay: true,
+      videoHost: "https://video.makalu.cc",
+      h5s: "",
+      hls: new Hls(),
+      hlsvideo: undefined,
+      rtmpVideo: "",
+      exception: false,
+      exMsg: "数据加载异常，请刷新重试...",
+      initCount: 0,
+      pubKey: "",
+      restartInit: false,
+      initError: false,
+      oWebControl: undefined,
+      token: "",
+      type: "hls",
+      width: 1124,
+      height: 850,
+      videoMapStyle: {
+        background: 'url("images/field_layout_video.png") no-repeat center/100% auto',
+      },
+      projectId: "163",
+      showVideo: false,
+      currentIndex: null,
+      request:
+        "http://111.21.209.230:7086/live/cameraid/{{videoDvrNumber}}${{passage}}/substream/2.m3u8",
+      url0: "",
+      url1: "",
+      url2: "",
+      url3: "",
+      showVideoView0: true,
+      showVideoView1: true,
+      showVideoView2: true,
+      showVideoView3: true,
+      videoPassageList: [],
+      videoDvrNumber: null,
+      projectInfo: null,
+      dept: null,
+      videoPassageList: [],
+      projectInfos: [],
+      players: [],
+      parentVM: { vd01Flag: true, vd02Flag: true, vd03Flag: true, vd04Flag: true },
+    };
+  },
+  mounted() {
+    this.$bus.$on(
+      "projectChange",
+      debounce((res) => {
+        this.projectInfo = res;
+        this.initVideoMenu();
+      })
+    );
+    this.$bus.$on(
+      "loadProjects",
+      debounce((prjs) => {
+        this.projectInfos = prjs;
+        //this.initVideoMenu();
+      })
+    );
+    this.$bus.$on(
+      "deptChange",
+      debounce((dept) => {
+        this.dept = dept;
+        //this.initVideoMenu();
+      })
+    );
+    if (this.$root.hasInitHeader) {
+      this.initMe();
+    }
+    this.$nextTick(() => {
+      for (let i = 1; i <= 4; i++) {
+        let player = new WasmPlayer(null, "vd0" + i, null, {
+          Height: true,
         });
-
+        this.players.push(player);
+      }
+    });
+  },
+  created() {
+    this.init();
+  },
+  computed: {
+    playDivCss() {
+      return {
+        width: (this.width + "").replace("px", "") + "px",
+        height: (this.height + "").replace("px", "") + "px",
+        position: "relative",
+      };
     },
-    created() {
-        this.init()
+    exStyle() {
+      return {
+        textAlign: "center",
+        width: (this.width + "").replace("px", "") + "px",
+        height: (this.height + "").replace("px", "") + "px",
+      };
     },
-    computed: {
-        playDivCss() {
-            return {
-                width: (this.width + "").replace("px", "") + "px",
-                height: (this.height + "").replace("px", "") + "px",
-                position: "relative"
-            }
+    PTZDiv() {
+      let W = parseInt((this.width + "").replace("px", ""));
+      let H = parseInt((this.height + "").replace("px", ""));
+      if (W < 400) {
+        W = "100px";
+        H = "100px";
+      } else {
+        W = "150px";
+        H = "150px";
+      }
+      return {
+        backgroundImage: "url('https://video.makalu.cc/img/jt.png')",
+        width: W,
+        height: H,
+        backgroundSize: "100%",
+        position: "relative",
+      };
+    },
+    PTZTop() {
+      return {
+        width: "33%",
+        height: "25%",
+        position: "absolute",
+        top: "0px",
+        left: "33%",
+        cursor: "pointer",
+      };
+    },
+    PTZBottom() {
+      return {
+        width: "33%",
+        height: "25%",
+        position: "absolute",
+        bottom: "0px",
+        left: "33%",
+        cursor: "pointer",
+      };
+    },
+    PTZLeft() {
+      return {
+        width: "25%",
+        height: "33%",
+        position: "absolute",
+        top: "33%",
+        left: "0px",
+        cursor: "pointer",
+      };
+    },
+    PTZRight() {
+      return {
+        width: "25%",
+        height: "33%",
+        position: "absolute",
+        top: "33%",
+        right: "0px",
+        cursor: "pointer",
+      };
+    },
+    VIBtnCss() {
+      return {
+        width: "30px",
+        height: "30px",
+        background: "#38314b",
+        border: "1px solid #38314b",
+        fontSize: "20px",
+        outline: "0",
+        color: "#FFFFFF",
+      };
+    },
+    zoomViewCss() {
+      return {
+        width: "75px",
+        height: "30px",
+        color: "#dddddd",
+        background: "rgba(65, 63, 70, 0.5)",
+        textAlign: "center",
+        border: "0px solid rgba(65, 63, 70, 0.5)",
+        outline: "0",
+        fontSize: "14px",
+      };
+    },
+  },
+  methods: {
+    initMe() {
+      this.projectInfo = this.$root.project || {};
+      this.dept = this.$root.dept || {};
+      this.projectInfos = this.$root.projects || [];
+      this.initVideoMenu();
+    },
+    init() {
+      //this.initVideoMenu();
+      //视频列表
+      //this.getVideoData()
+      //车辆数据初始化
+      //this.getVehicleData()
+      //预警分析
+      //this.warningInterval = setInterval(this.warningScroll,50);
+      //this.getVideoMapUrl()
+    },
+    getVideoMapUrl() {
+      $.post(
+        "/video/map/list",
+        {
+          projectId: this.projectId,
         },
-        exStyle() {
-            return {
-                textAlign: "center",
-                width: (this.width + "").replace("px", "") + "px",
-                height: (this.height + "").replace("px", "") + "px"
-            }
-        },
-        PTZDiv() {
-            let W = parseInt((this.width + "").replace("px", ""))
-            let H = parseInt((this.height + "").replace("px", ""))
-            if (W < 400) {
-                W = "100px"
-                H = "100px"
-            } else {
-                W = "150px"
-                H = "150px"
-            }
-            return {
-                backgroundImage: "url('https://video.makalu.cc/img/jt.png')",
-                width: W,
-                height: H,
-                backgroundSize: "100%",
-                position: "relative"
-            }
-        },
-        PTZTop() {
-            return {
-                width: "33%",
-                height: "25%",
-                position: "absolute",
-                top: "0px",
-                left: "33%",
-                cursor: "pointer"
-            }
-        },
-        PTZBottom() {
-            return {
-                width: "33%",
-                height: "25%",
-                position: "absolute",
-                bottom: "0px",
-                left: "33%",
-                cursor: "pointer"
-            }
-        },
-        PTZLeft() {
-            return {
-                width: "25%",
-                height: "33%",
-                position: "absolute",
-                top: "33%",
-                left: "0px",
-                cursor: "pointer"
-            }
-        },
-        PTZRight() {
-            return {
-                width: "25%",
-                height: "33%",
-                position: "absolute",
-                top: "33%",
-                right: "0px",
-                cursor: "pointer"
-            }
-        },
-        VIBtnCss() {
-            return {
-                width: "30px",
-                height: "30px",
-                background: "#38314b",
-                border: "1px solid #38314b",
-                fontSize: "20px",
-                outline: "0",
-                color: "#FFFFFF"
-            }
-        },
-        zoomViewCss() {
-            return {
-                width: "75px",
-                height: "30px",
-                color: "#dddddd",
-                background: "rgba(65, 63, 70, 0.5)",
-                textAlign: "center",
-                border: "0px solid rgba(65, 63, 70, 0.5)",
-                outline: "0",
-                fontSize: "14px"
-            }
+        (res) => {
+          if (res.rows[0]) {
+            this.videoMapStyle = {
+              background:
+                'url("' + res.rows[0].videoMap + '") no-repeat center/100% auto',
+            };
+          }
         }
+      );
     },
-    methods: {
-        initMe(){
-            this.projectInfo=this.$root.project||{};
-            this.dept=this.$root.dept||{};
-            this.projectInfos=this.$root.projects||[];
-            this.initVideoMenu();
-        },
-        init() {
+    showui(e) {
+      let that = this;
+      if (e) {
+        that.oWebControl.JS_CuttingPartWindow(630, 0, 250, 170);
+      } else {
+        that.setWndCover();
+      }
+    },
+    showsmallui2(e) {
+      let that = this;
+      if (e.flag && e.data.length > 4) {
+        var index = e.index;
+        var xIndex = 0;
+        switch (index) {
+          case 4:
+            xIndex = 100;
+            break;
+          case 5:
+            xIndex = 100;
+            break;
+          case 6:
+            xIndex = 310;
+            break;
+          case 7:
+            xIndex = 410;
+            break;
+          case 8:
+            xIndex = 520;
+            break;
+        }
+        that.oWebControl.JS_CuttingPartWindow(xIndex, 0, 545, 65);
+      } else {
+        that.setWndCover();
+      }
+    },
+    //视频概况
+    getVideoOverview() {
+      axios
+        .get("https://video.makalu.cc/mkl/api/getVideoOverview?projectId=163")
+        .then((res) => {
+          if (res.data != {} && res.data.data) {
+            this.cqNum = res.data.data.cqNum;
+            this.dgNum = res.data.data.dgNum;
+            this.aiNum = res.data.data.aiNum;
+            this.offLineNum = res.data.data.offLineNum;
 
-            //this.initVideoMenu();
-            //视频列表
-            //this.getVideoData()
-            //车辆数据初始化
-            //this.getVehicleData()
-
-            //预警分析
-            //this.warningInterval = setInterval(this.warningScroll,50);
-            //this.getVideoMapUrl()
-        },
-        getVideoMapUrl() {
-            $.post("/video/map/list", {
-                projectId: this.projectId
-            }, res => {
-                if (res.rows[0]) {
-                    this.videoMapStyle = {
-                        background: 'url("' + res.rows[0].videoMap + '") no-repeat center/100% auto'
-                    }
+            var data = [];
+            var allVideoList = res.data.data.allVideoList;
+            if (allVideoList) {
+              for (let i = 0; i < allVideoList.length; i++) {
+                var obj = {};
+                obj.x = allVideoList[i].x;
+                obj.y = allVideoList[i].y;
+                obj.angle = allVideoList[i].angle;
+                obj.title = allVideoList[i].title;
+                obj.state = allVideoList[i].state;
+                obj.token = allVideoList[i].token;
+                if (allVideoList[i].videoSource == 1) {
+                  obj.videoType = "h5s";
+                } else if (allVideoList[i].videoSource == 2) {
+                  obj.videoType = "hk";
+                } else if (allVideoList[i].videoSource == 3) {
+                  obj.videoType = "hzhk";
                 }
-            })
-        },
-        showui(e) {
-            let that = this
-            if (e) {
-                that.oWebControl.JS_CuttingPartWindow(630, 0, 250, 170);
-            } else {
-                that.setWndCover();
+                data.push(obj);
+              }
             }
-        },
-        showsmallui2(e) {
-            let that = this
-            if (e.flag && e.data.length > 4) {
-                var index = e.index;
-                var xIndex = 0;
-                switch (index) {
-                    case 4:
-                        xIndex = 100;
-                        break;
-                    case 5:
-                        xIndex = 100;
-                        break;
-                    case 6:
-                        xIndex = 310;
-                        break;
-                    case 7:
-                        xIndex = 410;
-                        break;
-                    case 8:
-                        xIndex = 520;
-                        break;
-                }
-                that.oWebControl.JS_CuttingPartWindow(xIndex, 0, 545, 65);
-            } else {
-                that.setWndCover();
-            }
-        },
-        //视频概况
-        getVideoOverview() {
-            axios.get("https://video.makalu.cc/mkl/api/getVideoOverview?projectId=163").then(res => {                
-                if (res.data != {} && res.data.data) {
 
-                    this.cqNum = res.data.data.cqNum;
-                    this.dgNum = res.data.data.dgNum;
-                    this.aiNum = res.data.data.aiNum;
-                    this.offLineNum = res.data.data.offLineNum;
+            var token = this.videoListData[0].videoList[0].token;
 
-                    var data = [];
-                    var allVideoList = res.data.data.allVideoList;
-                    if (allVideoList) {
-                        for (let i = 0; i < allVideoList.length; i++) {
-                            var obj = {};
-                            obj.x = allVideoList[i].x
-                            obj.y = allVideoList[i].y
-                            obj.angle = allVideoList[i].angle
-                            obj.title = allVideoList[i].title
-                            obj.state = allVideoList[i].state
-                            obj.token = allVideoList[i].token
-                            if (allVideoList[i].videoSource == 1) {
-                                obj.videoType = 'h5s'
-                            } else if (allVideoList[i].videoSource == 2) {
-                                obj.videoType = 'hk'
-                            } else if (allVideoList[i].videoSource == 3) {
-                                obj.videoType = 'hzhk'
-                            }
-                            data.push(obj)
-                        }
-                    }
-
-                    var token = this.videoListData[0].videoList[0].token
-                    
-                    for (let i = 0; i < data.length; i++) {
-                        if (token == data[i].token) {
-                            data[i].type = true
-                        } else {
-                            data[i].type = false
-                        }
-                    }
-
-                    this.VideoDistribution = data
-                }
-            })
-        },
-        //head选择项目返回值
-        onItemData(e) {
-            if (e.type == 1) {
-                location.href = '/weixin/screen/toVideo'
-            } else {
-                location.reload();
-                this.init();
-            }
-        },
-        //视频组件
-        playVideo() {
-            if (this.type != "hk") {
-                this.settingVideoHost()
-                this.initVideo()
-                this.fullScreenCss()
-            } else {
-                this.initPlugin("24476525", "hrFzLaMbo60QDvwazqdH", "8.129.144.255", 1443);
-                this.windowInitFun();
-            }
-        },
-        //项目视频获取数据
-        getVideoData() {
-           
-
-            var videoListData = [];
-
-            var cqVideoListData = {};
-            var cqVideoList = [];
-            var dgVideoListData = {};
-            var dgVideoList = [];
-            var aiVideoListData = {};
-            var aiVideoList = [];
-            var onlineVideoList = [];
-
-            cqVideoListData.project_abbreviation = '项目监控'
-            dgVideoListData.project_abbreviation = '吊钩监控'
-            aiVideoListData.project_abbreviation = 'AI视频'
-
-            var data = []
-            axios.post("//video.makalu.cc/ca/isc/info/getVideoPage", {
-               deptID: "00010001000300020008"
-            }).then(res => {
-                let token = res.data.data.token
-                axios.post("//video.makalu.cc/ca/isc/info/getVideoListFromDeptID", {
-                    "token": token
-                }).then(res => {
-                    data = res.data.data
-                    if (data.length > 0) {
-                        var allVideoList = res.data.data;
-
-                        for (let video of allVideoList) {
-                            video.type = false
-                            if (video.videoSource == 1) {
-                                video.videoType = "h5s"
-                            } else if (video.videoSource == 2) {
-                                video.videoType = "hk"
-                            } else if (video.videoSource == 3) {
-                                video.videoType = "hzhk"
-                            }
-                        }
-
-                        if (allVideoList.length > 0) {
-                            for (let i = 0; i < allVideoList.length; i++) {
-                                if (allVideoList[i].state != 0) {
-                                    onlineVideoList.push(allVideoList[i])
-                                }
-                                if (allVideoList[i].videoArea == 1) {
-                                    cqVideoList.push(allVideoList[i]);
-                                } else if (allVideoList[i].videoArea == 2) {
-                                    dgVideoList.push(allVideoList[i]);
-                                } else if (allVideoList[i].videoArea == 3) {
-                                    aiVideoList.push(allVideoList[i]);
-                                }
-                            }
-                        }
-
-
-
-                        cqVideoListData.videoList = cqVideoList;
-                        dgVideoListData.videoList = dgVideoList;
-                        aiVideoListData.videoList = aiVideoList;
-
-                        videoListData.push(cqVideoListData);
-                        videoListData.push(dgVideoListData);
-                        videoListData.push(aiVideoListData);
-
-                        this.cqNum = cqVideoList.length;
-                        this.dgNum = dgVideoList.length;
-                        this.aiNum = aiVideoList.length;
-                        this.offLineNum = onlineVideoList.length;
-
-                        //cqVideoListData.type = true;
-                        let init_video_list = 0
-                        if (cqVideoListData.videoList[0]) {
-                            cqVideoListData.videoList[0].type = true;
-                            init_video_list = 0
-                        } else if (dgVideoListData.videoList[0]) {
-                            dgVideoListData.videoList[0].type = true;
-                            init_video_list = 1
-                        } else if (aiVideoListData.videoList[0]) {
-                            aiVideoListData.videoList[0].type = true;
-                            init_video_list = 2
-                        }
-
-
-                        this.videoReturnData = videoListData[init_video_list].videoList[0]
-                        this.token = videoListData[init_video_list].videoList[0].token
-                        this.type = videoListData[init_video_list].videoList[0].videoType
-
-
-                        for (var i = 0; i < videoListData.length; i++) {
-                            if (i == 0) {
-                                videoListData[i].type = true
-                            } else {
-                                videoListData[i].type = false
-                            }
-                            videoListData[i].id = i
-                        }
-
-                        this.videoListData = videoListData
-                        
-                        this.playVideo();
-
-
-                        //视频概况，监控点位图
-                        //this.getVideoOverview()
-
-                    }
-                })
-            })
-
-        },
-        goAIPage() {
-            // location.href = '/weixin/screen/toAIVideoProject'
-            location.href = 'https://szh.makalu.cc/weixin/screen/toAIVideoProject'
-        },
-        //点击视频项目返回数据   默认第一台设备数据
-        videoProjectOneData(e) {
-            
-             var VideoDistribution = this.VideoDistribution
-             for (let i = 0; i < VideoDistribution.length; i++) {
-                 if (e.token == VideoDistribution[i].token) {
-                     VideoDistribution[i].type = true
-                 } else {
-                     VideoDistribution[i].type = false
-                 }
-             }
-             this.VideoDistribution = VideoDistribution
-
-             //修改车辆数据
-             var vehicle = this.vehicleListData
-             for (let i = 0; i < vehicle.length; i++) {
-                 vehicle[i].type = false
-                 for (let j = 0; j < vehicle[i].videoList.length; j++) {
-                     vehicle[i].videoList[j].type = false
-                 }
-             }
-             this.vehicleListData = vehicle
-
-            // //视频和车辆切换
-             this.videoType = true
-             this.vehicleType = false
-             //组件返回值
-             this.videoReturnData = e
-             this.clearContext()
-            // this.playVideo();
-        },
-        //点击视频设备返回数据
-        videoEquipmentData(e) {
-            
-             var VideoDistribution = this.VideoDistribution
-            for (let i = 0; i < VideoDistribution.length; i++) {
-                if (e.token == VideoDistribution[i].token) {
-                    VideoDistribution[i].type = true
-                } else {
-                    VideoDistribution[i].type = false
-                }
-            }
-            this.VideoDistribution = VideoDistribution
-
-
-            // //组件返回值
-            this.videoReturnData = e
-            this.token = e.token
-            this.type = e.videoType
-            this.clearContext()
-            //this.playVideo();
-        },
-
-        //车辆获取数据
-        getVehicleData() {
-            var data = [
-                {
-                    "other_projectId": JSON.parse(localStorage.getItem("data1")).spgl,
-                    //"project_abbreviation": JSON.parse(localStorage.getItem("data")).text,
-                    "id": JSON.parse(localStorage.getItem("data1")).id,
-                    "dept_id": JSON.parse(localStorage.getItem("data1")).dept_id,
-                    "videoList": [
-                        {
-                            "accountId": 1,
-                            "videoSource": 2,
-                            "distinguish": 0,
-                            "pro_id": JSON.parse(localStorage.getItem("data1")).id,
-                            "groupID": '',
-                            "id": 1,
-                            "state": 0,
-                            "projectId": JSON.parse(localStorage.getItem("data1")).id,
-                            "token": '',
-                        }
-                    ],
-                }
-            ]
             for (let i = 0; i < data.length; i++) {
-                data[i].type = false
-                for (let j = 0; j < data[i].videoList.length; j++) {
-                    if (i == 0 && j == 0) {
-                        data[i].videoList[j].type = true
-                    } else {
-                        data[i].videoList[j].type = false
+              if (token == data[i].token) {
+                data[i].type = true;
+              } else {
+                data[i].type = false;
+              }
+            }
+
+            this.VideoDistribution = data;
+          }
+        });
+    },
+    //head选择项目返回值
+    onItemData(e) {
+      if (e.type == 1) {
+        location.href = "/weixin/screen/toVideo";
+      } else {
+        location.reload();
+        this.init();
+      }
+    },
+    //视频组件
+    playVideo() {
+      if (this.type != "hk") {
+        this.settingVideoHost();
+        this.initVideo();
+        this.fullScreenCss();
+      } else {
+        this.initPlugin("24476525", "hrFzLaMbo60QDvwazqdH", "8.129.144.255", 1443);
+        this.windowInitFun();
+      }
+    },
+    //项目视频获取数据
+    getVideoData() {
+      var videoListData = [];
+
+      var cqVideoListData = {};
+      var cqVideoList = [];
+      var dgVideoListData = {};
+      var dgVideoList = [];
+      var aiVideoListData = {};
+      var aiVideoList = [];
+      var onlineVideoList = [];
+
+      cqVideoListData.project_abbreviation = "项目监控";
+      dgVideoListData.project_abbreviation = "吊钩监控";
+      aiVideoListData.project_abbreviation = "AI视频";
+
+      var data = [];
+      axios
+        .post("//video.makalu.cc/ca/isc/info/getVideoPage", {
+          deptID: "00010001000300020008",
+        })
+        .then((res) => {
+          let token = res.data.data.token;
+          axios
+            .post("//video.makalu.cc/ca/isc/info/getVideoListFromDeptID", {
+              token: token,
+            })
+            .then((res) => {
+              data = res.data.data;
+              if (data.length > 0) {
+                var allVideoList = res.data.data;
+
+                for (let video of allVideoList) {
+                  video.type = false;
+                  if (video.videoSource == 1) {
+                    video.videoType = "h5s";
+                  } else if (video.videoSource == 2) {
+                    video.videoType = "hk";
+                  } else if (video.videoSource == 3) {
+                    video.videoType = "hzhk";
+                  }
+                }
+
+                if (allVideoList.length > 0) {
+                  for (let i = 0; i < allVideoList.length; i++) {
+                    if (allVideoList[i].state != 0) {
+                      onlineVideoList.push(allVideoList[i]);
                     }
-                }
-            }
-            this.vehicleListData = data
-        },
-        //点击车辆项目返回数据   默认第一台设备数据
-        vehicleProjectOneData(e) {
-            //修改视频数据
-            var video = this.videoListData
-            for (let i = 0; i < video.length; i++) {
-                video[i].type = false
-                for (let j = 0; j < video[i].videoList.length; j++) {
-                    video[i].videoList[j].type = false
-                }
-            }
-            this.videoListData = video
-            //视频和车辆切换
-            this.videoType = false
-            this.vehicleType = true
-            this.clearContext()
-            //组件返回
-            this.vehicleMonitorData = []
-            axios.get("https://szh.makalu.cc/api/getPhotoUrl?projectId=" + e.projectId).then(res => {
-                if (res.data.data.length > 0) {
-                    var data = res.data.data.filter(item => item.deviceType != "04" && item.deviceType != "03").slice(0, 12)
-                    var newData = [{
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }, {
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }, {
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }];
-
-                    for (var i = 0; i < data.length; i++) {
-                        if (i <= 3) {
-                            newData[0].photoUrl = data[0].photoUrl;
-                            newData[0].uploadTime = data[0].uploadTime;
-                            newData[0].photoUrl2 = data[1].photoUrl;
-                            newData[0].uploadTime2 = data[1].uploadTime;
-                            newData[0].photoUrl3 = data[2].photoUrl;
-                            newData[0].uploadTime3 = data[2].uploadTime;
-                            newData[0].photoUrl4 = data[3].photoUrl;
-                            newData[0].uploadTime4 = data[3].uploadTime;
-                        } else if (i > 3 && i <= 7) {
-                            newData[1].photoUrl = data[4].photoUrl;
-                            newData[1].uploadTime = data[4].uploadTime;
-                            newData[1].photoUrl2 = data[5].photoUrl;
-                            newData[1].uploadTime2 = data[5].uploadTime;
-                            newData[1].photoUrl3 = data[6].photoUrl;
-                            newData[1].uploadTime3 = data[6].uploadTime;
-                            newData[1].photoUrl4 = data[7].photoUrl;
-                            newData[1].uploadTime4 = data[7].uploadTime;
-                        } else if (i > 7 && i <= 11) {
-                            newData[2].photoUrl = data[8].photoUrl;
-                            newData[2].uploadTime = data[8].uploadTime;
-                            newData[2].photoUrl2 = data[9].photoUrl;
-                            newData[2].uploadTime2 = data[1].uploadTime;
-                            newData[2].photoUrl3 = data[10].photoUrl;
-                            newData[2].uploadTime3 = data[10].uploadTime;
-                            newData[2].photoUrl4 = data[11].photoUrl;
-                            newData[2].uploadTime4 = data[11].uploadTime;
-                        }
+                    if (allVideoList[i].videoArea == 1) {
+                      cqVideoList.push(allVideoList[i]);
+                    } else if (allVideoList[i].videoArea == 2) {
+                      dgVideoList.push(allVideoList[i]);
+                    } else if (allVideoList[i].videoArea == 3) {
+                      aiVideoList.push(allVideoList[i]);
                     }
-                    this.vehicleMonitorData = newData;
+                  }
                 }
-            })
-        },
-        //点击车辆设备返回数据
-        vehicleEquipmentData(e) {
-            this.vehicleMonitorData = []
-            this.clearContext()
-            axios.get("https://szh.makalu.cc/api/getPhotoUrl?projectId=" + e.projectId).then(res => {
-                if (res.data.data.length > 0) {
-                    var data = res.data.data.filter(item => item.deviceType != "04" && item.deviceType != "03").slice(0, 12)
-                    var newData = [{
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }, {
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }, {
-                        photoUrl: '',
-                        uploadTime: '',
-                        photoUrl2: '',
-                        uploadTime2: '',
-                        photoUrl3: '',
-                        uploadTime3: '',
-                        photoUrl4: '',
-                        uploadTime4: '',
-                    }];
 
-                    for (var i = 0; i < data.length; i++) {
-                        if (i <= 3) {
-                            newData[0].photoUrl = data[0].photoUrl;
-                            newData[0].uploadTime = data[0].uploadTime;
-                            newData[0].photoUrl2 = data[1].photoUrl;
-                            newData[0].uploadTime2 = data[1].uploadTime;
-                            newData[0].photoUrl3 = data[2].photoUrl;
-                            newData[0].uploadTime3 = data[2].uploadTime;
-                            newData[0].photoUrl4 = data[3].photoUrl;
-                            newData[0].uploadTime4 = data[3].uploadTime;
-                        } else if (i > 3 && i <= 7) {
-                            newData[1].photoUrl = data[4].photoUrl;
-                            newData[1].uploadTime = data[4].uploadTime;
-                            newData[1].photoUrl2 = data[5].photoUrl;
-                            newData[1].uploadTime2 = data[5].uploadTime;
-                            newData[1].photoUrl3 = data[6].photoUrl;
-                            newData[1].uploadTime3 = data[6].uploadTime;
-                            newData[1].photoUrl4 = data[7].photoUrl;
-                            newData[1].uploadTime4 = data[7].uploadTime;
-                        } else if (i > 7 && i <= 11) {
-                            newData[2].photoUrl = data[8].photoUrl;
-                            newData[2].uploadTime = data[8].uploadTime;
-                            newData[2].photoUrl2 = data[9].photoUrl;
-                            newData[2].uploadTime2 = data[1].uploadTime;
-                            newData[2].photoUrl3 = data[10].photoUrl;
-                            newData[2].uploadTime3 = data[10].uploadTime;
-                            newData[2].photoUrl4 = data[11].photoUrl;
-                            newData[2].uploadTime4 = data[11].uploadTime;
-                        }
-                    }
-                    this.vehicleMonitorData = newData;
-                }
-            })
-            this.open = "close"
-        },
+                cqVideoListData.videoList = cqVideoList;
+                dgVideoListData.videoList = dgVideoList;
+                aiVideoListData.videoList = aiVideoList;
 
-        //车辆监控视频切换
-        onMonitoringVideo(n) {
-            this.mvNav = n
-        },
-
-        // 表格滚动  方法 --------- 开始
-        warningScroll() {
-            let maxHeight = this.$refs.warning.$el.querySelectorAll('.el-table__body')[0].offsetHeight;
-            let clientHeight = this.$refs.warning.bodyWrapper.clientHeight;
-            if (Math.abs(this.$refs.warning.bodyWrapper.scrollTop - (maxHeight - clientHeight)) < 5) { //预留5像素误差
-                this.$refs.warning.bodyWrapper.scrollTop = 0;
-            } else {
-                this.$refs.warning.bodyWrapper.scrollTop += 1;//32是每一行表格的高度，每秒滚一行
-            }
-        },
-        warningMouseEnter() {//鼠标移入停止滚动
-            clearInterval(this.warningInterval);
-        },
-        warningMouseLeave() {//鼠标离开继续滚动
-            this.warningInterval = setInterval(this.warningScroll, 30);
-        },
-        // 表格滚动  方法 ------  结束
-        //视频组件
-        clearContext() {
-            try {
-                if (this.oWebControl && this.oWebControl != null) {
-                    this.oWebControl.JS_HideWnd();  // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
-                    this.oWebControl.JS_Disconnect().then(function () {
-                        // 断开与插件服务连接成功
-                    },
-                        function () {
-                            // 断开与插件服务连接失败
-                        }
-                    );
-                }
-            } catch (e) {
-                console.log(e)
-            }
-            if (this.$refs.playDiv) {
-                this.$refs.playDiv.removeAttribute("poster")
-            }
-            try {
-                if (this.hls) {
-                    this.hls.destroy()
-                }
-            } catch (e) {
-                console.log(e);
-            }
-            try {
-                if (this.h5s) {
-                    H5sPlayerWS.prototype.disconnect
-                    this.h5s.disconnect()
-                }
-            } catch (e) {
-                console.log(e)
-            }
-            this.hls = new Hls()
-        },
-        initH5sPlay() {
-            let that = this
-            let host = window.location.protocol == "https:" ? "47.106.234.91:8443" : "47.106.234.91:8080"
-            axios.post(that.videoHost + "/mkl/api/h5sLogin", {}).then(res => {
-                let conf = {
-                    videodom: that.$refs.playDiv,
-                    protocol: window.location.protocol,
-                    host: "h5s.makalu.cc",
-                    rootpath: '/',
-                    token: that.token,
-                    hlsver: 'v1',
-                    session: res.data
-                }
-                that.$refs.playDiv.setAttribute("autoplay", "autoplay")
-                that.h5s = H5sPlayerCreate(conf)
-                that.h5s.connect()
-                that.timeoutDetectionFun()
-            })
-        },
-        initHlsPlay() {
-            this.hlsvideo = this.$refs.playDiv;
-            this.hls.destroy()
-            this.hls = new Hls()
-            let that = this
-            axios.post(this.videoHost + "/ca/isc/info/getPlay", {
-                protocol: "hls",
-                playAdder: that.token
-            }).then(res => {
-                if (res.data.code != "200") {
-                    that.exception = true
-                    setTimeout(function () {
-                        that.initVideo()
-                    }, 2000)
-                } else {
-                    that.hls.loadSource(eval("(" + res.data.data + ")").url);
-                    that.hls.attachMedia(that.hlsvideo);
-                    that.hls.on(Hls.Events.MANIFEST_PARSED, function () {
-                        that.hlsvideo.play();
-                    })
-                }
-                that.timeoutDetectionFun()
-            }).catch(err => {
-                that.exception = true
-            })
-        },
-        initRtmpPlay() {
-            let that = this
-            let video = this.$refs.playDiv
-            axios.post(this.videoHost + "/ca/isc/info/getPlay", {
-                protocol: "rtmp",
-                playAdder: that.token
-            }).then(res => {
-                if (res.data.code != "200") {
-                    that.exception = true
-                    setTimeout(function () {
-                        that.initVideo()
-                    }, 2000)
-                } else {
-                    const videoParam = [{
-                        type: "video/rtmp",
-                        src: eval("(" + res.data.data + ")").url
-                    }];
-                    that.rtmpVideo = videojs(video)
-                    that.rtmpVideo.ready(function () {
-                        that.rtmpVideo.src(videoParam)
-                        that.rtmpVideo.load()
-                        that.rtmpVideo.play()
-                    })
-                    that.timeoutDetectionFun()
-                }
-            }).catch(err => {
-                that.exception = true
-            })
-        },
-        play() {
-            if (this.type === "h5s") {
-                if (this.isplay) {
-                    this.h5s.disconnect()
-                } else {
-                    this.h5s.connect();
-                }
-                this.isplay = !this.isplay
-            }
-            if (this.type === "hls") {
-                if (this.isplay) {
-                    this.hlsvideo.stop()
-                } else {
-                    this.hlsvideo.play()
-                }
-                this.isplay = !this.isplay
-            }
-            if (this.type === "rtmp") {
-                if (this.isplay) {
-                    this.rtmpVideo.pause()
-                } else {
-                    this.rtmpVideo.play()
-                }
-                this.isplay = !this.isplay
-            }
-        },
-        guid() {
-            function S4() {
-                return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
-            }
-
-            return (S4() + S4() + S4() + S4() + S4() + S4() + S4() + S4());
-        },
-        settingVideoHost() {
-            this.videoHost = window.location.protocol + "//video.makalu.cc"
-        },
-        initVideo() {
-            let that = this
-            this.exception = false
-            this.clearContext()
-            this.$nextTick(function () {
-                switch (that.type) {
-                    case "h5s":
-                        that.initH5sPlay()
-                        break
-                    case "hls":
-                        that.initHlsPlay()
-                        break
-                    case "rtmp":
-                        that.initRtmpPlay()
-                        break
-                    case "hk":
-                        that.initPlugin("24476525", "hrFzLaMbo60QDvwazqdH", "8.129.144.255", 1443);
-                        that.windowInitFun();
-                        break
-                    case "hzhk":
-                        that.initPlugin("21332599", "772SPtFNM1BHMyKHq4xh", "39.101.132.124", 443);
-                        that.windowInitFun();
-                        break
-                }
-            })
-
-        },
-        tripodHandle(order) {
-            axios.post(this.videoHost + "/mkl/api/moveCamera", {
-                token: this.token,
-                action: this.type === "h5s" ? order.toLowerCase() : order,
-                h5s: this.type == "h5s"
-            })
-            console.log("按下")
-        },
-        stop() {
-            axios.post(this.videoHost + "/mkl/api/moveCamera", {
-                token: this.token,
-                action: "stop",
-                h5s: this.type == "h5s"
-            })
-            console.log("松开")
-        },
-        fullScreenCss() {
-            this.fullScreenWidth = (document.body.scrollWidth - 10) + "px"
-            this.fullScreenHeight = (document.body.scrollHeight - 10) + "px"
-        },
-        fullScreenFun() {
-            this.fullScreenShow = true
-            this.$emit("fullScreenFun")
-        },
-        fullScreenCloseFun() {
-            this.fullScreenShow = false
-        },
-        timeoutDetectionFun() {
-            let that = this
-            //超时时间检测是否正常获取到数据流默认为5秒
-            this.timeoutDetection = setTimeout(function () {
-                if (parseInt(that.hlsvideo.currentTime.toFixed(1)) == 0) {
-                    that.hls.destroy()
-                    that.exception = true
-                    if (that.restart) {
-                        that.timeoutDetectionInit = setTimeout(function () {
-                            that.initVideo()
-                        }, 2000)
-                    }
-                }
-            }, this.outTime * 1000)
-        },
-        //海康插件开始
-        // 创建播放实例
-        initPlugin(appkey, secret, ip, port) {
-            let that = this
-            that.oWebControl = new WebControl({
-                szPluginContainer: "uuid",                       // 指定容器id
-                iServicePortStart: 15900,                           // 指定起止端口号，建议使用该值
-                iServicePortEnd: 15909,
-                szClassId: "23BF3B0A-2C56-4D97-9C03-0CB103AA8F11",   // 用于IE10使用ActiveX的clsid
-                cbConnectSuccess: function () {                     // 创建WebControl实例成功
-                    that.oWebControl.JS_StartService("window", {         // WebControl实例创建成功后需要启动服务
-                        dllPath: "./VideoPluginConnect.dll"         // 值"./VideoPluginConnect.dll"写死
-                    }).then(function () {                           // 启动插件服务成功
-                        that.oWebControl.JS_SetWindowControlCallback({   // 设置消息回调
-                            cbIntegrationCallBack: that.cbIntegrationCallBack
-                        });
-
-                        that.oWebControl.JS_CreateWnd("HKPlayWindowControl", Number(that.width), Number(that.height)).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定
-                            that.initHKPlay(appkey, secret, ip, port);  // 创建播放实例成功后初始化
-                        });
-                    }, function () { // 启动插件服务失败
-                    });
-                },
-                cbConnectError: function () { // 创建WebControl实例失败
-                    this.oWebControl = null;
-                    that.restartInit = true
-                    WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数，采用wakeup来启动程序
-                    that.initCount++;
-                    if (that.initCount < 3) {
-                        setTimeout(function () {
-                            that.initPlugin(appkey, secret, ip, port);
-                        }, 3000)
-                    } else {
-                        that.restartInit = false
-                        that.initError = true
-                        that.initCount = 0
-                    }
-                },
-                cbConnectClose: function (bNormalClose) {
-                    // 异常断开：bNormalClose = false
-                    // JS_Disconnect正常断开：bNormalClose = true
-                    // console.log("cbConnectClose");
-                    this.oWebControl = null;
-                }
-            });
-        },
-        // 设置窗口控制回调
-        setCallbacks() {
-            let that = this
-            that.oWebControl.JS_SetWindowControlCallback({
-                cbIntegrationCallBack: that.cbIntegrationCallBack
-            });
-        },
-        // 推送消息
-        cbIntegrationCallBack(oData) {
-            // console.log(JSON.stringify(oData.responseMsg));
-        },
-        //初始化
-        initHKPlay(Appkey, Secret, Ip, Port) {
-            let that = this
-            this.getPubKey(function () {
-
-                ////////////////////////////////// 请自行修改以下变量值	////////////////////////////////////
-                let appkey = Appkey;                           //综合安防管理平台提供的appkey，必填
-                let secret = that.setEncrypt(Secret);   //综合安防管理平台提供的secret，必填
-                let ip = Ip;                           //综合安防管理平台IP地址，必填
-                let playMode = 0;                                  //初始播放模式：0-预览，1-回放
-                let port = Port;                                    //综合安防管理平台端口，若启用HTTPS协议，默认443
-                let snapDir = "D:\\SnapDir";                       //抓图存储路径
-                let videoDir = "D:\\VideoDir";                     //紧急录像或录像剪辑存储路径
-                let layout = "1x1";                                //playMode指定模式的布局
-                let enableHTTPS = 1;                               //是否启用HTTPS协议与综合安防管理平台交互，这里总是填1
-                let encryptedFields = 'secret';					   //加密字段，默认加密领域为secret
-                let showToolbar = 1;                               //是否显示工具栏，0-不显示，非0-显示
-                let showSmart = 1;                                 //是否显示智能信息（如配置移动侦测后画面上的线框），0-不显示，非0-显示
-                let buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769";  //自定义工具条按钮
-                let toolBarButtonIDs = "4098";
-                ////////////////////////////////// 请自行修改以上变量值	////////////////////////////////////
-
-                that.oWebControl.JS_RequestInterface({
-                    funcName: "init",
-                    argument: JSON.stringify({
-                        appkey: appkey,                            //API网关提供的appkey
-                        secret: secret,                            //API网关提供的secret
-                        ip: ip,                                    //API网关IP地址
-                        playMode: playMode,                        //播放模式（决定显示预览还是回放界面）
-                        port: port,                                //端口
-                        snapDir: snapDir,                          //抓图存储路径
-                        videoDir: videoDir,                        //紧急录像或录像剪辑存储路径
-                        layout: layout,                            //布局
-                        enableHTTPS: enableHTTPS,                  //是否启用HTTPS协议
-                        encryptedFields: encryptedFields,          //加密字段
-                        showToolbar: showToolbar,                  //是否显示工具栏
-                        showSmart: showSmart,                      //是否显示智能信息
-                        buttonIDs: buttonIDs,                       //自定义工具条按钮
-                        toolBarButtonIDs: toolBarButtonIDs
-                    })
-                }).then(function (oData) {
-                    that.oWebControl.JS_Resize(Number(that.width), Number(that.height));  // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
-                    that.startPreviewFun()
-                });
-            });
-        },
-        //获取公钥
-        getPubKey(callback) {
-            let that = this
-            that.oWebControl.JS_RequestInterface({
-                funcName: "getRSAPubKey",
-                argument: JSON.stringify({
-                    keyLength: 1024
-                })
-            }).then(function (oData) {
-                // console.log(oData);
-                if (oData.responseMsg.data) {
-                    that.pubKey = oData.responseMsg.data;
-                    callback()
-                }
-            })
-        },
-        //RSA加密
-        setEncrypt(value) {
-            let encrypt = new JSEncrypt();
-            encrypt.setPublicKey(this.pubKey);
-            return encrypt.encrypt(value);
-        },
-        // 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
-        setWndCover() {
-            let that = this
-            let iWidth = $(window).width();
-            let iHeight = $(window).height();
-            let oDivRect = document.getElementById("HKPlayWindowControl").getBoundingClientRect();
-
-            let iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left) : 0;
-            let iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top) : 0;
-            let iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
-            let iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
-
-            iCoverLeft = (iCoverLeft > 1000) ? 1000 : iCoverLeft;
-            iCoverTop = (iCoverTop > 600) ? 600 : iCoverTop;
-            iCoverRight = (iCoverRight > 1000) ? 1000 : iCoverRight;
-            iCoverBottom = (iCoverBottom > 600) ? 600 : iCoverBottom;
-
-            that.oWebControl.JS_RepairPartWindow(0, 0, 1001, 600);    // 多1个像素点防止还原后边界缺失一个像素条
-            if (iCoverLeft != 0) {
-                that.oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 600);
-            }
-            if (iCoverTop != 0) {
-                that.oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop);    // 多剪掉一个像素条，防止出现剪掉一部分窗口后出现一个像素条
-            }
-            if (iCoverRight != 0) {
-                that.oWebControl.JS_CuttingPartWindow(1000 - iCoverRight, 0, iCoverRight, 600);
-            }
-            if (iCoverBottom != 0) {
-                that.oWebControl.JS_CuttingPartWindow(0, 600 - iCoverBottom, 1000, iCoverBottom);
-            }
-        },
-        windowInitFun() {
-            let that = this
-            // 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
-            $(window).resize(function () {
-                if (that.oWebControl != null) {
-                    that.oWebControl.JS_Resize(Number(that.width), Number(that.height));
-                    that.setWndCover();
-                }
-            });
-
-            // 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
-            $(window).scroll(function () {
-                if (that.oWebControl != null) {
-                    that.oWebControl.JS_Resize(Number(that.width), Number(that.height));
-                    that.setWndCover();
-                }
-            });
-
-            // 标签关闭
-            window.onunload = function () {
-                if (that.oWebControl != null) {
-                    that.oWebControl.JS_HideWnd();   // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
-                    that.oWebControl.JS_Disconnect().then(function () {  // 断开与插件服务连接成功
-                    },
-                        function () {  // 断开与插件服务连接失败
-                        });
-                }
-            }
-
-        },
-        //视频预览功能
-        startPreviewFun() {
-            let that = this
-            let streamMode = 0;                                     //主子码流标识：0-主码流，1-子码流
-            let transMode = 1;                                      //传输协议：0-UDP，1-TCP
-            let gpuMode = 0;                                        //是否启用GPU硬解，0-不启用，1-启用
-            let wndId = 1;                                         //播放窗口序号（在2x2以上布局下可指定播放窗口）
-            let cameraIndexCode = this.token
-            cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
-            cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
-            // console.log(cameraIndexCode)
-            that.oWebControl.JS_RequestInterface({
-                funcName: "startPreview",
-                argument: JSON.stringify({
-                    cameraIndexCode: cameraIndexCode,                //监控点编号
-                    streamMode: streamMode,                         //主子码流标识
-                    transMode: transMode,                           //传输协议
-                    gpuMode: gpuMode,                               //是否开启GPU硬解
-                    wndId: wndId                                     //可指定播放窗口
-                })
-            })
-        },
-        //停止全部预览
-        stopAllPreviewFun() {
-            this.oWebControl.JS_RequestInterface({
-                funcName: "stopAllPreview"
-            });
-        },
-        closeHk() {
-            // console.log(this.oWebControl)
-            this.oWebControl.JS_HideWnd();  // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
-            this.oWebControl.JS_Disconnect().then(function () { }, function () { });
-        },
-        videoPlay(video) {
-            
-            //监控点位图数据处理
-            // var VideoDistribution = this.VideoDistribution
-            // for (var i = 0; i < VideoDistribution.length; i++) {
-            //     if (video.token == VideoDistribution[i].token) {
-            //         VideoDistribution[i].type = true
-            //     } else {
-            //         VideoDistribution[i].type = false
-            //     }
-            // }
-            // this.VideoDistribution = VideoDistribution
-
-            // //视频列表数据处理
-            // var videoListData = this.videoListData
-            // for (var i = 0; i < videoListData.length; i++) {
-            //     videoListData[i].type = false
-            //     for (var j = 0; j < videoListData[i].videoList.length; j++) {
-            //         if (video.token == videoListData[i].videoList[j].token) {
-            //             videoListData[i].type = true
-            //             videoListData[i].videoList[j].type = true
-            //         } else {
-            //             videoListData[i].videoList[j].type = false
-            //         }
-            //     }
-            // }
-            // this.videoListData = videoListData
-
-            // this.videoReturnData = video
-            // this.token = video.token
-            // this.type = video.videoType
-            // this.playVideo();
-
-        },
-        /** 查询视频配置列表 */
-        initVideoMenu() {
-            var videoListData = [];
-
-            var cqVideoListData = {};
-            //var cqVideoList = [];
-            var dgVideoListData = {};
-            //var dgVideoList = [];
-            var aiVideoListData = {};
-            //var aiVideoList = [];
-            //var onlineVideoList = [];
-
-            cqVideoListData.id=1;
-            cqVideoListData.type=true;
-            cqVideoListData.project_abbreviation = '项目监控'
-            //dgVideoListData.id=2;
-            //dgVideoListData.type=true;
-            //dgVideoListData.project_abbreviation = '吊钩监控'
-            //aiVideoListData.id=3;
-            //aiVideoListData.type=true;
-            //aiVideoListData.project_abbreviation = 'AI视频'
-
-            this.$api.video.listView(this.dept?.id||0,this.projectInfo?.id||0).then((response) => {
-                cqVideoListData.videoList = response.data;
                 videoListData.push(cqVideoListData);
-                //videoListData.push(dgVideoListData);
-                //videoListData.push(aiVideoListData);
+                videoListData.push(dgVideoListData);
+                videoListData.push(aiVideoListData);
+
+                this.cqNum = cqVideoList.length;
+                this.dgNum = dgVideoList.length;
+                this.aiNum = aiVideoList.length;
+                this.offLineNum = onlineVideoList.length;
+
+                //cqVideoListData.type = true;
+                let init_video_list = 0;
+                if (cqVideoListData.videoList[0]) {
+                  cqVideoListData.videoList[0].type = true;
+                  init_video_list = 0;
+                } else if (dgVideoListData.videoList[0]) {
+                  dgVideoListData.videoList[0].type = true;
+                  init_video_list = 1;
+                } else if (aiVideoListData.videoList[0]) {
+                  aiVideoListData.videoList[0].type = true;
+                  init_video_list = 2;
+                }
+
+                this.videoReturnData = videoListData[init_video_list].videoList[0];
+                this.token = videoListData[init_video_list].videoList[0].token;
+                this.type = videoListData[init_video_list].videoList[0].videoType;
+
+                for (var i = 0; i < videoListData.length; i++) {
+                  if (i == 0) {
+                    videoListData[i].type = true;
+                  } else {
+                    videoListData[i].type = false;
+                  }
+                  videoListData[i].id = i;
+                }
+
                 this.videoListData = videoListData;
-                this.cqNum=response.data.length;
-                let offNum=0;
-                response.data.forEach((it) =>{
-                    if(it.signalState!="1"){
-                        offNum++;
-                    }
-                });
-                this.offLineNum = offNum;
+
+                this.playVideo();
+
+                //视频概况，监控点位图
+                //this.getVideoOverview()
+              }
             });
+        });
+    },
+    goAIPage() {
+      // location.href = '/weixin/screen/toAIVideoProject'
+      location.href = "https://szh.makalu.cc/weixin/screen/toAIVideoProject";
+    },
+    //点击视频项目返回数据   默认第一台设备数据
+    videoProjectOneData(e) {
+      var VideoDistribution = this.VideoDistribution;
+      for (let i = 0; i < VideoDistribution.length; i++) {
+        if (e.token == VideoDistribution[i].token) {
+          VideoDistribution[i].type = true;
+        } else {
+          VideoDistribution[i].type = false;
+        }
+      }
+      this.VideoDistribution = VideoDistribution;
+
+      //修改车辆数据
+      var vehicle = this.vehicleListData;
+      for (let i = 0; i < vehicle.length; i++) {
+        vehicle[i].type = false;
+        for (let j = 0; j < vehicle[i].videoList.length; j++) {
+          vehicle[i].videoList[j].type = false;
+        }
+      }
+      this.vehicleListData = vehicle;
+
+      // //视频和车辆切换
+      this.videoType = true;
+      this.vehicleType = false;
+      //组件返回值
+      this.videoReturnData = e;
+      this.clearContext();
+      // this.playVideo();
+    },
+    //点击视频设备返回数据
+    videoEquipmentData(e) {
+      var VideoDistribution = this.VideoDistribution;
+      for (let i = 0; i < VideoDistribution.length; i++) {
+        if (e.token == VideoDistribution[i].token) {
+          VideoDistribution[i].type = true;
+        } else {
+          VideoDistribution[i].type = false;
+        }
+      }
+      this.VideoDistribution = VideoDistribution;
+
+      // //组件返回值
+      this.videoReturnData = e;
+      this.token = e.token;
+      this.type = e.videoType;
+      this.clearContext();
+      //this.playVideo();
+    },
+
+    //车辆获取数据
+    getVehicleData() {
+      var data = [
+        {
+          other_projectId: JSON.parse(localStorage.getItem("data1")).spgl,
+          //"project_abbreviation": JSON.parse(localStorage.getItem("data")).text,
+          id: JSON.parse(localStorage.getItem("data1")).id,
+          dept_id: JSON.parse(localStorage.getItem("data1")).dept_id,
+          videoList: [
+            {
+              accountId: 1,
+              videoSource: 2,
+              distinguish: 0,
+              pro_id: JSON.parse(localStorage.getItem("data1")).id,
+              groupID: "",
+              id: 1,
+              state: 0,
+              projectId: JSON.parse(localStorage.getItem("data1")).id,
+              token: "",
+            },
+          ],
         },
-         // 表格滚动调用的函数
-        beforeDestroy() {
-            clearInterval(this.warningInterval);
-        },
-        handlePlay(it, idx) {
-            this.videoReturnData=it;
-        this.currentIndex = idx;
-        this.showVideo = false;
-        this.url0 = "";
-        this.url1 = "";
-        this.url2 = "";
-        this.url3 = "";
-        this.showVideoView0 = true;
-        this.showVideoView1 = true;
-        this.showVideoView2 = true;
-        this.showVideoView3 = true;
-        this.videoDvrNumber = it.videoDvrNumber;
-        this.initVideo(
-            it.videoDvrNumber,
-            this.request.replace("{{videoDvrNumber}}", it.videoDvrNumber)
+      ];
+      for (let i = 0; i < data.length; i++) {
+        data[i].type = false;
+        for (let j = 0; j < data[i].videoList.length; j++) {
+          if (i == 0 && j == 0) {
+            data[i].videoList[j].type = true;
+          } else {
+            data[i].videoList[j].type = false;
+          }
+        }
+      }
+      this.vehicleListData = data;
+    },
+    //点击车辆项目返回数据   默认第一台设备数据
+    vehicleProjectOneData(e) {
+      //修改视频数据
+      var video = this.videoListData;
+      for (let i = 0; i < video.length; i++) {
+        video[i].type = false;
+        for (let j = 0; j < video[i].videoList.length; j++) {
+          video[i].videoList[j].type = false;
+        }
+      }
+      this.videoListData = video;
+      //视频和车辆切换
+      this.videoType = false;
+      this.vehicleType = true;
+      this.clearContext();
+      //组件返回
+      this.vehicleMonitorData = [];
+      axios
+        .get("https://szh.makalu.cc/api/getPhotoUrl?projectId=" + e.projectId)
+        .then((res) => {
+          if (res.data.data.length > 0) {
+            var data = res.data.data
+              .filter((item) => item.deviceType != "04" && item.deviceType != "03")
+              .slice(0, 12);
+            var newData = [
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+            ];
+
+            for (var i = 0; i < data.length; i++) {
+              if (i <= 3) {
+                newData[0].photoUrl = data[0].photoUrl;
+                newData[0].uploadTime = data[0].uploadTime;
+                newData[0].photoUrl2 = data[1].photoUrl;
+                newData[0].uploadTime2 = data[1].uploadTime;
+                newData[0].photoUrl3 = data[2].photoUrl;
+                newData[0].uploadTime3 = data[2].uploadTime;
+                newData[0].photoUrl4 = data[3].photoUrl;
+                newData[0].uploadTime4 = data[3].uploadTime;
+              } else if (i > 3 && i <= 7) {
+                newData[1].photoUrl = data[4].photoUrl;
+                newData[1].uploadTime = data[4].uploadTime;
+                newData[1].photoUrl2 = data[5].photoUrl;
+                newData[1].uploadTime2 = data[5].uploadTime;
+                newData[1].photoUrl3 = data[6].photoUrl;
+                newData[1].uploadTime3 = data[6].uploadTime;
+                newData[1].photoUrl4 = data[7].photoUrl;
+                newData[1].uploadTime4 = data[7].uploadTime;
+              } else if (i > 7 && i <= 11) {
+                newData[2].photoUrl = data[8].photoUrl;
+                newData[2].uploadTime = data[8].uploadTime;
+                newData[2].photoUrl2 = data[9].photoUrl;
+                newData[2].uploadTime2 = data[1].uploadTime;
+                newData[2].photoUrl3 = data[10].photoUrl;
+                newData[2].uploadTime3 = data[10].uploadTime;
+                newData[2].photoUrl4 = data[11].photoUrl;
+                newData[2].uploadTime4 = data[11].uploadTime;
+              }
+            }
+            this.vehicleMonitorData = newData;
+          }
+        });
+    },
+    //点击车辆设备返回数据
+    vehicleEquipmentData(e) {
+      this.vehicleMonitorData = [];
+      this.clearContext();
+      axios
+        .get("https://szh.makalu.cc/api/getPhotoUrl?projectId=" + e.projectId)
+        .then((res) => {
+          if (res.data.data.length > 0) {
+            var data = res.data.data
+              .filter((item) => item.deviceType != "04" && item.deviceType != "03")
+              .slice(0, 12);
+            var newData = [
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+              {
+                photoUrl: "",
+                uploadTime: "",
+                photoUrl2: "",
+                uploadTime2: "",
+                photoUrl3: "",
+                uploadTime3: "",
+                photoUrl4: "",
+                uploadTime4: "",
+              },
+            ];
+
+            for (var i = 0; i < data.length; i++) {
+              if (i <= 3) {
+                newData[0].photoUrl = data[0].photoUrl;
+                newData[0].uploadTime = data[0].uploadTime;
+                newData[0].photoUrl2 = data[1].photoUrl;
+                newData[0].uploadTime2 = data[1].uploadTime;
+                newData[0].photoUrl3 = data[2].photoUrl;
+                newData[0].uploadTime3 = data[2].uploadTime;
+                newData[0].photoUrl4 = data[3].photoUrl;
+                newData[0].uploadTime4 = data[3].uploadTime;
+              } else if (i > 3 && i <= 7) {
+                newData[1].photoUrl = data[4].photoUrl;
+                newData[1].uploadTime = data[4].uploadTime;
+                newData[1].photoUrl2 = data[5].photoUrl;
+                newData[1].uploadTime2 = data[5].uploadTime;
+                newData[1].photoUrl3 = data[6].photoUrl;
+                newData[1].uploadTime3 = data[6].uploadTime;
+                newData[1].photoUrl4 = data[7].photoUrl;
+                newData[1].uploadTime4 = data[7].uploadTime;
+              } else if (i > 7 && i <= 11) {
+                newData[2].photoUrl = data[8].photoUrl;
+                newData[2].uploadTime = data[8].uploadTime;
+                newData[2].photoUrl2 = data[9].photoUrl;
+                newData[2].uploadTime2 = data[1].uploadTime;
+                newData[2].photoUrl3 = data[10].photoUrl;
+                newData[2].uploadTime3 = data[10].uploadTime;
+                newData[2].photoUrl4 = data[11].photoUrl;
+                newData[2].uploadTime4 = data[11].uploadTime;
+              }
+            }
+            this.vehicleMonitorData = newData;
+          }
+        });
+      this.open = "close";
+    },
+
+    //车辆监控视频切换
+    onMonitoringVideo(n) {
+      this.mvNav = n;
+    },
+
+    // 表格滚动  方法 --------- 开始
+    warningScroll() {
+      let maxHeight = this.$refs.warning.$el.querySelectorAll(".el-table__body")[0]
+        .offsetHeight;
+      let clientHeight = this.$refs.warning.bodyWrapper.clientHeight;
+      if (
+        Math.abs(this.$refs.warning.bodyWrapper.scrollTop - (maxHeight - clientHeight)) <
+        5
+      ) {
+        //预留5像素误差
+        this.$refs.warning.bodyWrapper.scrollTop = 0;
+      } else {
+        this.$refs.warning.bodyWrapper.scrollTop += 1; //32是每一行表格的高度，每秒滚一行
+      }
+    },
+    warningMouseEnter() {
+      //鼠标移入停止滚动
+      clearInterval(this.warningInterval);
+    },
+    warningMouseLeave() {
+      //鼠标离开继续滚动
+      this.warningInterval = setInterval(this.warningScroll, 30);
+    },
+    // 表格滚动  方法 ------  结束
+    //视频组件
+    clearContext() {
+      try {
+        if (this.oWebControl && this.oWebControl != null) {
+          this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
+          this.oWebControl.JS_Disconnect().then(
+            function () {
+              // 断开与插件服务连接成功
+            },
+            function () {
+              // 断开与插件服务连接失败
+            }
+          );
+        }
+      } catch (e) {
+        console.log(e);
+      }
+      if (this.$refs.playDiv) {
+        this.$refs.playDiv.removeAttribute("poster");
+      }
+      try {
+        if (this.hls) {
+          this.hls.destroy();
+        }
+      } catch (e) {
+        console.log(e);
+      }
+      try {
+        if (this.h5s) {
+          H5sPlayerWS.prototype.disconnect;
+          this.h5s.disconnect();
+        }
+      } catch (e) {
+        console.log(e);
+      }
+      this.hls = new Hls();
+    },
+    initH5sPlay() {
+      let that = this;
+      let host =
+        window.location.protocol == "https:"
+          ? "47.106.234.91:8443"
+          : "47.106.234.91:8080";
+      axios.post(that.videoHost + "/mkl/api/h5sLogin", {}).then((res) => {
+        let conf = {
+          videodom: that.$refs.playDiv,
+          protocol: window.location.protocol,
+          host: "h5s.makalu.cc",
+          rootpath: "/",
+          token: that.token,
+          hlsver: "v1",
+          session: res.data,
+        };
+        that.$refs.playDiv.setAttribute("autoplay", "autoplay");
+        that.h5s = H5sPlayerCreate(conf);
+        that.h5s.connect();
+        that.timeoutDetectionFun();
+      });
+    },
+    initHlsPlay() {
+      this.hlsvideo = this.$refs.playDiv;
+      this.hls.destroy();
+      this.hls = new Hls();
+      let that = this;
+      axios
+        .post(this.videoHost + "/ca/isc/info/getPlay", {
+          protocol: "hls",
+          playAdder: that.token,
+        })
+        .then((res) => {
+          if (res.data.code != "200") {
+            that.exception = true;
+            setTimeout(function () {
+              that.initVideo();
+            }, 2000);
+          } else {
+            that.hls.loadSource(eval("(" + res.data.data + ")").url);
+            that.hls.attachMedia(that.hlsvideo);
+            that.hls.on(Hls.Events.MANIFEST_PARSED, function () {
+              that.hlsvideo.play();
+            });
+          }
+          that.timeoutDetectionFun();
+        })
+        .catch((err) => {
+          that.exception = true;
+        });
+    },
+    initRtmpPlay() {
+      let that = this;
+      let video = this.$refs.playDiv;
+      axios
+        .post(this.videoHost + "/ca/isc/info/getPlay", {
+          protocol: "rtmp",
+          playAdder: that.token,
+        })
+        .then((res) => {
+          if (res.data.code != "200") {
+            that.exception = true;
+            setTimeout(function () {
+              that.initVideo();
+            }, 2000);
+          } else {
+            const videoParam = [
+              {
+                type: "video/rtmp",
+                src: eval("(" + res.data.data + ")").url,
+              },
+            ];
+            that.rtmpVideo = videojs(video);
+            that.rtmpVideo.ready(function () {
+              that.rtmpVideo.src(videoParam);
+              that.rtmpVideo.load();
+              that.rtmpVideo.play();
+            });
+            that.timeoutDetectionFun();
+          }
+        })
+        .catch((err) => {
+          that.exception = true;
+        });
+    },
+    play() {
+      if (this.type === "h5s") {
+        if (this.isplay) {
+          this.h5s.disconnect();
+        } else {
+          this.h5s.connect();
+        }
+        this.isplay = !this.isplay;
+      }
+      if (this.type === "hls") {
+        if (this.isplay) {
+          this.hlsvideo.stop();
+        } else {
+          this.hlsvideo.play();
+        }
+        this.isplay = !this.isplay;
+      }
+      if (this.type === "rtmp") {
+        if (this.isplay) {
+          this.rtmpVideo.pause();
+        } else {
+          this.rtmpVideo.play();
+        }
+        this.isplay = !this.isplay;
+      }
+    },
+    guid() {
+      function S4() {
+        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
+      }
+
+      return S4() + S4() + S4() + S4() + S4() + S4() + S4() + S4();
+    },
+    settingVideoHost() {
+      this.videoHost = window.location.protocol + "//video.makalu.cc";
+    },
+    initVideo() {
+      let that = this;
+      this.exception = false;
+      this.clearContext();
+      this.$nextTick(function () {
+        switch (that.type) {
+          case "h5s":
+            that.initH5sPlay();
+            break;
+          case "hls":
+            that.initHlsPlay();
+            break;
+          case "rtmp":
+            that.initRtmpPlay();
+            break;
+          case "hk":
+            that.initPlugin("24476525", "hrFzLaMbo60QDvwazqdH", "8.129.144.255", 1443);
+            that.windowInitFun();
+            break;
+          case "hzhk":
+            that.initPlugin("21332599", "772SPtFNM1BHMyKHq4xh", "39.101.132.124", 443);
+            that.windowInitFun();
+            break;
+        }
+      });
+    },
+    tripodHandle(order) {
+      axios.post(this.videoHost + "/mkl/api/moveCamera", {
+        token: this.token,
+        action: this.type === "h5s" ? order.toLowerCase() : order,
+        h5s: this.type == "h5s",
+      });
+      console.log("按下");
+    },
+    stop() {
+      axios.post(this.videoHost + "/mkl/api/moveCamera", {
+        token: this.token,
+        action: "stop",
+        h5s: this.type == "h5s",
+      });
+      console.log("松开");
+    },
+    fullScreenCss() {
+      this.fullScreenWidth = document.body.scrollWidth - 10 + "px";
+      this.fullScreenHeight = document.body.scrollHeight - 10 + "px";
+    },
+    fullScreenFun() {
+      this.fullScreenShow = true;
+      this.$emit("fullScreenFun");
+    },
+    fullScreenCloseFun() {
+      this.fullScreenShow = false;
+    },
+    timeoutDetectionFun() {
+      let that = this;
+      //超时时间检测是否正常获取到数据流默认为5秒
+      this.timeoutDetection = setTimeout(function () {
+        if (parseInt(that.hlsvideo.currentTime.toFixed(1)) == 0) {
+          that.hls.destroy();
+          that.exception = true;
+          if (that.restart) {
+            that.timeoutDetectionInit = setTimeout(function () {
+              that.initVideo();
+            }, 2000);
+          }
+        }
+      }, this.outTime * 1000);
+    },
+    //海康插件开始
+    // 创建播放实例
+    initPlugin(appkey, secret, ip, port) {
+      let that = this;
+      that.oWebControl = new WebControl({
+        szPluginContainer: "uuid", // 指定容器id
+        iServicePortStart: 15900, // 指定起止端口号，建议使用该值
+        iServicePortEnd: 15909,
+        szClassId: "23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
+        cbConnectSuccess: function () {
+          // 创建WebControl实例成功
+          that.oWebControl
+            .JS_StartService("window", {
+              // WebControl实例创建成功后需要启动服务
+              dllPath: "./VideoPluginConnect.dll", // 值"./VideoPluginConnect.dll"写死
+            })
+            .then(
+              function () {
+                // 启动插件服务成功
+                that.oWebControl.JS_SetWindowControlCallback({
+                  // 设置消息回调
+                  cbIntegrationCallBack: that.cbIntegrationCallBack,
+                });
+
+                that.oWebControl
+                  .JS_CreateWnd(
+                    "HKPlayWindowControl",
+                    Number(that.width),
+                    Number(that.height)
+                  )
+                  .then(function () {
+                    //JS_CreateWnd创建视频播放窗口，宽高可设定
+                    that.initHKPlay(appkey, secret, ip, port); // 创建播放实例成功后初始化
+                  });
+              },
+              function () {
+                // 启动插件服务失败
+              }
             );
         },
-        //查询视频通道
-        initVideo(videoDvrNumber, url) {
-        let that = this;
-        this.$api.video.getVideoPassage(videoDvrNumber).then((response) => {
-            let data = response.data;
-            this.videoPassageList = data;
-            that.showVideo = true;
-            data.forEach((it, idx) => {
-            if (idx == 0) {
-                that.url0 = url.replace("{{passage}}", it.passageValue);
-                that.url0="http://111.21.209.230:7086/live/cameraid/1000030$2/substream/2.m3u8";
-                that.players[0].play(that.url0,1);
-            }
-            if (idx == 1) {
-                that.url1 = url.replace("{{passage}}", it.passageValue);
-                that.players[1].play(that.url1,1);
-            }
-            if (idx == 2) {
-                that.url2 = url.replace("{{passage}}", it.passageValue);
-                that.players[2].play(that.url2,1);
-            }
-            if (idx == 3) {
-                that.url3 = url.replace("{{passage}}", it.passageValue);
-                that.players[3].play(that.url3,1);
-            }
-            });
-        });
+        cbConnectError: function () {
+          // 创建WebControl实例失败
+          this.oWebControl = null;
+          that.restartInit = true;
+          WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数，采用wakeup来启动程序
+          that.initCount++;
+          if (that.initCount < 3) {
+            setTimeout(function () {
+              that.initPlugin(appkey, secret, ip, port);
+            }, 3000);
+          } else {
+            that.restartInit = false;
+            that.initError = true;
+            that.initCount = 0;
+          }
         },
-        handleOnError0(error) {
-            //this.showVideoView0 = false;
-            console.log("error: ", error);
-            //this.updatePassageState(this.videoPassageList[0].id);
+        cbConnectClose: function (bNormalClose) {
+          // 异常断开：bNormalClose = false
+          // JS_Disconnect正常断开：bNormalClose = true
+          // console.log("cbConnectClose");
+          this.oWebControl = null;
         },
-        handleOnError1(error) {
-            //this.showVideoView1 = false;
-            console.log("error: ", error);
-            //this.updatePassageState(this.videoPassageList[1].id);
-        },
-        handleOnError2(error) {
-            //this.showVideoView2 = false;
-            console.log("error: ", error);
-            //this.updatePassageState(this.videoPassageList[2].id);
-        },
-        handleOnError3(error) {
-            //this.showVideoView3 = false;
-            console.log("error: ", error);
-            //this.updatePassageState(this.videoPassageList[3].id);
-        },
-        updatePassageState(id) {
-            //没有好思路，这里先注释
-            //this.$api.video.editPassageState(id,this.videoDvrNumber,"2");
-        },
-
+      });
     },
-   
+    // 设置窗口控制回调
+    setCallbacks() {
+      let that = this;
+      that.oWebControl.JS_SetWindowControlCallback({
+        cbIntegrationCallBack: that.cbIntegrationCallBack,
+      });
+    },
+    // 推送消息
+    cbIntegrationCallBack(oData) {
+      // console.log(JSON.stringify(oData.responseMsg));
+    },
+    //初始化
+    initHKPlay(Appkey, Secret, Ip, Port) {
+      let that = this;
+      this.getPubKey(function () {
+        ////////////////////////////////// 请自行修改以下变量值	////////////////////////////////////
+        let appkey = Appkey; //综合安防管理平台提供的appkey，必填
+        let secret = that.setEncrypt(Secret); //综合安防管理平台提供的secret，必填
+        let ip = Ip; //综合安防管理平台IP地址，必填
+        let playMode = 0; //初始播放模式：0-预览，1-回放
+        let port = Port; //综合安防管理平台端口，若启用HTTPS协议，默认443
+        let snapDir = "D:\\SnapDir"; //抓图存储路径
+        let videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
+        let layout = "1x1"; //playMode指定模式的布局
+        let enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互，这里总是填1
+        let encryptedFields = "secret"; //加密字段，默认加密领域为secret
+        let showToolbar = 1; //是否显示工具栏，0-不显示，非0-显示
+        let showSmart = 1; //是否显示智能信息（如配置移动侦测后画面上的线框），0-不显示，非0-显示
+        let buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
+        let toolBarButtonIDs = "4098";
+        ////////////////////////////////// 请自行修改以上变量值	////////////////////////////////////
+
+        that.oWebControl
+          .JS_RequestInterface({
+            funcName: "init",
+            argument: JSON.stringify({
+              appkey: appkey, //API网关提供的appkey
+              secret: secret, //API网关提供的secret
+              ip: ip, //API网关IP地址
+              playMode: playMode, //播放模式（决定显示预览还是回放界面）
+              port: port, //端口
+              snapDir: snapDir, //抓图存储路径
+              videoDir: videoDir, //紧急录像或录像剪辑存储路径
+              layout: layout, //布局
+              enableHTTPS: enableHTTPS, //是否启用HTTPS协议
+              encryptedFields: encryptedFields, //加密字段
+              showToolbar: showToolbar, //是否显示工具栏
+              showSmart: showSmart, //是否显示智能信息
+              buttonIDs: buttonIDs, //自定义工具条按钮
+              toolBarButtonIDs: toolBarButtonIDs,
+            }),
+          })
+          .then(function (oData) {
+            that.oWebControl.JS_Resize(Number(that.width), Number(that.height)); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
+            that.startPreviewFun();
+          });
+      });
+    },
+    //获取公钥
+    getPubKey(callback) {
+      let that = this;
+      that.oWebControl
+        .JS_RequestInterface({
+          funcName: "getRSAPubKey",
+          argument: JSON.stringify({
+            keyLength: 1024,
+          }),
+        })
+        .then(function (oData) {
+          // console.log(oData);
+          if (oData.responseMsg.data) {
+            that.pubKey = oData.responseMsg.data;
+            callback();
+          }
+        });
+    },
+    //RSA加密
+    setEncrypt(value) {
+      let encrypt = new JSEncrypt();
+      encrypt.setPublicKey(this.pubKey);
+      return encrypt.encrypt(value);
+    },
+    // 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
+    setWndCover() {
+      let that = this;
+      let iWidth = $(window).width();
+      let iHeight = $(window).height();
+      let oDivRect = document
+        .getElementById("HKPlayWindowControl")
+        .getBoundingClientRect();
+
+      let iCoverLeft = oDivRect.left < 0 ? Math.abs(oDivRect.left) : 0;
+      let iCoverTop = oDivRect.top < 0 ? Math.abs(oDivRect.top) : 0;
+      let iCoverRight =
+        oDivRect.right - iWidth > 0 ? Math.round(oDivRect.right - iWidth) : 0;
+      let iCoverBottom =
+        oDivRect.bottom - iHeight > 0 ? Math.round(oDivRect.bottom - iHeight) : 0;
+
+      iCoverLeft = iCoverLeft > 1000 ? 1000 : iCoverLeft;
+      iCoverTop = iCoverTop > 600 ? 600 : iCoverTop;
+      iCoverRight = iCoverRight > 1000 ? 1000 : iCoverRight;
+      iCoverBottom = iCoverBottom > 600 ? 600 : iCoverBottom;
+
+      that.oWebControl.JS_RepairPartWindow(0, 0, 1001, 600); // 多1个像素点防止还原后边界缺失一个像素条
+      if (iCoverLeft != 0) {
+        that.oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 600);
+      }
+      if (iCoverTop != 0) {
+        that.oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条，防止出现剪掉一部分窗口后出现一个像素条
+      }
+      if (iCoverRight != 0) {
+        that.oWebControl.JS_CuttingPartWindow(1000 - iCoverRight, 0, iCoverRight, 600);
+      }
+      if (iCoverBottom != 0) {
+        that.oWebControl.JS_CuttingPartWindow(0, 600 - iCoverBottom, 1000, iCoverBottom);
+      }
+    },
+    windowInitFun() {
+      let that = this;
+      // 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
+      $(window).resize(function () {
+        if (that.oWebControl != null) {
+          that.oWebControl.JS_Resize(Number(that.width), Number(that.height));
+          that.setWndCover();
+        }
+      });
+
+      // 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
+      $(window).scroll(function () {
+        if (that.oWebControl != null) {
+          that.oWebControl.JS_Resize(Number(that.width), Number(that.height));
+          that.setWndCover();
+        }
+      });
+
+      // 标签关闭
+      window.onunload = function () {
+        if (that.oWebControl != null) {
+          that.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
+          that.oWebControl.JS_Disconnect().then(
+            function () {
+              // 断开与插件服务连接成功
+            },
+            function () {
+              // 断开与插件服务连接失败
+            }
+          );
+        }
+      };
+    },
+    //视频预览功能
+    startPreviewFun() {
+      let that = this;
+      let streamMode = 0; //主子码流标识：0-主码流，1-子码流
+      let transMode = 1; //传输协议：0-UDP，1-TCP
+      let gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
+      let wndId = 1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
+      let cameraIndexCode = this.token;
+      cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
+      cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
+      // console.log(cameraIndexCode)
+      that.oWebControl.JS_RequestInterface({
+        funcName: "startPreview",
+        argument: JSON.stringify({
+          cameraIndexCode: cameraIndexCode, //监控点编号
+          streamMode: streamMode, //主子码流标识
+          transMode: transMode, //传输协议
+          gpuMode: gpuMode, //是否开启GPU硬解
+          wndId: wndId, //可指定播放窗口
+        }),
+      });
+    },
+    //停止全部预览
+    stopAllPreviewFun() {
+      this.oWebControl.JS_RequestInterface({
+        funcName: "stopAllPreview",
+      });
+    },
+    closeHk() {
+      // console.log(this.oWebControl)
+      this.oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
+      this.oWebControl.JS_Disconnect().then(
+        function () {},
+        function () {}
+      );
+    },
+    videoPlay(video) {
+      //监控点位图数据处理
+      // var VideoDistribution = this.VideoDistribution
+      // for (var i = 0; i < VideoDistribution.length; i++) {
+      //     if (video.token == VideoDistribution[i].token) {
+      //         VideoDistribution[i].type = true
+      //     } else {
+      //         VideoDistribution[i].type = false
+      //     }
+      // }
+      // this.VideoDistribution = VideoDistribution
+      // //视频列表数据处理
+      // var videoListData = this.videoListData
+      // for (var i = 0; i < videoListData.length; i++) {
+      //     videoListData[i].type = false
+      //     for (var j = 0; j < videoListData[i].videoList.length; j++) {
+      //         if (video.token == videoListData[i].videoList[j].token) {
+      //             videoListData[i].type = true
+      //             videoListData[i].videoList[j].type = true
+      //         } else {
+      //             videoListData[i].videoList[j].type = false
+      //         }
+      //     }
+      // }
+      // this.videoListData = videoListData
+      // this.videoReturnData = video
+      // this.token = video.token
+      // this.type = video.videoType
+      // this.playVideo();
+    },
+    /** 查询视频配置列表 */
+    initVideoMenu() {
+      var videoListData = [];
+
+      var cqVideoListData = {};
+      //var cqVideoList = [];
+      var dgVideoListData = {};
+      //var dgVideoList = [];
+      var aiVideoListData = {};
+      //var aiVideoList = [];
+      //var onlineVideoList = [];
+
+      cqVideoListData.id = 1;
+      cqVideoListData.type = true;
+      cqVideoListData.project_abbreviation = "项目监控";
+      //dgVideoListData.id=2;
+      //dgVideoListData.type=true;
+      //dgVideoListData.project_abbreviation = '吊钩监控'
+      //aiVideoListData.id=3;
+      //aiVideoListData.type=true;
+      //aiVideoListData.project_abbreviation = 'AI视频'
+
+      this.$api.video
+        .listView(this.dept?.id || 0, this.projectInfo?.id || 0)
+        .then((response) => {
+          cqVideoListData.videoList = response.data;
+          videoListData.push(cqVideoListData);
+          //videoListData.push(dgVideoListData);
+          //videoListData.push(aiVideoListData);
+          this.videoListData = videoListData;
+          this.cqNum = response.data.length;
+          let offNum = 0;
+          response.data.forEach((it) => {
+            if (it.signalState != "1") {
+              offNum++;
+            }
+          });
+          this.offLineNum = offNum;
+        });
+    },
+    // 表格滚动调用的函数
+    beforeDestroy() {
+      clearInterval(this.warningInterval);
+    },
+    handlePlay(it, idx) {
+      this.videoReturnData = it;
+      this.currentIndex = idx;
+      this.showVideo = false;
+      this.url0 = "";
+      this.url1 = "";
+      this.url2 = "";
+      this.url3 = "";
+      this.showVideoView0 = true;
+      this.showVideoView1 = true;
+      this.showVideoView2 = true;
+      this.showVideoView3 = true;
+      this.videoDvrNumber = it.videoDvrNumber;
+      this.initVideo(
+        it.videoDvrNumber,
+        this.request.replace("{{videoDvrNumber}}", it.videoDvrNumber)
+      );
+    },
+    //查询视频通道
+    initVideo(videoDvrNumber, url) {
+      let that = this;
+      that.players = [];
+      let parentVM = {
+        vd01Flag: false,
+        vd02Flag: false,
+        vd03Flag: false,
+        vd04Flag: false,
+      };
+      that.parentVM = parentVM;
+      this.$api.video.getVideoPassage(videoDvrNumber).then((response) => {
+        let data = response.data;
+        this.videoPassageList = data;
+        that.showVideo = true;
+        let parentVM = { vd01Flag: true, vd02Flag: true, vd03Flag: true, vd04Flag: true };
+        that.parentVM = parentVM;
+        data.forEach((it, idx) => {
+          let player = new WasmPlayer(null, "vd0" + (idx+1), null, {
+            Height: true,
+          });
+          that.players.push(player);
+          if (idx == 0) {
+            //that.url0 = url.replace("{{passage}}", it.passageValue);
+            that.url0 =
+              "http://111.21.209.230:7086/live/cameraid/" +
+              videoDvrNumber +
+              "$" +
+              it.passageValue +
+              "/substream/2.m3u8";
+            that.players[0].play(that.url0, 1);
+          }
+          if (idx == 1) {
+            //that.url1 = url.replace("{{passage}}", it.passageValue);
+            that.url1 =
+              "http://111.21.209.230:7086/live/cameraid/" +
+              videoDvrNumber +
+              "$" +
+              it.passageValue +
+              "/substream/2.m3u8";
+            that.players[1].play(that.url1, 1);
+          }
+          if (idx == 2) {
+            //that.url2 = url.replace("{{passage}}", it.passageValue);
+            that.url2 =
+              "http://111.21.209.230:7086/live/cameraid/" +
+              videoDvrNumber +
+              "$" +
+              it.passageValue +
+              "/substream/2.m3u8";
+            that.players[2].play(that.url2, 1);
+          }
+          if (idx == 3) {
+            //that.url3 = url.replace("{{passage}}", it.passageValue);
+            that.url3 =
+              "http://111.21.209.230:7086/live/cameraid/" +
+              videoDvrNumber +
+              "$" +
+              it.passageValue +
+              "/substream/2.m3u8";
+            that.players[3].play(that.url3, 1);
+          }
+        });
+      });
+    },
+    handleOnError0(error) {
+      //this.showVideoView0 = false;
+      console.log("error: ", error);
+      //this.updatePassageState(this.videoPassageList[0].id);
+    },
+    handleOnError1(error) {
+      //this.showVideoView1 = false;
+      console.log("error: ", error);
+      //this.updatePassageState(this.videoPassageList[1].id);
+    },
+    handleOnError2(error) {
+      //this.showVideoView2 = false;
+      console.log("error: ", error);
+      //this.updatePassageState(this.videoPassageList[2].id);
+    },
+    handleOnError3(error) {
+      //this.showVideoView3 = false;
+      console.log("error: ", error);
+      //this.updatePassageState(this.videoPassageList[3].id);
+    },
+    updatePassageState(id) {
+      //没有好思路，这里先注释
+      //this.$api.video.editPassageState(id,this.videoDvrNumber,"2");
+    },
+  },
 };
 </script>
 
-<style lang="less" >
-.project-video {}
+<style lang="less">
+.project-video {
+}
 
 .videoView {
-    color: aliceblue;
-    float: left;
-    width: 49.5%;
-    height: 458px;
-    margin-bottom:4px;
-    margin-top:2px;
-    margin-left:5px;
-    margin-right:2px;
+  color: aliceblue;
+  float: left;
+  width: 49.5%;
+  height: 458px;
+  margin-bottom: 4px;
+  margin-top: 2px;
+  margin-left: 5px;
+  margin-right: 2px;
 }
 .videoViewError {
-    background-color: #575e65;
-    text-align: center;
-    line-height: 420px;
+  background-color: #575e65;
+  text-align: center;
+  line-height: 420px;
 }
-.video-enlarge-max{
-    padding:0 !important;
+.video-enlarge-max {
+  padding: 0 !important;
 }
-.video-enlarge-content{
-    overflow: hidden;
-    margin-top:10px;
+.video-enlarge-content {
+  overflow: hidden;
+  margin-top: 10px;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/vue.config.js b/vue.config.js
index bd63956..01ca082 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -37,8 +37,8 @@ module.exports = defineConfig({
         }
       },
       '/jhapi':{
-        target: `http://62.234.3.186/jhapi/`,
-        //target: `http://127.0.0.1:8090/jhapi/`,
+        //target: `http://62.234.3.186/jhapi/`,
+        target: `http://127.0.0.1:8090/jhapi/`,
         changeOrigin: true,
         pathRewrite: {
           '^/jhapi':'/'