diff --git a/dist.zip b/dist.zip
index 4acad6d..e5f0436 100644
Binary files a/dist.zip and b/dist.zip differ
diff --git a/public/config/config.js b/public/config/config.js
index b091c44..93b5166 100644
--- a/public/config/config.js
+++ b/public/config/config.js
@@ -306,10 +306,16 @@ window.config = {
     39: {
       taskList: [],
     },
-    40: {
+    // 40: {
+    //   taskList: [
+    //     { id: '1', name: '开' },
+    //     { id: '0', name: '关' },
+    //   ],
+    // },
+     40: {
       taskList: [
-        { id: '1', name: '开' },
-        { id: '0', name: '关' },
+        { id: '1', name: '启动' },
+        { id: '0', name: '停止' },
       ],
     },
     41: {
diff --git a/src/router/index.js b/src/router/index.js
index 09c850a..26d9c3a 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -7,7 +7,13 @@ Vue.use(VueRouter)
 
 const routes = [
 
+
   {
+    path: '/',
+    //name: 'layout',
+    component: Layout,
+    children: [
+          {
     path: '/login',
     name: 'login',
     meta: {
@@ -15,12 +21,7 @@ const routes = [
       showMenu: false,
     },
     component: () => import('@/views/login/index.vue')
-  },
-  {
-    path: '/',
-    //name: 'layout',
-    component: Layout,
-    children: [{
+  },{
       path: '/home',  //
       name: 'home',
       meta: {
diff --git a/src/views/device/deviceView.vue b/src/views/device/deviceView.vue
index 202550e..05c84fa 100644
--- a/src/views/device/deviceView.vue
+++ b/src/views/device/deviceView.vue
@@ -500,23 +500,28 @@ export default {
       },
       pileNumMap: {
         1: {
-          left: 'K30+600',
-          right: 'K34+800',
+        //   left: 'K30+600',
+        //   right: 'K34+800',
+          left: 'K33+327',
+          right: 'K37+527',
         //   length1: '4000',
         //   length2: '2616',
-         length1: '2616',
+            length1: '2616',
           length2: '2606',
-          width: 3436,
-          pileNumData: ['K31+294', 'K33+916'],
+          width: 5000,
+          pileNumData: ['K33+747', 'K37+107'],
+          n: 10,
         },
         2: {
-          left: 'K58+176',
-          right: 'K60+976',
-        //   length1: '2800',
-        length1: '2200',
+        //   left: 'K58+176',
+        //   right: 'K60+976',
+            left: 'K60+903',
+          right: 'K63+703',
+         length1: '2200',
           length2: '2200',
-          width: 3436,
-          pileNumData: ['K58+476', 'K60+676'],
+          width: 5000,
+          pileNumData: ['K61+203', 'K63+403'],
+          n: 10,
         },
         // 1: {
         //   left: 'K9+720',
diff --git a/src/views/view/index.vue b/src/views/view/index.vue
index dfc769b..13b0625 100644
--- a/src/views/view/index.vue
+++ b/src/views/view/index.vue
@@ -1,5776 +1,5257 @@
-<template>
-  <div
-    class="big-main"
-    style="width: 100%; height: 100%; color: #d5e0ee; position: relative"
-  >
-    <div
-      v-show="!main2DShow"
-      class="metadigiee-video-player"
-      id="metadigiee-video-player"
-    ></div>
-    <div
-      style="
-        width: 100%;
-        height: 100%;
-        position: absolute;
-        left: 0;
-        top: 0;
-        pointer-events: none;
-      "
-    >
-      <div class="header" style="pointer-events: auto">
-        <div style="height: 100%">
-          <div
-            style="
-              float: left;
-              width: 550px;
-              height: 100%;
-              margin-left: 500px;
-              position: relative;
-              z-index: 10;
-            "
-          >
-            <el-row :gutter="20" style="width: 550px; margin-top: 25px">
-              <el-col :span="8" v-for="item in areaList" :key="item.id">
-                <div
-                  @click="tunnelClick(item.id)"
-                  :class="
-                    searchForm.area == item.id
-                      ? 'tunnel-item-active tunnel-item'
-                      : 'tunnel-item'
-                  "
-                >
-                  {{ item.name }}
-                </div>
-              </el-col>
-            </el-row>
-          </div>
-          <!--          <div style="height: 100%;float:right;">
-            <div style="text-align: right;padding: 30px 20px 0 0;color: white">
-              <span style="font-family: DINPro;font-weight: bold;font-size: 33px;margin-right: 10px">{{nowTime.split(' ')[1]}}</span>{{nowTime.split(' ')[0]}}
-            </div>
-          </div>-->
-        </div>
-      </div>
-      <div class="main">
-        <div style="width: 100%; height: 60px; pointer-events: auto">
-          <div
-            style="float: left; width: calc(100% - 250px); overflow-x: scroll"
-          >
-            <div style="width: 800px; white-space: nowrap">
-              <div
-                @click="deviceTypeClick(item)"
-                v-for="item in deviceBarTypeList"
-                :key="item.id"
-                class="main-type-item"
-              >
-                <el-link v-if="item.id == '12' || item.id == '17'">{{
-                  item.name
-                }}</el-link>
-                <span v-else>{{ item.name }}</span>
-              </div>
-            </div>
-          </div>
-          <div style="float: right; width: 250px; position: relative">
-            <el-row style="width: 250px" class="input-box">
-              <el-col :span="5" style="min-height: 1px">
-                <img
-                  v-show="!main2DShow"
-                  @click="handlePatrol()"
-                  src="../../assets/images/icon/main-right5.png"
-                  style="cursor: pointer; width: 100%"
-                />
-              </el-col>
-              <el-col :span="5" @click.native="planDisposalClick(searchForm)">
-                <img
-                  src="../../assets/images/icon/main-right1.png"
-                  style="cursor: pointer; width: 100%"
-                />
-              </el-col>
-              <!-- <el-col :span="5">
-                <img
-                  @click="handle2D()"
-                  src="../../assets/images/icon/main-right2.png"
-                  style="cursor: pointer; width: 100%"
-                />
-              </el-col> -->
-              <!-- <el-col :span="5">
-                <img
-                  @click="handle3D()"
-                  src="../../assets/images/icon/main-right3.png"
-                  style="cursor: pointer; width: 100%"
-                />
-              </el-col> -->
-              <el-col :span="5">
-                <el-popover
-                  :popper-append-to-body="false"
-                  popper-class="popper-dropdown"
-                  width="110"
-                  placement="bottom"
-                  trigger="click"
-                >
-                  <div
-                    @click="typeClick(item.id)"
-                    v-for="item in deviceTypeList1"
-                    :key="item.id"
-                  >
-                    <div
-                      :class="
-                        searchForm.deviceType == item.id
-                          ? 'dropdown-item dropdown-item-active'
-                          : 'dropdown-item'
-                      "
-                    >
-                      {{ item.name }}
-                    </div>
-                  </div>
-                  <img
-                    slot="reference"
-                    src="../../assets/images/icon/main-right4.png"
-                    style="cursor: pointer; width: 100%"
-                  />
-                </el-popover>
-              </el-col>
-            </el-row>
-            <div
-              v-show="patrolShow && !main2DShow"
-              style="
-                position: relative;
-                background-color: rgba(255, 255, 255, 0.7);
-                border-radius: 4px;
-                padding: 5px 10px;
-                width: 300px;
-                right: 320px;
-                top: -50px;
-                color: black;
-              "
-            >
-              <el-row :gutter="30" class="input-box">
-                <el-col
-                  :span="5"
-                  @click.native="patrolClick('pause')"
-                  style="cursor: pointer"
-                  ><img
-                    src="../../assets/images/icon/pause.png"
-                    style="width: 30px"
-                  />暂停</el-col
-                >
-                <el-col
-                  :span="5"
-                  @click.native="patrolClick('play')"
-                  style="cursor: pointer"
-                  ><img
-                    src="../../assets/images/icon/play.png"
-                    style="width: 30px"
-                  />继续</el-col
-                >
-                <el-col
-                  :span="5"
-                  @click.native="patrolClick('end')"
-                  style="cursor: pointer"
-                  ><img
-                    src="../../assets/images/icon/end.png"
-                    style="width: 32px"
-                  />结束</el-col
-                >
-                <el-col
-                  :span="5"
-                  @click.native="patrolClick('tunnelLeft')"
-                  style="cursor: pointer"
-                  ><img
-                    src="../../assets/images/icon/tunnel.png"
-                    style="width: 32px"
-                  />左洞</el-col
-                >
-                <el-col
-                  :span="5"
-                  @click.native="patrolClick('tunnelRight')"
-                  style="cursor: pointer"
-                  ><img
-                    src="../../assets/images/icon/tunnel.png"
-                    style="width: 32px"
-                  />右洞</el-col
-                >
-              </el-row>
-            </div>
-          </div>
-        </div>
-        <div
-          style="
-            width: 100%;
-            height: calc(100% - 60px);
-            pointer-events: none;
-            position: relative;
-          "
-        >
-          <div
-            v-show="main2DShow"
-            @click="scrollClick(1)"
-            style="
-              position: absolute;
-              top: 45%;
-              left: 160px;
-              width: 30px;
-              height: 30px;
-              background-color: rgba(255, 255, 255, 0.2);
-              text-align: center;
-              line-height: 30px;
-              cursor: pointer;
-              z-index: 10;
-              pointer-events: auto;
-            "
-          >
-            <i class="el-icon-arrow-left"></i>
-          </div>
-          <div
-            v-show="main2DShow"
-            @click="scrollClick(2)"
-            style="
-              position: absolute;
-              top: 45%;
-              right: -10px;
-              width: 30px;
-              height: 30px;
-              background-color: rgba(255, 255, 255, 0.2);
-              text-align: center;
-              line-height: 30px;
-              cursor: pointer;
-              z-index: 10;
-              pointer-events: auto;
-            "
-          >
-            <i class="el-icon-arrow-right"></i>
-          </div>
-
-          <div
-            class="device-main"
-            v-show="main2DShow"
-            style="width: 98%; height: 100%; pointer-events: auto"
-          >
-            <div style="width: 250px; height: 100%; float: left">
-              <div style="height: 50%; text-align: center">
-                <img
-                  src="../../assets/images/toLeft.png"
-                  style="padding-top: 60%"
-                />
-                <p class="main-item-p">下行</p>
-                <p style="font-size: 18px">
-                  {{ pileNumMap[searchForm.area].length2 }}米
-                </p>
-              </div>
-              <div style="height: calc(50% - 30px); text-align: center">
-                <img
-                  src="../../assets/images/toRight.png"
-                  style="padding-top: 25%"
-                />
-                <p class="main-item-p">上行</p>
-                <p style="font-size: 18px">
-                  {{ pileNumMap[searchForm.area].length1 }}米
-                </p>
-              </div>
-            </div>
-            <div
-              ref="scrollContainer"
-              style="width: calc(100% - 250px); height: 670px; overflow: auto"
-            >
-              <div
-                class="device-View"
-                :style="{
-                  width: `${pileNumMap[searchForm.area].width}px`,
-                }"
-              >
-                <div style="width: 100%; height: 60px">
-                  <div class="dot-container">
-                    <div
-                      class="dot"
-                      v-for="(item, index) in pileNumList"
-                      :key="index"
-                    >
-                      <div class="dot-span">{{ item }}</div>
-                      <div class="dot-circle"></div>
-                    </div>
-                  </div>
-                </div>
-                <div class="device-View-main" style="width: 100%">
-                  <div style="width: 100%; height: 100%; position: absolute">
-                    <template v-if="searchForm.area != '3'">
-                      <img
-                        src="../../assets/images/icon/area1.2.png"
-                        style="margin-top: 30px; height: 225px"
-                      />
-                      <img
-                        src="../../assets/images/icon/area2.2.png"
-                        style="margin-top: 30px; height: 225px"
-                      />
-                    </template>
-                    <template v-else>
-                      <!--                  <img src="../../assets/images/icon/area3.png" style="margin-top: 30px;width: 100%">-->
-                      <img
-                        src="../../assets/images/icon/area1.2.png"
-                        style="margin-top: 30px; height: 225px"
-                      />
-                      <img
-                        src="../../assets/images/icon/area2.2.png"
-                        style="margin-top: 30px; height: 225px"
-                      />
-                    </template>
-                  </div>
-                  <div
-                    style="
-                      width: calc(100% - 304px);
-                      height: 100%;
-                      position: absolute;
-                      z-index: 2;
-                      left: 152px;
-                    "
-                  >
-                    <div
-                      class="drap-container"
-                      @dragover.prevent
-                      @mousedown="laryerMouseDown"
-                    >
-                      <div
-                        v-for="(item, index) in componentsList"
-                        class="drap-container-item"
-                        :class="{
-                          'drap-container-item-active':
-                            curControl && item.deviceId == curControl.deviceId,
-                        }"
-                        :key="index"
-                        :style="{
-                          top: `${item.position.y}px`,
-                          left: `${item.position.x}px`,
-                          'z-index': `${item.zIndex}`,
-                        }"
-                        @click="handleClick(item, 1)"
-                      >
-                        <!--                    <div class="drap-container-name">{{ item.name }}</div>-->
-                        <!--                        <template v-if="item.deviceType == '15' && item.content">
-                          <div class="drap-container-div"
-                               :style="{
-                                width: `${item.position.w}px`,
-                                height: `${item.position.h}px`,
-                              }">
-                            <div style="padding: 1px 3px">
-                              {{ item.content }}
-                            </div>
-                          </div>
-
-                        </template>-->
-                        <template>
-                          <img
-                            slot="reference"
-                            class="drap-container-img"
-                            :style="{
-                              width: `${item.position.w}px`,
-                              height: `${item.position.h}px`,
-                              opacity: `${item.opacity}`,
-                            }"
-                            :src="item.imgUrl"
-                            draggable="false"
-                            :alt="item.deviceName"
-                          />
-                        </template>
-                      </div>
-                      <div
-                        class="wave"
-                        v-for="(item, index) in componentsWarnList"
-                        :style="{
-                          width: `${item.position.w}px`,
-                          height: `${item.position.h}px`,
-                          top: `${item.position.y}px`,
-                          left: `${item.position.x}px`,
-                          position: 'absolute',
-                          'z-index': '3',
-                        }"
-                        :key="index"
-                      >
-                        <div
-                          class="circle"
-                          v-if="warnControl && item.id == warnControl.id"
-                        ></div>
-                        <div class="drap-container-item" :key="index">
-                          <img
-                            slot="reference"
-                            class="drap-container-img"
-                            :style="{
-                              width: `${item.position.w}px`,
-                              height: `${item.position.h}px`,
-                            }"
-                            :src="item.imgUrl"
-                            draggable="false"
-                            :alt="item.id"
-                          />
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-                <div style="width: 100%; height: 60px">
-                  <div class="dot-container2">
-                    <div
-                      class="dot"
-                      v-for="(item, index) in pileNumList"
-                      :key="index"
-                    >
-                      <div class="dot-circle2"></div>
-                      <div class="dot-span">{{ item }}</div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="footer" style="pointer-events: auto">
-        <el-row style="height: 100%">
-          <el-col :span="6" style="height: 100%; padding: 0 30px">
-            <div class="title_div">预警列表</div>
-            <div class="footer-item">
-              <el-row :gutter="30" style="height: 100%">
-                <el-col :span="12" style="height: 100%">
-                  <div class="device-bg" @click="handleWarnClick('3,8')">
-                    <div style="text-align: center">
-                      <p style="color: #5dd5c8; font-size: 38px">
-                        {{ statsticInfo.warn_count_done }}
-                      </p>
-                      <p style="font-size: 14px; margin-top: 10px">已处理</p>
-                    </div>
-                  </div>
-                </el-col>
-                <el-col :span="12" style="height: 100%">
-                  <div
-                    class="device-bg device-bg2"
-                    @click="handleWarnClick('2')"
-                  >
-                    <div style="text-align: center">
-                      <p style="color: #dfb756; font-size: 38px">
-                        {{ statsticInfo.warn_count_todo }}
-                      </p>
-                      <p style="font-size: 14px; margin-top: 10px">
-                        待处理<img
-                          src="../../assets/images/daiqueren.png"
-                          height="14px"
-                          style="margin-left: 10px"
-                        />
-                      </p>
-                    </div>
-                  </div>
-                </el-col>
-              </el-row>
-            </div>
-          </el-col>
-          <el-col :span="6" style="height: 100%; padding: 0 30px">
-            <div class="title_div">事件</div>
-            <div class="footer-item" style="cursor: pointer">
-              <el-row :gutter="30" style="height: 100%">
-                <el-col :span="12" style="height: 100%">
-                  <div class="device-bg">
-                    <div style="text-align: center">
-                      <p style="color: #5dd5c8; font-size: 38px">0</p>
-                    </div>
-                  </div>
-                </el-col>
-                <el-col :span="12" style="height: 100%">
-                  <div class="device-bg device-bg3">
-                    <div style="text-align: center">
-                      <p style="color: #df565a; font-size: 38px">0</p>
-                    </div>
-                  </div>
-                </el-col>
-              </el-row>
-            </div>
-          </el-col>
-          <el-col :span="12" style="height: 100%; padding: 0 30px">
-            <div style="width: 50%"><div class="title_div">交通流量</div></div>
-            <div class="footer-item" id="liuliangLineId"></div>
-          </el-col>
-          <!--          <el-col :span="6" style="height: 100%;padding: 0 30px">
-            <div class="title_div">视频画面</div>
-            <div class="footer-item">
-              <video autoplay controls loop muted width="100%" height="100%" style="background: black">
-                <source src="../../assets/maoliling.mp4" type="video/mp4">
-              </video>
-            </div>
-          </el-col>-->
-        </el-row>
-      </div>
-
-      <transition name="el-zoom-in-top">
-        <div class="warn-item" v-show="warnShow">
-          <div class="title">预警信息</div>
-          <div
-            @click="warnClose()"
-            style="
-              position: absolute;
-              right: 29px;
-              top: 26px;
-              width: 30px;
-              height: 30px;
-              cursor: pointer;
-            "
-          ></div>
-          <div
-            style="
-              width: 340px;
-              height: 580px;
-              margin: 25px auto 20px;
-              overflow: auto;
-            "
-          >
-            <div style="width: 335px">
-              <div
-                @click="warnClick(item)"
-                :class="
-                  warnForm.id == item.id
-                    ? 'item-one-block item-one-block2'
-                    : 'item-one-block'
-                "
-                style="
-                  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
-                  padding: 20px;
-                "
-                v-for="item in warnList"
-                :key="item.id"
-              >
-                <el-row>
-                  <el-col :span="2">
-                    <div style="height: 25px; line-height: 36px">
-                      <img
-                        v-show="item.status == 2"
-                        :src="require('../../assets/images/icon/warn1.png')"
-                      />
-                      <img
-                        v-show="item.status == 1"
-                        :src="require('../../assets/images/icon/warn2.png')"
-                      />
-                    </div>
-                  </el-col>
-                  <el-col :span="6">
-                    <div style="font-size: 18px; font-weight: bold">
-                      <span v-if="item.status == 1">疑似火灾</span>
-                      <span v-else-if="item.status == 2">火灾</span>
-                      <span v-else>{{
-                        filedFomatter(item.type, warnTypeList)
-                      }}</span>
-                    </div>
-                  </el-col>
-                  <el-col :span="16" style="text-align: right">
-                    <div
-                      class="warnBtu"
-                      v-show="item.status == 1 || item.status == 2"
-                      @click="verifyClick(item)"
-                    >
-                      人工确认
-                    </div>
-                    <div
-                      class="warnBtu"
-                      v-show="item.status == 2"
-                      @click="warnPlanClick(item)"
-                      style="margin-left: 14px"
-                    >
-                      预案处置
-                    </div>
-                  </el-col>
-                  <el-col
-                    :span="16"
-                    v-show="item.status == 3 || item.status == 8"
-                  >
-                    <p
-                      style="text-align: right; margin-top: 5px; color: #cccccc"
-                    >
-                      {{ filedFomatter(item.status, warnStatusList) }}
-                    </p>
-                  </el-col>
-                </el-row>
-                <el-row style="margin-top: 20px">
-                  <el-col :span="10">
-                    {{ filedFomatter(item.area, areaList) }}
-                  </el-col>
-                  <el-col :span="8">
-                    {{ filedFomatter(item.direction, directionList) }}
-                  </el-col>
-                  <el-col :span="6" style="text-align: right">
-                    {{ item.pileNum }}
-                  </el-col>
-                </el-row>
-                <el-row style="margin-top: 10px">
-                  <el-col :span="24" style="text-align: right">
-                    {{ dateTimeFormat(item.warnTime) }}
-                  </el-col>
-                </el-row>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-      <transition name="el-zoom-in-top">
-        <div class="plan-item" v-show="warnDetailShow">
-          <div
-            style="
-              padding: 15px 20px 0px;
-              height: 25px;
-              line-height: 35px;
-              font-size: 16px;
-            "
-          >
-            <div style="float: left">
-              <span
-                style="
-                  float: left;
-                  width: 10px;
-                  height: 10px;
-                  background: #2b6bb6;
-                  margin: 14px 5px 0 0;
-                "
-              ></span
-              >预案详情
-            </div>
-            <div
-              v-show="planSuccess"
-              style="
-                float: left;
-                margin-left: 100px;
-                font-size: 14px;
-                margin-top: 5px;
-              "
-            >
-              状态同步中
-            </div>
-            <div
-              @click="warnDetailClose()"
-              style="
-                float: right;
-                width: 20px;
-                text-align: center;
-                cursor: pointer;
-              "
-            >
-              X
-            </div>
-            <div style="float: right; margin-right: 10px; width: 105px">
-              <div style="float: left; margin-top: 17px">
-                <div
-                  v-loading="planLoading"
-                  element-loading-spinner="el-icon-loading"
-                ></div>
-              </div>
-              <el-button
-                type="primary"
-                @click="handleCommitPlanClick(2)"
-                size="mini"
-                style="float: right"
-                >一键发送</el-button
-              >
-            </div>
-          </div>
-          <div
-            style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"
-          ></div>
-          <div
-            style="
-              padding: 0 20px 20px;
-              width: calc(100% - 40px);
-              height: calc(100% - 80px);
-            "
-          >
-            <div style="width: 100%; height: 100%; overflow: auto">
-              <div
-                v-for="item1 in planDeviceType"
-                :key="item1"
-                style="margin-bottom: 10px"
-              >
-                <div v-if="item1 == '13'">
-                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
-                    {{ filedFomatter(item1, deviceTypeList) }}控制
-                  </p>
-                  <p style="margin-top: 5px">上游</p>
-                  <div
-                    style="
-                      padding-left: 10px;
-                      line-height: 25px;
-                      margin-top: 5px;
-                    "
-                  >
-                    <p
-                      v-for="item in planDetailMap[item1]"
-                      v-if="item.stream == '1'"
-                      :key="item.id"
-                    >
-                      {{ filedFomatter(item.direction, directionList) }}
-                      {{ item.id }}（{{ item.pileNum }}） 指令:{{ item.stream }}
-                      <span style="color: #ee9837">{{
-                        filedFomatter(item.cmd, taskEnum[item1].taskList)
-                      }}</span>
-                      <span
-                        style="margin-left: 10px"
-                        v-show="item.ret != undefined"
-                      >
-                        状态:
-                        <span v-if="item.ret == -1 || item.ret == null"
-                          >执行中</span
-                        >
-                        <span style="color: #12b76d" v-else>{{
-                          filedFomatter(item.ret, taskEnum[item1].taskList)
-                        }}</span>
-                      </span>
-                    </p>
-                  </div>
-                  <p style="margin-top: 5px">下游</p>
-                  <div
-                    style="
-                      padding-left: 10px;
-                      line-height: 25px;
-                      margin-top: 5px;
-                    "
-                  >
-                    <p
-                      v-for="item in planDetailMap[item1]"
-                      v-if="item.stream == '2'"
-                    >
-                      {{ filedFomatter(item.direction, directionList) }}
-                      {{ item.id }}（{{ item.pileNum }}） 指令:{{ item.stream }}
-                      <span style="color: #ee9837">{{
-                        filedFomatter(item.cmd, taskEnum[item1].taskList)
-                      }}</span>
-                      <span
-                        style="margin-left: 10px"
-                        v-show="item.ret != undefined"
-                      >
-                        状态:
-                        <span v-if="item.ret == -1 || item.ret == null"
-                          >执行中</span
-                        >
-                        <span style="color: #12b76d" v-else>{{
-                          filedFomatter(item.ret, taskEnum[item1].taskList)
-                        }}</span>
-                      </span>
-                    </p>
-                  </div>
-                </div>
-                <div v-else-if="item1 == '15'">
-                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
-                    {{ filedFomatter(item1, deviceTypeList) }}控制
-                  </p>
-                  <!-- <div
-                    style="
-                      padding-left: 10px;
-                      line-height: 25px;
-                      margin-top: 5px;
-                    "
-                    v-show="planDetailMap[item1].length > 0"
-                  >
-                    <p v-for="item in planDetailMap[item1]" :key="item.id">
-                      {{ filedFomatter(item.direction, directionList) }}
-                      {{ item.id }}（{{ item.pileNum }}）
-                    </p>
-
-                    <el-select
-                      v-model="templateObj"
-                      clearable
-                      placeholder="请选择"
-                      size="small"
-                      style="width: 80%"
-                      :popper-append-to-body="false"
-                    >
-                      <el-option
-                        v-for="item in infoBoardTemplateList"
-                        :key="item.id"
-                        :label="item.textInfo"
-                        :value="item.id"
-                      >
-                      </el-option>
-                    </el-select>
-                  </div> -->
-                        <!-- <el-tree
-            class="filter-tree"
-            :data="treeData"
-            :props="defaultProps"
-            default-expand-all
-            :filter-node-method="filterNode"
-            ref="tree"
-            show-checkbox
-            @check-change="handleCheckChange"
-              v-model="textInfoList"
-          >
-            <span class="custom-tree-node" slot-scope="{ node, data }">
-              <el-tooltip :content="node.label" placement="top">
-                <span class="label">{{ node.label }}</span>  
-              </el-tooltip>
-                 <span style="color: #a8a8a8; font-size: 12px"
-                                  v-if="node.displaySize">宽高:{{ node.displaySize }} 
-                                  字体大小:{{ node.fontSize }} 
-                                  字体颜色:{{node.fontColor}}</span>
-              <div class="icon">
-                <i
-                  class="el-icon-plus node-actions"
-                  :style="node.level == 1 ? 'display:none' : ''"
-                  @click.self="handleAddToTable(node, data)"
-                ></i>
-              </div>
-      
-            </span>
-          </el-tree> -->
-                </div>
-                <div v-else>
-                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
-                    {{ filedFomatter(item1, deviceTypeList) }}控制
-                  </p>
-                  <div
-                    style="
-                      padding-left: 10px;
-                      line-height: 25px;
-                      margin-top: 5px;
-                    "
-                  >
-                    <p v-for="item in planDetailMap[item1]" :key="item.id">
-                      {{ filedFomatter(item.direction, directionList) }}
-                      {{ item.id }}（{{ item.pileNum }}） 指令:
-                      <span style="color: #ee9837">{{
-                        filedFomatter(item.cmd, taskEnum[item1].taskList)
-                      }}</span>
-                      <span
-                        style="margin-left: 10px"
-                        v-show="item.ret != undefined"
-                      >
-                        状态:
-                        <span v-if="item.ret == -1 || item.ret == null"
-                          >执行中</span
-                        >
-                        <span style="color: #12b76d" v-else>
-                          <template v-if="item1 == '19'">
-                            {{
-                              filedFomatter(item.ret, taskEnum[item1].taskList2)
-                            }}
-                          </template>
-                          <template v-else>
-                            {{
-                              filedFomatter(item.ret, taskEnum[item1].taskList)
-                            }}
-                          </template>
-                        </span>
-                      </span>
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div style="min-height: 200px">
-                <p
-                  style="
-                    font-size: 16px;
-                    font-weight: bold;
-                    color: #b3ddef;
-                    margin-bottom: 10px;
-                  "
-                >
-                  广播控制
-                </p>
-                <div
-                  style="padding-left: 10px; line-height: 25px; margin-top: 5px"
-                >
-                  <el-select
-                    v-model="mediaObj"
-                    clearable
-                    value-key="id"
-                    placeholder="请选择"
-                    size="small"
-                    style="width: 80%"
-                    :popper-append-to-body="false"
-                    disabled
-                  >
-                    <el-option
-                      v-for="item in listMedia"
-                      :key="item.id"
-                      :label="item.name"
-                      :value="item"
-                    >
-                    </el-option>
-                  </el-select>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-
-      <transition name="el-zoom-in-top">
-        <div class="warn-item" v-show="planShow">
-          <div class="title">事件预案处置</div>
-          <div
-            @click="planClose()"
-            style="
-              position: absolute;
-              right: 29px;
-              top: 26px;
-              width: 30px;
-              height: 30px;
-              cursor: pointer;
-            "
-          ></div>
-          <div
-            style="
-              width: 340px;
-              height: 580px;
-              margin: 25px auto 20px;
-              overflow: auto;
-            "
-          >
-            <div style="width: 335px">
-              <div
-                @click="planClick(item)"
-                :class="
-                  planForm.planId == item.planId
-                    ? 'item-one-block item-one-block2'
-                    : 'item-one-block'
-                "
-                style="
-                  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
-                  padding: 20px;
-                  cursor: pointer;
-                "
-                v-for="(item, index) in planList"
-                :key="index"
-              >
-                <el-row>
-                  <el-col :span="12">
-                    <div style="font-size: 18px; font-weight: bold">
-                      {{ item.planName }}
-                    </div>
-                  </el-col>
-                  <el-col :span="12" style="text-align: right">{{
-                    filedFomatter(item.planType, warnTypeList)
-                  }}</el-col>
-                </el-row>
-                <p>{{ item.desp }}</p>
-                <el-row style="margin-top: 10px">
-                  <el-col :span="12">
-                    {{ filedFomatter(item.area, areaList) }}
-                  </el-col>
-                  <el-col :span="12" style="text-align: right">
-                    {{ dateTimeFormat(item.createTime) }}
-                  </el-col>
-                </el-row>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-      <transition name="el-zoom-in-top">
-        <div class="plan-item" v-show="planDetailShow">
-          <div
-            style="
-              padding: 15px 20px 0px;
-              height: 25px;
-              line-height: 35px;
-              font-size: 16px;
-            "
-          >
-            <div style="float: left">
-              <span
-                style="
-                  float: left;
-                  width: 10px;
-                  height: 10px;
-                  background: #2b6bb6;
-                  margin: 14px 5px 0 0;
-                "
-              ></span
-              >预案详情
-            </div>
-            <div
-              v-show="planSuccess"
-              style="
-                float: left;
-                margin-left: 100px;
-                font-size: 14px;
-                margin-top: 5px;
-              "
-            >
-              状态同步中
-            </div>
-            <div
-              @click="planDetailClose()"
-              style="
-                float: right;
-                width: 20px;
-                text-align: center;
-                cursor: pointer;
-              "
-            >
-              X
-            </div>
-            <div style="float: right; margin-right: 20px; width: 105px">
-              <div style="float: left; margin-top: 17px">
-                <div
-                  v-loading="planLoading"
-                  element-loading-spinner="el-icon-loading"
-                ></div>
-              </div>
-              <el-button
-                type="primary"
-                @click="handleCommitPlanClick(1)"
-                size="mini"
-                style="float: right"
-                >一键发送</el-button
-              >
-            </div>
-          </div>
-          <div
-            style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"
-          ></div>
-          <div
-            style="
-              padding: 0 20px 20px;
-              width: calc(100% - 40px);
-              height: calc(100% - 80px);
-            "
-          >
-            <div style="width: 100%; height: 100%; overflow: auto">
-              <div
-                v-for="(item1, index1) in planDetailData"
-                :key="index1"
-                v-show="item1.data.length > 0"
-                style="margin-bottom: 10px"
-              >
-                <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
-                  {{ filedFomatter(item1.type, deviceTypeList) }}控制
-                </p>
-                <div
-                  style="padding-left: 10px; line-height: 25px; margin-top: 5px"
-                >
-                  <p v-for="item in item1.data" :key="item.id">
-                    {{ filedFomatter(item.direction, directionList) }}
-                    {{ item.id }}（{{ item.pileNum }}） 指令:
-                    <span style="color: #12b7b2">{{
-                      filedFomatter(item.cmd, taskEnum[item1.type].taskList)
-                    }}</span>
-                    <span
-                      style="margin-left: 10px"
-                      v-show="item.ret != undefined"
-                    >
-                      状态:
-                      <span v-if="item.ret == -1 || item.ret == null"
-                        >执行中</span
-                      >
-                      <span style="color: #12b76d" v-else>{{
-                        filedFomatter(item.ret, taskEnum[item1.type].taskList)
-                      }}</span>
-                    </span>
-                  </p>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-
-      <transition name="el-fade-in-linear">
-        <div v-show="deviceRunShow" class="deviceRun-item">
-          <div class="title">设备运行情况</div>
-          <div
-            @click="deviceRunShow = false"
-            style="
-              position: absolute;
-              right: 25px;
-              top: 25px;
-              width: 30px;
-              height: 30px;
-              cursor: pointer;
-            "
-          ></div>
-          <div style="height: 150px">
-            <div
-              class="select-down"
-              style="
-                width: 430px;
-                margin: 0 auto;
-                font-size: 16px;
-                padding-top: 50px;
-              "
-            >
-              类型<el-select
-                v-model="deviceType"
-                @change="loadDevice"
-                clearable
-                placeholder="请选择"
-                :popper-append-to-body="false"
-              >
-                <el-option
-                  v-for="item in deviceTypeList"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id"
-                >
-                </el-option>
-              </el-select>
-            </div>
-          </div>
-          <div
-            style="
-              width: calc(100% - 50px);
-              margin: 0px auto 20px;
-              height: calc(100% - 270px);
-            "
-          >
-            <el-row
-              :gutter="30"
-              style="
-                text-align: center;
-                width: calc(100% - 20px);
-                margin: 0 auto 20px;
-              "
-            >
-              <el-col :span="7"><div class="runColBg">设备类型</div></el-col>
-              <el-col :span="7"><div class="runColBg">设备编号</div></el-col>
-              <el-col :span="5"><div class="runColBg">桩号</div></el-col>
-              <el-col :span="5"><div class="runColBg">状态</div></el-col>
-            </el-row>
-
-            <div style="width: 100%; height: calc(100% - 30px); overflow: auto">
-              <div style="width: calc(100% - 20px); margin: 0 auto">
-                <el-row
-                  @click.native="deviceRunClick(item)"
-                  class="runRowBg"
-                  v-for="item in deviceData"
-                  :key="item.deviceId"
-                >
-                  <el-col :span="7" style="min-height: 1px">{{
-                    filedFomatter(item.deviceType, deviceTypeList)
-                  }}</el-col>
-                  <el-col :span="7" style="min-height: 1px">{{
-                    item.deviceId
-                  }}</el-col>
-                  <el-col :span="5" style="min-height: 1px">{{
-                    item.pileNum
-                  }}</el-col>
-                  <el-col :span="5" style="min-height: 1px; color: #5dd5c8">{{
-                    filedFomatter(item.status, statusList)
-                  }}</el-col>
-                </el-row>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-
-      <el-dialog
-        style="pointer-events: auto"
-        :title="addOrUpdateTitle"
-        :visible.sync="deviceDialogVisible"
-        width="1000px"
-        :close-on-click-modal="false"
-        v-if="deviceDialogVisible"
-        @close="deviceClose"
-      >
-        <div
-          v-show="deviceLoading"
-          style="
-            position: absolute;
-            z-index: 9999;
-            left: calc(50% - 60px);
-            top: 48%;
-            background: #ce811b;
-            padding: 10px 20px;
-            border-radius: 5px;
-          "
-        >
-          正在发送指令...
-        </div>
-
-        <div
-          v-loading="deviceLoading"
-          element-loading-text=""
-          element-loading-spinner="el-icon-loading"
-          element-loading-background="rgba(0, 0, 0, 0.5)"
-        >
-          <div
-            v-show="dataForm.deviceType != 22"
-            style="min-height: 70px; color: #1afff7"
-          >
-            <div
-              style="
-                display: inline-block;
-                vertical-align: top;
-                padding: 10px;
-                border-right: 2px solid rgb(20 164 180);
-                height: 50px;
-              "
-            >
-              <img src="../../assets/images/device.png" />
-            </div>
-            <!--            <div style="display: inline-block;vertical-align: top;padding: 0 30px;border-right: 2px solid rgb(20 164 180);min-width: 130px;height: 70px">
-&lt;!&ndash;              <p style="font-size: 23px;color: #1AFFF7;margin-bottom: 10px">
-                {{ filedFomatter(dataForm.status,statusList) }}
-                <span v-show="!dataForm.status">暂无状态</span>
-              </p>&ndash;&gt;
-              <p style="font-size: 22px;color: #1AFFF7;">
-                状态：在线&lt;!&ndash;<span v-if="dataForm.taskName == -1">离线</span>
-                         <span v-else>{{ filedFomatter(dataForm.taskName,taskList) }}</span>&ndash;&gt;
-
-              </p>
-            </div>-->
-            <div
-              style="
-                display: inline-block;
-                vertical-align: top;
-                width: calc(100% - 300px);
-              "
-            >
-              <template v-if="dataForm.deviceType == '15'">
-                <div
-                  style="height: 60px; padding: 10px 0 0 10px; overflow: auto"
-                >
-                  <div
-                    style="display: inline-block; vertical-align: top"
-                    v-html="templateInfoHtml"
-                  ></div>
-                </div>
-              </template>
-              <template v-else-if="dataForm.deviceType == '26'">
-                <el-row
-                  style="
-                    min-height: 30px;
-                    font-size: 16px;
-                    padding: 20px 0 0 10px;
-                  "
-                >
-                  <el-col :span="10">风向：{{ dataForm.direction26 }}</el-col>
-                  <el-col :span="11"
-                    >风速：{{ dataForm.speed26
-                    }}<span v-show="dataForm.speed26">(m/s)</span></el-col
-                  >
-                </el-row>
-              </template>
-              <template v-else-if="dataForm.deviceType == '27'">
-                <el-row
-                  style="
-                    min-height: 30px;
-                    font-size: 16px;
-                    padding: 20px 0 0 10px;
-                  "
-                >
-                  <el-col :span="15"
-                    >co 浓度值：{{ dataForm.co27
-                    }}<span v-show="dataForm.co27">(PPM)</span></el-col
-                  >
-                  <el-col :span="9"
-                    >vi 能见度：{{ dataForm.vi27
-                    }}<span v-show="dataForm.vi27"></span></el-col
-                  >
-                </el-row>
-              </template>
-              <template v-else-if="dataForm.deviceType == '28'">
-                <el-row
-                  style="
-                    min-height: 30px;
-                    font-size: 16px;
-                    padding: 20px 0 0 10px;
-                  "
-                >
-                  <el-col :span="15">光强：{{ dataForm.light28 }}</el-col>
-                </el-row>
-              </template>
-              <template v-else-if="dataForm.deviceType == '43'">
-                <div style="min-height: 30px; font-size: 16px; padding: 20px">
-                  <p>
-                    水位高度：{{ dataForm.height43
-                    }}<span v-show="dataForm.height43">(m)</span>
-                  </p>
-                </div>
-              </template>
-              <template
-                v-else-if="
-                  dataForm.deviceType == '40' ||
-                  dataForm.deviceType == '41' ||
-                  dataForm.deviceType == '42'
-                "
-              >
-                <div
-                  style="min-height: 30px; font-size: 16px; padding: 0px 20px"
-                >
-                  <p v-for="(item, index) in iotKeyData" :key="index">
-                    <span style="display: inline-block; width: 100px">
-                      {{ item.name }}
-                    </span>
-                    <span
-                      v-for="(item1, index1) in item.data"
-                      :key="index1"
-                      style="display: inline-block; width: 100px"
-                    >
-                      {{ item1.name }}
-                    </span>
-                  </p>
-                </div>
-              </template>
-              <template v-else>
-                <div
-                  v-show="dataForm.taskName != -1"
-                  style="
-                    min-height: 30px;
-                    font-size: 16px;
-                    padding: 20px 0 0 10px;
-                  "
-                >
-                  <template v-if="dataForm.deviceType == '19'">{{
-                    filedFomatter(dataForm.taskName, taskEnum['19'].taskList2)
-                  }}</template>
-                  <template v-else>{{
-                    filedFomatter(dataForm.taskName, taskList)
-                  }}</template>
-                </div>
-                <!--                <div v-show="dataForm.taskName == -1" style="min-height: 30px;font-size: 16px;padding: 20px 0 0 10px;font-size: 22px;color: #1AFFF7;">
-                  暂无反馈
-                </div>-->
-              </template>
-            </div>
-          </div>
-          <el-divider></el-divider>
-          <el-row style="min-height: 280px">
-            <el-col :span="8">
-              <p style="margin-bottom: 10px; font-size: 16px">
-                <span
-                  style="
-                    float: left;
-                    width: 10px;
-                    height: 10px;
-                    background: #2b6bb6;
-                    margin: 7px 5px 0 0;
-                  "
-                ></span
-                >设备基本信息
-              </p>
-              <el-descriptions
-                title=""
-                :column="1"
-                :labelStyle="{
-                  width: '80px',
-                  'text-align': 'right',
-                  display: 'block',
-                  color: '#D5E0EE',
-                }"
-                :contentStyle="{ width: '95%' }"
-              >
-                <el-descriptions-item label="设备类型">{{
-                  filedFomatter(dataForm.deviceType, deviceTypeList)
-                }}</el-descriptions-item>
-                <el-descriptions-item label="所属隧道">{{
-                  filedFomatter(dataForm.area, areaList)
-                }}</el-descriptions-item>
-                <el-descriptions-item label="设备编号">{{
-                  dataForm.deviceId
-                }}</el-descriptions-item>
-                <el-descriptions-item label="物联key">{{
-                  dataForm.iotKey
-                }}</el-descriptions-item>
-                <el-descriptions-item label="modelId">{{
-                  dataForm.modelId
-                }}</el-descriptions-item>
-                <el-descriptions-item label="所属方向">{{
-                  filedFomatter(dataForm.direction, directionList)
-                }}</el-descriptions-item>
-                <el-descriptions-item label="桩号">{{
-                  dataForm.pileNumShow
-                }}</el-descriptions-item>
-                <el-descriptions-item label="桩号">{{
-                  dataForm.pileNum
-                }}</el-descriptions-item>
-                <el-descriptions-item label="断面位置">{{
-                  filedFomatter(dataForm.lane, laneList)
-                }}</el-descriptions-item>
-              </el-descriptions>
-            </el-col>
-            <el-col :span="16">
-              <div
-                style="
-                  width: calc(100% - 20px);
-                  border-left: 2px solid rgba(70, 148, 255, 0.42);
-                  padding: 0 10px;
-                "
-              >
-                <div
-                  v-if="dataForm.deviceType == 22"
-                  style="
-                    width: 75%;
-                    height: 340px;
-                    background: black;
-                    margin-left: 5%;
-                  "
-                >
-                  <flv-player :videoUrl="videoUrl"></flv-player>
-                </div>
-                <div
-                  v-else-if="
-                    dataForm.deviceType == 26 ||
-                    dataForm.deviceType == 27 ||
-                    dataForm.deviceType == 28 ||
-                    dataForm.deviceType == 39 ||
-                    dataForm.deviceType == 43
-                  "
-                >
-                  <p style="margin-bottom: 10px; font-size: 16px">
-                    <span
-                      style="
-                        float: left;
-                        width: 10px;
-                        height: 10px;
-                        background: #2b6bb6;
-                        margin: 7px 5px 0 0;
-                      "
-                    ></span
-                    >设备控制
-                  </p>
-                  <div
-                    style="
-                      min-height: 200px;
-                      padding-bottom: 20px;
-                      padding-top: 10px;
-                    "
-                  >
-                    无
-                  </div>
-                </div>
-                <div v-else>
-                  <p style="margin-bottom: 10px; font-size: 16px">
-                    <span
-                      style="
-                        float: left;
-                        width: 10px;
-                        height: 10px;
-                        background: #2b6bb6;
-                        margin: 7px 5px 0 0;
-                      "
-                    ></span
-                    >设备控制
-                    <el-button
-                      type="primary"
-                      @click="handleCommitClick(0)"
-                      size="mini"
-                      style="float: right; margin-right: 20px"
-                      >发送</el-button
-                    >
-                  </p>
-                  <div
-                    style="
-                      min-height: 200px;
-                      padding-bottom: 20px;
-                      padding-top: 10px;
-                    "
-                  >
-                    <div
-                      v-if="dataForm.deviceType == '12'"
-                      style="padding-left: 20px"
-                    >
-                      <el-row>
-                        <el-col :span="3">控制：</el-col>
-                        <el-col :span="21">
-                          <el-radio-group
-                            v-model="dataForm.command"
-                            style="padding-top: 3px"
-                          >
-                            <el-radio
-                              :label="item.id"
-                              v-for="item in taskList"
-                              :key="item.id"
-                              >{{ item.name }}</el-radio>
-                          </el-radio-group>
-                        </el-col>
-                      </el-row>
-                      <el-row style="margin-top: 5px">
-                        <el-col :span="3" style="line-height: 36px"
-                          >亮度：</el-col
-                        >
-                        <el-col :span="21">
-                          <el-slider
-                            style="width: calc(100% - 100px)"
-                            v-model="dataFormBody.light"
-                          ></el-slider>
-                        </el-col>
-                      </el-row>
-                    </div>
-                    <div
-                      v-else-if="dataForm.deviceType == '15'"
-                      style="padding-left: 20px"
-                    >
-                      <el-row>
-                        <el-col :span="3">控制：</el-col>
-                        <el-col :span="21" class="temlCheckClass">
-                          <!--                          <div v-for="item in infoBoardTemplateList">
-                            <div style="height: 30px">
-                              <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
-                            </div>
-                          </div>-->
-                          <!-- <el-checkbox-group v-model="textInfoList">
-                            <div
-                              v-for="item in infoBoardTemplateList"
-                              :key="item.programId"
-                              style="margin-bottom: 5px"
-                            >
-                              <el-checkbox :label="item.programId">
-                                <span
-                                  @input="addComment($event, item)"
-                                  v-html="item.templateHtml"
-                                ></span
-                                ><br />
-                                <span style="color: #a8a8a8; font-size: 12px"
-                                  >宽高:{{ item.displaySize }} 
-                                  字体大小:{{ item.fontSize }} 字体颜色:{{
-                                    item.fontColor
-                                  }}</span
-                                >
-                              </el-checkbox>
-                            </div>
-                          </el-checkbox-group> -->
-                           <el-tree
-            class="filter-tree"
-            :data="treeData"
-            :props="defaultProps"
-            :filter-node-method="filterNode"
-            ref="tree"
-            show-checkbox
-  @check-change="handleCheckChange"
-   v-model="textInfoList"
-   @check="handleCheck"
-          >
-            <div class="custom-tree-node" slot-scope="{ node, data }">
-              <el-tooltip :content="node.label" placement="top">
-                <span class="label"  v-if="node.level === 1">{{ data.name }}</span>
-                <span class="label"  v-if="node.level !== 1">{{ data.content }}</span>
-              
-              </el-tooltip>
-          <br />
-                  <span style="color: #a8a8a8; font-size: 12px"
-                                  v-if="node.level !== 1">高宽:{{ data.displaySize }} 
-                                  字体大小:{{ data.fontSize }} 字体颜色:{{getColor(data.fontColor)}}</span>
-      
-            </div>
-          </el-tree>
-                        </el-col>
-                      </el-row>
-                    </div>
-                    <div
-                      v-else-if="
-                        dataForm.deviceType == '40' ||
-                        dataForm.deviceType == '41' ||
-                        dataForm.deviceType == '42'
-                      "
-                      style="padding-left: 20px"
-                    >
-                      <div style="float: left; width: 35%">
-                        <el-row>
-                          <el-col :span="5">设备：</el-col>
-                          <el-col :span="19">
-                            <el-checkbox-group v-model="dataForm.iotKeys">
-                              <el-checkbox
-                                v-for="item in iotKeyList"
-                                v-show="item.show"
-                                :label="item.id"
-                                :key="item.id"
-                                >{{ item.name }}</el-checkbox
-                              >
-                            </el-checkbox-group>
-                          </el-col>
-                        </el-row>
-                      </div>
-                      <div style="float: left; width: 55%">
-                        <el-row>
-                          <el-col :span="5">控制：</el-col>
-                          <el-col :span="19">
-                            <el-radio-group
-                              v-model="dataForm.command"
-                              style="padding-top: 3px"
-                            >
-                              <el-radio
-                                :label="item.id"
-                                v-for="item in taskList"
-                                :key="item.id"
-                                >{{ item.name }}</el-radio
-                              >
-                            </el-radio-group>
-                          </el-col>
-                        </el-row>
-                      </div>
-                    </div>
-                    <div v-else-if="13" style="padding-left: 20px">
-                      <el-row>
-                        <el-col :span="3">控制：</el-col>
-                        <el-col :span="21">
-                          <!-- {{ dataForm }} {{ filedFomatter(dataForm.lane, laneList) }} {{
-                        filedFomatter(dataForm.direction, directionList)
-                      }} -->
-                          <el-radio-group
-                            v-model="dataForm.command"
-                            style="padding-top: 3px"
-                          >
-                            <el-radio
-                              :label="item.id"
-                              v-for="item in taskList"
-                              :key="item.id"
-                              >{{ item.name }}</el-radio
-                            >
-                          </el-radio-group>
-                        </el-col>
-                      </el-row>
-                    </div>
-                    <div v-else style="padding-left: 20px">
-                      <el-row>
-                        <el-col :span="3">控制：</el-col>
-                        <el-col :span="21">
-                          <el-radio-group
-                            v-model="dataForm.command"
-                            style="padding-top: 3px"
-                          >
-                            <el-radio
-                              :label="item.id"
-                              v-for="item in taskList"
-                              :key="item.id"
-                              >{{ item.name }}</el-radio
-                            >
-                          </el-radio-group>
-                        </el-col>
-                      </el-row>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </el-col>
-          </el-row>
-        </div>
-
-        <!--        <span slot="footer" class="dialog-footer">
-          <el-button @click="deviceDialogVisible = false" size="small">取 消</el-button>
-          <el-button type="primary" @click="addOrUpdateSub" size="small">确 定</el-button>
-        </span>-->
-      </el-dialog>
-
-      <transition name="el-zoom-in-top">
-        <div class="control-item" v-show="deviceControlShow && !main2DShow">
-          <div
-            style="
-              padding: 15px 20px 0px;
-              height: 25px;
-              line-height: 35px;
-              font-size: 16px;
-            "
-          >
-            <div style="float: left">
-              <span
-                style="
-                  float: left;
-                  width: 10px;
-                  height: 10px;
-                  background: #2b6bb6;
-                  margin: 14px 5px 0 0;
-                "
-              ></span
-              >{{ addOrUpdateTitle }}
-            </div>
-            <div
-              @click="deviceClose"
-              style="
-                float: right;
-                width: 20px;
-                text-align: center;
-                cursor: pointer;
-              "
-            >
-              X
-            </div>
-          </div>
-          <div
-            style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"
-          ></div>
-          <div
-            style="
-              padding: 0 20px 20px;
-              width: calc(100% - 40px);
-              height: calc(100% - 80px);
-            "
-          >
-            <div style="width: 100%; height: 100%; overflow: auto">
-              <div
-                v-show="deviceLoading"
-                style="
-                  position: absolute;
-                  z-index: 9999;
-                  left: calc(50% - 60px);
-                  top: 48%;
-                  background: #ce811b;
-                  padding: 10px 20px;
-                  border-radius: 5px;
-                "
-              >
-                正在发送指令...
-              </div>
-              <div
-                v-loading="deviceLoading"
-                element-loading-text=""
-                element-loading-spinner="el-icon-loading"
-                element-loading-background="rgba(0, 0, 0, 0.5)"
-              >
-                <div
-                  v-show="dataForm.deviceType != 22"
-                  style="min-height: 60px; color: #1afff7"
-                >
-                  <div
-                    style="
-                      display: inline-block;
-                      vertical-align: top;
-                      width: 100%;
-                    "
-                  >
-                    <template v-if="dataForm.deviceType == '15'">
-                      <div
-                        style="height: 60px; padding-left: 10px; overflow: auto"
-                      >
-                        <div
-                          style="display: inline-block; vertical-align: top"
-                          v-html="templateInfoHtml"
-                        ></div>
-                      </div>
-                    </template>
-                    <template v-else-if="dataForm.deviceType == '26'">
-                      <el-row
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <el-col :span="10"
-                          >风向：{{ dataForm.direction26 }}</el-col
-                        >
-                        <el-col :span="11"
-                          >风速：{{ dataForm.speed26
-                          }}<span v-show="dataForm.speed26">(m/s)</span></el-col
-                        >
-                      </el-row>
-                    </template>
-                    <template v-else-if="dataForm.deviceType == '27'">
-                      <el-row
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <el-col :span="15"
-                          >co 浓度值：{{ dataForm.co27
-                          }}<span v-show="dataForm.co27">(PPM)</span></el-col
-                        >
-                        <el-col :span="9"
-                          >vi 能见度：{{ dataForm.vi27
-                          }}<span v-show="dataForm.vi27"></span></el-col
-                        >
-                      </el-row>
-                    </template>
-                    <template v-else-if="dataForm.deviceType == '28'">
-                      <el-row
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <el-col :span="15">光强：{{ dataForm.light28 }}</el-col>
-                      </el-row>
-                    </template>
-                    <template v-else-if="dataForm.deviceType == '43'">
-                      <div
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <p>
-                          水位高度：{{ dataForm.height43
-                          }}<span v-show="dataForm.height43">(m)</span>
-                        </p>
-                      </div>
-                    </template>
-                    <template
-                      v-else-if="
-                        dataForm.deviceType == '40' ||
-                        dataForm.deviceType == '41' ||
-                        dataForm.deviceType == '42'
-                      "
-                    >
-                      <div
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <p v-for="(item, index) in iotKeyData" :key="index">
-                          <span style="display: inline-block; width: 100px">
-                            {{ item.name }}
-                          </span>
-                          <span
-                            v-for="(item1, index1) in item.data"
-                            :key="index1"
-                            style="display: inline-block; width: 100px"
-                          >
-                            {{ item1.name }}
-                          </span>
-                        </p>
-                      </div>
-                    </template>
-                    <template v-else>
-                      <div
-                        v-show="dataForm.taskName != -1"
-                        style="
-                          min-height: 30px;
-                          font-size: 16px;
-                          padding-left: 10px;
-                        "
-                      >
-                        <template v-if="dataForm.deviceType == '19'">{{
-                          filedFomatter(
-                            dataForm.taskName,
-                            taskEnum['19'].taskList2
-                          )
-                        }}</template>
-                        <template v-else>{{
-                          filedFomatter(dataForm.taskName, taskList)
-                        }}</template>
-                      </div>
-                      <!--                <div v-show="dataForm.taskName == -1" style="min-height: 30px;font-size: 16px;padding: 20px 0 0 10px;font-size: 22px;color: #1AFFF7;">
-                                        暂无反馈
-                                      </div>-->
-                    </template>
-                  </div>
-                </div>
-
-                <div class="item-frame">
-                  <div class="item-frame-title">设备基本信息</div>
-                  <div style="padding: 20px">
-                    <el-descriptions
-                      title=""
-                      :column="1"
-                      :labelStyle="{
-                        width: '60px',
-                        'text-align': 'right',
-                        display: 'block',
-                        color: '#D5E0EE',
-                      }"
-                      :contentStyle="{ width: '95%' }"
-                    >
-                      <el-descriptions-item label="设备类型">{{
-                        filedFomatter(dataForm.deviceType, deviceTypeList)
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="所属隧道">{{
-                        filedFomatter(dataForm.area, areaList)
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="设备编号">{{
-                        dataForm.deviceId
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="物联key">{{
-                        dataForm.iotKey
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="modelId">{{
-                        dataForm.modelId
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="所属方向">{{
-                        filedFomatter(dataForm.direction, directionList)
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="桩号">{{
-                        dataForm.pileNumShow
-                      }}</el-descriptions-item>
-                      <el-descriptions-item label="断面位置">{{
-                        filedFomatter(dataForm.lane, laneList)
-                      }}</el-descriptions-item>
-                    </el-descriptions>
-                  </div>
-                </div>
-                <div class="item-frame" style="margin-top: 20px">
-                  <div class="item-frame-title">设备控制</div>
-                  <div style="padding: 20px">
-                    <div
-                      v-if="dataForm.deviceType == 22"
-                      style="
-                        width: 75%;
-                        height: 340px;
-                        background: black;
-                        margin-left: 5%;
-                      "
-                    >
-                      <flv-player :videoUrl="videoUrl"></flv-player>
-                    </div>
-                    <div
-                      v-else-if="
-                        dataForm.deviceType == 26 ||
-                        dataForm.deviceType == 27 ||
-                        dataForm.deviceType == 28 ||
-                        dataForm.deviceType == 39 ||
-                        dataForm.deviceType == 43
-                      "
-                    >
-                      <div
-                        style="
-                          min-height: 200px;
-                          padding-bottom: 20px;
-                          padding-top: 10px;
-                        "
-                      >
-                        无
-                      </div>
-                    </div>
-                    <div v-else style="position: relative">
-                      <el-button
-                        type="primary"
-                        @click="handleCommitClick(0)"
-                        size="mini"
-                        style="position: absolute; right: 0px; top: -20px"
-                        >发送</el-button
-                      >
-                      <div
-                        style="
-                          min-height: 100px;
-                          padding-bottom: 20px;
-                          padding-top: 10px;
-                        "
-                      >
-                        <div v-if="dataForm.deviceType == '12'">
-                          <el-row>
-                            <el-col :span="4">控制：</el-col>
-                            <el-col :span="20">
-                              <el-radio-group
-                                v-model="dataForm.command"
-                                style="padding-top: 3px"
-                              >
-                                <el-radio
-                                  :label="item.id"
-                                  v-for="item in taskList"
-                                  :key="item.id"
-                                  >{{ item.name }}</el-radio
-                                >
-                              </el-radio-group>
-                            </el-col>
-                          </el-row>
-                          <el-row style="margin-top: 5px">
-                            <el-col :span="4" style="line-height: 36px"
-                              >亮度：</el-col
-                            >
-                            <el-col :span="20">
-                              <el-slider
-                                style="width: calc(100% - 100px)"
-                                v-model="dataFormBody.light"
-                              ></el-slider>
-                            </el-col>
-                          </el-row>
-                        </div>
-                        <div v-else-if="dataForm.deviceType == '15'">
-                          <el-row>
-                            <el-col :span="4">控制：</el-col>
-                            <el-col :span="20" class="temlCheckClass">
-                              <!--                          <div v-for="item in infoBoardTemplateList">
-                                                          <div style="height: 30px">
-                                                            <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
-                                                          </div>
-                                                        </div>-->
-                              <!-- <el-checkbox-group v-model="textInfoList">
-                                <div
-                                  v-for="item in infoBoardTemplateList"
-                                  :key="item.id"
-                                  style="margin-bottom: 5px"
-                                >
-                                  <el-checkbox :label="item.id">
-                                    <span
-                                      @input="addComment($event, item)"
-                                      v-html="item.templateHtml"
-                                    ></span
-                                    ><br />
-                                    <span
-                                      style="color: #a8a8a8; font-size: 12px"
-                                      >宽:{{ item.cmsWidth }} 高:{{
-                                        item.cmsHeight
-                                      }}
-                                      字体大小:{{ item.fontSize }} 字体颜色:{{
-                                        item.fontColor
-                                      }}</span>
-                                  </el-checkbox>
-                                </div>
-                              </el-checkbox-group> -->
-                            </el-col>
-                          </el-row>
-                        </div>
-                        <div
-                          v-else-if="
-                            dataForm.deviceType == '40' ||
-                            dataForm.deviceType == '41' ||
-                            dataForm.deviceType == '42'
-                          "
-                        >
-                          <div style="float: left; width: 35%">
-                            <el-row>
-                              <el-col :span="4">设备：</el-col>
-                              <el-col :span="20">
-                                <el-checkbox-group v-model="dataForm.iotKeys">
-                                  <el-checkbox
-                                    v-for="item in iotKeyList"
-                                    v-show="item.show"
-                                    :label="item.id"
-                                    :key="item.id"
-                                    >{{ item.name }}</el-checkbox
-                                  >
-                                </el-checkbox-group>
-                              </el-col>
-                            </el-row>
-                          </div>
-                          <div style="float: left; width: 55%">
-                            <el-row>
-                              <el-col :span="4">控制：</el-col>
-                              <el-col :span="20">
-                                <el-radio-group
-                                  v-model="dataForm.command"
-                                  style="padding-top: 3px"
-                                >
-                                  <el-radio
-                                    :label="item.id"
-                                    v-for="item in taskList"
-                                    :key="item.id"
-                                    >{{ item.name }}</el-radio
-                                  >
-                                </el-radio-group>
-                              </el-col>
-                            </el-row>
-                          </div>
-                        </div>
-
-                        <div v-else>
-                          <el-row>
-                            <el-col :span="4">控制：</el-col>
-                            <el-col :span="20">
-                              <el-radio-group
-                                v-model="dataForm.command"
-                                style="padding-top: 3px"
-                              >
-                                <el-radio
-                                  :label="item.id"
-                                  v-for="item in taskList"
-                                  :key="item.id"
-                                  >{{ item.name }}</el-radio
-                                >
-                              </el-radio-group>
-                            </el-col>
-                          </el-row>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </transition>
-
-      <el-dialog
-        top="8vh"
-        style="pointer-events: auto"
-        title="设备"
-        :visible.sync="deviceDialogVisible2"
-        width="1000px"
-        :close-on-click-modal="false"
-        v-if="deviceDialogVisible2"
-        @close="deviceClose"
-      >
-        <el-row>
-          <el-col :span="14" style="border-right: 1px solid #cccccc">
-            <el-table
-              size="small"
-              :data="deviceData2"
-              height="500px"
-              @selection-change="handleSelectionChange"
-              style="width: 100%"
-            >
-              <el-table-column type="selection" width="55"> </el-table-column>
-              <el-table-column
-                prop="deviceType"
-                label="设备类型"
-                :formatter="
-                  (row) => filedFomatter(row.deviceType, deviceTypeList)
-                "
-              >
-              </el-table-column>
-              <el-table-column
-                prop="deviceId"
-                label="设备编号"
-                show-overflow-tooltip
-              >
-              </el-table-column>
-              <el-table-column
-                prop="pileNumShow"
-                label="桩号"
-                show-overflow-tooltip
-              >
-              </el-table-column>
-              <el-table-column
-                prop="direction"
-                label="方向"
-                :formatter="
-                  (row) => filedFomatter(row.direction, directionList)
-                "
-                show-overflow-tooltip
-              >
-              </el-table-column>
-              <el-table-column prop="task" label="状态" show-overflow-tooltip>
-                <template slot-scope="scope">
-                  <span v-if="scope.row.task">
-                    <span v-if="JSON.parse(scope.row.task).command != -1">
-                      <template v-if="scope.row.deviceType == '19'">{{
-                        filedFomatter(
-                          JSON.parse(scope.row.task).command,
-                          taskEnum['19'].taskList2
-                        )
-                      }}</template>
-                      <template v-else>{{
-                        filedFomatter(
-                          JSON.parse(scope.row.task).command,
-                          taskList
-                        )
-                      }}</template>
-                    </span>
-                  </span>
-                </template>
-              </el-table-column>
-              <!--              <el-table-column
-                  fixed="right"
-                  label="操作"
-                  width="80">
-                <template slot-scope="scope">
-
-                  <el-button @click="handleClick(scope.row)" type="text">控制</el-button>
-
-                </template>
-              </el-table-column>-->
-            </el-table>
-          </el-col>
-          <el-col :span="10" v-show="controlShow" style="padding-left: 5px">
-            <p style="margin-bottom: 10px; font-size: 16px">
-              <span
-                style="
-                  float: left;
-                  width: 10px;
-                  height: 10px;
-                  background: #2b6bb6;
-                  margin: 7px 5px 0 0;
-                "
-              ></span>批量控制
-              <el-button
-                type="primary"
-                @click="handleCommitClick(1)"
-                size="mini"
-                style="float: right; margin-right: 20px"
-                >发送</el-button
-              >
-            </p>
-            <div
-              v-loading="deviceLoading"
-              element-loading-text="正在发送指令..."
-              element-loading-spinner="el-icon-loading"
-              element-loading-background="rgba(0, 0, 0, 0.5)"
-              style="padding-bottom: 20px; margin-top: 15px; min-height: 100px"
-            >
-              <div
-                v-if="dataForm.deviceType == '12'"
-                style="padding-left: 20px"
-              >
-                <el-row>
-                  <el-col :span="3">控制：</el-col>
-                  <el-col :span="21">
-                    <el-radio-group v-model="dataForm.command">
-                      <el-radio
-                        :label="item.id"
-                        v-for="item in taskList"
-                        :key="item.id"
-                        >{{ item.name }}</el-radio
-                      >
-                    </el-radio-group>
-                  </el-col>
-                </el-row>
-                <el-row style="margin-top: 5px">
-                  <el-col :span="3" style="line-height: 36px">亮度：</el-col>
-                  <el-col :span="21">
-                    <el-slider
-                      style="width: calc(100% - 100px)"
-                      v-model="dataFormBody.light"
-                    ></el-slider>
-                  </el-col>
-                </el-row>
-              </div>
-              <div
-                v-else-if="dataForm.deviceType == '15'"
-                style="padding-left: 20px"
-              >
-                <el-row>
-                  <el-col :span="3">控制：</el-col>
-                  <el-col :span="21" class="temlCheckClass">
-                    <!--                          <div v-for="item in infoBoardTemplateList">
-                                                <div style="height: 30px">
-                                                  <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
-                                                </div>
-                                              </div>-->
-                    <!-- <el-checkbox-group v-model="textInfoList">
-                      <div
-                        v-for="item in infoBoardTemplateList"
-                        :key="item.id"
-                        style="margin-bottom: 5px"
-                      >
-                        <el-checkbox :label="item.id">
-                          <span
-                            @input="addComment($event, item)"
-                            v-html="item.templateHtml"
-                          ></span
-                          ><br />
-                          <span style="color: #a8a8a8; font-size: 12px"
-                            >宽:{{ item.cmsWidth }} 高:{{
-                              item.cmsHeight
-                            }}
-                            字体大小:{{ item.fontSize }} 字体颜色:{{
-                              item.fontColor
-                            }}</span
-                          >
-                        </el-checkbox>
-                      </div>
-                    </el-checkbox-group> -->
-                                   <el-tree
-            class="filter-tree"
-            :data="treeData"
-            :props="defaultProps"
-            :filter-node-method="filterNode"
-            ref="tree"
-            show-checkbox
-  @check-change="handleCheckChange"
-   v-model="textInfoList"
-   @check="handleCheck"
-          >
-            <div class="custom-tree-node" slot-scope="{ node, data }">
-              <el-tooltip :content="node.label" placement="top">
-                <span class="label"  v-if="node.level === 1">{{ data.name }}</span>
-                <span class="label"  v-if="node.level !== 1">{{ data.content }}</span>
-              
-              </el-tooltip>
-          <br />
-                  <span style="color: #a8a8a8; font-size: 12px;"
-                                  v-if="node.level !== 1">高宽:{{ data.displaySize }} </span>
-                                  <span style="color: #a8a8a8; font-size: 12px;" v-if="node.level !== 1">
-                               大小:{{ data.fontSize }} 颜色:{{getColor(data.fontColor)}}</span>
-      
-            </div>
-          </el-tree>
-                  </el-col>
-                </el-row>
-              </div>
-
-              <div v-else style="padding-left: 20px">
-                <el-row>
-                  <el-col :span="3">控制：</el-col>
-                  <el-col :span="21">
-                    <el-radio-group v-model="dataForm.command">
-                      <el-radio
-                        :label="item.id"
-                        v-for="item in taskList"
-                        :key="item.id"
-                        >{{ item.name }}</el-radio
-                      >
-                    </el-radio-group>
-                  </el-col>
-                </el-row>
-              </div>
-            </div>
-          </el-col>
-        </el-row>
-      </el-dialog>
-    </div>
-  </div>
-</template>
-
-<script>
-import * as echarts from 'echarts'
-import cookies from 'js-cookie'
-var dataList = {}
-import {
-  addOrModDevice,
-  iotControl,
-  newIotControl,
-  newIotControlS,
-  playManuallyTriggered,
-  getIotDeviceStatus,
-  deviceList,
-  deviceList1,
-  batchControl,
-  deviceStatus,
-  infoBoardTemplateList,
-  warnList,
-  statsticWhole,
-  getPlayAddressByPid,
-  deviceStatusBatch,
-  planList,
-} from '@/api'
-import { dateTimeFormat, filedFomatter } from '../../utils/utils'
-import FlvPlayer from '@/components/FlvPlayer.vue'
-import { connectWebsocket } from '@/utils/websocket'
-import {
-  addBroadcast,
-  flowStatistic,
-  getEmployeeList,
-  getMediaList,
-  latestWarnList,
-  planDetail,
-  planExecute,
-  verify,
-  getProgramTree
-} from '../../api'
-import { tunnelLeftList, tunnelRightList } from '../../utils/pathJson'
-
-export default {
-  name: 'index',
-  components: {
-    FlvPlayer,
-  },
-  data() {
-    return {
-      nowTime: '',
-      searchForm: {
-        area: '2',
-        editable: '2',
-      },
-        treeData: [],
-        filterText: "",
-      areaList: window.config.areaList,
-      deviceTypeList: window.config.deivceTypeList,
-      deviceTypeList1: [
-        { id: '11', name: '风机' },
-        { id: '13', name: '车道指示灯' },
-        { id: '14', name: '交通信号灯' },
-        { id: '15', name: '情报板' },
-        { id: '19', name: '卷帘门' },
-        { id: '21', name: '消防水池' },
-        { id: '25', name: '微波车辆检测器' },
-        { id: '26', name: '风速风向' },
-        { id: '27', name: '一氧化碳能见度' },
-        { id: '28', name: '光强传感器' },
-        { id: '39', name: '配电房' },
-        { id: '40', name: '消防泵房' },
-        { id: '41', name: '污水泵房' },
-        { id: '42', name: '雨水泵房' },
-        { id: '45', name: '可变限速标志' },
-      ],
-      laneList: window.config.laneList,
-      directionList: window.config.directionList,
-      statusList: window.config.statusList,
-      colorList: [
-        { id: 'c255000000000', name: '红' },
-        { id: 'c255255000000', name: '黄' },
-        { id: 'c000255000000', name: '绿' },
-      ],
-      warnTypeList: window.config.warnTypeList,
-      warnStatusList: window.config.warnStatusList,
-      deviceBarTypeList: [
-        { id: '15', name: '情报板' },
-        { id: '11', name: '风机' },
-        { id: '13', name: '车道指示灯' },
-        { id: '14', name: '交通信号灯' },
-        { id: '19', name: '卷帘门' },
-         { id: '40', name: '消防泵房' },
-        { id: '41', name: '污水泵房' },
-        /*{id: '16', name: '报警器'},*/ 
-        // {
-        //   id: '17',
-        //   name: '广播电话系统',
-        //   url: window.config.typeUrlLink['17'],
-        // },
-        // { id: '12', name: '照明系统', url: window.config.typeUrlLink['12'] }
-        // ,
-      ],
-      taskEnum: window.config.taskEnum,
-      totalWidth: 1562,
-      totalHeight: 560,
-      // 保存拖拽的元素的列表
-      componentsList: [],
-      componentsOldList: [],
-      deviceId: '', // 当前项的 唯一标识
-      curControl: null, //
-      warnControl: null,
-      flag: '',
-      containerMoveObj: {
-        type: '',
-        x: '',
-        y: '',
-      },
-      scale: 1,
-
-      dataForm: {},
-      dataFormBody: {},
-      deviceDialogVisible: false,
-      addOrUpdateTitle: '',
-      rules: {
-        deviceId: [{ required: true, message: '请输入', trigger: 'blur' }],
-        deviceType: [{ required: true, message: '请选择', trigger: 'change' }],
-      },
-      pileNumMap: {
-        1: {
-          left: 'K30+600',
-          right: 'K34+800',
-        //   length1: '4000',
-        //   length2: '2616',
-            length1: '2616',
-          length2: '2606',
-          width: 5000,
-          pileNumData: ['K31+294', 'K33+916'],
-          n: 10,
-        },
-        2: {
-          left: 'K58+176',
-          right: 'K60+976',
-        //   length1: '2800',
-         length1: '2200',
-          length2: '2200',
-          width: 5000,
-          pileNumData: ['K58+476', 'K60+676'],
-          n: 10,
-        },
-        // 1: {
-        //   left: 'K9+720',
-        //   right: 'K11+076',
-        //   length1: '960',
-        //   length2: '624',
-        //   width: 1893,
-        //   pileNumData: ['K9+933', 'K10+595'],
-        //   n: 5,
-        // },
-        // 2: {
-        //   left: 'K16+650',
-        //   right: 'K18+150',
-        //   length1: '965.647',
-        //   length2: '965.647',
-        //   width: 1993,
-        //   pileNumData: ['K17+015', 'K17+935'],
-        //   n: 5,
-        // },
-        // 3: {
-        //   left: 'K18+220',
-        //   right: 'K21+250',
-        //   length1: '2897.232',
-        //   length2: '2897.232',
-        //   width: 6000,
-        //   pileNumData: ['K18+302', 'K20+990'],
-        //   n: 19,
-        // },
-      },
-      pileNumList: [],
-      deviceForm: {},
-
-      warnShow: true,
-      planShow: false,
-      planList: [],
-      planDetailShow: false,
-      warnDetailShow: false,
-      planForm: {},
-      planDetailData: [],
-      planDetailMap: {
-        11: [],
-        13: [],
-        14: [],
-        15: [],
-        19: [],
-      },
-      deviceRunShow: false,
-      main2DShow: true,
-      deviceType: '',
-
-      marks: 10, // 刻度的数量
-      markWidth: 100, // 每个刻度的宽度
-
-      deviceData: [],
-      taskList: [],
-      deviceData2: [],
-      deviceDialogVisible2: false,
-      infoBoardTemplateList: [],
-      textInfoList: [],
-      tempMap: {},
-      controlShow: false,
-      multipleSelection: [],
-      warnList: [{
-        id:'1',
-        status:1,
-        type:''
-      },{
-        id:'2',
-        status:2,
-        type:''
-      }],
-      componentsWarnList: [],
-      statusTimer: null,
-      deviceLoading: false,
-      warnMap: {},
-      templateHtmlList: [],
-      templateInfoHtml: '',
-      statsticInfo: {
-        warn_count_done: 0,
-        device_error: 0,
-        warn_count_todo: 0,
-        device_count: 0,
-      },
-      videoForm: window.config.videoForm,
-      videoUrl: '',
-      iotKeyList: [],
-      iotKeyData: [],
-      warnForm: {},
-      planLoading: false,
-      planSuccess: false,
-      planDeviceType: ['14', '13', '11', '15', '19'],
-        defaultProps: {
-        children: "children",
-        label: "name",
-        name:"name",
-        content: "content",
-        // displaySize: "displaySize",
-      },
-      listMedia: [
-        /*{
-          id:20,
-          "name":"1前方隧道施工，请按车道指示灯行驶",
-          "path":"/soft/upload/audio/e5ccbd29-3788-4480-9d83-8ad0a5d5a320.mp3",
-          "type":1
-        },
-        {
-          id:4,
-          "name":"1前方隧道施工",
-          "path":"/soft/upload/audio/36ebd0f5-4c3a-4585-8d25-3afa9f3dc7ca.mp3",
-          "type":1
-        }*/
-      ],
-      mediaObj: null,
-      templateObj: '',
-      deviceControlShow: false,
-      deviceIds15: [],
-      deviceIds: [],
-      deviceDataId: [],
-      patrolShow: false,
-    }
-  },
-  mounted() {
-    console.log(this.$route.params.area,this.$route,'xxxxxxx');
-    if (this.$route.params.area) {
-      
-      this.searchForm.area = this.$route.params.area
-    }
-    this.init()
-    this.handleLinkClient()
-  },
-  methods: {
-    dateTimeFormat,
-    init() {
-      var that = this
-      //sessionStorage.setItem("indexBreadcrumbList", JSON.stringify(["/control","/"]))
-      setInterval(() => {
-        that.nowTime = that.getNowTime()
-      }, 1000)
-
-      that.loadWarnList()
-      that.warnTimer = setInterval(() => {
-        that.loadWarnList()
-      }, 15000)
-
-      setTimeout(() => {
-        if (that.warnList.length > 0) {
-          that.warnShow = true
-        } else {
-          that.warnShow = false
-        }
-        that.tunnelClick(this.searchForm.area)
-      }, 400)
-      that.statsticWhole()
-    },
-    scrollClick(index) {
-      var that = this
-      if (index == 1) {
-        that.$refs.scrollContainer.scrollLeft =
-          that.$refs.scrollContainer.scrollLeft - 800
-      } else {
-        that.$refs.scrollContainer.scrollLeft =
-          that.$refs.scrollContainer.scrollLeft + 800
-      }
-    },
-    statsticWhole() {
-      var that = this
-      statsticWhole().then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.statsticInfo['warn_count_done'] =
-              res.data.result.warn_count_done
-            that.statsticInfo['device_count'] = res.data.result.device_count
-            that.statsticInfo['device_error'] = res.data.result.device_error
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    tunnelClick(id) {
-      var that = this
-      /*if(that.searchForm.area == id){
-        return;
-      }*/
-      that.searchForm.area = id
-      that.loadWarnMarker(that.warnMap[that.searchForm.area])
-      if (!that.main2DShow) {
-        that.main2DShow = true
-        that.deviceClose()
-      }
-
-      var form = that.pileNumMap[that.searchForm.area]
-      var km1 = form.left.replace('K', '').replace('+', '.')
-      var km2 = form.right.replace('K', '').replace('+', '.')
-      console.log('form', form)
-      var num = that.pileNumMap[that.searchForm.area].n
-      var average = (Number(km2) - Number(km1)) / num
-      that.pileNumList = []
-      for (var i = 0; i < num; i++) {
-        let a = (Number(km1) + i * average).toFixed(3)
-        that.pileNumList.push('K' + a.replace('.', '+'))
-      }
-      that.pileNumList.push(form.right)
-      /*var a = (Number(km1) + average).toFixed(3)
-      that.pileNumList = [form.left,'K'+a.replace(".", "+"),form.right]*/
-      console.log('that.pileNumList', that.pileNumList)
-      that.scale = (form.width - 304) / 1000 / (Number(km2) - Number(km1))
-      that.loadTable()
-
-      flowStatistic({ area: that.searchForm.area }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.liuliangLine(res.data.result)
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    loadTable() {
-      var that = this
-      deviceList1(that.searchForm).then((res) => {
-        console.log(res, 'reeessss')
-        if (res.status == 200) {
-          // if (res.data.retCode == 0) {
-            that.tableData = res.data.data
-            console.log(that.tableData, 'ttttttttttttttt')
-            that.loadMarker()
-
-            that.deviceDataId = []
-            that.tableData.forEach((item) => {
-              if (
-                item.deviceType == '11' ||
-                item.deviceType == '13' ||
-                item.deviceType == '14'
-              ) {
-                that.deviceDataId.push(item.deviceId)
-              }
-            })
-            that.dataForm.deviceId = that.deviceDataId.toString()
-            if (that.warnShow) {
-              clearTimeout(that.statusTimer)
-              that.statusTimer = null
-            } else {
-              that.deviceStatusBatch()
-            }
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        // }
-      })
-    },
-    loadMarker() {
-      var that = this
-      that.componentsList = []
-      that.componentsOldList = []
-      that.deviceIdOptions = []
-      that.tableData.forEach((item, index) => {
-        // console.log(item, 'iiittteeemmm')
-        if (item.pileNum) {
-          var json = item
-          let imgForm = window.config.drapLeftElMap[item.deviceType]
-          if (!imgForm) {
-            return
-          }
-          that.deviceIdOptions.push(item.deviceId)
-          json.imgUrl =
-            item.deviceType == 13
-              ? imgForm['url' + item.direction]
-              : imgForm.url
-          var x = 0,
-            y = 0
-          if(item.deviceType == 13){   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
-            console.log(item,item.direction,'xxxxxxxxxx')
-            if(item.direction == 2){ //下行
-              if(item.rotationDirection == null || item.rotationDirection == '正向通行'){
-                json.imgUrl = './lib/icon/132.png'
-              }else if(item.rotationDirection == '反向通行'){
-                json.imgUrl = './lib/icon/131.png'
-              } else if(item.rotationDirection == '封道'){
-                json.imgUrl = './lib/icon/133.png'
-              } else if(item.rotationDirection == '正向左转'){
-                json.imgUrl = './lib/icon/135.png'
-              }
-            //   else if(item.rotationDirection == '反向左转'){
-            //     json.imgUrl = './lib/icon/135.png'
-            //   }
-            }else if(item.direction == 1){ //上行
-              if(item.rotationDirection == null || item.rotationDirection == '正向通行'){
-                json.imgUrl = './lib/icon/131.png'
-              }else if(item.rotationDirection == '反向通行'){
-                json.imgUrl = './lib/icon/132.png'
-              } else if(item.rotationDirection == '封道'){
-                json.imgUrl = './lib/icon/133.png'
-              } else if(item.rotationDirection == '正向左转'){
-                json.imgUrl = './lib/icon/134.png'
-              }
-            //   else if(item.rotationDirection == '反向左转'){
-            //     json.imgUrl = './lib/icon/134.png'
-            //   }
-            }
-          }
-          //风机
-                     if(item.deviceType == 11){   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
-            // console.log(item,item.direction,'xxxxxxxxxx')
-            if(item.direction == 2){ //下行
-              if(item.rotationDirection == null || item.rotationDirection == '正转'){
-                json.imgUrl = './lib/icon/111.gif'
-              }else if(item.rotationDirection == '反转'){
-                json.imgUrl = './lib/icon/112.gif'
-              } else if(item.rotationDirection == '停止'){
-                json.imgUrl = './lib/icon/11.png'
-              }
-              console.log("json.imgUrl",json.imgUrl)
-
-            }else if(item.direction == 1){ //上行
-              if(item.rotationDirection == null || item.rotationDirection == '正转'){
-                json.imgUrl = './lib/icon/111.gif'
-              }else if(item.rotationDirection == '反转'){
-                json.imgUrl = './lib/icon/112.gif'
-              } else if(item.rotationDirection == '停止'){
-                json.imgUrl = './lib/icon/11.png'
-              }
-              console.log("json.imgUrl",json.imgUrl)
-            }
-          }
-          //交通信号灯
-                         if(item.deviceType == 14){   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
-            // console.log(item,item.direction,'xxxxxxxxxx')
-            if(item.direction == 2){ //下行
-              if(item.rotationDirection == null || item.rotationDirection == '变绿灯'){
-                json.imgUrl = './lib/icon/143.png'
-              }else if(item.rotationDirection == '变黄灯'){
-                json.imgUrl = './lib/icon/142.png'
-              } else if(item.rotationDirection == '变红灯'){
-                json.imgUrl = './lib/icon/141.png'
-              }
-
-            }else if(item.direction == 1){ //上行
-              if(item.rotationDirection == null || item.rotationDirection == '变绿灯'){
-                json.imgUrl = './lib/icon/143.png'
-              }else if(item.rotationDirection == '变黄灯'){
-                json.imgUrl = './lib/icon/142.png'
-              } else if(item.rotationDirection == '变红灯'){
-                json.imgUrl = './lib/icon/141.png'
-              }
-            }
-          }
-          json.position = {
-            x: 0,
-            y: 0,
-            w: imgForm.w,
-            h: imgForm.h,
-            bg: '#fff',
-          }
-          let km = item.pileNum.replace('K', '').replace('+', '.')
-          let km1 = that.pileNumMap[that.searchForm.area].left
-            .replace('K', '')
-            .replace('+', '.')
-          let subtract = Number(km) - Number(km1)
-          json.position.x = subtract * 1000 * that.scale - imgForm.w / 2
-          x = subtract * 1000 * that.scale - imgForm.w / 2
-          if (item.lane == 0) {
-            json.position.y = 265 - imgForm.h / 2
-            y = 265 - imgForm.h / 2
-          } else {
-            if (item.direction == '2') {
-              let newLane = that.distanceFromNine(Number(item.lane))
-              json.position.y = newLane * 24 + 13 - imgForm.h / 2
-              y = newLane * 24 + 13 - imgForm.h / 2
-            } else {
-              json.position.y = item.lane * 24 + 271 - imgForm.h / 2
-              y = item.lane * 24 + 271 - imgForm.h / 2
-            }
-          }
-          json.temp = {
-            position: {
-              x: x,
-              y: y,
-            },
-          }
-
-          json.opacity = 1
-
-          json.zIndex = 4
-          if (item.deviceType == '15' || item.deviceType == '51') {
-            json.zIndex = 3
-          } else if (item.deviceType == '55' || item.deviceType == '56') {
-            json.zIndex = 2
-          }
-          // console.log(json, 'ooooooooooooooooooooooooooooooooooooooo')
-          if (item.task) {
-            var j = JSON.parse(item.task)
-            if (item.deviceType == '11') {
-              if (j.command != -1) {
-                json.imgUrl = imgForm['url' + j.command]
-              }
-            } else if (item.deviceType == '13') {
-              if (j.command != -1) {
-                json.imgUrl =
-                  imgForm['url' + item.direction + '' + item.direction][
-                    j.command
-                  ]
-              }
-            } else if (item.deviceType == '14') {
-              if (j.command != -1) {
-                json.imgUrl = imgForm['urls'][j.command]
-              }
-            }
-            console.log(json, 'jjjjjjjjjjjjjjjjjjjjjjjjjj')
-            if (j.body) {
-              var b = JSON.parse(j.body)
-              if (item.deviceType == '12') {
-                //that.$set(that.dataForm, 'light', b.light)
-                json.opacity = b.light / 100
-              } /*else if (item.deviceType == '15') {
-                infoBoardTemplateList().then(res => {
-                  if (res.status == 200) {
-                    if (res.data.retCode == 0) {
-
-                      res.data.result.forEach((item,i)=>{
-                        if(item.id == b.templateId){
-                          json.content = that.domRender(item.textInfo,b.value,item.id,1)
-                        }
-                      })
-                    } else {
-                      that.$message.warning(res.data.message);
-                    }
-                  }
-                })
-              }*/
-            }
-          }
-          that.componentsOldList.push(json)
-        }
-      })
-      setTimeout(() => {
-        that.componentsList = JSON.parse(JSON.stringify(that.componentsOldList))
-        console.log(that.componentsList, 'that.componentsList')
-      }, 1000)
-    },
-
-    deviceTypeClick(item) {
-      console.log('pppppppppppppppppppp', item)
-      var that = this
-      that.deviceClose()
-      if (item.id == '12' || item.id == '17') {
-        window.open(item.url)
-        return
-      }
-      that.controlShow = false
-      that.dataForm = {
-        deviceType: item.id,
-      }
-      that.dataFormBody = {}
-      if (that.dataForm.deviceType == '15') {
-        that.loadinfoBoardTemplate(0)
-        /*infoBoardTemplateList().then(res => {
-          if (res.status == 200) {
-            if (res.data.retCode == 0) {
-              res.data.result.forEach((item,i)=>{
-                var form = {
-                  ...item,
-                  templateHtml:that.domRender(item.textInfo),
-                }
-                that.infoBoardTemplateList.push(form)
-              })
-            } else {
-              that.$message.warning(res.data.message);
-            }
-          }
-        })*/
-      }
-      that.taskList = that.taskEnum[item.id].taskList
-      that.loadDevice2(item.id)
-      that.deviceDialogVisible2 = true
-    },
-    handleSelectionChange(val) {
-      this.$set(this.dataForm, 'command', '')
-      this.multipleSelection = val
-      if (this.multipleSelection.length > 0) {
-        this.controlShow = true
-      } else {
-        this.controlShow = false
-      }
-    },
-    loadDevice2(deviceType) {
-      var that = this
-      deviceList({
-        deviceType: deviceType,
-        area: that.searchForm.area,
-        editable: '2',
-      }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.deviceData2 = res.data.result
-            if (deviceType != '15') {
-              var ids = []
-              that.deviceData2.forEach((item) => {
-                ids.push(item.deviceId)
-              })
-              that.dataForm.deviceId = ids.toString()
-              that.deviceStatusBatch()
-            }
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    typeClick(id) {
-      var that = this
-      if (that.searchForm.deviceType == id) {
-        id = ''
-      }
-      that.searchForm.deviceType = id
-      that.loadTable()
-    },
-    handle2D() {
-      var that = this
-      that.main2DShow = true
-      that.patrolShow = false
-      that.deviceClose()
-    },
-    handle3D() {
-      var that = this
-      if (that.searchForm.area == '2') {
-        that.main2DShow = false
-        deviceList({ area: that.searchForm.area, editable: '2' }).then(
-          (res) => {
-            if (res.status == 200) {
-              if (res.data.retCode == 0) {
-                var data = res.data.result
-                var model13 = []
-                data.forEach((item) => {
-                  if (item.task) {
-                    var j = JSON.parse(item.task)
-                    if (j.command != -1) {
-                      if (item.deviceType == '13' && item.modelId) {
-                        let model13 = {}
-                        if (j.command == 0) {
-                          model13 = {
-                            modelId: [item.modelId],
-                            frontType: 2,
-                            backType: 3,
-                          }
-                        } else if (j.command == 1) {
-                          model13 = {
-                            modelId: [item.modelId],
-                            frontType: 3,
-                            backType: 2,
-                          }
-                        } else if (j.command == 2) {
-                          model13 = {
-                            modelId: [item.modelId],
-                            frontType: 3,
-                            backType: 3,
-                          }
-                        }
-                        that.setLaneStatusIndicator(model13)
-                      } else if (item.deviceType == '14' && item.modelId) {
-                        let a = {
-                          id: '304',
-                          status: 'N',
-                          isFlash: false,
-                          remainTime: 55,
-                        }
-                        let b = {
-                          id: '305',
-                          status: 'N',
-                          isFlash: false,
-                          remainTime: 55,
-                        }
-                        if (j.command == 1) {
-                          a.status = 'R'
-                        } else if (j.command == 2) {
-                          a.status = 'Y'
-                        } else if (j.command == 3) {
-                          a.status = 'G'
-                        } else if (j.command == 4) {
-                          b.status = 'G'
-                        }
-                        that.updateTrafficSignal([a, b])
-                      } else if (item.deviceType == '15' && item.modelId) {
-                        if (j.body) {
-                          j.dataFormBody = JSON.parse(j.body)
-                          console.log("j.dataFormBody",j.dataFormBody)
-                          that.loadinfoBoardTemplate(
-                            3,
-                            j.dataFormBody.textInfoList,
-                            item.modelId
-                          )
-                        }
-                      }
-                    }
-                  }
-                })
-              } else {
-                that.$message.warning(res.data.message)
-              }
-            }
-          }
-        )
-      }
-    },
-    handlePatrol() {
-      var that = this
-      that.patrolShow = !that.patrolShow
-      //that.setCameraRoaming(tunnelRightList)
-    },
-    setCameraRoaming(data) {
-      let params = {
-        coordType: 0,
-        coordTypeZ: 1,
-        loopMode: false,
-        visualMode: 1,
-        pitch: 1,
-        speed: 50,
-        pointDistance: 0,
-        point: data,
-      }
-
-      // js 形式
-      try {
-        window.MetaDigieeApi.Camera.setCameraRoaming(params)
-        //成功返回
-      } catch (err) {
-        //异常处理
-      }
-    },
-    patrolClick(val) {
-      var that = this
-      var params = {
-        movingState: 'pause',
-      }
-      switch (val) {
-        case 'pause':
-          params = {
-            movingState: 'pause',
-          }
-          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
-
-          break
-        case 'play':
-          params = {
-            movingState: 'continue',
-          }
-          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
-          break
-        case 'end':
-          params = {
-            movingState: 'stop',
-          }
-          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
-          break
-        case 'tunnelLeft':
-          that.setCameraRoaming(tunnelLeftList)
-          break
-        case 'tunnelRight':
-          that.setCameraRoaming(tunnelRightList)
-          break
-      }
-    },
-    async handleLinkClient() {
-      var that = this
-      that.passrecordList = []
-      const params = window.config.mapParams
-      try {
-        let res = await window.MetaDigieeApi.Service.openService(params)
-        console.log(res)
-        if (res.code == 200) {
-          let params2 = {
-            pitchRotSpeed: 10,
-            yawRotSpeed: 10,
-            scaleSpeed: 10,
-            translateSpeed: 10,
-          }
-          window.MetaDigieeApi.Camera.setCameraSpeedInfo(params2)
-
-          let params3 = {
-            intersectionId: ['Cross01'],
-            state: true,
-          }
-          window.MetaDigieeApi.TrafficSignal.setTrafficSignalState(params3)
-
-          setTimeout(() => {
-            that.setVehicleTrackState() //开启车辆实时轨迹
-          }, 1000)
-
-          let res = await window.MetaDigieeApi.Event.addMouseEventListener(
-            (event) => {
-              if (event.data.modelId && event.data.eventType === 'click') {
-                that.dataForm = {}
-                that.addOrUpdateTitle = ''
-                deviceList({ modelId: event.data.modelId }).then((res) => {
-                  if (res.status == 200) {
-                    if (res.data.retCode == 0) {
-                      if (res.data.result.length > 0) {
-                        that.handleClick(res.data.result[0], 0)
-                        //that.addInfoWindow(event.data.modelId,`./iframe/event.html?deviceId=${item.deviceId}&deviceType=${item.deviceType}&pileNumShow=${item.pileNumShow}&direction=${item.direction}`,[540,360],[20,-330])
-
-                        /*setTimeout(()=>{
-                        that.addInfoWindow(event.data.modelId,item)
-                      },400)*/
-                      } else {
-                        that.deviceClose()
-                      }
-                    } else {
-                      that.$message.warning(res.data.message)
-                    }
-                  }
-                })
-              }
-            }
-          )
-        } else {
-          that.$message.warning(res.message)
-        }
-      } catch (err) {
-        that.$message.warning(err)
-      }
-    },
-    async addInfoWindow(modelId, item) {
-      var that = this
-      var taskName = ''
-      if (item.task) {
-        var j = JSON.parse(item.task)
-        taskName = that.filedFomatter(
-          j.command,
-          that.taskEnum[item.deviceType].taskList
-        )
-      }
-      console.log(taskName)
-      try {
-        let params = {
-          modelId: modelId,
-          windowDoc:
-            '<div style="border: 1px solid #27bebe;background: rgba(19,110,206,0.5);padding: 0 20px;font-size: 14px;line-height: 25px;color: white">' +
-            '<div><span style="font-weight: 300;">设备类型：' +
-            filedFomatter(item.deviceType, that.deviceTypeList) +
-            '</span></div>' +
-            '<div><span style="font-weight: 300;;word-wrap: break-word">modelId：' +
-            item.modelId +
-            '</span></div>' +
-            '<div><span style="font-weight: 300;;word-wrap: break-word">物联key：' +
-            item.iotKey +
-            item.modelId +
-            item.modelId +
-            '</span></div>' +
-            '<div><span style="font-weight: 300;">桩号：' +
-            item.pileNumShow +
-            '</span></div>' +
-            '<div><span style="font-weight: 300;">运行状态：' +
-            taskName +
-            '</span></div>' +
-            '</div>',
-          infoWindowId: 'infoWindow01',
-          windowSize: [400, 200],
-          windowOffset: [0, 0],
-          dismissible: true,
-        }
-        window.MetaDigieeApi.InfoWindow.addInfoWindow(params)
-        //成功返回
-      } catch (err) {
-        //异常处理
-      }
-    },
-    async setLaneStatusIndicator(model13) {
-      var that = this
-      try {
-        let params = model13
-        //成功返回
-        let res = await window.MetaDigieeApi.LSIS.setLaneStatusIndicator(params)
-      } catch (e) {}
-    },
-    async updateTrafficSignal(phase) {
-      var that = this
-      const params = {
-        effectSignalVisible: false,
-      }
-      const res =
-        await window.MetaDigieeApi.TrafficSignal.setEffectTrafficSignalVisibility(
-          params
-        )
-      try {
-        let params = [
-          {
-            intersectionId: 'Cross01',
-            changeTime: '2023-02-16 12:00:00',
-            phase: phase,
-          },
-        ]
-        //成功返回
-        let res = await window.MetaDigieeApi.TrafficSignal.updateTrafficSignal(
-          params
-        )
-      } catch (e) {}
-    },
-    async updateVMSInfo(data) {
-      var that = this
-      try {
-        let params = data
-        let res = await window.MetaDigieeApi.VMS.updateVMSInfo(params)
-        //成功返回
-      } catch (err) {
-        //异常处理
-        console.log(err)
-      }
-    },
-    async setVehicleTrackState() {
-      var that = this
-      try {
-        const params = {
-          modelId: ['mec0'],
-          isAdsorbed: true,
-          mode: 0,
-          state: true,
-        }
-        let res123 =
-          await window.MetaDigieeApi.VehicleTrack.setVehicleTrackState(params)
-
-        let params1 = {
-          plateVisible: true,
-        }
-        window.MetaDigieeApi.VehicleTrack.setVehiclePlateVisibility(params1) //显示车牌
-        let params2 = {
-          speedVisible: true,
-        }
-        window.MetaDigieeApi.VehicleTrack.setVehicleSpeedVisibility(params2) //显示车速
-
-        if (res123.code == 200) {
-          setTimeout(() => {
-            that.loadData()
-          }, 200)
-        }
-      } catch (err) {
-        //异常处理
-        console.log(err)
-      }
-    },
-    loadData() {
-      var that = this
-      connectWebsocket(
-        // 测试地址
-        window.config.wsUrl,
-        // 传递给后台的数据
-        '',
-        // { openexe: 'openexe' },
-        // 成功拿到后台返回的数据的回调函数
-        (data) => {
-          if (data) {
-            dataList = JSON.parse(data)
-            console.log(dataList)
-            if (dataList.facilityId) {
-              that.updateVehicleTrack(dataList)
-            }
-          }
-        },
-        // websocket连接失败的回调函数
-        (err) => {
-          console.log('失败的回调函数', err)
-          dataList = {}
-        }
-      )
-    },
-    async updateVehicleTrack(vehicleList) {
-      try {
-        let params = vehicleList
-        let res = await window.MetaDigieeApi.VehicleTrack.updateVehicleTrack(
-          params
-        )
-        //成功返回
-        console.log(res)
-      } catch (err) {
-        //异常处理
-        console.log(err)
-      }
-    },
-    handleWarnClick(index) {
-      console.log(index, 'xxxxxxxxxxxxxxxxxxx')
-      var that = this
-      clearTimeout(that.statusTimer)
-      that.statusTimer = null
-
-      that.planClose()
-      that.warnList = []
-      if (index == '2') {
-        latestWarnList().then((res) => {
-          if (res.status == 200) {
-            if (res.data.retCode == 0) {
-              that.warnList = res.data.result
-              that.statsticInfo.warn_count_todo = res.data.total
-            } else {
-              //that.$message.warning(res.data.message);
-            }
-          }
-        })
-      } else {
-        warnList({ status: index }).then((res) => {
-          if (res.status == 200) {
-            if (res.data.retCode == 0) {
-              that.warnList = res.data.result
-            } else {
-              that.$message.warning(res.data.message)
-            }
-          }
-        })
-      }
-      that.warnShow = true
-    },
-    loadWarnList() {
-      var that = this
-      latestWarnList().then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.warnList = res.data.result
-            that.statsticInfo.warn_count_todo = res.data.total
-
-            var warnList = res.data.result
-            that.warnMap = {}
-            var arr1 = []
-            var arr2 = []
-            var arr3 = []
-            warnList.forEach((item) => {
-              if (item.area == 1) {
-                arr1.push(item)
-              } else if (item.area == 2) {
-                arr2.push(item)
-              } else if (item.area == 3) {
-                arr3.push(item)
-              }
-            })
-            that.warnMap = {
-              1: arr1,
-              2: arr2,
-              3: arr3,
-            }
-            that.loadWarnMarker(that.warnMap[that.searchForm.area])  ////加载报警图标
-          } else {
-            //that.$message.warning(res.data.message);
-          }
-        }
-      }) /*
-      warnList({status:'1,2'}).then(res=>{
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.warnList = res.data.result
-            if(that.warnList.length > 0){
-              that.warnShow = true;
-            }
-            var warnList = res.data.result
-            that.warnMap = {}
-            var arr1 = []
-            var arr2 = []
-            var arr3 = []
-            warnList.forEach(item=>{
-              if(item.area == 1){
-                arr1.push(item)
-              }else if(item.area == 2){
-                arr2.push(item)
-              }else if(item.area == 3){
-                arr3.push(item)
-              }
-            })
-            that.warnMap = {
-              '1':arr1,
-              '2':arr2,
-              '3':arr3
-            }
-            //that.loadWarnMarker(that.warnMap[that.searchForm.area])
-          } else {
-            that.$message.warning(res.data.message);
-          }
-        }
-      })*/
-    },
-    handleCheckChange(data, checked, indeterminate) {
-        console.log(data, checked, indeterminate);
-        // this.addComment(data,data.programId)
-       
-      },
-     handleCheck(checkedNodes) {
-         console.log(checkedNodes, "cscscscs");
-      // 这里可以处理选中项的逻辑，比如更新checkedKeys等。
-    //   this.textInfoList = checkedNodes.push() // 根据需要更新checkedKeys数组，例如只保留id等。
-     this.textInfoList.push(checkedNodes.programId)
-         console.log(this.textInfoList, "cscscscs");
-    },
-    loadWarnMarker(data) {
-      var that = this
-      that.componentsWarnList = []
-      that.componentsOldWarnList = []
-      that.warnIdOptions = []
-      if (!data) {
-        return
-      }
-      data.forEach((item, index) => {
-        if (item.pileNum) {
-          that.warnIdOptions.push(item.id)
-          let imgForm = window.config.drapWarnElMap[item.type]
-          var json = item
-          json.imgUrl = imgForm.url
-          var x = 0,
-            y = 0
-
-          json.position = {
-            x: 0,
-            y: 0,
-            w: imgForm.w,
-            h: imgForm.h,
-            bg: '#fff',
-          }
-          let km = item.pileNum.replace('K', '').replace('+', '.')
-          let km1 = that.pileNumMap[that.searchForm.area].left
-            .replace('K', '')
-            .replace('+', '.')
-          let subtract = Number(km) - Number(km1)
-          json.position.x = subtract * 1000 * that.scale - imgForm.w / 2
-          x = subtract * 1000 * that.scale - imgForm.w / 2
-          if (item.lane == 0) {
-            json.position.y = 265 - imgForm.h / 2
-            y = 265 - imgForm.h / 2
-          } else {
-            if (item.direction == '2') {
-              let newLane = that.distanceFromNine(Number(item.lane))
-              json.position.y = newLane * 24 + 13 - imgForm.h / 2
-              y = newLane * 24 + 13 - imgForm.h / 2
-            } else {
-              json.position.y = item.lane * 24 + 271 - imgForm.h / 2
-              y = item.lane * 24 + 271 - imgForm.h / 2
-            }
-          }
-          json.temp = {
-            position: {
-              x: x,
-              y: y,
-            },
-          }
-
-          that.componentsOldWarnList.push(json)
-        }
-      })
-      setTimeout(() => {
-        that.componentsWarnList = JSON.parse(
-          JSON.stringify(that.componentsOldWarnList)
-        )
-      }, 1000)
-    },
-    warnClose() {
-      this.warnShow = false
-      this.warnForm = {}
-      this.warnControl = null
-      this.warnDetailClose()
-    },
-    warnDetailClose() {
-      this.warnDetailShow = false
-      if (this.statusTimer) {
-        clearTimeout(this.statusTimer)
-        this.statusTimer = null
-      }
-      this.dataForm.deviceId = this.deviceDataId.toString()
-      this.deviceStatusBatch()
-    },
-    planDetailClose() {
-      this.planDetailShow = false
-      if (this.statusTimer) {
-        clearTimeout(this.statusTimer)
-        this.statusTimer = null
-      }
-      this.dataForm.deviceId = this.deviceDataId.toString()
-      this.deviceStatusBatch()
-    },
-    planClose() {
-      this.planShow = false
-      this.planDetailClose()
-    },
-    warnClick(row) {
-      var that = this
-      that.warnForm = JSON.parse(JSON.stringify(row))
-      if (that.warnForm.area != that.searchForm.area) {
-        that.tunnelClick(that.warnForm.area)
-      }
-      that.warnControl = that.warnForm
-    },
-    planDisposalClick(item) {
-      var that = this
-      that.warnDetailClose()
-      that.planShow = true
-      planList({ status: '1', area: item.area, planType: item.type }).then(
-        (res) => {
-          if (res.status == 200) {
-            if (res.data.retCode == 0) {
-              that.planList = res.data.result
-            } else {
-              that.$message.warning(res.data.message)
-            }
-          }
-        }
-      )
-    },
-    warnPlanClick(row) {
-      var that = this
-      if (that.statusTimer) {
-        clearTimeout(that.statusTimer)
-        that.statusTimer = null
-      }
-
-      that.dataForm = {}
-      that.planLoading = false
-      that.planSuccess = false
-      that.warnDetailShow = true
-      that.planDetailMap = {
-        11: [],
-        13: [],
-        14: [],
-        15: [],
-        19: [],
-      }
-      that.planForm = JSON.parse(JSON.stringify(row))
-      that.deviceIds = []
-      that.deviceIds15 = []
-      that.templateObj = ''
-      that.mediaObj = null
-      that.listMedia = []
-
-      deviceList({
-        area: that.planForm.area,
-        editable: '2',
-        deviceType: that.planDeviceType.toString(),
-        direction: that.planForm.direction,
-      }).then((res) => {
-        that.loading = false
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.planDetailMap = {
-              11: [],
-              13: [],
-              14: [],
-              15: [],
-              19: [],
-            }
-            var km1 = that.planForm.pileNum.replace('K', '').replace('+', '.')
-            res.data.result.forEach((item) => {
-              var km2 = item.pileNum.replace('K', '').replace('+', '.')
-              var obj = {
-                id: item.deviceId,
-                pileNum: item.pileNum,
-                stream: '0',
-              }
-
-              if (item.deviceType == '11') {
-                if (Math.abs(km1 - km2) < 0.05) {
-                  //小于50米
-                  obj.cmd = '0'
-                } else {
-                  obj.cmd = '1'
-                }
-              } else if (item.deviceType == '14') {
-                obj.cmd = '1'
-              } else if (item.deviceType == '13') {
-                if (item.direction == 1) {
-                  if (km1 < km2) {
-                    obj.stream = '2'
-                  } else {
-                    obj.stream = '1'
-                  }
-                } else {
-                  if (km1 < km2) {
-                    obj.stream = '1'
-                  } else {
-                    obj.stream = '2'
-                  }
-                }
-                if (obj.stream == '1') {
-                  obj.cmd = '2'
-                } else {
-                  obj.cmd = '0'
-                }
-              } else if (item.deviceType == '15') {
-                that.deviceIds15.push(item.deviceId)
-              } else if (item.deviceType == '19') {
-                obj.cmd = '1'
-              }
-              that.planDetailMap[item.deviceType].push(obj)
-              that.deviceIds.push(item.deviceId)
-              /*that.planDetailData.push({
-                type:item.deviceType,
-                data:p[key]
-              })*/
-            })
-            that.loadinfoBoardTemplate(2)
-            console.log(that.planDetailMap)
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-      // 预案处置中广播的下拉列表暂时屏蔽
-      // getMediaList().then((res) => {
-      //   if (res.status == 200) {
-      //     if (res.data.code == 200) {
-      //       that.listMedia = res.data.data.listMedia
-      //       that.mediaObj = that.listMedia[0]
-      //     } else {
-      //       that.$message.warning(res.data.message)
-      //     }
-      //   }
-      // })
-    },
-    handleCommitPlanClick(index) {
-      var that = this
-      console.log(index, that.planForm, ' ///////////////////')
-      var json = {}
-      if (that.deviceIds15.length > 0) {
-        var obj = {
-          deviceType: '15',
-          command: '15_01',
-          deviceId: that.deviceIds15.toString(),
-          body: JSON.stringify({
-            textInfoList: [{ id: that.templateObj, fillInfo: '' }],
-          }),
-        }
-        var url = '/json/iot/iotControlBatch'
-        iotControl(obj, url).then((res) => {})
-      }
-      if (index == 2) {
-        // json = {
-        //   planType: '2',
-        //   warnType: that.planForm.type,
-        //   area: that.planForm.area,
-        //   direction: that.planForm.direction,
-        //   plan: JSON.stringify(that.planDetailMap),
-        // }
-        json = {
-          plc: [],
-        }
-        console.log(that.planDeviceType, that.planDetailMap[13],'13车道指示灯', that.planDetailMap[14],'14', 'planDeviceTypeplanDeviceType')
-        that.planDetailMap[13].forEach((item)=>{ // 车道指示灯
-          let operationInstructions = filedFomatter(item.cmd, that.taskEnum[13].taskList)
-          json.plc.push({
-            deviceId: item.id,
-            operationInstructions: operationInstructions,
-            writeOrRead: 'W'
-          })
-        })
-        that.planDetailMap[14].forEach((item)=>{ //交通信号控制灯
-          let operationInstructions = filedFomatter(item.cmd, that.taskEnum[14].taskList)
-          console.log(operationInstructions, '141414')
-          json.plc.push({
-            deviceId: item.id,
-            operationInstructions: operationInstructions,
-            writeOrRead: 'W'
-          })
-        })
-        
-        that.planSuccess = false
-        that.planLoading = true
-        batchControl(json).then((res)=>{
-          that.planLoading = false
-          that.planSuccess = true
-          console.log(res)
-          if(res.data.code==200){
-            that.$message.success('操作成功')
-            that.warnDetailShow = false
-            verify({ id: that.planForm.id, status: '8' }).then((res) => {
-              if (res.status == 200) {
-                if (res.data.retCode == 0) {
-                  that.loadWarnList()
-                  that.statsticWhole()
-                }
-              }
-            })
-          } else {
-            that.$message.success(res.data.msg)
-          }
-        })
-      } else if (index == 1) {
-        json = {
-          planType: '1',
-          warnType: that.planForm.warnType,
-          planId: that.planForm.planId,
-          area: that.planForm.area,
-        }
-        that.planSuccess = false
-        that.planLoading = true
-          planExecute(json).then((res) => {
-          that.planLoading = false
-          if (res.status == 200) {
-            if (res.data.retCode == 0) {
-              that.$message.success('成功')
-              that.planSuccess = true
-              setTimeout(() => {
-                that.dataForm.deviceId = that.deviceIds.toString()
-                that.deviceStatusBatch(index)
-              }, 2000)
-            } else {
-              that.$message.warning(res.data.message)
-            }
-          }
-        })
-      }
-      if (that.mediaObj.id) {
-        var extens = []
-        getEmployeeList().then((res) => {
-          if (res.status == 200) {
-            if (res.data.code == 200) {
-              res.data.data.employeeList.forEach((item) => {
-                extens.push(item.exten)
-              })
-              var obj = {
-                name: that.mediaObj.name,
-                extenNums: extens.toString(),
-                AudioSourceType: that.mediaObj.type,
-              }
-              if (that.mediaObj.type == '1') {
-                obj.audioStr = that.mediaObj.id
-              } else {
-                obj.textContent = ''
-              }
-
-              addBroadcast(obj).then((res) => {
-                if (res.status == 200) {
-                  if (res.data.code == 200) {
-                  } else {
-                    that.$message.warning(res.data.message)
-                  }
-                }
-              })
-            } else {
-              that.$message.warning(res.data.message)
-            }
-          }
-        })
-      }
-    },
-    planClick(row) {
-      var that = this
-      that.dataForm = {}
-      that.planLoading = false
-      that.planSuccess = false
-      that.planDetailShow = true
-      that.planDetailData = []
-      that.planForm = JSON.parse(JSON.stringify(row))
-      that.deviceIds = []
-      if (that.statusTimer) {
-        clearTimeout(that.statusTimer)
-        that.statusTimer = null
-      }
-      planDetail({ planId: row.planId }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            var p = JSON.parse(res.data.result.plan)
-            for (let key in p) {
-              that.planDetailData.push({
-                type: key,
-                data: p[key],
-              })
-              p[key].forEach((item) => {
-                that.deviceIds.push(item.id)
-              })
-            }
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    verifyClick(row) {
-      var that = this
-      that
-        .$confirm('已确认?', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning',
-        })
-        .then(() => {
-          verify({ id: row.id, status: '3' }).then((res) => {
-            if (res.status == 200) {
-              if (res.data.retCode == 0) {
-                that.$message.success('成功')
-                that.loadWarnList()
-                that.statsticWhole()
-              } else {
-                that.$message.warning(res.data.message)
-              }
-            }
-          })
-        })
-        .catch(() => {
-          that.$message.info('已取消删除')
-        })
-    },
-    handleDeviceRunClick() {
-      var that = this
-      that.loadDevice()
-      that.deviceRunShow = true
-    },
-    loadDevice() {
-      var that = this
-      deviceList({
-        deviceType: that.deviceType,
-        area: that.searchForm.area,
-        editable: '2',
-      }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.deviceData = res.data.result
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    deviceRunClick(row) {
-      var that = this
-
-      that.curControl = row
-    },
-    handleClick(row, i) {
-      var that = this
-      if (row.deviceType == '55' || row.deviceType == '56') {
-        return ''
-      }
-      that.dataForm = {}
-      that.textInfoList = []
-      that.dataFormBody = {}
-      that.dataForm = JSON.parse(JSON.stringify(row))
-      that.addOrUpdateTitle =
-        that.filedFomatter(that.dataForm.area, that.areaList) +
-        ' / ' +
-        that.filedFomatter(that.dataForm.deviceType, that.deviceTypeList) +
-        ' / ' +
-        that.dataForm.deviceId
-      that.tempMap = {}
-      that.templateInfoHtml = ''
-      that.iotKeyList = []
-      that.taskList = that.taskEnum[that.dataForm.deviceType].taskList
-      if (that.dataForm.refresh == '1') {
-        that.deviceStatus()
-      }
-      // 13 车道指示灯 
-      console.log('1111111111111111111111111', that.dataForm.deviceType)
-      if (that.dataForm.deviceType == '15') {
-        console.log("that.dataFormBody",that.dataFormBody)
-        if (that.dataForm.task) {
-          var j = JSON.parse(that.dataForm.task)
-          console.log("j.dataFormBody",j.dataFormBody)
-          that.$set(that.dataForm, 'taskName', j.command)
-          if (j.body) {
-            j.dataFormBody = JSON.parse(j.body)
-            that.loadinfoBoardTemplate(1, j.dataFormBody.textInfoList)
-          }
-        }
-        that.loadinfoBoardTemplate(0)
-      } else if (that.dataForm.deviceType == '22') {
-        if (that.dataForm.iotKey) {
-          that.videoForm.pid = that.dataForm.iotKey
-          that.videoUrl = ''
-          getPlayAddressByPid(that.videoForm).then((res) => {
-            if (res.status == 200) {
-              if (res.data.ret == 0) {
-                that.videoUrl = res.data.data.flv
-              } else {
-                that.$message.warning(res.data.message)
-              }
-            }
-          })
-        }
-      } else if (
-        that.dataForm.deviceType == '40' ||
-        that.dataForm.deviceType == '41' ||
-        that.dataForm.deviceType == '42'
-      ) {
-        that.$set(that.dataForm, 'iotKeys', [])
-        var arr = that.dataForm.iotKey.split('|')
-        arr.forEach((item) => {
-          var arr1 = item.split(':')
-          var name = window.config.pumpMap[arr1[0]]
-          var arr2 = arr1[1].split(',')
-          arr2.forEach((item2, i) => {
-            var json = {}
-            if (arr1[0] == 'ps' || arr1[0] == 'hs') {
-              json.show = false
-            } else {
-              json.show = true
-            }
-            json.name = name + (i + 1)
-            json.id = arr1[0] + ':' + item2
-            that.iotKeyList.push(json)
-          })
-        })
-      }
-      if(that.dataForm.deviceType == '13'){
-        // 获取 lane 对应的显示文本
-        const laneText = filedFomatter(that.dataForm.lane, that.laneList)
-        const directionText = filedFomatter(that.dataForm.direction, that.directionList)
-        const deviceTypeText = filedFomatter(that.dataForm.deviceType, that.deviceTypeList)
-        const areaText = filedFomatter(that.dataForm.area, that.areaList)
-        console.log(laneText,directionText, deviceTypeText,that.textInfoList, 'sssssssssssssssssssssssss')
-        // 如果 laneText 是 "车道一" 并且 directionText 是 "上行"，则在 taskList 尾部添加一个选项
-        if(areaText === '五一隧道'){
-          if (laneText === "车道一" && deviceTypeText === "车道指示灯" && that.dataForm.deviceName!='YLS1' && (directionText === "上行" || directionText === "下行")) {
-            that.taskList = [
-            { id: '0', name: '正向通行' },
-            { id: '1', name: '反向通行' },
-            {
-              id: '2',
-              name: '封道',
-            }, {id: '3', name: '正向左转'}
-            // ,{id: '4', name: '反向左转'},
-            // { id: '3', name: '左转' },
-          ]
-          } else {
-            that.taskList = [
-            { id: '0', name: '正向通行' },
-            { id: '1', name: '反向通行' },
-            {
-              id: '2',
-              name: '封道',
-            } /*{id: '3', name: '正向转向'},{id: '4', name: '反向转向'}*/,
-          ]
-          }
-        } else if(areaText === '西山隧道') {
-          if (laneText === "车道一" && deviceTypeText === "车道指示灯" && (directionText === "上行" || directionText === "下行")) {
-            that.taskList = [
-            { id: '0', name: '正向通行' },
-            { id: '1', name: '反向通行' },
-            {
-              id: '2',
-              name: '封道',
-            },
-            //  {id: '3', name: '正向左转'},{id: '4', name: '反向左转'},
-            { id: '3', name: '左转' },
-          ]
-          } else {
-            that.taskList = [
-            { id: '0', name: '正向通行' },
-            { id: '1', name: '反向通行' },
-            {
-              id: '2',
-              name: '封道',
-            } /*{id: '3', name: '正向转向'},{id: '4', name: '反向转向'}*/,
-          ]
-          }
-        }
-        console.log('//////////////')
-        // 获取设备状态
-        getIotDeviceStatus({
-          deviceId: that.dataForm.deviceId,
-          deviceType: that.dataForm.deviceType
-        })
-          .then(res => {
-            const { code, data } = res?.data || {};
-            if (code === 200) {
-              // that.dataForm.command = data?.status || '';
-              let command = data?.status || '';
-              that.$set(that.dataForm, 'command', command)
-            }
-            // this.$forceUpdate();
-            console.log(that.dataForm.command)
-          })
-          .catch(error => {
-            console.error('Error fetching device status:', error);
-          });
-      } else if (that.dataForm.deviceType == '26' || that.dataForm.deviceType == '27'|| that.dataForm.deviceType == '28'){
-        //风速风向和covi展示的
-        getIotDeviceStatus({
-          deviceId: that.dataForm.deviceId,
-          deviceType: that.dataForm.deviceType
-        })
-          .then(res => {
-            const { code, data } = res?.data || {};
-            if (code === 200) {
-              console.log(data, that.dataForm,  'ddddddddddddd')
-              if(data.statusJson){
-                const json = JSON.parse(data.statusJson);
-                if(json.covi && that.dataForm.deviceType == '27'){ // covi
-                  that.$set(that.dataForm, 'vi27', json.covi.vi)
-                  that.$set(that.dataForm, 'co27', json.covi.co)
-                }else if(json.covi && that.dataForm.deviceType == '26'){ // 风速风向
-                  that.$set(that.dataForm, 'speed26', json.covi.fs)
-                  that.$set(that.dataForm, 'direction26', json.covi.fx)
-                }else if(json.covi && that.dataForm.deviceType == '28'){ // 光强
-                  that.$set(that.dataForm, 'light28', json.covi.BD)
-                //   that.$set(that.dataForm, 'direction26', json.covi.BD)
-                }
-              }
-            }
-          })
-          .catch(error => {
-            console.error('Error fetching device status:', error);
-          });
-      } else if(that.dataForm.deviceType == '14' || that.dataForm.deviceType == '19'){ // 获取回显状态
-        // 获取设备状态
-        getIotDeviceStatus({
-          deviceId: that.dataForm.deviceId,
-          deviceType: that.dataForm.deviceType
-        })
-          .then(res => {
-            const { code, data } = res?.data || {};
-            if (code === 200) {
-              let command = data?.status || '';
-              that.$set(that.dataForm, 'command', command)
-            }
-            // this.$forceUpdate();
-            console.log(that.dataForm.command)
-          })
-          .catch(error => {
-            console.error('Error fetching device status:', error);
-          });
-      } else if (that.dataForm.deviceType == '11'){  //风机
-          // 获取设备状态
-          getIotDeviceStatus({
-            deviceId: that.dataForm.deviceId,
-            deviceType: that.dataForm.deviceType
-          })
-            .then(res => {
-              const { code, data } = res?.data || {};
-              if (code === 200) {
-                let command = data?.status || '';
-                that.$set(that.dataForm, 'command', command)
-              }
-              // this.$forceUpdate();
-              console.log(that.dataForm.command)
-            })
-            .catch(error => {
-              console.error('Error fetching device status:', error);
-            });
-      }
-        if (i) {
-            that.deviceDialogVisible = true
-          } else {
-            that.deviceControlShow = true
-          }
-    },
-    /*initTimer(){
-      var that = this
-      that.statusTimer = setInterval(_ => {
-        that.deviceStatus()
-      }, 2000)
-    },*/
-    deviceClose() {
-      var that = this
-      console.log('clear')
-      if (that.statusTimer) {
-        clearTimeout(that.statusTimer)
-        that.statusTimer = null
-      }
-      that.deviceControlShow = false
-      that.deviceDialogVisible = false
-      that.deviceDialogVisible2 = false
-
-      that.dataForm.deviceId = that.deviceDataId.toString()
-      that.deviceStatusBatch()
-    },
-    deviceStatus() {
-      var that = this
-      deviceStatus({
-        deviceId: that.dataForm.deviceId,
-        deviceType: that.dataForm.deviceType,
-      }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.$set(that.dataForm, 'status', res.data.result.status)
-
-            if (res.data.result.task) {
-              that.$set(that.dataForm, 'task', res.data.result.task)
-              var j = JSON.parse(that.dataForm.task)
-
-              that.$set(that.dataForm, 'taskName', j.command)
-
-              if (j.command != -1) {
-                let imgForm =
-                  window.config.drapLeftElMap[that.dataForm.deviceType]
-                if (that.dataForm.deviceType == '11') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl = imgForm['url' + j.command]
-                    }
-                  })
-                } else if (that.dataForm.deviceType == '13') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl =
-                        imgForm['url' + item.direction + '' + item.direction][
-                          j.command
-                        ]
-                    }
-                  })
-                } else if (that.dataForm.deviceType == '14') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl = imgForm['urls'][j.command]
-                    }
-                  })
-                } else if (
-                  that.dataForm.deviceType == '40' ||
-                  that.dataForm.deviceType == '41' ||
-                  that.dataForm.deviceType == '42'
-                ) {
-                  that.iotKeyData = []
-                  const str1 = that.dataForm.iotKey.split('|')
-                  const str2 = that.dataForm.taskName.split('|')
-                  str1.forEach((item, i) => {
-                    const [name, values] = item.split(':')
-                    const name1 = window.config.pumpMap[name]
-                    const [name2, values2] = str2[i].split(':')
-                    var arr = values.split(',')
-                    var arr2 = values2.split(',')
-
-                    var arr3 = []
-
-                    arr.forEach((item2, i2) => {
-                      if (name == 'ps' || name == 'hs') {
-                        arr3.push({
-                          id: `${name}:${item2}`,
-                          name: i2 + 1 + '#：' + arr2[i2],
-                        })
-                      } else {
-                        arr3.push({
-                          id: `${name}:${item2}`,
-                          name:
-                            i2 +
-                            1 +
-                            '#：' +
-                            that.filedFomatter(arr2[i2], that.taskList),
-                        })
-                      }
-                    })
-                    that.iotKeyData.push({
-                      name: name1,
-                      data: arr3,
-                    })
-                  })
-                }
-              }
-
-              //that.$set(that.dataForm,'command',j.command)
-              if (j.body) {
-                j.dataFormBody = JSON.parse(j.body)
-              }
-
-              if (that.dataForm.deviceType == '15') {
-                // that.loadinfoBoardTemplate(1,j.dataFormBody.textInfoList);
-              } else if (that.dataForm.deviceType == '26') {
-                that.dataForm.speed26 = j.speed
-                that.dataForm.direction26 = j.direction == '0' ? '正向' : '反向'
-              } else if (that.dataForm.deviceType == '27') {
-                that.dataForm.co27 = j.co
-                that.dataForm.vi27 = j.vi
-              } else if (that.dataForm.deviceType == '28') {
-                that.dataForm.light28 = j.light
-              } else if (that.dataForm.deviceType == '43') {
-                that.dataForm.height43 = j.height
-              }
-            }
-            if (that.statusTimer) {
-              clearTimeout(that.statusTimer)
-              that.statusTimer = null
-            }
-            if (that.deviceDialogVisible || that.deviceControlShow) {
-              console.log('deviceStatus2')
-              that.statusTimer = setTimeout(() => {
-                that.deviceStatus()
-              }, 2000)
-            }
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    deviceStatusBatch(index) {
-      var that = this
-      deviceStatusBatch({
-        deviceId: that.dataForm.deviceId,
-        deviceType: that.dataForm.deviceType,
-      }).then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            res.data.result.forEach((item) => {
-              that.deviceData2.forEach((item1) => {
-                if (item.deviceId == item1.deviceId) {
-                  item1.task = item.task
-                }
-              })
-
-              if (item.task) {
-                that.$set(that.dataForm, 'task', item.task)
-                var j = JSON.parse(item.task)
-
-                if (index == 2) {
-                  that.planDeviceType.forEach((p1) => {
-                    that.planDetailMap[p1].forEach((p2) => {
-                      if (p2.id == item.deviceId) {
-                        p2.ret = j.command
-                      }
-                    })
-                  })
-                  that.planDetailMap = JSON.parse(
-                    JSON.stringify(that.planDetailMap)
-                  )
-                } else if (index == 1) {
-                  that.planDetailData.forEach((p1) => {
-                    if (p1.type == item.deviceType) {
-                      p1.data.forEach((p2) => {
-                        if (p2.id == item.deviceId) {
-                          p2.ret = j.command
-                        }
-                      })
-                    }
-                  })
-                  that.planDetailData = JSON.parse(
-                    JSON.stringify(that.planDetailData)
-                  )
-                }
-                //that.$set(that.dataForm,'taskName',j.command)
-
-                if (j.command != -1) {
-                  let imgForm = window.config.drapLeftElMap[item.deviceType]
-                  if (item.deviceType == '11') {
-                    that.componentsList.forEach((item2) => {
-                      if (item2.deviceId == item.deviceId) {
-                        item2.imgUrl = imgForm['url' + j.command]
-                      }
-                    })
-                  } else if (item.deviceType == '13') {
-                    that.componentsList.forEach((item2) => {
-                      if (item2.deviceId == item.deviceId) {
-                        item2.imgUrl =
-                          imgForm[
-                            'url' + item2.direction + '' + item2.direction
-                          ][j.command]
-                      }
-                    })
-                  } else if (item.deviceType == '14') {
-                    that.componentsList.forEach((item2) => {
-                      if (item2.deviceId == item.deviceId) {
-                        item2.imgUrl = imgForm['urls'][j.command]
-                      }
-                    })
-                  }
-                }
-
-                //that.$set(that.dataForm,'command',j.command)
-                if (j.body) {
-                  j.dataFormBody = JSON.parse(j.body)
-                }
-              }
-            })
-
-            if (that.statusTimer) {
-              clearTimeout(that.statusTimer)
-              that.statusTimer = null
-            }
-            if (
-              that.deviceDialogVisible2 ||
-              that.planDetailShow ||
-              that.warnDetailShow
-            ) {
-              console.log('deviceStatusBatch2')
-              that.statusTimer = setTimeout(() => {
-                that.deviceStatusBatch(index)
-              }, 2000)
-            } else {
-              console.log('deviceStatusBatch15')
-              that.statusTimer = setTimeout(() => {
-                that.deviceStatusBatch()
-              }, 15000)
-            }
-          } else {
-            //that.$message.warning(res.data.message);
-          }
-        }
-      })
-    },
-    loadinfoBoardTemplate(index, list, modelId) {
-        console.log("index",index)
-      var that = this
-         getProgramTree({ name: this.filterText }).then((res) => {
-              console.log("this.treeData",res.data.data)
-              console.log("res.code",res.data.code)
-        if (res.data.code == 200) {
-             console.log("this.treeData",res.data.data)
-          res.data.data.forEach((item) => {
-            // this.count += item.children.length;
-            if (item.children) {
-              item.children.forEach((child) => {
-                if (child.dynamicValueNum > 0) {
-                  console.log("大于0");
-                  for (let i = 0; i < child.dynamicValueNum; i++) {
-                    child["contentValue" + (i + 1)] =
-                      child.dynamicValueList.length > 0
-                        ? child.dynamicValueList[i]
-                        : "";
-                  }
-                }
-              });
-            }
-          });
-    
-        //   this.treeData = res.data;
-         this.treeData = res.data.data;
-        //   this.infoBoardTemplateList = res.data.data
-         console.log("this.treeData",this.treeData)
-             this.infoBoardTemplateList = []
-               const newArray = res.data.data.flatMap(item => item.children);
-                console.log("newArray",newArray)
-                this.infoBoardTemplateList = newArray
-            //  res.data.data.forEach((item, i) => {
-            //  
-            //     var form = {
-            //       ...item,
-            //       templateHtml: that.domRender(item.textInfo),
-            //     }
-            //     that.infoBoardTemplateList.push(form)
-            //   })
-             
-        }
-      });
-      infoBoardTemplateList().then((res) => {
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            if (index == 1) {
-              that.templateHtmlList = []
-              console.log("res.data.result111111111111",res.data.result)
-              res.data.result.forEach((item, i) => {
-                list.forEach((item1) => {
-                  if (item.id == item1.id) {
-                    var str = that.domRender(
-                      item.textInfo,
-                      item1.fillInfo,
-                      item.id,
-                      1
-                    )
-                    var html = ''
-                    var backColor = ''
-                    var fontColor = ''
-                    var fontFormat = ''
-                    var fontFormatUpDown = ''
-                    let fontSize = item.fontSize.split('*')[0]
-                    switch (item.backColor) {
-                      case '红色':
-                        backColor = 'red'
-                        break
-                      case '黄色':
-                        backColor = 'yellow'
-                        break
-                      case '绿色':
-                        backColor = 'green'
-                        break
-                      case '黑色':
-                        backColor = 'black'
-                        break
-                    }
-                    switch (item.fontColor) {
-                      case '红色':
-                        fontColor = 'red'
-                        break
-                      case '黄色':
-                        fontColor = 'yellow'
-                        break
-                      case '绿色':
-                        fontColor = 'green'
-                        break
-                      case '黑色':
-                        fontColor = 'black'
-                        break
-                    }
-                    switch (item.fontFormat) {
-                      case '居中':
-                        fontFormat = 'center'
-                        break
-                      case '居左':
-                        fontFormat = 'left'
-                        break
-                      case '居右':
-                        fontFormat = 'right'
-                        break
-                    }
-                    switch (item.fontFormatUpDown) {
-                      case '居中':
-                        fontFormatUpDown = 'center'
-                        break
-                      case '居左':
-                        fontFormatUpDown = 'left'
-                        break
-                      case '居右':
-                        fontFormatUpDown = 'right'
-                        break
-                    }
-                    html += `<div style="background-color: ${backColor};color: ${fontColor};width: ${
-                      item.cmsWidth
-                    }px;height: ${
-                      item.cmsHeight
-                    }px;display: flex;justify-content: ${fontFormat};align-items: ${fontFormatUpDown};font-size: ${Number(
-                      fontSize
-                    )}px;font-family: ${item.fontName}">${str}</div>`
-                    that.templateHtmlList.push({
-                      html: html,
-                      intervaly: item.intervaly,
-                    })
-                  }
-                })
-              })
-              if (that.templateHtmlList.length > 0) {
-                if (that.tempTimer) {
-                  clearTimeout(that.tempTimer)
-                  that.tempTimer = null
-                }
-                that.templateDisplay(0) // 递归调用显示函数
-              }
-            } else if (index == 2) {
-            //   that.infoBoardTemplateList = res.data.result
-            } else if (index == 3) {
-              that.templateHtmlList = []
-              res.data.result.forEach((item, i) => {
-                list.forEach((item1) => {
-                  if (item.id == item1.id) {
-                    var str = that.domRender(
-                      item.textInfo,
-                      item1.fillInfo,
-                      item.id,
-                      1
-                    )
-                    var fontColor = ''
-                    let fontSize = Number(item.fontSize.split('*')[0])
-                    switch (item.fontColor) {
-                      case '红色':
-                        fontColor = 'ff0000'
-                        break
-                      case '黄色':
-                        fontColor = 'ffff00'
-                        break
-                      case '绿色':
-                        fontColor = '008000'
-                        break
-                      case '黑色':
-                        fontColor = '000000'
-                        break
-                    }
-
-                    that.templateHtmlList.push({
-                      VMSId: [modelId],
-                      infoType: 'text',
-                      imageUrl: '',
-                      text: str,
-                      textColor: fontColor,
-                      textSize: fontSize,
-                      rollingDirection: 'horizontal',
-                      rollingSpeed: 20,
-                      intervaly: item.intervaly,
-                    })
-                  }
-                })
-              })
-              if (that.templateHtmlList.length > 0) {
-                if (that.tempTimer) {
-                  clearTimeout(that.tempTimer)
-                  that.tempTimer = null
-                }
-                that.templateDisplay(0, 3) // 递归调用显示函数
-              }
-            } else {
-            //   that.infoBoardTemplateList = []
-            //   res.data.result.forEach((item, i) => {
-            //     var form = {
-            //       ...item,
-            //       templateHtml: that.domRender(item.textInfo),
-            //     }
-            //     that.infoBoardTemplateList.push(form)
-            //   })
-            }
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-    },
-    templateDisplay(index, m) {
-      var that = this
-      if (m == 3) {
-        that.updateVMSInfo(that.templateHtmlList[index])
-      } else {
-        that.templateInfoHtml = that.templateHtmlList[index].html // 显示当前索引的名称
-      }
-      let nextIndex = (index + 1) % that.templateHtmlList.length // 计算下一个索引
-      let nextTime = parseInt(that.templateHtmlList[nextIndex].intervaly) * 1000 // 下一个元素的显示时间
-      that.tempTimer = setTimeout(() => {
-        that.templateDisplay(nextIndex, m) // 递归调用显示函数
-      }, nextTime)
-    },
-      handleAddToTable(node, data) {
-      console.log("添加至表格", node, data);
-    //   let exists = this.tableData.find(
-    //     (obj) => obj.programId === node.data.programId
-    //   );
-    //   if (exists) return this.$message("该项已添加，请勿重复添加！");
-    //   this.tableData.push(data);
-    //   console.log("添加至表格", this.tableData);
-    },
-        filterNode(value, data) {
-      console.log(value, data);
-      if (!value) return true;
-      return data.name.indexOf(value) !== -1;
-    },
-    getColor(value){
-        if(value =="#7b5ba1"){
-           return '红'
-        }else if(value =="#008000"){
-           return '绿'
-        }else if(value =="#FFFF00"){
-           return '黄'
-        }
-    },
-    addComment(event, row) {
-      this.tempMap[row.id] = {
-        ...this.tempMap[row.id],
-        [event.target.attributes.idData.value]: event.target.value,
-      }
-      console.log(this.tempMap,'this.tempMap')
-    },
-    handleCommitClick(index) {
-      var that = this
-      var url = ''
-      that.deviceLoading = true
-      /*if(that.statusTimer){
-        clearTimeout(that.statusTimer)
-        that.statusTimer = null
-      }*/
-      console.log(that.dataForm.command, 'cccccccccccccc')
-      var json = {
-        //deviceId: that.dataForm.deviceId,
-        deviceType: that.dataForm.deviceType,
-        command: that.dataForm.command,
-      }
-      console.log(json,index,'wwwwww')
-      if (index) {
-        console.log('111')
-        //批量控制
-        if (that.multipleSelection.length > 0) {
-          var deviceIds = []
-          that.multipleSelection.forEach((item) => {
-            deviceIds.push(item.deviceId)
-          })
-          json.deviceId = deviceIds.toString()
-        } else {
-          that.$message.info('请选择')
-          return ''
-        }
-        //that.dataForm.deviceId = json.deviceId
-        url = '/json/iot/iotControlBatch'
-      } else {
-        console.log('222')
-        json.deviceId = that.dataForm.deviceId
-        url = '/xjIotApi/iotServiceCommon/ServiceApiCommon'
-      }
-      console.log('333', url, that.dataForm.deviceType )
-      if (that.dataForm.deviceType == '12') {
-        json.body = JSON.stringify(that.dataFormBody)
-      } else if (that.dataForm.deviceType == '15') {
-        json.command = '15_01'
-        var ids = Object.keys(this.tempMap)
-        var arr = []
-        that.textInfoList.forEach((item1) => {
-          var a = {
-            id: item1,
-            fillInfo: '',
-          }
-          ids.forEach((item) => {
-            if (item == item1) {
-              var fillInfos = Object.values(this.tempMap[item])
-              a.fillInfo = fillInfos.join(';')
-            }
-          })
-          arr.push(a)
-        })
-        json.body = JSON.stringify({ textInfoList: arr })
-      } else if (
-        that.dataForm.deviceType == '40' ||
-        that.dataForm.deviceType == '41' ||
-        that.dataForm.deviceType == '42'
-      ) {
-        const convertedArray = that.dataForm.iotKeys.reduce((acc, curr) => {
-          const [key, value] = curr.split(':')
-          const existing = acc.find((item) => item.startsWith(key))
-
-          if (existing) {
-            const index = acc.indexOf(existing)
-            acc[index] = `${existing},${value}`
-          } else {
-            acc.push(`${key}:${value}`)
-          }
-
-          return acc
-        }, [])
-        json.iotKey = convertedArray.join('|')
-      }
-      console.log(json, url, 'urlurl')
-      if (that.dataForm.deviceType == '13' || that.dataForm.deviceType == '14' || that.dataForm.deviceType == '15' || that.dataForm.deviceType == '19' || that.dataForm.deviceType == '11') {  //单独走的控制接口
-        if(index){ //批量控制
-          console.log(json, that.multipleSelection, '批量')
-          let data = []
-          if (that.multipleSelection.length > 0) {
-            that.multipleSelection.forEach((item) => {
-              let operationInstruction = ""
-              if(that.dataForm.deviceType == '13'){
-                // operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转' : json.command==4 ? '反向左转': ''
-                operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转' : ''
-              } else if(that.dataForm.deviceType == '14'){
-                operationInstruction = json.command==1 ? '变红' : json.command==2 ? '变黄' : json.command==3 ? '变绿' : ''
-              } else if (that.dataForm.deviceType == '11') {
-                operationInstruction = json.command==0 ? '停止' : json.command==1 ? '正转' : json.command==2 ? '反转' : ''
-              } else if (that.dataForm.deviceType == '19') { // 卷帘门
-                operationInstruction = json.command==0 ? '停止' : json.command==1 ? '开' : json.command==2 ? '关' : ''
-              }
-              data.push({
-                deviceId : item.deviceId,
-                writeOrRead: 'W',
-                operationInstructions:operationInstruction
-              })
-            })
-            // json.deviceId
-            console.log(deviceIds)
-          } else {
-            that.$message.info('请选择')
-            return ''
-          }
-          newIotControlS(data, '/xjIotApi/iotServiceCommon/ServiceApiCommonList').then((res)=>{
-            that.deviceLoading = false
-            if(res.data.code == 200) {
-              that.$message.success('成功')
-              that.componentsList.forEach((item) => {
-                      if (item.deviceId == that.dataForm.deviceId) {
-                        item.imgUrl =
-                          imgForm['url' + item.direction + '' + item.direction][
-                            j.command
-                          ]
-                      }
-                    })
-            }else{
-              that.$message.error(res.data.msg)
-            }
-          })
-        } else{ //单个控制
-          if(that.dataForm.deviceType == '13' || that.dataForm.deviceType == '14' || that.dataForm.deviceType == '11' || that.dataForm.deviceType == '19' ){
-            let operationInstruction =''
-            if(that.dataForm.deviceType == '13'){
-            //   operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转' :json.command==4 ? '反向左转' : ''
-              operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转'  : ''
-            } else if(that.dataForm.deviceType == '14'){
-              operationInstruction = json.command==1 ? '变红' : json.command==2 ? '变黄' : json.command==3 ? '变绿' : ''
-            } else if (that.dataForm.deviceType == '11') { // 风机
-              operationInstruction = json.command==0 ? '停止' : json.command==1 ? '正转' : json.command==2 ? '反转' : ''
-            } else if (that.dataForm.deviceType == '19') { // 卷帘门
-              operationInstruction = json.command==0 ? '停止' : json.command==1 ? '开' : json.command==2 ? '关' : ''
-            }
-            let data = {
-              deviceId : json.deviceId,
-              writeOrRead: 'W',
-              operationInstructions: operationInstruction
-            }
-            console.log('走这里了  11 风机', data)
-            newIotControl(data, '/xjIotApi/iotServiceCommon/ServiceApiCommon').then((res) => {
-              console.log(res)
-              that.deviceLoading = false
-              if(res.data.code == 200) {
-                that.$message.success('成功')
-                that.componentsList.forEach((item) => {
-                        if (item.deviceId == that.dataForm.deviceId) {
-                          item.imgUrl =
-                            imgForm['url' + item.direction + '' + item.direction][
-                              j.command
-                            ]
-                        }
-                      })
-              }else{
-                that.$message.error(res.data.msg)
-              }
-            })
-          } else if(that.dataForm.deviceType == '15'){
-            console.log(that.textInfoList, that.infoBoardTemplateList, that.dataForm, that.dataForm.extraJson, 'xxxxxxxxxxxxxxxxxxxxxx')
-            let checkArr = [] //选中的情报板
-            if(that.textInfoList.length > 0){
-              that.textInfoList.forEach((item1) => {
-                 that.infoBoardTemplateList.forEach((item) => {
-                if(item1==item.programId){
-                    checkArr.push(item)
-                }
-              }) 
-              })
-            }
-            console.log(checkArr,  '555555555555')
-            // let arr = [
-            //     { id: 1, textInfo: '隧道火灾，禁止驶入' },
-            //     { id: 2, textInfo: '隧道限速{}Km/h' },
-            //     { id: 3, textInfo: '隧道火灾，禁止驶入2' },
-            //     { id: 4, textInfo: '隧道火灾，禁止驶入3' },
-            //     { id: 5, textInfo: '隧道限速{}Km/h,最高速{}Km/h,最低速{}Km/h' },
-            // ];
-            let temp = this.tempMap
-
-            // 遍历 checkArr 数组
-            checkArr.forEach(item => {
-                let text = item.content;
-
-                // 如果 temp 中存在该 id 的数据
-                if (temp[item.programId]) {
-                    let replacements = temp[item.programId];
-                    let matchCount = 0;
-
-                    // 替换每个 {} 占位符
-                    text = text.replace(/{}/g, () => {
-                        // 获取当前替换的值（按照顺序）
-                        let replacementKey = `temp${matchCount}`;
-                        matchCount++;
-
-                        // 如果该替换值存在，进行替换
-                        if (replacements[replacementKey]) {
-                            return replacements[replacementKey];
-                        }
-
-                        return '{}'; // 如果没有找到对应的值，保持原样
-                    });
-                }
-
-                // 更新 checkArr 中的 textInfo
-                item.content = text;
-            });
-            
-            let company = ''
-            if(that.dataForm.extraJson){
-              let extr = JSON.parse(that.dataForm.extraJson);
-              company = extr.belongs_company
-            }
-            let data = {
-              iotDeviceList:[
-                {deviceId: json.deviceId, manufacturer: company}
-              ],
-              playProgramlist:[]
-            }
-            if(checkArr){
-              checkArr.forEach((val)=>{
-                let Size = (val.cmsWidth == 384 && val.cmsHeight == 288) ? '1' : (val.cmsWidth == 128 && val.cmsHeight == 80) ? '2' : (val.cmsWidth == 576 && val.cmsHeight == 48) ? '3' : (val.cmsWidth == 624 && val.cmsHeight == 48) ? '4' : (val.cmsWidth == 128 && val.cmsHeight == 64) ? '5' : ''
-                data.playProgramlist.push(
-                  {
-                    programId: val.programId,
-                    name: val.name,
-                    programType: val.programType,
-                    type: val.type,
-                    displaySize: val.displaySize,
-                    displayMode: val.displayMode,
-                    displaySpeed: val.displaySpeed,
-                    fontFamily: val.fontFamily,
-                    // fontSize: this.convertFontSize(val.fontSize),
-                    // fontColor: this.getHexColor(val.fontColor),
-                       fontSize: val.fontSize,
-                    fontColor: val.fontColor,
-                    alignment: val.alignment,
-                    content: val.content
-                  }
-                )
-                console.log("data.playProgramlist",data.playProgramlist)
-              })
-            }
-            playManuallyTriggered(data, '/xjIotApi/iotServiceCommon/playManuallyTriggered').then((res)=>{
-              console.log(res, 'rrrr')
-              that.deviceLoading = false
-            })
-          }
-        }
-        // that.deviceLoading = false
-      }
-      else{
-        iotControl(json, url).then((res) => {
-        that.deviceLoading = false
-        if (res.status == 200) {
-          if (res.data.retCode == 0) {
-            that.$message.success('成功')
-            if (!res.data.result) {
-              return
-            }
-            that.dataForm.status = res.data.result.status
-            that.dataForm.task = res.data.result.task
-            if (that.dataForm.task) {
-              var j = JSON.parse(that.dataForm.task)
-              that.$set(that.dataForm, 'taskName', j.command)
-              //that.$set(that.dataForm,'command',j.command)
-
-              if (j.command != -1) {
-                let imgForm =
-                  window.config.drapLeftElMap[that.dataForm.deviceType]
-                if (that.dataForm.deviceType == '11') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl = imgForm['url' + j.command]
-                    }
-                  })
-                } else if (that.dataForm.deviceType == '13') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl =
-                        imgForm['url' + item.direction + '' + item.direction][
-                          j.command
-                        ]
-                    }
-                  })
-                } else if (that.dataForm.deviceType == '14') {
-                  that.componentsList.forEach((item) => {
-                    if (item.deviceId == that.dataForm.deviceId) {
-                      item.imgUrl = imgForm['urls'][j.command]
-                    }
-                  })
-                } else if (
-                  that.dataForm.deviceType == '40' ||
-                  that.dataForm.deviceType == '41' ||
-                  that.dataForm.deviceType == '42'
-                ) {
-                  that.iotKeyData = []
-                  const str1 = that.dataForm.iotKey.split('|')
-                  const str2 = that.dataForm.taskName.split('|')
-                  str1.forEach((item, i) => {
-                    const [name, values] = item.split(':')
-                    const name1 = window.config.pumpMap[name]
-                    const [name2, values2] = str2[i].split(':')
-                    var arr = values.split(',')
-                    var arr2 = values2.split(',')
-
-                    var arr3 = []
-
-                    arr.forEach((item2, i2) => {
-                      if (name == 'ps' || name == 'hs') {
-                        arr3.push({
-                          id: `${name}:${item2}`,
-                          name: i2 + 1 + '#：' + arr2[i2],
-                        })
-                      } else {
-                        arr3.push({
-                          id: `${name}:${item2}`,
-                          name:
-                            i2 +
-                            1 +
-                            '#：' +
-                            that.filedFomatter(arr2[i2], that.taskList),
-                        })
-                      }
-                    })
-                    that.iotKeyData.push({
-                      name: name1,
-                      data: arr3,
-                    })
-                  })
-                }
-              }
-
-              if (j.body) {
-                var b = JSON.parse(j.body)
-                if (that.dataForm.deviceType == '12') {
-                  that.$set(that.dataForm, 'light', b.light)
-                } else if (that.dataForm.deviceType == '15') {
-                    console.log("b.textInfoList",b.textInfoList)
-                  that.loadinfoBoardTemplate(1, b.textInfoList)
-                }
-              }
-            }
-            //that.loadTable()
-            //that.loadDevice2(that.dataForm.deviceType)
-          } else {
-            that.$message.warning(res.data.message)
-          }
-        }
-      })
-      }
-    },
-    // 转换fontsize字段
-    convertFontSize(fontSize) {
-      const parts = fontSize.split('*');
-      let size = ''
-      if (parts.length > 1) {
-        size = parts[0];  // 取 * 前面的部分
-      } else {
-        size = '';  // 如果没有 * 号，返回空
-      }
-      return size+'px'
-    },
-    getHexColor(fontColor) {
-      const colorMapping = {
-        '红色': '#FF0000',
-        '黄色': '#FFFF00',
-        '绿色': '#008000'
-      };
-      // 如果 colorMapping 中存在 fontColor 对应的值，返回其对应的 hex
-      let hexColor = '';
-      if (colorMapping[fontColor]) {
-        hexColor = colorMapping[fontColor];
-      } else {
-        hexColor = '';  // 如果没有匹配的颜色
-      }
-      return hexColor
-    },
-    // 点击画布的时候, 取消选择组件
-    laryerMouseDown() {
-      var that = this
-      that.curControl = null
-    },
-    distanceFromNine(num) {
-      let distance = 0
-      while (num !== 10) {
-        if (num < 10) {
-          num++
-        } else {
-          num--
-        }
-        distance++
-      }
-      return distance
-    },
-    liuliangLine(data) {
-      var that = this
-      var myChart1 = echarts.init(document.getElementById('liuliangLineId'))
-      var sdata = []
-      data.x.forEach((item) => {
-        sdata.push(item.substring(6, 8) + '日' + item.substring(8, 10) + '时')
-      })
-      myChart1.setOption({
-        grid: {
-          left: '0%',
-          right: '0%',
-          top: '10%',
-          bottom: '0%',
-          containLabel: true,
-        },
-        tooltip: {
-          trigger: 'axis',
-          axisPointer: {
-            type: 'line',
-            lineStyle: {
-              color: 'rgba(50, 216, 205, 1)',
-            },
-          },
-        },
-        /*legend: {
-          icon: 'circle',
-          right: '5%',
-          itemWidth: 10,
-          itemGap: 5,
-          textStyle: {
-            color: '#fff',
-            padding: [3, 0, 0, 0],
-          },
-        },*/
-        xAxis: [
-          {
-            type: 'category',
-            boundaryGap: 1,
-            axisLine: {
-              show: false,
-            },
-            axisLabel: {
-              color: 'rgba(255,255,255,0.7)',
-            },
-            splitLine: {
-              show: false,
-            },
-            axisTick: {
-              show: false,
-            },
-
-            data: sdata,
-          },
-        ],
-        yAxis: [
-          {
-            // max: 1000,
-            minInterval: 1,
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: 'rgba(255, 255, 255, 0.2)',
-                type: 'dashed',
-              },
-            },
-            axisLine: {
-              show: false,
-            },
-            axisLabel: {
-              show: true,
-              margin: 10,
-              textStyle: {
-                color: 'rgba(255,255,255,0.7)',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-          },
-        ],
-        series: [
-          {
-            name: '深圳方向',
-            type: 'line',
-            smooth: true,
-            stack: '深圳方向',
-            symbolSize: 5,
-            showSymbol: false,
-            itemStyle: {
-              normal: {
-                color: '#bc7f39',
-                lineStyle: {
-                  color: '#bc7f39',
-                  width: 2,
-                },
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(188,127,57,0.8)',
-                    },
-                    {
-                      offset: 0.5,
-                      color: 'rgba(188,127,57,0)',
-                    },
-                  ],
-                  false
-                ),
-              },
-            },
-            data: data.y2,
-          },
-          {
-            name: '开平方向',
-            type: 'line',
-            smooth: true,
-            stack: '开平方向',
-            symbolSize: 5,
-            showSymbol: false,
-            itemStyle: {
-              normal: {
-                color: '#7CD6CA',
-                lineStyle: {
-                  color: '#7CD6CA',
-                  width: 2,
-                },
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(124, 214, 202, 0.8)',
-                    },
-                    {
-                      offset: 0.5,
-                      color: 'rgba(124, 214, 202,0)',
-                    },
-                  ],
-                  false
-                ),
-              },
-            },
-            data: data.y1,
-          },
-        ],
-      })
-    },
-    getNowTime() {
-      let dateTime
-      let yy = new Date().getFullYear()
-      let mm =
-        new Date().getMonth() + 1 < 10
-          ? '0' + (new Date().getMonth() + 1)
-          : new Date().getMonth() + 1
-      let dd =
-        new Date().getDate() < 10
-          ? '0' + new Date().getDate()
-          : new Date().getDate()
-      let hh =
-        new Date().getHours() < 10
-          ? '0' + new Date().getHours()
-          : new Date().getHours()
-      let mf =
-        new Date().getMinutes() < 10
-          ? '0' + new Date().getMinutes()
-          : new Date().getMinutes()
-      let ss =
-        new Date().getSeconds() < 10
-          ? '0' + new Date().getSeconds()
-          : new Date().getSeconds()
-
-      var days = new Date().getDay()
-      switch (days) {
-        case 1:
-          days = '星期一'
-          break
-        case 2:
-          days = '星期二'
-          break
-        case 3:
-          days = '星期三'
-          break
-        case 4:
-          days = '星期四'
-          break
-        case 5:
-          days = '星期五'
-          break
-        case 6:
-          days = '星期六'
-          break
-        case 0:
-          days = '星期日'
-          break
-      }
-      //dateTime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss + ' ' + days
-      dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf
-      return dateTime
-    },
-    filedFomatter(value, list) {
-      if (value === '' || value == undefined) return ''
-      const item = list.find((item) => item.id == value)
-      return item ? item.name : value
-    },
-    domRender(str, fillInfo, id, index) {
-      var that = this
-      let strData = str
-      //var reg = /\{.*?\}/g
-      let charCount = str.split('{}').length - 1
-      var arr = []
-      if (fillInfo) {
-        arr = fillInfo.split(';')
-      }
-      for (var i = 0; i < charCount; i++) {
-        if (arr.length > 0) {
-          if (index) {
-            strData = strData.replace('{}', arr[i])
-          } else {
-            strData = strData.replace(
-              '{}',
-              '<input idData=temp' +
-                i +
-                ' value="' +
-                arr[i] +
-                '" class="emptyOut" type="number" />'
-            )
-          }
-          that.tempMap[id] = {
-            ...this.tempMap[id],
-            ['temp' + i]: arr[i],
-          }
-        } else {
-          strData = strData.replace(
-            '{}',
-            '<input idData=temp' + i + ' class="emptyOut" type="number" />'
-          )
-        }
-      }
-      return strData
-    },
-  },
-  beforeDestroy() {
-    var that = this
-    if (that.warnTimer) {
-      clearInterval(that.warnTimer)
-      that.warnTimer = null
-    }
-  },
-
-}
-</script>
-
-<style scoped lang="less">
-.input-box {
-  .el-col-5 {
-    max-width: 20%;
-    flex: 0 0 20%;
-  }
-}
-.big-main {
-}
-
-.metadigiee-video-player {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-#VideoPlayer {
-  width: 100%;
-  height: 100%;
-  object-fit: fill;
-}
-.infowindow {
-  position: absolute;
-}
-  .el-tree {
-      padding: 10px;
-    }
-
-    ::v-deep .el-tree-node__expand-icon {
-    //   display: none !important;
-    //   display: none !important;
-    }
-  
-    .custom-tree-node {
-     //  flex: 1;
-      // display: flex;
-      // align-items: center;
-      // justify-content: space-between;
-      font-size: 14px;
-      padding-right: 8px;
-    //   line-height: 55px;
-      // display: inline-block;
-      position: relative;
-      .label{
-         flex: 1;
-        max-width: 200px !important;
-        display: inline-block;
-        white-space: nowrap; /* 防止文本换行 */
-        overflow: hidden; /* 隐藏溢出的文本 */
-        text-overflow: ellipsis; /* 显示省略号 */
-        // background: saddlebrown;
-      }
-      .icon{
-        height: 100%;
-        position: absolute;
-        right: 10px;
-        z-index: 9999 !important;
-      }
-    }
-    .custom-tree-node:hover .node-actions {
-      display: block;
-      position: absolute;
-      right: 0px;
-      top: 3px;
-      z-index: 9999 !important;
-    }
-    .node-actions {
-      display: none;
-    }
-.header {
-  width: 100%;
-  height: 65px;
-  /*background: url("~@/assets/images/headerBg.png");
-  background-size: auto 100%;*/
-
-  .tunnel-item {
-    width: 170px;
-    height: 42px;
-    font-size: 18px;
-    display: flex;
-    justify-content: center;
-    cursor: pointer;
-    background: url('~@/assets/images/herder_menuBg.png');
-    background-size: 100% 100%;
-    line-height: 42px;
-  }
-  .tunnel-item-active {
-    text-align: center;
-    color: #5dd5c8;
-    cursor: pointer;
-    background: url('~@/assets/images/herder_menuBg_c.png');
-    background-size: 100% 100%;
-  }
-}
-
-/*.titleSpan{
-  letter-spacing: 2px;
-  font-size: 26px;
-  color: #FFFFFF;
-  font-weight: 600;
-  background: linear-gradient(0deg, #9AD3FA,  #EFFBFF);
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-}*/
-
-.main {
-  height: 600px;
-  margin-top: 20px;
-  padding: 0 20px;
-  .main-type-item {
-    height: 41px;
-    text-align: center;
-    cursor: pointer;
-    float: left;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 14px;
-    padding: 0 20px;
-    background: url('~@/assets/images/main_typeBg.png');
-    background-size: 100% 100%;
-  }
-
-  .main-type-item-active {
-    color: #5dd5c8;
-    cursor: pointer;
-  }
-
-  .main-device-item {
-    border: 1px solid #ffffff;
-    text-align: center;
-    padding: 6px 20px;
-    float: left;
-  }
-
-  .main-item-p {
-    font-size: 16px;
-    margin: 10px 0;
-  }
-
-  .drap-container {
-    flex: 1;
-    width: 100%;
-    height: 100%;
-    position: relative;
-    float: left;
-    text-align: center;
-
-    .drap-container-item {
-      -webkit-user-select: none;
-      -moz-user-select: none;
-      -o-user-select: none;
-      user-select: none;
-      position: absolute;
-      user-select: none;
-      cursor: pointer;
-      border: 1px solid transparent;
-      .drap-item-img {
-        display: block;
-        width: 100%;
-        // height: 80px;
-        user-select: none;
-      }
-      .drap-item-name {
-        text-align: center;
-      }
-    }
-    .drap-container-item-active {
-      border: 1px solid skyblue;
-    }
-    .drap-container-img {
-      vertical-align: middle;
-      /*width: 28px;
-      height: 28px;*/
-    }
-    .drap-container-div {
-      background: #09253f;
-      border-radius: 10px;
-      border: 2px solid #969da2;
-      font-size: 12px;
-      display: flex;
-      text-align: center;
-      align-items: center;
-      /*color: #cc3232;*/
-      color: #ccc032;
-      /*color: #25bd2d;*/
-    }
-    .drap-container-name {
-      text-align: center;
-    }
-  }
-
-  .dot-container {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 50px; /* 控制横线高度 */
-    border-bottom: 1px solid #a5afc2;
-  }
-
-  .dot {
-    width: 104px;
-    height: 40px;
-    font-size: 12px;
-    background: url('~@/assets/images/main_typeBg.png');
-    background-size: 100% 100%;
-    margin: 0 100px;
-  }
-  .dot-span {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    line-height: 23px;
-    align-items: center;
-    justify-content: center;
-  }
-  .dot-circle {
-    width: 13px;
-    height: 13px;
-    background: url('~@/assets/images/dotCircle.png');
-    background-size: 100% 100%;
-    margin: 0 auto;
-  }
-
-  .dot:first-child:before {
-    margin-left: 0;
-  }
-
-  .dot:last-child:before {
-    margin-right: 0;
-  }
-
-  .dot-container2 {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 50px; /* 控制横线高度 */
-    border-top: 1px solid #a5afc2;
-  }
-  .dot-circle2 {
-    width: 13px;
-    height: 13px;
-    background: url('~@/assets/images/dotCircle.png');
-    background-size: 100% 100%;
-    margin: -13px auto 0;
-  }
-}
-.footer {
-  height: calc(100% - 700px);
-
-  .title_div {
-    width: calc(100% - 35px);
-    height: 40px;
-    background: url('~@/assets/images/titleBg.png');
-    background-size: 100% 100%;
-    line-height: 40px;
-    padding-left: 35px;
-    font-size: 16px;
-    color: #aed6ff;
-    font-weight: bold;
-    letter-spacing: 1px;
-  }
-  .footer-item {
-    width: 100%;
-    height: calc(100% - 60px);
-    margin-top: 20px;
-  }
-  .device-bg {
-    width: 100%;
-    height: 100%;
-    background: url('~@/assets/images/device1.png');
-    background-size: 100% 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    cursor: pointer;
-  }
-  .device-bg2 {
-    background: url('~@/assets/images/device2.png');
-    background-size: 100% 100%;
-  }
-  .device-bg3 {
-    background: url('~@/assets/images/device3.png');
-    background-size: 100% 100%;
-  }
-}
-
-.full-screen-mask {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5); // 设置遮罩层的背景颜色和透明度
-  z-index: 98; // 设置遮罩层的层级
-  pointer-events: auto;
-}
-.plan-item {
-  width: 480px;
-  height: 683px;
-  position: absolute;
-  left: 384px;
-  top: 130px;
-  z-index: 99;
-  background-color: rgba(13, 35, 76, 0.95);
-  box-shadow: inset 0px 0px 15px #0fcff1;
-  border-radius: 15px;
-  pointer-events: auto;
-}
-.control-item {
-  width: 380px;
-  height: 683px;
-  position: absolute;
-  right: 40px;
-  top: 130px;
-  z-index: 99;
-  background-color: rgba(13, 35, 76, 0.95);
-  box-shadow: inset 0px 0px 15px #0fcff1;
-  border-radius: 15px;
-  pointer-events: auto;
-}
-
-.item-frame {
-  border: 1px solid #487ef7;
-  border-radius: 2px;
-  position: relative;
-}
-.item-frame-title {
-  margin-top: -12px;
-  background-color: rgb(13, 36, 86);
-  position: absolute;
-  padding: 0 6px;
-  margin-left: 10px;
-  font-size: 16px;
-}
-.item-frame-p {
-  color: #cccccc;
-  margin-bottom: 10px;
-}
-.warn-item {
-  width: 364px;
-  height: 683px;
-  position: absolute;
-  left: 20px;
-  top: 130px;
-  font-family: SourceHanSansCN;
-  background: url('~@/assets/images/warnBg.png');
-  background-size: 100% 100%;
-  z-index: 99;
-  pointer-events: auto;
-  .title {
-    width: 200px;
-    height: 55px;
-    margin: -20px auto 0;
-    background: url('~@/assets/images/warnTitleBg.png');
-    background-size: 100% 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 20px;
-    font-weight: bold;
-    color: #ffffff;
-  }
-  .warnBtu {
-    width: 86px;
-    height: 28px;
-    text-align: center;
-    line-height: 25px;
-    font-size: 16px;
-    font-family: SourceHanSansCN;
-    background: url('~@/assets/images/warnBut.png');
-    background-size: 100% 100%;
-    display: inline-block;
-    cursor: pointer;
-  }
-}
-.deviceRun-item {
-  width: 544px;
-  height: 683px;
-  position: absolute;
-  left: 25px;
-  top: 130px;
-  font-family: SourceHanSansCN;
-  background: url('~@/assets/images/deviceRunBg.png');
-  background-size: 100% 100%;
-  z-index: 99;
-  pointer-events: auto;
-  .title {
-    width: 227px;
-    height: 58px;
-    margin: -20px auto 0;
-    background: url('~@/assets/images/deviceRunTitle.png');
-    background-size: 100% 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 20px;
-    font-weight: bold;
-    color: #ffffff;
-  }
-
-  .runColBg {
-    width: 100%;
-    background-image: url('~@/assets/images/runColBg.png');
-    background-size: 100% 40%;
-    background-position: bottom;
-    background-repeat: no-repeat, repeat;
-    padding: 5px 0;
-    font-family: SourceHanSansCN;
-  }
-
-  .runRowBg {
-    width: 100%;
-    height: 43px;
-    line-height: 45px;
-    background-image: url('~@/assets/images/runRowBg.png');
-    background-size: 100% 100%;
-    text-align: center;
-    color: #ffffff;
-    cursor: pointer;
-    font-size: 14px;
-    font-family: SourceHanSansCN;
-    margin-bottom: 18px;
-  }
-}
-
-.device-View {
-  height: 100%;
-}
-.device-View-main {
-  height: calc(100% - 120px);
-  position: relative;
-  margin: 0 auto;
-}
-
-/* 波动效果 */
-.wave {
-  position: relative;
-  text-align: center;
-}
-.wave .circle {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  border-radius: 50%;
-  opacity: 0;
-  background: #f36710;
-}
-.wave .circle:first-child {
-  animation: circle-opacity 1s infinite;
-}
-@keyframes circle-opacity {
-  from {
-    opacity: 1;
-    transform: scale(1);
-  }
-  to {
-    opacity: 0;
-    transform: scale(1.5);
-  }
-}
-
-// 选择框样式
-/deep/.select-down .el-select {
-  margin-left: 30px !important;
-}
-/deep/.select-down .el-input__inner {
-  background: url('~@/assets/images/selectBg.png');
-  width: 365px;
-  height: 45px;
-  border: none;
-  color: #1afff7;
-  padding-left: 30px;
-  font-size: 16px;
-}
-/deep/.select-down .el-select .el-select-dropdown {
-  background: RGBA(28, 51, 91, 0.9);
-  border: 1px solid rgba(26, 255, 247, 0.4);
-}
-/deep/.select-down .el-popper .popper__arrow::after {
-  border-bottom-color: rgba(26, 255, 247, 0.4);
-}
-/deep/.select-down .el-popper .popper__arrow {
-  border-bottom-color: #1c335b;
-}
-/deep/.select-down .el-select-dropdown__item {
-  color: #ffffff;
-}
-/deep/.select-down .el-select-dropdown__item.selected,
-/deep/.select-down .el-select .el-input .el-select__caret {
-  color: #1afff7;
-}
-/deep/.select-down .el-select-dropdown__item.hover,
-.el-select-dropdown__item:hover {
-  background-color: #3865a9;
-}
-
-/deep/.temlCheckClass .el-checkbox__input {
-  vertical-align: top;
-  padding-top: 2px;
-}
-
-.popper-dropdown {
-  min-width: 80px !important;
-  padding: 0 !important;
-}
-.dropdown-item {
-  height: 30px;
-  line-height: 30px;
-  padding-left: 5px;
-  cursor: pointer;
-}
-.dropdown-item-active {
-  color: #5dd5c8;
-}
-.dropdown-item:hover {
-  background-color: rgba(26, 167, 255, 0.2);
-}
-.item-one-block:hover {
-  background-color: rgba(47, 174, 255, 0.2);
-}
-.item-one-block2 {
-  background-color: rgba(47, 174, 255, 0.2);
-}
-</style>
-<style>
-.emptyOut {
-  width: 60px;
-  margin: 0 5px;
-}
-@media (max-height: 1079px) {
-  .big-main {
-    zoom: 1;
-  }
-  .device-main {
-    zoom: 0.8;
-  }
-}
-@media (min-height: 1080px) {
-  .big-main {
-    zoom: 1.2;
-  }
-
-  .device-main {
-    zoom: 0.8;
-  }
-  #liuliangLineId {
-    zoom: 0.8;
-  }
-}
-
-    .el-tree-node__content{
-                display: flex;
-    align-items: center;
-    height: 40px ;
-    cursor: pointer;
-    }
-</style>
+<template>
+  <div class="big-main" style="width: 100%; height: 100%; color: #d5e0ee; position: relative">
+    <div v-show="!main2DShow" class="metadigiee-video-player" id="metadigiee-video-player"></div>
+    <div style="
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        left: 0;
+        top: 0;
+        pointer-events: none;
+      ">
+      <div class="header" style="pointer-events: auto">
+        <div style="height: 100%">
+          <div style="
+              float: left;
+              width: 550px;
+              height: 100%;
+              margin-left: 500px;
+              position: relative;
+              z-index: 10;
+            ">
+            <el-row :gutter="20" style="width: 550px; margin-top: 25px">
+              <el-col :span="8" v-for="item in areaList" :key="item.id">
+                <div @click="tunnelClick(item.id)" :class="searchForm.area == item.id
+                  ? 'tunnel-item-active tunnel-item'
+                  : 'tunnel-item'
+                  ">
+                  {{ item.name }}
+                </div>
+              </el-col>
+            </el-row>
+          </div>
+          <!--          <div style="height: 100%;float:right;">
+            <div style="text-align: right;padding: 30px 20px 0 0;color: white">
+              <span style="font-family: DINPro;font-weight: bold;font-size: 33px;margin-right: 10px">{{nowTime.split(' ')[1]}}</span>{{nowTime.split(' ')[0]}}
+            </div>
+          </div>-->
+        </div>
+      </div>
+      <div class="main">
+        <div style="width: 100%; height: 60px; pointer-events: auto">
+          <div style="float: left; width: calc(100% - 250px); overflow-x: scroll">
+            <div style="width: 800px; white-space: nowrap">
+              <div @click="deviceTypeClick(item)" v-for="item in deviceBarTypeList" :key="item.id"
+                class="main-type-item">
+                <el-link v-if="item.id == '12' || item.id == '17'">{{
+                  item.name
+                }}</el-link>
+                <span v-else>{{ item.name }}</span>
+              </div>
+            </div>
+          </div>
+          <div style="float: right; width: 250px; position: relative">
+            <el-row style="width: 250px" class="input-box">
+              <el-col :span="5" style="min-height: 1px">
+                <img v-show="!main2DShow" @click="handlePatrol()" src="../../assets/images/icon/main-right5.png"
+                  style="cursor: pointer; width: 100%" />
+              </el-col>
+              <el-col :span="5" @click.native="planDisposalClick(searchForm)">
+                <img src="../../assets/images/icon/main-right1.png" style="cursor: pointer; width: 100%" />
+              </el-col>
+              <!-- <el-col :span="5">
+                <img
+                  @click="handle2D()"
+                  src="../../assets/images/icon/main-right2.png"
+                  style="cursor: pointer; width: 100%"
+                />
+              </el-col> -->
+              <!-- <el-col :span="5">
+                <img
+                  @click="handle3D()"
+                  src="../../assets/images/icon/main-right3.png"
+                  style="cursor: pointer; width: 100%"
+                />
+              </el-col> -->
+              <el-col :span="5">
+                <el-popover :popper-append-to-body="false" popper-class="popper-dropdown" width="110" placement="bottom"
+                  trigger="click">
+                  <div @click="typeClick(item.id)" v-for="item in deviceTypeList1" :key="item.id">
+                    <div :class="searchForm.deviceType == item.id
+                      ? 'dropdown-item dropdown-item-active'
+                      : 'dropdown-item'
+                      ">
+                      {{ item.name }}
+                    </div>
+                  </div>
+                  <img slot="reference" src="../../assets/images/icon/main-right4.png"
+                    style="cursor: pointer; width: 100%" />
+                </el-popover>
+              </el-col>
+            </el-row>
+            <div v-show="patrolShow && !main2DShow" style="
+                position: relative;
+                background-color: rgba(255, 255, 255, 0.7);
+                border-radius: 4px;
+                padding: 5px 10px;
+                width: 300px;
+                right: 320px;
+                top: -50px;
+                color: black;
+              ">
+              <el-row :gutter="30" class="input-box">
+                <el-col :span="5" @click.native="patrolClick('pause')" style="cursor: pointer"><img
+                    src="../../assets/images/icon/pause.png" style="width: 30px" />暂停</el-col>
+                <el-col :span="5" @click.native="patrolClick('play')" style="cursor: pointer"><img
+                    src="../../assets/images/icon/play.png" style="width: 30px" />继续</el-col>
+                <el-col :span="5" @click.native="patrolClick('end')" style="cursor: pointer"><img
+                    src="../../assets/images/icon/end.png" style="width: 32px" />结束</el-col>
+                <el-col :span="5" @click.native="patrolClick('tunnelLeft')" style="cursor: pointer"><img
+                    src="../../assets/images/icon/tunnel.png" style="width: 32px" />左洞</el-col>
+                <el-col :span="5" @click.native="patrolClick('tunnelRight')" style="cursor: pointer"><img
+                    src="../../assets/images/icon/tunnel.png" style="width: 32px" />右洞</el-col>
+              </el-row>
+            </div>
+          </div>
+        </div>
+        <div style="
+            width: 100%;
+            height: calc(100% - 60px);
+            pointer-events: none;
+            position: relative;
+          ">
+          <div v-show="main2DShow" @click="scrollClick(1)" style="
+              position: absolute;
+              top: 45%;
+              left: 160px;
+              width: 30px;
+              height: 30px;
+              background-color: rgba(255, 255, 255, 0.2);
+              text-align: center;
+              line-height: 30px;
+              cursor: pointer;
+              z-index: 10;
+              pointer-events: auto;
+            ">
+            <i class="el-icon-arrow-left"></i>
+          </div>
+          <div v-show="main2DShow" @click="scrollClick(2)" style="
+              position: absolute;
+              top: 45%;
+              right: -10px;
+              width: 30px;
+              height: 30px;
+              background-color: rgba(255, 255, 255, 0.2);
+              text-align: center;
+              line-height: 30px;
+              cursor: pointer;
+              z-index: 10;
+              pointer-events: auto;
+            ">
+            <i class="el-icon-arrow-right"></i>
+          </div>
+
+          <div class="device-main" v-show="main2DShow" style="width: 98%; height: 100%; pointer-events: auto">
+            <div style="width: 250px; height: 100%; float: left">
+              <div style="height: 50%; text-align: center">
+                <img src="../../assets/images/toLeft.png" style="padding-top: 60%" />
+                <p class="main-item-p">下行</p>
+                <p style="font-size: 18px">
+                  {{ pileNumMap[searchForm.area].length2 }}米
+                </p>
+              </div>
+              <div style="height: calc(50% - 30px); text-align: center">
+                <img src="../../assets/images/toRight.png" style="padding-top: 25%" />
+                <p class="main-item-p">上行</p>
+                <p style="font-size: 18px">
+                  {{ pileNumMap[searchForm.area].length1 }}米
+                </p>
+              </div>
+            </div>
+            <div ref="scrollContainer" style="width: calc(100% - 250px); height: 670px; overflow: auto">
+              <div class="device-View" :style="{
+                width: `${pileNumMap[searchForm.area].width}px`,
+              }">
+                <div style="width: 100%; height: 60px">
+                  <div class="dot-container">
+                    <div class="dot" v-for="(item, index) in pileNumList" :key="index">
+                      <div class="dot-span">{{ item }}</div>
+                      <div class="dot-circle"></div>
+                    </div>
+                  </div>
+                </div>
+                <div class="device-View-main" style="width: 100%">
+                  <div style="width: 100%; height: 100%; position: absolute">
+                    <template v-if="searchForm.area != '3'">
+                      <img src="../../assets/images/icon/area1.2.png" style="margin-top: 30px; height: 225px" />
+                      <img src="../../assets/images/icon/area2.2.png" style="margin-top: 30px; height: 225px" />
+                    </template>
+                    <template v-else>
+                      <!--                  <img src="../../assets/images/icon/area3.png" style="margin-top: 30px;width: 100%">-->
+                      <img src="../../assets/images/icon/area1.2.png" style="margin-top: 30px; height: 225px" />
+                      <img src="../../assets/images/icon/area2.2.png" style="margin-top: 30px; height: 225px" />
+                    </template>
+                  </div>
+                  <div style="
+                      width: calc(100% - 304px);
+                      height: 100%;
+                      position: absolute;
+                      z-index: 2;
+                      left: 152px;
+                    ">
+                    <div class="drap-container" @dragover.prevent @mousedown="laryerMouseDown">
+                      <div v-for="(item, index) in componentsList" class="drap-container-item" :class="{
+                        'drap-container-item-active':
+                          curControl && item.deviceId == curControl.deviceId,
+                      }" :key="index" :style="{
+                        top: `${item.position.y}px`,
+                        left: `${item.position.x}px`,
+                        'z-index': `${item.zIndex}`,
+                      }" @click="handleClick(item, 1)">
+                        <!--                    <div class="drap-container-name">{{ item.name }}</div>-->
+                        <!--                        <template v-if="item.deviceType == '15' && item.content">
+                          <div class="drap-container-div"
+                               :style="{
+                                width: `${item.position.w}px`,
+                                height: `${item.position.h}px`,
+                              }">
+                            <div style="padding: 1px 3px">
+                              {{ item.content }}
+                            </div>
+                          </div>
+
+                        </template>-->
+                        <template>
+                          <img slot="reference" class="drap-container-img" :style="{
+                            width: `${item.position.w}px`,
+                            height: `${item.position.h}px`,
+                            opacity: `${item.opacity}`,
+                          }" :src="item.imgUrl" draggable="false" :alt="item.deviceName" />
+                        </template>
+                      </div>
+                      <div class="wave" v-for="(item, index) in componentsWarnList" :style="{
+                        width: `${item.position.w}px`,
+                        height: `${item.position.h}px`,
+                        top: `${item.position.y}px`,
+                        left: `${item.position.x}px`,
+                        position: 'absolute',
+                        'z-index': '3',
+                      }" :key="index">
+                        <div class="circle" v-if="warnControl && item.id == warnControl.id"></div>
+                        <div class="drap-container-item" :key="index">
+                          <img slot="reference" class="drap-container-img" :style="{
+                            width: `${item.position.w}px`,
+                            height: `${item.position.h}px`,
+                          }" :src="item.imgUrl" draggable="false" :alt="item.id" />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div style="width: 100%; height: 60px">
+                  <div class="dot-container2">
+                    <div class="dot" v-for="(item, index) in pileNumList" :key="index">
+                      <div class="dot-circle2"></div>
+                      <div class="dot-span">{{ item }}</div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="footer" style="pointer-events: auto">
+        <el-row style="height: 100%">
+          <el-col :span="6" style="height: 100%; padding: 0 30px">
+            <div class="title_div">预警列表</div>
+            <div class="footer-item">
+              <el-row :gutter="30" style="height: 100%">
+                <el-col :span="12" style="height: 100%">
+                  <div class="device-bg" @click="handleWarnClick('3,8')">
+                    <div style="text-align: center">
+                      <p style="color: #5dd5c8; font-size: 38px">
+                        {{ statsticInfo.warn_count_done }}
+                      </p>
+                      <p style="font-size: 14px; margin-top: 10px">已处理</p>
+                    </div>
+                  </div>
+                </el-col>
+                <el-col :span="12" style="height: 100%">
+                  <div class="device-bg device-bg2" @click="handleWarnClick('2')">
+                    <div style="text-align: center">
+                      <p style="color: #dfb756; font-size: 38px">
+                        {{ statsticInfo.warn_count_todo }}
+                      </p>
+                      <p style="font-size: 14px; margin-top: 10px">
+                        待处理<img src="../../assets/images/daiqueren.png" height="14px" style="margin-left: 10px" />
+                      </p>
+                    </div>
+                  </div>
+                </el-col>
+              </el-row>
+            </div>
+          </el-col>
+          <el-col :span="6" style="height: 100%; padding: 0 30px">
+            <div class="title_div">事件</div>
+            <div class="footer-item" style="cursor: pointer">
+              <el-row :gutter="30" style="height: 100%">
+                <el-col :span="12" style="height: 100%">
+                  <div class="device-bg">
+                    <div style="text-align: center">
+                      <p style="color: #5dd5c8; font-size: 38px">0</p>
+                    </div>
+                  </div>
+                </el-col>
+                <el-col :span="12" style="height: 100%">
+                  <div class="device-bg device-bg3">
+                    <div style="text-align: center">
+                      <p style="color: #df565a; font-size: 38px">0</p>
+                    </div>
+                  </div>
+                </el-col>
+              </el-row>
+            </div>
+          </el-col>
+          <el-col :span="12" style="height: 100%; padding: 0 30px">
+            <div style="width: 50%">
+              <div class="title_div">交通流量</div>
+            </div>
+            <div class="footer-item" id="liuliangLineId"></div>
+          </el-col>
+          <!--          <el-col :span="6" style="height: 100%;padding: 0 30px">
+            <div class="title_div">视频画面</div>
+            <div class="footer-item">
+              <video autoplay controls loop muted width="100%" height="100%" style="background: black">
+                <source src="../../assets/maoliling.mp4" type="video/mp4">
+              </video>
+            </div>
+          </el-col>-->
+        </el-row>
+      </div>
+
+      <transition name="el-zoom-in-top">
+        <div class="warn-item" v-show="warnShow">
+          <div class="title">预警信息</div>
+          <div @click="warnClose()" style="
+              position: absolute;
+              right: 29px;
+              top: 26px;
+              width: 30px;
+              height: 30px;
+              cursor: pointer;
+            "></div>
+          <div style="
+              width: 340px;
+              height: 580px;
+              margin: 25px auto 20px;
+              overflow: auto;
+            ">
+            <div style="width: 335px">
+              <div @click="warnClick(item)" :class="warnForm.id == item.id
+                ? 'item-one-block item-one-block2'
+                : 'item-one-block'
+                " style="
+                  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+                  padding: 20px;
+                " v-for="item in warnList" :key="item.id">
+                <el-row>
+                  <el-col :span="2">
+                    <div style="height: 25px; line-height: 36px">
+                      <img v-show="item.status == 2" :src="require('../../assets/images/icon/warn1.png')" />
+                      <img v-show="item.status == 1" :src="require('../../assets/images/icon/warn2.png')" />
+                    </div>
+                  </el-col>
+                  <el-col :span="6">
+                    <div style="font-size: 18px; font-weight: bold">
+                      <span v-if="item.status == 1">疑似火灾</span>
+                      <span v-else-if="item.status == 2">火灾</span>
+                      <span v-else>{{
+                        filedFomatter(item.type, warnTypeList)
+                      }}</span>
+                    </div>
+                  </el-col>
+                  <el-col :span="16" style="text-align: right">
+                    <div class="warnBtu" v-show="item.status == 1 || item.status == 2" @click="verifyClick(item)">
+                      人工确认
+                    </div>
+                    <div class="warnBtu" v-show="item.status == 2" @click="warnPlanClick(item)"
+                      style="margin-left: 14px">
+                      预案处置
+                    </div>
+                  </el-col>
+                  <el-col :span="16" v-show="item.status == 3 || item.status == 8">
+                    <p style="text-align: right; margin-top: 5px; color: #cccccc">
+                      {{ filedFomatter(item.status, warnStatusList) }}
+                    </p>
+                  </el-col>
+                </el-row>
+                <el-row style="margin-top: 20px">
+                  <el-col :span="10">
+                    {{ filedFomatter(item.area, areaList) }}
+                  </el-col>
+                  <el-col :span="8">
+                    {{ filedFomatter(item.direction, directionList) }}
+                  </el-col>
+                  <el-col :span="6" style="text-align: right">
+                    {{ item.pileNum }}
+                  </el-col>
+                </el-row>
+                <el-row style="margin-top: 10px">
+                  <el-col :span="24" style="text-align: right">
+                    {{ dateTimeFormat(item.warnTime) }}
+                  </el-col>
+                </el-row>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+      <transition name="el-zoom-in-top">
+        <div class="plan-item" v-show="warnDetailShow">
+          <div style="
+              padding: 15px 20px 0px;
+              height: 25px;
+              line-height: 35px;
+              font-size: 16px;
+            ">
+            <div style="float: left">
+              <span style="
+                  float: left;
+                  width: 10px;
+                  height: 10px;
+                  background: #2b6bb6;
+                  margin: 14px 5px 0 0;
+                "></span>预案详情
+            </div>
+            <div v-show="planSuccess" style="
+                float: left;
+                margin-left: 100px;
+                font-size: 14px;
+                margin-top: 5px;
+              ">
+              状态同步中
+            </div>
+            <div @click="warnDetailClose()" style="
+                float: right;
+                width: 20px;
+                text-align: center;
+                cursor: pointer;
+              ">
+              X
+            </div>
+            <div style="float: right; margin-right: 10px; width: 105px">
+              <div style="float: left; margin-top: 17px">
+                <div v-loading="planLoading" element-loading-spinner="el-icon-loading"></div>
+              </div>
+              <el-button type="primary" @click="handleCommitPlanClick(2)" size="mini"
+                style="float: right">一键发送</el-button>
+            </div>
+          </div>
+          <div style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"></div>
+          <div style="
+              padding: 0 20px 20px;
+              width: calc(100% - 40px);
+              height: calc(100% - 80px);
+            ">
+            <div style="width: 100%; height: 100%; overflow: auto">
+              <div v-for="item1 in planDeviceType" :key="item1" style="margin-bottom: 10px">
+                <div v-if="item1 == '13'">
+                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
+                    {{ filedFomatter(item1, deviceTypeList) }}控制
+                  </p>
+                  <p style="margin-top: 5px">上游</p>
+                  <div style="
+                      padding-left: 10px;
+                      line-height: 25px;
+                      margin-top: 5px;
+                    ">
+                    <p v-for="item in planDetailMap[item1]" v-if="item.stream == '1'" :key="item.id">
+                      {{ filedFomatter(item.direction, directionList) }}
+                      {{ item.id }}（{{ item.pileNum }}） 指令:{{ item.stream }}
+                      <span style="color: #ee9837">{{
+                        filedFomatter(item.cmd, taskEnum[item1].taskList)
+                      }}</span>
+                      <span style="margin-left: 10px" v-show="item.ret != undefined">
+                        状态:
+                        <span v-if="item.ret == -1 || item.ret == null">执行中</span>
+                        <span style="color: #12b76d" v-else>{{
+                          filedFomatter(item.ret, taskEnum[item1].taskList)
+                        }}</span>
+                      </span>
+                    </p>
+                  </div>
+                  <p style="margin-top: 5px">下游</p>
+                  <div style="
+                      padding-left: 10px;
+                      line-height: 25px;
+                      margin-top: 5px;
+                    ">
+                    <p v-for="item in planDetailMap[item1]" v-if="item.stream == '2'">
+                      {{ filedFomatter(item.direction, directionList) }}
+                      {{ item.id }}（{{ item.pileNum }}） 指令:{{ item.stream }}
+                      <span style="color: #ee9837">{{
+                        filedFomatter(item.cmd, taskEnum[item1].taskList)
+                      }}</span>
+                      <span style="margin-left: 10px" v-show="item.ret != undefined">
+                        状态:
+                        <span v-if="item.ret == -1 || item.ret == null">执行中</span>
+                        <span style="color: #12b76d" v-else>{{
+                          filedFomatter(item.ret, taskEnum[item1].taskList)
+                        }}</span>
+                      </span>
+                    </p>
+                  </div>
+                </div>
+                <div v-else-if="item1 == '15'">
+                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
+                    {{ filedFomatter(item1, deviceTypeList) }}控制
+                  </p>
+                  <!-- <div
+                    style="
+                      padding-left: 10px;
+                      line-height: 25px;
+                      margin-top: 5px;
+                    "
+                    v-show="planDetailMap[item1].length > 0"
+                  >
+                    <p v-for="item in planDetailMap[item1]" :key="item.id">
+                      {{ filedFomatter(item.direction, directionList) }}
+                      {{ item.id }}（{{ item.pileNum }}）
+                    </p>
+
+                    <el-select
+                      v-model="templateObj"
+                      clearable
+                      placeholder="请选择"
+                      size="small"
+                      style="width: 80%"
+                      :popper-append-to-body="false"
+                    >
+                      <el-option
+                        v-for="item in infoBoardTemplateList"
+                        :key="item.id"
+                        :label="item.textInfo"
+                        :value="item.id"
+                      >
+                      </el-option>
+                    </el-select>
+                  </div> -->
+                  <!-- <el-tree
+            class="filter-tree"
+            :data="treeData"
+            :props="defaultProps"
+            default-expand-all
+            :filter-node-method="filterNode"
+            ref="tree"
+            show-checkbox
+            @check-change="handleCheckChange"
+              v-model="textInfoList"
+          >
+            <span class="custom-tree-node" slot-scope="{ node, data }">
+              <el-tooltip :content="node.label" placement="top">
+                <span class="label">{{ node.label }}</span>  
+              </el-tooltip>
+                 <span style="color: #a8a8a8; font-size: 12px"
+                                  v-if="node.displaySize">宽高:{{ node.displaySize }} 
+                                  字体大小:{{ node.fontSize }} 
+                                  字体颜色:{{node.fontColor}}</span>
+              <div class="icon">
+                <i
+                  class="el-icon-plus node-actions"
+                  :style="node.level == 1 ? 'display:none' : ''"
+                  @click.self="handleAddToTable(node, data)"
+                ></i>
+              </div>
+      
+            </span>
+          </el-tree> -->
+                </div>
+                <div v-else>
+                  <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
+                    {{ filedFomatter(item1, deviceTypeList) }}控制
+                  </p>
+                  <div style="
+                      padding-left: 10px;
+                      line-height: 25px;
+                      margin-top: 5px;
+                    ">
+                    <p v-for="item in planDetailMap[item1]" :key="item.id">
+                      {{ filedFomatter(item.direction, directionList) }}
+                      {{ item.id }}（{{ item.pileNum }}） 指令:
+                      <span style="color: #ee9837">{{
+                        filedFomatter(item.cmd, taskEnum[item1].taskList)
+                      }}</span>
+                      <span style="margin-left: 10px" v-show="item.ret != undefined">
+                        状态:
+                        <span v-if="item.ret == -1 || item.ret == null">执行中</span>
+                        <span style="color: #12b76d" v-else>
+                          <template v-if="item1 == '19'">
+                            {{
+                              filedFomatter(item.ret, taskEnum[item1].taskList2)
+                            }}
+                          </template>
+                          <template v-else>
+                            {{
+                              filedFomatter(item.ret, taskEnum[item1].taskList)
+                            }}
+                          </template>
+                        </span>
+                      </span>
+                    </p>
+                  </div>
+                </div>
+              </div>
+              <div style="min-height: 200px">
+                <p style="
+                    font-size: 16px;
+                    font-weight: bold;
+                    color: #b3ddef;
+                    margin-bottom: 10px;
+                  ">
+                  广播控制
+                </p>
+                <div style="padding-left: 10px; line-height: 25px; margin-top: 5px">
+                  <el-select v-model="mediaObj" clearable value-key="id" placeholder="请选择" size="small"
+                    style="width: 80%" :popper-append-to-body="false" disabled>
+                    <el-option v-for="item in listMedia" :key="item.id" :label="item.name" :value="item">
+                    </el-option>
+                  </el-select>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+
+      <transition name="el-zoom-in-top">
+        <div class="warn-item" v-show="planShow">
+          <div class="title">事件预案处置</div>
+          <div @click="planClose()" style="
+              position: absolute;
+              right: 29px;
+              top: 26px;
+              width: 30px;
+              height: 30px;
+              cursor: pointer;
+            "></div>
+          <div style="
+              width: 340px;
+              height: 580px;
+              margin: 25px auto 20px;
+              overflow: auto;
+            ">
+            <div style="width: 335px">
+              <div @click="planClick(item)" :class="planForm.planId == item.planId
+                ? 'item-one-block item-one-block2'
+                : 'item-one-block'
+                " style="
+                  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+                  padding: 20px;
+                  cursor: pointer;
+                " v-for="(item, index) in planList" :key="index">
+                <el-row>
+                  <el-col :span="12">
+                    <div style="font-size: 18px; font-weight: bold">
+                      {{ item.planName }}
+                    </div>
+                  </el-col>
+                  <el-col :span="12" style="text-align: right">{{
+                    filedFomatter(item.planType, warnTypeList)
+                  }}</el-col>
+                </el-row>
+                <p>{{ item.desp }}</p>
+                <el-row style="margin-top: 10px">
+                  <el-col :span="12">
+                    {{ filedFomatter(item.area, areaList) }}
+                  </el-col>
+                  <el-col :span="12" style="text-align: right">
+                    {{ dateTimeFormat(item.createTime) }}
+                  </el-col>
+                </el-row>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+      <transition name="el-zoom-in-top">
+        <div class="plan-item" v-show="planDetailShow">
+          <div style="
+              padding: 15px 20px 0px;
+              height: 25px;
+              line-height: 35px;
+              font-size: 16px;
+            ">
+            <div style="float: left">
+              <span style="
+                  float: left;
+                  width: 10px;
+                  height: 10px;
+                  background: #2b6bb6;
+                  margin: 14px 5px 0 0;
+                "></span>预案详情
+            </div>
+            <div v-show="planSuccess" style="
+                float: left;
+                margin-left: 100px;
+                font-size: 14px;
+                margin-top: 5px;
+              ">
+              状态同步中
+            </div>
+            <div @click="planDetailClose()" style="
+                float: right;
+                width: 20px;
+                text-align: center;
+                cursor: pointer;
+              ">
+              X
+            </div>
+            <div style="float: right; margin-right: 20px; width: 105px">
+              <div style="float: left; margin-top: 17px">
+                <div v-loading="planLoading" element-loading-spinner="el-icon-loading"></div>
+              </div>
+              <el-button type="primary" @click="handleCommitPlanClick(1)" size="mini"
+                style="float: right">一键发送</el-button>
+            </div>
+          </div>
+          <div style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"></div>
+          <div style="
+              padding: 0 20px 20px;
+              width: calc(100% - 40px);
+              height: calc(100% - 80px);
+            ">
+            <div style="width: 100%; height: 100%; overflow: auto">
+              <div v-for="(item1, index1) in planDetailData" :key="index1" v-show="item1.data.length > 0"
+                style="margin-bottom: 10px">
+                <p style="font-size: 16px; font-weight: bold; color: #b3ddef">
+                  {{ filedFomatter(item1.type, deviceTypeList) }}控制
+                </p>
+                <div style="padding-left: 10px; line-height: 25px; margin-top: 5px">
+                  <p v-for="item in item1.data" :key="item.id">
+                    {{ filedFomatter(item.direction, directionList) }}
+                    {{ item.id }}（{{ item.pileNum }}） 指令:
+                    <span style="color: #12b7b2">{{
+                      filedFomatter(item.cmd, taskEnum[item1.type].taskList)
+                    }}</span>
+                    <span style="margin-left: 10px" v-show="item.ret != undefined">
+                      状态:
+                      <span v-if="item.ret == -1 || item.ret == null">执行中</span>
+                      <span style="color: #12b76d" v-else>{{
+                        filedFomatter(item.ret, taskEnum[item1.type].taskList)
+                      }}</span>
+                    </span>
+                  </p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+
+      <transition name="el-fade-in-linear">
+        <div v-show="deviceRunShow" class="deviceRun-item">
+          <div class="title">设备运行情况</div>
+          <div @click="deviceRunShow = false" style="
+              position: absolute;
+              right: 25px;
+              top: 25px;
+              width: 30px;
+              height: 30px;
+              cursor: pointer;
+            "></div>
+          <div style="height: 150px">
+            <div class="select-down" style="
+                width: 430px;
+                margin: 0 auto;
+                font-size: 16px;
+                padding-top: 50px;
+              ">
+              类型<el-select v-model="deviceType" @change="loadDevice" clearable placeholder="请选择"
+                :popper-append-to-body="false">
+                <el-option v-for="item in deviceTypeList" :key="item.id" :label="item.name" :value="item.id">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+          <div style="
+              width: calc(100% - 50px);
+              margin: 0px auto 20px;
+              height: calc(100% - 270px);
+            ">
+            <el-row :gutter="30" style="
+                text-align: center;
+                width: calc(100% - 20px);
+                margin: 0 auto 20px;
+              ">
+              <el-col :span="7">
+                <div class="runColBg">设备类型</div>
+              </el-col>
+              <el-col :span="7">
+                <div class="runColBg">设备编号</div>
+              </el-col>
+              <el-col :span="5">
+                <div class="runColBg">桩号</div>
+              </el-col>
+              <el-col :span="5">
+                <div class="runColBg">状态</div>
+              </el-col>
+            </el-row>
+
+            <div style="width: 100%; height: calc(100% - 30px); overflow: auto">
+              <div style="width: calc(100% - 20px); margin: 0 auto">
+                <el-row @click.native="deviceRunClick(item)" class="runRowBg" v-for="item in deviceData"
+                  :key="item.deviceId">
+                  <el-col :span="7" style="min-height: 1px">{{
+                    filedFomatter(item.deviceType, deviceTypeList)
+                  }}</el-col>
+                  <el-col :span="7" style="min-height: 1px">{{
+                    item.deviceId
+                  }}</el-col>
+                  <el-col :span="5" style="min-height: 1px">{{
+                    item.pileNum
+                  }}</el-col>
+                  <el-col :span="5" style="min-height: 1px; color: #5dd5c8">{{
+                    filedFomatter(item.status, statusList)
+                  }}</el-col>
+                </el-row>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+
+      <el-dialog style="pointer-events: auto" :title="addOrUpdateTitle" :visible.sync="deviceDialogVisible"
+        width="1000px" :close-on-click-modal="false" v-if="deviceDialogVisible" @close="deviceClose">
+        <div v-show="deviceLoading" style="
+            position: absolute;
+            z-index: 9999;
+            left: calc(50% - 60px);
+            top: 48%;
+            background: #ce811b;
+            padding: 10px 20px;
+            border-radius: 5px;
+          ">
+          正在发送指令...
+        </div>
+
+        <div v-loading="deviceLoading" element-loading-text="" element-loading-spinner="el-icon-loading"
+          element-loading-background="rgba(0, 0, 0, 0.5)">
+          <div v-show="dataForm.deviceType != 22" style="min-height: 70px; color: #1afff7">
+            <div style="
+                display: inline-block;
+                vertical-align: top;
+                padding: 10px;
+                border-right: 2px solid rgb(20 164 180);
+                height: 50px;
+              ">
+              <img src="../../assets/images/device.png" />
+            </div>
+            <!--            <div style="display: inline-block;vertical-align: top;padding: 0 30px;border-right: 2px solid rgb(20 164 180);min-width: 130px;height: 70px">
+&lt;!&ndash;              <p style="font-size: 23px;color: #1AFFF7;margin-bottom: 10px">
+                {{ filedFomatter(dataForm.status,statusList) }}
+                <span v-show="!dataForm.status">暂无状态</span>
+              </p>&ndash;&gt;
+              <p style="font-size: 22px;color: #1AFFF7;">
+                状态：在线&lt;!&ndash;<span v-if="dataForm.taskName == -1">离线</span>
+                         <span v-else>{{ filedFomatter(dataForm.taskName,taskList) }}</span>&ndash;&gt;
+
+              </p>
+            </div>-->
+            <div style="
+                display: inline-block;
+                vertical-align: top;
+                width: calc(100% - 300px);
+              ">
+              <template v-if="dataForm.deviceType == '15'">
+                <div style="height: 60px; padding: 10px 0 0 10px; overflow: auto">
+                  <div style="display: inline-block; vertical-align: top" v-html="templateInfoHtml"></div>
+                </div>
+              </template>
+              <template v-else-if="dataForm.deviceType == '26'">
+                <el-row style="
+                    min-height: 30px;
+                    font-size: 16px;
+                    padding: 20px 0 0 10px;
+                  ">
+                  <el-col :span="10">风向：{{ dataForm.direction26 }}</el-col>
+                  <el-col :span="11">风速：{{ dataForm.speed26
+                  }}<span v-show="dataForm.speed26">(m/s)</span></el-col>
+                </el-row>
+              </template>
+              <template v-else-if="dataForm.deviceType == '27'">
+                <el-row style="
+                    min-height: 30px;
+                    font-size: 16px;
+                    padding: 20px 0 0 10px;
+                  ">
+                  <el-col :span="15">co 浓度值：{{ dataForm.co27
+                  }}<span v-show="dataForm.co27">(PPM)</span></el-col>
+                  <el-col :span="9">vi 能见度：{{ dataForm.vi27
+                  }}<span v-show="dataForm.vi27"></span></el-col>
+                </el-row>
+              </template>
+              <template v-else-if="dataForm.deviceType == '28'">
+                <el-row style="
+                    min-height: 30px;
+                    font-size: 16px;
+                    padding: 20px 0 0 10px;
+                  ">
+                  <el-col :span="15">光强：{{ dataForm.light28 }}</el-col>
+                </el-row>
+              </template>
+              <template v-else-if="dataForm.deviceType == '43'">
+                <div style="min-height: 30px; font-size: 16px; padding: 20px">
+                  <p>
+                    水位高度：{{ dataForm.height43
+                    }}<span v-show="dataForm.height43">(m)</span>
+                  </p>
+                </div>
+              </template>
+              <template v-else-if="
+                dataForm.deviceType == '40' ||
+                dataForm.deviceType == '41' ||
+                dataForm.deviceType == '42'
+              ">
+                <div style="min-height: 30px; font-size: 16px; padding: 0px 20px">
+                  <p v-for="(item, index) in iotKeyData" :key="index">
+                    <span style="display: inline-block; width: 100px">
+                      {{ item.name }}
+                    </span>
+                    <span v-for="(item1, index1) in item.data" :key="index1"
+                      style="display: inline-block; width: 100px">
+                      {{ item1.name }}
+                    </span>
+                  </p>
+                </div>
+              </template>
+              <template v-else>
+                <div v-show="dataForm.taskName != -1" style="
+                    min-height: 30px;
+                    font-size: 16px;
+                    padding: 20px 0 0 10px;
+                  ">
+                  <template v-if="dataForm.deviceType == '19'">{{
+                    filedFomatter(dataForm.taskName, taskEnum['19'].taskList2)
+                  }}</template>
+                  <template v-else>{{
+                    filedFomatter(dataForm.taskName, taskList)
+                  }}</template>
+                </div>
+                <!--                <div v-show="dataForm.taskName == -1" style="min-height: 30px;font-size: 16px;padding: 20px 0 0 10px;font-size: 22px;color: #1AFFF7;">
+                  暂无反馈
+                </div>-->
+              </template>
+            </div>
+          </div>
+          <el-divider></el-divider>
+          <el-row style="min-height: 280px">
+            <el-col :span="8">
+              <p style="margin-bottom: 10px; font-size: 16px">
+                <span style="
+                    float: left;
+                    width: 10px;
+                    height: 10px;
+                    background: #2b6bb6;
+                    margin: 7px 5px 0 0;
+                  "></span>设备基本信息
+              </p>
+              <el-descriptions title="" :column="1" :labelStyle="{
+                width: '80px',
+                'text-align': 'right',
+                display: 'block',
+                color: '#D5E0EE',
+              }" :contentStyle="{ width: '95%' }">
+                <el-descriptions-item label="设备类型">{{
+                  filedFomatter(dataForm.deviceType, deviceTypeList)
+                }}</el-descriptions-item>
+                <el-descriptions-item label="所属隧道">{{
+                  filedFomatter(dataForm.area, areaList)
+                }}</el-descriptions-item>
+                <el-descriptions-item label="设备编号">{{
+                  dataForm.deviceId
+                }}</el-descriptions-item>
+                <el-descriptions-item label="物联key">{{
+                  dataForm.iotKey
+                }}</el-descriptions-item>
+                <el-descriptions-item label="modelId">{{
+                  dataForm.modelId
+                }}</el-descriptions-item>
+                <el-descriptions-item label="所属方向">{{
+                  filedFomatter(dataForm.direction, directionList)
+                }}</el-descriptions-item>
+                <el-descriptions-item label="桩号">{{
+                  dataForm.pileNumShow
+                }}</el-descriptions-item>
+                <el-descriptions-item label="桩号">{{
+                  dataForm.pileNum
+                }}</el-descriptions-item>
+                <el-descriptions-item label="断面位置">{{
+                  filedFomatter(dataForm.lane, laneList)
+                }}</el-descriptions-item>
+              </el-descriptions>
+            </el-col>
+            <el-col :span="16">
+              <div style="
+                  width: calc(100% - 20px);
+                  border-left: 2px solid rgba(70, 148, 255, 0.42);
+                  padding: 0 10px;
+                ">
+                <!-- 电伴热设备 -->
+                <div v-if="dataForm.deviceType == '47'">
+                  <p style="margin-bottom: 10px; font-size: 16px">
+                    <span style="
+                        float: left;
+                        width: 10px;
+                        height: 10px;
+                        background: #2b6bb6;
+                        margin: 7px 5px 0 0;
+                      "></span>设备控制
+                    <el-button type="primary" style="float: right; margin-right: 20px" size="mini"
+                      @click="ChangeDBRdevocte()">
+                      发送
+                    </el-button>
+                  </p>
+                  <div style="padding-left: 20px">
+                    <div v-if="iotDBRInfo.status !== '异常'"></div>
+                    <el-row style="margin-bottom: 10px;">
+                      <el-col :span="4">电伴热设备:</el-col>
+                      <el-col :span="8">
+                        <el-switch v-model="iotDBRInfo.online" active-color="#20488F" active-text="开" inactive-text="关">
+                        </el-switch>
+                      </el-col>
+
+                    </el-row>
+                  </div>
+                </div>
+
+
+
+                <div v-else-if="dataForm.deviceType == 22" style="
+                    width: 75%;
+                    height: 340px;
+                    background: black;
+                    margin-left: 5%;
+                  ">
+                  <flv-player :videoUrl="videoUrl"></flv-player>
+                </div>
+                <div v-else-if="
+                  dataForm.deviceType == 26 ||
+                  dataForm.deviceType == 27 ||
+                  dataForm.deviceType == 28 ||
+                  dataForm.deviceType == 39 ||
+                  dataForm.deviceType == 43
+                ">
+                  <p style="margin-bottom: 10px; font-size: 16px">
+                    <span style="
+                        float: left;
+                        width: 10px;
+                        height: 10px;
+                        background: #2b6bb6;
+                        margin: 7px 5px 0 0;
+                      "></span>设备控制
+                  </p>
+                  <div style="
+                      min-height: 200px;
+                      padding-bottom: 20px;
+                      padding-top: 10px;
+                    ">
+                    无
+                  </div>
+                </div>
+                <div v-else>
+                  <p style="margin-bottom: 10px; font-size: 16px">
+                    <span style="
+                        float: left;
+                        width: 10px;
+                        height: 10px;
+                        background: #2b6bb6;
+                        margin: 7px 5px 0 0;
+                      "></span>设备控制
+                    <el-button type="primary" @click="handleCommitClick(0)" size="mini"
+                      style="float: right; margin-right: 20px">发送</el-button>
+                  </p>
+                  <div style="
+                      min-height: 200px;
+                      padding-bottom: 20px;
+                      padding-top: 10px;
+                    ">
+                    <div v-if="dataForm.deviceType == '12'" style="padding-left: 20px">
+                      <el-row>
+                        <el-col :span="3">控制：</el-col>
+                        <el-col :span="21">
+                          <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                            <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                            }}</el-radio>
+                          </el-radio-group>
+                        </el-col>
+                      </el-row>
+                      <el-row style="margin-top: 5px">
+                        <el-col :span="3" style="line-height: 36px">亮度：</el-col>
+                        <el-col :span="21">
+                          <el-slider style="width: calc(100% - 100px)" v-model="dataFormBody.light"></el-slider>
+                        </el-col>
+                      </el-row>
+                    </div>
+                    <div v-else-if="dataForm.deviceType == '15'" style="padding-left: 20px">
+                      <el-row>
+                        <el-col :span="3">控制：</el-col>
+                        <el-col :span="21" class="temlCheckClass">
+                          <!--                          <div v-for="item in infoBoardTemplateList">
+                            <div style="height: 30px">
+                              <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
+                            </div>
+                          </div>-->
+                          <!-- <el-checkbox-group v-model="textInfoList">
+                            <div
+                              v-for="item in infoBoardTemplateList"
+                              :key="item.programId"
+                              style="margin-bottom: 5px"
+                            >
+                              <el-checkbox :label="item.programId">
+                                <span
+                                  @input="addComment($event, item)"
+                                  v-html="item.templateHtml"
+                                ></span
+                                ><br />
+                                <span style="color: #a8a8a8; font-size: 12px"
+                                  >宽高:{{ item.displaySize }} 
+                                  字体大小:{{ item.fontSize }} 字体颜色:{{
+                                    item.fontColor
+                                  }}</span
+                                >
+                              </el-checkbox>
+                            </div>
+                          </el-checkbox-group> -->
+                          <el-tree class="filter-tree" :data="treeData" :props="defaultProps"
+                            :filter-node-method="filterNode" ref="tree" show-checkbox @check-change="handleCheckChange"
+                            v-model="textInfoList" @check="handleCheck">
+                            <div class="custom-tree-node" slot-scope="{ node, data }">
+                              <el-tooltip :content="node.label" placement="top">
+                                <span class="label" v-if="node.level === 1">{{ data.name }}</span>
+                                <span class="label" v-if="node.level !== 1">{{ data.content }}</span>
+
+                              </el-tooltip>
+                              <br />
+                              <span style="color: #a8a8a8; font-size: 12px" v-if="node.level !== 1">高宽:{{
+                                data.displaySize }}
+                                字体大小:{{ data.fontSize }} 字体颜色:{{ getColor(data.fontColor) }}</span>
+
+                            </div>
+                          </el-tree>
+                        </el-col>
+                      </el-row>
+                    </div>
+                    <div v-else-if="
+                      dataForm.deviceType == '40' ||
+                      dataForm.deviceType == '41' ||
+                      dataForm.deviceType == '42'
+                    " style="padding-left: 20px">
+                      <div style="float: left; width: 35%">
+                        <el-row>
+                          <el-col :span="5">设备：</el-col>
+                          <el-col :span="19">
+                            <el-checkbox-group v-model="dataForm.iotKeys">
+                              <el-checkbox v-for="item in iotKeyList" v-show="item.show" :label="item.id"
+                                :key="item.id">{{
+                                  item.name }}</el-checkbox>
+                            </el-checkbox-group>
+                          </el-col>
+                        </el-row>
+                      </div>
+                      <div style="float: left; width: 55%">
+                        <el-row>
+                          <el-col :span="5">控制：</el-col>
+                          <el-col :span="19">
+                            <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                              <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                              }}</el-radio>
+                            </el-radio-group>
+                          </el-col>
+                        </el-row>
+                      </div>
+                    </div>
+                    <div v-else-if="13" style="padding-left: 20px">
+                      <el-row>
+                        <el-col :span="3">控制：</el-col>
+                        <el-col :span="21">
+                          <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                            <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                            }}</el-radio>
+                          </el-radio-group>
+                        </el-col>
+                      </el-row>
+                    </div>
+
+
+
+                    <div v-else style="padding-left: 20px">
+                      <el-row>
+                        <el-col :span="3">控制2：</el-col>
+                        <el-col :span="21">
+                          <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                            <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                            }}</el-radio>
+                          </el-radio-group>
+                        </el-col>
+                      </el-row>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+
+        <!--        <span slot="footer" class="dialog-footer">
+          <el-button @click="deviceDialogVisible = false" size="small">取 消</el-button>
+          <el-button type="primary" @click="addOrUpdateSub" size="small">确 定</el-button>
+        </span>-->
+      </el-dialog>
+
+      <transition name="el-zoom-in-top">
+        <div class="control-item" v-show="deviceControlShow && !main2DShow">
+          <div style="
+              padding: 15px 20px 0px;
+              height: 25px;
+              line-height: 35px;
+              font-size: 16px;
+            ">
+            <div style="float: left">
+              <span style="
+                  float: left;
+                  width: 10px;
+                  height: 10px;
+                  background: #2b6bb6;
+                  margin: 14px 5px 0 0;
+                "></span>{{ addOrUpdateTitle }}
+            </div>
+            <div @click="deviceClose" style="
+                float: right;
+                width: 20px;
+                text-align: center;
+                cursor: pointer;
+              ">
+              X
+            </div>
+          </div>
+          <div style="margin: 10px 20px; border-bottom: 1px solid #4694ff33"></div>
+          <div style="
+              padding: 0 20px 20px;
+              width: calc(100% - 40px);
+              height: calc(100% - 80px);
+            ">
+            <div style="width: 100%; height: 100%; overflow: auto">
+              <div v-show="deviceLoading" style="
+                  position: absolute;
+                  z-index: 9999;
+                  left: calc(50% - 60px);
+                  top: 48%;
+                  background: #ce811b;
+                  padding: 10px 20px;
+                  border-radius: 5px;
+                ">
+                正在发送指令...
+              </div>
+              <div v-loading="deviceLoading" element-loading-text="" element-loading-spinner="el-icon-loading"
+                element-loading-background="rgba(0, 0, 0, 0.5)">
+                <div v-show="dataForm.deviceType != 22" style="min-height: 60px; color: #1afff7">
+                  <div style="
+                      display: inline-block;
+                      vertical-align: top;
+                      width: 100%;
+                    ">
+                    <template v-if="dataForm.deviceType == '15'">
+                      <div style="height: 60px; padding-left: 10px; overflow: auto">
+                        <div style="display: inline-block; vertical-align: top" v-html="templateInfoHtml"></div>
+                      </div>
+                    </template>
+                    <template v-else-if="dataForm.deviceType == '26'">
+                      <el-row style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <el-col :span="10">风向：{{ dataForm.direction26 }}</el-col>
+                        <el-col :span="11">风速：{{ dataForm.speed26
+                        }}<span v-show="dataForm.speed26">(m/s)</span></el-col>
+                      </el-row>
+                    </template>
+                    <template v-else-if="dataForm.deviceType == '27'">
+                      <el-row style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <el-col :span="15">co 浓度值：{{ dataForm.co27
+                        }}<span v-show="dataForm.co27">(PPM)</span></el-col>
+                        <el-col :span="9">vi 能见度：{{ dataForm.vi27
+                        }}<span v-show="dataForm.vi27"></span></el-col>
+                      </el-row>
+                    </template>
+                    <template v-else-if="dataForm.deviceType == '28'">
+                      <el-row style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <el-col :span="15">光强：{{ dataForm.light28 }}</el-col>
+                      </el-row>
+                    </template>
+                    <template v-else-if="dataForm.deviceType == '43'">
+                      <div style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <p>
+                          水位高度：{{ dataForm.height43
+                          }}<span v-show="dataForm.height43">(m)</span>
+                        </p>
+                      </div>
+                    </template>
+                    <template v-else-if="
+                      dataForm.deviceType == '40' ||
+                      dataForm.deviceType == '41' ||
+                      dataForm.deviceType == '42'
+                    ">
+                      <div style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <p v-for="(item, index) in iotKeyData" :key="index">
+                          <span style="display: inline-block; width: 100px">
+                            {{ item.name }}
+                          </span>
+                          <span v-for="(item1, index1) in item.data" :key="index1"
+                            style="display: inline-block; width: 100px">
+                            {{ item1.name }}
+                          </span>
+                        </p>
+                      </div>
+                    </template>
+                    <template v-else>
+                      <div v-show="dataForm.taskName != -1" style="
+                          min-height: 30px;
+                          font-size: 16px;
+                          padding-left: 10px;
+                        ">
+                        <template v-if="dataForm.deviceType == '19'">{{
+                          filedFomatter(
+                            dataForm.taskName,
+                            taskEnum['19'].taskList2
+                          )
+                        }}</template>
+                        <template v-else>{{
+                          filedFomatter(dataForm.taskName, taskList)
+                        }}</template>
+                      </div>
+                      <!--                <div v-show="dataForm.taskName == -1" style="min-height: 30px;font-size: 16px;padding: 20px 0 0 10px;font-size: 22px;color: #1AFFF7;">
+                                        暂无反馈
+                                      </div>-->
+                    </template>
+                  </div>
+                </div>
+
+                <div class="item-frame">
+                  <div class="item-frame-title">设备基本信息</div>
+                  <div style="padding: 20px">
+                    <el-descriptions title="" :column="1" :labelStyle="{
+                      width: '60px',
+                      'text-align': 'right',
+                      display: 'block',
+                      color: '#D5E0EE',
+                    }" :contentStyle="{ width: '95%' }">
+                      <el-descriptions-item label="设备类型">{{
+                        filedFomatter(dataForm.deviceType, deviceTypeList)
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="所属隧道">{{
+                        filedFomatter(dataForm.area, areaList)
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="设备编号">{{
+                        dataForm.deviceId
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="物联key">{{
+                        dataForm.iotKey
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="modelId">{{
+                        dataForm.modelId
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="所属方向">{{
+                        filedFomatter(dataForm.direction, directionList)
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="桩号">{{
+                        dataForm.pileNumShow
+                      }}</el-descriptions-item>
+                      <el-descriptions-item label="断面位置">{{
+                        filedFomatter(dataForm.lane, laneList)
+                      }}</el-descriptions-item>
+                    </el-descriptions>
+                  </div>
+                </div>
+                <div class="item-frame" style="margin-top: 20px">
+                  <div class="item-frame-title">设备控制</div>
+                  <div style="padding: 20px">
+                    <div v-if="dataForm.deviceType == 22" style="
+                        width: 75%;
+                        height: 340px;
+                        background: black;
+                        margin-left: 5%;
+                      ">
+                      <flv-player :videoUrl="videoUrl"></flv-player>
+                    </div>
+                    <div v-else-if="
+                      dataForm.deviceType == 26 ||
+                      dataForm.deviceType == 27 ||
+                      dataForm.deviceType == 28 ||
+                      dataForm.deviceType == 39 ||
+                      dataForm.deviceType == 43
+                    ">
+                      <div style="
+                          min-height: 200px;
+                          padding-bottom: 20px;
+                          padding-top: 10px;
+                        ">
+                        无
+                      </div>
+                    </div>
+                    <div v-else style="position: relative">
+                      <el-button type="primary" @click="handleCommitClick(0)" size="mini"
+                        style="position: absolute; right: 0px; top: -20px">发送</el-button>
+                      <div style="
+                          min-height: 100px;
+                          padding-bottom: 20px;
+                          padding-top: 10px;
+                        ">
+                        <div v-if="dataForm.deviceType == '12'">
+                          <el-row>
+                            <el-col :span="4">控制：</el-col>
+                            <el-col :span="20">
+                              <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                                <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                                }}</el-radio>
+                              </el-radio-group>
+                            </el-col>
+                          </el-row>
+                          <el-row style="margin-top: 5px">
+                            <el-col :span="4" style="line-height: 36px">亮度：</el-col>
+                            <el-col :span="20">
+                              <el-slider style="width: calc(100% - 100px)" v-model="dataFormBody.light"></el-slider>
+                            </el-col>
+                          </el-row>
+                        </div>
+                        <div v-else-if="dataForm.deviceType == '15'">
+                          <el-row>
+                            <el-col :span="4">控制：</el-col>
+                            <el-col :span="20" class="temlCheckClass">
+                              <!--                          <div v-for="item in infoBoardTemplateList">
+                                                          <div style="height: 30px">
+                                                            <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
+                                                          </div>
+                                                        </div>-->
+                              <!-- <el-checkbox-group v-model="textInfoList">
+                                <div
+                                  v-for="item in infoBoardTemplateList"
+                                  :key="item.id"
+                                  style="margin-bottom: 5px"
+                                >
+                                  <el-checkbox :label="item.id">
+                                    <span
+                                      @input="addComment($event, item)"
+                                      v-html="item.templateHtml"
+                                    ></span
+                                    ><br />
+                                    <span
+                                      style="color: #a8a8a8; font-size: 12px"
+                                      >宽:{{ item.cmsWidth }} 高:{{
+                                        item.cmsHeight
+                                      }}
+                                      字体大小:{{ item.fontSize }} 字体颜色:{{
+                                        item.fontColor
+                                      }}</span>
+                                  </el-checkbox>
+                                </div>
+                              </el-checkbox-group> -->
+                            </el-col>
+                          </el-row>
+                        </div>
+                        <div v-else-if="
+                          dataForm.deviceType == '40' ||
+                          dataForm.deviceType == '41' ||
+                          dataForm.deviceType == '42'
+                        ">
+                          <div style="float: left; width: 35%">
+                            <el-row>
+                              <el-col :span="4">设备：</el-col>
+                              <el-col :span="20">
+                                <el-checkbox-group v-model="dataForm.iotKeys">
+                                  <el-checkbox v-for="item in iotKeyList" v-show="item.show" :label="item.id"
+                                    :key="item.id">{{
+                                      item.name }}</el-checkbox>
+                                </el-checkbox-group>
+                              </el-col>
+                            </el-row>
+                          </div>
+                          <div style="float: left; width: 55%">
+                            <el-row>
+                              <el-col :span="4">控制：</el-col>
+                              <el-col :span="20">
+                                <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                                  <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                                  }}</el-radio>
+                                </el-radio-group>
+                              </el-col>
+                            </el-row>
+                          </div>
+                        </div>
+
+                        <div v-else>
+                          <el-row>
+                            <el-col :span="4">控制：</el-col>
+                            <el-col :span="20">
+                              <el-radio-group v-model="dataForm.command" style="padding-top: 3px">
+                                <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name
+                                }}</el-radio>
+                              </el-radio-group>
+                            </el-col>
+                          </el-row>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </transition>
+
+      <el-dialog top="8vh" style="pointer-events: auto" title="设备" :visible.sync="deviceDialogVisible2" width="1000px"
+        :close-on-click-modal="false" v-if="deviceDialogVisible2" @close="deviceClose">
+        <el-row>
+          <el-col :span="14" style="border-right: 1px solid #cccccc">
+            <el-table size="small" :data="deviceData2" height="500px" @selection-change="handleSelectionChange"
+              style="width: 100%">
+              <el-table-column type="selection" width="55"> </el-table-column>
+              <el-table-column prop="deviceType" label="设备类型" :formatter="(row) => filedFomatter(row.deviceType, deviceTypeList)
+                ">
+              </el-table-column>
+              <el-table-column prop="deviceId" label="设备编号" show-overflow-tooltip>
+              </el-table-column>
+              <el-table-column prop="pileNumShow" label="桩号" show-overflow-tooltip>
+              </el-table-column>
+              <el-table-column prop="direction" label="方向" :formatter="(row) => filedFomatter(row.direction, directionList)
+                " show-overflow-tooltip>
+              </el-table-column>
+              <el-table-column prop="task" label="状态" show-overflow-tooltip>
+                <template slot-scope="scope">
+                  <span v-if="scope.row.task">
+                    <span v-if="JSON.parse(scope.row.task).command != -1">
+                      <template v-if="scope.row.deviceType == '19'">{{
+                        filedFomatter(
+                          JSON.parse(scope.row.task).command,
+                          taskEnum['19'].taskList2
+                        )
+                      }}</template>
+                      <template v-else>{{
+                        filedFomatter(
+                          JSON.parse(scope.row.task).command,
+                          taskList
+                        )
+                      }}</template>
+                    </span>
+                  </span>
+                </template>
+              </el-table-column>
+              <!--              <el-table-column
+                  fixed="right"
+                  label="操作"
+                  width="80">
+                <template slot-scope="scope">
+
+                  <el-button @click="handleClick(scope.row)" type="text">控制</el-button>
+
+                </template>
+              </el-table-column>-->
+            </el-table>
+          </el-col>
+          <el-col :span="10" v-show="controlShow" style="padding-left: 5px">
+            <p style="margin-bottom: 10px; font-size: 16px">
+              <span style="
+                  float: left;
+                  width: 10px;
+                  height: 10px;
+                  background: #2b6bb6;
+                  margin: 7px 5px 0 0;
+                "></span>批量控制
+              <el-button type="primary" @click="handleCommitClick(1)" size="mini"
+                style="float: right; margin-right: 20px">发送</el-button>
+            </p>
+            <div v-loading="deviceLoading" element-loading-text="正在发送指令..." element-loading-spinner="el-icon-loading"
+              element-loading-background="rgba(0, 0, 0, 0.5)"
+              style="padding-bottom: 20px; margin-top: 15px; min-height: 100px">
+              <div v-if="dataForm.deviceType == '12'" style="padding-left: 20px">
+                <el-row>
+                  <el-col :span="3">控制：</el-col>
+                  <el-col :span="21">
+                    <el-radio-group v-model="dataForm.command">
+                      <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name }}</el-radio>
+                    </el-radio-group>
+                  </el-col>
+                </el-row>
+                <el-row style="margin-top: 5px">
+                  <el-col :span="3" style="line-height: 36px">亮度：</el-col>
+                  <el-col :span="21">
+                    <el-slider style="width: calc(100% - 100px)" v-model="dataFormBody.light"></el-slider>
+                  </el-col>
+                </el-row>
+              </div>
+              <div v-else-if="dataForm.deviceType == '15'" style="padding-left: 20px">
+                <el-row>
+                  <el-col :span="3">控制：</el-col>
+                  <el-col :span="21" class="temlCheckClass">
+                    <!--                          <div v-for="item in infoBoardTemplateList">
+                                                <div style="height: 30px">
+                                                  <p style="float: left"><el-radio v-model="dataFormBody.templateId" :label="item.id"><span></span></el-radio></p><p style="float: left" @input="addComment($event,item)" v-html="item.templateHtml"></p>
+                                                </div>
+                                              </div>-->
+                    <!-- <el-checkbox-group v-model="textInfoList">
+                      <div
+                        v-for="item in infoBoardTemplateList"
+                        :key="item.id"
+                        style="margin-bottom: 5px"
+                      >
+                        <el-checkbox :label="item.id">
+                          <span
+                            @input="addComment($event, item)"
+                            v-html="item.templateHtml"
+                          ></span
+                          ><br />
+                          <span style="color: #a8a8a8; font-size: 12px"
+                            >宽:{{ item.cmsWidth }} 高:{{
+                              item.cmsHeight
+                            }}
+                            字体大小:{{ item.fontSize }} 字体颜色:{{
+                              item.fontColor
+                            }}</span
+                          >
+                        </el-checkbox>
+                      </div>
+                    </el-checkbox-group> -->
+                    <el-tree class="filter-tree" :data="treeData" :props="defaultProps" :filter-node-method="filterNode"
+                      ref="tree" show-checkbox @check-change="handleCheckChange" v-model="textInfoList"
+                      @check="handleCheck">
+                      <div class="custom-tree-node" slot-scope="{ node, data }">
+                        <el-tooltip :content="node.label" placement="top">
+                          <span class="label" v-if="node.level === 1">{{ data.name }}</span>
+                          <span class="label" v-if="node.level !== 1">{{ data.content }}</span>
+
+                        </el-tooltip>
+                        <br />
+                        <span style="color: #a8a8a8; font-size: 12px;" v-if="node.level !== 1">高宽:{{ data.displaySize }}
+                        </span>
+                        <span style="color: #a8a8a8; font-size: 12px;" v-if="node.level !== 1">
+                          大小:{{ data.fontSize }} 颜色:{{ getColor(data.fontColor) }}</span>
+
+                      </div>
+                    </el-tree>
+                  </el-col>
+                </el-row>
+              </div>
+
+              <div v-else style="padding-left: 20px">
+                <el-row>
+                  <el-col :span="3">控制：</el-col>
+                  <el-col :span="21">
+                    <el-radio-group v-model="dataForm.command">
+                      <el-radio :label="item.id" v-for="item in taskList" :key="item.id">{{ item.name }}</el-radio>
+                    </el-radio-group>
+                  </el-col>
+                </el-row>
+              </div>
+            </div>
+          </el-col>
+        </el-row>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+import cookies from 'js-cookie'
+var dataList = {}
+import {
+  addOrModDevice,
+  iotControl,
+  newIotControl,
+  newIotControlS,
+  playManuallyTriggered,
+  getIotDeviceStatus,
+  getDbrIotDeviceList,
+  deviceList,
+  deviceList1,
+  batchControl,
+  deviceStatus,
+  infoBoardTemplateList,
+  warnList,
+  statsticWhole,
+  getPlayAddressByPid,
+  deviceStatusBatch,
+  changeDbrIotDeviceStatus,
+  planList,
+} from '@/api'
+import { dateTimeFormat, filedFomatter } from '../../utils/utils'
+import FlvPlayer from '@/components/FlvPlayer.vue'
+import { connectWebsocket } from '@/utils/websocket'
+import {
+  addBroadcast,
+  flowStatistic,
+  getEmployeeList,
+  getMediaList,
+  latestWarnList,
+  planDetail,
+  planExecute,
+  verify,
+  getProgramTree
+} from '../../api'
+import { tunnelLeftList, tunnelRightList } from '../../utils/pathJson'
+
+export default {
+  name: 'index',
+  components: {
+    FlvPlayer,
+  },
+  data() {
+    return {
+      // 电伴热设备列表
+      iotDBRInfo: {},
+      nowTime: '',
+      searchForm: {
+        area: '2',
+        editable: '2',
+      },
+      treeData: [],
+      filterText: "",
+      areaList: window.config.areaList,
+      deviceTypeList: window.config.deivceTypeList,
+      deviceTypeList1: [
+        { id: '11', name: '风机' },
+        { id: '13', name: '车道指示灯' },
+        { id: '14', name: '交通信号灯' },
+        { id: '15', name: '情报板' },
+        { id: '19', name: '卷帘门' },
+        { id: '21', name: '消防水池' },
+        { id: '25', name: '微波车辆检测器' },
+        { id: '26', name: '风速风向' },
+        { id: '27', name: '一氧化碳能见度' },
+        { id: '28', name: '光强传感器' },
+        { id: '39', name: '配电房' },
+        { id: '40', name: '消防泵房' },
+        { id: '41', name: '污水泵房' },
+        { id: '42', name: '雨水泵房' },
+        { id: '45', name: '可变限速标志' },
+      ],
+      laneList: window.config.laneList,
+      directionList: window.config.directionList,
+      statusList: window.config.statusList,
+      colorList: [
+        { id: 'c255000000000', name: '红' },
+        { id: 'c255255000000', name: '黄' },
+        { id: 'c000255000000', name: '绿' },
+      ],
+      warnTypeList: window.config.warnTypeList,
+      warnStatusList: window.config.warnStatusList,
+      deviceBarTypeList: [
+        { id: '15', name: '情报板' },
+        { id: '11', name: '风机' },
+        { id: '13', name: '车道指示灯' },
+        { id: '14', name: '交通信号灯' },
+        { id: '19', name: '卷帘门' },
+        { id: '40', name: '消防泵房' },
+        { id: '41', name: '污水泵房' },
+        /*{id: '16', name: '报警器'},*/
+        // {
+        //   id: '17',
+        //   name: '广播电话系统',
+        //   url: window.config.typeUrlLink['17'],
+        // },
+        // { id: '12', name: '照明系统', url: window.config.typeUrlLink['12'] }
+        // ,
+      ],
+      taskEnum: window.config.taskEnum,
+      totalWidth: 1562,
+      totalHeight: 560,
+      // 保存拖拽的元素的列表
+      componentsList: [],
+      componentsOldList: [],
+      deviceId: '', // 当前项的 唯一标识
+      curControl: null, //
+      warnControl: null,
+      flag: '',
+      containerMoveObj: {
+        type: '',
+        x: '',
+        y: '',
+      },
+      scale: 1,
+
+      dataForm: {},
+      dataFormBody: {},
+      deviceDialogVisible: false,
+      addOrUpdateTitle: '',
+      rules: {
+        deviceId: [{ required: true, message: '请输入', trigger: 'blur' }],
+        deviceType: [{ required: true, message: '请选择', trigger: 'change' }],
+      },
+      pileNumMap: {
+        1: {
+          //   left: 'K30+600',
+          //   right: 'K34+800',
+          left: 'K33+327',
+          right: 'K37+527',
+          //   length1: '4000',
+          //   length2: '2616',
+          length1: '2616',
+          length2: '2606',
+          width: 5000,
+          pileNumData: ['K33+747', 'K37+107'],
+          n: 10,
+        },
+        2: {
+          //   left: 'K58+176',
+          //   right: 'K60+976',
+          left: 'K60+903',
+          right: 'K63+703',
+          length1: '2200',
+          length2: '2200',
+          width: 5000,
+          pileNumData: ['K61+203', 'K63+403'],
+          n: 10,
+        },
+        // 1: {
+        //   left: 'K9+720',
+        //   right: 'K11+076',
+        //   length1: '960',
+        //   length2: '624',
+        //   width: 1893,
+        //   pileNumData: ['K9+933', 'K10+595'],
+        // },
+        // 2: {
+        //   left: 'K16+650',
+        //   right: 'K18+150',
+        //   length1: '965.647',
+        //   length2: '965.647',
+        //   width: 1993,
+        //   pileNumData: ['K17+015', 'K17+935'],
+        // },
+        // 3: {
+        //   left: 'K18+220',
+        //   right: 'K21+250',
+        //   length1: '2897.232',
+        //   length2: '2897.232',
+        //   width: 6000,
+        //   pileNumData: ['K18+302', 'K20+990'],
+        // },
+      },
+      pileNumList: [],
+      deviceForm: {},
+
+      warnShow: true,
+      planShow: false,
+      planList: [],
+      planDetailShow: false,
+      warnDetailShow: false,
+      planForm: {},
+      planDetailData: [],
+      planDetailMap: {
+        11: [],
+        13: [],
+        14: [],
+        15: [],
+        19: [],
+      },
+      deviceRunShow: false,
+      main2DShow: true,
+      deviceType: '',
+
+      marks: 10, // 刻度的数量
+      markWidth: 100, // 每个刻度的宽度
+
+      deviceData: [],
+      taskList: [],
+      deviceData2: [],
+      deviceDialogVisible2: false,
+      infoBoardTemplateList: [],
+      textInfoList: [],
+      tempMap: {},
+      controlShow: false,
+      multipleSelection: [],
+      warnList: [{
+        id: '1',
+        status: 1,
+        type: ''
+      }, {
+        id: '2',
+        status: 2,
+        type: ''
+      }],
+      componentsWarnList: [],
+      statusTimer: null,
+      deviceLoading: false,
+      warnMap: {},
+      templateHtmlList: [],
+      templateInfoHtml: '',
+      statsticInfo: {
+        warn_count_done: 0,
+        device_error: 0,
+        warn_count_todo: 0,
+        device_count: 0,
+      },
+      videoForm: window.config.videoForm,
+      videoUrl: '',
+      iotKeyList: [],
+      iotKeyData: [],
+      warnForm: {},
+      planLoading: false,
+      planSuccess: false,
+      planDeviceType: ['14', '13', '11', '15', '19'],
+      defaultProps: {
+        children: "children",
+        label: "name",
+        name: "name",
+        content: "content",
+        // displaySize: "displaySize",
+      },
+      listMedia: [
+        /*{
+          id:20,
+          "name":"1前方隧道施工，请按车道指示灯行驶",
+          "path":"/soft/upload/audio/e5ccbd29-3788-4480-9d83-8ad0a5d5a320.mp3",
+          "type":1
+        },
+        {
+          id:4,
+          "name":"1前方隧道施工",
+          "path":"/soft/upload/audio/36ebd0f5-4c3a-4585-8d25-3afa9f3dc7ca.mp3",
+          "type":1
+        }*/
+      ],
+      mediaObj: null,
+      templateObj: '',
+      deviceControlShow: false,
+      deviceIds15: [],
+      deviceIds: [],
+      deviceDataId: [],
+      patrolShow: false,
+    }
+  },
+  mounted() {
+    console.log(this.$route.params.area, this.$route, 'xxxxxxx');
+    if (this.$route.params.area) {
+
+      this.searchForm.area = this.$route.params.area
+    }
+    this.init()
+    this.handleLinkClient()
+  },
+  methods: {
+    //  改变电伴热设备状态
+    async ChangeDBRdevocte() {
+      if (this.iotDBRInfo.status == '异常' || !this.iotDBRInfo.device_id) {
+        this.$message.warning('设备异常，不能操作')
+        return
+      }
+      console.log(this.iotDBRInfo.online, '开关状态');
+      let res = await changeDbrIotDeviceStatus({
+        device_id: this.iotDBRInfo.device_id,
+        action: this.iotDBRInfo.online ? 'open' : 'close',
+      })
+      if (res?.data?.message) {
+        this.$message.success(res.data.message)
+      }
+    },
+
+
+    dateTimeFormat,
+    init() {
+      var that = this
+      //sessionStorage.setItem("indexBreadcrumbList", JSON.stringify(["/control","/"]))
+      setInterval(() => {
+        that.nowTime = that.getNowTime()
+      }, 1000)
+
+      that.loadWarnList()
+      that.warnTimer = setInterval(() => {
+        that.loadWarnList()
+      }, 15000)
+
+      setTimeout(() => {
+        if (that.warnList.length > 0) {
+          that.warnShow = true
+        } else {
+          that.warnShow = false
+        }
+        that.tunnelClick(this.searchForm.area)
+      }, 400)
+      that.statsticWhole()
+    },
+    scrollClick(index) {
+      var that = this
+      if (index == 1) {
+        that.$refs.scrollContainer.scrollLeft =
+          that.$refs.scrollContainer.scrollLeft - 800
+      } else {
+        that.$refs.scrollContainer.scrollLeft =
+          that.$refs.scrollContainer.scrollLeft + 800
+      }
+    },
+    statsticWhole() {
+      var that = this
+      statsticWhole().then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.statsticInfo['warn_count_done'] =
+              res.data.result.warn_count_done
+            that.statsticInfo['device_count'] = res.data.result.device_count
+            that.statsticInfo['device_error'] = res.data.result.device_error
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    tunnelClick(id) {
+      var that = this
+      /*if(that.searchForm.area == id){
+        return;
+      }*/
+      that.searchForm.area = id
+      that.loadWarnMarker(that.warnMap[that.searchForm.area])
+      if (!that.main2DShow) {
+        that.main2DShow = true
+        that.deviceClose()
+      }
+
+      var form = that.pileNumMap[that.searchForm.area]
+      var km1 = form.left.replace('K', '').replace('+', '.')
+      var km2 = form.right.replace('K', '').replace('+', '.')
+      console.log('form', form)
+      var num = that.pileNumMap[that.searchForm.area].n
+      var average = (Number(km2) - Number(km1)) / num
+      that.pileNumList = []
+      for (var i = 0; i < num; i++) {
+        let a = (Number(km1) + i * average).toFixed(3)
+        that.pileNumList.push('K' + a.replace('.', '+'))
+      }
+      that.pileNumList.push(form.right)
+      /*var a = (Number(km1) + average).toFixed(3)
+      that.pileNumList = [form.left,'K'+a.replace(".", "+"),form.right]*/
+      console.log('that.pileNumList', that.pileNumList)
+      that.scale = (form.width - 304) / 1000 / (Number(km2) - Number(km1))
+      that.loadTable()
+
+      flowStatistic({ area: that.searchForm.area }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.liuliangLine(res.data.result)
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    loadTable() {
+      var that = this
+      deviceList1(that.searchForm).then((res) => {
+        console.log(res, 'reeessss')
+        if (res.status == 200) {
+          // if (res.data.retCode == 0) {
+          that.tableData = res.data.data
+          console.log(that.tableData, 'ttttttttttttttt')
+          that.loadMarker()
+
+          that.deviceDataId = []
+          that.tableData.forEach((item) => {
+            if (
+              item.deviceType == '11' ||
+              item.deviceType == '13' ||
+              item.deviceType == '14'
+            ) {
+              that.deviceDataId.push(item.deviceId)
+            }
+          })
+          that.dataForm.deviceId = that.deviceDataId.toString()
+          if (that.warnShow) {
+            clearTimeout(that.statusTimer)
+            that.statusTimer = null
+          } else {
+            that.deviceStatusBatch()
+          }
+        } else {
+          that.$message.warning(res.data.message)
+        }
+        // }
+      })
+    },
+    loadMarker() {
+      var that = this
+      that.componentsList = []
+      that.componentsOldList = []
+      that.deviceIdOptions = []
+      that.tableData.forEach((item, index) => {
+        // console.log(item, 'iiittteeemmm')
+        if (item.pileNum) {
+          var json = item
+          let imgForm = window.config.drapLeftElMap[item.deviceType]
+          if (!imgForm) {
+            return
+          }
+          that.deviceIdOptions.push(item.deviceId)
+          json.imgUrl =
+            item.deviceType == 13
+              ? imgForm['url' + item.direction]
+              : imgForm.url
+          var x = 0,
+            y = 0
+          if (item.deviceType == 13) {   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
+            console.log(item, item.direction, 'xxxxxxxxxx')
+            if (item.direction == 2) { //下行
+              if (item.rotationDirection == null || item.rotationDirection == '正向通行') {
+                json.imgUrl = './lib/icon/132.png'
+              } else if (item.rotationDirection == '反向通行') {
+                json.imgUrl = './lib/icon/131.png'
+              } else if (item.rotationDirection == '封道') {
+                json.imgUrl = './lib/icon/133.png'
+              } else if (item.rotationDirection == '正向左转') {
+                json.imgUrl = './lib/icon/135.png'
+              }
+              //   else if(item.rotationDirection == '反向左转'){
+              //     json.imgUrl = './lib/icon/135.png'
+              //   }
+            } else if (item.direction == 1) { //上行
+              if (item.rotationDirection == null || item.rotationDirection == '正向通行') {
+                json.imgUrl = './lib/icon/131.png'
+              } else if (item.rotationDirection == '反向通行') {
+                json.imgUrl = './lib/icon/132.png'
+              } else if (item.rotationDirection == '封道') {
+                json.imgUrl = './lib/icon/133.png'
+              } else if (item.rotationDirection == '正向左转') {
+                json.imgUrl = './lib/icon/134.png'
+              }
+              //   else if(item.rotationDirection == '反向左转'){
+              //     json.imgUrl = './lib/icon/134.png'
+              //   }
+            }
+          }
+          //风机
+          if (item.deviceType == 11) {   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
+            // console.log(item,item.direction,'xxxxxxxxxx')
+            if (item.direction == 2) { //下行
+              if (item.rotationDirection == null || item.rotationDirection == '正转') {
+                json.imgUrl = './lib/icon/111.gif'
+              } else if (item.rotationDirection == '反转') {
+                json.imgUrl = './lib/icon/112.gif'
+              } else if (item.rotationDirection == '停止') {
+                json.imgUrl = './lib/icon/11.png'
+              }
+              console.log("json.imgUrl", json.imgUrl)
+
+            } else if (item.direction == 1) { //上行
+              if (item.rotationDirection == null || item.rotationDirection == '正转') {
+                json.imgUrl = './lib/icon/111.gif'
+              } else if (item.rotationDirection == '反转') {
+                json.imgUrl = './lib/icon/112.gif'
+              } else if (item.rotationDirection == '停止') {
+                json.imgUrl = './lib/icon/11.png'
+              }
+              console.log("json.imgUrl", json.imgUrl)
+            }
+          }
+          //交通信号灯
+          if (item.deviceType == 14) {   //车道指示灯 根据状态 展示不同方向的图片  direction  2是下行左箭头 1是上行右箭头
+            // console.log(item,item.direction,'xxxxxxxxxx')
+            if (item.direction == 2) { //下行
+              if (item.rotationDirection == null || item.rotationDirection == '变绿灯') {
+                json.imgUrl = './lib/icon/143.png'
+              } else if (item.rotationDirection == '变黄灯') {
+                json.imgUrl = './lib/icon/142.png'
+              } else if (item.rotationDirection == '变红灯') {
+                json.imgUrl = './lib/icon/141.png'
+              }
+
+            } else if (item.direction == 1) { //上行
+              if (item.rotationDirection == null || item.rotationDirection == '变绿灯') {
+                json.imgUrl = './lib/icon/143.png'
+              } else if (item.rotationDirection == '变黄灯') {
+                json.imgUrl = './lib/icon/142.png'
+              } else if (item.rotationDirection == '变红灯') {
+                json.imgUrl = './lib/icon/141.png'
+              }
+            }
+          }
+          json.position = {
+            x: 0,
+            y: 0,
+            w: imgForm.w,
+            h: imgForm.h,
+            bg: '#fff',
+          }
+          let km = item.pileNumShow.replace('K', '').replace('+', '.')
+          let km1 = that.pileNumMap[that.searchForm.area].left
+            .replace('K', '')
+            .replace('+', '.')
+          let subtract = Number(km) - Number(km1)
+          json.position.x = subtract * 1000 * that.scale - imgForm.w / 2
+          x = subtract * 1000 * that.scale - imgForm.w / 2
+          if (item.lane == 0) {
+            json.position.y = 265 - imgForm.h / 2
+            y = 265 - imgForm.h / 2
+          } else {
+            if (item.direction == '2') {
+              let newLane = that.distanceFromNine(Number(item.lane))
+              json.position.y = newLane * 24 + 13 - imgForm.h / 2
+              y = newLane * 24 + 13 - imgForm.h / 2
+            } else {
+              json.position.y = item.lane * 24 + 271 - imgForm.h / 2
+              y = item.lane * 24 + 271 - imgForm.h / 2
+            }
+          }
+          json.temp = {
+            position: {
+              x: x,
+              y: y,
+            },
+          }
+
+          json.opacity = 1
+
+          json.zIndex = 4
+          if (item.deviceType == '15' || item.deviceType == '51') {
+            json.zIndex = 3
+          } else if (item.deviceType == '55' || item.deviceType == '56') {
+            json.zIndex = 2
+          }
+          // console.log(json, 'ooooooooooooooooooooooooooooooooooooooo')
+          if (item.task) {
+            var j = JSON.parse(item.task)
+            if (item.deviceType == '11') {
+              if (j.command != -1) {
+                json.imgUrl = imgForm['url' + j.command]
+              }
+            } else if (item.deviceType == '13') {
+              if (j.command != -1) {
+                json.imgUrl =
+                  imgForm['url' + item.direction + '' + item.direction][
+                  j.command
+                  ]
+              }
+            } else if (item.deviceType == '14') {
+              if (j.command != -1) {
+                json.imgUrl = imgForm['urls'][j.command]
+              }
+            }
+            console.log(json, 'jjjjjjjjjjjjjjjjjjjjjjjjjj')
+            if (j.body) {
+              var b = JSON.parse(j.body)
+              if (item.deviceType == '12') {
+                //that.$set(that.dataForm, 'light', b.light)
+                json.opacity = b.light / 100
+              } /*else if (item.deviceType == '15') {
+                infoBoardTemplateList().then(res => {
+                  if (res.status == 200) {
+                    if (res.data.retCode == 0) {
+
+                      res.data.result.forEach((item,i)=>{
+                        if(item.id == b.templateId){
+                          json.content = that.domRender(item.textInfo,b.value,item.id,1)
+                        }
+                      })
+                    } else {
+                      that.$message.warning(res.data.message);
+                    }
+                  }
+                })
+              }*/
+            }
+          }
+          that.componentsOldList.push(json)
+        }
+      })
+      setTimeout(() => {
+        that.componentsList = JSON.parse(JSON.stringify(that.componentsOldList))
+        console.log(that.componentsList, 'that.componentsList')
+      }, 1000)
+    },
+
+    deviceTypeClick(item) {
+      console.log('pppppppppppppppppppp', item)
+      var that = this
+      that.deviceClose()
+      if (item.id == '12' || item.id == '17') {
+        window.open(item.url)
+        return
+      }
+      that.controlShow = false
+      that.dataForm = {
+        deviceType: item.id,
+      }
+      that.dataFormBody = {}
+      if (that.dataForm.deviceType == '15') {
+        that.loadinfoBoardTemplate(0)
+        /*infoBoardTemplateList().then(res => {
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              res.data.result.forEach((item,i)=>{
+                var form = {
+                  ...item,
+                  templateHtml:that.domRender(item.textInfo),
+                }
+                that.infoBoardTemplateList.push(form)
+              })
+            } else {
+              that.$message.warning(res.data.message);
+            }
+          }
+        })*/
+      }
+      that.taskList = that.taskEnum[item.id].taskList
+      that.loadDevice2(item.id)
+      that.deviceDialogVisible2 = true
+    },
+    handleSelectionChange(val) {
+      this.$set(this.dataForm, 'command', '')
+      this.multipleSelection = val
+      if (this.multipleSelection.length > 0) {
+        this.controlShow = true
+      } else {
+        this.controlShow = false
+      }
+    },
+    loadDevice2(deviceType) {
+      var that = this
+      deviceList({
+        deviceType: deviceType,
+        area: that.searchForm.area,
+        editable: '2',
+      }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.deviceData2 = res.data.result
+            if (deviceType != '15') {
+              var ids = []
+              that.deviceData2.forEach((item) => {
+                ids.push(item.deviceId)
+              })
+              that.dataForm.deviceId = ids.toString()
+              that.deviceStatusBatch()
+            }
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    typeClick(id) {
+      var that = this
+      if (that.searchForm.deviceType == id) {
+        id = ''
+      }
+      that.searchForm.deviceType = id
+      that.loadTable()
+    },
+    handle2D() {
+      var that = this
+      that.main2DShow = true
+      that.patrolShow = false
+      that.deviceClose()
+    },
+    handle3D() {
+      var that = this
+      if (that.searchForm.area == '2') {
+        that.main2DShow = false
+        deviceList({ area: that.searchForm.area, editable: '2' }).then(
+          (res) => {
+            if (res.status == 200) {
+              if (res.data.retCode == 0) {
+                var data = res.data.result
+                var model13 = []
+                data.forEach((item) => {
+                  if (item.task) {
+                    var j = JSON.parse(item.task)
+                    if (j.command != -1) {
+                      if (item.deviceType == '13' && item.modelId) {
+                        let model13 = {}
+                        if (j.command == 0) {
+                          model13 = {
+                            modelId: [item.modelId],
+                            frontType: 2,
+                            backType: 3,
+                          }
+                        } else if (j.command == 1) {
+                          model13 = {
+                            modelId: [item.modelId],
+                            frontType: 3,
+                            backType: 2,
+                          }
+                        } else if (j.command == 2) {
+                          model13 = {
+                            modelId: [item.modelId],
+                            frontType: 3,
+                            backType: 3,
+                          }
+                        }
+                        that.setLaneStatusIndicator(model13)
+                      } else if (item.deviceType == '14' && item.modelId) {
+                        let a = {
+                          id: '304',
+                          status: 'N',
+                          isFlash: false,
+                          remainTime: 55,
+                        }
+                        let b = {
+                          id: '305',
+                          status: 'N',
+                          isFlash: false,
+                          remainTime: 55,
+                        }
+                        if (j.command == 1) {
+                          a.status = 'R'
+                        } else if (j.command == 2) {
+                          a.status = 'Y'
+                        } else if (j.command == 3) {
+                          a.status = 'G'
+                        } else if (j.command == 4) {
+                          b.status = 'G'
+                        }
+                        that.updateTrafficSignal([a, b])
+                      } else if (item.deviceType == '15' && item.modelId) {
+                        if (j.body) {
+                          j.dataFormBody = JSON.parse(j.body)
+                          console.log("j.dataFormBody", j.dataFormBody)
+                          that.loadinfoBoardTemplate(
+                            3,
+                            j.dataFormBody.textInfoList,
+                            item.modelId
+                          )
+                        }
+                      }
+                    }
+                  }
+                })
+              } else {
+                that.$message.warning(res.data.message)
+              }
+            }
+          }
+        )
+      }
+    },
+    handlePatrol() {
+      var that = this
+      that.patrolShow = !that.patrolShow
+      //that.setCameraRoaming(tunnelRightList)
+    },
+    setCameraRoaming(data) {
+      let params = {
+        coordType: 0,
+        coordTypeZ: 1,
+        loopMode: false,
+        visualMode: 1,
+        pitch: 1,
+        speed: 50,
+        pointDistance: 0,
+        point: data,
+      }
+
+      // js 形式
+      try {
+        window.MetaDigieeApi.Camera.setCameraRoaming(params)
+        //成功返回
+      } catch (err) {
+        //异常处理
+      }
+    },
+    patrolClick(val) {
+      var that = this
+      var params = {
+        movingState: 'pause',
+      }
+      switch (val) {
+        case 'pause':
+          params = {
+            movingState: 'pause',
+          }
+          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
+
+          break
+        case 'play':
+          params = {
+            movingState: 'continue',
+          }
+          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
+          break
+        case 'end':
+          params = {
+            movingState: 'stop',
+          }
+          window.MetaDigieeApi.Camera.setCameraRoamingState(params)
+          break
+        case 'tunnelLeft':
+          that.setCameraRoaming(tunnelLeftList)
+          break
+        case 'tunnelRight':
+          that.setCameraRoaming(tunnelRightList)
+          break
+      }
+    },
+    async handleLinkClient() {
+      var that = this
+      that.passrecordList = []
+      const params = window.config.mapParams
+      try {
+        let res = await window.MetaDigieeApi.Service.openService(params)
+        console.log(res)
+        if (res.code == 200) {
+          let params2 = {
+            pitchRotSpeed: 10,
+            yawRotSpeed: 10,
+            scaleSpeed: 10,
+            translateSpeed: 10,
+          }
+          window.MetaDigieeApi.Camera.setCameraSpeedInfo(params2)
+
+          let params3 = {
+            intersectionId: ['Cross01'],
+            state: true,
+          }
+          window.MetaDigieeApi.TrafficSignal.setTrafficSignalState(params3)
+
+          setTimeout(() => {
+            that.setVehicleTrackState() //开启车辆实时轨迹
+          }, 1000)
+
+          let res = await window.MetaDigieeApi.Event.addMouseEventListener(
+            (event) => {
+              if (event.data.modelId && event.data.eventType === 'click') {
+                that.dataForm = {}
+                that.addOrUpdateTitle = ''
+                deviceList({ modelId: event.data.modelId }).then((res) => {
+                  if (res.status == 200) {
+                    if (res.data.retCode == 0) {
+                      if (res.data.result.length > 0) {
+                        that.handleClick(res.data.result[0], 0)
+                        //that.addInfoWindow(event.data.modelId,`./iframe/event.html?deviceId=${item.deviceId}&deviceType=${item.deviceType}&pileNumShow=${item.pileNumShow}&direction=${item.direction}`,[540,360],[20,-330])
+
+                        /*setTimeout(()=>{
+                        that.addInfoWindow(event.data.modelId,item)
+                      },400)*/
+                      } else {
+                        that.deviceClose()
+                      }
+                    } else {
+                      that.$message.warning(res.data.message)
+                    }
+                  }
+                })
+              }
+            }
+          )
+        } else {
+          that.$message.warning(res.message)
+        }
+      } catch (err) {
+        that.$message.warning(err)
+      }
+    },
+    async addInfoWindow(modelId, item) {
+      var that = this
+      var taskName = ''
+      if (item.task) {
+        var j = JSON.parse(item.task)
+        taskName = that.filedFomatter(
+          j.command,
+          that.taskEnum[item.deviceType].taskList
+        )
+      }
+      console.log(taskName)
+      try {
+        let params = {
+          modelId: modelId,
+          windowDoc:
+            '<div style="border: 1px solid #27bebe;background: rgba(19,110,206,0.5);padding: 0 20px;font-size: 14px;line-height: 25px;color: white">' +
+            '<div><span style="font-weight: 300;">设备类型：' +
+            filedFomatter(item.deviceType, that.deviceTypeList) +
+            '</span></div>' +
+            '<div><span style="font-weight: 300;;word-wrap: break-word">modelId：' +
+            item.modelId +
+            '</span></div>' +
+            '<div><span style="font-weight: 300;;word-wrap: break-word">物联key：' +
+            item.iotKey +
+            item.modelId +
+            item.modelId +
+            '</span></div>' +
+            '<div><span style="font-weight: 300;">桩号：' +
+            item.pileNumShow +
+            '</span></div>' +
+            '<div><span style="font-weight: 300;">运行状态：' +
+            taskName +
+            '</span></div>' +
+            '</div>',
+          infoWindowId: 'infoWindow01',
+          windowSize: [400, 200],
+          windowOffset: [0, 0],
+          dismissible: true,
+        }
+        window.MetaDigieeApi.InfoWindow.addInfoWindow(params)
+        //成功返回
+      } catch (err) {
+        //异常处理
+      }
+    },
+    async setLaneStatusIndicator(model13) {
+      var that = this
+      try {
+        let params = model13
+        //成功返回
+        let res = await window.MetaDigieeApi.LSIS.setLaneStatusIndicator(params)
+      } catch (e) { }
+    },
+    async updateTrafficSignal(phase) {
+      var that = this
+      const params = {
+        effectSignalVisible: false,
+      }
+      const res =
+        await window.MetaDigieeApi.TrafficSignal.setEffectTrafficSignalVisibility(
+          params
+        )
+      try {
+        let params = [
+          {
+            intersectionId: 'Cross01',
+            changeTime: '2023-02-16 12:00:00',
+            phase: phase,
+          },
+        ]
+        //成功返回
+        let res = await window.MetaDigieeApi.TrafficSignal.updateTrafficSignal(
+          params
+        )
+      } catch (e) { }
+    },
+    async updateVMSInfo(data) {
+      var that = this
+      try {
+        let params = data
+        let res = await window.MetaDigieeApi.VMS.updateVMSInfo(params)
+        //成功返回
+      } catch (err) {
+        //异常处理
+        console.log(err)
+      }
+    },
+    async setVehicleTrackState() {
+      var that = this
+      try {
+        const params = {
+          modelId: ['mec0'],
+          isAdsorbed: true,
+          mode: 0,
+          state: true,
+        }
+        let res123 =
+          await window.MetaDigieeApi.VehicleTrack.setVehicleTrackState(params)
+
+        let params1 = {
+          plateVisible: true,
+        }
+        window.MetaDigieeApi.VehicleTrack.setVehiclePlateVisibility(params1) //显示车牌
+        let params2 = {
+          speedVisible: true,
+        }
+        window.MetaDigieeApi.VehicleTrack.setVehicleSpeedVisibility(params2) //显示车速
+
+        if (res123.code == 200) {
+          setTimeout(() => {
+            that.loadData()
+          }, 200)
+        }
+      } catch (err) {
+        //异常处理
+        console.log(err)
+      }
+    },
+    loadData() {
+      var that = this
+      connectWebsocket(
+        // 测试地址
+        window.config.wsUrl,
+        // 传递给后台的数据
+        '',
+        // { openexe: 'openexe' },
+        // 成功拿到后台返回的数据的回调函数
+        (data) => {
+          if (data) {
+            dataList = JSON.parse(data)
+            console.log(dataList)
+            if (dataList.facilityId) {
+              that.updateVehicleTrack(dataList)
+            }
+          }
+        },
+        // websocket连接失败的回调函数
+        (err) => {
+          console.log('失败的回调函数', err)
+          dataList = {}
+        }
+      )
+    },
+    async updateVehicleTrack(vehicleList) {
+      try {
+        let params = vehicleList
+        let res = await window.MetaDigieeApi.VehicleTrack.updateVehicleTrack(
+          params
+        )
+        //成功返回
+        console.log(res)
+      } catch (err) {
+        //异常处理
+        console.log(err)
+      }
+    },
+    handleWarnClick(index) {
+      console.log(index, 'xxxxxxxxxxxxxxxxxxx')
+      var that = this
+      clearTimeout(that.statusTimer)
+      that.statusTimer = null
+
+      that.planClose()
+      that.warnList = []
+      if (index == '2') {
+        latestWarnList().then((res) => {
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              that.warnList = res.data.result
+              that.statsticInfo.warn_count_todo = res.data.total
+            } else {
+              //that.$message.warning(res.data.message);
+            }
+          }
+        })
+      } else {
+        warnList({ status: index }).then((res) => {
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              that.warnList = res.data.result
+            } else {
+              that.$message.warning(res.data.message)
+            }
+          }
+        })
+      }
+      that.warnShow = true
+    },
+    loadWarnList() {
+      var that = this
+      latestWarnList().then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.warnList = res.data.result
+            that.statsticInfo.warn_count_todo = res.data.total
+
+            var warnList = res.data.result
+            that.warnMap = {}
+            var arr1 = []
+            var arr2 = []
+            var arr3 = []
+            warnList.forEach((item) => {
+              if (item.area == 1) {
+                arr1.push(item)
+              } else if (item.area == 2) {
+                arr2.push(item)
+              } else if (item.area == 3) {
+                arr3.push(item)
+              }
+            })
+            that.warnMap = {
+              1: arr1,
+              2: arr2,
+              3: arr3,
+            }
+            that.loadWarnMarker(that.warnMap[that.searchForm.area])  ////加载报警图标
+          } else {
+            //that.$message.warning(res.data.message);
+          }
+        }
+      }) /*
+      warnList({status:'1,2'}).then(res=>{
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.warnList = res.data.result
+            if(that.warnList.length > 0){
+              that.warnShow = true;
+            }
+            var warnList = res.data.result
+            that.warnMap = {}
+            var arr1 = []
+            var arr2 = []
+            var arr3 = []
+            warnList.forEach(item=>{
+              if(item.area == 1){
+                arr1.push(item)
+              }else if(item.area == 2){
+                arr2.push(item)
+              }else if(item.area == 3){
+                arr3.push(item)
+              }
+            })
+            that.warnMap = {
+              '1':arr1,
+              '2':arr2,
+              '3':arr3
+            }
+            //that.loadWarnMarker(that.warnMap[that.searchForm.area])
+          } else {
+            that.$message.warning(res.data.message);
+          }
+        }
+      })*/
+    },
+    handleCheckChange(data, checked, indeterminate) {
+      console.log(data, checked, indeterminate);
+      // this.addComment(data,data.programId)
+
+    },
+    handleCheck(checkedNodes) {
+      console.log(checkedNodes, "cscscscs");
+      // 这里可以处理选中项的逻辑，比如更新checkedKeys等。
+      //   this.textInfoList = checkedNodes.push() // 根据需要更新checkedKeys数组，例如只保留id等。
+      this.textInfoList.push(checkedNodes.programId)
+      console.log(this.textInfoList, "cscscscs");
+    },
+    loadWarnMarker(data) {
+      var that = this
+      that.componentsWarnList = []
+      that.componentsOldWarnList = []
+      that.warnIdOptions = []
+      if (!data) {
+        return
+      }
+      data.forEach((item, index) => {
+        if (item.pileNumShow) {
+          that.warnIdOptions.push(item.id)
+          let imgForm = window.config.drapWarnElMap[item.type]
+          var json = item
+          json.imgUrl = imgForm.url
+          var x = 0,
+            y = 0
+
+          json.position = {
+            x: 0,
+            y: 0,
+            w: imgForm.w,
+            h: imgForm.h,
+            bg: '#fff',
+          }
+          let km = item.pileNumShow.replace('K', '').replace('+', '.')
+          let km1 = that.pileNumMap[that.searchForm.area].left
+            .replace('K', '')
+            .replace('+', '.')
+          let subtract = Number(km) - Number(km1)
+          json.position.x = subtract * 1000 * that.scale - imgForm.w / 2
+          x = subtract * 1000 * that.scale - imgForm.w / 2
+          if (item.lane == 0) {
+            json.position.y = 265 - imgForm.h / 2
+            y = 265 - imgForm.h / 2
+          } else {
+            if (item.direction == '2') {
+              let newLane = that.distanceFromNine(Number(item.lane))
+              json.position.y = newLane * 24 + 13 - imgForm.h / 2
+              y = newLane * 24 + 13 - imgForm.h / 2
+            } else {
+              json.position.y = item.lane * 24 + 271 - imgForm.h / 2
+              y = item.lane * 24 + 271 - imgForm.h / 2
+            }
+          }
+          json.temp = {
+            position: {
+              x: x,
+              y: y,
+            },
+          }
+
+          that.componentsOldWarnList.push(json)
+        }
+      })
+      setTimeout(() => {
+        that.componentsWarnList = JSON.parse(
+          JSON.stringify(that.componentsOldWarnList)
+        )
+      }, 1000)
+    },
+    warnClose() {
+      this.warnShow = false
+      this.warnForm = {}
+      this.warnControl = null
+      this.warnDetailClose()
+    },
+    warnDetailClose() {
+      this.warnDetailShow = false
+      if (this.statusTimer) {
+        clearTimeout(this.statusTimer)
+        this.statusTimer = null
+      }
+      this.dataForm.deviceId = this.deviceDataId.toString()
+      this.deviceStatusBatch()
+    },
+    planDetailClose() {
+      this.planDetailShow = false
+      if (this.statusTimer) {
+        clearTimeout(this.statusTimer)
+        this.statusTimer = null
+      }
+      this.dataForm.deviceId = this.deviceDataId.toString()
+      this.deviceStatusBatch()
+    },
+    planClose() {
+      this.planShow = false
+      this.planDetailClose()
+    },
+    warnClick(row) {
+      var that = this
+      that.warnForm = JSON.parse(JSON.stringify(row))
+      if (that.warnForm.area != that.searchForm.area) {
+        that.tunnelClick(that.warnForm.area)
+      }
+      that.warnControl = that.warnForm
+    },
+    planDisposalClick(item) {
+      var that = this
+      that.warnDetailClose()
+      that.planShow = true
+      planList({ status: '1', area: item.area, planType: item.type }).then(
+        (res) => {
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              that.planList = res.data.result
+            } else {
+              that.$message.warning(res.data.message)
+            }
+          }
+        }
+      )
+    },
+    warnPlanClick(row) {
+      var that = this
+      if (that.statusTimer) {
+        clearTimeout(that.statusTimer)
+        that.statusTimer = null
+      }
+
+      that.dataForm = {}
+      that.planLoading = false
+      that.planSuccess = false
+      that.warnDetailShow = true
+      that.planDetailMap = {
+        11: [],
+        13: [],
+        14: [],
+        15: [],
+        19: [],
+      }
+      that.planForm = JSON.parse(JSON.stringify(row))
+      that.deviceIds = []
+      that.deviceIds15 = []
+      that.templateObj = ''
+      that.mediaObj = null
+      that.listMedia = []
+
+      deviceList({
+        area: that.planForm.area,
+        editable: '2',
+        deviceType: that.planDeviceType.toString(),
+        direction: that.planForm.direction,
+      }).then((res) => {
+        that.loading = false
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.planDetailMap = {
+              11: [],
+              13: [],
+              14: [],
+              15: [],
+              19: [],
+            }
+            var km1 = that.planForm.pileNum.replace('K', '').replace('+', '.')
+            res.data.result.forEach((item) => {
+              var km2 = item.pileNumShow.replace('K', '').replace('+', '.')
+              var obj = {
+                id: item.deviceId,
+                pileNum: item.pileNumShow,
+                stream: '0',
+              }
+
+              if (item.deviceType == '11') {
+                if (Math.abs(km1 - km2) < 0.05) {
+                  //小于50米
+                  obj.cmd = '0'
+                } else {
+                  obj.cmd = '1'
+                }
+              } else if (item.deviceType == '14') {
+                obj.cmd = '1'
+              } else if (item.deviceType == '13') {
+                if (item.direction == 1) {
+                  if (km1 < km2) {
+                    obj.stream = '2'
+                  } else {
+                    obj.stream = '1'
+                  }
+                } else {
+                  if (km1 < km2) {
+                    obj.stream = '1'
+                  } else {
+                    obj.stream = '2'
+                  }
+                }
+                if (obj.stream == '1') {
+                  obj.cmd = '2'
+                } else {
+                  obj.cmd = '0'
+                }
+              } else if (item.deviceType == '15') {
+                that.deviceIds15.push(item.deviceId)
+              } else if (item.deviceType == '19') {
+                obj.cmd = '1'
+              }
+              that.planDetailMap[item.deviceType].push(obj)
+              that.deviceIds.push(item.deviceId)
+              /*that.planDetailData.push({
+                type:item.deviceType,
+                data:p[key]
+              })*/
+            })
+            that.loadinfoBoardTemplate(2)
+            console.log(that.planDetailMap)
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+      // 预案处置中广播的下拉列表暂时屏蔽
+      // getMediaList().then((res) => {
+      //   if (res.status == 200) {
+      //     if (res.data.code == 200) {
+      //       that.listMedia = res.data.data.listMedia
+      //       that.mediaObj = that.listMedia[0]
+      //     } else {
+      //       that.$message.warning(res.data.message)
+      //     }
+      //   }
+      // })
+    },
+    handleCommitPlanClick(index) {
+      var that = this
+      console.log(index, that.planForm, ' ///////////////////')
+      var json = {}
+      if (that.deviceIds15.length > 0) {
+        var obj = {
+          deviceType: '15',
+          command: '15_01',
+          deviceId: that.deviceIds15.toString(),
+          body: JSON.stringify({
+            textInfoList: [{ id: that.templateObj, fillInfo: '' }],
+          }),
+        }
+        var url = '/json/iot/iotControlBatch'
+        iotControl(obj, url).then((res) => { })
+      }
+      if (index == 2) {
+        // json = {
+        //   planType: '2',
+        //   warnType: that.planForm.type,
+        //   area: that.planForm.area,
+        //   direction: that.planForm.direction,
+        //   plan: JSON.stringify(that.planDetailMap),
+        // }
+        json = {
+          plc: [],
+        }
+        console.log(that.planDeviceType, that.planDetailMap[13], '13车道指示灯', that.planDetailMap[14], '14', 'planDeviceTypeplanDeviceType')
+        that.planDetailMap[13].forEach((item) => { // 车道指示灯
+          let operationInstructions = filedFomatter(item.cmd, that.taskEnum[13].taskList)
+          json.plc.push({
+            deviceId: item.id,
+            operationInstructions: operationInstructions,
+            writeOrRead: 'W'
+          })
+        })
+        that.planDetailMap[14].forEach((item) => { //交通信号控制灯
+          let operationInstructions = filedFomatter(item.cmd, that.taskEnum[14].taskList)
+          console.log(operationInstructions, '141414')
+          json.plc.push({
+            deviceId: item.id,
+            operationInstructions: operationInstructions,
+            writeOrRead: 'W'
+          })
+        })
+
+        that.planSuccess = false
+        that.planLoading = true
+        batchControl(json).then((res) => {
+          that.planLoading = false
+          that.planSuccess = true
+          console.log(res)
+          if (res.data.code == 200) {
+            that.$message.success('操作成功')
+            that.warnDetailShow = false
+            verify({ id: that.planForm.id, status: '8' }).then((res) => {
+              if (res.status == 200) {
+                if (res.data.retCode == 0) {
+                  that.loadWarnList()
+                  that.statsticWhole()
+                }
+              }
+            })
+          } else {
+            that.$message.success(res.data.msg)
+          }
+        })
+      } else if (index == 1) {
+        json = {
+          planType: '1',
+          warnType: that.planForm.warnType,
+          planId: that.planForm.planId,
+          area: that.planForm.area,
+        }
+        that.planSuccess = false
+        that.planLoading = true
+        planExecute(json).then((res) => {
+          that.planLoading = false
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              that.$message.success('成功')
+              that.planSuccess = true
+              setTimeout(() => {
+                that.dataForm.deviceId = that.deviceIds.toString()
+                that.deviceStatusBatch(index)
+              }, 2000)
+            } else {
+              that.$message.warning(res.data.message)
+            }
+          }
+        })
+      }
+      if (that.mediaObj.id) {
+        var extens = []
+        getEmployeeList().then((res) => {
+          if (res.status == 200) {
+            if (res.data.code == 200) {
+              res.data.data.employeeList.forEach((item) => {
+                extens.push(item.exten)
+              })
+              var obj = {
+                name: that.mediaObj.name,
+                extenNums: extens.toString(),
+                AudioSourceType: that.mediaObj.type,
+              }
+              if (that.mediaObj.type == '1') {
+                obj.audioStr = that.mediaObj.id
+              } else {
+                obj.textContent = ''
+              }
+
+              addBroadcast(obj).then((res) => {
+                if (res.status == 200) {
+                  if (res.data.code == 200) {
+                  } else {
+                    that.$message.warning(res.data.message)
+                  }
+                }
+              })
+            } else {
+              that.$message.warning(res.data.message)
+            }
+          }
+        })
+      }
+    },
+    planClick(row) {
+      var that = this
+      that.dataForm = {}
+      that.planLoading = false
+      that.planSuccess = false
+      that.planDetailShow = true
+      that.planDetailData = []
+      that.planForm = JSON.parse(JSON.stringify(row))
+      that.deviceIds = []
+      if (that.statusTimer) {
+        clearTimeout(that.statusTimer)
+        that.statusTimer = null
+      }
+      planDetail({ planId: row.planId }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            var p = JSON.parse(res.data.result.plan)
+            for (let key in p) {
+              that.planDetailData.push({
+                type: key,
+                data: p[key],
+              })
+              p[key].forEach((item) => {
+                that.deviceIds.push(item.id)
+              })
+            }
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    verifyClick(row) {
+      var that = this
+      that
+        .$confirm('已确认?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        })
+        .then(() => {
+          verify({ id: row.id, status: '3' }).then((res) => {
+            if (res.status == 200) {
+              if (res.data.retCode == 0) {
+                that.$message.success('成功')
+                that.loadWarnList()
+                that.statsticWhole()
+              } else {
+                that.$message.warning(res.data.message)
+              }
+            }
+          })
+        })
+        .catch(() => {
+          that.$message.info('已取消删除')
+        })
+    },
+    handleDeviceRunClick() {
+      var that = this
+      that.loadDevice()
+      that.deviceRunShow = true
+    },
+    loadDevice() {
+      var that = this
+      deviceList({
+        deviceType: that.deviceType,
+        area: that.searchForm.area,
+        editable: '2',
+      }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.deviceData = res.data.result
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    deviceRunClick(row) {
+      var that = this
+
+      that.curControl = row
+    },
+    async handleClick(row, i) {
+      var that = this
+      if (row.deviceType == '55' || row.deviceType == '56') {
+        return ''
+      }
+      that.dataForm = {}
+      that.textInfoList = []
+      that.dataFormBody = {}
+      that.dataForm = JSON.parse(JSON.stringify(row))
+      that.addOrUpdateTitle =
+        that.filedFomatter(that.dataForm.area, that.areaList) +
+        ' / ' +
+        that.filedFomatter(that.dataForm.deviceType, that.deviceTypeList) +
+        ' / ' +
+        that.dataForm.deviceId
+      that.tempMap = {}
+      that.templateInfoHtml = ''
+      that.iotKeyList = []
+      console.log(that.taskEnum, '点击事件', that.dataForm)
+      that.taskList = that.taskEnum[that.dataForm.deviceType].taskList
+      if (that.dataForm.refresh == '1') {
+        that.deviceStatus()
+      }
+      // 13 车道指示灯 
+      console.log('1111111111111111111111111', that.dataForm.deviceType)
+      if (that.dataForm.deviceType == '15') {
+        console.log("that.dataFormBody", that.dataFormBody)
+        if (that.dataForm.task) {
+          var j = JSON.parse(that.dataForm.task)
+          console.log("j.dataFormBody", j.dataFormBody)
+          that.$set(that.dataForm, 'taskName', j.command)
+          if (j.body) {
+            j.dataFormBody = JSON.parse(j.body)
+            that.loadinfoBoardTemplate(1, j.dataFormBody.textInfoList)
+          }
+        }
+        that.loadinfoBoardTemplate(0)
+      } else if (that.dataForm.deviceType == '22') {
+        if (that.dataForm.iotKey) {
+          that.videoForm.pid = that.dataForm.iotKey
+          that.videoUrl = ''
+          getPlayAddressByPid(that.videoForm).then((res) => {
+            if (res.status == 200) {
+              if (res.data.ret == 0) {
+                that.videoUrl = res.data.data.flv
+              } else {
+                that.$message.warning(res.data.message)
+              }
+            }
+          })
+        }
+      } else if (
+        that.dataForm.deviceType == '40' ||
+        that.dataForm.deviceType == '41' ||
+        that.dataForm.deviceType == '42'
+      ) {
+        that.$set(that.dataForm, 'iotKeys', [])
+        var arr = that.dataForm.iotKey.split('|')
+        arr.forEach((item) => {
+          var arr1 = item.split(':')
+          var name = window.config.pumpMap[arr1[0]]
+          var arr2 = arr1[1].split(',')
+          arr2.forEach((item2, i) => {
+            var json = {}
+            if (arr1[0] == 'ps' || arr1[0] == 'hs') {
+              json.show = false
+            } else {
+              json.show = true
+            }
+            json.name = name + (i + 1)
+            json.id = arr1[0] + ':' + item2
+            that.iotKeyList.push(json)
+          })
+        })
+      }
+      if (that.dataForm.deviceType == '13') {
+        // 获取 lane 对应的显示文本
+        const laneText = filedFomatter(that.dataForm.lane, that.laneList)
+        const directionText = filedFomatter(that.dataForm.direction, that.directionList)
+        const deviceTypeText = filedFomatter(that.dataForm.deviceType, that.deviceTypeList)
+        const areaText = filedFomatter(that.dataForm.area, that.areaList)
+        console.log(laneText, directionText, deviceTypeText, that.textInfoList, 'sssssssssssssssssssssssss')
+        // 如果 laneText 是 "车道一" 并且 directionText 是 "上行"，则在 taskList 尾部添加一个选项
+        if (areaText === '五一隧道') {
+          if (laneText === "车道一" && deviceTypeText === "车道指示灯" && that.dataForm.deviceName != 'YLS1' && (directionText === "上行" || directionText === "下行")) {
+            that.taskList = [
+              { id: '0', name: '正向通行' },
+              { id: '1', name: '反向通行' },
+              {
+                id: '2',
+                name: '封道',
+              }, { id: '3', name: '正向左转' }
+              // ,{id: '4', name: '反向左转'},
+              // { id: '3', name: '左转' },
+            ]
+          } else {
+            that.taskList = [
+              { id: '0', name: '正向通行' },
+              { id: '1', name: '反向通行' },
+              {
+                id: '2',
+                name: '封道',
+              } /*{id: '3', name: '正向转向'},{id: '4', name: '反向转向'}*/,
+            ]
+          }
+        } else if (areaText === '西山隧道') {
+          if (laneText === "车道一" && deviceTypeText === "车道指示灯" && (directionText === "上行" || directionText === "下行")) {
+            that.taskList = [
+              { id: '0', name: '正向通行' },
+              { id: '1', name: '反向通行' },
+              {
+                id: '2',
+                name: '封道',
+              },
+              //  {id: '3', name: '正向左转'},{id: '4', name: '反向左转'},
+              { id: '3', name: '左转' },
+            ]
+          } else {
+            that.taskList = [
+              { id: '0', name: '正向通行' },
+              { id: '1', name: '反向通行' },
+              {
+                id: '2',
+                name: '封道',
+              } /*{id: '3', name: '正向转向'},{id: '4', name: '反向转向'}*/,
+            ]
+          }
+        }
+        console.log('//////////////')
+        // 获取设备状态
+        getIotDeviceStatus({
+          deviceId: that.dataForm.deviceId,
+          deviceType: that.dataForm.deviceType
+        })
+          .then(res => {
+            const { code, data } = res?.data || {};
+            if (code === 200) {
+              // that.dataForm.command = data?.status || '';
+              let command = data?.status || '';
+              that.$set(that.dataForm, 'command', command)
+            }
+            // this.$forceUpdate();
+            console.log(that.dataForm.command)
+          })
+          .catch(error => {
+            console.error('Error fetching device status:', error);
+          });
+      } else if (that.dataForm.deviceType == '26' || that.dataForm.deviceType == '27' || that.dataForm.deviceType == '28') {
+        //风速风向和covi展示的
+        getIotDeviceStatus({
+          deviceId: that.dataForm.deviceId,
+          deviceType: that.dataForm.deviceType
+        })
+          .then(res => {
+            const { code, data } = res?.data || {};
+            if (code === 200) {
+              console.log(data, that.dataForm, 'ddddddddddddd')
+              if (data.statusJson) {
+                const json = JSON.parse(data.statusJson);
+                if (json.covi && that.dataForm.deviceType == '27') { // covi
+                  that.$set(that.dataForm, 'vi27', json.covi.vi)
+                  that.$set(that.dataForm, 'co27', json.covi.co)
+                } else if (json.covi && that.dataForm.deviceType == '26') { // 风速风向
+                  that.$set(that.dataForm, 'speed26', json.covi.fs)
+                  that.$set(that.dataForm, 'direction26', json.covi.fx)
+                } else if (json.covi && that.dataForm.deviceType == '28') { // 光强
+                  that.$set(that.dataForm, 'light28', json.covi.BD)
+                  //   that.$set(that.dataForm, 'direction26', json.covi.BD)
+                }
+              }
+            }
+          })
+          .catch(error => {
+            console.error('Error fetching device status:', error);
+          });
+      } else if (that.dataForm.deviceType == '14' || that.dataForm.deviceType == '19') { // 获取回显状态
+        // 获取设备状态
+        getIotDeviceStatus({
+          deviceId: that.dataForm.deviceId,
+          deviceType: that.dataForm.deviceType
+        })
+          .then(res => {
+            const { code, data } = res?.data || {};
+            if (code === 200) {
+              let command = data?.status || '';
+              that.$set(that.dataForm, 'command', command)
+            }
+            // this.$forceUpdate();
+            console.log(that.dataForm.command)
+          })
+          .catch(error => {
+            console.error('Error fetching device status:', error);
+          });
+      } else if (that.dataForm.deviceType == '11') {  //风机
+        // 获取设备状态
+        getIotDeviceStatus({
+          deviceId: that.dataForm.deviceId,
+          deviceType: that.dataForm.deviceType
+        })
+          .then(res => {
+            const { code, data } = res?.data || {};
+            if (code === 200) {
+              let command = data?.status || '';
+              that.$set(that.dataForm, 'command', command)
+            }
+            // this.$forceUpdate();
+            console.log(that.dataForm.command)
+          })
+          .catch(error => {
+            console.error('Error fetching device status:', error);
+          });
+      } else if (that.dataForm.deviceType == '47') { // 电伴热
+        that.$set(that.dataForm, 'iotKeys', [])
+        console.log("电伴热", that.dataForm)
+        // 获取电伴热设备状态
+        let dev_id = that.dataForm.iotKey.split(':')[1]
+        let res = await getDbrIotDeviceList(dev_id)
+        console.log("电伴热2", res)
+        if (res?.status == 200) {
+          console.log("电伴热3", res.data)
+          this.iotDBRInfo = res.data
+        }
+
+      }
+      if (i) {
+        that.deviceDialogVisible = true
+      } else {
+        that.deviceControlShow = true
+      }
+    },
+    /*initTimer(){
+      var that = this
+      that.statusTimer = setInterval(_ => {
+        that.deviceStatus()
+      }, 2000)
+    },*/
+    deviceClose() {
+      var that = this
+      console.log('clear')
+      if (that.statusTimer) {
+        clearTimeout(that.statusTimer)
+        that.statusTimer = null
+      }
+      that.deviceControlShow = false
+      that.deviceDialogVisible = false
+      that.deviceDialogVisible2 = false
+
+      that.dataForm.deviceId = that.deviceDataId.toString()
+      that.deviceStatusBatch()
+    },
+    deviceStatus() {
+      var that = this
+      deviceStatus({
+        deviceId: that.dataForm.deviceId,
+        deviceType: that.dataForm.deviceType,
+      }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            that.$set(that.dataForm, 'status', res.data.result.status)
+
+            if (res.data.result.task) {
+              that.$set(that.dataForm, 'task', res.data.result.task)
+              var j = JSON.parse(that.dataForm.task)
+
+              that.$set(that.dataForm, 'taskName', j.command)
+
+              if (j.command != -1) {
+                let imgForm =
+                  window.config.drapLeftElMap[that.dataForm.deviceType]
+                if (that.dataForm.deviceType == '11') {
+                  that.componentsList.forEach((item) => {
+                    if (item.deviceId == that.dataForm.deviceId) {
+                      item.imgUrl = imgForm['url' + j.command]
+                    }
+                  })
+                } else if (that.dataForm.deviceType == '13') {
+                  that.componentsList.forEach((item) => {
+                    if (item.deviceId == that.dataForm.deviceId) {
+                      item.imgUrl =
+                        imgForm['url' + item.direction + '' + item.direction][
+                        j.command
+                        ]
+                    }
+                  })
+                } else if (that.dataForm.deviceType == '14') {
+                  that.componentsList.forEach((item) => {
+                    if (item.deviceId == that.dataForm.deviceId) {
+                      item.imgUrl = imgForm['urls'][j.command]
+                    }
+                  })
+                } else if (
+                  that.dataForm.deviceType == '40' ||
+                  that.dataForm.deviceType == '41' ||
+                  that.dataForm.deviceType == '42'
+                ) {
+                  that.iotKeyData = []
+                  const str1 = that.dataForm.iotKey.split('|')
+                  const str2 = that.dataForm.taskName.split('|')
+                  str1.forEach((item, i) => {
+                    const [name, values] = item.split(':')
+                    const name1 = window.config.pumpMap[name]
+                    const [name2, values2] = str2[i].split(':')
+                    var arr = values.split(',')
+                    var arr2 = values2.split(',')
+
+                    var arr3 = []
+
+                    arr.forEach((item2, i2) => {
+                      if (name == 'ps' || name == 'hs') {
+                        arr3.push({
+                          id: `${name}:${item2}`,
+                          name: i2 + 1 + '#：' + arr2[i2],
+                        })
+                      } else {
+                        arr3.push({
+                          id: `${name}:${item2}`,
+                          name:
+                            i2 +
+                            1 +
+                            '#：' +
+                            that.filedFomatter(arr2[i2], that.taskList),
+                        })
+                      }
+                    })
+                    that.iotKeyData.push({
+                      name: name1,
+                      data: arr3,
+                    })
+                  })
+                }
+              }
+
+              //that.$set(that.dataForm,'command',j.command)
+              if (j.body) {
+                j.dataFormBody = JSON.parse(j.body)
+              }
+
+              if (that.dataForm.deviceType == '15') {
+                // that.loadinfoBoardTemplate(1,j.dataFormBody.textInfoList);
+              } else if (that.dataForm.deviceType == '26') {
+                that.dataForm.speed26 = j.speed
+                that.dataForm.direction26 = j.direction == '0' ? '正向' : '反向'
+              } else if (that.dataForm.deviceType == '27') {
+                that.dataForm.co27 = j.co
+                that.dataForm.vi27 = j.vi
+              } else if (that.dataForm.deviceType == '28') {
+                that.dataForm.light28 = j.light
+              } else if (that.dataForm.deviceType == '43') {
+                that.dataForm.height43 = j.height
+              }
+            }
+            if (that.statusTimer) {
+              clearTimeout(that.statusTimer)
+              that.statusTimer = null
+            }
+            if (that.deviceDialogVisible || that.deviceControlShow) {
+              console.log('deviceStatus2')
+              that.statusTimer = setTimeout(() => {
+                that.deviceStatus()
+              }, 2000)
+            }
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    deviceStatusBatch(index) {
+      var that = this
+      deviceStatusBatch({
+        deviceId: that.dataForm.deviceId,
+        deviceType: that.dataForm.deviceType,
+      }).then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            res.data.result.forEach((item) => {
+              that.deviceData2.forEach((item1) => {
+                if (item.deviceId == item1.deviceId) {
+                  item1.task = item.task
+                }
+              })
+
+              if (item.task) {
+                that.$set(that.dataForm, 'task', item.task)
+                var j = JSON.parse(item.task)
+
+                if (index == 2) {
+                  that.planDeviceType.forEach((p1) => {
+                    that.planDetailMap[p1].forEach((p2) => {
+                      if (p2.id == item.deviceId) {
+                        p2.ret = j.command
+                      }
+                    })
+                  })
+                  that.planDetailMap = JSON.parse(
+                    JSON.stringify(that.planDetailMap)
+                  )
+                } else if (index == 1) {
+                  that.planDetailData.forEach((p1) => {
+                    if (p1.type == item.deviceType) {
+                      p1.data.forEach((p2) => {
+                        if (p2.id == item.deviceId) {
+                          p2.ret = j.command
+                        }
+                      })
+                    }
+                  })
+                  that.planDetailData = JSON.parse(
+                    JSON.stringify(that.planDetailData)
+                  )
+                }
+                //that.$set(that.dataForm,'taskName',j.command)
+
+                if (j.command != -1) {
+                  let imgForm = window.config.drapLeftElMap[item.deviceType]
+                  if (item.deviceType == '11') {
+                    that.componentsList.forEach((item2) => {
+                      if (item2.deviceId == item.deviceId) {
+                        item2.imgUrl = imgForm['url' + j.command]
+                      }
+                    })
+                  } else if (item.deviceType == '13') {
+                    that.componentsList.forEach((item2) => {
+                      if (item2.deviceId == item.deviceId) {
+                        item2.imgUrl =
+                          imgForm[
+                          'url' + item2.direction + '' + item2.direction
+                          ][j.command]
+                      }
+                    })
+                  } else if (item.deviceType == '14') {
+                    that.componentsList.forEach((item2) => {
+                      if (item2.deviceId == item.deviceId) {
+                        item2.imgUrl = imgForm['urls'][j.command]
+                      }
+                    })
+                  }
+                }
+
+                //that.$set(that.dataForm,'command',j.command)
+                if (j.body) {
+                  j.dataFormBody = JSON.parse(j.body)
+                }
+              }
+            })
+
+            if (that.statusTimer) {
+              clearTimeout(that.statusTimer)
+              that.statusTimer = null
+            }
+            if (
+              that.deviceDialogVisible2 ||
+              that.planDetailShow ||
+              that.warnDetailShow
+            ) {
+              console.log('deviceStatusBatch2')
+              that.statusTimer = setTimeout(() => {
+                that.deviceStatusBatch(index)
+              }, 2000)
+            } else {
+              console.log('deviceStatusBatch15')
+              that.statusTimer = setTimeout(() => {
+                that.deviceStatusBatch()
+              }, 15000)
+            }
+          } else {
+            //that.$message.warning(res.data.message);
+          }
+        }
+      })
+    },
+    loadinfoBoardTemplate(index, list, modelId) {
+      console.log("index", index)
+      var that = this
+      getProgramTree({ name: this.filterText }).then((res) => {
+        console.log("this.treeData", res.data.data)
+        console.log("res.code", res.data.code)
+        if (res.data.code == 200) {
+          console.log("this.treeData", res.data.data)
+          res.data.data.forEach((item) => {
+            // this.count += item.children.length;
+            if (item.children) {
+              item.children.forEach((child) => {
+                if (child.dynamicValueNum > 0) {
+                  console.log("大于0");
+                  for (let i = 0; i < child.dynamicValueNum; i++) {
+                    child["contentValue" + (i + 1)] =
+                      child.dynamicValueList.length > 0
+                        ? child.dynamicValueList[i]
+                        : "";
+                  }
+                }
+              });
+            }
+          });
+
+          //   this.treeData = res.data;
+          this.treeData = res.data.data;
+          //   this.infoBoardTemplateList = res.data.data
+          console.log("this.treeData", this.treeData)
+          this.infoBoardTemplateList = []
+          const newArray = res.data.data.flatMap(item => item.children);
+          console.log("newArray", newArray)
+          this.infoBoardTemplateList = newArray
+          //  res.data.data.forEach((item, i) => {
+          //  
+          //     var form = {
+          //       ...item,
+          //       templateHtml: that.domRender(item.textInfo),
+          //     }
+          //     that.infoBoardTemplateList.push(form)
+          //   })
+
+        }
+      });
+      infoBoardTemplateList().then((res) => {
+        if (res.status == 200) {
+          if (res.data.retCode == 0) {
+            if (index == 1) {
+              that.templateHtmlList = []
+              console.log("res.data.result111111111111", res.data.result)
+              res.data.result.forEach((item, i) => {
+                list.forEach((item1) => {
+                  if (item.id == item1.id) {
+                    var str = that.domRender(
+                      item.textInfo,
+                      item1.fillInfo,
+                      item.id,
+                      1
+                    )
+                    var html = ''
+                    var backColor = ''
+                    var fontColor = ''
+                    var fontFormat = ''
+                    var fontFormatUpDown = ''
+                    let fontSize = item.fontSize.split('*')[0]
+                    switch (item.backColor) {
+                      case '红色':
+                        backColor = 'red'
+                        break
+                      case '黄色':
+                        backColor = 'yellow'
+                        break
+                      case '绿色':
+                        backColor = 'green'
+                        break
+                      case '黑色':
+                        backColor = 'black'
+                        break
+                    }
+                    switch (item.fontColor) {
+                      case '红色':
+                        fontColor = 'red'
+                        break
+                      case '黄色':
+                        fontColor = 'yellow'
+                        break
+                      case '绿色':
+                        fontColor = 'green'
+                        break
+                      case '黑色':
+                        fontColor = 'black'
+                        break
+                    }
+                    switch (item.fontFormat) {
+                      case '居中':
+                        fontFormat = 'center'
+                        break
+                      case '居左':
+                        fontFormat = 'left'
+                        break
+                      case '居右':
+                        fontFormat = 'right'
+                        break
+                    }
+                    switch (item.fontFormatUpDown) {
+                      case '居中':
+                        fontFormatUpDown = 'center'
+                        break
+                      case '居左':
+                        fontFormatUpDown = 'left'
+                        break
+                      case '居右':
+                        fontFormatUpDown = 'right'
+                        break
+                    }
+                    html += `<div style="background-color: ${backColor};color: ${fontColor};width: ${item.cmsWidth
+                      }px;height: ${item.cmsHeight
+                      }px;display: flex;justify-content: ${fontFormat};align-items: ${fontFormatUpDown};font-size: ${Number(
+                        fontSize
+                      )}px;font-family: ${item.fontName}">${str}</div>`
+                    that.templateHtmlList.push({
+                      html: html,
+                      intervaly: item.intervaly,
+                    })
+                  }
+                })
+              })
+              if (that.templateHtmlList.length > 0) {
+                if (that.tempTimer) {
+                  clearTimeout(that.tempTimer)
+                  that.tempTimer = null
+                }
+                that.templateDisplay(0) // 递归调用显示函数
+              }
+            } else if (index == 2) {
+              //   that.infoBoardTemplateList = res.data.result
+            } else if (index == 3) {
+              that.templateHtmlList = []
+              res.data.result.forEach((item, i) => {
+                list.forEach((item1) => {
+                  if (item.id == item1.id) {
+                    var str = that.domRender(
+                      item.textInfo,
+                      item1.fillInfo,
+                      item.id,
+                      1
+                    )
+                    var fontColor = ''
+                    let fontSize = Number(item.fontSize.split('*')[0])
+                    switch (item.fontColor) {
+                      case '红色':
+                        fontColor = 'ff0000'
+                        break
+                      case '黄色':
+                        fontColor = 'ffff00'
+                        break
+                      case '绿色':
+                        fontColor = '008000'
+                        break
+                      case '黑色':
+                        fontColor = '000000'
+                        break
+                    }
+
+                    that.templateHtmlList.push({
+                      VMSId: [modelId],
+                      infoType: 'text',
+                      imageUrl: '',
+                      text: str,
+                      textColor: fontColor,
+                      textSize: fontSize,
+                      rollingDirection: 'horizontal',
+                      rollingSpeed: 20,
+                      intervaly: item.intervaly,
+                    })
+                  }
+                })
+              })
+              if (that.templateHtmlList.length > 0) {
+                if (that.tempTimer) {
+                  clearTimeout(that.tempTimer)
+                  that.tempTimer = null
+                }
+                that.templateDisplay(0, 3) // 递归调用显示函数
+              }
+            } else {
+              //   that.infoBoardTemplateList = []
+              //   res.data.result.forEach((item, i) => {
+              //     var form = {
+              //       ...item,
+              //       templateHtml: that.domRender(item.textInfo),
+              //     }
+              //     that.infoBoardTemplateList.push(form)
+              //   })
+            }
+          } else {
+            that.$message.warning(res.data.message)
+          }
+        }
+      })
+    },
+    templateDisplay(index, m) {
+      var that = this
+      if (m == 3) {
+        that.updateVMSInfo(that.templateHtmlList[index])
+      } else {
+        that.templateInfoHtml = that.templateHtmlList[index].html // 显示当前索引的名称
+      }
+      let nextIndex = (index + 1) % that.templateHtmlList.length // 计算下一个索引
+      let nextTime = parseInt(that.templateHtmlList[nextIndex].intervaly) * 1000 // 下一个元素的显示时间
+      that.tempTimer = setTimeout(() => {
+        that.templateDisplay(nextIndex, m) // 递归调用显示函数
+      }, nextTime)
+    },
+    handleAddToTable(node, data) {
+      console.log("添加至表格", node, data);
+      //   let exists = this.tableData.find(
+      //     (obj) => obj.programId === node.data.programId
+      //   );
+      //   if (exists) return this.$message("该项已添加，请勿重复添加！");
+      //   this.tableData.push(data);
+      //   console.log("添加至表格", this.tableData);
+    },
+    filterNode(value, data) {
+      console.log(value, data);
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
+    },
+    getColor(value) {
+      if (value == "#7b5ba1") {
+        return '红'
+      } else if (value == "#008000") {
+        return '绿'
+      } else if (value == "#FFFF00") {
+        return '黄'
+      }
+    },
+    addComment(event, row) {
+      this.tempMap[row.id] = {
+        ...this.tempMap[row.id],
+        [event.target.attributes.idData.value]: event.target.value,
+      }
+      console.log(this.tempMap, 'this.tempMap')
+    },
+    handleCommitClick(index) {
+      var that = this
+      var url = ''
+      that.deviceLoading = true
+      /*if(that.statusTimer){
+        clearTimeout(that.statusTimer)
+        that.statusTimer = null
+      }*/
+      console.log(that.dataForm.command, 'cccccccccccccc')
+      var json = {
+        //deviceId: that.dataForm.deviceId,
+        deviceType: that.dataForm.deviceType,
+        command: that.dataForm.command,
+      }
+      console.log(json, index, 'wwwwww')
+      if (index) {
+        console.log('111')
+        //批量控制
+        if (that.multipleSelection.length > 0) {
+          var deviceIds = []
+          that.multipleSelection.forEach((item) => {
+            deviceIds.push(item.deviceId)
+          })
+          json.deviceId = deviceIds.toString()
+        } else {
+          that.$message.info('请选择')
+          return ''
+        }
+        //that.dataForm.deviceId = json.deviceId
+        url = '/json/iot/iotControlBatch'
+      } else {
+        console.log('222')
+        json.deviceId = that.dataForm.deviceId
+        url = '/xjIotApi/iotServiceCommon/ServiceApiCommon'
+      }
+      console.log('333', url, that.dataForm.deviceType)
+      if (that.dataForm.deviceType == '12') {
+        json.body = JSON.stringify(that.dataFormBody)
+      } else if (that.dataForm.deviceType == '15') {
+        json.command = '15_01'
+        var ids = Object.keys(this.tempMap)
+        var arr = []
+        that.textInfoList.forEach((item1) => {
+          var a = {
+            id: item1,
+            fillInfo: '',
+          }
+          ids.forEach((item) => {
+            if (item == item1) {
+              var fillInfos = Object.values(this.tempMap[item])
+              a.fillInfo = fillInfos.join(';')
+            }
+          })
+          arr.push(a)
+        })
+        json.body = JSON.stringify({ textInfoList: arr })
+      } else if (
+        that.dataForm.deviceType == '40' ||
+        that.dataForm.deviceType == '41' ||
+        that.dataForm.deviceType == '42'
+      ) {
+        const convertedArray = that.dataForm.iotKeys.reduce((acc, curr) => {
+          const [key, value] = curr.split(':')
+          const existing = acc.find((item) => item.startsWith(key))
+
+          if (existing) {
+            const index = acc.indexOf(existing)
+            acc[index] = `${existing},${value}`
+          } else {
+            acc.push(`${key}:${value}`)
+          }
+
+          return acc
+        }, [])
+        json.iotKey = convertedArray.join('|')
+      }
+      console.log(json, url, 'urlurl')
+      if (that.dataForm.deviceType == '13' || that.dataForm.deviceType == '14' || that.dataForm.deviceType == '15' || that.dataForm.deviceType == '19' || that.dataForm.deviceType == '11') {  //单独走的控制接口
+        if (index) { //批量控制
+          console.log(json, that.multipleSelection, '批量')
+          let data = []
+          if (that.multipleSelection.length > 0) {
+            that.multipleSelection.forEach((item) => {
+              let operationInstruction = ""
+              if (that.dataForm.deviceType == '13') {
+                // operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转' : json.command==4 ? '反向左转': ''
+                operationInstruction = json.command == 0 ? '正向通行' : json.command == 1 ? '反向通行' : json.command == 2 ? '封道' : json.command == 3 ? '正向左转' : ''
+              } else if (that.dataForm.deviceType == '14') {
+                operationInstruction = json.command == 1 ? '变红' : json.command == 2 ? '变黄' : json.command == 3 ? '变绿' : ''
+              } else if (that.dataForm.deviceType == '11') {
+                operationInstruction = json.command == 0 ? '停止' : json.command == 1 ? '正转' : json.command == 2 ? '反转' : ''
+              } else if (that.dataForm.deviceType == '19') { // 卷帘门
+                operationInstruction = json.command == 0 ? '停止' : json.command == 1 ? '开' : json.command == 2 ? '关' : ''
+              }
+              data.push({
+                deviceId: item.deviceId,
+                writeOrRead: 'W',
+                operationInstructions: operationInstruction
+              })
+            })
+            // json.deviceId
+            console.log(deviceIds)
+          } else {
+            that.$message.info('请选择')
+            return ''
+          }
+          newIotControlS(data, '/xjIotApi/iotServiceCommon/ServiceApiCommonList').then((res) => {
+            that.deviceLoading = false
+            if (res.data.code == 200) {
+              that.$message.success('成功')
+              that.componentsList.forEach((item) => {
+                if (item.deviceId == that.dataForm.deviceId) {
+                  item.imgUrl =
+                    imgForm['url' + item.direction + '' + item.direction][
+                    j.command
+                    ]
+                }
+              })
+            } else {
+              that.$message.error(res.data.msg)
+            }
+          })
+        } else { //单个控制
+          if (that.dataForm.deviceType == '13' || that.dataForm.deviceType == '14' || that.dataForm.deviceType == '11' || that.dataForm.deviceType == '19') {
+            let operationInstruction = ''
+            if (that.dataForm.deviceType == '13') {
+              //   operationInstruction = json.command==0 ? '正向通行' : json.command==1 ? '反向通行' : json.command==2 ? '封道' : json.command==3 ? '正向左转' :json.command==4 ? '反向左转' : ''
+              operationInstruction = json.command == 0 ? '正向通行' : json.command == 1 ? '反向通行' : json.command == 2 ? '封道' : json.command == 3 ? '正向左转' : ''
+            } else if (that.dataForm.deviceType == '14') {
+              operationInstruction = json.command == 1 ? '变红' : json.command == 2 ? '变黄' : json.command == 3 ? '变绿' : ''
+            } else if (that.dataForm.deviceType == '11') { // 风机
+              operationInstruction = json.command == 0 ? '停止' : json.command == 1 ? '正转' : json.command == 2 ? '反转' : ''
+            } else if (that.dataForm.deviceType == '19') { // 卷帘门
+              operationInstruction = json.command == 0 ? '停止' : json.command == 1 ? '开' : json.command == 2 ? '关' : ''
+            }
+            let data = {
+              deviceId: json.deviceId,
+              writeOrRead: 'W',
+              operationInstructions: operationInstruction
+            }
+            console.log('走这里了  11 风机', data)
+            newIotControl(data, '/xjIotApi/iotServiceCommon/ServiceApiCommon').then((res) => {
+              console.log(res)
+              that.deviceLoading = false
+              if (res.data.code == 200) {
+                that.$message.success('成功')
+                that.componentsList.forEach((item) => {
+                  if (item.deviceId == that.dataForm.deviceId) {
+                    item.imgUrl =
+                      imgForm['url' + item.direction + '' + item.direction][
+                      j.command
+                      ]
+                  }
+                })
+              } else {
+                that.$message.error(res.data.msg)
+              }
+            })
+          } else if (that.dataForm.deviceType == '15') {
+            console.log(that.textInfoList, that.infoBoardTemplateList, that.dataForm, that.dataForm.extraJson, 'xxxxxxxxxxxxxxxxxxxxxx')
+            let checkArr = [] //选中的情报板
+            if (that.textInfoList.length > 0) {
+              that.textInfoList.forEach((item1) => {
+                that.infoBoardTemplateList.forEach((item) => {
+                  if (item1 == item.programId) {
+                    checkArr.push(item)
+                  }
+                })
+              })
+            }
+            console.log(checkArr, '555555555555')
+            // let arr = [
+            //     { id: 1, textInfo: '隧道火灾，禁止驶入' },
+            //     { id: 2, textInfo: '隧道限速{}Km/h' },
+            //     { id: 3, textInfo: '隧道火灾，禁止驶入2' },
+            //     { id: 4, textInfo: '隧道火灾，禁止驶入3' },
+            //     { id: 5, textInfo: '隧道限速{}Km/h,最高速{}Km/h,最低速{}Km/h' },
+            // ];
+            let temp = this.tempMap
+
+            // 遍历 checkArr 数组
+            checkArr.forEach(item => {
+              let text = item.content;
+
+              // 如果 temp 中存在该 id 的数据
+              if (temp[item.programId]) {
+                let replacements = temp[item.programId];
+                let matchCount = 0;
+
+                // 替换每个 {} 占位符
+                text = text.replace(/{}/g, () => {
+                  // 获取当前替换的值（按照顺序）
+                  let replacementKey = `temp${matchCount}`;
+                  matchCount++;
+
+                  // 如果该替换值存在，进行替换
+                  if (replacements[replacementKey]) {
+                    return replacements[replacementKey];
+                  }
+
+                  return '{}'; // 如果没有找到对应的值，保持原样
+                });
+              }
+
+              // 更新 checkArr 中的 textInfo
+              item.content = text;
+            });
+
+            let company = ''
+            if (that.dataForm.extraJson) {
+              let extr = JSON.parse(that.dataForm.extraJson);
+              company = extr.belongs_company
+            }
+            let data = {
+              iotDeviceList: [
+                { deviceId: json.deviceId, manufacturer: company }
+              ],
+              playProgramlist: []
+            }
+            if (checkArr) {
+              checkArr.forEach((val) => {
+                let Size = (val.cmsWidth == 384 && val.cmsHeight == 288) ? '1' : (val.cmsWidth == 128 && val.cmsHeight == 80) ? '2' : (val.cmsWidth == 576 && val.cmsHeight == 48) ? '3' : (val.cmsWidth == 624 && val.cmsHeight == 48) ? '4' : (val.cmsWidth == 128 && val.cmsHeight == 64) ? '5' : ''
+                data.playProgramlist.push(
+                  {
+                    programId: val.programId,
+                    name: val.name,
+                    programType: val.programType,
+                    type: val.type,
+                    displaySize: val.displaySize,
+                    displayMode: val.displayMode,
+                    displaySpeed: val.displaySpeed,
+                    fontFamily: val.fontFamily,
+                    // fontSize: this.convertFontSize(val.fontSize),
+                    // fontColor: this.getHexColor(val.fontColor),
+                    fontSize: val.fontSize,
+                    fontColor: val.fontColor,
+                    alignment: val.alignment,
+                    content: val.content
+                  }
+                )
+                console.log("data.playProgramlist", data.playProgramlist)
+              })
+            }
+            playManuallyTriggered(data, '/xjIotApi/iotServiceCommon/playManuallyTriggered').then((res) => {
+              console.log(res, 'rrrr')
+              that.deviceLoading = false
+            })
+          }
+        }
+        // that.deviceLoading = false
+      }
+      else {
+        iotControl(json, url).then((res) => {
+          that.deviceLoading = false
+          if (res.status == 200) {
+            if (res.data.retCode == 0) {
+              that.$message.success('成功')
+              if (!res.data.result) {
+                return
+              }
+              that.dataForm.status = res.data.result.status
+              that.dataForm.task = res.data.result.task
+              if (that.dataForm.task) {
+                var j = JSON.parse(that.dataForm.task)
+                that.$set(that.dataForm, 'taskName', j.command)
+                //that.$set(that.dataForm,'command',j.command)
+
+                if (j.command != -1) {
+                  let imgForm =
+                    window.config.drapLeftElMap[that.dataForm.deviceType]
+                  if (that.dataForm.deviceType == '11') {
+                    that.componentsList.forEach((item) => {
+                      if (item.deviceId == that.dataForm.deviceId) {
+                        item.imgUrl = imgForm['url' + j.command]
+                      }
+                    })
+                  } else if (that.dataForm.deviceType == '13') {
+                    that.componentsList.forEach((item) => {
+                      if (item.deviceId == that.dataForm.deviceId) {
+                        item.imgUrl =
+                          imgForm['url' + item.direction + '' + item.direction][
+                          j.command
+                          ]
+                      }
+                    })
+                  } else if (that.dataForm.deviceType == '14') {
+                    that.componentsList.forEach((item) => {
+                      if (item.deviceId == that.dataForm.deviceId) {
+                        item.imgUrl = imgForm['urls'][j.command]
+                      }
+                    })
+                  } else if (
+                    that.dataForm.deviceType == '40' ||
+                    that.dataForm.deviceType == '41' ||
+                    that.dataForm.deviceType == '42'
+                  ) {
+                    that.iotKeyData = []
+                    const str1 = that.dataForm.iotKey.split('|')
+                    const str2 = that.dataForm.taskName.split('|')
+                    str1.forEach((item, i) => {
+                      const [name, values] = item.split(':')
+                      const name1 = window.config.pumpMap[name]
+                      const [name2, values2] = str2[i].split(':')
+                      var arr = values.split(',')
+                      var arr2 = values2.split(',')
+
+                      var arr3 = []
+
+                      arr.forEach((item2, i2) => {
+                        if (name == 'ps' || name == 'hs') {
+                          arr3.push({
+                            id: `${name}:${item2}`,
+                            name: i2 + 1 + '#：' + arr2[i2],
+                          })
+                        } else {
+                          arr3.push({
+                            id: `${name}:${item2}`,
+                            name:
+                              i2 +
+                              1 +
+                              '#：' +
+                              that.filedFomatter(arr2[i2], that.taskList),
+                          })
+                        }
+                      })
+                      that.iotKeyData.push({
+                        name: name1,
+                        data: arr3,
+                      })
+                    })
+                  }
+                }
+
+                if (j.body) {
+                  var b = JSON.parse(j.body)
+                  if (that.dataForm.deviceType == '12') {
+                    that.$set(that.dataForm, 'light', b.light)
+                  } else if (that.dataForm.deviceType == '15') {
+                    console.log("b.textInfoList", b.textInfoList)
+                    that.loadinfoBoardTemplate(1, b.textInfoList)
+                  }
+                }
+              }
+              //that.loadTable()
+              //that.loadDevice2(that.dataForm.deviceType)
+            } else {
+              that.$message.warning(res.data.message)
+            }
+          }
+        })
+      }
+    },
+    // 转换fontsize字段
+    convertFontSize(fontSize) {
+      const parts = fontSize.split('*');
+      let size = ''
+      if (parts.length > 1) {
+        size = parts[0];  // 取 * 前面的部分
+      } else {
+        size = '';  // 如果没有 * 号，返回空
+      }
+      return size + 'px'
+    },
+    getHexColor(fontColor) {
+      const colorMapping = {
+        '红色': '#FF0000',
+        '黄色': '#FFFF00',
+        '绿色': '#008000'
+      };
+      // 如果 colorMapping 中存在 fontColor 对应的值，返回其对应的 hex
+      let hexColor = '';
+      if (colorMapping[fontColor]) {
+        hexColor = colorMapping[fontColor];
+      } else {
+        hexColor = '';  // 如果没有匹配的颜色
+      }
+      return hexColor
+    },
+    // 点击画布的时候, 取消选择组件
+    laryerMouseDown() {
+      var that = this
+      that.curControl = null
+    },
+    distanceFromNine(num) {
+      let distance = 0
+      while (num !== 10) {
+        if (num < 10) {
+          num++
+        } else {
+          num--
+        }
+        distance++
+      }
+      return distance
+    },
+    liuliangLine(data) {
+      var that = this
+      var myChart1 = echarts.init(document.getElementById('liuliangLineId'))
+      var sdata = []
+      data.x.forEach((item) => {
+        sdata.push(item.substring(6, 8) + '日' + item.substring(8, 10) + '时')
+      })
+      myChart1.setOption({
+        grid: {
+          left: '0%',
+          right: '0%',
+          top: '10%',
+          bottom: '0%',
+          containLabel: true,
+        },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'line',
+            lineStyle: {
+              color: 'rgba(50, 216, 205, 1)',
+            },
+          },
+        },
+        /*legend: {
+          icon: 'circle',
+          right: '5%',
+          itemWidth: 10,
+          itemGap: 5,
+          textStyle: {
+            color: '#fff',
+            padding: [3, 0, 0, 0],
+          },
+        },*/
+        xAxis: [
+          {
+            type: 'category',
+            boundaryGap: 1,
+            axisLine: {
+              show: false,
+            },
+            axisLabel: {
+              color: 'rgba(255,255,255,0.7)',
+            },
+            splitLine: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+
+            data: sdata,
+          },
+        ],
+        yAxis: [
+          {
+            // max: 1000,
+            minInterval: 1,
+            splitLine: {
+              show: true,
+              lineStyle: {
+                color: 'rgba(255, 255, 255, 0.2)',
+                type: 'dashed',
+              },
+            },
+            axisLine: {
+              show: false,
+            },
+            axisLabel: {
+              show: true,
+              margin: 10,
+              textStyle: {
+                color: 'rgba(255,255,255,0.7)',
+              },
+            },
+            axisTick: {
+              show: false,
+            },
+          },
+        ],
+        series: [
+          {
+            name: '深圳方向',
+            type: 'line',
+            smooth: true,
+            stack: '深圳方向',
+            symbolSize: 5,
+            showSymbol: false,
+            itemStyle: {
+              normal: {
+                color: '#bc7f39',
+                lineStyle: {
+                  color: '#bc7f39',
+                  width: 2,
+                },
+              },
+            },
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  0,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: 'rgba(188,127,57,0.8)',
+                    },
+                    {
+                      offset: 0.5,
+                      color: 'rgba(188,127,57,0)',
+                    },
+                  ],
+                  false
+                ),
+              },
+            },
+            data: data.y2,
+          },
+          {
+            name: '开平方向',
+            type: 'line',
+            smooth: true,
+            stack: '开平方向',
+            symbolSize: 5,
+            showSymbol: false,
+            itemStyle: {
+              normal: {
+                color: '#7CD6CA',
+                lineStyle: {
+                  color: '#7CD6CA',
+                  width: 2,
+                },
+              },
+            },
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  0,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: 'rgba(124, 214, 202, 0.8)',
+                    },
+                    {
+                      offset: 0.5,
+                      color: 'rgba(124, 214, 202,0)',
+                    },
+                  ],
+                  false
+                ),
+              },
+            },
+            data: data.y1,
+          },
+        ],
+      })
+    },
+    getNowTime() {
+      let dateTime
+      let yy = new Date().getFullYear()
+      let mm =
+        new Date().getMonth() + 1 < 10
+          ? '0' + (new Date().getMonth() + 1)
+          : new Date().getMonth() + 1
+      let dd =
+        new Date().getDate() < 10
+          ? '0' + new Date().getDate()
+          : new Date().getDate()
+      let hh =
+        new Date().getHours() < 10
+          ? '0' + new Date().getHours()
+          : new Date().getHours()
+      let mf =
+        new Date().getMinutes() < 10
+          ? '0' + new Date().getMinutes()
+          : new Date().getMinutes()
+      let ss =
+        new Date().getSeconds() < 10
+          ? '0' + new Date().getSeconds()
+          : new Date().getSeconds()
+
+      var days = new Date().getDay()
+      switch (days) {
+        case 1:
+          days = '星期一'
+          break
+        case 2:
+          days = '星期二'
+          break
+        case 3:
+          days = '星期三'
+          break
+        case 4:
+          days = '星期四'
+          break
+        case 5:
+          days = '星期五'
+          break
+        case 6:
+          days = '星期六'
+          break
+        case 0:
+          days = '星期日'
+          break
+      }
+      //dateTime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss + ' ' + days
+      dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf
+      return dateTime
+    },
+    filedFomatter(value, list) {
+      if (value === '' || value == undefined) return ''
+      const item = list.find((item) => item.id == value)
+      return item ? item.name : value
+    },
+    domRender(str, fillInfo, id, index) {
+      var that = this
+      let strData = str
+      //var reg = /\{.*?\}/g
+      let charCount = str.split('{}').length - 1
+      var arr = []
+      if (fillInfo) {
+        arr = fillInfo.split(';')
+      }
+      for (var i = 0; i < charCount; i++) {
+        if (arr.length > 0) {
+          if (index) {
+            strData = strData.replace('{}', arr[i])
+          } else {
+            strData = strData.replace(
+              '{}',
+              '<input idData=temp' +
+              i +
+              ' value="' +
+              arr[i] +
+              '" class="emptyOut" type="number" />'
+            )
+          }
+          that.tempMap[id] = {
+            ...this.tempMap[id],
+            ['temp' + i]: arr[i],
+          }
+        } else {
+          strData = strData.replace(
+            '{}',
+            '<input idData=temp' + i + ' class="emptyOut" type="number" />'
+          )
+        }
+      }
+      return strData
+    },
+  },
+  beforeDestroy() {
+    var that = this
+    if (that.warnTimer) {
+      clearInterval(that.warnTimer)
+      that.warnTimer = null
+    }
+  },
+
+}
+</script>
+
+<style scoped lang="less">
+.input-box {
+  .el-col-5 {
+    max-width: 20%;
+    flex: 0 0 20%;
+  }
+}
+
+.big-main {}
+
+.metadigiee-video-player {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+#VideoPlayer {
+  width: 100%;
+  height: 100%;
+  object-fit: fill;
+}
+
+.infowindow {
+  position: absolute;
+}
+
+.el-tree {
+  padding: 10px;
+}
+
+::v-deep .el-tree-node__expand-icon {
+  //   display: none !important;
+  //   display: none !important;
+}
+
+.custom-tree-node {
+  //  flex: 1;
+  // display: flex;
+  // align-items: center;
+  // justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+  //   line-height: 55px;
+  // display: inline-block;
+  position: relative;
+
+  .label {
+    flex: 1;
+    max-width: 200px !important;
+    display: inline-block;
+    white-space: nowrap;
+    /* 防止文本换行 */
+    overflow: hidden;
+    /* 隐藏溢出的文本 */
+    text-overflow: ellipsis;
+    /* 显示省略号 */
+    // background: saddlebrown;
+  }
+
+  .icon {
+    height: 100%;
+    position: absolute;
+    right: 10px;
+    z-index: 9999 !important;
+  }
+}
+
+.custom-tree-node:hover .node-actions {
+  display: block;
+  position: absolute;
+  right: 0px;
+  top: 3px;
+  z-index: 9999 !important;
+}
+
+.node-actions {
+  display: none;
+}
+
+.header {
+  width: 100%;
+  height: 65px;
+  /*background: url("~@/assets/images/headerBg.png");
+  background-size: auto 100%;*/
+
+  .tunnel-item {
+    width: 170px;
+    height: 42px;
+    font-size: 18px;
+    display: flex;
+    justify-content: center;
+    cursor: pointer;
+    background: url('~@/assets/images/herder_menuBg.png');
+    background-size: 100% 100%;
+    line-height: 42px;
+  }
+
+  .tunnel-item-active {
+    text-align: center;
+    color: #5dd5c8;
+    cursor: pointer;
+    background: url('~@/assets/images/herder_menuBg_c.png');
+    background-size: 100% 100%;
+  }
+}
+
+/*.titleSpan{
+  letter-spacing: 2px;
+  font-size: 26px;
+  color: #FFFFFF;
+  font-weight: 600;
+  background: linear-gradient(0deg, #9AD3FA,  #EFFBFF);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}*/
+
+.main {
+  height: 600px;
+  margin-top: 20px;
+  padding: 0 20px;
+
+  .main-type-item {
+    height: 41px;
+    text-align: center;
+    cursor: pointer;
+    float: left;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 14px;
+    padding: 0 20px;
+    background: url('~@/assets/images/main_typeBg.png');
+    background-size: 100% 100%;
+  }
+
+  .main-type-item-active {
+    color: #5dd5c8;
+    cursor: pointer;
+  }
+
+  .main-device-item {
+    border: 1px solid #ffffff;
+    text-align: center;
+    padding: 6px 20px;
+    float: left;
+  }
+
+  .main-item-p {
+    font-size: 16px;
+    margin: 10px 0;
+  }
+
+  .drap-container {
+    flex: 1;
+    width: 100%;
+    height: 100%;
+    position: relative;
+    float: left;
+    text-align: center;
+
+    .drap-container-item {
+      -webkit-user-select: none;
+      -moz-user-select: none;
+      -o-user-select: none;
+      user-select: none;
+      position: absolute;
+      user-select: none;
+      cursor: pointer;
+      border: 1px solid transparent;
+
+      .drap-item-img {
+        display: block;
+        width: 100%;
+        // height: 80px;
+        user-select: none;
+      }
+
+      .drap-item-name {
+        text-align: center;
+      }
+    }
+
+    .drap-container-item-active {
+      border: 1px solid skyblue;
+    }
+
+    .drap-container-img {
+      vertical-align: middle;
+      /*width: 28px;
+      height: 28px;*/
+    }
+
+    .drap-container-div {
+      background: #09253f;
+      border-radius: 10px;
+      border: 2px solid #969da2;
+      font-size: 12px;
+      display: flex;
+      text-align: center;
+      align-items: center;
+      /*color: #cc3232;*/
+      color: #ccc032;
+      /*color: #25bd2d;*/
+    }
+
+    .drap-container-name {
+      text-align: center;
+    }
+  }
+
+  .dot-container {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 50px;
+    /* 控制横线高度 */
+    border-bottom: 1px solid #a5afc2;
+  }
+
+  .dot {
+    width: 104px;
+    height: 40px;
+    font-size: 12px;
+    background: url('~@/assets/images/main_typeBg.png');
+    background-size: 100% 100%;
+    margin: 0 100px;
+  }
+
+  .dot-span {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    line-height: 23px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .dot-circle {
+    width: 13px;
+    height: 13px;
+    background: url('~@/assets/images/dotCircle.png');
+    background-size: 100% 100%;
+    margin: 0 auto;
+  }
+
+  .dot:first-child:before {
+    margin-left: 0;
+  }
+
+  .dot:last-child:before {
+    margin-right: 0;
+  }
+
+  .dot-container2 {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 50px;
+    /* 控制横线高度 */
+    border-top: 1px solid #a5afc2;
+  }
+
+  .dot-circle2 {
+    width: 13px;
+    height: 13px;
+    background: url('~@/assets/images/dotCircle.png');
+    background-size: 100% 100%;
+    margin: -13px auto 0;
+  }
+}
+
+.footer {
+  height: calc(100% - 700px);
+
+  .title_div {
+    width: calc(100% - 35px);
+    height: 40px;
+    background: url('~@/assets/images/titleBg.png');
+    background-size: 100% 100%;
+    line-height: 40px;
+    padding-left: 35px;
+    font-size: 16px;
+    color: #aed6ff;
+    font-weight: bold;
+    letter-spacing: 1px;
+  }
+
+  .footer-item {
+    width: 100%;
+    height: calc(100% - 60px);
+    margin-top: 20px;
+  }
+
+  .device-bg {
+    width: 100%;
+    height: 100%;
+    background: url('~@/assets/images/device1.png');
+    background-size: 100% 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+  }
+
+  .device-bg2 {
+    background: url('~@/assets/images/device2.png');
+    background-size: 100% 100%;
+  }
+
+  .device-bg3 {
+    background: url('~@/assets/images/device3.png');
+    background-size: 100% 100%;
+  }
+}
+
+.full-screen-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5); // 设置遮罩层的背景颜色和透明度
+  z-index: 98; // 设置遮罩层的层级
+  pointer-events: auto;
+}
+
+.plan-item {
+  width: 480px;
+  height: 683px;
+  position: absolute;
+  left: 384px;
+  top: 130px;
+  z-index: 99;
+  background-color: rgba(13, 35, 76, 0.95);
+  box-shadow: inset 0px 0px 15px #0fcff1;
+  border-radius: 15px;
+  pointer-events: auto;
+}
+
+.control-item {
+  width: 380px;
+  height: 683px;
+  position: absolute;
+  right: 40px;
+  top: 130px;
+  z-index: 99;
+  background-color: rgba(13, 35, 76, 0.95);
+  box-shadow: inset 0px 0px 15px #0fcff1;
+  border-radius: 15px;
+  pointer-events: auto;
+}
+
+.item-frame {
+  border: 1px solid #487ef7;
+  border-radius: 2px;
+  position: relative;
+}
+
+.item-frame-title {
+  margin-top: -12px;
+  background-color: rgb(13, 36, 86);
+  position: absolute;
+  padding: 0 6px;
+  margin-left: 10px;
+  font-size: 16px;
+}
+
+.item-frame-p {
+  color: #cccccc;
+  margin-bottom: 10px;
+}
+
+.warn-item {
+  width: 364px;
+  height: 683px;
+  position: absolute;
+  left: 20px;
+  top: 130px;
+  font-family: SourceHanSansCN;
+  background: url('~@/assets/images/warnBg.png');
+  background-size: 100% 100%;
+  z-index: 99;
+  pointer-events: auto;
+
+  .title {
+    width: 200px;
+    height: 55px;
+    margin: -20px auto 0;
+    background: url('~@/assets/images/warnTitleBg.png');
+    background-size: 100% 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 20px;
+    font-weight: bold;
+    color: #ffffff;
+  }
+
+  .warnBtu {
+    width: 86px;
+    height: 28px;
+    text-align: center;
+    line-height: 25px;
+    font-size: 16px;
+    font-family: SourceHanSansCN;
+    background: url('~@/assets/images/warnBut.png');
+    background-size: 100% 100%;
+    display: inline-block;
+    cursor: pointer;
+  }
+}
+
+.deviceRun-item {
+  width: 544px;
+  height: 683px;
+  position: absolute;
+  left: 25px;
+  top: 130px;
+  font-family: SourceHanSansCN;
+  background: url('~@/assets/images/deviceRunBg.png');
+  background-size: 100% 100%;
+  z-index: 99;
+  pointer-events: auto;
+
+  .title {
+    width: 227px;
+    height: 58px;
+    margin: -20px auto 0;
+    background: url('~@/assets/images/deviceRunTitle.png');
+    background-size: 100% 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 20px;
+    font-weight: bold;
+    color: #ffffff;
+  }
+
+  .runColBg {
+    width: 100%;
+    background-image: url('~@/assets/images/runColBg.png');
+    background-size: 100% 40%;
+    background-position: bottom;
+    background-repeat: no-repeat, repeat;
+    padding: 5px 0;
+    font-family: SourceHanSansCN;
+  }
+
+  .runRowBg {
+    width: 100%;
+    height: 43px;
+    line-height: 45px;
+    background-image: url('~@/assets/images/runRowBg.png');
+    background-size: 100% 100%;
+    text-align: center;
+    color: #ffffff;
+    cursor: pointer;
+    font-size: 14px;
+    font-family: SourceHanSansCN;
+    margin-bottom: 18px;
+  }
+}
+
+.device-View {
+  height: 100%;
+}
+
+.device-View-main {
+  height: calc(100% - 120px);
+  position: relative;
+  margin: 0 auto;
+}
+
+/* 波动效果 */
+.wave {
+  position: relative;
+  text-align: center;
+}
+
+.wave .circle {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  border-radius: 50%;
+  opacity: 0;
+  background: #f36710;
+}
+
+.wave .circle:first-child {
+  animation: circle-opacity 1s infinite;
+}
+
+@keyframes circle-opacity {
+  from {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  to {
+    opacity: 0;
+    transform: scale(1.5);
+  }
+}
+
+// 选择框样式
+/deep/.select-down .el-select {
+  margin-left: 30px !important;
+}
+
+/deep/.select-down .el-input__inner {
+  background: url('~@/assets/images/selectBg.png');
+  width: 365px;
+  height: 45px;
+  border: none;
+  color: #1afff7;
+  padding-left: 30px;
+  font-size: 16px;
+}
+
+/deep/.select-down .el-select .el-select-dropdown {
+  background: RGBA(28, 51, 91, 0.9);
+  border: 1px solid rgba(26, 255, 247, 0.4);
+}
+
+/deep/.select-down .el-popper .popper__arrow::after {
+  border-bottom-color: rgba(26, 255, 247, 0.4);
+}
+
+/deep/.select-down .el-popper .popper__arrow {
+  border-bottom-color: #1c335b;
+}
+
+/deep/.select-down .el-select-dropdown__item {
+  color: #ffffff;
+}
+
+/deep/.select-down .el-select-dropdown__item.selected,
+/deep/.select-down .el-select .el-input .el-select__caret {
+  color: #1afff7;
+}
+
+/deep/.select-down .el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background-color: #3865a9;
+}
+
+/deep/.temlCheckClass .el-checkbox__input {
+  vertical-align: top;
+  padding-top: 2px;
+}
+
+.popper-dropdown {
+  min-width: 80px !important;
+  padding: 0 !important;
+}
+
+.dropdown-item {
+  height: 30px;
+  line-height: 30px;
+  padding-left: 5px;
+  cursor: pointer;
+}
+
+.dropdown-item-active {
+  color: #5dd5c8;
+}
+
+.dropdown-item:hover {
+  background-color: rgba(26, 167, 255, 0.2);
+}
+
+.item-one-block:hover {
+  background-color: rgba(47, 174, 255, 0.2);
+}
+
+.item-one-block2 {
+  background-color: rgba(47, 174, 255, 0.2);
+}
+</style>
+<style>
+.emptyOut {
+  width: 60px;
+  margin: 0 5px;
+}
+
+@media (max-height: 1079px) {
+  .big-main {
+    zoom: 1;
+  }
+
+  .device-main {
+    zoom: 0.8;
+  }
+}
+
+@media (min-height: 1080px) {
+  .big-main {
+    zoom: 1.2;
+  }
+
+  .device-main {
+    zoom: 0.8;
+  }
+
+  #liuliangLineId {
+    zoom: 0.8;
+  }
+}
+
+.el-tree-node__content {
+  display: flex;
+  align-items: center;
+  height: 40px;
+  cursor: pointer;
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 47f749e..40f7a03 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -15,10 +15,12 @@ module.exports = {
         // target: 'http://link.ser99.vip:8080/zhongkai',
         // target: 'http://65.73.11.246:7774',
         // target: 'http://172.16.1.155:8009',
-          target: 'http://172.16.1.103:8084',
+        //   target: 'http://172.16.1.103:8009',
         // target: 'http://172.16.1.162:8233',
         // target: 'http://192.168.13.138:8233',
         // target: 'http://172.16.1.113:8012',
+        //  target: 'http://172.16.1.131:8009',
+         target: 'http://172.16.1.148:8009',
         ws: true,
         https: true,
         pathRewrite: {
@@ -29,7 +31,9 @@ module.exports = {
         //集采  
         // target: 'http://65.73.11.246:8083',
         //  target: 'http://172.16.1.155:8080',
-        target: 'http://172.16.1.103:8084',
+        // target: 'http://172.16.1.103:8083',
+        //   target: 'http://172.16.1.131:8084',
+          target: 'http://172.16.1.148:8084',
         ws: true,
         https: true,
         pathRewrite: {
@@ -39,8 +43,9 @@ module.exports = {
       '/iotApi': {
         //平台
         // target: 'http://65.73.11.246:8090',
-        // target: 'http://172.16.1.155:8080',
-         target: 'http://172.16.1.103:8080',
+        target: 'http://172.16.1.148:8080',
+        //  target: 'http://172.16.1.103:8080',
+        //  target: 'http://172.16.1.131:8080',
         ws: true,
         https: true,
         pathRewrite: {