From 7a9e193dc67ae717aff9cb4e2c89a3e34a9bbcad Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Wed, 24 Jul 2024 13:45:08 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=8E=BB=E9=99=A4=E5=A4=9A=E4=BD=99?=
 =?UTF-8?q?=E7=9A=84=E5=A4=A7=E5=B1=8F=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/bigScreen/cesiumtest0.vue |  173 --
 src/views/bigScreen/index_enp.vue   |  937 -------
 src/views/bigScreen/index_old.vue   | 4048 ---------------------------
 3 files changed, 5158 deletions(-)
 delete mode 100644 src/views/bigScreen/cesiumtest0.vue
 delete mode 100644 src/views/bigScreen/index_enp.vue
 delete mode 100644 src/views/bigScreen/index_old.vue

diff --git a/src/views/bigScreen/cesiumtest0.vue b/src/views/bigScreen/cesiumtest0.vue
deleted file mode 100644
index 221d8407..00000000
--- a/src/views/bigScreen/cesiumtest0.vue
+++ /dev/null
@@ -1,173 +0,0 @@
-
-<template>
-   <div id="mars3dContainer" class="mars3d-container"></div> 
-</template>
- 
-<script>
-// import * as mars3d from "mars3d";
-const Cesium = mars3d.Cesium;
-const point1 = [117.083458,31.655321,42]
-const point2 = [116.027392, 36.413562, 42]
-const point3 = mars3d.PointUtil.getOnLinePointByLen(
-	mars3d.LngLatPoint.toCartesian(point1),
-	mars3d.LngLatPoint.toCartesian(point2),
-	40
-)
-export default {
-  name: 'cesium',
-  data() {
-    return {
-      viewer: null
-    }
-  },
-  created() {
-		const scriptInfo = document.createElement("script");
-		scriptInfo.setAttribute("data-callType", "callScript");
-		scriptInfo.src = "http://mars3d.cn/lib/Cesium/Cesium.js";
-		document.head.appendChild(scriptInfo);
-	},
-  mounted() {
-    const map = new mars3d.Map("mars3dContainer", {
-      scene: {
-        center: { lat: 30.054604, lng: 108.885436, alt: 100, heading: 316, pitch: 10},
-      },
-    })
-    map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。
-    let tilesetLayer = new mars3d.layer.TilesetLayer({
-        type: "3dtiles",
-        name:'超低排放',
-        url: "/3dtiles/tileset.json",
-        popup: "all",
-        scale: 1,
-        // rotation: {x:0, y:1,z: 0 }, // 模型的旋转角度，这里以Z轴为例，表示沿Z轴旋转45度
-        highlight: { type: "click", color: "#00ffff" },
-        flyTo: true, //视角切换到模型所在位置
-        heading: 0, // 航向角，围绕Z轴旋转
-        pitch: -5, // 俯仰角，向上调整
-        roll: 10 // 翻滚角，围绕Y轴旋转
-    });
-    map.addLayer(tilesetLayer);
-    map.on(mars3d.EventType.click, function (event) {
-      let feature = event.pickedObject;
-      //下面只是演示解释底层实现，在平台中直接通过event.graphic.attr可以获取属性
-      console.log("feature", feature);
-      console.log("Cesium.Cesium3DTileFeature", Cesium.Cesium3DTileFeature);
-      console.log(feature instanceof Cesium.Cesium3DTileFeature)
-      if (feature instanceof Cesium.Cesium3DTileFeature) {
-        // let propertyNames = feature.getPropertyNames();
-        // let length = propertyNames.length;
-        // for (var i = 0; i < length; ++i) {
-        //   let propertyName = propertyNames[i];
-        //   console.log(propertyName + ': ' + feature.getProperty(propertyName));
-        // }
-      }
-    })
-    // 创建图层
-    let  GraphicLayer = new mars3d.layer.GraphicLayer({
-        name: "墙",
-        show: true,
-        // 属性
-        strokestyle: "#3388ff",
-        strokewidth: 2,
-        fill: true,
-        fillcolor: "#00ffff",
-        opacity: 0.5,
-        // 样式
-        style: {
-          // 可见范围
-          distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0.0, 200000),
-          // 高度 
-      },
-        semicolon: true
-    })
-    map.addLayer(GraphicLayer);
-    // 矢量对象
-    let wallGraphic = new mars3d.graphic.WallEntity({
-        positions: [point1, point2],
-        // @param [options.allowDrillPick] - 是否允许鼠标穿透拾取
-        allowDrillPick: true,
-        style: {
-          // 可见范围
-          distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0.0, 20000),
-          // 文字墙高度
-          diffHeight:15 ,
-          materialType: mars3d.MaterialType.Text,
-          materialOptions: {
-            text: "显示文本",
-            font_family: "楷体",
-            color: "#00ffff"
-          }
-      },
-        flyTo:true,
-        attr: { remark: "test" }
-    })
-    GraphicLayer.addGraphic(wallGraphic);
-    // 创建标注图片的图形对象[获取设备，并将设备id放入attr中，点击图标时，可获得设备id，根据设备id查询设备相关信息]
-    const graphic = new mars3d.graphic.FontBillboardEntity({
-    position: new mars3d.LngLatPoint(117.084699, 31.65172, 6),
-    style: {
-      image: "img/enp_blue/ball.png",
-      color: "#00ffff",
-      cale: 0.5,
-      horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
-      verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
-      label: {
-        text: "设备名称",
-        font_size: 20,
-        color: "#ff0000",
-        pixelOffsetY: -120,
-        distanceDisplayCondition: true,
-        distanceDisplayCondition_far: 50000,
-        distanceDisplayCondition_near: 0
-      }
-    },
-    attr: { remark: "设备id" }
-    })
-    // 绑定Popup
-    // const inthtml = `<table style="width: auto;">
-    //   <tr>
-    //     <th scope="col" colspan="2" style="text-align:center;font-size:15px;">我是graphic上绑定的Popup </th>
-    //   </tr>
-    //   <tr>
-    //     <td>提示：</td>
-    //     <td>这只是测试信息，可以任意html</td>
-    //   </tr>
-    // </table>`
-    // graphic.bindPopup(inthtml).openPopup()
-    GraphicLayer.addGraphic(graphic);
-    // GraphicLayer.on(mars3d.EventType.click, function (event) {
-    //   console.log("监听layer，单击了矢量对象", event)
-    // })
-    function bindLayerPopup() {
-      GraphicLayer.bindPopup(function (event) {
-        console.log("监听layer，绑定popup", event)
-        const attr = event.graphic.attr || {}
-        attr["类型"] = event.graphic.type
-        attr["来源"] = "我是layer上绑定的Popup"
-        attr["备注"] = "我支持鼠标交互"
-        return mars3d.Util.getTemplateHtml({ title: "矢量图层", template: "all", attr })
-      })
-    }
-    bindLayerPopup();
-    // const graphic2 = new mars3d.graphic.BillboardEntity({
-    //   position: [117.084699, 31.65172, 6],
-    //   style: {
-    //     image: "img/enp_blue/ball.png",
-    //      scale: 1.0,
-    //       horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
-    //       verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
-    //       clampToGround: true
-    //   },
-    //   attr: { remark: "示例1" }
-    // })
-    // GraphicLayer.addGraphic(graphic2);
-  },
-  mothods: {
-   
-  },
-  onUnload() {
-    map.destroy()
-  }
-}
-</script>
-<style></style>
\ No newline at end of file
diff --git a/src/views/bigScreen/index_enp.vue b/src/views/bigScreen/index_enp.vue
deleted file mode 100644
index c4f76504..00000000
--- a/src/views/bigScreen/index_enp.vue
+++ /dev/null
@@ -1,937 +0,0 @@
-<template>
-    <div class="dashboard">
-        <header>
-            <div class="headerImg">水泥有限公司</div>
-            <div style="position: absolute;top:0.9vh;left: 8px;height: 6.5vh;">
-                <div style="display: flex;padding-top: 1.4vh;margin-left: 1vw;">
-                    <div :class="bindClass(0)" @click="menuClick(0)">
-                        <div class="menuItem">首页</div>
-                    </div>
-                    <div :class="bindClass(1)">
-                        <div class="menuItem">
-                            <el-dropdown class="dropdown" trigger="click" @command="handleClick">
-                                <span class="el-dropdown-link">
-                                    有组织排放管理
-                                </span>
-                                <template #dropdown>
-                                    <el-dropdown-menu>
-                                        <el-dropdown-item command="paikou">排放口清单</el-dropdown-item>
-                                        <el-dropdown-item command="CEMS">CEMS监测清单</el-dropdown-item>
-                                        <el-dropdown-item>CEMS监测预警</el-dropdown-item>
-                                        <el-dropdown-item>CEMS报表导出</el-dropdown-item>
-                                    </el-dropdown-menu>
-                                </template>
-                            </el-dropdown>
-                        </div>
-                    </div>
-                    <div :class="bindClass(2)">
-                        <div class="menuItem">
-                            <el-dropdown class="dropdown" trigger="click" @command="handleClick2">
-                                <span class="el-dropdown-link">
-                                    无组织排放管理
-                                </span>
-                                <template #dropdown>
-                                <el-dropdown-menu>
-                                    <el-dropdown-item command="wuran">污染源管控制</el-dropdown-item>
-                                    <el-dropdown-item>智能治理</el-dropdown-item>
-                                    <el-dropdown-item>设备清单</el-dropdown-item>
-                                    <el-dropdown-item>环境质量</el-dropdown-item>
-                                    <el-dropdown-item>台账管理</el-dropdown-item>
-                                </el-dropdown-menu>
-                                </template>
-                            </el-dropdown>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div style="position: absolute;top:0.9vh;right: 8px;height: 65px;">
-                <div style="display: flex;padding-top:  1.4vh;padding-right:  1vw;justify-content: flex-end;">
-                    <div :class="bindClass(3)">
-                      <div class="menuItem">
-                            <el-dropdown class="dropdown" trigger="click" @command="handleClick3">
-                                <span class="el-dropdown-link">
-                                    运输清洁
-                                </span>
-                                <template #dropdown>
-                                    <el-dropdown-menu>
-                                        <el-dropdown-item command="changwai">场外运输</el-dropdown-item>
-                                        <el-dropdown-item command="inner">场内清洁</el-dropdown-item>
-                                    </el-dropdown-menu>
-                                </template>
-                            </el-dropdown>
-                        </div>
-                        <div class="menuItem">运输清洁</div>
-                    </div>
-                    <div :class="bindClass(4)">
-                        <div class="menuItem">环保管理</div>
-                    </div>
-                    <div :class="bindClass(5)">
-                        <div class="menuItem">台账管理</div>
-                    </div>
-                    <div class="wraning_icon"></div>
-                    <div class="user_icon"></div>
-                </div>
-            </div>
-        </header>
-        <el-main style="padding:0;overflow: hidden;">
-            <div v-show="activeIndex==0" class="model">
-                <div id="loadingScreen">
-                    <el-progress type="circle" :percentage="loadedPercent" :width=220 status="warning">
-                    <template #default="{ percentage }">
-                        <div style="font-size: 30px; color: white; font-weight: bold">{{ percentage }}%</div>
-                        <div style="font-size: 18px; color: white; margin-top: 10px">工厂模型加载中</div>
-                    </template>
-                    </el-progress>
-                </div>
-                <canvas id="renderCanvas"></canvas>
-            </div>
-            <div v-show="activeIndex==0" class="left_other animate__animated animate__backInLeft">
-                <div class="panel">
-                    <div class="chart" id="chart1">
-                        <img src="img/ignore/left1.png" style="width: 100%;height: 100%;">
-                    </div>
-                </div>
-                <div class="panel">
-                    <div class="chart" id="chart2">
-                        <img src="img/ignore/left2.png" style="width: 100%;height: 100%;">
-                    </div>
-                </div>
-                <div class="panel">
-                    <div class="chart" id="chart3">
-                        <img src="img/ignore/left3.png" style="width: 100%;height: 100%;">
-                    </div>
-                </div>
-            </div>
-            <div v-show="activeIndex==0" class="right_other animate__animated animate__backInRight">
-                <div class="panel">
-                    <div class="chart" id="chart4">
-                        <img src="img/ignore/right1.png" style="width: 100%;height: 100%;">
-                    </div>
-                </div>
-                <div class="panel">
-                    <div class="chart" id="chart5">
-                        <img src="img/ignore/right2.png" style="width: 100%;height: 100%;">
-                    </div>
-                </div>
-            </div>
-            <div v-show="activeIndex==0" class="left_border"></div>
-            <div v-show="activeIndex==0" class="right_border"></div>
-            <div v-show="activeIndex==0" class="btns_enp"></div>
-            <div v-show="activeIndex==0" class="bottom_enp"></div>
-            <!--  -->
-            <div v-if="activeIndex!=0" class="container">
-                <div class="sysName">智能环保一体化管控平台</div>
-                <img v-show="activePage==1" src="img/ignore/emission.jpg" @click="pageClick(101)" class="pageClass">
-                <img v-show="activePage==2" src="img/ignore/CEMS.jpg" @click="pageClick(201)" class="pageClass">
-                <img v-show="activePage==3" src="img/ignore/wuran.jpg" @click="pageClick(301)" class="pageClass">
-                <img v-show="activePage==4" src="img/ignore/car.jpg" class="pageClass">
-                <img v-show="activePage==5" src="img/ignore/transportation.jpg" class="pageClass">
-                <img v-show="activePage==101" src="img/ignore/emission_detail.jpg" @click="pageClick(1)" class="pageClass">
-                <img v-show="activePage==201" src="img/ignore/CEMS_detail.jpg" @click="pageClick(2)" class="pageClass">
-                <img v-show="activePage==301" src="img/ignore/wuran_detail.jpg" @click="pageClick(3)" class="pageClass">
-            </div>
-        </el-main>
-    </div>
-</template>
-  <script>
-  import * as echarts from "echarts";
-  import * as BABYLON from "babylonjs"
-  import * as BABYLON_GUI from "babylonjs-gui"
-  import * as BABYLON_GRID from "@/utils/gridMaterial"
-  import * as BABYLON_MATERIAL from "@/utils/babylonMaterial"
-  import 'babylonjs-loaders';
-  import 'animate.css';
-  export default {
-    data() {
-      return {
-        isCollapse:false,
-        nowDay: 1,
-        initialAlpha: -Math.PI / 0.89,
-        initialBeta: Math.PI / 3.3,
-        initialRadius: 18,
-        initialTarget: null,
-        scene: null,
-        myui: null,
-        is_mainviewpoint: false,
-        resizeTimeout: null,
-        engine: null,
-        loadedPercent: 0,
-        sectionNames: {
-        "干渣库_primitive0": "电石渣",
-        "原料磨及废气处理_primitive0": "原料磨",
-        "窑": "回转窑",
-        "煤粉制备_primitive1": "煤磨",
-        "水泥磨房_primitive0": "水泥磨",
-        "水泥储存及散装库_primitive2": "水泥包装",
-        // "停车场": "停车场"
-      },
-        showKgcet: true,
-        currentLightMesh: null,
-        activePage:0,
-        activeIndex: 0,
-        activeSection: 2,
-        activeSectionName: '回转窑',
-        updateTime: '2023-08-17 16:00:00',
-        basicOption: {
-          backgroundColor: '',
-          series: [
-            {
-              name: '销量',
-              type: 'bar',
-              barwidth: 10,
-              label: {
-                show: true,
-                position: 'top'
-              },
-              itemStyle: {
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  { offset: 0, color: '#83bff6' },
-                  { offset: 0.5, color: '#188df0' },
-                  { offset: 1, color: '#188df0' }
-                ])
-              },
-              emphasis: {
-                itemStyle: {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                    { offset: 0, color: '#2378f7' },
-                    { offset: 0.7, color: '#2378f7' },
-                    { offset: 1, color: '#83bff6' }
-                  ])
-                }
-              },
-              data: []
-            }
-          ],
-          grid: { // 让图表占满容器
-            top: "10%",
-            left: "12%",
-            right: "0px",
-            bottom: "15%"
-          }
-        },
-        chart1Option: {},
-        seriesData1: [0, 0, 0, 0, 0, 0],
-        ws: null,
-        mgroupValues: {
-          电石渣: { total: '0', elec: '0' },
-          原料磨: { total: '0', elec: '0' },
-          煤磨: { total: '0', elec: '0' },
-          回转窑: { total: '0', elec: '0' },
-          水泥磨: { total: '0', elec: '0' },
-          水泥包装: { total: '0', elec: '0' }
-        },
-      }
-    },
-    mounted() {
-      let that= this;
-      this.addListener();
-      this.initDomStyle();
-      this.$nextTick(() => {
-        setTimeout(function () {
-          that.initFactory();
-        }, 1000);
-      });
-    },
-    beforeUnmount() {
-      // 性能优化
-      const canvas = document.getElementById('renderCanvas');
-      if (canvas) {
-        canvas.parentNode.removeChild(canvas);
-      }
-    },
-    methods: {
-        initDomStyle() {
-        // 获取窗口的总高度
-        var windowHeight = window.innerHeight;
-        var windowWidth = window.innerWidth;
-        // 获取目标元素
-        var dashboard = document.getElementsByClassName('dashboard')[0];
-        var left_other = document.getElementsByClassName('left_other')[0];
-        var right_other = document.getElementsByClassName('right_other')[0];
-        var model = document.getElementsByClassName('model')[0];
-        if (windowWidth > 960) {
-          dashboard.style.overflow = 'hidden';
-          // 设置目标元素的高度
-          left_other.style.position = 'absolute';
-          left_other.style.width = '20%';
-          right_other.style.position = 'absolute';
-          right_other.style.width = '20%';
-          model.style.position = 'absolute';
-          model.style.height = (windowHeight - 4) + 'px';
-          model.style.top = 0;
-
-          var chartHeight1 = (100-18) *0.31 + 'vh';
-          var chartHeight2 = (100-18) *0.37 + 'vh';
-          var chartHeight3 = (100-17) *0.28 + 'vh';
-          var chartHeight4 = (100-17) *0.715 + 'vh';
-          var charts = document.getElementsByClassName('chart')
-          for (var i = 0; i < charts.length; i++) {
-            var chart = charts[i]
-            switch (i) {
-              case 0:
-                chart.style.height = chartHeight1;
-                break;
-              case 1:
-                chart.style.height = chartHeight1;
-                break;
-              case 2:
-                chart.style.height = chartHeight2;
-                break;
-              case 3:
-                chart.style.height = chartHeight3;
-                break;
-              case 4:
-                chart.style.height = chartHeight4;
-                break;
-            }
-            chart.style.height = chartHeight;
-          }
-        }
-        else {
-          dashboard.style.overflow = 'auto';
-          var chartHeight = windowWidth * 0.6;
-          left_other.style.position = 'static';
-          left_other.style.width = '100%';
-          right_other.style.position = 'static';
-          right_other.style.width = '100%';
-          model.style.position = 'relative';
-          model.style.height = chartHeight;
-          var charts = document.getElementsByClassName('chart')
-          for (var i = 0; i < charts.length; i++) {
-            var chart = charts[i]
-            chart.style.height = chartHeight;
-          }
-        }
-        if (this.engine != null) {
-          this.engine.resize();
-        }
-      },
-      // 动态绑定Class
-      bindClass(index) {
-        let that = this;
-        let classInfo = {menuWrap: true, menuWrap1: false, menuWrap2: false,menuWrapActive: false};
-        if(index==that.activeIndex){
-            classInfo.menuWrapActive = true;
-        }
-        if (index == 1 ||index == 2) {
-          classInfo.menuWrap2 = true;
-        }else{
-            classInfo.menuWrap1 = true;
-        }
-        return classInfo
-      },
-      menuClick(){
-        this.activeIndex = 0;
-      },
-      handleClick(command){
-        this.activeIndex = 1;
-        if(command == "paikou"){
-            this.activePage = 1;
-        }else if(command == "CEMS"){
-            this.activePage = 2;
-        }
-      },
-      handleClick2(command){
-        this.activeIndex = 2;
-        if(command == "wuran"){
-            this.activePage = 3;
-        }
-      },
-      handleClick3(command){
-        this.activeIndex = 3;
-        if(command == "changwai"){
-            this.activePage = 5;
-        }else if(command=='inner'){
-          this.activePage = 4;
-        }
-      },
-      pageClick(page){
-        this.activePage = page;
-      },
-      getMessage(msg) {
-        console.log(msg);
-      },
-      close() {
-        if (this.ws) {
-          this.ws.close();
-          this.ws = null;
-          console.log("socket已经关闭");
-        }
-      },
-      compare(property) {
-        return function (a, b) {
-          return a[property] - b[property];
-        }
-      },
-      initCharts() {
-        let that = this;
-        function deepCopy(obj) {
-          return JSON.parse(JSON.stringify(obj));
-        }
-        // 初始化所有表格
-        that.basicOption.xAxis.data = that.xAxisData;
-        that.chart1Option = deepCopy(that.basicOption)
-        that.chart1Option.series = [
-          {
-            name: '电耗',
-            type: 'bar',
-            barWidth: 15,
-            label: {
-              show: true,
-              position: 'top'
-            },
-            emphasis: {
-              focus: 'series'
-            },
-            data: that.seriesData1
-          }]
-        that.setChart('chart1', that.chart1Option);
-      },
-      addListener() {
-        var that = this;
-        window.addEventListener('resize', function () {
-          // 如果已经有 resizeTimeout，清除它
-          if (this.resizeTimeout) {
-            clearTimeout(this.resizeTimeout);
-          }
-          // 设置一个新的 resizeTimeout，延迟调整样式
-          this.resizeTimeout = setTimeout(function () {
-            that.initDomStyle()
-          }, 300); // 延迟 300 毫秒，可以根据需要调整
-        });
-      },
-      
-      resizeChart(name) {
-        // 根据name resize chart
-        var myChart = echarts.getInstanceByDom(document.getElementById(name));
-        if (myChart != undefined) {
-          // console.log(name + ' :resize')
-          myChart.resize();
-        }
-      },
-      setChart(name, option = null) {
-        // 根据name 渲染数据, option需填写，否则option为模拟数据
-        var myChart = echarts.getInstanceByDom(document.getElementById(name));
-        if (myChart == undefined) {
-          myChart = echarts.init(document.getElementById(name), 'dark', { renderer: 'svg' });
-        }
-        if (option == null) {
-          option = Object.assign({}, this.basicOption)
-        }
-        setTimeout(() => {
-          try {
-            myChart.setOption(option);
-          } catch (error) { }
-        }, 500)
-      },
-      initFactory() {
-        var that = this;
-        const canvas = document.getElementById("renderCanvas"); // Get the canvas element
-        const engine = new BABYLON.Engine(canvas, true); // Generate the BABYLON 3D engine
-        BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function () {
-        }
-        BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function () {
-          document.getElementById("loadingScreen").style.display = "none";
-        }
-        engine.displayLoadingUI();
-        // Add your code here matching the playground format
-        const createScene = function () {
-          const scene = new BABYLON.Scene(engine);
-          scene.clearColor = BABYLON.Color3.Black(); //BABYLON.Color3(1, 0, 1); 
-          const ground = BABYLON.MeshBuilder.CreateGround("ground", { width: 100, height: 100 });
-          const groundMaterial = new BABYLON_GRID.GridMaterial("groundMaterial", scene);
-          groundMaterial.majorUnitFrequency = 5;
-          groundMaterial.minorUnitVisibility = 0.5;
-          groundMaterial.gridRatio = 2;
-          // groundMaterial.opacity = 0.99;
-          ground.material = groundMaterial;
-          ground.position.y = -0.1
-          // 加载背景图片
-          const backgroundImage = new BABYLON.Layer('', 'img/ignore/backgroundEnp.jpg', scene, true);
-          const camera = new BABYLON.ArcRotateCamera("camera", that.initialAlpha, that.initialBeta, that.initialRadius, new BABYLON.Vector3(0, 0, 1.2));
-          that.initialTarget = camera.getTarget();
-          camera.upperBetaLimit = Math.PI / 2.3; //无法移动到地面以下
-          camera.attachControl(canvas, true);
-          camera.maxZ = 1000; // 调整适当的值
-          // 相机限制
-          camera.lowerRadiusLimit = 6;
-          camera.upperRadiusLimit = 18;
-          // 灯光
-          const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(1, 1, 0));
-          light.intensity = 1.6;
-          // 全屏GUI
-          const advancedTexture = BABYLON_GUI.AdvancedDynamicTexture.CreateFullscreenUI("myUI");
-          that.myui = advancedTexture;
-          // 创建一个高亮层
-          const highlightLayer = new BABYLON.HighlightLayer('highlightLayer', scene);
-          // 主控制区
-          var control_main = new BABYLON_GUI.StackPanel();
-          control_main.isVertical = false
-          control_main.top = '-40%';
-          control_main.left = '-20%';
-          advancedTexture.addControl(control_main);
-  
-          var button_main = BABYLON_GUI.Button.CreateSimpleButton("button_main", "主视角");
-          button_main.width = "80px"
-          button_main.height = "30px";
-          button_main.color = "white";
-          button_main.cornerRadius = 20;
-          button_main.background = "green";
-          control_main.addControl(button_main)
-          button_main.onPointerClickObservable.add(() => {
-            if (camera.alpha != that.initialAlpha || camera.beta != that.initialBeta || camera.radius != that.initialRadius) {
-              var cameraPosition = new BABYLON.Vector3(
-                0 + that.initialRadius * Math.sin(that.initialBeta) * Math.cos(that.initialAlpha),
-                0 + that.initialRadius * Math.cos(that.initialBeta),
-                0 + that.initialRadius * Math.sin(that.initialBeta) * Math.sin(that.initialAlpha)
-              );
-              var ease = new BABYLON.CubicEase();
-              ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE_EASEINOUT);
-              BABYLON.Animation.CreateAndStartAnimation('at6', camera, 'position', 45, 200, camera.position, cameraPosition, 0, ease);
-              BABYLON.Animation.CreateAndStartAnimation('at61', camera, 'target', 45, 200, camera.target, that.initialTarget, 0, ease);
-            }
-          })
-  
-          // 高亮显示mesh名
-          const mesh_rect = new BABYLON_GUI.Rectangle('mesh_rect');
-          mesh_rect.width = "100px";
-          mesh_rect.height = "25px";
-          mesh_rect.background = 'orange';
-          mesh_rect.alpha = 0.6;
-          mesh_rect.isVisible = false;
-          advancedTexture.addControl(mesh_rect);
-  
-          var mesh_name = new BABYLON_GUI.TextBlock('mesh_name');
-          mesh_name.text = "";
-          mesh_name.color = 'white';
-          mesh_name.fontSize = '14px';
-          mesh_rect.addControl(mesh_name);
-          var remoteGlbUrl = config.HOST_URL + "/media/model/factory.glb";
-          // var remoteGlbUrl = process.env.VUE_APP_BASEURL + "/media/model/factory.glb";
-          BABYLON.SceneLoader.Append(remoteGlbUrl, "", scene, function (scene) {
-            for (let key in that.sectionNames) {
-              const value = that.sectionNames[key];
-              const mesh = scene.getMeshByName(key);
-              if (mesh) {
-                const img = new BABYLON_GUI.Image('img', 'img/ignore/qm_enp.png');
-                img.width = '50px';
-                img.height = '50px';
-                img.top = '50%';
-                img.left = '50%';
-                img.horizontalAlignment = 10;
-                img.verticalAlignment = 10;
-                //建筑标签
-                const rect1 = new BABYLON_GUI.Rectangle(value + '_rect');
-                rect1.width = "60px";
-                rect1.height = "30px";
-                rect1.cornerRadius = 4;
-                rect1.color = "Orange";
-                rect1.thickness = 2;
-                rect1.background = "green";
-                rect1.isPointerBlocker = true; // 防止点击穿透
-                advancedTexture.addControl(img);
-                var label = new BABYLON_GUI.TextBlock(value + '_label');
-                label.text = value;
-                label.color = 'white';
-                label.fontSize = '14px';
-                img.linkWithMesh(mesh);
-                rect1.onPointerDownObservable.add(() => {
-  
-                  const mesh = rect1.linkedMesh;
-                  if (camera.target != mesh.position) {
-                    // console.log('fly to')
-                    // 计算新的相机位置
-                    let position = mesh._parentNode._position
-                    if (mesh._parentNode.id == '__root__') {
-                      position = mesh.position
-                    }
-                    const cameraPosition = new BABYLON.Vector3(
-                      mesh.position.x + 9 * Math.sin(camera.beta) * Math.cos(Math.PI),
-                      mesh.position.y + 9 * Math.cos(camera.beta),
-                      mesh.position.z + 9 * Math.sin(camera.beta) * Math.sin(Math.PI)
-                    );
-                    var ease = new BABYLON.CubicEase();
-                    ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE_EASEINOUT);
-                    BABYLON.Animation.CreateAndStartAnimation('at5', camera, 'position', 45, 200, camera.position, cameraPosition, 0, ease);
-                    BABYLON.Animation.CreateAndStartAnimation('at51', camera, 'target', 45, 200, camera.target, position, 0, ease);
-                  }
-                  let dataViewName = rect1.name.split('_')[0] + '_data_view';
-                  that.activeSectionName = dataViewName;
-                  that.activeSection = 2;
-                  let dataView = advancedTexture.getControlByName(dataViewName);
-                  if (dataView) {
-                    // // 在这里进行矩形的操作
-                    dataView.isVisible = false;
-                  }
-                });
-                // 创建一个数据展示层,创建一个StackPanel，用于容纳多个文本控件
-                const data_view = new BABYLON_GUI.StackPanel(value + '_data_view');
-                data_view.width = '200px'; // StackPanel的宽度
-                data_view.height = '140px';
-                data_view.thickness = 1;
-                data_view.background = 'rgba(0, 34, 51, 0.5)';//暗色
-                let mgroupName = new BABYLON_GUI.TextBlock(value + '_label');
-                mgroupName.height = "30px";
-                mgroupName.width = "120px";
-                mgroupName.color = "white";
-                mgroupName.text = value;
-                mgroupName.shadowColor = '#66b1ff';
-                mgroupName.shadowBlur = 5;
-                mgroupName.shadowOffsetX = -2;
-                mgroupName.shadowOffsetY = 2;
-                data_view.addControl(mgroupName);
-                const mgroup = new BABYLON_GUI.Rectangle('mgroup');
-                mgroup.height = "3px";
-                mgroup.width = "160px";
-                mgroup.thickness = 0;
-                mgroup.background = 'rgba(44, 237, 255, 0.45)';
-                data_view.addControl(mgroup);
-                var grid = new BABYLON_GUI.Grid("grid");
-                grid.width = '200px';
-                grid.height = '70px';
-                grid.paddingLeft = 1;
-                var wd = 2;
-                var hd = 2;
-                for (let i = 0; i < wd; i++) {
-                  grid.addRowDefinition(1 / wd);
-                }
-                for (let j = 0; j < hd; j++) {
-                  grid.addColumnDefinition(1 / hd);
-                }
-                // for (let i = 0; i < wd; i++) {
-                //   for (let j = 0; j < hd; j++) {
-                //     var rc = new BABYLON_GUI.TextBlock("rc" + i + j);
-                //     rc.width = "100%";
-                //     // rc.height = "100%";
-                //     rc.thickness = 0;
-                //     if (j == 0 && i == 0) {
-                //       rc.width = "120px";
-                //       rc.text = "产品产量：";
-                //       rc.color = "white";
-                //       rc.fontSize = '16px';
-                //     } else if (j == 0 && i == 1) {
-                //       rc.width = "120px";
-                //       rc.color = "white";
-                //       rc.fontSize = '16px';
-                //       rc.text = "单位产品电耗：";
-                //     } else if (j == 1 && i == 0) {
-                //       // rc.text = that.mgroupValues[value].total;
-                //       rc.text = "123";
-                //       rc.width = "80px";
-                //       rc.fontSize = '18px';
-                //       rc.color = "rgb(44,237,255)";
-                //     } else if (j == 1 && i == 1) {
-                //       // rc.text = that.mgroupValues[value].total;
-                //       rc.text = "456";
-                //       rc.width = "80px";
-                //       rc.fontSize = '18px';
-                //       rc.color = "rgb(44,237,255)";
-                //     }
-                //     grid.addControl(rc, i, j);
-                //   }
-                // }
-                data_view.addControl(grid);
-                var mgroup_close = BABYLON_GUI.Button.CreateSimpleButton("mgroup_close" + value, '关闭');
-                mgroup_close.width = "70px"
-                mgroup_close.height = "25px";
-                mgroup_close.color = "white";
-                mgroup_close.cornerRadius = 15;
-                mgroup_close.fontSize = '12px';
-                mgroup_close.background = 'rgb(44,237,255,.5)';
-                mgroup_close.HORIZONTAL_ALIGNMENT_RIGHT = 5;
-                mgroup_close.onPointerClickObservable.add(() => {
-                  console.log('data_view', data_view)
-                  data_view.isVisible = false;
-                })
-                // data_view.addControl(mgroup_close);
-                // 将StackPanel添加到GUI系统中
-                // advancedTexture.addControl(data_view);
-                data_view.linkWithMesh(mesh);
-                data_view.linkOffsetY = -120;
-                if (value == '电石渣') {
-                  data_view.linkOffsetY = -290;
-                }
-              }
-            }
-            engine.hideLoadingUI()
-          },
-            function (evt) {
-              var loadedPercent = 0;
-              if (evt.lengthComputable) {
-                loadedPercent = parseInt(evt.loaded * 100 / evt.total);
-              } else {
-                var dlCount = evt.loaded / (1024 * 1024);
-                loadedPercent = Math.floor(dlCount * 100.0) / 100.0;
-              }
-              that.loadedPercent = loadedPercent;
-            })
-          // 自动旋转checkbox
-          var checkbox = new BABYLON_GUI.Checkbox();
-          checkbox.width = "20px";
-          checkbox.height = "20px";
-          checkbox.isChecked = false;
-          checkbox.marginLeft = '16px'
-          checkbox.color = "green";
-          checkbox.onIsCheckedChangedObservable.add(function (value) {
-            if (value) {
-              camera.useAutoRotationBehavior = true;
-            } else {
-              camera.useAutoRotationBehavior = false;
-            }
-          });
-          control_main.addControl(checkbox);
-          var header = new BABYLON_GUI.TextBlock();
-          header.text = "自动旋转";
-          header.width = "80px";
-          header.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
-          header.color = "white";
-          control_main.addControl(header);
-          // 工段数据checkbox
-          // var checkbox1 = new BABYLON_GUI.Checkbox();
-          // checkbox1.width = "20px";
-          // checkbox1.height = "20px";
-          // checkbox1.isChecked = true;
-          // checkbox1.marginLeft = '16px'
-          // checkbox1.color = "green";
-          // checkbox1.onIsCheckedChangedObservable.add(function (value) {
-          //   if (value) {
-          //     for (let key in that.sectionNames) {
-          //       let name = that.sectionNames[key] + '_data_view';
-          //       console.log(name)
-          //       let dataView = advancedTexture.getControlByName(name);
-          //       dataView.isVisible = true;
-          //     }
-          //   } else {
-          //     for (let key in that.sectionNames) {
-          //       let name = that.sectionNames[key] + '_data_view';
-          //       console.log(name)
-          //       let dataView = advancedTexture.getControlByName(name);
-          //       dataView.isVisible = false;
-          //     }
-          //   }
-          // });
-          // control_main.addControl(checkbox1);
-          // var header1 = new BABYLON_GUI.TextBlock();
-          // header1.text = "工段数据";
-          // header1.width = "80px";
-          // header1.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
-          // header1.color = "white";
-          // control_main.addControl(header1);
-          // 添加抓取事件
-          canvas.addEventListener('mousemove', (event) => {
-            // 使用 scene.pick 检测鼠标拾取
-            const pickResult = scene.pick(scene.pointerX, scene.pointerY);
-            if (that.currentLightMesh) {
-              mesh_rect.isVisible = false;
-              highlightLayer.removeAllMeshes();
-            }
-            if (pickResult.hit) {
-              const mesh = pickResult.pickedMesh;
-              highlightLayer.removeAllMeshes();
-              if (/.*[\u4e00-\u9fa5]+.*$/.test(mesh.name) && mesh.name !== '地面1' && mesh.name !== '绿地' && mesh.name !== '停车场') {
-                // 在选中的 mesh 上添加高亮效果
-                highlightLayer.addMesh(mesh, new BABYLON.Color3(1, 1, 0.5));
-                that.currentLightMesh = mesh;
-                mesh_rect.linkWithMesh(mesh);
-                let name = mesh.name.split('_')[0];
-                mesh_name.text = name;
-                mesh_rect.isVisible = true;
-              }
-            }
-          });
-          // checkbox.isChecked = true; //默认开启自动旋转
-          return scene;
-        };
-  
-        const scene = createScene();
-        // scene.debugLayer.show()
-        engine.runRenderLoop(function () {
-          scene.render();
-        });
-        this.engine = engine;
-        this.scene = scene;
-        window.addEventListener("resize", function () {
-          engine.resize();
-        });
-      },
-    },
-    unmounted() {
-      this.close();
-    },
-  }
-</script>
-<style scoped>
-.container{
-    width: 100%;
-    position: absolute;
-    height: 100vh;
-    top: 0vh;
-    z-index: 0;
-    padding-top: 8vh;
-    box-sizing: border-box;
-    background-image: url('/public/img/ignore/backgroundEnp.jpg');
-    background-size: cover;
-}
-  .dashboard {
-    background-color: black;
-    font-family: Inter, "-apple-system", BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "noto sans", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  }
-  header {
-    z-index: 10;
-    display: flex;
-    position: relative;
-    align-items: center;
-    box-sizing: border-box;
-    padding: 1.3vh 0.4vw 0 0.4vw;
-    justify-content: space-between;
-  }
-  .headerImg{
-    width: 100%;
-    height: 6vh;
-    line-height: 6vh;
-    color: #ffffff;
-    font-size: 1.8vw;
-    text-align: center;
-    background-size: 100% 100%;
-    background-position: center;
-    background-image: url('/public/img/ignore/header_enp.png');
-  }
-  .sysName{
-    color: #ffffff;
-    padding-left: 1vw;
-    font-size: 2vh;
-  }
-  .btns_enp{
-    bottom: 7vh;
-    left:28.7vw;
-    width: 42.6vw;
-    height: 4.3vh;
-    position: absolute;
-    background-size: 100% 100%;
-    background-position: center;
-    background-image: url('/public/img/ignore/btns_enp.png');
-  }
-  .bottom_enp{
-    left: 0;
-    bottom: 0;
-    width: 100%;
-    height: 5vh;
-    position: absolute;
-    background-size: 100% 100%;
-    background-position: center;
-    background-image: url('/public/img/ignore/bottom_enp.png');
-  }
-  .menuWrap{
-    height: 4vh; 
-    margin-right: 1vw;
-  }
-  .menuWrap1{
-    width: 4.4vw;
-    background-image: url('/public/img/ignore/enp_menu_img1.png');
-    background-size: cover;
-  }
-  .menuWrap1:hover,.menuWrapActive.menuWrap1{
-    background-image: url('/public/img/ignore/enp_menu_img_active1.png');
-    background-size: cover;
-  }
-  .menuWrap2{
-    width: 7vw;
-    background-image: url('/public/img/ignore/enp_menu_img2.png');
-    background-size: cover;
-  }
-  .menuWrap2:hover,.menuWrapActive.menuWrap2{
-    color: #ffffff;
-    background-image: url('/public/img/ignore/enp_menu_img_active2.png');
-  }
-  .menuItem{
-   color: #ffffff;
-   line-height: 4vh;
-   font-size: 1.5vh;
-   text-align: center;
-  }
-  .dropdown{
-    color: #ffffff;
-    line-height: 4vh;
-    font-size: 1.4vh;
-  }
-    .wraning_icon{
-        width: 2vh;
-        height: 2.3vh;
-        margin-top: 0.9vh;
-        background-size: cover;
-        background-image: url('/public/img/ignore/warning_enp.png');
-    }
-    .user_icon{
-        width: 2.3vh;
-        height: 2.3vh;
-        margin-top: 0.9vh;
-        margin-left: 2vh;
-        background-size: cover;
-        background-image: url('/public/img/ignore/user_enp.png');
-    }
-    
-
-  .model {
-    top: 0;
-    left: 0;
-    width: 100%;
-    background-image: url('/public/img/ignore/backgroundEnp.jpg');
-    background-size: cover;
-  }
-  #renderCanvas {
-    width: 100%;
-    height: 100%
-  }
-  #loadingScreen {
-    position: absolute;
-    width: 100%;
-    top: 260px;
-    color: white;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 30px;
-  }
-  .left_other,
-  .right_other {
-    position: absolute;
-    top: 8vh;
-    width: 20%;
-    padding: 10px;
-  }
-  .right_other {
-    right: 0
-  }
-  .panel {
-    margin-top: 1.5vh;
-  }
-  .chart {
-    width: 100%;
-    height: 220px;
-  }
- .left_border{
-    width: 1vh;
-    height: 70vh;
-    position: absolute;
-    left: 21%;
-    top: 15vh;
-    background-size: cover;
-    background-image: url('/public/img/ignore/left_border.png');
- }
- .right_border{
-    width: 1vh;
-    height: 70vh;
-    position: absolute;
-    right: 21%;
-    top: 15vh;
-    background-size: cover;
-    background-image: url('/public/img/ignore/right_border.png');
- }
-.pageClass{
-  width: 100%;
-  height: 89vh;
-  position: absolute;
-  bottom: 0;
-  left: 0;
-}
-</style>
\ No newline at end of file
diff --git a/src/views/bigScreen/index_old.vue b/src/views/bigScreen/index_old.vue
deleted file mode 100644
index 4ed83d90..00000000
--- a/src/views/bigScreen/index_old.vue
+++ /dev/null
@@ -1,4048 +0,0 @@
-<template>
-	<div class="screen-main">
-		<!--头部展示-->
-		<div class="screen-header">
-			<div class="header-left-bg">曲阳金隅智能安全管控系统</div>
-			<div class="header-right-action">
-				<div class="right-action-clock">
-					<span class="action-time">{{ currentDay }}</span>
-					<span class="action-time">{{ currentWeek }} </span>
-					<span class="action-time">{{ currentTime }}</span>
-				</div>
-			</div>
-		</div>
-		<!--图层控制-->
-		<div class="screen-ctrl">
-			<div class="screen-filter">
-				<div class="filter-content">
-					<div class="filter-ctrl" v-show="filterCtrlFocus">
-						<div class="screen-check-content hoverPointer" @click="markerClick(0)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[0] }"></span>
-							<span class="box-text">全部</span>
-						</div>
-						<div class="screen-check-content hoverPointer" @click="markerClick(1)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[1] }"></span>
-							<span class="box-text">监控</span>
-						</div>
-						<div class="screen-check-content hoverPointer" @click="markerClick(2)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[2] }"></span>
-							<span class="box-text">喇叭</span>
-						</div>
-						<div class="screen-check-content hoverPointer" @click="markerClick(3)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[3] }"></span>
-							<span class="box-text">作业</span>
-						</div>
-						<div class="screen-check-content hoverPointer" @click="markerClick(4)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[4] }"></span>
-							<span class="box-text">区域</span>
-						</div>
-						<div class="screen-check-content hoverPointer" @click="markerClick(5)">
-							<span class="box-btn box-uncheck" :class="{ 'box-check': markList[5] }"></span>
-							<span class="box-text">人员</span>
-						</div>
-						<!-- <div class="caret-dropdown">
-							<el-icon @click="userSelect" v-if="showUserSelect" :size="14">
-								<ArrowUpBold />
-							</el-icon>
-							<el-icon @click="userSelect" v-else :size="14">
-								<ArrowDownBold />
-							</el-icon>
-						</div> -->
-					</div>
-					<div class="drop-content" v-if="showUserSelect">
-						<el-tree 
-						ref="group" 
-						id="bigScreenTree" 
-						node-key="id" 
-						:data="postList" 
-						show-checkbox
-						:current-node-key="''" 
-						:highlight-current="true" 
-						:expand-on-click-node="true"
-						@check="handleChange"
-						></el-tree>
-						<el-button type="primary" @click="userFilter">查看</el-button>
-					</div>
-					<div class="filter-action showroam">
-						<div v-if="filterCtrlFocus" class="action-shrink" @click="filterCtrlFocusChange"></div>
-						<div v-else class="action-shrink shrink-hidden" @click="filterCtrlFocusChange"></div>
-						<div v-if="autoRun" class="action-roam roam-pause" @click="autoRunChange"></div>
-						<div v-else class="action-roam roam-play" @click="autoRunChange"></div>
-					</div>
-				</div>
-			</div>
-			<!--搜索-->
-			<div class="screen-search">
-				<div class="search-content">
-					<input type="text" placeholder="输入姓名/定位卡号/车牌号进行查找" v-model="searchKeyWord" class="input-focus">
-					<span class="close-btn el-icon-circle-close" style="display: none;"></span>
-					<div class="search" @click="searchOne(searchKeyWord)"></div>
-					<!-- <div class="auto-suggestion" style="display: none;">
-						<div class="suggestion-select-ul"></div>
-					</div> -->
-				</div>
-				<div style="text-align: right;margin-top: 15px;">
-					<div v-if="tracking&&!screenUser" class="danger-btn-bg btn-item" @click="userUnTrack">
-						<span class="trackImg"></span>
-						<span>取消跟踪</span>
-					</div>
-					<div v-if="lineTracking&&!screenUser" class="simple-btn-bg btn-item" @click="userLineTrackCancel">
-						<span class="viewImg"></span>
-						<span>取消轨迹</span>
-					</div>
-				</div>
-			</div>
-		</div>
-		<!--人员统计/事件统计/部门统计-->
-		<div class="screen-cockpit">
-			<div class="cockpit-count">
-				<div class="divider"></div>
-				<div class="simple-title">
-					<span>数据统计</span>
-					<div class="countTypeWrap">
-						<span :class="{ 'activeCount': countIndex === '1' }" @click="countINdexChange('1')">有卡</span>
-						<el-divider direction="vertical"></el-divider>
-						<span :class="{ 'activeCount': countIndex === '2' }" @click="countINdexChange('2')">在线</span>
-					</div>
-				</div>
-				<div class="count-list">
-					<div class="count-list-item">
-						<div class="item-img item-img2"></div>
-						<div class="item-info">
-							<div title="员工" class="normal">正式员工</div>
-							<div class="bottom">
-								<span class="large">{{ userCount.count_employee }}</span>&nbsp;<span
-									class="normal">人</span>
-							</div>
-						</div>
-					</div>
-					<div class="count-list-item">
-						<div class="item-img item-img1"></div>
-						<div class="item-info">
-							<div title="外来人员" class="normal">访客</div>
-							<div class="bottom"><span class="large">{{ userCount.count_visitor }}</span>&nbsp;<span
-									class="normal">人</span>
-							</div>
-						</div>
-					</div>
-					<div class="count-list-item">
-						<div class="item-img item-img3"></div>
-						<div class="item-info">
-							<div title="承包商" class="normal">相关方</div>
-							<div class="bottom">
-								<span class="large">{{ userCount.count_remployee }}</span>&nbsp;<span
-									class="normal">人</span>
-							</div>
-						</div>
-					</div>
-					<div class="count-list-item">
-						<div class="item-img item-img4"></div>
-						<div class="item-info">
-							<div title="司机" class="normal">司机</div>
-							<div class="bottom">
-								<span class="large">{{ userCount.count_driver }}</span>&nbsp;<span
-									class="normal">人</span>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-			<div class="cockpit-alarm">
-				<div class="divider"></div>
-				<div class="simple-title" @click="warningDetail = true">
-					<span>报警实时展示</span>
-					<div class="simple-btn-bg alarm-bell danger">
-						<span>{{ wStatistics.total_count }}</span>&nbsp;报警
-					</div>
-				</div>
-				<div class="alarm-content">
-					<div style="display:flex">
-						<div class="alarm-danger"></div>
-						<div id="eventScrenWrap">
-							<div id="eventScrenItem">
-								<div v-for="(item1,index1) in warningData.list" :key="item1.id">
-									<text v-if="index1<3">{{item1.voice_msg}}</text>
-								</div>
-							</div>
-						</div>
-					</div>
-					<div class="content-right">
-						<div v-for="item in wStatistics.details" :key="item.cate" class="alarm-item alarm-item-danger">
-							<span class="item-icon"></span>
-							<span class="item-name">{{ item.cate__name }}</span>
-							<span class="item-number" style="">{{ item.count }}</span>
-						</div>
-					</div>
-				</div>
-				<div class="alarm-detail-info left_arrow" v-if="warningDetail">
-					<div class="simple-title">
-						<div><span>报警数据</span></div>
-						<div class="action-group">
-							<!-- <span class="detail-text-btn" @click="allWarningView">查看所有</span> -->
-							<span class="icon-close" @click="warningDetail = false"></span>
-						</div>
-					</div>
-					<div class="detail-content">
-						<div class="content-head">
-							<div class="screen-multiple-select head-select">
-								<!-- <div class="multiple-select-tags" @click="warningTypeShow = true"> -->
-								<div class="multiple-select-tags" @click="warningTypeChange">
-									<span class="multiple-select-input">{{eventTypeName}}</span>
-									<el-icon color="#ffffff" class="no-inherit">
-										<ArrowDownBold />
-									</el-icon>
-								</div>
-								<div v-show="warningTypeShow" class="multiple-select-wrap">
-									<div class="multiple-select-ul">
-										<div class="multiple-select-li" @click="warningTypeSelected(null,'全部')">
-											<span class="multiple-select-label">全部</span>
-										</div>
-
-										<div v-for="typeItem in warningTypes" :key="typeItem.id"
-											class="multiple-select-li" @click="warningTypeSelected(typeItem.id,typeItem.name)">
-											<span title="超员报警" class="multiple-select-label">{{ typeItem.name }}</span>
-										</div>
-									</div>
-								</div>
-							</div>
-							<div v-if="speakerPlayStatus" class="head-sound sound-ring" @click="speakerPasue"></div>
-							<div v-else class="head-sound sound-quiet" @click="speakerPlay"></div>
-						</div>
-						<div class="content-body" v-if="warningData.total > 0">
-							<!--warningList-->
-							<div class="alarm-item" v-for="(item) in warningData.list" :key="item.id">
-								<div class="item-type">未处理</div>
-								<div class="item-content" @click="warningItemShow(item)">
-									<div class="item-content-top"><span class="time">{{ item.create_time }}</span><span
-											class="status">待处理</span></div>
-									<div class="item-content-middle mt6">
-										<div class="alarm-info">{{ item.voice_msg }}</div>
-									</div>
-								</div>
-							</div>
-						</div>
-						<div v-if="warningData.total > 0" class="content-footer" style="">
-							<el-pagination :page-size="warningData.params.page_size" :pager-count="5"
-								v-model:currentPage="warningData.params.page" layout="prev, pager, next"
-								:total="warningData.total" @current-change="handleCurrentChange" />
-						</div>
-						<div class="noData" v-else>
-							<img src="/img/nodata.png">
-						</div>
-					</div>
-				</div>
-			</div>
-			<div class="cockpit-info">
-				<div class="divider"></div>
-				<div class="simple-title area-simple-title">
-					<div class="header-tab">
-						<span class="tab-item">区域信息情况</span>
-						<!--<span class="tab-item" :class="{'tab-item-active':LBType==='2'}" @click="cockpitChange('2')">部门信息情况</span>-->
-					</div>
-					<!-- <div class="simple-btn-bg alarm-btn">需充电卡片0人</div> -->
-				</div>
-				<div class="info-body area-info-body">
-					<el-table :data="areaList" style="width: 100%;" :height="areaTableHeight" highlight-current-row
-						class="bigScreenTable" @row-click="areaRowClick">
-						<el-table-column label="区域" prop="name"></el-table-column>
-						<el-table-column label="当前人数" prop="count_people"></el-table-column>
-					</el-table>
-				</div>
-				<div class="alarm-detail-info left_arrow" v-if="areaDetail" style="width:150%">
-					<div class="simple-title">
-						<div><span>区域统计</span></div>
-						<span class="icon-close" @click="areaDetailClose"></span>
-					</div>
-					<div class="detail-content">
-						<div class="content-head">
-							<div @click="areaItemHandle(1)" :class="{'areaActive':areaShowType==1,'areaNavItem':1}" style="color:#ffffff">作业</div>
-							<div @click="areaItemHandle(2)" :class="{'areaActive':areaShowType==2,'areaNavItem':1}" style="color:#ffffff">监控</div>
-							<div @click="areaItemHandle(3)" :class="{'areaActive':areaShowType==3,'areaNavItem':1}" style="color:#ffffff">喇叭</div>
-							<div @click="areaItemHandle(4)" :class="{'areaActive':areaShowType==4,'areaNavItem':1}" style="color:#ffffff">人员</div>
-						</div>
-						<div class="content-body">
-							<el-table class="bigScreenTable" v-if="areaShowType==1" :data="areaOperation" :height="300" @row-click="areaOperationRowClick">
-								<el-table-column label="作业简介" prop="name"></el-table-column>
-								<el-table-column label="开始时间" prop="start_time"></el-table-column>
-								<el-table-column label="结束时间" prop="end_time"></el-table-column>
-								<el-table-column label="业务部门">
-									<template #default="scope">
-									<span v-if="scope.row.dept_ter_">{{scope.row.dept_ter_.name}}</span>
-									</template>
-								</el-table-column>
-							</el-table>
-							<el-table class="bigScreenTable" :data="areaVideo" v-if="areaShowType==2" :height="300">
-								<el-table-column label="通道名称" prop="name"></el-table-column>
-								<el-table-column label="所在区域" prop="area_name"></el-table-column>
-								<el-table-column label="code" prop="code"></el-table-column>
-							</el-table>
-							<el-table class="bigScreenTable" :data="areaSpeaker" v-if="areaShowType==3" :height="300">
-								<el-table-column label="喇叭名称" prop="name"></el-table-column>
-								<el-table-column label="所在区域" prop="area_name"></el-table-column>
-								<el-table-column label="唯一标识" prop="code"></el-table-column>
-							</el-table>
-							<el-table class="bigScreenTable" :data="areaUser" v-if="areaShowType==4"  :height="300" @row-click="areaEmployeeRowClick">
-								<el-table-column label="人员姓名" prop="my_info.employee_.name"></el-table-column>
-								<el-table-column label="人员姓名" prop="my_info.employee_.type"></el-table-column>
-								<el-table-column label="定位卡号" prop="mac"></el-table-column>
-							</el-table>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<div style="display:flex;flex-direction:colum">
-		</div>
-		<!--切换-->
-		<!--<div class="screen-tab">
-			<div class="screen-tab-content">
-				<div class="tab-menu tab-menu-item tab-menu-active"><span class="tab-menu-text">驾驶舱</span></div>
-				<div class="tab-menu tab-menu-item"><span class="tab-menu-text">监控</span></div>
-				&lt;!&ndash;<div class="tab-menu tab-menu-item"><span class="tab-menu-text">追踪</span></div>
-				<div class="tab-menu tab-menu-item"><span class="tab-menu-text">最终位置</span></div>
-				<div class="tab-menu tab-menu-item"><span class="tab-menu-text">疏散演练</span></div>&ndash;&gt;
-			</div>
-		</div>-->
-		<!--地图-->
-		<div id='mapContainer'></div>
-		<!--人员列表-->
-		<div class="screen-user" v-if="screenUser">
-			<div class="simple-title">
-				<div>人员信息</div>
-				<div class="simple-btn" @click="screenUser = false">关闭</div>
-			</div>
-			<div class="h100" style="">
-				<div class="person-info-header">
-					<div class="header-basic">
-						<div class="basic-img">
-							<div style="width: 100%; height: 100%;">
-								<img style="width: 100%; height: 100%;" :src="screenUserItem.photo" height="100%" width="100%">
-							</div>
-						</div>
-						<div class="basic-info">
-							<div class="info-item">
-								<span class="info-item-name">姓名：</span>
-								<span class="info-item-info">{{ screenUserItem.name }}</span>
-							</div>
-							<div class="info-item">
-								<span class="info-item-name">类型：</span>
-								<span class="info-item-info" v-if="screenUserItem.type === 'employee'">正式员工</span>
-								<span class="info-item-info" v-else>访客</span>
-							</div>
-							<div class="info-item">
-								<span class="info-item-name">定位卡：</span>
-								<span class="info-item-info">{{ screenUserItem.id }}</span>
-							</div>
-							<div class="info-item">
-								<span class="info-item-name">部门：</span>
-								<span class="info-item-info">{{ screenUserItem.belong_dept_name }}</span>
-							</div>
-							<div class="info-item">
-								<span class="info-item-name">岗位：</span>
-								<span class="info-item-info">{{ screenUserItem.post_name }}</span>
-							</div>
-						</div>
-						<div class="simple-btn basic-btn" @click="showUserDetail">查看详情</div>
-					</div>
-				</div>
-				<div class="basic-btn-group">
-					<div  v-if="!tracking&&!lineTracking"  class="danger-btn-bg btn-item" @click="userTrack">
-						<span class="trackImg"></span>
-						<span>跟踪</span>
-					</div>
-					<div  v-else-if="!tracking&&lineTracking"  class="danger-btn-bg btn-item">
-						<span class="trackImg"></span>
-						<span>跟踪</span>
-					</div>
-					<div v-else-if="tracking" class="danger-btn-bg btn-item" @click="userUnTrack">
-						<span class="trackImg"></span>
-						<span>取消跟踪</span>
-					</div>
-					<div v-if="!lineTracking&&!tracking" class="simple-btn-bg btn-item" @click="userLineTrack">
-						<span class="viewImg"></span>
-						<span>轨迹</span>
-					</div>
-					<div v-if="!lineTracking&&tracking" class="simple-btn-bg btn-item">
-						<span class="viewImg"></span>
-						<span>轨迹</span>
-					</div>
-					<div v-else-if="lineTracking" class="simple-btn-bg btn-item" @click="userLineTrackCancel">
-						<span class="viewImg"></span>
-						<span>取消轨迹</span>
-					</div>
-				</div>
-				<div class="screen-per-list">
-					<el-table :data="userList"  style="width: 100%" :row-key="row => { return row.id }"
-						highlight-current-row class="bigScreenTable" @row-click="userRowClick">
-						<el-table-column label="姓名">
-							<template #default="scope">
-								<span v-if="scope.row.my_info.employee_">{{ scope.row.my_info.employee_.name }}</span>
-							</template>
-						</el-table-column>
-						<el-table-column label="部门">
-							<template #default="scope">
-								<span v-if="scope.row.my_info.employee_">{{ scope.row.my_info.employee_.belong_dept_name
-								}}</span>
-							</template>
-						</el-table-column>
-						<el-table-column label="岗位">
-							<template #default="scope">
-								<span v-if="scope.row.my_info.employee_">{{ scope.row.my_info.employee_.post_name
-								}}</span>
-							</template>
-						</el-table-column>
-					</el-table>
-				</div>
-				<!--人员选详细信息-->
-				<div class="person-cert right_arrow" v-if="screenUserDetail">
-					<div class="simple-title">
-						<div>人员信息</div>
-						<div class="icon-close" @click="screenUserDetail = false"></div>
-					</div>
-					<div class="basic-head">
-						<div class="header-tab">
-							<span class="tab-item tab-item-active">基本信息</span>
-							<!--<span class="tab-item">资质证件</span>-->
-						</div>
-					</div>
-					<div class="basic-info">
-						<div class="info-item">
-							<span class="info-item-name">姓名：</span>
-							<span class="info-item-info">{{ screenUserItemDetail.name }}</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">姓别：</span>
-							<span class="info-item-info">{{ screenUserItemDetail.gender }}</span>
-						</div>
-
-						<div class="info-item">
-							<span class="info-item-name">定位卡号：</span>
-							<span class="info-item-info">202106180008</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">部门：</span>
-							<span class="info-item-info" v-if="screenUserItemDetail.belong_dept_">{{
-									screenUserItemDetail.belong_dept_.name
-							}}</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">岗位：</span>
-							<span class="info-item-info" v-if="screenUserItemDetail.post_">{{
-									screenUserItemDetail.post_.name
-							}}</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">证件类型：</span>
-							<span class="info-item-info">中华人民共和国居民身份证</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">证件号码：</span>
-							<span class="info-item-info">{{ screenUserItemDetail.id_number }}</span>
-						</div>
-						<div class="info-item">
-							<span class="info-item-name">联系电话：</span>
-							<span class="info-item-info">{{ screenUserItemDetail.phone }}</span>
-						</div>
-					</div>
-					<div class="basic-cert" style="display: none;">
-						<div class="el-empty">
-							<div class="el-empty__image" style="width: 160px;">
-								<img src="/img/nodata.png" ondragstart="return false">
-							</div>
-							<div class="el-empty__description">
-								<p></p>
-							</div>
-						</div>
-					</div>
-					<div class="el-loading-mask" style="background-color: transparent; display: none;">
-						<div class="el-loading-spinner"><i class="el-icon-loading"></i></div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<div class="alarm-detail-info left_arrow" v-if="workDetail" style="width: 50%;top: 220px;">
-					<div class="simple-title">
-						<div><span>作业</span></div>
-						<!-- @click="areaItemHandle(1)" -->
-						<span class="icon-close" @click="workDetailClose"></span>
-					</div>
-					<div class="detail-content">
-						<div class="content-body">
-							<el-table class="bigScreenTable" v-if="areaShowType==1" :data="areaOperation" :height="300" @row-click="areaOperationRowClick">
-								<el-table-column label="作业简介" prop="name"></el-table-column>
-								<el-table-column label="开始时间" prop="start_time"></el-table-column>
-								<el-table-column label="结束时间" prop="end_time"></el-table-column>
-								<el-table-column label="业务部门">
-									<template #default="scope">
-									<span v-if="scope.row.dept_ter_">{{scope.row.dept_ter_.name}}</span>
-									</template>
-								</el-table-column>
-								<el-table-column label="监控设备">
-									<template #default="scope">
-										<el-tag
-											v-for="item in scope.row.vchannels_"
-											:key="item.id"
-											@click="showVchannel(item)"
-											style="margin-right: 10px;margin-left:0"
-											>{{ item.name }}
-										</el-tag>
-									</template>
-								</el-table-column>
-							</el-table>
-						</div>
-					</div>
-				</div>
-		<!--危险作业-->
-		<div class="screen-job" v-if="screenOperation">
-			<div class="simple-title">
-				<div>作业详情</div>
-				<div class="simple-btn" @click="closeScreenOperation">关闭</div>
-			</div>
-			<div class="job-content">
-				<div class="job-basic">
-					<div class="job-item">
-						<span class="job-item-name">作业名称：</span>
-						<span class="job-item-info">{{screenJobItem.name}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">作业编号：</span>
-						<span class="job-item-info">{{screenJobItem.number}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">生产状态：</span>
-						<span class="job-item-info">{{screenJobItem.state_work}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">作业区域：</span>
-						<span class="job-item-info">{{screenJobItem.area_.name}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">部门协调员：</span>
-						<span class="job-item-info">{{screenJobItem.coordinator_name}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">开始时间：</span>
-						<span class="job-item-info">{{screenJobItem.start_time}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">结束时间：</span>
-						<span class="job-item-info">{{screenJobItem.end_time}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">属地部门：</span>
-						<span class="job-item-info">{{screenJobItem.dept_ter_.name}}</span>
-					</div>
-					<div class="job-item">
-						<span class="job-item-name">业务部门：</span>
-						<span class="job-item-info">{{screenJobItem.dept_bus_.name}}</span>
-					</div>
-					<!-- <div class="job-item">
-						<span class="job-item-name">监控设备：</span>
-						<el-tag
-							v-for="item in screenJobItem.vchannels_"
-							:key="item.id"
-							@click="showVchannel(item)"
-							style="margin-right: 10px;margin-left:0"
-							>{{ item.name }}
-						</el-tag>
-					</div> -->
-				</div>
-				<div class="simple-title">
-					<div>作业票</div>
-				</div>
-				<div class="job-list">
-					<el-tag
-					v-for="item in screenJobItem.cates_"
-					:key="item.id"
-					@click="showOpretion(item)"
-					style="margin-right: 10px;margin-left:0"
-					>{{ item.cate_name }}
-					</el-tag>
-				</div>
-			</div>
-		</div>
-		<!--区域-->
-		<div class="screen-risk" v-if="screenRisk">
-			<div class="simple-title">
-				<div>风险区域详情</div>
-				<div class="simple-btn" @click="closeScreenRisk">关闭</div>
-			</div>
-			<div class="risk-content">
-				<div class="risk-basic">
-					<div class="risk-item"><span class="risk-item-name">风险区域名称：</span><span
-							class="risk-item-info">{{areaItemDetail.name}}</span>
-					</div>
-					<div class="risk-item"><span class="risk-item-name">风险等级：</span><span
-							class="risk-item-info">{{levelOption[areaItemDetail.level]}}</span>
-					</div>
-					<div class="risk-item"><span class="risk-item-name">区域编号：</span><span
-							class="risk-item-info">{{areaItemDetail.number}}</span></div>
-				</div>
-				<div class="simple-title">
-					<div>详细信息</div>
-				</div>
-			</div>
-		</div>
-		<!--事件详情-->
-		<div class="screen-risk" v-if="screenWarning">
-			<div class="simple-title">
-				<div>事件信息</div>
-				<div class="simple-btn" @click="closeScreenWarning">关闭</div>
-			</div>
-			<div class="risk-content">
-				<div class="risk-basic">
-					<div class="risk-item">
-						<span class="risk-item-info">{{ screenWarningItem.voice_msg }}</span>
-					</div>
-				</div>
-			</div>
-			<div class="simple-title">
-				<div>事件详情</div>
-			</div>
-			<div class="risk-content">
-				<div class="risk-basic">
-					<div class="risk-item">
-						<span class="risk-item-name">报警区域：</span>
-						<span class="risk-item-info" v-if="screenWarningItem.area_">{{ screenWarningItem.area_.name
-						}}</span>
-					</div>
-					<div class="risk-item" v-if="screenWarningItem.employee_ !== null">
-						<span class="risk-item-name">触发人：</span>
-						<span class="risk-item-info" v-if="screenWarningItem.employee_">{{
-								screenWarningItem.employee_.name
-						}}</span>
-					</div>
-					<div class="risk-item" v-if="screenWarningItem.employee_ !== null">
-						<span class="risk-item-name">触发人部门：</span>
-						<span class="risk-item-info" v-if="screenWarningItem.employee_.belong_dept_">{{
-								screenWarningItem.employee_.belong_dept_.name
-						}}</span>
-					</div>
-					<div class="risk-item">
-						<span class="risk-item-name">触发事件：</span>
-						<span class="risk-item-info" v-for="ite in screenWarningItem.cates_" :key="ite">{{ ite.name
-						}}</span>
-					</div>
-					<div class="risk-item">
-						<span class="risk-item-name">触发时间：</span>
-						<span class="risk-item-info">{{ screenWarningItem.create_time }}</span>
-					</div>
-					<div class="risk-item" v-if="screenWarningItem.global_img!=null">
-						<span class="risk-item-name">事件截图：</span>
-						<sc-upload v-model="screenWarningItem.global_img" title="全景照" style="width: 250px;"></sc-upload>
-						<sc-upload v-if="screenWarningItem.face_img!=null" v-model="screenWarningItem.face_img" title="人脸照"  style="width: 250px;"></sc-upload>
-						
-						<!-- <img :src="screenWarningItem.global_img" style="width: 250px;"> -->
-						<!-- <img v-if="screenWarningItem.face_img!=null" :src="screenWarningItem.face_img" style="width: 250px;"> -->
-					</div>
-				</div>
-			</div>
-			<div class="simple-title">
-				<div>警告处理</div>
-			</div>
-			<div class="risk-content">
-				<div class="risk-basic">
-					<div class="risk-item">
-						<span class="risk-item-name">处理描述：</span>
-						<el-input class="item-textarea" v-model="warningForm.handle_desc" :rows="3" type="textarea"
-							placeholder="请输入处理描述" />
-					</div>
-					<div class="risk-item">
-						<span class="risk-item-name">事件类型：</span>
-						<el-radio-group v-model="warningForm.mark">
-							<el-radio label="10" size="small">正常</el-radio>
-							<el-radio label="20" size="small">误报</el-radio>
-						</el-radio-group>
-					</div>
-				</div>
-
-			</div>
-			<div style="text-align: center">
-				<el-button class="handleWarningBtn" @click="handleWarning">处理</el-button>
-			</div>
-
-		</div>
-		<audio id="audio" :src="audioSrc" autoplay @ended="audioFinished" preload>
-			对不起，您的浏览器不支持HTML5音频播放。
-		</audio>
-		<el-dialog class="videoViewWrap" :title="channelName" v-model="limitedVisible" with="100%">
-			<video-view id="videoView" v-if="limitedVisible" :channelCode="channelCode"></video-view>
-			<template #footer>
-			<el-button @click="viewClose">关闭</el-button>
-			</template>
-		</el-dialog>
-		<el-dialog class="videoViewWrap" :title="opreationName" v-model="limitedOpreation" with="100%">
-			<opreation-view  v-if="limitedOpreation" :ticketId="ticketId" :projectId="projectId" :cateType="cateType"></opreation-view>
-			<template #footer>
-			<el-button @click="viewClose">关闭</el-button>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script>
-// import flvjs from "./../../utils/flv";
-import { genTree } from "@/utils/verificate";
-import sysConfig from "@/config";
-import videoView from "./../am/videoView";
-import opreationView from "./oplDetail";
-export default {
-	components: {
-		videoView,
-		opreationView
-	},
-	data() {
-		return {
-			line1:null,
-			music:null,
-			ticketId:null,
-			projectId:null,
-			cateType:null,
-			timerUser: null,
-			timerTime: null,
-			eventTimer:null,
-			timerEventRoll:null,
-			eventAudioTimer:null,
-			trackMarker:null,
-			domMarkerLayer: null,
-			userMaskerLayer: null,
-			jobDomMarkerLayer: null,
-			riskMarkerLayer: null,//风险区域
-			areaMarkerLayer: null,//区域展示
-			pointMarkerLayer: null,//点位图层
-			polygonMaskerLayer: null,//危险作业
-			cameraMaskerLayer: null,//摄像头
-			materialsMaskerLayer: null,//喇叭
-			singleAreaMaskerLayer:null,
-			carsMaskerLayer: null,//车辆
-			manMaskerLayer: null,//人员
-			flyManager: null,
-			eareMarker: null,
-			dropIndex: '1',
-			countIndex: '2',
-			areaShowType: '1',
-			markList: [false, false, false, false, false, false],
-			autoRun: false,
-			tracking: false,
-			lineTracking:false,
-			areaDetail: false,
-			workDetail:false,
-			screenJob: false,
-			screenUser: false,
-			screenRisk: false,
-			speakerPlayStatus:true,
-			screenWarning: false,
-			screenUserDetail: false,
-			warningTypeShow: false,
-			showUserSelect: false,
-			warningDetail: false,
-			filterCtrlFocus: true,
-			screenOperation:false,
-			limitedVisible:false,
-			limitedOpreation:false,
-			warningListTotal: 0,
-			heightNum:0,
-			warningData: {
-				list: [],
-				total: 0,
-				params: {
-					page: 1,
-					page_size: 10,
-					start_create: '',
-				}
-			},
-			cateAggForm: {
-				start_create: '',
-				is_handled: false,
-				completed: true
-			},
-			areaItemDetail:{},
-			wStatistics: {},
-			warningTypes: [],//事件类型
-			Vchannels: [],//摄像头列表
-			warningList: [],//报警事件列表
-			speakerList: [],//喇叭列表
-			userList: [],//人员列表
-			allUserList:[],
-			deptList: [],//部门列表
-			postList: [
-				{id:0,name:'全部',label:'全部'},
-				{id:1,name:'曲阳金隅',label:'曲阳金隅'},
-				{id:2,name:'访客',label:'访客'},
-				{id:3,name:'司机',label:'司机'}],//岗位列表
-			dangerList: [],//岗位列表
-			areaList: [],//区域列表/风险区域列表
-			areaOperation:[],
-			areaVideo:[],
-			areaSpeaker:[],
-			areaUser:[],
-			deptChecked:[],
-			//数据统计
-			userCount: {
-				total: 0,
-				count_employee: 0,//正式员工
-				count_remployee: 0,//访客
-				count_visitor: 0//相关方
-			},
-			screenJobItem: {},//危险作业信息
-			screenRiskItem: {},//风险区域信息
-			screenWarningItem: {},//风险区域信息
-			screenUserItem: {},//人员信息
-			screenUserItemDetail: {},//人员信息
-			url: '',
-			areaDetailId:'',
-			params: {
-				json: {
-					data: {
-						channelId: "",
-						streamType: "2",
-						type: "flv",
-					}
-				},
-				code: 'video_realtime'
-			},
-			userParams:{
-				depts:[],
-			},
-			group: [],
-			groupsProps: {
-				value: "id",
-				label: "name",
-				multiple: true,
-				checkStrictly: true,
-			},
-			filters: {
-				type: '',
-				dept: '',
-				keyword: '',
-			},
-			warningId: '',
-			warningForm: {
-				handle_desc: '',
-				mark: '1',
-			},
-			LBType: '1',
-			userMarker: {},
-			todayDate: '',
-			currentDay: '',
-			currentTime: '',
-			currentWeek: '',
-			areaTableHeight: null,
-			levelOption:{
-				10:'低风险',
-				20:'一般风险',
-				30:'较大风险',
-				40:'重大风险'
-			},
-			eventTypeName:'全部',
-			audioSrc:'',
-			audioIndex:0,
-			audioList:{},
-			employeeScroll:0,
-			searchKeyWord:'',
-			ElLoading:null,
-			channelCode:'',
-			channelName:'',
-		}
-	},
-	created() {
-		const scriptInfo = document.createElement("script");
-		scriptInfo.setAttribute("data-callType", "callScript");
-		scriptInfo.src = "https://cdn.bootcdn.net/ajax/libs/flv.js/1.6.2/flv.js";
-		document.head.appendChild(scriptInfo);
-	},
-	mounted() {
-		let that = this;
-		let date = new Date();
-		that.timeNow = date.getDay();
-		that.todayDate = this.warningData.params.start_create = this.cateAggForm.start_create = this.$TOOL.dateFormat(new Date(), 'yyyy-MM-dd');
-		that.music = document.getElementById("audio");
-		that.showTime();
-		that.timerTime = setInterval(() => {
-			that.showTime();
-		}, 1000);
-		let host = window.location.host;
-		let jsUrl = '/jsmap/jsmap.js';
-		that.loadScript('mapId',jsUrl, () => {
-			window.map = new jsmap.JSMap({
-				mapType: jsmap.JSMapType.MAP_3D,
-				container: 'mapContainer',
-				mapServerURL: 'data/map',
-				enableShadows: false, //是否开启阴影 默认false
-				enableLighting: false, //是否开发光照 默认false
-				showBuildingMarker: true,
-				// showNavigationDisplay: true,
-				mapScaleLevelRange: [16, 23],//比例尺级别范围， 16级到23级,默认[1,24]
-				floorControlOptions: {
-					floorHeight: 20,//楼层间距
-					position: jsmap.JSControlPosition.RIGHT_TOP,//控件位置
-					offset: {
-						x: 50,
-						y: 200,
-					}//控件偏移位置
-				},
-				imageryProvider: jsmap.JSImageryProviderType.IMAGE_TDT,
-				backgroundColor: '#3798ff',  //背景颜色
-				viewOptions: {
-					//屏幕中心坐标
-					center: { x: 114.63059258861512, y: 38.81407163905287, z: 1 },
-					// center: {x:120,y:30,z:10},
-					//相机距屏幕中心点距离（单位m）
-					distance: 550,
-					// 旋转角（单位°）
-					rotate: 0,
-					//倾斜角（单位°）
-					tilt: 45,
-				}
-			});
-			window.map.openMapById('0000');
-			window.map.on('loadComplete', e => {
-				that.riskMaskerLayers();//风险区域
-				that.userMaskerLayers();//人员
-				that.cameraMaskerLayers();//摄像头
-				that.domMarkerLayers();//监控视频
-				that.polygonMarkerLayers();//危险作业
-				that.speakersMaskerLayers();//喇叭
-				// that.jobDomMarkerLayers();//危险作业图片
-				that.areaMarkerLayers();//危险作业图片
-				let compassControl = new jsmap.JSCompassControl({
-					position: jsmap.JSControlPosition.LEFT_TOP,
-					offset: {
-						x: 420,
-						y: 50
-					}
-				});
-				window.map.addControl(compassControl);
-				let zoomControl = new jsmap.JSZoomControl({
-					position: jsmap.JSControlPosition.LEFT_TOP,
-					offset: {
-						x: 450,
-						y: 5
-					}
-				});
-				window.map.addControl(zoomControl);
-			});
-			window.map.on('mapClickNode', event => {
-				let item = event;
-				let that = this;
-				let type = event.nodeType.toString();
-				console.log(type === 'Symbol(icontextmaker)');
-				if (item.markers.length > 0) {
-					if (type === 'Symbol(boxmarker)') {
-						let areaId = item.properties.get("areaId");
-						console.log(areaId);
-						that.$API.am.area.item.req(areaId).then(res=>{
-							that.areaItemDetail = res;
-							that.screenJob = false;
-							that.screenWarning = false;
-							that.screenRisk = true;
-						})
-						//风险区域
-					} else if (type === 'Symbol(icontextmaker)') {
-						//摄像头和人员
-						if (document.getElementById(item.markers[0].id) === null) {
-							if (item.markers[0].image === "/img/camera.svg") {
-								//摄像头
-								this.params.json.data.channelId = item.markers[0].id;
-								let domMarker = new jsmap.JSDomMarker({
-									id: item.markers[0].id + 'mark',
-									position: new jsmap.JSPoint(item.markers[0].position.x, item.markers[0].position.y, 0),
-									floorId: 1,
-									depthTest: true,
-									content: `<div id="` + item.markers[0].id + `" style="display: block;position:absolute;z-index: 10;top: 0;background: rgba(24,36,51,.7);padding: 0 16px 16px;box-sizing: border-box" id="vchannelWrap"></div>`,
-									offset: jsmap.JSControlPosition.RIGHT_CENTER,
-									displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),
-									marginOffset: {
-										x: 30,
-										y: -50
-									},
-									properties: {
-										type: 0,
-									},
-									callback: (node) => {
-										console.log(node);
-									}
-								});
-								this.domMarkerLayer.addMarker(domMarker);
-								var otest = document.getElementById(item.markers[0].id);
-								// 创建一个新dom,并设置icon，绑定点击事件
-								let newEle = document.createElement("div");
-								newEle.className = "v_title";
-								newEle.setAttribute("style", "display:flex;justify-content: space-between;padding:10px 0");
-								let title = document.createElement("div");
-								title.innerText = "实时监控";
-								newEle.style.color = "#ffffff";
-								let close = document.createElement("div");
-								close.className = "v_close";
-								close.setAttribute("style", "width: 16px;height: 16px;background: url(/img/close.png) no-repeat;background-size: 100% 100%;");
-								newEle.appendChild(title);
-								newEle.appendChild(close);
-								let newEle2 = document.createElement("video");
-								newEle2.controls  = true;
-								newEle2.autoplay = true;
-								newEle2.id = item.markers[0].id + 'videoPlayer';
-								newEle2.name = item.markers[0].id + 'videoPlayer';
-								newEle2.setAttribute("style", "width: 327px;height:183px;background:url('/img/v_mask.png') no-repeat;background-size: 100% 100%;");
-								// 在对应dom 下追加创建的dom
-								otest.appendChild(newEle);
-								otest.appendChild(newEle2);
-								let flvPlayer = null,URLS=null;
-								newEle2.onclick = () => {
-									newEle2.setAttribute("style", "width: 327px;height:183px;background:url(/img/rotate_line.png) no-repeat;background-size:60px 60px;background-position:center center;");
-									this.$API.am.video.item.req(this.params).then(res => {
-										console.log(res);
-										this.url = res.url;
-										URLS = res.url.replace('192.168.10.253',sysConfig.VUE_APP_VIDEOHOST);
-										if (flvjs.isSupported()) {
-											let videoElement = document.getElementById(item.markers[0].id + 'videoPlayer');
-											var mediaDataSource = {
-												type: 'flv',
-												hasAudio:false,
-												hasVideo:true,
-												isLive:false,
-												withCredentials:false,
-												url:URLS
-											};
-											flvPlayer = flvjs.createPlayer(mediaDataSource, {
-												enableWorker: false,
-												lazyLoadMaxDuration: 3 * 60,
-												seekType: 'range',
-											});
-											flvPlayer.attachMediaElement(videoElement);
-											newEle2.setAttribute("style", "width: 327px;height:183px;background:url(/img/rotate_line.png) no-repeat;background-size:60px 60px;background-position:center center;");
-											flvPlayer.load();
-											flvPlayer.play();
-										}
-									})
-								};
-								close.onclick = () => {
-									let nodeMark = document.getElementById(item.markers[0].id);
-									nodeMark.remove();
-									flvPlayer.pause();
-									flvPlayer.unload();
-									flvPlayer.detachMediaElement();
-									flvPlayer.destroy();
-									flvPlayer = null;
-								}
-							} else {
-								//人员
-								that.screenUserItem = item.properties.get("employee");
-								that.screenUser = true;
-								// debugger;
-								window.map.flyToMarker(that.userMarker[that.screenUserItem.mac], {
-									duration: 1000,
-									range: 200
-								})
-							}
-						}
-					} else if (type === 'Symbol(polygonmarker)') {
-						//危险作业
-						debugger;
-						console.log(item)
-						let workId = item.properties.get("workId");
-						if(workId){
-							that.areaDetailId = item.properties.get("area");
-							that.getAreaOperation();
-							that.workDetail = true;
-						}else{
-							that.screenRisk = false;
-							that.screenWarning = false;
-							that.areaDetailId = item.properties.get("area");
-							let areaWork = that.areaList.filter(area=>{
-								return area.id==that.areaDetailId
-							});
-							that.areaRowClick(areaWork[0]);
-						}
-						
-					}
-				} else {
-				}
-			});
-			
-		})
-			//左侧数据统计
-			this.getManCount();//人员统计$$
-			this.getWarnings();//报警统计$$
-			this.getAreaList();//区域/风险区域$$
-			this.getGroup();//部门$$
-			//右上展示数据
-			this.getWarningTotal();//事件统计
-			this.getWarningType();//事件类型
-			let pageHeight = document.getElementsByClassName('screen-cockpit')[0].clientHeight;
-			let height1 = document.getElementsByClassName('cockpit-count')[0].clientHeight;
-			let height2 = document.getElementsByClassName('cockpit-alarm')[0].clientHeight;
-			let height3 = document.getElementsByClassName('area-simple-title')[0].clientHeight;
-			// debugger;
-			let domHeight = pageHeight - height1 - 310 - 84;
-			let areaTableHeight = domHeight - height3 - 50;
-			this.areaTableHeight = areaTableHeight;
-			document.getElementsByClassName('cockpit-info')[0].style.height = domHeight + 'px';
-	},
-	computed:{
-		bgmSrc:function(){
-			return this.audioList[this.audioIndex]
-		}
-	},
-	beforeUnmount(){
-		window.map.destroy();
-		window.map = null;
-		this.timerUser = null;
-		this.timerTime = null;
-		this.eventTimer = null;
-		this.timerEventRoll = null;
-		this.eventAudioTimer = null;
-		clearInterval(this.timerUser)//人员
-		clearInterval(this.timerTime)//时间
-		clearInterval(this.eventTimer)//时间
-		clearInterval(this.timerEventRoll)//事件
-		clearInterval(this.eventAudioTimer)//事件
-	},
-	methods: {
-		loadScript(id, url, callback) {
-			debugger;
-			let that = this;
-			//如果已经存在这个id，则证明已经加载过，已经有这个js文件了，可以直接执行回调里面的操作
-			if (document.querySelector(`#${id}`)) {
-				that.ElLoading = null;
-				callback && callback()
-				return;
-			}else{
-				that.ElLoading = this.$loading({
-				lock: true,
-				text: '地图资源加载中...',
-				background: 'rgba(0, 0, 0, 0)',
-			})
-			}
-			
-			//第一次加载，先创建 script 标签
-			const script = document.createElement('script');
-			script.src = url;
-			//创建id属性
-			script.setAttribute('id', id);
-			//获取第一个script标签
-			const firstScript = document.getElementsByTagName('script')[0];
-			//获取第一个script标签的父节点 BODY,在body的第一个script引用之前插入，即把这个动态的js文件放在第一个调用
-			firstScript.parentNode.insertBefore(script, firstScript);
-			//script 一加载就执行
-			script.onload = script.onreadystatechange = function() {
-				that.ElLoading.close();
-				// that.ElLoading = null;
-				
-				// 加载完成
-				if (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') {
-					callback && callback()
-					
-				}
-			};
-		},
-		//查询某个人员
-		searchOne(keyword){
-			let that = this;
-			that.markList[5] = true;
-			that.userMaskerLayer.show = true;
-			clearInterval(that.timerUser);
-			that.timerUser = setInterval(function () {
-				that.refreshUserMarker();
-			}, 10000)
-			that.userList.filter(item=>{
-				if(item.my_info.employee_.name == keyword||item.mac ==keyword){
-					that.screenUserItem = item.my_info.employee_;
-					that.screenUserItem.mac = item.mac;
-					that.screenUser = true;
-					window.map.flyToMarker(that.userMarker[item.mac], {
-						duration: 1000,
-						offset:{
-							rotate: 45,
-							tilt: 60,
-							range: 200
-						}
-					})
-				}
-			})
-		},
-		handleChange(item, check,item2,item3) {
-			let that = this;
-			this.deptChecked = check.checkedKeys;
-			this.userParams.depts = check.checkedKeys;
-		},
-		//人员类型选择
-		userFilter() {
-			let that = this;
-			let checkedKeys = that.deptChecked;
-			window.map.removeLayer(that.userMaskerLayer);
-			that.userMaskerLayer = new jsmap.JSIconTextMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: true
-			});
-			window.map.addLayer(that.userMaskerLayer);
-			let userListNew = [];
-			that.userList.filter(item=>{
-				if(checkedKeys.indexOf(item.my_info.employee_.belong_dept_)>-1){
-					userListNew.push(item)
-					}
-			})
-			that.userList = userListNew;
-			console.log(that.userList)
-			that.showUserMarkers(userListNew);
-			this.showUserSelect = false;
-		},
-		//
-		audioFinished(){
-			if(this.audioIndex<this.audioList.length){
-				this.audioIndex++;
-			}else{
-				this.audioIndex = 0;
-			}
-		},
-		//显示右上角的时间
-		showTime() {
-			this.currentTime = this.$TOOL.dateFormat(new Date(), 'hh:mm:ss');
-			this.currentWeek = this.$TOOL.dateFormat(new Date(), 'week');
-			this.currentDay = this.$TOOL.dateFormat(new Date(), 'yyyy年MM月dd日')
-		},
-		//区域下的作业/监控/喇叭/人员查询
-		areaItemHandle(index){
-			this.areaShowType = index;
-			if(index==1){
-				//区域下的作业
-				this.getAreaOperation();
-			}else if(index==2){
-				//区域下的监控
-				this.getAreaVchannel();
-			}else if(index==3){
-				//区域下的喇叭
-				this.getAreaSpeaker();
-			}else if(index==4){
-				//区域下的人员
-				this.getAreaBlt();
-				this.getAreaList();
-			}
-		},
-		//报警统计
-		getWarningTotal() {		
-			let that = this;
-			that.getEventTotal();
-			that.getNewEvent();
-			clearInterval(that.eventTimer);
-			that.eventTimer = setInterval(function () {
-				that.getEventTotal();
-			}, 60000)
-			clearInterval(that.eventAudioTimer);
-			that.eventAudioTimer = setInterval(function () {
-				that.getNewEvent();
-			}, 20000)
-		},
-		//获取事件总数
-		getEventTotal(){
-			let that = this;
-			that.$API.ecm.event.cateAgg.req(that.cateAggForm).then(res => {
-				if (res.err_msg) { } else {
-					if(that.warningData.total != res.count){
-						that.getWarnings();
-					}
-					that.wStatistics = res;
-				}
-			})
-		},
-		//获取新事件
-		getNewEvent(){
-			let that = this;
-			that.$API.ecm.event.list.req({page_size:1}).then(res => {
-				if (res.err_msg) {
-				} else {
-					let judge = res.results[0].id==that.audioList.id
-					let item = res.results[0];
-					if(that.audioSrc!==''){
-						if(item.id==that.audioList.id){
-						}else{
-							that.audioList = item;
-							that.audioSrc=item.voice;
-							if(item.location){
-								window.map.flyToPosition(new jsmap.JSPoint(item.location.longitude, item.location.latitude), { range: 200,duration: 1000 });
-							}
-						}
-					}else{
-						that.audioList = item;
-						that.audioSrc = item.voice;
-						that.music.play();//播放
-					}
-				}
-			})
-		},
-		//报警类型
-		getWarningType() {
-			let that = this;
-			that.$API.ecm.event_cate.list.req({page:0}).then(res => {
-					if (res.err_msg) { } else {
-						that.warningTypes = res;
-					}
-				})
-		},
-		warningTypeChange(){
-			this.warningTypeShow = !this.warningTypeShow
-		},
-		handleCurrentChange() {
-			this.getWarnings();
-		},
-		//获取报警列表
-		getWarnings() {
-			let that = this;
-			this.$API.ecm.event.list.req(this.warningData.params).then(res => {
-				if (res.err_msg) {
-				} else {
-					that.warningData.list = res.results;
-					that.warningData.total = res.count;
-					that.eventInterval();
-				}
-			})
-		},
-		//事件轮询
-		eventInterval(){
-			let that = this;
-			if (that.timerEventRoll!==null) {
-				clearInterval(that.timerEventRoll);
-				that.timerEventRoll = null;
-			}
-			that.timerEventRoll = setInterval(function () {
-				that.heightNum+=1;
-				if(that.heightNum>250){
-					that.heightNum=0;
-					document.getElementById('eventScrenItem').style.top = 0;
-				}else{
-					let top = -that.heightNum;
-					document.getElementById('eventScrenItem').style.top  = top+'px';
-				}
-			}, 100)
-			
-		},
-		//警报类型查询
-		warningTypeSelected(id,name) {
-			let that = this;
-			this.warningTypeShow = false;
-			let params = new Object();
-			params = that.warningData.params;
-			if (id !== null) {
-				params.cates = id;
-			}
-			this.eventTypeName = name;
-			that.$API.ecm.event.list.req(params).then(res => {
-				if (res.err_msg) { } else {
-					that.warningData.list = res.results;
-					that.warningData.total = res.count;
-				}
-			})
-		},
-		
-		//区域点击事件
-		areaRowClick(data) {
-			let that = this;
-			that.areaDetail = true;
-			that.areaDetailId = data.id;
-			this.getAreaList();
-			this.getAreaOperation();
-			this.getAreaVchannel();
-			this.getAreaSpeaker();
-			this.getAreaBlt();
-			if(data.third_info.xx_rail){
-				let point = data.third_info.xx_rail.detail.polygon.points[0];
-				let points = data.third_info.xx_rail.detail.polygon.points;
-				window.map.flyToPosition(new jsmap.JSPoint(point.longitude, point.latitude, 0), 
-				{ duration:1000,
-					offset:{
-						rotate: 60,
-						tilt: 60,
-						range: 300
-					}
-				});
-				if(that.singleAreaMaskerLayer!==null){
-					that.singleAreaMaskerLayer.setMarkerVisibleByFilter(false, (properties)=>{
-						if(properties && properties.get('id')!==data.id){
-							return true;
-						}
-						return  false;
-					})
-				}
-				that.singleAreaMaskerLayer = new jsmap.JSPolygonMarkerLayer({
-						minimumLevel: 3,
-						maxmumLevel: 22,
-						show: true
-					});
-				let pointsList = [];
-				window.map.addLayer(that.singleAreaMaskerLayer);
-				pointsList = points.map(item => {
-								let obj = item;
-								obj.x=item.longitude;
-								obj.y=item.latitude;
-								return obj
-							});
-				let polygonMarker = new jsmap.JSPolygonMarker({
-					id: data.id,//id
-					position: pointsList,//坐标集合
-					floorId: data.third_info.xx_rail.detail.floorId,//楼层id
-					color: 'rgba(0,0,255,.44)',//填充颜色
-					strokeColor: '#2bff1d',//边线颜色
-					depthTest: false,//是否开启深度检测
-					allowPicking: false,  //是否允许点击
-					displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),  //可见范围
-					properties: {
-						id: data.id
-					},//属性设置
-					callback: (marker) => {
-						// console.log(marker);
-					}//回调
-				});
-				that.singleAreaMaskerLayer.addMarker(polygonMarker);
-			}else{}
-			
-		},
-		areaDetailClose(){
-			let that = this;
-			debugger;
-			that.areaDetail = false;
-			if(that.singleAreaMaskerLayer){
-				that.singleAreaMaskerLayer.show = false;
-			}
-			
-		},
-		//区域下的作业
-		getAreaOperation(){
-			let that = this;
-			this.$API.opm.operation.list.req({area:that.areaDetailId, state: 40}).then(res=>{
-				console.log(res)
-				that.areaOperation = res.results;
-			})
-		},
-		//区域下的监控
-		getAreaVchannel(){
-			let that = this;
-			that.$API.third.tdevice.list.req({area:that.areaDetailId,type:60,page:0}).then(res=>{
-				console.log(res)
-				that.areaVideo = res;
-			})
-		},
-		//区域下的喇叭
-		getAreaSpeaker(){
-			let that = this;
-			that.$API.third.tdevice.list.req({area:that.areaDetailId,type:50,page:0}).then(res=>{
-				console.log(res)
-				that.areaSpeaker = res;
-			})
-		},
-		//区域下的人员
-		getAreaBlt(){
-			let that = this;
-			that.$API.third.blt.all.req({area:that.areaDetailId}).then(res=>{
-				that.areaUser = res.filter(item=>{
-					return item.my_info.employee;
-				});
-			}).catch(res=>{
-				debugger;
-			})
-		},
-		//点击区域下的人员
-		areaEmployeeRowClick(row){
-			let that = this;
-			that.screenUserItem = row.my_info.employee_;
-			that.screenUserItem.mac = row.mac;
-			that.screenUser = true;
-			window.map.flyToMarker(that.userMarker[row.mac], {
-				duration: 1000,
-				offset:{
-					rotate: 45,
-					tilt: 60,
-					range: 300
-				}
-			})
-			that.markList[5] = true;
-			that.userMaskerLayer.show = true;
-			clearInterval(that.timerUser);
-			that.timerUser = setInterval(function () {
-				that.refreshUserMarker();
-			}, 10000)
-		},
-		//点击区域下的作业
-		areaOperationRowClick(row){
-			let that = this;
-			debugger;
-			console.log(row);
-			that.screenJobItem = row;
-			that.$API.opm.opl.list.req({ operation: row.id}).then((res) => {
-				debugger;
-				console.log(res)
-				that.screenJobItem.cates_ = res.results;
-				that.screenOperation = true;
-			});
-		},
-		closeScreenOperation(){
-			this.screenOperation = false;
-			this.screenJobItem = null;
-			
-		},
-		//加载部门数据
-		getGroup() {
-			let that = this;
-			that.$API.system.dept.list.req({ page: 0 }).then(res => {
-				if (res.err_msg) {
-				} else {
-					let rpartsList=[];
-					let arr = [];
-					let children =  genTree(res);
-					console.log(children)
-					for (let i = 0; i < 5; i++) {
-						let obj = new Object();
-						if (i === 0) {
-							obj.id = 0;
-							obj.name = '全部';
-							obj.label = '全部';
-						} else if (i === 1) {
-							obj = children[0];
-						} else if (i === 2) {
-							obj.id = 2;
-							obj.name = '访客';
-							obj.label = '访客';
-						}else if (i === 3) {
-							obj.id = 3;
-							obj.name = '司机';
-							obj.label = '司机';
-						}
-						arr.push(obj)
-					}
-				that.postList = arr;
-				}
-			});
-		},
-		//岗位
-		// getAllPost() {
-		// 	this.$API.system.post.list.req({ page: 0 }).then(res => {
-		// 		let arr = [];
-		// 		let children = genTree(res);
-		// 		for (let i = 0; i < 4; i++) {
-		// 			let obj = new Object();
-		// 			if (i === 0) {
-		// 				obj.id = '';
-		// 				obj.name = '全部';
-		// 				obj.label = '全部';
-		// 			} else if (i === 1) {
-		// 				obj.id = '';
-		// 				obj.name = '正式员工';
-		// 				obj.label = '正式员工';
-		// 				obj.children = children;
-		// 			} else if (i === 2) {
-		// 				obj.id = '';
-		// 				obj.name = '相关方';
-		// 				obj.label = '相关方';
-		// 			} else if (i === 3) {
-		// 				obj.id = '';
-		// 				obj.name = '访客';
-		// 				obj.label = '访客';
-		// 			}
-		// 			arr.push(obj)
-		// 		}
-		// 		this.postList = arr;
-		// 	})
-		// },
-		//人员统计
-		getManCount() {
-			let that = this;
-			if (that.countIndex === '2') {
-				that.$API.third.blt.countNow.req().then(res => {
-					if (res.err_msg) {
-					} else {
-						that.userCount = { ...res };
-					}
-				})
-			} else {
-				that.$API.third.blt.countBind.req().then(res => {
-					if (res.err_msg) {
-					} else {
-						that.userCount = { ...res };
-					}
-				})
-			}
-		},
-		//有卡/在线切换
-		countINdexChange(index) {
-			this.countIndex = index;
-			this.getManCount();
-		},
-		
-		getAreaList() {
-			let that = this;
-			that.$API.am.area.list.req({page:0}).then(res => {
-				if (res.err_msg) {
-				} else {
-					that.areaList = res;
-				}
-			})	
-		},
-
-		//获取危险作业
-		getDangers() {
-			let that = this;
-			that.$API.opm.operation.list.req({state:40}).then(res => {
-			// that.$API.opm.operation.list.req({state:10}).then(res => {
-				if (res.err_msg) {
-
-				} else {
-					that.dangerList = res.results;
-					debugger;
-					that.showPolygonMarkers(that.dangerList);
-				}
-			})
-		},
-		//区域列表/获取风险区域
-		getAreas() {
-			let that = this;
-			that.$API.am.area.list.req({page:0}).then(res => {
-				if (res.err_msg) {
-				} else {
-					that.areaList = res;
-					that.showRiskMarkers(that.areaList);
-				}
-			})
-		},
-		//获取人员列表（全部在线标签列表信息）
-		getAllMen() {
-			let that = this;
-			that.$API.third.blt.all.req().then(res => {
-				if (res.err_msg) {
-				} else {
-					that.userList = res.filter(item => {
-						return item.my_info.employee
-					});
-					that.allUserList = that.userList;
-					that.showUserMarkers(that.userList);
-				}
-			})
-		},
-		
-		//选择部门
-		groupClick(data) {
-			console.log(data);
-		},
-		checkChange(data1,data2,data3,data4){
-			console.log(data1);
-			console.log(data2);
-			console.log(data3);
-			console.log(data4);
-		},
-		//获取人员详细信息
-		showUserDetail() {
-			this.screenUserDetail = true;
-			this.$API.hrm.employee.item.req(this.screenUserItem.id).then(res => {
-				this.screenUserItemDetail = res;
-			})
-		},
-		
-		//风险区域layer
-		riskMaskerLayers() {
-			let that = this;
-			that.riskMarkerLayer = new jsmap.JSBoxMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: false
-			});
-			window.map.addLayer(that.riskMarkerLayer);
-			that.getAreas();//区域/风险区域$$
-
-		},
-		//摄像头layer
-		cameraMaskerLayers() {//图标文字
-			let that = this;
-			that.cameraMaskerLayer = new jsmap.JSIconTextMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: false
-			});
-			window.map.addLayer(that.cameraMaskerLayer);
-			that.getVchannels();
-		},
-		//监控视频播放
-		domMarkerLayers() {
-			let that = this;
-			that.domMarkerLayer = new jsmap.JSDomMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: true
-			});
-			window.map.addLayer(that.domMarkerLayer);
-		},
-		// jobDomMarkerLayers() {
-		// 	let that = this;
-		// 	that.jobDomMarkerLayer = new jsmap.JSDomMarkerLayer({
-		// 		minimumLevel: 3,
-		// 		maxmumLevel: 22,
-		// 		show: false
-		// 	});
-		// 	window.map.addLayer(that.jobDomMarkerLayer);
-		// 	that.showJobDomMarkers();
-		// },
-		//点击区域显示图层
-		areaMarkerLayers() {
-			let that = this;
-			that.areaMarkerLayer = new jsmap.JSDomMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: true
-			});
-			window.map.addLayer(that.areaMarkerLayer);
-		},
-		//员工标记layer
-		userMaskerLayers() {//图标文字
-			let that = this;
-			that.userMaskerLayer = new jsmap.JSIconTextMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: false
-			});
-			window.map.addLayer(that.userMaskerLayer);
-			//添加线的图层
-			that.getAllMen();
-		},
-		//喇叭layer
-		speakersMaskerLayers() {//消防物资
-			let that = this;
-			that.materialsMaskerLayer = new jsmap.JSIconTextMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: false
-			});
-			window.map.addLayer(that.materialsMaskerLayer);
-			//获取喇叭列表
-			this.getSpeakers();
-		},
-		//危险作业Layer
-		polygonMarkerLayers() {//危险作业
-			let that = this;
-			that.polygonMaskerLayer = new jsmap.JSPolygonMarkerLayer({
-				minimumLevel: 3,
-				maxmumLevel: 22,
-				show: false
-			});
-			window.map.addLayer(that.polygonMaskerLayer);
-			that.getDangers();
-		},
-		//风险区域
-		showRiskMarkers(list) {
-			let that = this;
-			if(list.length>0){
-				list.forEach(item => {
-					let boxMarker = null;
-					let pointsList = [], floorId = null;
-					if (item.third_info.xx_rail!==null&&item.third_info.xx_rail!==undefined) {
-						floorId = item.third_info.xx_rail.detail.floorId;
-						let points = item.third_info.xx_rail.detail.polygon.points;
-						// debugger;
-						pointsList = points.map(item => {
-							let obj = item;
-							obj.x=item.longitude;
-							obj.y=item.latitude;
-							return obj
-						});
-						let areaId = item.id;
-						let maskColor = '',strokeColor='';
-						if(item.level===10){
-							maskColor = 'rgba(0,0,255,.3)';//蓝色
-							strokeColor = '#0000ff';
-						}else if(item.level===20){
-							maskColor = 'rgba(255,255,0,0.44)';//黄色
-							strokeColor = '#ffff00';
-						}else if(item.level===30){
-							maskColor = 'rgba(255,153,0,0.44)';//橙色
-							strokeColor = '#ff9900';
-						}else if(item.level===40){
-							maskColor = 'rgba(255,0,0,0.44)';//红色
-							strokeColor = '#ff0000';
-						}
-						boxMarker = new jsmap.JSBoxMarker({
-							id: item.id,
-							position: pointsList,
-							floorId: floorId,//楼层id
-							color: maskColor,//颜色
-							height: 0,//基底高度
-							stretchHeight: 35,//拉伸高度
-							strokeColor: strokeColor,//边线颜色
-							show: true, //是否显示
-							allowPicking: true, //是否允许点击
-							displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),//可见范围
-							properties: {
-								areaId: areaId
-							},
-						});
-						that.riskMarkerLayer.addMarker(boxMarker);
-					}
-				})
-			}
-			
-		},
-		//摄像头Marker
-		showCameraMarkers(list) {
-			// debugger;
-			let that = this;
-			if(list.length>0){
-				list.forEach(item => {
-					let cameraMarker = null;
-					let pixel = item.my_info.location;
-					if(pixel.x){
-						cameraMarker = new jsmap.JSIconTextMarker({
-							id: item.channelCode,
-							position: { x: pixel.x, y: pixel.y, z: pixel.z },  //坐标
-							floorId: pixel.floorId,  //楼层id,默认为1（地面）
-							image: "/img/camera.svg",
-							text: item.channelName,
-							font: 'lighter 12px serif',
-							fontColor: '#ffffff',
-							imageHeight: 25,
-							imageWidth: 25,
-							backgroundColor: 'rgba(0,0,0,0.3)',
-							backgroundRadius: 1,
-							backgroundStrokeColor: 'rgba(0,0,0,0.3)',
-							backgroundStrokeWidth: 1,
-							iconTextType: jsmap.JSIconTextType.TOPTEXT_BOTTOMICON,
-							allowPicking: true,
-							displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),
-							nearFarScale: new jsmap.JSNearFarScale(0.0, 1, 500, 1),
-							show: true,
-							callback: () => {
-							}
-						});
-						// debugger;
-						// console.log(that.cameraMaskerLayer)
-						that.cameraMaskerLayer.addMarker(cameraMarker);
-					}
-				})
-			}
-
-		},
-		//喇叭Marker
-		showSpeakersMarkers(list) {
-			let that = this;
-			list.forEach(item => {
-				let materialMarker = null;
-				let pixel = item.my_info.location;
-				console.log(pixel)
-				materialMarker = new jsmap.JSIconTextMarker({
-				id: item.id,
-				position: {x: pixel.x, y: pixel.y, z: pixel.z},  //坐标
-				floorId: pixel.floorId,  //楼层id,默认为1（地面）
-				image: "/img/sound.svg",
-				text: item.name,
-				font: '10px sans-serif',
-				fontColor: '#ffffff',
-				imageHeight: 25,
-				imageWidth: 25,
-				// fontStrokeColor: '#1f0fdd',
-				fontStrokeWidth: 1,
-				backgroundColor: 'rgba(0,0,0,0.3)',
-				backgroundRadius: 1,
-				backgroundStrokeColor: 'rgba(0,0,0,0.3)',
-				backgroundStrokeWidth: 1,
-				iconTextType: jsmap.JSIconTextType.TOPTEXT_BOTTOMICON,
-				allowPicking: false,
-				displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),
-				nearFarScale: new jsmap.JSNearFarScale(0.0, 1, 500, 1),
-				show: true
-			});
-			that.materialsMaskerLayer.addMarker(materialMarker);
-			})
-			
-		},
-		//人员Marker
-		showUserMarkers(userList) {
-			// debugger;
-			let that = this;
-			//标记图片
-			let userImage = '';
-			if (userList.length > 0) {
-				userList.forEach(item=>{
-					let employee_ = item.my_info.employee_,online = item.online;;
-						employee_.mac = item.mac;
-					let employeeType = item.my_info.employee_.type
-					if (employeeType === 'employee') {
-						userImage = "/img/employee.png"
-					}else if (employeeType === 'driver') {
-						userImage = "/img/driver.png"
-					}  else if (employeeType === 'remployee') {
-						userImage = "/img/driver.png"
-					}else {
-						userImage = "/img/visitor.png"
-					}
-					let floorId = 1;
-					if(item.floorNo=='Floor1'){
-						floorId = 1;
-					}else if(item.floorNo=='Floor2'){
-						floorId = 2;
-					}else if(item.floorNo=='Floor3'){
-						floorId = 3;
-					}else if(item.floorNo=='Floor4'){
-						floorId = 4;
-					}else if(item.floorNo=='Floor5'){
-						floorId = 5;
-					}
-					that.userMarker[item.mac] = new jsmap.JSIconTextMarker({
-						id: item.my_info.code,
-						position: { x:item.longitude, y: item.latitude, z: item.z },  //坐标
-						floorId: floorId,  //楼层id,默认为1（地面）
-						image: userImage,
-						text: employee_.name,
-						font: '10px sans-serif',
-						fontColor: '#ffffff',
-						imageHeight: 25,
-						imageWidth: 25,
-						backgroundColor: 'rgba(0,0,0,0.3)',
-						backgroundRadius: 1,
-						backgroundStrokeColor: 'rgba(0,0,0,0.3)',
-						backgroundStrokeWidth: 1,
-						iconTextType: jsmap.JSIconTextType.TOPTEXT_BOTTOMICON,
-						allowPicking: true,
-						displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),
-						nearFarScale: new jsmap.JSNearFarScale(0.0, 1, 500, 1),
-						show: true,
-						properties: {
-							employee: employee_,
-							online:online
-						},
-						callback: (marker) => {
-					 	}
-					});
-					that.userMaskerLayer.addMarker(that.userMarker[item.mac]);
-					that.userMaskerLayer.setMarkerVisibleByFilter(false, (properties)=>{
-						if(properties && properties.get('online')!==true){
-							return true;
-						}
-						return  false;
-					})
-				})
-			}
-		},
-		//更新人员标记
-		refreshUserMarker() {
-			if (document.getElementById("mapContainer") == null || document.getElementById("mapContainer") == undefined){
-				return
-			}
-			let that = this;
-			that.$API.third.blt.all.req(that.userParams).then(res => {
-				if (res.err_msg) {
-				} else {
-					let userList = res.filter(item => {
-						return item.my_info.employee
-					});
-					let addUser = that.func(userList, that.userList)[0];
-					let refreshList = that.func(userList, that.userList)[1];
-					that.allUserList = that.userList = refreshList.concat(addUser);//更新userList
-					that.showUserMarkers(addUser);//增加新进在线员工
-					that.userMaskerLayer.setMarkerVisibleByFilter(false, (properties)=>{
-						if(properties && properties.get('online')!==true){
-							return true;
-						}
-						return  false;
-					})
-					refreshList.forEach(item1 => {
-						let item2 = {};
-						item2={...item1};
-						that.userMaskerLayer.updateMarkerPosition(that.userMarker[item2.mac], {
-							floorId: 1,
-							position: { x: item2.longitude, y: item2.latitude, z: item2.z },
-							animate: { duration: 10000, }
-						});//动画效果,持续时间一秒
-					})
-				}
-			})
-		},
-		//比较两次获取的人数的变动  func(a,b)//a与b相比多出来的
-		func(arr1, arr2) {
-			let arr = [];
-			let list = [];
-			let bool = false;
-			let same = false;
-			for (let i = 0; i < arr1.length; i++) {
-				for (let j = 0; j < arr2.length; j++) {
-					//遇到相同直接跳出循环
-					if (arr1[i].id === arr2[j].id) {
-						same = i;
-						bool = false;
-						break;
-					} else {
-						same = false;
-						bool = i;
-					}
-				}
-				if (same !== false) list.push(arr1[same]);
-				if (bool !== false) arr.push(arr1[bool]);
-			}
-			let arrList = [arr, list];
-			return arrList;
-		},
-		//危险作业
-		showPolygonMarkers(data) {
-			let that = this;
-			if(data.length>0){
-				debugger;
-				data.forEach(item => {
-					let polygonMarker = null;
-					 let areaWork = that.areaList.filter(area=>{
-						return area.id==item.area
-					});
-					let points = areaWork[0].third_info.xx_rail.detail.polygon.points;;
-					let pointsList = points.map(item => {
-						let obj = item;
-						obj.x=item.longitude;
-						obj.y=item.latitude;
-						return obj
-					});
-					polygonMarker = new jsmap.JSPolygonMarker({
-						id: item.id+'work',//id
-						position: pointsList,//坐标集合
-						floorId: 1,//楼层id
-						color: 'rgba(241,193,105,.44)',//填充颜色
-						strokeColor: '#2bff1d',//边线颜色
-						depthTest: false,//是否开启深度检测
-						allowPicking: true,  //是否允许点击
-						displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),  //可见范围
-						properties: {
-							workId:item.id,
-							area: item.area
-						},//属性设置
-						callback: (marker) => {
-							// console.log(marker);
-						}//回调
-					});
-					this.polygonMaskerLayer.addMarker(polygonMarker);
-				})
-			}
-		},
-		//危险作业图片标记
-		// showJobDomMarkers() {
-		// 	let domMarker = new jsmap.JSDomMarker({
-		// 		id: 'polygonmark',
-		// 		position: new jsmap.JSPoint(114.63168864138028, 38.81254802029822, 0),
-		// 		floorId: 1,
-		// 		depthTest: true,
-		// 		content: `<div style="display: block;position:absolute;z-index: 10;top: 0;background: rgba(24,36,51,.7);padding: 0 16px 16px;box-sizing: border-box" id="vchannelWrap"><div style="background-image: url('/img/speaker.png');width: 60px;height: 80px;"></div></div>`,
-		// 		offset: jsmap.JSControlPosition.RIGHT_CENTER,
-		// 		displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),
-		// 		marginOffset: {
-		// 			x: 0,
-		// 			y: 0
-		// 		},
-		// 		properties: {
-		// 			type: 0,
-		// 		},
-		// 		callback: (node) => {
-		// 			console.log(node);
-		// 		}
-		// 	});
-		// 	this.jobDomMarkerLayer.addMarker(domMarker);
-		// },
-		
-		//显示人员类型选项
-		userSelect() {
-			this.showUserSelect = !this.showUserSelect
-		},
-		//暂停或旋转
-		autoRunChange() {
-			this.autoRun = !this.autoRun;
-			if (this.autoRun) {
-				this.mapRun();
-			} else {
-				this.mapPause();
-			}
-		},
-
-		//自动旋转
-		mapRun() {
-			if (this.flyManager !== null) {
-				this.flyManager.restartFly();
-			} else {
-				//地图旋转展示
-				this.flyManager = new jsmap.JSFlyManager(window.map);
-				this.flyManager.flyByCircle({
-					center: { x: 114.63059258861512, y: 38.81407163905287, z: 1 },
-					distance: 500,
-					duration: 100000,
-					tilt: 30
-				});
-			}
-
-		},
-
-		//暂停旋转
-		mapPause() {
-			// this.flyManager.destroy();
-			this.flyManager.pauseFly();
-		},
-
-		//多选框展开收起
-		filterCtrlFocusChange() {
-			this.filterCtrlFocus = !this.filterCtrlFocus
-		},
-
-		//页面maker的展示控制
-		markerClick(index) {
-			let arr = [];
-			let that = this;
-			that.markList[index] = !that.markList[index];
-			if (index === 0) {
-				if (that.markList[0]) {
-					arr = that.markList.map(value => {
-						return true
-					})
-				} else {
-					arr = that.markList.map(value => {
-						return false
-					})
-				}
-				that.markList = arr;
-			} else {
-				let list = that.markList.slice(1, 7);
-				if (list.indexOf(true) > -1 && list.indexOf(false) < 0) {
-					that.markList[0] = true;
-				} else {
-					that.markList[0] = false;
-				}
-			}
-			// if (that.markList[1]) {
-			// 	window.map.showBuildingMarker = true;
-			// } else {
-			// 	window.map.showBuildingMarker = false;
-			// }
-			if (that.markList[1]) {
-				that.cameraMaskerLayer.show = true;
-			} else {
-				that.cameraMaskerLayer.show = false;
-			}
-			if (that.markList[2]) {
-				that.materialsMaskerLayer.show = true;
-			} else {
-				that.materialsMaskerLayer.show = false;
-			}
-			if (that.markList[3]) {
-				// that.jobDomMarkerLayer.show = true;
-				that.polygonMaskerLayer.show = true;
-			} else {
-				// that.jobDomMarkerLayer.show = false;
-				that.polygonMaskerLayer.show = false;
-			}
-			if (that.markList[4]) {
-				that.riskMarkerLayer.show = true;
-			} else {
-				that.riskMarkerLayer.show = false;
-			}
-			if (that.markList[5]) {
-				that.userMaskerLayer.show = true;
-				clearInterval(that.timerUser);
-				that.timerUser = setInterval(function () {
-					that.refreshUserMarker();
-				}, 10000)
-			} else {
-				that.userMaskerLayer.show = false;
-				clearInterval(that.timerUser);
-				that.timerUser = null;
-			}
-		},
-
-		//获取摄像头列表
-		getVchannels() {
-			let that = this;
-			// debugger;
-			that.$API.am.tdevice.vchannel.req({pageSize:999}).then(res => {
-				if (res.err_msg) {
-					that.$message.error(res.err_msg);
-				} else {
-					let Vchannels = res.pageData.filter(item=>{
-						return item.my_info.location!==undefined;
-					})
-					that.Vchannels = Vchannels;
-					that.showCameraMarkers(Vchannels);
-				}
-			});
-		},
-
-		//获取喇叭列表
-		getSpeakers() {
-			let that = this;
-			that.$API.am.tdevice.speaker.req().then(res => {
-				if (res.err_msg) {
-					that.$message.error(res.err_msg);
-				} else {
-					let list = res.rows.filter(item=>{
-						return item.my_info.location!==undefined;
-					})
-					that.speakerList = list;
-					that.showSpeakersMarkers(res.rows);
-				}
-			});
-		},
-
-		//报警详情
-		warningItemShow(item) {
-			this.screenJob = false;
-			this.screenRisk = false;
-			this.screenWarningItem = item;
-			this.warningId = item.id;
-			// console.log(item);
-			this.$nextTick(() => {
-				this.screenWarning = true;
-			});
-		},
-
-		//关闭危险作业
-		closeScreenJob() {
-			this.screenJob = false;
-		},
-
-		//关闭风险区域
-		closeScreenRisk() {
-			this.screenRisk = false;
-		},
-
-		//光比报警页面
-		closeScreenWarning() {
-			this.screenWarning = false;
-		},
-
-		//报警处理
-		handleWarning() {
-			let that = this;
-			that.warningForm.mark = parseInt(that.warningForm.mark);
-			that.$API.ecm.event.handle.req(that.warningId, that.warningForm).then(res => {
-				if (res.err_msg) {
-
-				} else {
-					that.screenWarning = false;
-					that.getWarnings();
-				}
-			})
-		},
-
-		//员工列表点击
-		userRowClick(row) {
-			let that = this;
-			// debugger;
-			window.map.flyToMarker(that.userMarker[row.mac], {
-				duration: 1000,range: 200
-			})
-			that.screenUserItem.name = row.my_info.employee_.name;
-			that.screenUserItem.type = row.my_info.employee_.type;
-			that.screenUserItem.id = row.my_info.employee_.id;
-			that.screenUserItem.photo = row.my_info.employee_.photo ? row.my_info.employee_.photo : '';
-			that.screenUserItem.post_name = row.my_info.employee_.post_name ? row.my_info.employee_.post_name : '';
-			that.screenUserItem.belong_dept_name = row.my_info.employee_.belong_dept_name ? row.my_info.employee_.belong_dept_name : '';
-		},
-		//人员追踪
-		userTrack() {
-			
-			this.tracking = true;
-			window.map.trackMarker(this.userMarker[this.screenUserItem.mac], {
-				range: 200
-			})
-		},
-		//取消人员追踪
-		userUnTrack() {
-			window.map.cancelTrack();
-			this.tracking = false;
-		},
-		//人员轨迹
-		userLineTrack(){
-			let that = this;
-			that.lineTracking = true;
-			that.userMaskerLayer.show = false;
-			let nowTime = new Date().getTime();
-			let preTime = nowTime-60*60 * 1000;
-			let params = {
-				url:"/api/datacenter/user/historypathV2",
-				method:"post",
-				json:{
-					mac: that.screenUserItem.mac,
-					startTime: preTime,
-					endTime: nowTime,
-					locationType: "real"
-				}
-			};
-			let points0 = [];
-			that.$API.third.blt.xunxiCommon.req(params).then(res => {
-				if (res.err_msg) { } else {
-					let points = [];
-					res.forEach(item=>{
-						item.points.forEach(poi=>{
-							points.push(poi)
-						})
-					})
-					points.forEach(item=>{
-						let obj=new Object();
-						obj.x=item.longitude;
-						obj.y=item.latitude;
-						obj.z=item.z;
-						points0.push(obj); 
-					});
-					if(points0.length>0){
-						that.line1 = null;
-					if (that.line1==null) {
-						that.line1 = new jsmap.JSLineMarker({
-							position: points0,
-							floorId: 1,
-							lineType: jsmap.JSLineType.ARROW,
-							color: '#0000ff',
-							width: 10,
-							depthTest: true
-						});
-						window.map.addMarker(that.line1);
-					}
-					that.trackMarker = new jsmap.JSIconTextMarker({
-						id: '1',
-						position: points0[0],
-						image: "/img/visitor.png",
-						rotation: {
-							rx: 0,
-							ry: 0,
-							rz: -90
-						},
-						text: that.screenUserItem.name,
-						fontColor: '#0000ff',
-						font: '14px 微软雅黑',
-						backgroundColor: 'rgba(112,253,147,0.5)',
-						backgroundRadius: 5,
-						textOffsetInMeter: 1.6,
-						backgroundStrokeColor: 'rgb(255,255,255)',
-						modelAnimate: {
-							multiplier: 2,
-						},
-						scale: 1,
-						properties: {
-							name: 'trackMarker'
-						},
-						callback: (marker) => {
-							window.map.trackMarker(marker, {
-							range: 100,
-							tilt: 60,
-							rotate: 310
-							});
-							for (let i = 1; i < points0.length; i++) {
-								setTimeout(() => {
-									window.map.updateMarkerPosition(marker, {
-										position: points0[i],
-										animate: {
-											duration: 1000,
-											update: (pos) => {
-												that.line1.trace(pos)
-											}
-										}
-									});
-								}, i * 1000);
-							}
-						}
-					});
-					window.map.addMarker(that.trackMarker);
-					}else{
-						that.$message.error('暂无运动痕迹');
-					}
-				}
-			})
-		},
-		userLineTrackCancel(){
-			window.location.reload();
-			let that = this;
-			that.lineTracking = false;
-			that.userMaskerLayer.show = true;
-			window.map.cancelTrack();
-			window.map.removeMarker(that.trackMarker);
-			window.map.removeAllPointMarker();
-			window.map.removeMarker(that.line1);
-			window.map.removeAllLineMarker();
-			that.trackMarker = null;
-			that.line1 = null;
-		},
-		//区域/部门切换
-		cockpitChange(index) {
-			this.LBType = index;
-		},
-		//选择人员分类
-		changeDropIndex(index) {
-			let that = this;
-			that.dropIndex = index;
-			setTimeout(function () {
-				that.showUserSelect = false;
-			}, 300)
-		},
-		allWarningView(){
-			this.$router.push('/ecm/event')
-		},
-		speakerPasue(){
-			this.speakerPlayStatus = false;
-			this.music.pause(); //暂停
-		},
-		speakerPlay(){
-			this.speakerPlayStatus = true;
-			this.music.play();//播放
-		},
-		//关闭作业列表
-		workDetailClose(){
-			this.workDetail = false;
-		},
-		//查看监控
-		showVchannel(item){
-			let that = this;
-			debugger;
-			console.log(item)
-			that.channelCode = item.code;
-			that.channelName = item.name;
-			that.limitedVisible = true;
-		},
-		viewClose(){
-			this.limitedVisible = false;
-		},
-		showOpretion(item){
-			let that = this;
-			that.ticketId = item.ticket;
-			// that.projectId = item.operation;
-			that.cateType = item.cate_.code;
-			if (that.cateType === "visit") {
-				that.projectId = item.ticket_.ticket_data.visit;
-			} else if (that.cateType === "rpj") {
-				that.projectId = item.ticket_.ticket_data.rpj;
-			} else {
-				that.cateType = "opl";
-				that.projectId = item.ticket_.ticket_data.opl;
-			}
-			that.limitedOpreation = true;
-		},
-	},
-	beforeRouteLeave(to, from, next){
-    next();
-    if (this.timerUser) {
-      clearInterval(this.timerUser);
-      this.timerUser = null;
-    }
-	if (this.timerTime) {
-      clearInterval(this.timerTime);
-      this.timerTime = null;
-    }
-	if (this.eventTimer) {
-      clearInterval(this.eventTimer);
-      this.eventTimer = null;
-    }
-	if (this.timerEventRoll) {
-      clearInterval(this.timerEventRoll);
-      this.timerEventRoll = null;
-    }
-	if (this.eventAudioTimer) {
-      clearInterval(this.eventAudioTimer);
-      this.eventAudioTimer = null;
-    }
-  },
-	unmounted() {
-		// window.map.destroy();
-		window.map = null;
-	},
-}
-</script>
-
-<style lang="scss">
-.handleWarningBtn,
-.handleWarningBtn:active,
-.handleWarningBtn:focus,
-.handleWarningBtn:hover {
-	cursor: pointer;
-	border: 1px solid #30ffdd;
-	color: #ffffff;
-	background: rgba(48, 255, 220, 0.35);
-}
-
-.el-loading-spinner .el-loading-text{
-  color: #Ffa500;
-}
-
-.el-loading-spinner .path{
-  stroke: #Ffa500;
-}
-
-.el-radio.el-radio--small .el-radio__label {
-	color: #ffffff;
-}
-
-.el-radio__input.is-checked .el-radio__inner {
-	border-color: #30ffdd;
-	background: #30ffdd;
-}
-
-.el-radio__input.is-checked+.el-radio__label {
-	color: #30ffdd;
-}
-
-.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
-	background: rgba(48, 255, 220, 0);
-}
-
-#bigScreenTree {
-	background: none !important;
-}
-
-#bigScreenTree .el-tree-node__content {
-	color: #ffffff;
-	/*background-color:rgba(255,255,255,.1);*/
-}
-
-#bigScreenTree .el-tree-node__content:hover {
-	background-color: rgba(255, 255, 255, .1)
-}
-
-#bigScreenTree .el-tree-node:focus>.el-tree-node__content {
-	background-color: rgba(255, 255, 255, .1)
-}
-
-.v_title :before {
-	content: "";
-	display: inline-block;
-	position: absolute;
-	left: 0;
-	top: 14px;
-	width: 0;
-	height: 16px;
-	border: 1px solid #31fe27;
-}
-
-.v_masker {
-	width: 327px !important;
-	height: 183px !important;
-	background: url(/public/img/v_mask.png) no-repeat !important;
-	background-size: 100% 100% !important;
-}
-
-.hoverPointer:hover {
-	cursor: pointer;
-}
-
-.screen-main {
-	width: 100%;
-	height: 100%;
-
-	.screen-per-list {
-		height: calc(100% - 270px);
-	}
-
-	.danger-btn-bg {
-		display: inline-block;
-		height: 32px;
-		line-height: 32px;
-		border-radius: 16px;
-		color: #fff;
-		font-size: 14px;
-		padding: 0 18px;
-		border: 1px solid #ffc679;
-		background: #dd8000;
-		box-shadow: inset 0 0 8px #fda732;
-		cursor: pointer;
-	}
-
-	.danger-btn-bg:hover {
-		box-shadow: 0 0 8px #fda732, inset 0 0 8px #fda732;
-	}
-
-	.h100 {
-		height: 100%;
-	}
-
-	.person-info-header {
-		position: relative;
-
-		.basic-btn {
-			position: absolute;
-			right: 0;
-			top: 0;
-		}
-
-		.header-basic {
-			margin-bottom: 8px;
-			display: flex;
-			justify-content: space-between;
-
-			.basic-img {
-				width: 104px;
-				height: 144px;
-			}
-
-			.basic-info {
-				width: calc(100% - 130px);
-
-				.info-item {
-					font-size: 14px;
-					margin-bottom: 6px;
-					display: flex;
-
-					.info-item-name {
-						color: #fff;
-						font-weight: 400;
-						flex-shrink: 0;
-					}
-
-					.info-item-info {
-						color: #fff;
-						font-weight: 500;
-						overflow: hidden;
-						white-space: nowrap;
-						text-overflow: ellipsis;
-					}
-				}
-			}
-		}
-	}
-
-	.basic-btn-group {
-		margin: 12px 0;
-		display: flex;
-		justify-content: space-between;
-
-		.btn-item {
-			width: 48%;
-			text-align: center;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-
-			.trackImg {
-				width: 16px;
-				height: 16px;
-				margin-right: 4px;
-				background-image: url("/public/img/v_track.png");
-			}
-
-			.viewImg {
-				width: 16px;
-				height: 16px;
-				margin-right: 4px;
-				background-image: url("/public/img/v_view.png");
-			}
-
-			img {
-				width: 16px;
-				height: 16px;
-				margin-right: 4px;
-			}
-		}
-	}
-
-	.screen-header {
-		width: 100% !important;
-		height: 84px !important;
-		position: absolute !important;
-		left: 0 !important;
-		top: 0 !important;
-		background: linear-gradient(0deg, rgba(0, 113, 155, 0) 0, #00455f) !important;
-		z-index: 2 !important;
-		transition: all .5s linear !important;
-
-		.header-left-bg {
-			height: 60px;
-			position: absolute;
-			left: 18px;
-			top: 12px;
-			font-size: 40px;
-			font-weight: 700;
-			color: #fff;
-		}
-
-		.header-right-action {
-			position: absolute;
-			top: 10px;
-			right: 18px;
-			display: flex;
-			align-items: center;
-
-			.right-action-clock {
-				:before {
-					content: " ";
-					display: inline;
-					position: absolute;
-					left: -24px;
-					top: 9px;
-					width: 16px;
-					height: 16px;
-					/*background: url(/img/screen5/clock.png) no-repeat;*/
-					background-size: 100% 100%;
-				}
-
-				.action-time {
-					width: 56px;
-					height: 19px;
-					font-size: 14px;
-					font-weight: 400;
-					color: #fff;
-					position: relative;
-					margin-right: 20px;
-				}
-			}
-
-		}
-	}
-
-	.screen-cockpit {
-		width: 440px;
-		height: 100%;
-		z-index: 1;
-		display: flex;
-		position: absolute;
-		flex-direction: column;
-		background: linear-gradient(90deg, #00455f, rgba(0, 113, 155, 0));
-		transition: all .5s linear;
-		padding-top: 84px;
-		box-sizing: border-box;
-
-		.cockpit-count {
-			width: 100%;
-			padding: 0 10px 0 18px;
-			position: relative;
-		}
-
-		.cockpit-alarm {
-			width: 100%;
-			position: relative;
-			padding: 0 10px 0 18px;
-		}
-
-		.cockpit-info {
-			width: 100%;
-			position: relative;
-			padding: 0 10px 0 18px;
-		}
-
-		.divider {
-			display: block;
-			height: 1px;
-			width: 100%;
-			background: hsla(0, 0%, 100%, .5);
-			z-index: 2;
-		}
-
-		.simple-title {
-			line-height: 22px;
-			font-size: 16px;
-			font-weight: 700;
-			color: #fff;
-			position: relative;
-			padding-left: 8px;
-			height: 44px;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-		}
-
-		.simple-title:before {
-			content: "";
-			display: inline-block;
-			position: absolute;
-			left: 0;
-			top: 14px;
-			width: 0;
-			height: 16px;
-			border: 1px solid #31fe27;
-		}
-	}
-
-	.screen-ctrl {
-		position: absolute;
-		top: 60px;
-		right: 18px;
-		z-index: 2;
-		transition: all .5s linear;
-	}
-
-	.screen-tab {
-		position: absolute;
-		bottom: 0;
-		left: 50%;
-		z-index: 9;
-		transform: translate(-50%);
-		transition: all .5s linear;
-	}
-
-	.screen-multiple-select {
-		position: relative;
-		display: inline-block;
-
-		.multiple-select-tags {
-			position: relative;
-			background: rgba(48, 255, 220, .35);
-			border: 1px solid #30ffdc;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			height: 32px;
-			border-radius: 16px;
-			cursor: pointer;
-
-			.multiple-select-input {
-				max-width: calc(100% - 50px);
-				box-sizing: border-box;
-				font-size: 12px;
-				color: #fff;
-				text-overflow: ellipsis;
-				white-space: nowrap;
-				overflow: hidden;
-				margin-right: 8px;
-			}
-
-			.multiple-select-caret {
-				color: #fff;
-				font-size: 12px;
-			}
-		}
-
-		.multiple-select-wrap {
-			width: 100%;
-			z-index: 20;
-			position: absolute;
-			top: 36px;
-			left: 0;
-			overflow: auto;
-			max-height: 250px;
-			border-radius: 4px;
-			background: #007767;
-			box-shadow: inset 0 0 4px #0bf1ff;
-
-			.multiple-select-ul {
-				padding: 4px 0;
-
-				.multiple-select-li {
-					position: relative;
-					padding: 0 16px 0 32px;
-					width: 100%;
-					font-size: 14px;
-					white-space: nowrap;
-					text-overflow: ellipsis;
-					color: #fff;
-					height: 34px;
-					line-height: 34px;
-					box-sizing: border-box;
-					cursor: pointer;
-					text-align: left;
-				}
-
-				.multiple-select-label {
-					color: #fff;
-					font-size: 12px;
-				}
-			}
-		}
-	}
-
-	.screen-risk {
-		width: 390px;
-		height: fit-content;
-		max-height: calc(100% - 180px);
-		padding: 0 16px 16px;
-		background: rgba(24, 36, 51, .7);
-		position: absolute;
-		top: 170px;
-		right: 18px;
-		z-index: 9999;
-		overflow-y: scroll;
-		transition: all .5s linear;
-
-		.risk-content {
-			height: calc(100% - 44px);
-
-			.risk-item {
-				font-size: 14px;
-				margin-bottom: 12px;
-				display: flex;
-
-				.risk-item-name {
-					color: hsla(0, 0%, 100%, .8);
-					font-weight: 400;
-				}
-
-				.risk-item-info {
-					color: #fff;
-					font-weight: 500;
-					overflow: hidden;
-					white-space: nowrap;
-					text-overflow: ellipsis;
-				}
-			}
-		}
-	}
-
-	.screen-job {
-		width: 390px;
-		padding: 0 16px 16px;
-		background: rgba(24, 36, 51, .7);
-		position: absolute;
-		top: 170px;
-		right: 18px;
-		z-index: 1;
-		transition: all .5s linear;
-
-		.job-content {
-			height: calc(100% - 44px);
-			overflow-y: auto;
-
-			.job-basic {
-				.job-item {
-					font-size: 14px;
-					margin-bottom: 12px;
-					display: flex;
-
-					.job-item-name {
-						color: hsla(0, 0%, 100%, .8);
-						font-weight: 400;
-						flex-shrink: 0;
-						width: 90px;
-						text-align: right;
-					}
-
-					.job-item-info {
-						color: #fff;
-						font-weight: 500;
-					}
-				}
-			}
-
-			.job-list {
-				line-height: 35px;
-			}
-		}
-	}
-
-	.screen-user {
-		width: 390px;
-		padding: 0 16px 16px;
-		background: rgba(24, 36, 51, .7);
-		position: absolute;
-		top: 170px;
-		right: 18px;
-		z-index: 1;
-		transition: all .5s linear;
-		overflow-y: scroll;
-    	max-height: 80vh;
-		.job-content {
-			height: calc(100% - 44px);
-			overflow-y: auto;
-
-			.job-basic {
-				.job-item {
-					font-size: 14px;
-					margin-bottom: 12px;
-					display: flex;
-
-					.job-item-name {
-						color: hsla(0, 0%, 100%, .8);
-						font-weight: 400;
-						flex-shrink: 0;
-						width: 90px;
-						text-align: right;
-					}
-
-					.job-item-info {
-						color: #fff;
-						font-weight: 500;
-					}
-				}
-			}
-
-			.job-list {
-				.custom-table {
-					height: 100%;
-
-					.custom-table-head {
-						display: flex;
-
-						.table-head-item {
-							padding: 0 4px;
-							color: #fff;
-							font-size: 14px;
-							font-weight: 700;
-							height: 34px;
-							line-height: 34px;
-							white-space: nowrap;
-							overflow: hidden;
-							text-overflow: ellipsis;
-							text-align: left;
-						}
-					}
-
-					.custom-table-body {
-						max-height: calc(50vh - 100px);
-
-						.table-body-item {
-							display: flex;
-
-							.body-item-label {
-								padding: 0 4px;
-								color: #fff;
-								font-size: 13px;
-								font-weight: 400;
-								height: 34px;
-								line-height: 34px;
-								white-space: nowrap;
-								overflow: hidden;
-								text-overflow: ellipsis;
-								text-align: left;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-
-	.simple-title {
-		line-height: 22px;
-		font-size: 16px;
-		font-weight: 700;
-		color: #fff;
-		position: relative;
-		padding-left: 8px;
-		height: 44px;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.simple-title:before {
-		content: "";
-		display: inline-block;
-		position: absolute;
-		left: 0;
-		top: 14px;
-		width: 0;
-		height: 16px;
-		border: 1px solid #31fe27;
-	}
-
-	.simple-btn {
-		display: inline-block;
-		height: 32px;
-		line-height: 32px;
-		border-radius: 16px;
-		color: #32fde3;
-		font-size: 14px;
-		padding: 0 18px;
-		background: transparent;
-		border: 1px solid #32fde3;
-		cursor: pointer;
-	}
-
-	.grow {
-		flex-grow: 1;
-	}
-
-	.common-basic-info {}
-
-	.person-cert {
-		right: 410px;
-		top: 0;
-		width: 390px;
-		max-height: 630px;
-		border-radius: 4px;
-		padding: 0 20px 20px;
-		position: absolute;
-		background: rgba(24, 36, 51, .7);
-		.basic-head {
-			position: relative;
-			margin-bottom: 16px;
-			.header-tab {
-				width: 160px;
-			}
-		}
-
-		.basic-info {
-			min-height: 400px;
-			.info-item {
-				font-size: 14px;
-				height: 30px;
-				display: flex;
-				align-items: center;
-			}
-
-			.info-item-name {
-				color: #fff;
-				font-weight: 400;
-				flex-shrink: 0;
-			}
-
-			.info-item-info {
-				color: #fff;
-				font-weight: 500;
-				overflow: hidden;
-				white-space: nowrap;
-				text-overflow: ellipsis;
-			}
-		}
-	}
-
-	.right_arrow:before {
-		content: "";
-		display: inline-block;
-		position: absolute;
-		right: -15px;
-		top: 14px;
-		width: 15px;
-		height: 17px;
-		transform: rotate(180deg);
-		background: url(/public/img/left_arrow.png) no-repeat;
-		background-size: 100% 100%;
-	}
-}
-
-.el-dialog__wrapper {
-	position: fixed;
-	top: 0;
-	right: 0;
-	bottom: 0;
-	left: 0;
-	overflow: auto;
-	margin: 0;
-
-	.el-dialog {
-		top: 50%;
-		margin-top: 0 !important;
-		transform: translateY(-50%);
-		background: rgba(24, 36, 51, .7);
-
-		.el-dialog__header {
-			padding: 0;
-			height: 44px;
-			line-height: 44px;
-			background-size: 250px 70px;
-			text-align: center;
-		}
-
-		.el-dialog__title {
-			color: #fff;
-			font-size: 15px;
-		}
-
-		.el-dialog__headerbtn {
-			top: 14px;
-		}
-	}
-}
-
-.screen-cockpit {
-	.cockpit-count {
-		.count-list {
-			display: flex;
-			flex-wrap: wrap;
-			margin-bottom: 10px;
-
-			.count-list-item {
-				width: 25%;
-				height: 50%;
-				display: flex;
-
-				.item-img {
-					width: 50px;
-					height: 50px;
-					position: relative;
-					margin-right: 5px;
-					flex-shrink: 0;
-				}
-
-				.item-img:after {
-					content: "";
-					width: 38px;
-					height: 38px;
-					position: absolute;
-					left: 7px;
-					top: 7px;
-					background: url(/public/img/rotate_line.png) no-repeat;
-					background-size: 100% 100%;
-					-webkit-animation: rotate 4s linear infinite;
-					animation: rotate 4s linear infinite;
-				}
-
-				.item-img1 {
-					background: url(/public/img/icon_wlry.png) no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.item-img2 {
-					background: url(/public/img/icon_nbyg.png) no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.item-img3 {
-					background: url(/public/img/icon_cbs.png) no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.item-img4 {
-					background: url(/public/img/icon_nbcl.png) no-repeat;
-					background-size: 100% 100%;
-				}
-				.item-info {
-					.normal {
-						font-size: 12px;
-						font-weight: 400;
-						color: #fff;
-					}
-
-					.large {
-						font-size: 30px;
-						font-weight: 400;
-						color: #fff;
-					}
-				}
-			}
-		}
-
-		.simple-title {
-			.countTypeWrap {
-				font-size: 14px;
-
-				span {
-					cursor: pointer;
-				}
-
-				.activeCount {
-					display: inline-block;
-					height: 32px;
-					line-height: 32px;
-					border-radius: 16px;
-					color: #fff;
-					font-size: 14px;
-					padding: 0 18px;
-					border: 1px solid #32fde3;
-					background: #007767;
-					box-shadow: inset 0 0 8px #5aecf0;
-					cursor: pointer;
-				}
-
-			}
-		}
-	}
-
-	.cockpit-alarm {
-		.alarm-bell {
-			padding: 0 18px 0 32px;
-			position: relative;
-			color: #fff;
-		}
-
-		.alarm-bell:after {
-			content: "";
-			position: absolute;
-			left: 12px;
-			top: 8px;
-			width: 14px;
-			height: 16px;
-			background: url(/public/img/bell.png) no-repeat;
-			background-size: 100% 100%;
-		}
-
-		.alarm-bell.danger {
-			border: 1px solid #ffc679;
-			background: #dd8000;
-			box-shadow: inset 0 0 8px #fda732;
-		}
-
-		.alarm-bell.danger:hover {
-			box-shadow: 0 0 8px #fda732, inset 0 0 8px #fda732;
-		}
-
-		.alarm-content {
-			// display: flex;
-			justify-content: space-between;
-			height: calc(100% - 50px);
-			.alarm-danger {
-					width: 50px;
-					height: 50px;
-					background: url(/public/img/a_danger.png) no-repeat;
-					background-size: 100% 100%;
-				}
-			.content-left {
-				width: 160px;
-				height: 100%;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				.alarm-danger {
-					width: 50px;
-					height: 50px;
-					background: url(/public/img/a_danger.png) no-repeat;
-					background-size: 100% 100%;
-				}
-			}
-
-			.content-right {
-				width: 100%;
-				overflow: hidden;
-				height: fit-content;
-
-				.alarm-item {
-					min-width: 50%;
-					height: 26px;
-					font-size: 14px;
-					font-weight: 700;
-					padding-left: 8px;
-					position: relative;
-					display: flex;
-					align-items: center;
-					float: left;
-
-					.item-name {
-						margin-right: 4px;
-						flex-shrink: 0;
-					}
-
-					.item-number {
-						overflow: hidden;
-						white-space: nowrap;
-						text-overflow: ellipsis;
-					}
-
-					.item-icon {
-						width: 14px;
-						height: 14px;
-						margin-right: 4px;
-						flex-shrink: 0;
-					}
-				}
-
-				.alarm-item-danger {
-					color: #fda732;
-
-					.item-icon {
-						background: url(/public/img/r_danger.png) no-repeat;
-						background-size: 100% 100%;
-					}
-				}
-
-				.alarm-item-safe {
-					color: #fff;
-
-					.item-icon {
-						background: url(/public/img/r_safe.png) no-repeat;
-						background-size: 100% 100%;
-					}
-				}
-			}
-		}
-	}
-
-	.cockpit-info {
-		.header-tab {
-			width: 210px;
-		}
-	}
-}
-
-.screen-ctrl {
-	.screen-filter {
-		position: absolute;
-		top: 0;
-		right: 0;
-
-		.filter-content {
-			display: flex;
-			align-items: center;
-			background: rgba(24, 36, 51, .5);
-			border-radius: 20px;
-
-			.filter-ctrl {
-				width: 420px;
-				height: 40px;
-				display: flex;
-				align-items: center;
-				background: transparent;
-				overflow: hidden;
-				padding: 0 20px;
-				z-index: 8;
-				transition: all .5s linear;
-
-				.screen-check-content {
-					margin-right: 16px;
-				}
-			}
-
-			.caret-dropdown {
-				color: #fff;
-			}
-
-			.drop-content {
-				position: absolute;
-				right: 50px;
-				top: 44px;
-				padding: 4px;
-				box-shadow: inset 0 0 4px #2cedff;
-				background: rgba(24, 36, 51, .8);
-				border-radius: 4px;
-				transition: .5s;
-				z-index: 10;
-				max-height: 50vh;
-					overflow-y: scroll;
-				.drop-content-item {
-					color: #fff;
-					position: relative;
-					width: 110px;
-					font-size: 13px;
-					overflow: hidden;
-					white-space: nowrap;
-					text-overflow: ellipsis;
-					height: 34px;
-					line-height: 34px;
-					box-sizing: border-box;
-					text-align: center;
-					cursor: pointer;
-				}
-
-				.drop-content-item.active {
-					color: rgba(44, 237, 255, .8);
-					background-color: rgba(24, 36, 51, .3);
-				}
-
-				.drop-content-item:hover {
-					color: rgba(44, 237, 255, .8);
-					background-color: rgba(24, 36, 51, .3);
-				}
-
-			}
-
-			.filter-action {
-				width: 56px;
-				height: 40px;
-				padding: 0 18px;
-				background: rgba(24, 36, 51, .7);
-				border-radius: 20px;
-				flex-shrink: 0;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				z-index: 2;
-
-				.action-shrink {
-					width: 20px;
-					height: 20px;
-					background: url(/public/img/shrink.png) no-repeat;
-					background-size: 100% 100%;
-					cursor: pointer;
-					transition: all .5s linear;
-					transform: rotate(180deg);
-				}
-
-				.action-shrink.shrink-hidden {
-					transform: rotate(0deg);
-					background: url(/public/img/shrink.png) no-repeat;
-				}
-
-				.roam-play {
-					background: url(/public/img/play.png) no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.roam-pause {
-					background: url(/public/img/pause.png) no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.action-roam {
-					width: 20px;
-					height: 20px;
-					cursor: pointer;
-				}
-			}
-
-			.filter-action.showroam {
-				width: 96px;
-			}
-		}
-	}
-
-	.screen-search {
-		position: absolute;
-		top: 54px;
-		right: 0;
-
-		.search-content {
-			padding: 5px;
-			background: rgba(24, 36, 51, .5);
-			border-radius: 20px;
-			display: flex;
-			align-items: center;
-			position: relative;
-		}
-
-		input {
-			width: 0;
-			height: 30px;
-			font-size: 13px;
-			outline: none;
-			border: none;
-			padding: 0;
-			margin: 0;
-			background: transparent;
-			color: #fff;
-			transition: all .5s linear;
-			opacity: 0;
-		}
-
-		.input-focus {
-			width: 250px;
-			opacity: 1;
-			padding: 0 20px 0 12px;
-		}
-
-		.close-btn {
-			position: absolute;
-			top: 12px;
-			right: 50px;
-			width: 8px;
-			height: 8px;
-			cursor: pointer;
-			color: #fff;
-		}
-
-		.search {
-			margin: auto;
-			width: 30px;
-			height: 30px;
-			background: #5bde0b;
-			border-radius: 50%;
-			transition: all 1s;
-			position: relative;
-		}
-
-		.search:after {
-			content: "";
-			display: inline-block;
-			position: absolute;
-			top: 8px;
-			left: 8px;
-			width: 13px;
-			height: 13px;
-			background: url(/public/img/search.png) no-repeat;
-			background-size: 100% 100%;
-			cursor: pointer;
-		}
-
-		.auto-suggestion {
-			position: absolute;
-			left: 10px;
-			top: 46px;
-			background: rgba(24, 36, 51, .8);
-
-			.suggestion-select-ul {
-				padding: 4px;
-				max-height: 350px;
-				overflow-y: auto;
-			}
-		}
-	}
-}
-
-.screen-tab {
-	.screen-tab-content {
-		display: flex;
-		align-items: center;
-	}
-
-	.tab-menu-item {
-		width: 150px;
-		height: 80px;
-		text-align: center;
-		margin: 0 10px;
-		cursor: pointer;
-	}
-
-	.tab-menu-text {
-		height: 80px;
-		line-height: 80px;
-		font-size: 14px;
-		font-weight: 400;
-		color: #2cedff;
-	}
-
-	.tab-menu {
-		background: url(/public/img/menu.png) no-repeat;
-		background-size: 100% 100%;
-	}
-
-	.tab-menu-active {
-		background: url(/public/img/menu_active.png) no-repeat;
-		background-size: 100% 100%;
-
-		.tab-menu-text {
-			font-weight: 700;
-			color: #fff;
-		}
-	}
-}
-
-.screen-main {
-	.header-tab {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-
-		.tab-item {
-			padding: 0 4px;
-			text-align: center;
-			font-size: 15px;
-			font-weight: 400;
-			color: #fff;
-			position: relative;
-			cursor: pointer;
-		}
-
-		.tab-item-active {
-			font-weight: 700;
-		}
-
-		.tab-item-active:after {
-			content: "";
-			position: absolute;
-			left: 0;
-			bottom: -2px;
-			height: 5px;
-			width: 100%;
-			background: linear-gradient(90deg, rgba(48, 255, 221, 0), rgba(48, 255, 221, .8) 50%, rgba(48, 255, 221, 0));
-		}
-	}
-}
-
-.screen-main {
-	.icon-close {
-		width: 14px;
-		height: 14px;
-		background: url(/public/img/close.png) no-repeat;
-		background-size: 100% 100%;
-		cursor: pointer;
-	}
-
-	.simple-btn-bg {
-		display: inline-block;
-		height: 32px;
-		line-height: 32px;
-		border-radius: 16px;
-		color: #fff;
-		font-size: 14px;
-		padding: 0 18px;
-		border: 1px solid #32fde3;
-		background: #007767;
-		box-shadow: inset 0 0 8px #5aecf0;
-		cursor: pointer;
-	}
-
-	.simple-btn-bg:hover {
-		box-shadow: 0 0 8px #5aecf0, inset 0 0 8px #5aecf0;
-	}
-
-	.screen-check-content {
-		display: flex;
-		align-items: center;
-		height: 40px;
-
-		.box-btn {
-			width: 16px;
-			height: 16px;
-			margin-right: 6px;
-			cursor: pointer;
-			border: 1px solid #5bde0b;
-			border-radius: 3px;
-		}
-
-		.box-text {
-			font-size: 14px;
-			font-weight: 400;
-			line-height: 40px;
-			color: #fff;
-			white-space: nowrap;
-		}
-
-		.box-check {
-			background: url(/public/img/check.png) no-repeat 100% 100% !important;
-		}
-	}
-
-	.noData {
-		width: 100%;
-		height: 300px;
-
-		img {
-			margin: 50px auto;
-			display: block;
-		}
-	}
-
-}
-
-.alarm-detail-info {
-	position: absolute;
-	left: 480px;
-	top: -73px;
-	width: 390px;
-	background: rgba(24, 36, 51, .7);
-	border-radius: 4px;
-	padding: 0 12px 0 12px;
-	z-index: 20;
-	.action-group {
-		display: flex;
-		align-items: center;
-		width: 20px;
-		justify-content: space-between;
-	}
-
-	.detail-text-btn {
-		cursor: pointer;
-		color: #30ffdd;
-		font-size: 12px;
-		position: relative;
-		padding-right: 12px;
-		font-weight: 400;
-	}
-
-	.detail-content {
-		position: relative;
-
-		.content-head {
-			display: flex;
-			align-items: center;
-			justify-content: space-around;
-
-			.head-select {
-				width: calc(100% - 60px);
-			}
-
-			.head-sound {
-				width: 20px;
-				height: 20px;
-				cursor: pointer;
-			}
-
-			.sound-ring {
-				background: url(/public/img/b_ring.png) no-repeat;
-				background-size: 100% 100%;
-			}
-			.sound-quiet {
-				background: url(/public/img/b_quiet.png) no-repeat;
-				background-size: 100% 100%;
-			}
-
-		}
-
-		.content-body {
-			min-height: 200px;
-			max-height: calc(60vh - 120px);
-			overflow-y: auto;
-			overflow-x: hidden;
-			margin-top: 10px;
-
-			.alarm-item {
-				display: flex;
-
-				.item-type {
-					width: 40px;
-					height: 45px;
-					background: url(/public/img/alarm_bg.png) 50% no-repeat;
-					font-size: 14px;
-					color: #fff;
-					text-align: center;
-					margin-top: 10px;
-				}
-
-				.item-content {
-					margin-left: 14px;
-					padding: 10px 0 10px 10px;
-					color: #fff;
-					width: calc(100% - 56px);
-					font-size: 14px;
-					border-left: 1px dashed rgba(225, 255, 255, .3);
-					position: relative;
-
-					.item-content-top {
-						display: flex;
-						justify-content: space-between;
-						padding: 0 4px;
-						font-size: 14px;
-						cursor: pointer;
-
-						.time {
-							color: #fff;
-						}
-
-						.status {
-							color: #fd8018;
-						}
-					}
-
-					.item-content-middle {
-						.alarm-info {
-							font-size: 14px;
-							font-weight: 700;
-							cursor: pointer;
-						}
-					}
-				}
-
-				.item-content:before {
-					content: "";
-					display: inline-block;
-					position: absolute;
-					left: -7px;
-					top: 12px;
-					width: 12px;
-					height: 12px;
-					background: url(/public/img/round.png) no-repeat;
-					background-size: 100% 100%;
-				}
-			}
-		}
-
-		.content-footer {
-			text-align: center;
-
-			.btn-prev {
-				color: #fff;
-				background: transparent;
-
-				.el-icon {
-					display: block;
-					font-size: 12px;
-					font-weight: 700;
-				}
-			}
-
-			.btn-next {
-				color: #fff;
-				background: transparent;
-
-				.el-icon {
-					display: block;
-					font-size: 12px;
-					font-weight: 700;
-				}
-			}
-
-			.el-pagination {
-				white-space: nowrap;
-				padding: 2px 5px;
-				color: #ffffff;
-				font-weight: 700;
-
-				button {
-					border: none;
-					padding: 0 6px;
-					display: inline-block;
-					font-size: 13px;
-					min-width: 35.5px;
-					height: 28px;
-					line-height: 28px;
-					vertical-align: top;
-					box-sizing: border-box;
-					background: rgba(255, 255, 255, 0) !important;
-				}
-
-				.btn-prev {
-					background: rgba(255, 255, 255, 0) !important;
-				}
-
-				.el-pager {
-					vertical-align: top;
-					margin: 0;
-					display: inline-block;
-					background: rgba(255, 255, 255, 0) !important;
-
-					li {
-						vertical-align: top;
-						margin: 0;
-						display: inline-block;
-						padding: 0 4px;
-						font-size: 13px;
-						min-width: 35.5px;
-						height: 28px;
-						line-height: 28px;
-						box-sizing: border-box;
-						text-align: center;
-						background: rgba(255, 255, 255, 0) !important;
-					}
-				}
-
-				.btn-next {
-					padding-left: 12px;
-					cursor: pointer;
-					margin: 0;
-				}
-			}
-		}
-
-		.el-loading-mask {
-			position: absolute;
-			z-index: 2000;
-			background-color: hsla(0, 0%, 100%, .9);
-			margin: 0;
-			top: 0;
-			right: 0;
-			bottom: 0;
-			left: 0;
-			transition: opacity .3s;
-
-			.el-loading-spinner {
-				top: 50%;
-				margin-top: -21px;
-				width: 100%;
-				text-align: center;
-				position: absolute;
-
-				.el-loading-spinner i {
-					color: #409eff;
-				}
-			}
-		}
-	}
-}
-
-.screen-main .left_arrow:before,
-.screen-main .left_middle_arrow:before {
-	content: "";
-	display: inline-block;
-	position: absolute;
-	left: -15px;
-	width: 15px;
-	height: 17px;
-	/*background: url(/public/img/left_arrow.png) no-repeat;*/
-	background-size: 100% 100%;
-}
-
-.areaNavItem {
-	color: #ffffff;
-	padding: 8px 16px;
-	border-radius: 15px;
-}
-.areaActive {
-	border: 1px solid #32fde3;
-    background: #007767;
-    box-shadow: inset 0 0 8px #5aecf0;
-}
-
-[class*=" el-icon-"],
-[class^=el-icon-] {
-	font-family: element-icons !important;
-	speak: none;
-	font-style: normal;
-	font-weight: 400;
-	font-variant: normal;
-	text-transform: none;
-	line-height: 1;
-	vertical-align: baseline;
-	display: inline-block;
-	-webkit-font-smoothing: antialiased;
-	-moz-osx-font-smoothing: grayscale;
-}
-
-.el-dialog__headerbtn {
-	position: absolute;
-	top: 0;
-	right: 0;
-	padding: 0;
-	background: 0 0;
-	border: none;
-	outline: 0;
-	cursor: pointer;
-	font-size: 16px;
-}
-
-.item-textarea {
-	width: 250px;
-}
-
-.item-textarea>.el-textarea__inner {
-	resize: none;
-	width: 100%;
-	height: 70px;
-	margin-top: 8px;
-	outline: none;
-	color: #fff;
-	background: hsla(0, 0%, 100%, .26);
-	border: 1px solid hsla(0, 0%, 100%, .5);
-}
-
-#mapContainer {
-	width: 100%;
-	height: 100%;
-	background-color: #49a1ff;
-}
-
-#bigScreenUserTable {
-	color: #ffffff;
-}
-
-.bigScreenTable.el-table {
-	background-color: rgba(255, 255, 255, 0);
-	color: #ffffff;
-}
-
-.bigScreenTable.el-table thead {
-	color: rgba(255, 255, 255, 1);
-}
-
-.bigScreenTable.el-table tr {
-	background-color: rgba(255, 255, 255, 0);
-}
-
-.bigScreenTable.el-table .el-table__body-wrapper {
-	background-color: rgba(255, 255, 255, 0);
-}
-
-.bigScreenTable.el-table th.el-table__cell {
-	background-color: rgba(255, 255, 255, 0);
-}
-
-.bigScreenTable.el-table td.el-table__cell,
-.bigScreenTable.el-table th.el-table__cell.is-leaf {
-	border-bottom: none;
-}
-
-.bigScreenTable.el-table .el-table__body tr:hover>td.el-table__cell {
-	background-color: rgba(255, 255, 255, 0);
-}
-
-.bigScreenTable.el-table .el-table__body tr.current-row>td.el-table__cell {
-	background-color: rgba(255, 255, 255, .1);
-}
-#audio{
-	position: fixed;
-	opacity: 0;
-}
-#eventScrenWrap{
-	height:50px;
-	width: calc(100% - 50px);
-	overflow:hidden;
-	padding-left: 20px;
-	position: relative;
-}
-#eventScrenItem{
-	line-height: 50px;
-	font-size: 20px;
-	color: cyan;
-	position: absolute;
-}
-#bigScreeWrap{
-	position: fixed;
-    z-index: 9999;
-    top: 0;
-	display: none;
-    width: 100vw;
-    height: 100vh;
-    text-align: center;
-	background-color: rgba(0,0,0,0.8);
-	padding: 40px 20px 20px 20px;
-}
-.bigScreeImg{
-	width: 20px;
-	height: 20px;
-	background-color: red;
-}
-.bigScreeClose{
-	width: 20px;
-    height: 20px;
-    top: 10px;
-    right: 10px;
-    position: absolute;
-	background: url(/public/img/close.png) no-repeat;
-}
-#videoElement{
-	width: auto;
-    height: 60vh;
-}
-</style>