diff --git a/node_modules/.cache/babel-loader/34c81c881eecd4dea881c21a8550f1ee.json b/node_modules/.cache/babel-loader/34c81c881eecd4dea881c21a8550f1ee.json
index fd930cfc..1ba515f4 100644
--- a/node_modules/.cache/babel-loader/34c81c881eecd4dea881c21a8550f1ee.json
+++ b/node_modules/.cache/babel-loader/34c81c881eecd4dea881c21a8550f1ee.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.typed.uint8-array\";\nimport \"core-js/modules/es6.function.name\";\nimport \"core-js/modules/web.dom.iterable\";\nimport \"core-js/modules/es6.regexp.split\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport mqtt from \"mqtt\"; // mqtt协议\n\nimport editModal from \"@/views/bounced/maintenanceRemind\";\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\nimport dataBoard from \"@/views/bounced/dataBoard\";\nimport { getComponentData, getSectionalData } from \"../api/index\";\nimport serverUrl from \"../config/apiurl.js\";\nimport axios from 'axios';\nexport default {\n  data: function data() {\n    return {\n      trajectory: false,\n      //轨迹\n      hideBoxShow: true,\n      //隐藏箱子按钮显示隐藏\n      closeStatus: null,\n      modelOthers: false,\n      componentShow: \"\",\n      isShowBtn: true,\n      //菜单按钮隐藏\n      isShowBtn1: false,\n      //菜单按钮显示\n      inputVal: \"\",\n      dialogFormVisible: false,\n      areaComponent: false,\n      indexModule: false,\n      speed: false,\n      component: false,\n      sectionals: [],\n      activeName: 'first',\n      VideoId: '',\n      title: '断面',\n      componentTitle: '速度',\n      form: {\n        name: '',\n        type: '',\n        id: '',\n        coordinate: '',\n        Direction: '正向',\n        StoppingSpeed: '5'\n      },\n      //初始图形名称\n      startFigureName: '',\n      areaComponentform: {\n        name: '',\n        region: '',\n        date1: '',\n        date2: '',\n        delivery: false,\n        type: [],\n        resource: '实时（触发）',\n        desc: ''\n      },\n      timeSelect: [{\n        label: '秒',\n        value: '秒'\n      }, {\n        label: '分钟',\n        value: '分钟'\n      }, {\n        label: '小时',\n        value: '小时'\n      }, {\n        label: '天',\n        value: '天'\n      }],\n      componentForm: {\n        //单位\n        company: \"秒\",\n        componentName: \"\",\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\n        //周期间隔\n        cycleInterval: \"\",\n        startSectionIds: \"\",\n        startSectionNames: \"\",\n        endSectionIds: \"\",\n        endSectionNames: \"\",\n        endValue: \"\",\n        //展现形式\n        presentationForm: \"\",\n        presentation: [],\n        startValue: \"\",\n        timeMode: \"触发\",\n        type: \"\",\n        startSection: [],\n        endSection: [],\n        componentType: \"\",\n        typeFiltering: ''\n      },\n      typeData: [\"小汽车\", \"公交车\", \"卡车\", \"非机动车\", \"行人\"],\n      //展现形式\n      presentation: ['数值', '表格', '时间曲线图', '均值图'],\n      trackForm: {\n        name: \"\"\n      },\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\n      nowTime: \"\",\n      //   weekday: this.$moment().format(\"dddd\"),\n      ins: 0,\n      imgUrl: '',\n      imgUrl1: '',\n      imgUrl2: '',\n      imgUrl3: '',\n      imgUrl4: '',\n      imgUrl5: '',\n      btnPic: [],\n      Data: [{\n        title: 'xx路口',\n        url: ''\n      }, {\n        title: '数据看板',\n        url: ''\n      }, {\n        title: '分析配置',\n        url: ''\n      }, {\n        title: '分析配置',\n        url: ''\n      }],\n      messageInfo: [],\n      orderList: [],\n      enterList: [],\n      stockInfo: [],\n      perCent: 0,\n      perCent1: 0,\n      perCent2: 0,\n      facToal: \"\",\n      wbContent: '',\n      //   wxContent:'',\n      inContent: '',\n      outContent: '',\n      containerDetails: \"\",\n      locdesc: '',\n      weatherItem: {},\n      loadingShow1: true,\n      number: '',\n      componentId: '' //   carInfo: [], //小车信息\n      //   carName: '',\n      //   palletizerInfo: [], //码垛机信息\n      //   palletizerName: '',\n      //   destackerInfo: [], //拆垛机信息\n      //   destackerName: '',\n      //   hoistInfo: [], //提升机信息’\n      //   hoistName: '',\n      //   battaryStationInfo: [],//快换电池装置\n      //   battaryStationName: \"\",\n      //   conveyorInfo: [], //输送机信息\n      //   conveyorName: \"\",\n\n    };\n  },\n  mounted: function mounted() {\n    window.getFigure = this.getFigureD;\n    window.getModifyTheName = this.getModifyTheNameN; // window.getModifyTheName = this.getModifyTheNameN;\n\n    window.getSingleComponentId = this.getSingleComponentIdN;\n    window.OnScene = this.OnSceneN;\n    this.getAllSectionalData(this.$route.query.id);\n    this.VideoId = this.$route.query.id;\n    this.number = this.$route.query.num; //   this.getSingleComponentIdN()\n  },\n  created: function created() {\n    this.testMqtt();\n    this.componentForm.company = this.timeSelect[0].value;\n  },\n  methods: {\n    // handleClick(tab, event) {\n    //     console.log(tab, event);\n    //   },\n    // 测试：mqtt测试\n    testMqtt: function testMqtt() {\n      this.getDataByMqtt();\n    },\n    //初始化unity\n    OnSceneN: function OnSceneN() {\n      document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id));\n    },\n    // //根据组件id获取单个组件数据\n    getSingleComponentIdN: function getSingleComponentIdN(id, type, name) {\n      var _this = this;\n\n      console.log(\"id\", id);\n      console.log(\"type\", type);\n      console.log(\"name\", name);\n      this.componentId = id;\n      this.componentForm.componentType = type;\n      this.componentTitle = type;\n      getComponentData({\n        AnalogAreaComponentId: id\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          console.log(\"res\", res.data.data);\n          _this.component = true;\n\n          if (res.data.data.company != '') {\n            _this.componentForm.company = res.data.data.company;\n          }\n\n          if (res.data.data.timeMode != '') {\n            _this.componentForm.timeMode = res.data.data.timeMode;\n          }\n\n          _this.componentForm.componentName = res.data.data.componentName + '-' + type;\n          _this.componentForm.componentParameterId = res.data.data.componentParameterId;\n          _this.componentForm.cycleInterval = res.data.data.cycleInterval;\n          _this.componentForm.startSectionIds = res.data.data.startSectionIds;\n          _this.componentForm.startSectionNames = res.data.data.startSectionNames;\n          _this.componentForm.endSectionIds = res.data.data.endSectionIds;\n          _this.componentForm.endSectionNames = res.data.data.endSectionNames;\n          _this.componentForm.endValue = res.data.data.endValue;\n          _this.componentForm.startValue = res.data.data.startValue;\n          _this.componentForm.presentationForm = res.data.data.presentationForm;\n          _this.componentForm.type = res.data.data.type;\n\n          if (res.data.data.startSectionIds != '') {\n            console.log(\"startSectionIds\", res.data.data.startSectionIds);\n            var startSectionIdArr = [];\n            var startSectionArr = [];\n            startSectionIdArr = res.data.data.startSectionIds.split(',');\n            console.log(\"this.sectionals\", _this.sectionals);\n            console.log(\"startSectionIdArr\", startSectionIdArr);\n            startSectionIdArr.forEach(function (item) {\n              _this.sectionals.forEach(function (items) {\n                if (item == items.graphicId) {\n                  startSectionArr.push(items.graphicName);\n                  _this.componentForm.startSection = startSectionArr;\n                }\n              });\n            });\n          }\n\n          if (res.data.data.endSectionIds != '') {\n            console.log(\"endSectionIds\", res.data.data.endSectionIds);\n            var endSectionIdArr = [];\n            var endSectionArr = [];\n            endSectionIdArr = res.data.data.endSectionIds.split(',');\n            console.log(\"this.sectionals\", _this.sectionals);\n            console.log(\"endSectionIdArr\", endSectionIdArr);\n            endSectionIdArr.forEach(function (item) {\n              _this.sectionals.forEach(function (items) {\n                if (item == items.graphicId) {\n                  endSectionArr.push(items.graphicName);\n                  _this.componentForm.endSection = endSectionArr;\n                }\n              });\n            });\n          }\n\n          if (res.data.data.presentationForm != '') {\n            var presentationN = [];\n            presentationN = res.data.data.presentationForm.split(',');\n            _this.componentForm.presentation = presentationN;\n          }\n        }\n      });\n    },\n    //获取所有断面数据\n    getAllSectionalData: function getAllSectionalData(VideoId) {\n      var _this2 = this;\n\n      getSectionalData({\n        VideoId: VideoId\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this2.sectionals = res.data.data;\n        }\n      });\n    },\n    figureType: function figureType(type) {\n      if (type == 'Move') {\n        type = '轨迹';\n      } else if (type == 'Poly') {\n        type = '区域';\n      } else if (type == 'Line') {\n        type = '断面';\n      }\n\n      return type;\n    },\n    getFigureD: function getFigureD(item, index, indexNew) {\n      console.log(\"图形类型\", item);\n      console.log(\"初始图形名称\", index);\n      this.startFigureName = index;\n      console.log(\"图形位置\", indexNew);\n      this.dialogFormVisible = true;\n      this.form.name = index;\n      this.form.type = this.figureType(item);\n      this.form.coordinate = indexNew;\n      this.form.id = '';\n      this.title = this.figureType(item);\n    },\n    //双击图形修改图形名称弹框\n    getModifyTheNameN: function getModifyTheNameN(data) {\n      console.log(\"data\", data);\n      var arr = [];\n      arr = data.split(',');\n      console.log(\"arr\", arr);\n      this.form.id = arr[0];\n      this.form.name = arr[1];\n      this.form.type = arr[2];\n      this.startFigureName = arr[1];\n\n      if (this.form.type == '轨迹') {\n        // this.open2()\n        this.dialogFormVisible = true;\n      } else if (this.form.type == '区域') {\n        this.dialogFormVisible = true;\n      } else if (this.form.type == '断面') {\n        this.dialogFormVisible = true;\n      }\n    },\n    //新增、编辑图形确认按钮\n    onSubmit: function onSubmit(form) {\n      var _this3 = this;\n\n      console.log(\"form\", form); //新增\n\n      if (form.id == '') {\n        var formData = new FormData();\n\n        if (form.type == '断面') {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId);\n          formData.append(\"Direction\", form.Direction);\n        } else if (form.type == '区域') {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId);\n          formData.append(\"Direction\", form.Direction);\n          formData.append(\"StoppingSpeed\", form.StoppingSpeed);\n        } else {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId); // formData.append(\"Direction\",form.Direction);\n        }\n\n        axios({\n          method: \"post\",\n          url: serverUrl.addFigure,\n          data: formData\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          if (res.data.code == 200) {\n            _this3.$message({\n              message: res.data.msg,\n              type: 'success'\n            });\n\n            document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data));\n            document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data + ',' + form.name + ',' + _this3.startFigureName));\n            _this3.dialogFormVisible = false;\n          } else {\n            _this3.$message({\n              message: res.data.msg,\n              type: 'warning'\n            });\n          }\n        });\n      } else {\n        //编辑\n        var _formData = new FormData();\n\n        if (form.type == '断面') {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type);\n\n          _formData.append(\"Direction\", form.Direction);\n\n          _formData.append(\"GraphicId\", form.id);\n        } else if (form.type == '区域') {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type);\n\n          _formData.append(\"Direction\", form.Direction);\n\n          _formData.append(\"GraphicId\", form.id);\n\n          _formData.append(\"StoppingSpeed\", form.StoppingSpeed);\n        } else {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type); // formData.append(\"Direction\",form.Direction);\n\n\n          _formData.append(\"GraphicId\", form.id);\n        }\n\n        axios({\n          method: \"post\",\n          url: serverUrl.editFigure,\n          data: _formData\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          if (res.data.code == 200) {\n            _this3.$message({\n              message: res.data.msg,\n              type: 'success'\n            });\n\n            console.log(\"startFigureName\", _this3.startFigureName); // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\n\n            document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id + ',' + form.name + ',' + _this3.startFigureName));\n            _this3.dialogFormVisible = false;\n          } else {\n            _this3.$message({\n              message: res.data.msg,\n              type: 'warning'\n            });\n          }\n        });\n      }\n    },\n    //新增编辑组件取消\n    onSubmitComponent: function onSubmitComponent(componentForm) {\n      var _this4 = this;\n\n      this.component = false;\n      var formData = new FormData();\n\n      if (componentForm.componentType == 'OD') {\n        //名称\n        formData.append(\"componentName\", componentForm.componentName); //单位\n\n        formData.append(\"company\", componentForm.company); //id\n\n        formData.append(\"componentParameterId\", componentForm.componentParameterId);\n        formData.append(\"cycleInterval\", componentForm.cycleInterval);\n        formData.append(\"startSectionIds\", componentForm.startSectionIds);\n        formData.append(\"startSectionNames\", componentForm.startSectionNames);\n        formData.append(\"endSectionIds\", componentForm.endSectionIds);\n        formData.append(\"endSectionNames\", componentForm.endSectionNames);\n        formData.append(\"endValue\", componentForm.endValue);\n        formData.append(\"startValue\", componentForm.startValue);\n        formData.append(\"timeMode\", componentForm.timeMode);\n        formData.append(\"presentationForm\", '矩阵图');\n        formData.append(\"type\", componentForm.type);\n      } else {\n        //名称\n        formData.append(\"componentName\", componentForm.componentName); //单位\n\n        formData.append(\"company\", componentForm.company); //id\n\n        formData.append(\"componentParameterId\", componentForm.componentParameterId);\n        formData.append(\"cycleInterval\", componentForm.cycleInterval);\n        formData.append(\"endValue\", componentForm.endValue);\n        formData.append(\"startValue\", componentForm.startValue);\n        formData.append(\"timeMode\", componentForm.timeMode);\n        formData.append(\"presentationForm\", componentForm.presentationForm);\n        formData.append(\"type\", componentForm.type);\n      }\n\n      axios({\n        method: \"post\",\n        url: serverUrl.editComponent,\n        data: formData\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this4.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n\n          document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data));\n          document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(_this4.componentId + ',' + componentForm.componentName));\n          _this4.dialogFormVisible = false;\n        } else {\n          _this4.$message({\n            message: res.data.msg,\n            type: 'warning'\n          });\n        }\n      });\n    },\n    //新增编辑组件取消\n    closeComponent: function closeComponent(componentForm) {\n      this.component = false;\n    },\n    //新增、编辑图形取消按钮\n    closeFigure: function closeFigure(form) {\n      console.log(\"form\", form);\n\n      if (form.id != '') {\n        this.dialogFormVisible = false; // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\n\n        document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type), JSON.stringify(form.id));\n      } else {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.delFigure();\n      }\n    },\n    closeComponentForm: function closeComponentForm() {\n      this.component = false;\n    },\n    closeForm: function closeForm(form) {\n      if (this.form.id != '') {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id)); //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\n      } else {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.delFigure();\n      }\n    },\n    //改变起点\n    handleCheckedStartSection: function handleCheckedStartSection(value) {\n      var _this5 = this;\n\n      console.log(\"改变起点\", value);\n      var startSectionIdArr = [];\n      var startSectionNameArr = [];\n      value.forEach(function (item) {\n        _this5.sectionals.forEach(function (items) {\n          if (item == items.graphicName) {\n            startSectionIdArr.push(items.graphicId);\n            startSectionNameArr.push(items.graphicName);\n            var newStartSectionId = startSectionIdArr.join(\",\");\n            var newStartSectionName = startSectionNameArr.join(\",\");\n            _this5.componentForm.startSectionIds = newStartSectionId;\n            _this5.componentForm.startSectionNames = newStartSectionName;\n          }\n        });\n      });\n    },\n    //改变终点\n    handleCheckedendSection: function handleCheckedendSection(value) {\n      var _this6 = this;\n\n      console.log(\"改变终点\", value);\n      var endSectionIdArr = [];\n      var endSectionNameArr = [];\n      value.forEach(function (item) {\n        _this6.sectionals.forEach(function (items) {\n          if (item == items.graphicName) {\n            endSectionIdArr.push(items.graphicId);\n            endSectionNameArr.push(items.graphicName);\n            var newendSectionId = endSectionIdArr.join(\",\");\n            var newEndSectionName = endSectionNameArr.join(\",\");\n            console.log(\"newendSectionId\", newendSectionId);\n            console.log(\"newEndSectionName\", newEndSectionName);\n            _this6.componentForm.endSectionIds = newendSectionId;\n            _this6.componentForm.endSectionNames = newEndSectionName;\n          }\n        });\n      });\n    },\n    //修改展现形式\n    handlePresentation: function handlePresentation(value) {\n      console.log(\"展现形式\", value);\n      var presentation = value.join(\",\");\n      this.componentForm.presentationForm = presentation;\n      console.log(\"this.componentForm.presentationForm\", this.componentForm.presentationForm);\n    },\n    //模型加载等待\n    loadingShow: function loadingShow(data) {\n      this.loadingShow1 = data;\n    },\n    // mqtt订阅（独立）\n    getDataByMqtt: function getDataByMqtt(url, topic, cIdNum) {\n      var _this7 = this;\n\n      var clientId = \"test_id_\" + String(new Date().getTime()); // 用户名\n      //   const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt\n\n      var host = 'ws://172.16.1.168:10087/';\n      var options = {\n        // 配置\n        // 测试：订阅本机IP\n        // host: host,\n        // port: port,\n        // host:\"172.16.1.168:10086\",\n        keepalive: 60,\n        // 心跳时间，默认60s，设置为0禁用\n        username: 'admin',\n        // 用户名（可选）\n        password: '123456',\n        // 密码（可选）\n        clientId: clientId,\n        // 客户端ID，默认随机生成\n        protocolId: \"MQTT\",\n        protocolVersion: 4,\n        clean: true,\n        // false在离线时接收QoS1和2的消息\n        reconnectPeriod: 2000,\n        // 重连间隔，默认1000毫秒\n        connectTimeout: 30 * 1000,\n        // 收到CONNACK之前的等待时间\n        will: {\n          // 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）\n          topic: \"img1\",\n          // 要发布的主题\n          payload: \"[MQTT-TEST] 遗嘱消息：连接异常断开！\",\n          // 要发布的消息\n          qos: 0,\n          // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次\n          retain: false // 保留标志\n\n        }\n      };\n\n      if (this.mqttClient == undefined) {\n        this.mqttClient = mqtt.connect(host, options); // 连接\n        // const client = mqtt.connect(host, options); // 连接\n        // const client = mqtt.connect(host)  // 连接\n        // 错误回调\n        // console.log(\"this.mqttClient\", this.mqttClient)\n\n        this.mqttClient.on(\"error\", function (err) {\n          console.log(\"[MQTT-TEST] 连接错误：\", err);\n\n          _this7.mqttClient.end();\n        }); // 重连回调\n\n        this.mqttClient.on(\"reconnect\", function (reconnect) {//   console.log(\"[MQTT-TEST] 重连中……\", reconnect);\n        }); // 连接回调\n\n        this.mqttClient.on(\"connect\", function (connect) {\n          //   console.log(\"[MQTT-TEST] 已连接的客户端ID: \", connect);\n          //    this.client.connect('aaa', '111')\n          //   this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });\n          //   this.mqttClient.subscribe('img1', { qos: 0 });\n          //   this.mqttClient.subscribe('img2', { qos: 0 });\n          //   this.mqttClient.subscribe('img3', { qos: 0 });\n          //   this.mqttClient.subscribe('img4', { qos: 0 });\n          //   this.mqttClient.subscribe('img5', { qos: 0 });\n          // 订阅\n          _this7.mqttClient.subscribe('img' + _this7.number, {\n            qos: 0\n          });\n\n          _this7.mqttClient.subscribe('stream' + _this7.number, {\n            qos: 0\n          });\n\n          _this7.mqttClient.subscribe('trajectory' + _this7.number, {\n            qos: 0\n          }); //   this.mqttClient.subscribe('stream1', { qos: 0 });\n          //   this.mqttClient.subscribe('stream2', { qos: 0 });\n          //   this.mqttClient.subscribe('stream3', { qos: 0 });\n          //   this.mqttClient.subscribe('stream4', { qos: 0 });\n          //   this.mqttClient.subscribe('stream5', { qos: 0 });\n\n        }); // 接收回调\n\n        this.mqttClient.on(\"message\", function (topic, message, packet) {\n          if (topic.indexOf(\"img0\") != -1) {\n            try {\n              var utf8decoder = new TextDecoder();\n              var u8arr = new Uint8Array(message);\n              var temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串\n\n              var msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg));\n            } catch (_unused) {\n              var imageType = 'arraybuffer';\n              var blob = new Blob([message], {\n                type: imageType\n              });\n              var imageUrl = (window.URL || window.webkitURL).createObjectURL(blob); //   console.log(\"imageUrl\", imageUrl)\n            }\n          } else if (topic.indexOf(\"img1\") != -1) {\n            try {\n              var _utf8decoder = new TextDecoder();\n\n              var _u8arr = new Uint8Array(message);\n\n              var _temp = _utf8decoder.decode(_u8arr); // 将二进制数据转为字符串\n\n\n              var _msg = JSON.parse(_temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(_msg));\n            } catch (_unused2) {\n              var _imageType = 'arraybuffer';\n\n              var _blob = new Blob([message], {\n                type: _imageType\n              });\n\n              var _imageUrl = (window.URL || window.webkitURL).createObjectURL(_blob); //   console.log(\"imageUrl\", imageUrl)\n\n            }\n          } else if (topic.indexOf(\"img2\") != -1) {\n            try {\n              var _utf8decoder2 = new TextDecoder();\n\n              var _u8arr2 = new Uint8Array(message);\n\n              var _temp2 = _utf8decoder2.decode(_u8arr2); // 将二进制数据转为字符串\n\n\n              var _msg2 = JSON.parse(_temp2); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(_msg2));\n            } catch (_unused3) {\n              var _imageType2 = 'arraybuffer';\n\n              var _blob2 = new Blob([message], {\n                type: _imageType2\n              });\n\n              var _imageUrl2 = (window.URL || window.webkitURL).createObjectURL(_blob2); //   console.log(\"imageUrl\", imageUrl)\n\n            }\n          } else if (topic.indexOf(\"img3\") != -1) {\n            try {\n              var _utf8decoder3 = new TextDecoder();\n\n              var _u8arr3 = new Uint8Array(message);\n\n              var _temp3 = _utf8decoder3.decode(_u8arr3); // 将二进制数据转为字符串\n\n\n              var _msg3 = JSON.parse(_temp3); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(_msg3));\n            } catch (_unused4) {\n              var _imageType3 = 'arraybuffer';\n\n              var _blob3 = new Blob([message], {\n                type: _imageType3\n              });\n\n              var _imageUrl3 = (window.URL || window.webkitURL).createObjectURL(_blob3); //   console.log(\"imageUrl\", imageUrl)\n\n            }\n          } else if (topic.indexOf(\"img4\") != -1) {\n            try {\n              var _utf8decoder4 = new TextDecoder();\n\n              var _u8arr4 = new Uint8Array(message);\n\n              var _temp4 = _utf8decoder4.decode(_u8arr4); // 将二进制数据转为字符串\n\n\n              var _msg4 = JSON.parse(_temp4); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(_msg4));\n            } catch (_unused5) {\n              var _imageType4 = 'arraybuffer';\n\n              var _blob4 = new Blob([message], {\n                type: _imageType4\n              });\n\n              var _imageUrl4 = (window.URL || window.webkitURL).createObjectURL(_blob4); //   console.log(\"imageUrl\", imageUrl)\n\n            }\n          } else if (topic.indexOf(\"img5\") != -1) {\n            try {\n              var _utf8decoder5 = new TextDecoder();\n\n              var _u8arr5 = new Uint8Array(message);\n\n              var _temp5 = _utf8decoder5.decode(_u8arr5); // 将二进制数据转为字符串\n\n\n              var _msg5 = JSON.parse(_temp5); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n\n              document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(_msg5));\n            } catch (_unused6) {\n              var _imageType5 = 'arraybuffer';\n\n              var _blob5 = new Blob([message], {\n                type: _imageType5\n              });\n\n              var _imageUrl5 = (window.URL || window.webkitURL).createObjectURL(_blob5); //   console.log(\"imageUrl\", imageUrl)\n\n            }\n          } else if (topic.indexOf(\"stream0\") != -1) {\n            var utf8decoder1 = new TextDecoder();\n\n            var _u8arr6 = new Uint8Array(message);\n\n            var _temp6 = utf8decoder1.decode(_u8arr6); // 将二进制数据转为字符串\n\n\n            var _msg6 = JSON.parse(_temp6);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg6)); // try {\n            //   const utf8decoder1 = new TextDecoder()\n            //   const u8arr = new Uint8Array(message)\n            //   const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\n            //   const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n            //     document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\n            // } catch {\n            //   let imageType = 'arraybuffer';\n            //   const blob = new Blob([message], { type: imageType })\n            //   const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\n            // //   console.log(\"imageUrl\", imageUrl)\n            // }\n          } else if (topic.indexOf(\"stream1\") != -1) {\n            var _utf8decoder6 = new TextDecoder();\n\n            var _u8arr7 = new Uint8Array(message);\n\n            var _temp7 = _utf8decoder6.decode(_u8arr7); // 将二进制数据转为字符串\n\n\n            var _msg7 = JSON.parse(_temp7);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg7));\n          } else if (topic.indexOf(\"stream2\") != -1) {\n            var _utf8decoder7 = new TextDecoder();\n\n            var _u8arr8 = new Uint8Array(message);\n\n            var _temp8 = _utf8decoder7.decode(_u8arr8); // 将二进制数据转为字符串\n\n\n            var _msg8 = JSON.parse(_temp8);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg8));\n          } else if (topic.indexOf(\"stream3\") != -1) {\n            var _utf8decoder8 = new TextDecoder();\n\n            var _u8arr9 = new Uint8Array(message);\n\n            var _temp9 = _utf8decoder8.decode(_u8arr9); // 将二进制数据转为字符串\n\n\n            var _msg9 = JSON.parse(_temp9);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg9));\n          } else if (topic.indexOf(\"stream4\") != -1) {\n            var _utf8decoder9 = new TextDecoder();\n\n            var _u8arr10 = new Uint8Array(message);\n\n            var _temp10 = _utf8decoder9.decode(_u8arr10); // 将二进制数据转为字符串\n\n\n            var _msg10 = JSON.parse(_temp10);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg10));\n          } else if (topic.indexOf(\"stream5\") != -1) {\n            var _utf8decoder10 = new TextDecoder();\n\n            var _u8arr11 = new Uint8Array(message);\n\n            var _temp11 = _utf8decoder10.decode(_u8arr11); // 将二进制数据转为字符串\n\n\n            var _msg11 = JSON.parse(_temp11);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg11));\n          } else {}\n        });\n        this.mqttClient.publish('msg_flag', this.number);\n      }\n    },\n    handleSearch: function handleSearch() {\n      this.modelOthers = true;\n      this.$refs.htModels.finbBox(this.inputVal);\n      console.log(this.$refs.htModels, 'asdasdasd');\n      this.inputVal = '';\n    },\n    handleRow: function handleRow(val) {\n      this.modelOthers = true;\n      this.$refs.htModels.finbBox(val);\n    },\n    // 天气\n    handleWather: function handleWather() {\n      var _this8 = this;\n\n      axios({\n        url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100',\n        methods: ''\n      }).then(function (res) {\n        _this8.weatherItem = res.data.lives[0];\n        console.log(_this8.weatherItem, 'asdsads');\n      });\n    },\n    Onweather: function Onweather(name) {},\n    //隐藏箱子\n    hideBox: function hideBox() {\n      this.$refs.htModels.handleFirstBox();\n    }\n  },\n  components: {\n    editModal: editModal,\n    analysisConfiguration: analysisConfiguration,\n    dataBoard: dataBoard\n  }\n};",{"version":3,"sources":["index.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n  \r\n  },\r\n  methods: {\r\n\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n    // 测试：mqtt测试\r\n    testMqtt() {\r\n      this.getDataByMqtt()\r\n    },\r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type),JSON.stringify(form.id))\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n    // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\r\n       \r\n      const clientId = \"test_id_\" + String(new Date().getTime()); // 用户名\r\n      //   const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt\r\n      const host = 'ws://172.16.1.168:10087/';\r\n\r\n      const options = {\r\n        // 配置\r\n        // 测试：订阅本机IP\r\n        // host: host,\r\n        // port: port,\r\n        // host:\"172.16.1.168:10086\",\r\n        keepalive: 60, // 心跳时间，默认60s，设置为0禁用\r\n        username: 'admin',  // 用户名（可选）\r\n        password: '123456',  // 密码（可选）\r\n        clientId: clientId, // 客户端ID，默认随机生成\r\n        protocolId: \"MQTT\",\r\n        protocolVersion: 4,\r\n        clean: true, // false在离线时接收QoS1和2的消息\r\n        reconnectPeriod: 2000, // 重连间隔，默认1000毫秒\r\n        connectTimeout: 30 * 1000, // 收到CONNACK之前的等待时间\r\n        will: {\r\n          // 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）\r\n          topic: \"img1\", // 要发布的主题\r\n          payload: \"[MQTT-TEST] 遗嘱消息：连接异常断开！\", // 要发布的消息\r\n          qos: 0, // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次\r\n          retain: false, // 保留标志\r\n        },\r\n      };\r\n      if (this.mqttClient == undefined) {\r\n        \r\n        this.mqttClient = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host)  // 连接\r\n        // 错误回调\r\n        // console.log(\"this.mqttClient\", this.mqttClient)\r\n        this.mqttClient.on(\"error\", (err) => {\r\n          console.log(\"[MQTT-TEST] 连接错误：\", err);\r\n          this.mqttClient.end();\r\n        });\r\n        // 重连回调\r\n        this.mqttClient.on(\"reconnect\", (reconnect) => {\r\n        //   console.log(\"[MQTT-TEST] 重连中……\", reconnect);\r\n        });\r\n        \r\n        // 连接回调\r\n        this.mqttClient.on(\"connect\", (connect) => {\r\n        //   console.log(\"[MQTT-TEST] 已连接的客户端ID: \", connect);\r\n          \r\n          \r\n        //    this.client.connect('aaa', '111')\r\n         \r\n        //   this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });\r\n        //   this.mqttClient.subscribe('img1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img5', { qos: 0 });\r\n          // 订阅\r\n       this.mqttClient.subscribe('img'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('stream'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('trajectory'+this.number, { qos: 0 });\r\n         \r\n        \r\n          \r\n        \r\n        //   this.mqttClient.subscribe('stream1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream5', { qos: 0 });\r\n          \r\n        });\r\n        \r\n        // 接收回调\r\n        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n            \r\n          if (topic.indexOf(\"img0\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"img1\") != -1) {\r\n             try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img2\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img3\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img4\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img5\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"stream0\") != -1) {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n            // try {\r\n            //   const utf8decoder1 = new TextDecoder()\r\n            //   const u8arr = new Uint8Array(message)\r\n            //   const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n            //     document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n             \r\n            // } catch {\r\n            //   let imageType = 'arraybuffer';\r\n            //   const blob = new Blob([message], { type: imageType })\r\n            //   const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            // //   console.log(\"imageUrl\", imageUrl)\r\n            // }\r\n          } else if (topic.indexOf(\"stream1\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream2\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream3\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream4\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream5\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          }else{\r\n\r\n          }\r\n\r\n        });\r\n        this.mqttClient.publish('msg_flag', this.number);\r\n      }\r\n\r\n\r\n    },\r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"],"sourceRoot":"src/views"}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.function.name\";\nimport \"core-js/modules/web.dom.iterable\";\nimport \"core-js/modules/es6.regexp.split\";\nimport \"core-js/modules/es6.typed.uint8-array\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n// import mqtt from \"mqtt\"; // mqtt协议\nimport editModal from \"@/views/bounced/maintenanceRemind\";\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\nimport dataBoard from \"@/views/bounced/dataBoard\";\nimport { getComponentData, getSectionalData } from \"../api/index\";\nimport serverUrl from \"../config/apiurl.js\";\nimport axios from 'axios'; // mqtt\n// import mqttHandle from \"../../../utils/mqttHandle\";\n\nimport mqttConfig from \"@/utils/mqttConfig.js\";\nvar mqtt; //mqtt 处理对象（全局变量）\n\nvar client; // var topicSends; //订阅的topic 例如：[\"Time1\", \"EngineMain1\", \"Console1\", \"Location1\"]\n\nexport default {\n  data: function data() {\n    return {\n      receiveNews: \"\",\n      topicSends: ['img0', 'stream0', 'trajectory0', 'detection0'],\n      trajectory: false,\n      //轨迹\n      hideBoxShow: true,\n      //隐藏箱子按钮显示隐藏\n      closeStatus: null,\n      modelOthers: false,\n      componentShow: \"\",\n      isShowBtn: true,\n      //菜单按钮隐藏\n      isShowBtn1: false,\n      //菜单按钮显示\n      inputVal: \"\",\n      dialogFormVisible: false,\n      areaComponent: false,\n      indexModule: false,\n      speed: false,\n      component: false,\n      sectionals: [],\n      activeName: 'first',\n      VideoId: '',\n      title: '断面',\n      componentTitle: '速度',\n      form: {\n        name: '',\n        type: '',\n        id: '',\n        coordinate: '',\n        Direction: '正向',\n        StoppingSpeed: '5'\n      },\n      //初始图形名称\n      startFigureName: '',\n      areaComponentform: {\n        name: '',\n        region: '',\n        date1: '',\n        date2: '',\n        delivery: false,\n        type: [],\n        resource: '实时（触发）',\n        desc: ''\n      },\n      timeSelect: [{\n        label: '秒',\n        value: '秒'\n      }, {\n        label: '分钟',\n        value: '分钟'\n      }, {\n        label: '小时',\n        value: '小时'\n      }, {\n        label: '天',\n        value: '天'\n      }],\n      componentForm: {\n        //单位\n        company: \"秒\",\n        componentName: \"\",\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\n        //周期间隔\n        cycleInterval: \"\",\n        startSectionIds: \"\",\n        startSectionNames: \"\",\n        endSectionIds: \"\",\n        endSectionNames: \"\",\n        endValue: \"\",\n        //展现形式\n        presentationForm: \"\",\n        presentation: [],\n        startValue: \"\",\n        timeMode: \"触发\",\n        type: \"\",\n        startSection: [],\n        endSection: [],\n        componentType: \"\",\n        typeFiltering: ''\n      },\n      typeData: [\"小汽车\", \"公交车\", \"卡车\", \"非机动车\", \"行人\"],\n      //展现形式\n      presentation: ['数值', '表格', '时间曲线图', '均值图'],\n      trackForm: {\n        name: \"\"\n      },\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\n      nowTime: \"\",\n      //   weekday: this.$moment().format(\"dddd\"),\n      ins: 0,\n      imgUrl: '',\n      imgUrl1: '',\n      imgUrl2: '',\n      imgUrl3: '',\n      imgUrl4: '',\n      imgUrl5: '',\n      btnPic: [],\n      Data: [{\n        title: 'xx路口',\n        url: ''\n      }, {\n        title: '数据看板',\n        url: ''\n      }, {\n        title: '分析配置',\n        url: ''\n      }, {\n        title: '分析配置',\n        url: ''\n      }],\n      messageInfo: [],\n      orderList: [],\n      enterList: [],\n      stockInfo: [],\n      perCent: 0,\n      perCent1: 0,\n      perCent2: 0,\n      facToal: \"\",\n      wbContent: '',\n      //   wxContent:'',\n      inContent: '',\n      outContent: '',\n      containerDetails: \"\",\n      locdesc: '',\n      weatherItem: {},\n      loadingShow1: true,\n      number: '',\n      componentId: '' //   carInfo: [], //小车信息\n      //   carName: '',\n      //   palletizerInfo: [], //码垛机信息\n      //   palletizerName: '',\n      //   destackerInfo: [], //拆垛机信息\n      //   destackerName: '',\n      //   hoistInfo: [], //提升机信息’\n      //   hoistName: '',\n      //   battaryStationInfo: [],//快换电池装置\n      //   battaryStationName: \"\",\n      //   conveyorInfo: [], //输送机信息\n      //   conveyorName: \"\",\n\n    };\n  },\n  mounted: function mounted() {\n    window.getFigure = this.getFigureD;\n    window.getModifyTheName = this.getModifyTheNameN; // window.getModifyTheName = this.getModifyTheNameN;\n\n    window.getSingleComponentId = this.getSingleComponentIdN;\n    window.getSimulationAreaEdit = this.getSimulationAreaEdit;\n    window.OnScene = this.OnSceneN;\n    this.getAllSectionalData(this.$route.query.id);\n    this.VideoId = this.$route.query.id;\n    this.number = this.$route.query.num; //   this.getSingleComponentIdN()\n  },\n  created: function created() {\n    // this.testMqtt()\n    this.componentForm.company = this.timeSelect[0].value;\n    this.createMqtt();\n  },\n  methods: {\n    /** 创建mqtt */\n    createMqtt: function createMqtt() {\n      var _this = this;\n\n      //创建链接，接收数据\n      mqtt = new mqttConfig(this.topicSends);\n      client = mqtt.createConnect();\n      client.subscribe(['img' + this.number, 'stream' + this.number, 'trajectory' + this.number, 'detection' + this.number], {\n        qos: 0\n      }, function (err) {\n        if (!err) {\n          console.log(\"订阅成功\");\n          client.publish('msg_stream', JSON.stringify({\n            \"msg_flag\": parseInt(_this.number)\n          }));\n        } else {\n          console.log('消息订阅失败！');\n        }\n      });\n      client.on(\"message\", function (topic, message) {\n        //数据分类\n        try {\n          //   this.receiveNews = this.receiveNews.concat(message);\n          //   this.realInfo(topic, this.receiveNews);\n          _this.realInfo(topic, message);\n        } catch (error) {}\n      });\n    },\n    //停止订阅mqtt\n    disConnect: function disConnect() {\n      if (client != null) {\n        client.unsubscribe(this.topicSends);\n        client = null;\n      }\n    },\n\n    /** 实时数据分类 */\n    realInfo: function realInfo(topic, message) {\n      switch (topic) {\n        // 接收托片\n        case \"img0\":\n        case \"img1\":\n        case \"img2\":\n          try {\n            var utf8decoder = new TextDecoder();\n            var u8arr = new Uint8Array(message);\n            var temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串\n\n            var msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n\n            document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg));\n          } catch (error) {}\n\n          break;\n        // 树结构\n\n        case \"stream0\":\n        case \"stream1\":\n        case \"stream2\":\n          try {\n            var utf8decoder1 = new TextDecoder();\n\n            var _u8arr = new Uint8Array(message);\n\n            var _temp = utf8decoder1.decode(_u8arr); // 将二进制数据转为字符串\n\n\n            var _msg = JSON.parse(_temp);\n\n            document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(_msg));\n          } catch (error) {}\n\n          break;\n        // 控制台输出\n\n        case \"trajectory0\":\n        case \"trajectory1\":\n        case \"trajectory2\":\n        case \"trajectory3\":\n          try {\n            var _utf8decoder = new TextDecoder();\n\n            var _u8arr2 = new Uint8Array(message); //    console.log(\"message11\",message)\n\n\n            var _temp2 = _utf8decoder.decode(_u8arr2); // 将二进制数据转为字符串\n            //   console.log(\"temp11\",temp)\n\n\n            var _msg2 = JSON.parse(_temp2); //  console.log(\"msg11\",msg)\n\n\n            document.getElementById(\"mapModule\").contentWindow.getGuiJi(JSON.stringify(_msg2));\n          } catch (error) {}\n\n          break;\n        // 触发\n\n        case \"detection0\":\n        case \"detection1\":\n        case \"detection2\":\n          try {\n            var _utf8decoder2 = new TextDecoder();\n\n            var _u8arr3 = new Uint8Array(message); //   console.log(\"message\",message)\n\n\n            var _temp3 = _utf8decoder2.decode(_u8arr3); // 将二进制数据转为字符串\n            //   console.log(\"temp\",temp)\n\n\n            var _msg3 = JSON.parse(_temp3); //   console.log(\"msg\",msg)\n\n\n            document.getElementById(\"mapModule\").contentWindow.getChuFa(JSON.stringify(_msg3));\n          } catch (error) {}\n\n          break;\n      }\n\n      this.receiveNews = \"\";\n    },\n    // handleClick(tab, event) {\n    //     console.log(tab, event);\n    //   },\n    //初始化unity\n    OnSceneN: function OnSceneN() {\n      document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id));\n    },\n    // //新增组件根据组件id获取单个组件数据\n    getSingleComponentIdN: function getSingleComponentIdN(id, type, name) {\n      var _this2 = this;\n\n      console.log(\"id\", id);\n      console.log(\"type\", type);\n      console.log(\"name\", name);\n      this.componentId = id;\n      this.componentForm.componentType = type;\n      this.componentTitle = type;\n      getComponentData({\n        AnalogAreaComponentId: id\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          console.log(\"res\", res.data.data);\n          _this2.component = true;\n\n          if (res.data.data.company != '') {\n            _this2.componentForm.company = res.data.data.company;\n          }\n\n          if (res.data.data.timeMode != '') {\n            _this2.componentForm.timeMode = res.data.data.timeMode;\n          }\n\n          _this2.componentForm.componentName = res.data.data.componentName + '-' + type;\n          _this2.componentForm.componentParameterId = res.data.data.componentParameterId;\n          _this2.componentForm.cycleInterval = res.data.data.cycleInterval;\n          _this2.componentForm.startSectionIds = res.data.data.startSectionIds;\n          _this2.componentForm.startSectionNames = res.data.data.startSectionNames;\n          _this2.componentForm.endSectionIds = res.data.data.endSectionIds;\n          _this2.componentForm.endSectionNames = res.data.data.endSectionNames;\n          _this2.componentForm.endValue = res.data.data.endValue;\n          _this2.componentForm.startValue = res.data.data.startValue;\n          _this2.componentForm.presentationForm = res.data.data.presentationForm;\n          _this2.componentForm.type = res.data.data.type;\n\n          if (res.data.data.startSectionIds != '') {\n            console.log(\"startSectionIds\", res.data.data.startSectionIds);\n            var startSectionIdArr = [];\n            var startSectionArr = [];\n            startSectionIdArr = res.data.data.startSectionIds.split(',');\n            console.log(\"this.sectionals\", _this2.sectionals);\n            console.log(\"startSectionIdArr\", startSectionIdArr);\n            startSectionIdArr.forEach(function (item) {\n              _this2.sectionals.forEach(function (items) {\n                if (item == items.graphicId) {\n                  startSectionArr.push(items.graphicName);\n                  _this2.componentForm.startSection = startSectionArr;\n                }\n              });\n            });\n          }\n\n          if (res.data.data.endSectionIds != '') {\n            console.log(\"endSectionIds\", res.data.data.endSectionIds);\n            var endSectionIdArr = [];\n            var endSectionArr = [];\n            endSectionIdArr = res.data.data.endSectionIds.split(',');\n            console.log(\"this.sectionals\", _this2.sectionals);\n            console.log(\"endSectionIdArr\", endSectionIdArr);\n            endSectionIdArr.forEach(function (item) {\n              _this2.sectionals.forEach(function (items) {\n                if (item == items.graphicId) {\n                  endSectionArr.push(items.graphicName);\n                  _this2.componentForm.endSection = endSectionArr;\n                }\n              });\n            });\n          }\n\n          if (res.data.data.presentationForm != '') {\n            var presentationN = [];\n            presentationN = res.data.data.presentationForm.split(',');\n            _this2.componentForm.presentation = presentationN;\n          }\n        }\n      });\n    },\n    //修改模拟区组件、图形\n    getSimulationAreaEdit: function getSimulationAreaEdit(id, type, componentType, name) {\n      var _this3 = this;\n\n      if (type == '图形') {\n        this.form.id = id;\n        this.form.name = name;\n        this.form.type = componentType;\n        this.startFigureName = name;\n\n        if (this.form.type == '轨迹') {\n          this.dialogFormVisible = true;\n        } else if (this.form.type == '区域') {\n          this.dialogFormVisible = true;\n        } else if (this.form.type == '断面') {\n          this.dialogFormVisible = true;\n        }\n      } else if (type == '组件') {\n        this.componentId = id;\n        this.componentForm.componentType = componentType;\n        this.componentTitle = componentType;\n        getComponentData({\n          AnalogAreaComponentId: id\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          if (res.data.code == 200) {\n            console.log(\"res\", res.data.data);\n            _this3.component = true;\n\n            if (res.data.data.company != '') {\n              _this3.componentForm.company = res.data.data.company;\n            }\n\n            if (res.data.data.timeMode != '') {\n              _this3.componentForm.timeMode = res.data.data.timeMode;\n            }\n\n            _this3.componentForm.componentName = res.data.data.componentName + '-' + type;\n            _this3.componentForm.componentParameterId = res.data.data.componentParameterId;\n            _this3.componentForm.cycleInterval = res.data.data.cycleInterval;\n            _this3.componentForm.startSectionIds = res.data.data.startSectionIds;\n            _this3.componentForm.startSectionNames = res.data.data.startSectionNames;\n            _this3.componentForm.endSectionIds = res.data.data.endSectionIds;\n            _this3.componentForm.endSectionNames = res.data.data.endSectionNames;\n            _this3.componentForm.endValue = res.data.data.endValue;\n            _this3.componentForm.startValue = res.data.data.startValue;\n            _this3.componentForm.presentationForm = res.data.data.presentationForm;\n            _this3.componentForm.type = res.data.data.type;\n\n            if (res.data.data.startSectionIds != '') {\n              console.log(\"startSectionIds\", res.data.data.startSectionIds);\n              var startSectionIdArr = [];\n              var startSectionArr = [];\n              startSectionIdArr = res.data.data.startSectionIds.split(',');\n              console.log(\"this.sectionals\", _this3.sectionals);\n              console.log(\"startSectionIdArr\", startSectionIdArr);\n              startSectionIdArr.forEach(function (item) {\n                _this3.sectionals.forEach(function (items) {\n                  if (item == items.graphicId) {\n                    startSectionArr.push(items.graphicName);\n                    _this3.componentForm.startSection = startSectionArr;\n                  }\n                });\n              });\n            }\n\n            if (res.data.data.endSectionIds != '') {\n              console.log(\"endSectionIds\", res.data.data.endSectionIds);\n              var endSectionIdArr = [];\n              var endSectionArr = [];\n              endSectionIdArr = res.data.data.endSectionIds.split(',');\n              console.log(\"this.sectionals\", _this3.sectionals);\n              console.log(\"endSectionIdArr\", endSectionIdArr);\n              endSectionIdArr.forEach(function (item) {\n                _this3.sectionals.forEach(function (items) {\n                  if (item == items.graphicId) {\n                    endSectionArr.push(items.graphicName);\n                    _this3.componentForm.endSection = endSectionArr;\n                  }\n                });\n              });\n            }\n\n            if (res.data.data.presentationForm != '') {\n              var presentationN = [];\n              presentationN = res.data.data.presentationForm.split(',');\n              _this3.componentForm.presentation = presentationN;\n            }\n          }\n        });\n      }\n    },\n    //获取所有断面数据\n    getAllSectionalData: function getAllSectionalData(VideoId) {\n      var _this4 = this;\n\n      getSectionalData({\n        VideoId: VideoId\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this4.sectionals = res.data.data;\n        }\n      });\n    },\n    figureType: function figureType(type) {\n      if (type == 'Move') {\n        type = '轨迹';\n      } else if (type == 'Poly') {\n        type = '区域';\n      } else if (type == 'Line') {\n        type = '断面';\n      }\n\n      return type;\n    },\n    getFigureD: function getFigureD(item, index, indexNew) {\n      console.log(\"图形类型\", item);\n      console.log(\"初始图形名称\", index);\n      this.startFigureName = index;\n      console.log(\"图形位置\", indexNew);\n      this.dialogFormVisible = true;\n      this.form.name = index;\n      this.form.type = this.figureType(item);\n      this.form.coordinate = indexNew;\n      this.form.id = '';\n      this.title = this.figureType(item);\n    },\n    //双击图形修改图形名称弹框\n    getModifyTheNameN: function getModifyTheNameN(data) {\n      console.log(\"data\", data);\n      var arr = [];\n      arr = data.split(',');\n      console.log(\"arr\", arr);\n      this.form.id = arr[0];\n      this.form.name = arr[1];\n      this.form.type = arr[2];\n      this.startFigureName = arr[1];\n\n      if (this.form.type == '轨迹') {\n        // this.open2()\n        this.dialogFormVisible = true;\n      } else if (this.form.type == '区域') {\n        this.dialogFormVisible = true;\n      } else if (this.form.type == '断面') {\n        this.dialogFormVisible = true;\n      }\n    },\n    //新增、编辑图形确认按钮\n    onSubmit: function onSubmit(form) {\n      var _this5 = this;\n\n      console.log(\"form\", form); //新增\n\n      if (form.id == '') {\n        var formData = new FormData();\n\n        if (form.type == '断面') {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId);\n          formData.append(\"Direction\", form.Direction);\n        } else if (form.type == '区域') {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId); // formData.append(\"Direction\",form.Direction);\n          // formData.append(\"StoppingSpeed\",form.StoppingSpeed);\n        } else {\n          formData.append(\"GraphicName\", form.name);\n          formData.append(\"GraphicType\", form.type);\n          formData.append(\"Coordinate\", form.coordinate);\n          formData.append(\"VideoId\", this.VideoId); // formData.append(\"Direction\",form.Direction);\n        }\n\n        axios({\n          method: \"post\",\n          url: serverUrl.addFigure,\n          data: formData\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          if (res.data.code == 200) {\n            _this5.$message({\n              message: res.data.msg,\n              type: 'success'\n            });\n\n            document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data));\n            document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data + ',' + form.name + ',' + _this5.startFigureName));\n            _this5.dialogFormVisible = false;\n          } else {\n            _this5.$message({\n              message: res.data.msg,\n              type: 'warning'\n            });\n          }\n        });\n      } else {\n        //编辑\n        var _formData = new FormData();\n\n        if (form.type == '断面') {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type);\n\n          _formData.append(\"Direction\", form.Direction);\n\n          _formData.append(\"GraphicId\", form.id);\n        } else if (form.type == '区域') {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type);\n\n          _formData.append(\"Direction\", form.Direction);\n\n          _formData.append(\"GraphicId\", form.id);\n\n          _formData.append(\"StoppingSpeed\", form.StoppingSpeed);\n        } else {\n          _formData.append(\"GraphicName\", form.name);\n\n          _formData.append(\"GraphicType\", form.type); // formData.append(\"Direction\",form.Direction);\n\n\n          _formData.append(\"GraphicId\", form.id);\n        }\n\n        axios({\n          method: \"post\",\n          url: serverUrl.editFigure,\n          data: _formData\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          if (res.data.code == 200) {\n            _this5.$message({\n              message: res.data.msg,\n              type: 'success'\n            });\n\n            console.log(\"startFigureName\", _this5.startFigureName); // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\n\n            document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id + ',' + form.name + ',' + _this5.startFigureName));\n            _this5.dialogFormVisible = false;\n          } else {\n            _this5.$message({\n              message: res.data.msg,\n              type: 'warning'\n            });\n          }\n        });\n      }\n    },\n    //新增编辑组件取消\n    onSubmitComponent: function onSubmitComponent(componentForm) {\n      var _this6 = this;\n\n      this.component = false;\n      var formData = new FormData();\n\n      if (componentForm.componentType == 'OD') {\n        //名称\n        formData.append(\"componentName\", componentForm.componentName); //单位\n\n        formData.append(\"company\", componentForm.company); //id\n\n        formData.append(\"componentParameterId\", componentForm.componentParameterId);\n        formData.append(\"cycleInterval\", componentForm.cycleInterval);\n        formData.append(\"startSectionIds\", componentForm.startSectionIds);\n        formData.append(\"startSectionNames\", componentForm.startSectionNames);\n        formData.append(\"endSectionIds\", componentForm.endSectionIds);\n        formData.append(\"endSectionNames\", componentForm.endSectionNames);\n        formData.append(\"endValue\", componentForm.endValue);\n        formData.append(\"startValue\", componentForm.startValue);\n        formData.append(\"timeMode\", componentForm.timeMode);\n        formData.append(\"presentationForm\", '矩阵图');\n        formData.append(\"type\", componentForm.type);\n      } else {\n        //名称\n        formData.append(\"componentName\", componentForm.componentName); //单位\n\n        formData.append(\"company\", componentForm.company); //id\n\n        formData.append(\"componentParameterId\", componentForm.componentParameterId);\n        formData.append(\"cycleInterval\", componentForm.cycleInterval);\n        formData.append(\"endValue\", componentForm.endValue);\n        formData.append(\"startValue\", componentForm.startValue);\n        formData.append(\"timeMode\", componentForm.timeMode);\n        formData.append(\"presentationForm\", componentForm.presentationForm);\n        formData.append(\"type\", componentForm.type);\n      }\n\n      axios({\n        method: \"post\",\n        url: serverUrl.editComponent,\n        data: formData\n      }).then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this6.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n\n          document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data));\n          document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(_this6.componentId + ',' + componentForm.componentName));\n          _this6.dialogFormVisible = false;\n        } else {\n          _this6.$message({\n            message: res.data.msg,\n            type: 'warning'\n          });\n        }\n      });\n    },\n    //新增编辑组件取消\n    closeComponent: function closeComponent(componentForm) {\n      this.component = false;\n    },\n    //新增、编辑图形取消按钮\n    closeFigure: function closeFigure(form) {\n      console.log(\"form\", form);\n\n      if (form.id != '') {\n        this.dialogFormVisible = false; // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\n\n        document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));\n      } else {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.delFigure();\n      }\n    },\n    closeComponentForm: function closeComponentForm() {\n      this.component = false;\n    },\n    closeForm: function closeForm(form) {\n      if (this.form.id != '') {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id)); //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\n      } else {\n        this.dialogFormVisible = false;\n        document.getElementById(\"mapModule\").contentWindow.delFigure();\n      }\n    },\n    //改变起点\n    handleCheckedStartSection: function handleCheckedStartSection(value) {\n      var _this7 = this;\n\n      console.log(\"改变起点\", value);\n      var startSectionIdArr = [];\n      var startSectionNameArr = [];\n      value.forEach(function (item) {\n        _this7.sectionals.forEach(function (items) {\n          if (item == items.graphicName) {\n            startSectionIdArr.push(items.graphicId);\n            startSectionNameArr.push(items.graphicName);\n            var newStartSectionId = startSectionIdArr.join(\",\");\n            var newStartSectionName = startSectionNameArr.join(\",\");\n            _this7.componentForm.startSectionIds = newStartSectionId;\n            _this7.componentForm.startSectionNames = newStartSectionName;\n          }\n        });\n      });\n    },\n    //改变终点\n    handleCheckedendSection: function handleCheckedendSection(value) {\n      var _this8 = this;\n\n      console.log(\"改变终点\", value);\n      var endSectionIdArr = [];\n      var endSectionNameArr = [];\n      value.forEach(function (item) {\n        _this8.sectionals.forEach(function (items) {\n          if (item == items.graphicName) {\n            endSectionIdArr.push(items.graphicId);\n            endSectionNameArr.push(items.graphicName);\n            var newendSectionId = endSectionIdArr.join(\",\");\n            var newEndSectionName = endSectionNameArr.join(\",\");\n            console.log(\"newendSectionId\", newendSectionId);\n            console.log(\"newEndSectionName\", newEndSectionName);\n            _this8.componentForm.endSectionIds = newendSectionId;\n            _this8.componentForm.endSectionNames = newEndSectionName;\n          }\n        });\n      });\n    },\n    //修改展现形式\n    handlePresentation: function handlePresentation(value) {\n      console.log(\"展现形式\", value);\n      var presentation = value.join(\",\");\n      this.componentForm.presentationForm = presentation;\n      console.log(\"this.componentForm.presentationForm\", this.componentForm.presentationForm);\n    },\n    //模型加载等待\n    loadingShow: function loadingShow(data) {\n      this.loadingShow1 = data;\n    },\n    handleSearch: function handleSearch() {\n      this.modelOthers = true;\n      this.$refs.htModels.finbBox(this.inputVal);\n      console.log(this.$refs.htModels, 'asdasdasd');\n      this.inputVal = '';\n    },\n    handleRow: function handleRow(val) {\n      this.modelOthers = true;\n      this.$refs.htModels.finbBox(val);\n    },\n    // 天气\n    handleWather: function handleWather() {\n      var _this9 = this;\n\n      axios({\n        url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100',\n        methods: ''\n      }).then(function (res) {\n        _this9.weatherItem = res.data.lives[0];\n        console.log(_this9.weatherItem, 'asdsads');\n      });\n    },\n    Onweather: function Onweather(name) {},\n    //隐藏箱子\n    hideBox: function hideBox() {\n      this.$refs.htModels.handleFirstBox();\n    }\n  },\n  components: {\n    editModal: editModal,\n    analysisConfiguration: analysisConfiguration,\n    dataBoard: dataBoard\n  }\n};",{"version":3,"sources":["index.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\n// import mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n// mqtt\r\n// import mqttHandle from \"../../../utils/mqttHandle\";\r\nimport mqttConfig from \"@/utils/mqttConfig.js\";\r\nvar mqtt; //mqtt 处理对象（全局变量）\r\nvar client;\r\n// var topicSends; //订阅的topic 例如：[\"Time1\", \"EngineMain1\", \"Console1\", \"Location1\"]\r\n \r\nexport default {\r\n  data() {\r\n    return {\r\n        receiveNews: \"\",\r\n        topicSends:['img0','stream0','trajectory0','detection0'],\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n    window.getSimulationAreaEdit = this.getSimulationAreaEdit;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    // this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n   this.createMqtt();\r\n  },\r\n  methods: {\r\n     /** 创建mqtt */\r\n    createMqtt() {\r\n      //创建链接，接收数据\r\n      \r\n      mqtt = new mqttConfig(this.topicSends);\r\n      client = mqtt.createConnect();\r\n    client.subscribe(['img'+this.number,'stream'+this.number, 'trajectory'+this.number, 'detection'+this.number], { qos: 0 }, (err)=> {\r\n          if (!err) {\r\n            console.log(\"订阅成功\");\r\n            client.publish('msg_stream',JSON.stringify({\"msg_flag\":parseInt(this.number)})) \r\n          } else {\r\n            console.log('消息订阅失败！')\r\n          }\r\n          \r\n        }); \r\n      client.on(\"message\", (topic, message) => {\r\n        //数据分类\r\n        try {\r\n        //   this.receiveNews = this.receiveNews.concat(message);\r\n        //   this.realInfo(topic, this.receiveNews);\r\n          this.realInfo(topic, message);\r\n        } catch (error) {\r\n\r\n        }\r\n      });\r\n    },\r\n    //停止订阅mqtt\r\n    disConnect() {\r\n      if (client != null) {\r\n        client.unsubscribe(this.topicSends);\r\n        client = null;\r\n      }\r\n    },\r\n    /** 实时数据分类 */\r\n    realInfo(topic, message) {\r\n      switch (topic) {\r\n        // 接收托片\r\n        case \"img0\":\r\n        case \"img1\":\r\n        case \"img2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 树结构\r\n        case \"stream0\":\r\n        case \"stream1\":\r\n        case \"stream2\":\r\n          try {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 控制台输出\r\n        case \"trajectory0\":\r\n        case \"trajectory1\":\r\n        case \"trajectory2\":\r\n        case \"trajectory3\":\r\n          try {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //    console.log(\"message11\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp11\",temp)\r\n              const msg = JSON.parse(temp)\r\n                //  console.log(\"msg11\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getGuiJi(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 触发\r\n        case \"detection0\":\r\n        case \"detection1\":\r\n        case \"detection2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //   console.log(\"message\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp\",temp)\r\n              const msg = JSON.parse(temp)\r\n            //   console.log(\"msg\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getChuFa(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n      }\r\n      this.receiveNews = \"\";\r\n    },\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n   \r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //新增组件根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //修改模拟区组件、图形\r\n    getSimulationAreaEdit(id,type,componentType,name){\r\n        if(type=='图形'){\r\n        this.form.id = id\r\n        this.form.name = name\r\n        this.form.type = componentType\r\n        this.startFigureName = name\r\n        if(this.form.type=='轨迹'){\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n        }else if(type=='组件'){\r\n            this.componentId = id\r\n        this.componentForm.componentType = componentType\r\n        this.componentTitle = componentType\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n        }\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        // formData.append(\"Direction\",form.Direction);\r\n        // formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n   \r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"],"sourceRoot":"src/views"}]}
\ No newline at end of file
diff --git a/node_modules/.cache/babel-loader/416592def4d75bdc4425389f79542155.json b/node_modules/.cache/babel-loader/416592def4d75bdc4425389f79542155.json
new file mode 100644
index 00000000..557089bd
--- /dev/null
+++ b/node_modules/.cache/babel-loader/416592def4d75bdc4425389f79542155.json
@@ -0,0 +1 @@
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!D:\\Hjm项目\\TransFlow\\src\\utils\\mqttConfig.js","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\utils\\mqttConfig.js","mtime":1673507216981},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import _objectWithoutProperties from \"D:/Hjm\\u9879\\u76EE/TransFlow/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport \"core-js/modules/es6.number.constructor\";\nimport \"core-js/modules/es6.regexp.to-string\";\nimport _classCallCheck from \"D:/Hjm\\u9879\\u76EE/TransFlow/node_modules/@babel/runtime/helpers/esm/classCallCheck\";\nimport _createClass from \"D:/Hjm\\u9879\\u76EE/TransFlow/node_modules/@babel/runtime/helpers/esm/createClass\";\nimport mqtt from \"mqtt\";\nimport Vue from 'vue';\nvar vm = new Vue();\n\nvar mqttHandle = /*#__PURE__*/function () {\n  function mqttHandle(subscribe) {\n    _classCallCheck(this, mqttHandle);\n\n    this.connect = {\n      host: vm.mqttHost,\n      port: vm.mqttPort,\n      endpoint: \"/mqtt\",\n      clean: true,\n      // 保留会话\n      cleanSession: true,\n      connectTimeout: 7000,\n      // 超时时间\n      reconnectPeriod: 7000,\n      // 重连时间间隔\n      // 认证信息\n      clientId: Number(new Date()).toString(),\n      username: \"admin\",\n      password: \"123456\"\n    };\n    this.subscription = {\n      topic: subscribe,\n      //需要传入数组的包含订阅的名称\n      qos: 2\n    };\n    this.mqttClient = null;\n  }\n  /**\r\n   * 创建链接\r\n   * @returns client\r\n   */\n\n\n  _createClass(mqttHandle, [{\n    key: \"createConnect\",\n    value: function createConnect() {\n      var _this = this;\n\n      //配置链接\n      var _this$connect = this.connect,\n          host = _this$connect.host,\n          port = _this$connect.port,\n          endpoint = _this$connect.endpoint,\n          options = _objectWithoutProperties(_this$connect, [\"host\", \"port\", \"endpoint\"]); // const connectUrl = `ws://${this.connect.host}:${this.connect.port}${this.connect.endpoint}`;\n\n\n      var connectUrl = 'ws://172.16.1.168:10087/';\n\n      try {\n        this._client = mqtt.connect(connectUrl, options);\n      } catch (error) {\n        console.log(\"mqtt.connect error\", error);\n      }\n\n      this._client.on(\"connect\", function () {\n        console.log(\"Connection succeeded!\"); // this._client.subscribe('img'+this.number, { qos: 0 });\n        // this._client.subscribe('stream'+this.number, { qos: 0 });\n        // this._client.subscribe('trajectory'+this.number, { qos: 0 });\n        // this._client.subscribe('detection'+this.number, { qos: 0 });\n        // this._client.subscribe('img0', { qos: 0 });\n        // this._client.subscribe('stream0', { qos: 0 });\n        // this._client.subscribe('trajectory0', { qos: 0 });\n        // this._client.subscribe('detection0', { qos: 0 });\n      });\n\n      this._client.on('reconnect', function (error) {\n        console.log('正在重连', error);\n      });\n\n      this._client.on(\"error\", function (error) {\n        console.log(\"Connection failed\", error);\n      }); //配置topic\n\n\n      var _this$subscription = this.subscription,\n          topic = _this$subscription.topic,\n          qos = _this$subscription.qos;\n\n      this._client.subscribe(topic, {\n        qos: qos\n      }, function (error, res) {\n        if (error) {\n          console.log(\"Subscribe to topics error\", error);\n          return;\n        }\n\n        _this.subscribeSuccess = true;\n        console.log(\"Subscribe to topics res\", res[0].qos, res[0].topic);\n      });\n\n      this.mqttClient = this._client;\n      return this.mqttClient;\n    }\n  }]);\n\n  return mqttHandle;\n}();\n\nexport default mqttHandle;",{"version":3,"sources":["D:/Hjm项目/TransFlow/src/utils/mqttConfig.js"],"names":["mqtt","Vue","vm","mqttHandle","subscribe","connect","host","mqttHost","port","mqttPort","endpoint","clean","cleanSession","connectTimeout","reconnectPeriod","clientId","Number","Date","toString","username","password","subscription","topic","qos","mqttClient","options","connectUrl","_client","error","console","log","on","res","subscribeSuccess"],"mappings":";;;;;AAAA,OAAOA,IAAP,MAAiB,MAAjB;AACA,OAAOC,GAAP,MAAgB,KAAhB;AACA,IAAIC,EAAE,GAAG,IAAID,GAAJ,EAAT;;IACME,U;AACF,sBAAYC,SAAZ,EAAuB;AAAA;;AACnB,SAAKC,OAAL,GAAe;AACXC,MAAAA,IAAI,EAAEJ,EAAE,CAACK,QADE;AAEXC,MAAAA,IAAI,EAAEN,EAAE,CAACO,QAFE;AAGXC,MAAAA,QAAQ,EAAE,OAHC;AAIXC,MAAAA,KAAK,EAAE,IAJI;AAIE;AACbC,MAAAA,YAAY,EAAE,IALH;AAMXC,MAAAA,cAAc,EAAE,IANL;AAMW;AACtBC,MAAAA,eAAe,EAAE,IAPN;AAOY;AACvB;AACAC,MAAAA,QAAQ,EAAEC,MAAM,CAAC,IAAIC,IAAJ,EAAD,CAAN,CAAmBC,QAAnB,EATC;AAUXC,MAAAA,QAAQ,EAAE,OAVC;AAWXC,MAAAA,QAAQ,EAAE;AAXC,KAAf;AAaA,SAAKC,YAAL,GAAoB;AAChBC,MAAAA,KAAK,EAAElB,SADS;AACG;AACnBmB,MAAAA,GAAG,EAAE;AAFW,KAApB;AAIA,SAAKC,UAAL,GAAkB,IAAlB;AACH;AACD;;;;;;;;oCAIgB;AAAA;;AACZ;AADY,0BAEiC,KAAKnB,OAFtC;AAAA,UAEJC,IAFI,iBAEJA,IAFI;AAAA,UAEEE,IAFF,iBAEEA,IAFF;AAAA,UAEQE,QAFR,iBAEQA,QAFR;AAAA,UAEqBe,OAFrB,0EAGZ;;;AACA,UAAMC,UAAU,GAAG,0BAAnB;;AACA,UAAI;AACA,aAAKC,OAAL,GAAe3B,IAAI,CAACK,OAAL,CAAaqB,UAAb,EAAyBD,OAAzB,CAAf;AAEH,OAHD,CAGE,OAAOG,KAAP,EAAc;AACZC,QAAAA,OAAO,CAACC,GAAR,CAAY,oBAAZ,EAAkCF,KAAlC;AACH;;AACD,WAAKD,OAAL,CAAaI,EAAb,CAAgB,SAAhB,EAA2B,YAAM;AAC7BF,QAAAA,OAAO,CAACC,GAAR,CAAY,uBAAZ,EAD6B,CAE7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACH,OAVD;;AAWA,WAAKH,OAAL,CAAaI,EAAb,CAAgB,WAAhB,EAA6B,UAACH,KAAD,EAAW;AACpCC,QAAAA,OAAO,CAACC,GAAR,CAAY,MAAZ,EAAoBF,KAApB;AACH,OAFD;;AAGA,WAAKD,OAAL,CAAaI,EAAb,CAAgB,OAAhB,EAAyB,UAACH,KAAD,EAAW;AAChCC,QAAAA,OAAO,CAACC,GAAR,CAAY,mBAAZ,EAAiCF,KAAjC;AACH,OAFD,EAzBY,CA6BZ;;;AA7BY,+BA8BW,KAAKP,YA9BhB;AAAA,UA8BJC,KA9BI,sBA8BJA,KA9BI;AAAA,UA8BGC,GA9BH,sBA8BGA,GA9BH;;AA+BZ,WAAKI,OAAL,CAAavB,SAAb,CAAuBkB,KAAvB,EAA8B;AAAEC,QAAAA,GAAG,EAAEA;AAAP,OAA9B,EAA4C,UAACK,KAAD,EAAQI,GAAR,EAAgB;AACxD,YAAIJ,KAAJ,EAAW;AACPC,UAAAA,OAAO,CAACC,GAAR,CAAY,2BAAZ,EAAyCF,KAAzC;AACA;AACH;;AACD,QAAA,KAAI,CAACK,gBAAL,GAAwB,IAAxB;AACAJ,QAAAA,OAAO,CAACC,GAAR,CAAY,yBAAZ,EAAuCE,GAAG,CAAC,CAAD,CAAH,CAAOT,GAA9C,EAAmDS,GAAG,CAAC,CAAD,CAAH,CAAOV,KAA1D;AACH,OAPD;;AAQA,WAAKE,UAAL,GAAkB,KAAKG,OAAvB;AACA,aAAO,KAAKH,UAAZ;AACH;;;;;;AAGL,eAAerB,UAAf","sourcesContent":["import mqtt from \"mqtt\";\r\nimport Vue from 'vue'\r\nvar vm = new Vue();\r\nclass mqttHandle {\r\n    constructor(subscribe) {\r\n        this.connect = {\r\n            host: vm.mqttHost,\r\n            port: vm.mqttPort,\r\n            endpoint: \"/mqtt\",\r\n            clean: true, // 保留会话\r\n            cleanSession: true,\r\n            connectTimeout: 7000, // 超时时间\r\n            reconnectPeriod: 7000, // 重连时间间隔\r\n            // 认证信息\r\n            clientId: Number(new Date()).toString(),\r\n            username: \"admin\",\r\n            password: \"123456\",\r\n        }\r\n        this.subscription = {\r\n            topic: subscribe,  //需要传入数组的包含订阅的名称\r\n            qos: 2,\r\n        }\r\n        this.mqttClient = null;\r\n    }\r\n    /**\r\n     * 创建链接\r\n     * @returns client\r\n     */\r\n    createConnect() {\r\n        //配置链接\r\n        const { host, port, endpoint, ...options } = this.connect;\r\n        // const connectUrl = `ws://${this.connect.host}:${this.connect.port}${this.connect.endpoint}`;\r\n        const connectUrl = 'ws://172.16.1.168:10087/';\r\n        try {\r\n            this._client = mqtt.connect(connectUrl, options);\r\n \r\n        } catch (error) {\r\n            console.log(\"mqtt.connect error\", error);\r\n        }\r\n        this._client.on(\"connect\", () => {\r\n            console.log(\"Connection succeeded!\");\r\n            // this._client.subscribe('img'+this.number, { qos: 0 });\r\n            // this._client.subscribe('stream'+this.number, { qos: 0 });\r\n            // this._client.subscribe('trajectory'+this.number, { qos: 0 });\r\n            // this._client.subscribe('detection'+this.number, { qos: 0 });\r\n            // this._client.subscribe('img0', { qos: 0 });\r\n            // this._client.subscribe('stream0', { qos: 0 });\r\n            // this._client.subscribe('trajectory0', { qos: 0 });\r\n            // this._client.subscribe('detection0', { qos: 0 });\r\n        });\r\n        this._client.on('reconnect', (error) => {\r\n            console.log('正在重连', error)\r\n        })\r\n        this._client.on(\"error\", (error) => {\r\n            console.log(\"Connection failed\", error);\r\n        });\r\n \r\n        //配置topic\r\n        const { topic, qos } = this.subscription;\r\n        this._client.subscribe(topic, { qos: qos }, (error, res) => {\r\n            if (error) {\r\n                console.log(\"Subscribe to topics error\", error);\r\n                return;\r\n            }\r\n            this.subscribeSuccess = true;\r\n            console.log(\"Subscribe to topics res\", res[0].qos, res[0].topic);\r\n        });\r\n        this.mqttClient = this._client;\r\n        return this.mqttClient;\r\n    }\r\n}\r\n \r\nexport default mqttHandle;"]}]}
\ No newline at end of file
diff --git a/node_modules/.cache/babel-loader/c68407018c895d09a6f7c25417def60b.json b/node_modules/.cache/babel-loader/c68407018c895d09a6f7c25417def60b.json
index 3e8433a1..4e9da8ce 100644
--- a/node_modules/.cache/babel-loader/c68407018c895d09a6f7c25417def60b.json
+++ b/node_modules/.cache/babel-loader/c68407018c895d09a6f7c25417def60b.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/web.dom.iterable\";\nimport \"core-js/modules/es6.function.name\";\nimport \"core-js/modules/es6.regexp.to-string\";\nimport _defineProperty from \"D:/Hjm\\u9879\\u76EE/TransFlow/node_modules/@babel/runtime/helpers/esm/defineProperty\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport editModal from \"@/views/bounced/maintenanceRemind\";\nimport { getGetShipjk, getDeleteShipjk, getApplication } from \"../api/index\";\nimport serverUrl from \"../config/apiurl.js\";\nimport axios from 'axios';\nexport default {\n  data: function data() {\n    var _ref;\n\n    return _ref = {\n      componentShow: \"\",\n      currentDate: new Date(),\n      closeStatus: null,\n      dialogFormVisible: false,\n      fileList: [// {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\n      ],\n      form: {\n        radio: '',\n        name: '',\n        city: '',\n        videoUrl: ''\n      },\n      formLabelWidth: '120px'\n    }, _defineProperty(_ref, \"formLabelWidth\", '200px'), _defineProperty(_ref, \"videoList\", [//     {\n      //     img:require('@/assets/img/AnalysisMain/img1.png'),\n      //     type:'实时视频',\n      //     title:'视频监控001'\n      // },{\n      //     img:require('@/assets/img/AnalysisMain/img2.png'),\n      //     type:'离线视频',\n      //     title:'视频监控002'\n      // },{\n      //     img:require('@/assets/img/AnalysisMain/img3.png'),\n      //     type:'实时视频',\n      //     title:'视频监控003'\n      // }\n    ]), _ref;\n  },\n  mounted: function mounted() {\n    console.log(\"dialogFormVisible\", this.dialogFormVisible);\n    this.getVideoList();\n  },\n  methods: {\n    informationInfo: function informationInfo(data, item) {\n      console.log(\"data\", data);\n\n      if (data == '新增') {\n        this.form = {\n          radio: '',\n          name: '',\n          city: '',\n          videoUrl: ''\n        }, this.dialogFormVisible = true;\n      }\n    },\n    open: function open(item) {\n      var _this = this;\n\n      console.log(\"item\", item);\n      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\n        confirmButtonText: '确定',\n        cancelButtonText: '取消',\n        type: 'warning'\n      }).then(function () {\n        getDeleteShipjk({\n          VideoId: item\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          _this.$message({\n            type: 'success',\n            message: '删除成功!'\n          });\n\n          _this.getVideoList();\n        });\n      }).catch(function () {\n        _this.$message({\n          type: 'info',\n          message: '已取消删除'\n        });\n      });\n    },\n    commit: function commit(form) {\n      var _this2 = this;\n\n      console.log(\"form\", form);\n      var formData = new FormData();\n      formData.append(\"VideoName\", form.videoName);\n      formData.append(\"VideoType\", form.videoType);\n      formData.append(\"VideoStreamAddress\", form.videoStreamAddress);\n      axios({\n        method: \"post\",\n        url: serverUrl.dataUrl,\n        data: formData\n      }).then(function (res) {\n        console.log(\"提交按钮\", res);\n\n        if (res.data.msg == '添加成功') {\n          _this2.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n\n          _this2.getVideoList();\n        } else {\n          _this2.$message({\n            message: res.data.msg,\n            type: 'warning'\n          });\n        }\n\n        _this2.dialogFormVisible = false;\n      });\n    },\n    handleFileChange: function handleFileChange(e) {\n      var inputDOM = this.$refs.inputer;\n      this.file = inputDOM.files[0]; // 通过DOM取文件数据\n    },\n    //应用\n    applicationBtn: function applicationBtn() {\n      var _this3 = this;\n\n      getApplication().then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this3.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n        }\n      });\n    },\n    S4: function S4() {\n      return ((1 + Math.random()) * 0x10000 | 0).toString(16).substring(1);\n    },\n    guid: function guid() {\n      return this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4();\n    },\n    load: function load() {\n      var _this4 = this;\n\n      var size = this.file.size; //文件大小\n\n      var maxZrea = 8; //设置每个分区大小 MB\n\n      var bufferSize = maxZrea * (1024 * 1024);\n      var fileStart = 0;\n      var fileEnd = bufferSize;\n      var arrFile = [];\n\n      while (fileStart < size) {\n        var fileInfo = {\n          File: this.file.slice(fileStart, fileEnd),\n          Start: fileStart,\n          End: fileEnd\n        };\n        arrFile.push(fileInfo);\n        fileStart = fileEnd;\n        fileEnd = fileStart + bufferSize;\n      }\n\n      var count = arrFile.length;\n      var filename = this.file.name + \"~\" + this.guid();\n\n      for (var i = 0; i < count; i++) {\n        var formData = new FormData(); //new一个formData事件\n\n        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\n\n        var url = serverUrl.getSpareElementOrder + \"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\n        console.log(\"url\", url); //               axios({\n        //     method: \"post\",\n        //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\n        //     headers: {\n        //                     \"Content-Type\": \"multipart/form-data;\",\n        //                 }\n        //   })\n\n        axios.post(url, formData, {\n          headers: {\n            \"Content-Type\": \"multipart/form-data;\"\n          }\n        }).then(function (r) {\n          console.log(\"r.data\", r.data);\n\n          if (r.data.code != 200) {\n            console.log(r.data);\n          } else {\n            _this4.$message({\n              message: r.data.msg,\n              type: 'success'\n            });\n          } //console.log(r.data.code);\n\n        }).catch(function (e) {\n          console.log(e);\n        });\n      }\n    },\n    goToPage: function goToPage(id, num) {\n      this.$router.push({\n        path: 'index',\n        query: {\n          id: id,\n          num: num\n        }\n      });\n    },\n    //获取视频数据\n    getVideoList: function getVideoList() {\n      var _this5 = this;\n\n      getGetShipjk().then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.msg == '成功') {\n          var arr = [];\n          res.data.data.forEach(function (item) {\n            arr.push({\n              id: item.videoId,\n              type: item.videoType,\n              title: item.videoName,\n              num: item.number,\n              img: require('@/assets/img/AnalysisMain/img1.png')\n            });\n          });\n          _this5.videoList = arr;\n          console.log(\"this.videoList\", _this5.videoList);\n        }\n      });\n    },\n    handleRemove: function handleRemove(file, fileList) {\n      console.log(file, fileList);\n    },\n    handlePreview: function handlePreview(file) {\n      console.log(file);\n    },\n    handleExceed: function handleExceed(files, fileList) {\n      this.$message.warning(\"\\u5F53\\u524D\\u9650\\u5236\\u9009\\u62E9 3 \\u4E2A\\u6587\\u4EF6\\uFF0C\\u672C\\u6B21\\u9009\\u62E9\\u4E86 \".concat(files.length, \" \\u4E2A\\u6587\\u4EF6\\uFF0C\\u5171\\u9009\\u62E9\\u4E86 \").concat(files.length + fileList.length, \" \\u4E2A\\u6587\\u4EF6\"));\n    },\n    beforeRemove: function beforeRemove(file, fileList) {\n      return this.$confirm(\"\\u786E\\u5B9A\\u79FB\\u9664 \".concat(file.name, \"\\uFF1F\"));\n    } //    onUpdateSubmit(data) {\n    //       if (data?.id) {\n    //         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\n    //       } else {\n    //         this.tableData.push({\n    //           id: Math.floor(Math.random() * 300),\n    //           name: data.name,\n    //           creator: 'dd',\n    //         })\n    //       }\n    //       this.dialogFormVisible = false;\n    //     },\n\n  },\n  components: {\n    editModal: editModal\n  }\n};",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">应用</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"],"sourceRoot":"src/views"}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/web.dom.iterable\";\nimport \"core-js/modules/es6.function.name\";\nimport \"core-js/modules/es6.regexp.to-string\";\nimport _defineProperty from \"D:/Hjm\\u9879\\u76EE/TransFlow/node_modules/@babel/runtime/helpers/esm/defineProperty\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport editModal from \"@/views/bounced/maintenanceRemind\";\nimport { getGetShipjk, getDeleteShipjk, getApplication } from \"../api/index\";\nimport serverUrl from \"../config/apiurl.js\";\nimport axios from 'axios';\nexport default {\n  data: function data() {\n    var _ref;\n\n    return _ref = {\n      componentShow: \"\",\n      currentDate: new Date(),\n      closeStatus: null,\n      dialogFormVisible: false,\n      fileList: [// {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\n      ],\n      form: {\n        radio: '',\n        name: '',\n        city: '',\n        videoUrl: ''\n      },\n      formLabelWidth: '120px'\n    }, _defineProperty(_ref, \"formLabelWidth\", '200px'), _defineProperty(_ref, \"videoList\", [//     {\n      //     img:require('@/assets/img/AnalysisMain/img1.png'),\n      //     type:'实时视频',\n      //     title:'视频监控001'\n      // },{\n      //     img:require('@/assets/img/AnalysisMain/img2.png'),\n      //     type:'离线视频',\n      //     title:'视频监控002'\n      // },{\n      //     img:require('@/assets/img/AnalysisMain/img3.png'),\n      //     type:'实时视频',\n      //     title:'视频监控003'\n      // }\n    ]), _ref;\n  },\n  mounted: function mounted() {\n    console.log(\"dialogFormVisible\", this.dialogFormVisible);\n    this.getVideoList();\n  },\n  methods: {\n    informationInfo: function informationInfo(data, item) {\n      console.log(\"data\", data);\n\n      if (data == '新增') {\n        this.form = {\n          radio: '',\n          name: '',\n          city: '',\n          videoUrl: ''\n        }, this.dialogFormVisible = true;\n      }\n    },\n    open: function open(item) {\n      var _this = this;\n\n      console.log(\"item\", item);\n      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\n        confirmButtonText: '确定',\n        cancelButtonText: '取消',\n        type: 'warning'\n      }).then(function () {\n        getDeleteShipjk({\n          VideoId: item\n        }).then(function (res) {\n          console.log(\"res\", res);\n\n          _this.$message({\n            type: 'success',\n            message: '删除成功!'\n          });\n\n          _this.getVideoList();\n        });\n      }).catch(function () {\n        _this.$message({\n          type: 'info',\n          message: '已取消删除'\n        });\n      });\n    },\n    commit: function commit(form) {\n      var _this2 = this;\n\n      console.log(\"form\", form);\n      var formData = new FormData();\n      formData.append(\"VideoName\", form.videoName);\n      formData.append(\"VideoType\", form.videoType);\n      formData.append(\"VideoStreamAddress\", form.videoStreamAddress);\n      axios({\n        method: \"post\",\n        url: serverUrl.dataUrl,\n        data: formData\n      }).then(function (res) {\n        console.log(\"提交按钮\", res);\n\n        if (res.data.msg == '添加成功') {\n          _this2.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n\n          _this2.getVideoList();\n        } else {\n          _this2.$message({\n            message: res.data.msg,\n            type: 'warning'\n          });\n        }\n\n        _this2.dialogFormVisible = false;\n      });\n    },\n    handleFileChange: function handleFileChange(e) {\n      var inputDOM = this.$refs.inputer;\n      this.file = inputDOM.files[0]; // 通过DOM取文件数据\n    },\n    //应用\n    applicationBtn: function applicationBtn() {\n      var _this3 = this;\n\n      getApplication().then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.code == 200) {\n          _this3.$message({\n            message: res.data.msg,\n            type: 'success'\n          });\n        }\n      });\n    },\n    S4: function S4() {\n      return ((1 + Math.random()) * 0x10000 | 0).toString(16).substring(1);\n    },\n    guid: function guid() {\n      return this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4();\n    },\n    load: function load() {\n      var _this4 = this;\n\n      var size = this.file.size; //文件大小\n\n      var maxZrea = 8; //设置每个分区大小 MB\n\n      var bufferSize = maxZrea * (1024 * 1024);\n      var fileStart = 0;\n      var fileEnd = bufferSize;\n      var arrFile = [];\n\n      while (fileStart < size) {\n        var fileInfo = {\n          File: this.file.slice(fileStart, fileEnd),\n          Start: fileStart,\n          End: fileEnd\n        };\n        arrFile.push(fileInfo);\n        fileStart = fileEnd;\n        fileEnd = fileStart + bufferSize;\n      }\n\n      var count = arrFile.length;\n      var filename = this.file.name + \"~\" + this.guid();\n\n      for (var i = 0; i < count; i++) {\n        var formData = new FormData(); //new一个formData事件\n\n        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\n\n        var url = serverUrl.getSpareElementOrder + \"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\n        console.log(\"url\", url); //               axios({\n        //     method: \"post\",\n        //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\n        //     headers: {\n        //                     \"Content-Type\": \"multipart/form-data;\",\n        //                 }\n        //   })\n\n        axios.post(url, formData, {\n          headers: {\n            \"Content-Type\": \"multipart/form-data;\"\n          }\n        }).then(function (r) {\n          console.log(\"r.data\", r.data);\n\n          if (r.data.code != 200) {\n            console.log(r.data);\n          } else {\n            _this4.$message({\n              message: r.data.msg,\n              type: 'success'\n            });\n          } //console.log(r.data.code);\n\n        }).catch(function (e) {\n          console.log(e);\n        });\n      }\n    },\n    goToPage: function goToPage(id, num) {\n      this.$router.push({\n        path: 'index',\n        query: {\n          id: id,\n          num: num\n        }\n      });\n    },\n    //获取视频数据\n    getVideoList: function getVideoList() {\n      var _this5 = this;\n\n      getGetShipjk().then(function (res) {\n        console.log(\"res\", res);\n\n        if (res.data.msg == '成功') {\n          var arr = [];\n          res.data.data.forEach(function (item) {\n            arr.push({\n              id: item.videoId,\n              type: item.videoType,\n              title: item.videoName,\n              num: item.number,\n              img: require('@/assets/img/AnalysisMain/img1.png')\n            });\n          });\n          _this5.videoList = arr;\n          console.log(\"this.videoList\", _this5.videoList);\n        }\n      });\n    },\n    handleRemove: function handleRemove(file, fileList) {\n      console.log(file, fileList);\n    },\n    handlePreview: function handlePreview(file) {\n      console.log(file);\n    },\n    handleExceed: function handleExceed(files, fileList) {\n      this.$message.warning(\"\\u5F53\\u524D\\u9650\\u5236\\u9009\\u62E9 3 \\u4E2A\\u6587\\u4EF6\\uFF0C\\u672C\\u6B21\\u9009\\u62E9\\u4E86 \".concat(files.length, \" \\u4E2A\\u6587\\u4EF6\\uFF0C\\u5171\\u9009\\u62E9\\u4E86 \").concat(files.length + fileList.length, \" \\u4E2A\\u6587\\u4EF6\"));\n    },\n    beforeRemove: function beforeRemove(file, fileList) {\n      return this.$confirm(\"\\u786E\\u5B9A\\u79FB\\u9664 \".concat(file.name, \"\\uFF1F\"));\n    } //    onUpdateSubmit(data) {\n    //       if (data?.id) {\n    //         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\n    //       } else {\n    //         this.tableData.push({\n    //           id: Math.floor(Math.random() * 300),\n    //           name: data.name,\n    //           creator: 'dd',\n    //         })\n    //       }\n    //       this.dialogFormVisible = false;\n    //     },\n\n  },\n  components: {\n    editModal: editModal\n  }\n};",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">启动程序</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"],"sourceRoot":"src/views"}]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/33c323b549383552a0b572c8c981b55b.json b/node_modules/.cache/vue-loader/33c323b549383552a0b572c8c981b55b.json
index aac4f87e..6eb22f60 100644
--- a/node_modules/.cache/vue-loader/33c323b549383552a0b572c8c981b55b.json
+++ b/node_modules/.cache/vue-loader/33c323b549383552a0b572c8c981b55b.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=style&index=0&lang=css&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\css-loader\\dist\\cjs.js","mtime":1672881375404},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n  .time {\n    font-size: 13px;\n    color: #999;\n  }\n  .bot{\n    padding: 14px;\n  }\n  .bottom {\n    margin-top: 13px;\n    line-height: 12px;\n    display: inline-block;\n    margin-left: 15px;\n  }\n\n  .button {\n    padding: 0;\n    float: right;\n  }\n\n  .image {\n    width: 100%;\n    display: block;\n    \n  }\n\n  .clearfix:before,\n  .clearfix:after {\n      display: table;\n      content: \"\";\n  }\n  \n  .clearfix:after {\n      clear: both\n  }\n  .middle{\n    width: 100%;\n    /* height: 100%; */\n    height: 284px;\n  }\n  .el-col-6 {\n    width: 25%;\n    padding-left: 20px;\n    padding-top: 20px;\n}\n.type{\n    position: absolute;\n    left: 0;\n    top:0px;\n}\n.del{\n    position: absolute;\n    right: 0px;\n    top:0px;\n    width: 25px;\n    height: 25px;\n    z-index: 9999;\n    /* background-color: #999 */\n}\n.card{\n    position: relative;\n    cursor: pointer;\n}\n.name{\n     position: absolute;\n    left: 7px;\n    top:0px;\n    z-index: 99;\n}\n.el_dialog {\n        position: fixed;\n        width: 100%;\n        height: 100%;\n        background-color: rgba(0, 0, 0, 0.5);\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        margin: 0;\n        padding: 0;\n    }\n    .el_dialog__content {\n        width: v-bind(width1);\n        height: 400px;\n        background-color: white;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n    }\n  \n#dialog .el-dialog__header {\n  border-bottom: 1px solid #eee;\n}\n \n\n#dialog .el-dialog__title {\n  font-weight: bold;\n  color: #000;\n}\n.btn{\n    position: absolute;\n    right: 10%;\n    bottom: 18%;\n}\n",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwVA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"AnalysisMain.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">应用</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"]}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=style&index=0&lang=css&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\css-loader\\dist\\cjs.js","mtime":1672881375404},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n  .time {\n    font-size: 13px;\n    color: #999;\n  }\n  .bot{\n    padding: 14px;\n  }\n  .bottom {\n    margin-top: 13px;\n    line-height: 12px;\n    display: inline-block;\n    margin-left: 15px;\n  }\n\n  .button {\n    padding: 0;\n    float: right;\n  }\n\n  .image {\n    width: 100%;\n    display: block;\n    \n  }\n\n  .clearfix:before,\n  .clearfix:after {\n      display: table;\n      content: \"\";\n  }\n  \n  .clearfix:after {\n      clear: both\n  }\n  .middle{\n    width: 100%;\n    /* height: 100%; */\n    height: 284px;\n  }\n  .el-col-6 {\n    width: 25%;\n    padding-left: 20px;\n    padding-top: 20px;\n}\n.type{\n    position: absolute;\n    left: 0;\n    top:0px;\n}\n.del{\n    position: absolute;\n    right: 0px;\n    top:0px;\n    width: 25px;\n    height: 25px;\n    z-index: 9999;\n    /* background-color: #999 */\n}\n.card{\n    position: relative;\n    cursor: pointer;\n}\n.name{\n     position: absolute;\n    left: 7px;\n    top:0px;\n    z-index: 99;\n}\n.el_dialog {\n        position: fixed;\n        width: 100%;\n        height: 100%;\n        background-color: rgba(0, 0, 0, 0.5);\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        margin: 0;\n        padding: 0;\n    }\n    .el_dialog__content {\n        width: v-bind(width1);\n        height: 400px;\n        background-color: white;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n    }\n  \n#dialog .el-dialog__header {\n  border-bottom: 1px solid #eee;\n}\n \n\n#dialog .el-dialog__title {\n  font-weight: bold;\n  color: #000;\n}\n.btn{\n    position: absolute;\n    right: 10%;\n    bottom: 18%;\n}\n",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwVA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"AnalysisMain.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">启动程序</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"]}]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/3b9c80a44388e0b776cbdf2e1b587b0f.json b/node_modules/.cache/vue-loader/3b9c80a44388e0b776cbdf2e1b587b0f.json
index 70f7e092..3a8f238b 100644
--- a/node_modules/.cache/vue-loader/3b9c80a44388e0b776cbdf2e1b587b0f.json
+++ b/node_modules/.cache/vue-loader/3b9c80a44388e0b776cbdf2e1b587b0f.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=template&id=689d6d6f&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { staticClass: \"content-box\" }, [\n    _c(\n      \"div\",\n      [\n        _c(\n          \"el-row\",\n          [\n            _vm._l(_vm.videoList, function(item, index) {\n              return _c(\n                \"el-col\",\n                { key: item, attrs: { span: 6, offset: index > 0 ? 0 : 0 } },\n                [\n                  _c(\n                    \"el-card\",\n                    {\n                      staticClass: \"card\",\n                      attrs: { \"body-style\": { padding: \"0px\" } }\n                    },\n                    [\n                      _c(\"div\", { staticClass: \"type\" }, [\n                        item.type == \"实时视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/leftTop.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e(),\n                        item.type == \"离线视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/leftTop2.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e()\n                      ]),\n                      _c(\"div\", { staticClass: \"name\" }, [\n                        item.type == \"实时视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/ssVideo.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e(),\n                        item.type == \"离线视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/lxVideo.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e()\n                      ]),\n                      _c(\n                        \"div\",\n                        {\n                          staticClass: \"del\",\n                          on: {\n                            click: function($event) {\n                              return _vm.open(item.id)\n                            }\n                          }\n                        },\n                        [_c(\"i\", { staticClass: \"el-icon-delete\" })]\n                      ),\n                      _c(\"img\", {\n                        staticClass: \"image\",\n                        attrs: { src: item.img },\n                        on: {\n                          click: function($event) {\n                            return _vm.goToPage(item.id, item.num)\n                          }\n                        }\n                      }),\n                      _c(\"div\", { staticClass: \"bot\" }, [\n                        _c(\n                          \"span\",\n                          { staticStyle: { \"vertical-align\": \"middle\" } },\n                          [\n                            _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/video (1).png\"),\n                                alt: \"\"\n                              }\n                            })\n                          ]\n                        ),\n                        _c(\"div\", { staticClass: \"bottom clearfix\" }, [\n                          _c(\"time\", { staticClass: \"time\" }, [\n                            _vm._v(_vm._s(item.title))\n                          ])\n                        ])\n                      ])\n                    ]\n                  )\n                ],\n                1\n              )\n            }),\n            _c(\n              \"el-col\",\n              { attrs: { span: 6 } },\n              [\n                _c(\"el-card\", { attrs: { \"body-style\": { padding: \"0px\" } } }, [\n                  _c(\"div\", { staticClass: \"middle\" }, [\n                    _c(\n                      \"div\",\n                      {\n                        staticStyle: {\n                          width: \"50%\",\n                          height: \"100%\",\n                          margin: \"auto\",\n                          \"padding-top\": \"15%\",\n                          cursor: \"pointer\",\n                          \"text-align\": \"center\"\n                        },\n                        on: {\n                          click: function($event) {\n                            return _vm.informationInfo(\"新增\")\n                          }\n                        }\n                      },\n                      [\n                        _c(\"img\", {\n                          attrs: {\n                            src: require(\"@/assets/img/AnalysisMain/add.png\"),\n                            width: \"80%\"\n                          }\n                        })\n                      ]\n                    )\n                  ])\n                ])\n              ],\n              1\n            )\n          ],\n          2\n        ),\n        _c(\n          \"div\",\n          { staticClass: \"btn\" },\n          [\n            _c(\n              \"el-button\",\n              { attrs: { type: \"primary\" }, on: { click: _vm.applicationBtn } },\n              [_vm._v(\"应用\")]\n            )\n          ],\n          1\n        )\n      ],\n      1\n    ),\n    _c(\n      \"div\",\n      { staticClass: \"margin-top: 0px !important;\", attrs: { id: \"dialog\" } },\n      [\n        _c(\n          \"el-dialog\",\n          {\n            attrs: {\n              title: \"视频源配置\",\n              width: \"40%\",\n              visible: _vm.dialogFormVisible\n            },\n            on: {\n              \"update:visible\": function($event) {\n                _vm.dialogFormVisible = $event\n              }\n            }\n          },\n          [\n            _c(\n              \"el-form\",\n              { attrs: { model: _vm.form } },\n              [\n                _c(\n                  \"el-form-item\",\n                  {\n                    attrs: {\n                      label: \"视频源名称\",\n                      \"label-width\": _vm.formLabelWidth\n                    }\n                  },\n                  [\n                    _c(\"el-input\", {\n                      staticStyle: { width: \"50%\" },\n                      attrs: { autocomplete: \"off\" },\n                      model: {\n                        value: _vm.form.videoName,\n                        callback: function($$v) {\n                          _vm.$set(_vm.form, \"videoName\", $$v)\n                        },\n                        expression: \"form.videoName\"\n                      }\n                    })\n                  ],\n                  1\n                ),\n                _c(\n                  \"el-form-item\",\n                  {\n                    attrs: {\n                      label: \"视频源类型\",\n                      \"label-width\": _vm.formLabelWidth\n                    }\n                  },\n                  [\n                    _c(\n                      \"el-radio-group\",\n                      {\n                        model: {\n                          value: _vm.form.videoType,\n                          callback: function($$v) {\n                            _vm.$set(_vm.form, \"videoType\", $$v)\n                          },\n                          expression: \"form.videoType\"\n                        }\n                      },\n                      [\n                        _c(\"el-radio\", { attrs: { label: \"实时视频\" } }),\n                        _c(\"el-radio\", { attrs: { label: \"离线视频\" } })\n                      ],\n                      1\n                    )\n                  ],\n                  1\n                ),\n                _vm.form.videoType == \"实时视频\"\n                  ? _c(\n                      \"el-form-item\",\n                      {\n                        attrs: {\n                          label: \"视频源地址\",\n                          \"label-width\": _vm.formLabelWidth\n                        }\n                      },\n                      [\n                        _c(\"el-input\", {\n                          staticStyle: { width: \"80%\" },\n                          attrs: { autocomplete: \"off\" },\n                          model: {\n                            value: _vm.form.videoStreamAddress,\n                            callback: function($$v) {\n                              _vm.$set(_vm.form, \"videoStreamAddress\", $$v)\n                            },\n                            expression: \"form.videoStreamAddress\"\n                          }\n                        })\n                      ],\n                      1\n                    )\n                  : _vm._e(),\n                _vm.form.videoType == \"离线视频\"\n                  ? _c(\n                      \"el-form-item\",\n                      {\n                        attrs: {\n                          label: \"离线视频上传\",\n                          \"label-width\": _vm.formLabelWidth\n                        }\n                      },\n                      [\n                        _c(\"input\", {\n                          ref: \"inputer\",\n                          attrs: { type: \"file\", id: \"fileExport\" },\n                          on: { change: _vm.handleFileChange }\n                        }),\n                        _c(\n                          \"el-button\",\n                          {\n                            attrs: { size: \"small\", type: \"primary\" },\n                            on: { click: _vm.load }\n                          },\n                          [_vm._v(\"点击上传\")]\n                        )\n                      ],\n                      1\n                    )\n                  : _vm._e()\n              ],\n              1\n            ),\n            _c(\n              \"div\",\n              {\n                staticClass: \"dialog-footer\",\n                attrs: { slot: \"footer\" },\n                slot: \"footer\"\n              },\n              [\n                _c(\n                  \"el-button\",\n                  {\n                    on: {\n                      click: function($event) {\n                        _vm.dialogFormVisible = false\n                      }\n                    }\n                  },\n                  [_vm._v(\"取 消\")]\n                ),\n                _c(\n                  \"el-button\",\n                  {\n                    attrs: { type: \"primary\" },\n                    on: {\n                      click: function($event) {\n                        return _vm.commit(_vm.form)\n                      }\n                    }\n                  },\n                  [_vm._v(\"确 定\")]\n                )\n              ],\n              1\n            )\n          ],\n          1\n        )\n      ],\n      1\n    )\n  ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }"]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=template&id=689d6d6f&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { staticClass: \"content-box\" }, [\n    _c(\n      \"div\",\n      [\n        _c(\n          \"el-row\",\n          [\n            _vm._l(_vm.videoList, function(item, index) {\n              return _c(\n                \"el-col\",\n                { key: item, attrs: { span: 6, offset: index > 0 ? 0 : 0 } },\n                [\n                  _c(\n                    \"el-card\",\n                    {\n                      staticClass: \"card\",\n                      attrs: { \"body-style\": { padding: \"0px\" } }\n                    },\n                    [\n                      _c(\"div\", { staticClass: \"type\" }, [\n                        item.type == \"实时视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/leftTop.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e(),\n                        item.type == \"离线视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/leftTop2.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e()\n                      ]),\n                      _c(\"div\", { staticClass: \"name\" }, [\n                        item.type == \"实时视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/ssVideo.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e(),\n                        item.type == \"离线视频\"\n                          ? _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/lxVideo.png\"),\n                                alt: \"\"\n                              }\n                            })\n                          : _vm._e()\n                      ]),\n                      _c(\n                        \"div\",\n                        {\n                          staticClass: \"del\",\n                          on: {\n                            click: function($event) {\n                              return _vm.open(item.id)\n                            }\n                          }\n                        },\n                        [_c(\"i\", { staticClass: \"el-icon-delete\" })]\n                      ),\n                      _c(\"img\", {\n                        staticClass: \"image\",\n                        attrs: { src: item.img },\n                        on: {\n                          click: function($event) {\n                            return _vm.goToPage(item.id, item.num)\n                          }\n                        }\n                      }),\n                      _c(\"div\", { staticClass: \"bot\" }, [\n                        _c(\n                          \"span\",\n                          { staticStyle: { \"vertical-align\": \"middle\" } },\n                          [\n                            _c(\"img\", {\n                              attrs: {\n                                src: require(\"@/assets/img/AnalysisMain/video (1).png\"),\n                                alt: \"\"\n                              }\n                            })\n                          ]\n                        ),\n                        _c(\"div\", { staticClass: \"bottom clearfix\" }, [\n                          _c(\"time\", { staticClass: \"time\" }, [\n                            _vm._v(_vm._s(item.title))\n                          ])\n                        ])\n                      ])\n                    ]\n                  )\n                ],\n                1\n              )\n            }),\n            _c(\n              \"el-col\",\n              { attrs: { span: 6 } },\n              [\n                _c(\"el-card\", { attrs: { \"body-style\": { padding: \"0px\" } } }, [\n                  _c(\"div\", { staticClass: \"middle\" }, [\n                    _c(\n                      \"div\",\n                      {\n                        staticStyle: {\n                          width: \"50%\",\n                          height: \"100%\",\n                          margin: \"auto\",\n                          \"padding-top\": \"15%\",\n                          cursor: \"pointer\",\n                          \"text-align\": \"center\"\n                        },\n                        on: {\n                          click: function($event) {\n                            return _vm.informationInfo(\"新增\")\n                          }\n                        }\n                      },\n                      [\n                        _c(\"img\", {\n                          attrs: {\n                            src: require(\"@/assets/img/AnalysisMain/add.png\"),\n                            width: \"80%\"\n                          }\n                        })\n                      ]\n                    )\n                  ])\n                ])\n              ],\n              1\n            )\n          ],\n          2\n        ),\n        _c(\n          \"div\",\n          { staticClass: \"btn\" },\n          [\n            _c(\n              \"el-button\",\n              { attrs: { type: \"primary\" }, on: { click: _vm.applicationBtn } },\n              [_vm._v(\"启动程序\")]\n            )\n          ],\n          1\n        )\n      ],\n      1\n    ),\n    _c(\n      \"div\",\n      { staticClass: \"margin-top: 0px !important;\", attrs: { id: \"dialog\" } },\n      [\n        _c(\n          \"el-dialog\",\n          {\n            attrs: {\n              title: \"视频源配置\",\n              width: \"40%\",\n              visible: _vm.dialogFormVisible\n            },\n            on: {\n              \"update:visible\": function($event) {\n                _vm.dialogFormVisible = $event\n              }\n            }\n          },\n          [\n            _c(\n              \"el-form\",\n              { attrs: { model: _vm.form } },\n              [\n                _c(\n                  \"el-form-item\",\n                  {\n                    attrs: {\n                      label: \"视频源名称\",\n                      \"label-width\": _vm.formLabelWidth\n                    }\n                  },\n                  [\n                    _c(\"el-input\", {\n                      staticStyle: { width: \"50%\" },\n                      attrs: { autocomplete: \"off\" },\n                      model: {\n                        value: _vm.form.videoName,\n                        callback: function($$v) {\n                          _vm.$set(_vm.form, \"videoName\", $$v)\n                        },\n                        expression: \"form.videoName\"\n                      }\n                    })\n                  ],\n                  1\n                ),\n                _c(\n                  \"el-form-item\",\n                  {\n                    attrs: {\n                      label: \"视频源类型\",\n                      \"label-width\": _vm.formLabelWidth\n                    }\n                  },\n                  [\n                    _c(\n                      \"el-radio-group\",\n                      {\n                        model: {\n                          value: _vm.form.videoType,\n                          callback: function($$v) {\n                            _vm.$set(_vm.form, \"videoType\", $$v)\n                          },\n                          expression: \"form.videoType\"\n                        }\n                      },\n                      [\n                        _c(\"el-radio\", { attrs: { label: \"实时视频\" } }),\n                        _c(\"el-radio\", { attrs: { label: \"离线视频\" } })\n                      ],\n                      1\n                    )\n                  ],\n                  1\n                ),\n                _vm.form.videoType == \"实时视频\"\n                  ? _c(\n                      \"el-form-item\",\n                      {\n                        attrs: {\n                          label: \"视频源地址\",\n                          \"label-width\": _vm.formLabelWidth\n                        }\n                      },\n                      [\n                        _c(\"el-input\", {\n                          staticStyle: { width: \"80%\" },\n                          attrs: { autocomplete: \"off\" },\n                          model: {\n                            value: _vm.form.videoStreamAddress,\n                            callback: function($$v) {\n                              _vm.$set(_vm.form, \"videoStreamAddress\", $$v)\n                            },\n                            expression: \"form.videoStreamAddress\"\n                          }\n                        })\n                      ],\n                      1\n                    )\n                  : _vm._e(),\n                _vm.form.videoType == \"离线视频\"\n                  ? _c(\n                      \"el-form-item\",\n                      {\n                        attrs: {\n                          label: \"离线视频上传\",\n                          \"label-width\": _vm.formLabelWidth\n                        }\n                      },\n                      [\n                        _c(\"input\", {\n                          ref: \"inputer\",\n                          attrs: { type: \"file\", id: \"fileExport\" },\n                          on: { change: _vm.handleFileChange }\n                        }),\n                        _c(\n                          \"el-button\",\n                          {\n                            attrs: { size: \"small\", type: \"primary\" },\n                            on: { click: _vm.load }\n                          },\n                          [_vm._v(\"点击上传\")]\n                        )\n                      ],\n                      1\n                    )\n                  : _vm._e()\n              ],\n              1\n            ),\n            _c(\n              \"div\",\n              {\n                staticClass: \"dialog-footer\",\n                attrs: { slot: \"footer\" },\n                slot: \"footer\"\n              },\n              [\n                _c(\n                  \"el-button\",\n                  {\n                    on: {\n                      click: function($event) {\n                        _vm.dialogFormVisible = false\n                      }\n                    }\n                  },\n                  [_vm._v(\"取 消\")]\n                ),\n                _c(\n                  \"el-button\",\n                  {\n                    attrs: { type: \"primary\" },\n                    on: {\n                      click: function($event) {\n                        return _vm.commit(_vm.form)\n                      }\n                    }\n                  },\n                  [_vm._v(\"确 定\")]\n                )\n              ],\n              1\n            )\n          ],\n          1\n        )\n      ],\n      1\n    )\n  ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }"]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/3d0a2c1387bac21e30b6ca30e73d6d81.json b/node_modules/.cache/vue-loader/3d0a2c1387bac21e30b6ca30e73d6d81.json
index 9c954ba4..4002027e 100644
--- a/node_modules/.cache/vue-loader/3d0a2c1387bac21e30b6ca30e73d6d81.json
+++ b/node_modules/.cache/vue-loader/3d0a2c1387bac21e30b6ca30e73d6d81.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=template&id=a83bd3b0&scoped=true&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n  <div class=\"content-box\">\n\n    <!-- <div class=\"container\"> -->\n    <div >\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\n            <div class=\"mapModuleApp\">\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \n          ref=\"iframe\"></iframe> -->\n                </div>\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\n\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\n\n          </div> -->\n     \n        </el-tab-pane>\n        <el-tab-pane label=\"数据看板\" name=\"second\">\n          <dataBoard :activeName=\"activeName\"></dataBoard>\n        </el-tab-pane>\n        <el-tab-pane label=\"分析配置\" name=\"third\">\n          <analysisConfiguration></analysisConfiguration>\n        </el-tab-pane>\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\n          <editModal></editModal>\n        </el-tab-pane>\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\n      </el-tabs>\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\n  </div>  \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\n  </div>  -->\n\n    </div>\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\n          <el-form-item label=\"组件名称\">\n            <el-input v-model=\"form.name\"></el-input>\n          </el-form-item>\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\n              <el-option label=\"正向\" value=\"正向\"></el-option>\n              <el-option label=\"反向\" value=\"反向\"></el-option>\n              <el-option label=\"双向\" value=\"双向\"></el-option>\n            </el-select>\n          </el-form-item>\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\n          </el-form-item>\n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n        \n      </el-dialog> -->\n      <el-drawer\n      class=\"new-dialog\"\n  :visible.sync=\"dialogFormVisible\"\n  direction=\"btt\"\n  custom-class=\"demo-drawer\"\n  ref=\"drawer\"\n  :modal=\"false\" \n :close-on-click-modal=\"false\"\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \n  :wrapperClosable=\"false\" \n  :with-header=\"false\"\n  >\n      <div class=\"formBox\">\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\n          <el-form-item label=\"组件名称\">\n            <el-input v-model=\"form.name\"></el-input>\n          </el-form-item>\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\n              <el-option label=\"正向\" value=\"正向\"></el-option>\n              <el-option label=\"反向\" value=\"反向\"></el-option>\n              <el-option label=\"双向\" value=\"双向\"></el-option>\n            </el-select>\n          </el-form-item>\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\n          </el-form-item> -->\n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n        </div> \n     \n       \n</el-drawer>\n      <!-- 组件弹框 -->\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\n          <el-form-item label=\"名称：\">\n            <el-input v-model=\"componentForm.componentName\"></el-input>\n          </el-form-item>\n          \n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\n          </el-form-item>\n          <el-form-item label=\"时间模式：\">\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\n              <el-option label=\"触发\" value=\"touch\"></el-option>\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\n            </el-select>\n          </el-form-item>\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\n          <el-radio-group v-model=\"componentForm.touchType\" >\n            <el-radio label=\"实时（触发）\"></el-radio>\n            <el-radio label=\"间隔\"></el-radio>\n          </el-radio-group>\n        </el-form-item> -->\n        <el-form-item label=\"周期间隔：\">\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\n            </el-slider> -->\n            <el-slider v-model=\"componentForm.cycleInterval\">\n            </el-slider>\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\n              <el-option label=\"小时\" value=\"hh\"></el-option>\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\n              <el-option\n\t\t\t   v-for=\"item in timeSelect\"\n\t\t\t   :key=\"item.value\"\n\t\t\t   :label=\"item.label\"\n\t\t\t   :value=\"item.value\"\n\t\t\t ></el-option>\n            </el-select>\n        </el-form-item>\n        <!-- <el-form-item label=\"单位：\" >\n         \n        </el-form-item> -->\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\n             \n            </el-checkbox-group>\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group> -->\n          </el-form-item>\n          \n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n      </el-dialog>\n    \n      \n    <!-- </div> -->\n  </div>\n",null]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=template&id=a83bd3b0&scoped=true&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n  <div class=\"content-box\">\n\n    <!-- <div class=\"container\"> -->\n    <div >\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\n            <div class=\"mapModuleApp\">\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \n          ref=\"iframe\"></iframe> -->\n                </div>\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\n\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\n\n          </div> -->\n     \n        </el-tab-pane>\n        <el-tab-pane label=\"数据看板\" name=\"second\">\n          <dataBoard :activeName=\"activeName\"></dataBoard>\n        </el-tab-pane>\n        <el-tab-pane label=\"分析配置\" name=\"third\">\n          <analysisConfiguration></analysisConfiguration>\n        </el-tab-pane>\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\n          <editModal></editModal>\n        </el-tab-pane>\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\n      </el-tabs>\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\n  </div>  \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\n  </div> \n  <div style=\"width:30%;height:300px;display:inline-block\">\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\n  </div>  -->\n\n    </div>\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\n          <el-form-item label=\"组件名称\">\n            <el-input v-model=\"form.name\"></el-input>\n          </el-form-item>\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\n              <el-option label=\"正向\" value=\"正向\"></el-option>\n              <el-option label=\"反向\" value=\"反向\"></el-option>\n              <el-option label=\"双向\" value=\"双向\"></el-option>\n            </el-select>\n          </el-form-item>\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\n          </el-form-item>\n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n        \n      </el-dialog> -->\n      <el-drawer\n      class=\"new-dialog\"\n  :visible.sync=\"dialogFormVisible\"\n  direction=\"btt\"\n  custom-class=\"demo-drawer\"\n  ref=\"drawer\"\n  :modal=\"false\" \n :close-on-click-modal=\"false\"\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \n  :wrapperClosable=\"false\" \n  :with-header=\"false\"\n  >\n      <div class=\"formBox\">\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\n          <el-form-item label=\"组件名称\">\n            <el-input v-model=\"form.name\"></el-input>\n          </el-form-item>\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\n              <el-option label=\"正向\" value=\"正向\"></el-option>\n              <el-option label=\"反向\" value=\"反向\"></el-option>\n              <el-option label=\"双向\" value=\"双向\"></el-option>\n            </el-select>\n          </el-form-item>\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\n          </el-form-item> -->\n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n        </div> \n     \n       \n</el-drawer>\n      <!-- 组件弹框 -->\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\n          <el-form-item label=\"名称：\">\n            <el-input v-model=\"componentForm.componentName\"></el-input>\n          </el-form-item>\n          \n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\n          </el-form-item>\n          <el-form-item label=\"时间模式：\">\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\n              <el-option label=\"触发\" value=\"touch\"></el-option>\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\n            </el-select>\n          </el-form-item>\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\n          <el-radio-group v-model=\"componentForm.touchType\" >\n            <el-radio label=\"实时（触发）\"></el-radio>\n            <el-radio label=\"间隔\"></el-radio>\n          </el-radio-group>\n        </el-form-item> -->\n        <el-form-item label=\"周期间隔：\">\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\n            </el-slider> -->\n            <el-slider v-model=\"componentForm.cycleInterval\">\n            </el-slider>\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\n              <el-option label=\"小时\" value=\"hh\"></el-option>\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\n              <el-option\n\t\t\t   v-for=\"item in timeSelect\"\n\t\t\t   :key=\"item.value\"\n\t\t\t   :label=\"item.label\"\n\t\t\t   :value=\"item.value\"\n\t\t\t ></el-option>\n            </el-select>\n        </el-form-item>\n        <!-- <el-form-item label=\"单位：\" >\n         \n        </el-form-item> -->\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group>\n          </el-form-item>\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\n             \n            </el-checkbox-group>\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\n            </el-checkbox-group> -->\n          </el-form-item>\n          \n          <el-form-item>\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\n          </el-form-item>\n        </el-form>\n      </el-dialog>\n    \n      \n    <!-- </div> -->\n  </div>\n",null]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/5918767756314b9da9439e5cbe08acbc.json b/node_modules/.cache/vue-loader/5918767756314b9da9439e5cbe08acbc.json
index 60194d3c..4cf3dbf9 100644
--- a/node_modules/.cache/vue-loader/5918767756314b9da9439e5cbe08acbc.json
+++ b/node_modules/.cache/vue-loader/5918767756314b9da9439e5cbe08acbc.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import { render, staticRenderFns } from \"./index.vue?vue&type=template&id=a83bd3b0&scoped=true&\"\nimport script from \"./index.vue?vue&type=script&lang=js&\"\nexport * from \"./index.vue?vue&type=script&lang=js&\"\nimport style0 from \"./index.vue?vue&type=style&index=0&id=a83bd3b0&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"a83bd3b0\",\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"D:\\\\Hjm项目\\\\TransFlow\\\\node_modules\\\\vue-hot-reload-api\\\\dist\\\\index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('a83bd3b0')) {\n      api.createRecord('a83bd3b0', component.options)\n    } else {\n      api.reload('a83bd3b0', component.options)\n    }\n    module.hot.accept(\"./index.vue?vue&type=template&id=a83bd3b0&scoped=true&\", function () {\n      api.rerender('a83bd3b0', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"src/views/index.vue\"\nexport default component.exports"]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import { render, staticRenderFns } from \"./index.vue?vue&type=template&id=a83bd3b0&scoped=true&\"\nimport script from \"./index.vue?vue&type=script&lang=js&\"\nexport * from \"./index.vue?vue&type=script&lang=js&\"\nimport style0 from \"./index.vue?vue&type=style&index=0&id=a83bd3b0&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"a83bd3b0\",\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"D:\\\\Hjm项目\\\\TransFlow\\\\node_modules\\\\vue-hot-reload-api\\\\dist\\\\index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('a83bd3b0')) {\n      api.createRecord('a83bd3b0', component.options)\n    } else {\n      api.reload('a83bd3b0', component.options)\n    }\n    module.hot.accept(\"./index.vue?vue&type=template&id=a83bd3b0&scoped=true&\", function () {\n      api.rerender('a83bd3b0', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"src/views/index.vue\"\nexport default component.exports"]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/99b9c8f4987602d48d938b4215615f7a.json b/node_modules/.cache/vue-loader/99b9c8f4987602d48d938b4215615f7a.json
index c03cc456..c4a3b431 100644
--- a/node_modules/.cache/vue-loader/99b9c8f4987602d48d938b4215615f7a.json
+++ b/node_modules/.cache/vue-loader/99b9c8f4987602d48d938b4215615f7a.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=template&id=689d6d6f&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">应用</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n",null]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=template&id=689d6d6f&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">启动程序</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n",null]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/a9490cc6b8de8e35e92e7b24b8893eed.json b/node_modules/.cache/vue-loader/a9490cc6b8de8e35e92e7b24b8893eed.json
index 24b39006..760bab22 100644
--- a/node_modules/.cache/vue-loader/a9490cc6b8de8e35e92e7b24b8893eed.json
+++ b/node_modules/.cache/vue-loader/a9490cc6b8de8e35e92e7b24b8893eed.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=template&id=a83bd3b0&scoped=true&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    { staticClass: \"content-box\" },\n    [\n      _c(\n        \"div\",\n        [\n          _c(\n            \"el-tabs\",\n            {\n              attrs: { type: \"border-card\" },\n              model: {\n                value: _vm.activeName,\n                callback: function($$v) {\n                  _vm.activeName = $$v\n                },\n                expression: \"activeName\"\n              }\n            },\n            [\n              _c(\"el-tab-pane\", { attrs: { label: \"xx路口\", name: \"first\" } }, [\n                _c(\"div\", { staticClass: \"mapModuleApp\" }, [\n                  _c(\"iframe\", {\n                    staticStyle: { width: \"100%\", height: \"100%\" },\n                    attrs: {\n                      id: \"mapModule\",\n                      src: \"./VideoWeb/index.html\",\n                      frameborder: \"0\",\n                      scrolling: \"no\"\n                    }\n                  })\n                ])\n              ]),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"数据看板\", name: \"second\" } },\n                [_c(\"dataBoard\", { attrs: { activeName: _vm.activeName } })],\n                1\n              ),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"分析配置\", name: \"third\" } },\n                [_c(\"analysisConfiguration\")],\n                1\n              ),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"分析状态\", name: \"fourth\" } },\n                [_c(\"editModal\")],\n                1\n              ),\n              _c(\"el-tab-pane\", { attrs: { label: \"存储\", name: \"five\" } }, [\n                _vm._v(\"存储\")\n              ])\n            ],\n            1\n          )\n        ],\n        1\n      ),\n      _c(\n        \"el-drawer\",\n        {\n          directives: [\n            {\n              name: \"alterELDialogMarginTop\",\n              rawName: \"v-alterELDialogMarginTop\",\n              value: { marginTop: \"0vh\" },\n              expression: \"{marginTop:'0vh'}\"\n            }\n          ],\n          ref: \"drawer\",\n          staticClass: \"new-dialog\",\n          attrs: {\n            visible: _vm.dialogFormVisible,\n            direction: \"btt\",\n            \"custom-class\": \"demo-drawer\",\n            modal: false,\n            \"close-on-click-modal\": false,\n            customClass: \"customWidth\",\n            width: \"100%\",\n            wrapperClosable: false,\n            \"with-header\": false\n          },\n          on: {\n            \"update:visible\": function($event) {\n              _vm.dialogFormVisible = $event\n            }\n          }\n        },\n        [\n          _c(\n            \"div\",\n            { staticClass: \"formBox\" },\n            [\n              _c(\n                \"el-form\",\n                {\n                  ref: \"form\",\n                  attrs: {\n                    model: _vm.form,\n                    \"label-width\": \"80px\",\n                    inline: true\n                  }\n                },\n                [\n                  _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"组件名称\" } },\n                    [\n                      _c(\"el-input\", {\n                        model: {\n                          value: _vm.form.name,\n                          callback: function($$v) {\n                            _vm.$set(_vm.form, \"name\", $$v)\n                          },\n                          expression: \"form.name\"\n                        }\n                      })\n                    ],\n                    1\n                  ),\n                  _vm.form.type == \"断面\"\n                    ? _c(\n                        \"el-form-item\",\n                        { attrs: { label: \"断面方向\" } },\n                        [\n                          _c(\n                            \"el-select\",\n                            {\n                              attrs: { placeholder: \"请选择类型\" },\n                              model: {\n                                value: _vm.form.Direction,\n                                callback: function($$v) {\n                                  _vm.$set(_vm.form, \"Direction\", $$v)\n                                },\n                                expression: \"form.Direction\"\n                              }\n                            },\n                            [\n                              _c(\"el-option\", {\n                                attrs: { label: \"正向\", value: \"正向\" }\n                              }),\n                              _c(\"el-option\", {\n                                attrs: { label: \"反向\", value: \"反向\" }\n                              }),\n                              _c(\"el-option\", {\n                                attrs: { label: \"双向\", value: \"双向\" }\n                              })\n                            ],\n                            1\n                          )\n                        ],\n                        1\n                      )\n                    : _vm._e(),\n                  _c(\n                    \"el-form-item\",\n                    [\n                      _c(\n                        \"el-button\",\n                        {\n                          attrs: { type: \"primary\" },\n                          on: {\n                            click: function($event) {\n                              return _vm.onSubmit(_vm.form)\n                            }\n                          }\n                        },\n                        [_vm._v(\"确认\")]\n                      ),\n                      _c(\n                        \"el-button\",\n                        {\n                          on: {\n                            click: function($event) {\n                              return _vm.closeFigure(_vm.form)\n                            }\n                          }\n                        },\n                        [_vm._v(\"取消\")]\n                      )\n                    ],\n                    1\n                  )\n                ],\n                1\n              )\n            ],\n            1\n          )\n        ]\n      ),\n      _c(\n        \"el-dialog\",\n        {\n          attrs: {\n            title: _vm.componentTitle + \"指标组件\",\n            width: \"40%\",\n            visible: _vm.component\n          },\n          on: {\n            \"update:visible\": function($event) {\n              _vm.component = $event\n            }\n          }\n        },\n        [\n          _c(\n            \"el-form\",\n            {\n              ref: \"form\",\n              attrs: { model: _vm.componentForm, \"label-width\": \"150px\" },\n              on: {\n                close: function($event) {\n                  return _vm.closeComponentForm()\n                }\n              }\n            },\n            [\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"名称：\" } },\n                [\n                  _c(\"el-input\", {\n                    model: {\n                      value: _vm.componentForm.componentName,\n                      callback: function($$v) {\n                        _vm.$set(_vm.componentForm, \"componentName\", $$v)\n                      },\n                      expression: \"componentForm.componentName\"\n                    }\n                  })\n                ],\n                1\n              ),\n              _vm.componentForm.componentType == \"类型\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"类型筛选：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          model: {\n                            value: _vm.componentForm.typeFiltering,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"typeFiltering\", $$v)\n                            },\n                            expression: \"componentForm.typeFiltering\"\n                          }\n                        },\n                        _vm._l(_vm.typeData, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            { key: item, attrs: { label: item } },\n                            [_vm._v(_vm._s(item))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType != \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"数值筛选：\" } },\n                    [\n                      _c(\"el-input-number\", {\n                        model: {\n                          value: _vm.componentForm.startValue,\n                          callback: function($$v) {\n                            _vm.$set(_vm.componentForm, \"startValue\", $$v)\n                          },\n                          expression: \"componentForm.startValue\"\n                        }\n                      }),\n                      _c(\"el-input-number\", {\n                        staticStyle: { \"margin-left\": \"5%\" },\n                        model: {\n                          value: _vm.componentForm.endValue,\n                          callback: function($$v) {\n                            _vm.$set(_vm.componentForm, \"endValue\", $$v)\n                          },\n                          expression: \"componentForm.endValue\"\n                        }\n                      })\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"时间模式：\" } },\n                [\n                  _c(\n                    \"el-select\",\n                    {\n                      attrs: { placeholder: \"请选择时间模式\" },\n                      model: {\n                        value: _vm.componentForm.timeMode,\n                        callback: function($$v) {\n                          _vm.$set(_vm.componentForm, \"timeMode\", $$v)\n                        },\n                        expression: \"componentForm.timeMode\"\n                      }\n                    },\n                    [\n                      _c(\"el-option\", {\n                        attrs: { label: \"触发\", value: \"touch\" }\n                      }),\n                      _vm.componentForm.componentType != \"排队数\" &&\n                      _vm.componentForm.componentType != \"检测数\" &&\n                      _vm.componentForm.componentType != \"延误\" &&\n                      _vm.componentForm.componentType != \"拥堵\"\n                        ? _c(\"el-option\", {\n                            attrs: { label: \"周期时刻\", value: \"timeing\" }\n                          })\n                        : _vm._e(),\n                      _vm.componentForm.componentType != \"OD\"\n                        ? _c(\"el-option\", {\n                            attrs: { label: \"周期统计\", value: \"date\" }\n                          })\n                        : _vm._e()\n                    ],\n                    1\n                  )\n                ],\n                1\n              ),\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"周期间隔：\" } },\n                [\n                  _c(\"el-slider\", {\n                    model: {\n                      value: _vm.componentForm.cycleInterval,\n                      callback: function($$v) {\n                        _vm.$set(_vm.componentForm, \"cycleInterval\", $$v)\n                      },\n                      expression: \"componentForm.cycleInterval\"\n                    }\n                  }),\n                  _c(\n                    \"el-select\",\n                    {\n                      attrs: { placeholder: \"请选择单位\" },\n                      model: {\n                        value: _vm.componentForm.company,\n                        callback: function($$v) {\n                          _vm.$set(_vm.componentForm, \"company\", $$v)\n                        },\n                        expression: \"componentForm.company\"\n                      }\n                    },\n                    _vm._l(_vm.timeSelect, function(item) {\n                      return _c(\"el-option\", {\n                        key: item.value,\n                        attrs: { label: item.label, value: item.value }\n                      })\n                    }),\n                    1\n                  )\n                ],\n                1\n              ),\n              _vm.componentForm.componentType == \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"起点：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handleCheckedStartSection },\n                          model: {\n                            value: _vm.componentForm.startSection,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"startSection\", $$v)\n                            },\n                            expression: \"componentForm.startSection\"\n                          }\n                        },\n                        _vm._l(_vm.sectionals, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            {\n                              key: item.graphicId,\n                              attrs: { label: item.graphicName }\n                            },\n                            [_vm._v(_vm._s(item.graphicName))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType == \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"终点：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handleCheckedendSection },\n                          model: {\n                            value: _vm.componentForm.endSection,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"endSection\", $$v)\n                            },\n                            expression: \"componentForm.endSection\"\n                          }\n                        },\n                        _vm._l(_vm.sectionals, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            {\n                              key: item.graphicId,\n                              attrs: { label: item.graphicName }\n                            },\n                            [_vm._v(_vm._s(item.graphicName))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType != \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"展现形式：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handlePresentation },\n                          model: {\n                            value: _vm.componentForm.presentation,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"presentation\", $$v)\n                            },\n                            expression: \"componentForm.presentation\"\n                          }\n                        },\n                        [\n                          _c(\"el-checkbox\", {\n                            attrs: { label: \"数值\", name: \"type\" }\n                          }),\n                          _vm.componentForm.componentType != \"拥堵\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"表格\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _c(\"el-checkbox\", {\n                            attrs: { label: \"时间曲线图\", name: \"type\" }\n                          }),\n                          _vm.componentForm.componentType == \"类型\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"直方图\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _vm.componentForm.componentType == \"类型\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"饼状图\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _vm.componentForm.componentType != \"拥堵\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"均值图\", name: \"type\" }\n                              })\n                            : _vm._e()\n                        ],\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _c(\n                \"el-form-item\",\n                [\n                  _c(\n                    \"el-button\",\n                    {\n                      attrs: { type: \"primary\" },\n                      on: {\n                        click: function($event) {\n                          return _vm.onSubmitComponent(_vm.componentForm)\n                        }\n                      }\n                    },\n                    [_vm._v(\"确认\")]\n                  ),\n                  _c(\n                    \"el-button\",\n                    {\n                      on: {\n                        click: function($event) {\n                          return _vm.closeComponent(_vm.componentForm)\n                        }\n                      }\n                    },\n                    [_vm._v(\"取消\")]\n                  )\n                ],\n                1\n              )\n            ],\n            1\n          )\n        ],\n        1\n      )\n    ],\n    1\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }"]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=template&id=a83bd3b0&scoped=true&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    { staticClass: \"content-box\" },\n    [\n      _c(\n        \"div\",\n        [\n          _c(\n            \"el-tabs\",\n            {\n              attrs: { type: \"border-card\" },\n              model: {\n                value: _vm.activeName,\n                callback: function($$v) {\n                  _vm.activeName = $$v\n                },\n                expression: \"activeName\"\n              }\n            },\n            [\n              _c(\"el-tab-pane\", { attrs: { label: \"xx路口\", name: \"first\" } }, [\n                _c(\"div\", { staticClass: \"mapModuleApp\" }, [\n                  _c(\"iframe\", {\n                    staticStyle: { width: \"100%\", height: \"100%\" },\n                    attrs: {\n                      id: \"mapModule\",\n                      src: \"./VideoWeb/index.html\",\n                      frameborder: \"0\",\n                      scrolling: \"no\"\n                    }\n                  })\n                ])\n              ]),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"数据看板\", name: \"second\" } },\n                [_c(\"dataBoard\", { attrs: { activeName: _vm.activeName } })],\n                1\n              ),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"分析配置\", name: \"third\" } },\n                [_c(\"analysisConfiguration\")],\n                1\n              ),\n              _c(\n                \"el-tab-pane\",\n                { attrs: { label: \"分析状态\", name: \"fourth\" } },\n                [_c(\"editModal\")],\n                1\n              ),\n              _c(\"el-tab-pane\", { attrs: { label: \"存储\", name: \"five\" } }, [\n                _vm._v(\"存储\")\n              ])\n            ],\n            1\n          )\n        ],\n        1\n      ),\n      _c(\n        \"el-drawer\",\n        {\n          directives: [\n            {\n              name: \"alterELDialogMarginTop\",\n              rawName: \"v-alterELDialogMarginTop\",\n              value: { marginTop: \"0vh\" },\n              expression: \"{marginTop:'0vh'}\"\n            }\n          ],\n          ref: \"drawer\",\n          staticClass: \"new-dialog\",\n          attrs: {\n            visible: _vm.dialogFormVisible,\n            direction: \"btt\",\n            \"custom-class\": \"demo-drawer\",\n            modal: false,\n            \"close-on-click-modal\": false,\n            customClass: \"customWidth\",\n            width: \"100%\",\n            wrapperClosable: false,\n            \"with-header\": false\n          },\n          on: {\n            \"update:visible\": function($event) {\n              _vm.dialogFormVisible = $event\n            }\n          }\n        },\n        [\n          _c(\n            \"div\",\n            { staticClass: \"formBox\" },\n            [\n              _c(\n                \"el-form\",\n                {\n                  ref: \"form\",\n                  attrs: {\n                    model: _vm.form,\n                    \"label-width\": \"80px\",\n                    inline: true\n                  }\n                },\n                [\n                  _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"组件名称\" } },\n                    [\n                      _c(\"el-input\", {\n                        model: {\n                          value: _vm.form.name,\n                          callback: function($$v) {\n                            _vm.$set(_vm.form, \"name\", $$v)\n                          },\n                          expression: \"form.name\"\n                        }\n                      })\n                    ],\n                    1\n                  ),\n                  _vm.form.type == \"断面\"\n                    ? _c(\n                        \"el-form-item\",\n                        { attrs: { label: \"断面方向\" } },\n                        [\n                          _c(\n                            \"el-select\",\n                            {\n                              attrs: { placeholder: \"请选择类型\" },\n                              model: {\n                                value: _vm.form.Direction,\n                                callback: function($$v) {\n                                  _vm.$set(_vm.form, \"Direction\", $$v)\n                                },\n                                expression: \"form.Direction\"\n                              }\n                            },\n                            [\n                              _c(\"el-option\", {\n                                attrs: { label: \"正向\", value: \"正向\" }\n                              }),\n                              _c(\"el-option\", {\n                                attrs: { label: \"反向\", value: \"反向\" }\n                              }),\n                              _c(\"el-option\", {\n                                attrs: { label: \"双向\", value: \"双向\" }\n                              })\n                            ],\n                            1\n                          )\n                        ],\n                        1\n                      )\n                    : _vm._e(),\n                  _c(\n                    \"el-form-item\",\n                    [\n                      _c(\n                        \"el-button\",\n                        {\n                          attrs: { type: \"primary\" },\n                          on: {\n                            click: function($event) {\n                              return _vm.onSubmit(_vm.form)\n                            }\n                          }\n                        },\n                        [_vm._v(\"确认\")]\n                      ),\n                      _c(\n                        \"el-button\",\n                        {\n                          on: {\n                            click: function($event) {\n                              return _vm.closeFigure(_vm.form)\n                            }\n                          }\n                        },\n                        [_vm._v(\"取消\")]\n                      )\n                    ],\n                    1\n                  )\n                ],\n                1\n              )\n            ],\n            1\n          )\n        ]\n      ),\n      _c(\n        \"el-dialog\",\n        {\n          attrs: {\n            title: _vm.componentTitle + \"指标组件\",\n            width: \"40%\",\n            visible: _vm.component\n          },\n          on: {\n            \"update:visible\": function($event) {\n              _vm.component = $event\n            }\n          }\n        },\n        [\n          _c(\n            \"el-form\",\n            {\n              ref: \"form\",\n              attrs: { model: _vm.componentForm, \"label-width\": \"150px\" },\n              on: {\n                close: function($event) {\n                  return _vm.closeComponentForm()\n                }\n              }\n            },\n            [\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"名称：\" } },\n                [\n                  _c(\"el-input\", {\n                    model: {\n                      value: _vm.componentForm.componentName,\n                      callback: function($$v) {\n                        _vm.$set(_vm.componentForm, \"componentName\", $$v)\n                      },\n                      expression: \"componentForm.componentName\"\n                    }\n                  })\n                ],\n                1\n              ),\n              _vm.componentForm.componentType == \"类型\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"类型筛选：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          model: {\n                            value: _vm.componentForm.typeFiltering,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"typeFiltering\", $$v)\n                            },\n                            expression: \"componentForm.typeFiltering\"\n                          }\n                        },\n                        _vm._l(_vm.typeData, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            { key: item, attrs: { label: item } },\n                            [_vm._v(_vm._s(item))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType != \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"数值筛选：\" } },\n                    [\n                      _c(\"el-input-number\", {\n                        model: {\n                          value: _vm.componentForm.startValue,\n                          callback: function($$v) {\n                            _vm.$set(_vm.componentForm, \"startValue\", $$v)\n                          },\n                          expression: \"componentForm.startValue\"\n                        }\n                      }),\n                      _c(\"el-input-number\", {\n                        staticStyle: { \"margin-left\": \"5%\" },\n                        model: {\n                          value: _vm.componentForm.endValue,\n                          callback: function($$v) {\n                            _vm.$set(_vm.componentForm, \"endValue\", $$v)\n                          },\n                          expression: \"componentForm.endValue\"\n                        }\n                      })\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"时间模式：\" } },\n                [\n                  _c(\n                    \"el-select\",\n                    {\n                      attrs: { placeholder: \"请选择时间模式\" },\n                      model: {\n                        value: _vm.componentForm.timeMode,\n                        callback: function($$v) {\n                          _vm.$set(_vm.componentForm, \"timeMode\", $$v)\n                        },\n                        expression: \"componentForm.timeMode\"\n                      }\n                    },\n                    [\n                      _c(\"el-option\", {\n                        attrs: { label: \"触发\", value: \"touch\" }\n                      }),\n                      _vm.componentForm.componentType != \"排队数\" &&\n                      _vm.componentForm.componentType != \"检测数\" &&\n                      _vm.componentForm.componentType != \"延误\" &&\n                      _vm.componentForm.componentType != \"拥堵\"\n                        ? _c(\"el-option\", {\n                            attrs: { label: \"周期时刻\", value: \"timeing\" }\n                          })\n                        : _vm._e(),\n                      _vm.componentForm.componentType != \"OD\"\n                        ? _c(\"el-option\", {\n                            attrs: { label: \"周期统计\", value: \"date\" }\n                          })\n                        : _vm._e()\n                    ],\n                    1\n                  )\n                ],\n                1\n              ),\n              _c(\n                \"el-form-item\",\n                { attrs: { label: \"周期间隔：\" } },\n                [\n                  _c(\"el-slider\", {\n                    model: {\n                      value: _vm.componentForm.cycleInterval,\n                      callback: function($$v) {\n                        _vm.$set(_vm.componentForm, \"cycleInterval\", $$v)\n                      },\n                      expression: \"componentForm.cycleInterval\"\n                    }\n                  }),\n                  _c(\n                    \"el-select\",\n                    {\n                      attrs: { placeholder: \"请选择单位\" },\n                      model: {\n                        value: _vm.componentForm.company,\n                        callback: function($$v) {\n                          _vm.$set(_vm.componentForm, \"company\", $$v)\n                        },\n                        expression: \"componentForm.company\"\n                      }\n                    },\n                    _vm._l(_vm.timeSelect, function(item) {\n                      return _c(\"el-option\", {\n                        key: item.value,\n                        attrs: { label: item.label, value: item.value }\n                      })\n                    }),\n                    1\n                  )\n                ],\n                1\n              ),\n              _vm.componentForm.componentType == \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"起点：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handleCheckedStartSection },\n                          model: {\n                            value: _vm.componentForm.startSection,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"startSection\", $$v)\n                            },\n                            expression: \"componentForm.startSection\"\n                          }\n                        },\n                        _vm._l(_vm.sectionals, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            {\n                              key: item.graphicId,\n                              attrs: { label: item.graphicName }\n                            },\n                            [_vm._v(_vm._s(item.graphicName))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType == \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"终点：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handleCheckedendSection },\n                          model: {\n                            value: _vm.componentForm.endSection,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"endSection\", $$v)\n                            },\n                            expression: \"componentForm.endSection\"\n                          }\n                        },\n                        _vm._l(_vm.sectionals, function(item) {\n                          return _c(\n                            \"el-checkbox\",\n                            {\n                              key: item.graphicId,\n                              attrs: { label: item.graphicName }\n                            },\n                            [_vm._v(_vm._s(item.graphicName))]\n                          )\n                        }),\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _vm.componentForm.componentType != \"OD\"\n                ? _c(\n                    \"el-form-item\",\n                    { attrs: { label: \"展现形式：\" } },\n                    [\n                      _c(\n                        \"el-checkbox-group\",\n                        {\n                          on: { change: _vm.handlePresentation },\n                          model: {\n                            value: _vm.componentForm.presentation,\n                            callback: function($$v) {\n                              _vm.$set(_vm.componentForm, \"presentation\", $$v)\n                            },\n                            expression: \"componentForm.presentation\"\n                          }\n                        },\n                        [\n                          _c(\"el-checkbox\", {\n                            attrs: { label: \"数值\", name: \"type\" }\n                          }),\n                          _vm.componentForm.componentType != \"拥堵\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"表格\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _c(\"el-checkbox\", {\n                            attrs: { label: \"时间曲线图\", name: \"type\" }\n                          }),\n                          _vm.componentForm.componentType == \"类型\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"直方图\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _vm.componentForm.componentType == \"类型\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"饼状图\", name: \"type\" }\n                              })\n                            : _vm._e(),\n                          _vm.componentForm.componentType != \"拥堵\"\n                            ? _c(\"el-checkbox\", {\n                                attrs: { label: \"均值图\", name: \"type\" }\n                              })\n                            : _vm._e()\n                        ],\n                        1\n                      )\n                    ],\n                    1\n                  )\n                : _vm._e(),\n              _c(\n                \"el-form-item\",\n                [\n                  _c(\n                    \"el-button\",\n                    {\n                      attrs: { type: \"primary\" },\n                      on: {\n                        click: function($event) {\n                          return _vm.onSubmitComponent(_vm.componentForm)\n                        }\n                      }\n                    },\n                    [_vm._v(\"确认\")]\n                  ),\n                  _c(\n                    \"el-button\",\n                    {\n                      on: {\n                        click: function($event) {\n                          return _vm.closeComponent(_vm.componentForm)\n                        }\n                      }\n                    },\n                    [_vm._v(\"取消\")]\n                  )\n                ],\n                1\n              )\n            ],\n            1\n          )\n        ],\n        1\n      )\n    ],\n    1\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }"]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/aea17c465c37c4ba8e9c5ad2a4354965.json b/node_modules/.cache/vue-loader/aea17c465c37c4ba8e9c5ad2a4354965.json
index 35cbeca0..abf621e5 100644
--- a/node_modules/.cache/vue-loader/aea17c465c37c4ba8e9c5ad2a4354965.json
+++ b/node_modules/.cache/vue-loader/aea17c465c37c4ba8e9c5ad2a4354965.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;AACA;AACA","file":"AnalysisMain.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">应用</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"]}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n",{"version":3,"sources":["AnalysisMain.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;AACA;AACA","file":"AnalysisMain.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n<div class=\"content-box\">\r\n  <!-- <div class=\"container\">\r\n    <p>分析主页 </p>\r\n    <div class=\"test-div\">\r\n      <i class=\"el-icon-edit\"></i>\r\n      <i class=\"el-icon-share\"></i>\r\n      <i class=\"el-icon-delete\"></i>\r\n    </div>\r\n  </div> -->\r\n  <div>\r\n    <el-row>\r\n  <el-col :span=\"6\" v-for=\"(item, index) in videoList\" :key=\"item\" :offset=\"index > 0 ? 0 : 0\" >\r\n    <el-card :body-style=\"{ padding: '0px' }\" class=\"card\" >\r\n        <div class=\"type\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/leftTop2.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n         <div class=\"name\">\r\n            <img src=\"@/assets/img/AnalysisMain/ssVideo.png\" alt=\"\" v-if=\"item.type=='实时视频'\">\r\n            <img src=\"@/assets/img/AnalysisMain/lxVideo.png\" alt=\"\" v-if=\"item.type=='离线视频'\">\r\n        </div>\r\n        <div class=\"del\" @click=\"open(item.id)\"> <i class='el-icon-delete'></i></div>\r\n      <img :src=\"item.img\" class=\"image\" @click=\"goToPage(item.id,item.num)\">\r\n      <div class=\"bot\">\r\n        <span style=\" vertical-align: middle;\"><img src=\"@/assets/img/AnalysisMain/video (1).png\" alt=\"\"></span>\r\n        <div class=\"bottom clearfix\">\r\n          <time class=\"time\">{{ item.title }}</time>\r\n          <!-- <el-button type=\"text\" class=\"button\">操作按钮</el-button> -->\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </el-col>\r\n  <el-col :span=\"6\">\r\n    <el-card :body-style=\"{ padding: '0px' }\">\r\n        <div class=\"middle\">\r\n            <div style=\"width: 50%;height: 100%;margin: auto;padding-top: 15%;cursor: pointer;text-align: center;\" @click=\"informationInfo('新增')\">\r\n                <img src=\"@/assets/img/AnalysisMain/add.png\" width=\"80%\">\r\n            </div>\r\n             \r\n        </div>\r\n     \r\n    </el-card>\r\n  </el-col>\r\n</el-row>\r\n<div class=\"btn\"><el-button  type=\"primary\" @click=\"applicationBtn\">启动程序</el-button></div>\r\n  </div>\r\n  <div id=\"dialog\" class=\"margin-top: 0px !important;\">\r\n      <el-dialog\r\n    title=\"视频源配置\"\r\n    width=\"40%\"\r\n    :visible.sync=\"dialogFormVisible\"\r\n  >\r\n    <!-- <editModal ></editModal> -->\r\n    <el-form :model=\"form\">\r\n    <el-form-item label=\"视频源名称\" :label-width=\"formLabelWidth\">\r\n      <el-input v-model=\"form.videoName\" autocomplete=\"off\" style=\"width:50%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"视频源类型\" :label-width=\"formLabelWidth\">\r\n    <el-radio-group v-model=\"form.videoType\">\r\n      <el-radio label=\"实时视频\"></el-radio>\r\n      <el-radio label=\"离线视频\"></el-radio>\r\n    </el-radio-group>\r\n  </el-form-item>\r\n  <el-form-item label=\"视频源地址\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='实时视频'\">\r\n      <el-input v-model=\"form.videoStreamAddress\" autocomplete=\"off\" style=\"width:80%\"></el-input>\r\n    </el-form-item>\r\n    <el-form-item label=\"离线视频上传\" :label-width=\"formLabelWidth\" v-if=\"form.videoType=='离线视频'\">\r\n      <!-- <el-upload\r\n        v-model=\"form.f_VC_LIXSP\"\r\n          class=\"upload-demo\"\r\n          action=\"https://jsonplaceholder.typicode.com/posts/\"\r\n          :on-preview=\"handlePreview\"\r\n          :on-remove=\"handleRemove\"\r\n          :before-remove=\"beforeRemove\"\r\n          multiple\r\n          :limit=\"1\"\r\n          :on-exceed=\"handleExceed\"\r\n          :file-list=\"fileList\">\r\n          <el-button size=\"small\" type=\"primary\">点击上传</el-button>\r\n        </el-upload> -->\r\n         <input type=\"file\" id=\"fileExport\" @change=\"handleFileChange\" ref=\"inputer\">\r\n         <el-button size=\"small\" type=\"primary\" @click=\"load\">点击上传</el-button>\r\n    </el-form-item>\r\n  </el-form>\r\n  <div slot=\"footer\" class=\"dialog-footer\">\r\n    <el-button @click=\"dialogFormVisible = false\">取 消</el-button>\r\n    <el-button type=\"primary\" @click=\"commit(form)\">确 定</el-button>\r\n  </div>\r\n  </el-dialog>\r\n  </div>\r\n \r\n     \r\n</div>\r\n\r\n</template>\r\n\r\n<script>\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport {getGetShipjk,getDeleteShipjk,getApplication} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\nexport default {\r\n  data(){\r\n    return{\r\n        componentShow: \"\",\r\n        currentDate: new Date(),\r\n        closeStatus: null,\r\n      dialogFormVisible: false,\r\n       fileList: [\r\n        // {name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}\r\n        ],\r\n       form: {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n        formLabelWidth: '120px',\r\n        formLabelWidth: '200px',\r\n        videoList:[\r\n        //     {\r\n        //     img:require('@/assets/img/AnalysisMain/img1.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控001'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img2.png'),\r\n        //     type:'离线视频',\r\n        //     title:'视频监控002'\r\n        // },{\r\n        //     img:require('@/assets/img/AnalysisMain/img3.png'),\r\n        //     type:'实时视频',\r\n        //     title:'视频监控003'\r\n        // }\r\n        ]\r\n    }\r\n  },\r\n   mounted() {\r\n    console.log(\"dialogFormVisible\",this.dialogFormVisible)\r\n    this.getVideoList()\r\n  },\r\n  methods: {\r\n     informationInfo(data,item) {\r\n        console.log(\"data\",data)\r\n        if(data=='新增'){\r\n        this.form= {\r\n         radio: '',\r\n          name: '',\r\n          city:'',\r\n          videoUrl:'',\r\n        },\r\n         this.dialogFormVisible = true;\r\n        }\r\n        \r\n     },\r\n     open(item) {\r\n        console.log(\"item\",item)\r\n        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {\r\n          confirmButtonText: '确定',\r\n          cancelButtonText: '取消',\r\n          type: 'warning'\r\n        }).then(() => {\r\n             getDeleteShipjk({VideoId:item}).then(res=>{\r\n                console.log(\"res\",res)\r\n                this.$message({\r\n                    type: 'success',\r\n                    message: '删除成功!'\r\n                });\r\n                 this.getVideoList()\r\n             })\r\n          \r\n        }).catch(() => {\r\n          this.$message({\r\n            type: 'info',\r\n            message: '已取消删除'\r\n          });          \r\n        });\r\n      },\r\n     commit(form){\r\n        console.log(\"form\",form)\r\n        let formData = new FormData();\r\n        formData.append(\"VideoName\",form.videoName);\r\n            formData.append(\"VideoType\",form.videoType);\r\n            formData.append(\"VideoStreamAddress\",form.videoStreamAddress);\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.dataUrl,\r\n                data:formData\r\n              }).then((res) => {\r\n               console.log(\"提交按钮\",res)\r\n               if(res.data.msg=='添加成功'){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                this.getVideoList()\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n\r\n              this.dialogFormVisible = false;\r\n                \r\n              });\r\n    \r\n     },\r\n     handleFileChange(e) {\r\n                    let inputDOM = this.$refs.inputer;\r\n                    this.file = inputDOM.files[0];// 通过DOM取文件数据\r\n\r\n                },\r\n    //应用\r\n    applicationBtn(){\r\n         getApplication().then(res=>{\r\n                console.log(\"res\",res)\r\n                if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                }\r\n             })\r\n    },\r\n                S4() {\r\n                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\r\n                },\r\n                guid() {\r\n                    return (this.S4() + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + \"-\" + this.S4() + this.S4() + this.S4());\r\n                },\r\n                load() {\r\n                    let size = this.file.size;//文件大小\r\n\r\n                    let maxZrea = 8;              //设置每个分区大小 MB\r\n                    let bufferSize = maxZrea * (1024 * 1024);\r\n                    let fileStart = 0;\r\n                    let fileEnd = bufferSize;\r\n                    let arrFile = [];\r\n                    while (fileStart < size) {\r\n                        var fileInfo = {\r\n                            File: this.file.slice(fileStart, fileEnd),\r\n                            Start: fileStart,\r\n                            End: fileEnd\r\n                        }\r\n                        arrFile.push(fileInfo);\r\n                        fileStart = fileEnd;\r\n                        fileEnd = fileStart + bufferSize;\r\n                    }\r\n                    let count = arrFile.length;\r\n                    let filename = this.file.name + \"~\" + this.guid();\r\n                    for (var i = 0; i < count; i++) {\r\n                        let formData = new FormData();//new一个formData事件\r\n                        formData.append(\"file\", arrFile[i].File); //将file属性添加到formData里\r\n                        var url = serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size;\r\n                        console.log(\"url\",url)\r\n                         //               axios({\r\n            //     method: \"post\",\r\n            //     url: serverUrl.getSpareElementOrder+\"?Name=\" + filename + \"&Number=\" + i + \"&BufferSize=\" + bufferSize + \"&Count=\" + count + \"&Start=\" + arrFile[i].Start + \"&End=\" + arrFile[i].End + \"&Size=\" + size,\r\n            //     headers: {\r\n            //                     \"Content-Type\": \"multipart/form-data;\",\r\n            //                 }\r\n            //   })\r\n                        axios.post(url, formData, {\r\n                            headers: {\r\n                                \"Content-Type\": \"multipart/form-data;\",\r\n                            }\r\n                        }).then(r => {\r\n                            console.log(\"r.data\",r.data);\r\n                            if (r.data.code!=200) {\r\n                                console.log(r.data);\r\n                            }else{\r\n                                 this.$message({\r\n                                  message: r.data.msg,\r\n                                  type: 'success'\r\n                                });\r\n                            }\r\n                            //console.log(r.data.code);\r\n                        }).catch(e => {\r\n                            console.log(e);\r\n                        });\r\n                    }\r\n                },\r\n     goToPage(id,num) {\r\n\r\n        this.$router.push({path:'index',query: {id:id,num:num}})\r\n        \r\n    },\r\n     //获取视频数据\r\n     getVideoList(){\r\n        getGetShipjk().then(res=>{\r\n            console.log(\"res\",res)\r\n            if(res.data.msg=='成功'){\r\n               \r\n                var arr = [];\r\n                res.data.data.forEach((item)=>{\r\n                        arr.push({\r\n                              id:  item.videoId,  \r\n                              type: item.videoType,\r\n                              title: item.videoName,\r\n                              num:item.number,\r\n                              img: require('@/assets/img/AnalysisMain/img1.png'),\r\n                            });\r\n                        }) \r\n                this.videoList=arr\r\n                console.log(\"this.videoList\",this.videoList)\r\n            }\r\n        })\r\n     },\r\n      handleRemove(file, fileList) {\r\n        console.log(file, fileList);\r\n      },\r\n      handlePreview(file) {\r\n        console.log(file);\r\n      },\r\n      handleExceed(files, fileList) {\r\n        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);\r\n      },\r\n      beforeRemove(file, fileList) {\r\n        return this.$confirm(`确定移除 ${ file.name }？`);\r\n      },\r\n      //    onUpdateSubmit(data) {\r\n//       if (data?.id) {\r\n//         this.tableData.map(v => v.id === data.id ? v.name = data.name : v.name);\r\n//       } else {\r\n//         this.tableData.push({\r\n//           id: Math.floor(Math.random() * 300),\r\n//           name: data.name,\r\n//           creator: 'dd',\r\n//         })\r\n//       }\r\n \r\n//       this.dialogFormVisible = false;\r\n//     },\r\n  },\r\n  \r\n\r\n   components: {\r\n    editModal\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n  .time {\r\n    font-size: 13px;\r\n    color: #999;\r\n  }\r\n  .bot{\r\n    padding: 14px;\r\n  }\r\n  .bottom {\r\n    margin-top: 13px;\r\n    line-height: 12px;\r\n    display: inline-block;\r\n    margin-left: 15px;\r\n  }\r\n\r\n  .button {\r\n    padding: 0;\r\n    float: right;\r\n  }\r\n\r\n  .image {\r\n    width: 100%;\r\n    display: block;\r\n    \r\n  }\r\n\r\n  .clearfix:before,\r\n  .clearfix:after {\r\n      display: table;\r\n      content: \"\";\r\n  }\r\n  \r\n  .clearfix:after {\r\n      clear: both\r\n  }\r\n  .middle{\r\n    width: 100%;\r\n    /* height: 100%; */\r\n    height: 284px;\r\n  }\r\n  .el-col-6 {\r\n    width: 25%;\r\n    padding-left: 20px;\r\n    padding-top: 20px;\r\n}\r\n.type{\r\n    position: absolute;\r\n    left: 0;\r\n    top:0px;\r\n}\r\n.del{\r\n    position: absolute;\r\n    right: 0px;\r\n    top:0px;\r\n    width: 25px;\r\n    height: 25px;\r\n    z-index: 9999;\r\n    /* background-color: #999 */\r\n}\r\n.card{\r\n    position: relative;\r\n    cursor: pointer;\r\n}\r\n.name{\r\n     position: absolute;\r\n    left: 7px;\r\n    top:0px;\r\n    z-index: 99;\r\n}\r\n.el_dialog {\r\n        position: fixed;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: rgba(0, 0, 0, 0.5);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n    .el_dialog__content {\r\n        width: v-bind(width1);\r\n        height: 400px;\r\n        background-color: white;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n  \r\n#dialog .el-dialog__header {\r\n  border-bottom: 1px solid #eee;\r\n}\r\n \r\n\r\n#dialog .el-dialog__title {\r\n  font-weight: bold;\r\n  color: #000;\r\n}\r\n.btn{\r\n    position: absolute;\r\n    right: 10%;\r\n    bottom: 18%;\r\n}\r\n</style>\r\n\r\n\r\n"]}]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/dc86dda05766664d6031588756430dc6.json b/node_modules/.cache/vue-loader/dc86dda05766664d6031588756430dc6.json
index 2bbcba12..06520257 100644
--- a/node_modules/.cache/vue-loader/dc86dda05766664d6031588756430dc6.json
+++ b/node_modules/.cache/vue-loader/dc86dda05766664d6031588756430dc6.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673506578712},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import { render, staticRenderFns } from \"./AnalysisMain.vue?vue&type=template&id=689d6d6f&\"\nimport script from \"./AnalysisMain.vue?vue&type=script&lang=js&\"\nexport * from \"./AnalysisMain.vue?vue&type=script&lang=js&\"\nimport style0 from \"./AnalysisMain.vue?vue&type=style&index=0&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"D:\\\\Hjm项目\\\\TransFlow\\\\node_modules\\\\vue-hot-reload-api\\\\dist\\\\index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('689d6d6f')) {\n      api.createRecord('689d6d6f', component.options)\n    } else {\n      api.reload('689d6d6f', component.options)\n    }\n    module.hot.accept(\"./AnalysisMain.vue?vue&type=template&id=689d6d6f&\", function () {\n      api.rerender('689d6d6f', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"src/views/AnalysisMain.vue\"\nexport default component.exports"]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\AnalysisMain.vue","mtime":1673507216982},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import { render, staticRenderFns } from \"./AnalysisMain.vue?vue&type=template&id=689d6d6f&\"\nimport script from \"./AnalysisMain.vue?vue&type=script&lang=js&\"\nexport * from \"./AnalysisMain.vue?vue&type=script&lang=js&\"\nimport style0 from \"./AnalysisMain.vue?vue&type=style&index=0&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"D:\\\\Hjm项目\\\\TransFlow\\\\node_modules\\\\vue-hot-reload-api\\\\dist\\\\index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('689d6d6f')) {\n      api.createRecord('689d6d6f', component.options)\n    } else {\n      api.reload('689d6d6f', component.options)\n    }\n    module.hot.accept(\"./AnalysisMain.vue?vue&type=template&id=689d6d6f&\", function () {\n      api.rerender('689d6d6f', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"src/views/AnalysisMain.vue\"\nexport default component.exports"]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/df750507470d930b6c6de7cf2d70a5aa.json b/node_modules/.cache/vue-loader/df750507470d930b6c6de7cf2d70a5aa.json
index 2040921e..23dd82aa 100644
--- a/node_modules/.cache/vue-loader/df750507470d930b6c6de7cf2d70a5aa.json
+++ b/node_modules/.cache/vue-loader/df750507470d930b6c6de7cf2d70a5aa.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=style&index=0&id=a83bd3b0&scoped=true&lang=css&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\css-loader\\dist\\cjs.js","mtime":1672881375404},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8+BA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n  \r\n  },\r\n  methods: {\r\n\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n    // 测试：mqtt测试\r\n    testMqtt() {\r\n      this.getDataByMqtt()\r\n    },\r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type),JSON.stringify(form.id))\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n    // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\r\n       \r\n      const clientId = \"test_id_\" + String(new Date().getTime()); // 用户名\r\n      //   const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt\r\n      const host = 'ws://172.16.1.168:10087/';\r\n\r\n      const options = {\r\n        // 配置\r\n        // 测试：订阅本机IP\r\n        // host: host,\r\n        // port: port,\r\n        // host:\"172.16.1.168:10086\",\r\n        keepalive: 60, // 心跳时间，默认60s，设置为0禁用\r\n        username: 'admin',  // 用户名（可选）\r\n        password: '123456',  // 密码（可选）\r\n        clientId: clientId, // 客户端ID，默认随机生成\r\n        protocolId: \"MQTT\",\r\n        protocolVersion: 4,\r\n        clean: true, // false在离线时接收QoS1和2的消息\r\n        reconnectPeriod: 2000, // 重连间隔，默认1000毫秒\r\n        connectTimeout: 30 * 1000, // 收到CONNACK之前的等待时间\r\n        will: {\r\n          // 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）\r\n          topic: \"img1\", // 要发布的主题\r\n          payload: \"[MQTT-TEST] 遗嘱消息：连接异常断开！\", // 要发布的消息\r\n          qos: 0, // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次\r\n          retain: false, // 保留标志\r\n        },\r\n      };\r\n      if (this.mqttClient == undefined) {\r\n        \r\n        this.mqttClient = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host)  // 连接\r\n        // 错误回调\r\n        // console.log(\"this.mqttClient\", this.mqttClient)\r\n        this.mqttClient.on(\"error\", (err) => {\r\n          console.log(\"[MQTT-TEST] 连接错误：\", err);\r\n          this.mqttClient.end();\r\n        });\r\n        // 重连回调\r\n        this.mqttClient.on(\"reconnect\", (reconnect) => {\r\n        //   console.log(\"[MQTT-TEST] 重连中……\", reconnect);\r\n        });\r\n        \r\n        // 连接回调\r\n        this.mqttClient.on(\"connect\", (connect) => {\r\n        //   console.log(\"[MQTT-TEST] 已连接的客户端ID: \", connect);\r\n          \r\n          \r\n        //    this.client.connect('aaa', '111')\r\n         \r\n        //   this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });\r\n        //   this.mqttClient.subscribe('img1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img5', { qos: 0 });\r\n          // 订阅\r\n       this.mqttClient.subscribe('img'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('stream'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('trajectory'+this.number, { qos: 0 });\r\n         \r\n        \r\n          \r\n        \r\n        //   this.mqttClient.subscribe('stream1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream5', { qos: 0 });\r\n          \r\n        });\r\n        \r\n        // 接收回调\r\n        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n            \r\n          if (topic.indexOf(\"img0\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"img1\") != -1) {\r\n             try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img2\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img3\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img4\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img5\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"stream0\") != -1) {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n            // try {\r\n            //   const utf8decoder1 = new TextDecoder()\r\n            //   const u8arr = new Uint8Array(message)\r\n            //   const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n            //     document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n             \r\n            // } catch {\r\n            //   let imageType = 'arraybuffer';\r\n            //   const blob = new Blob([message], { type: imageType })\r\n            //   const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            // //   console.log(\"imageUrl\", imageUrl)\r\n            // }\r\n          } else if (topic.indexOf(\"stream1\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream2\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream3\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream4\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream5\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          }else{\r\n\r\n          }\r\n\r\n        });\r\n        this.mqttClient.publish('msg_flag', this.number);\r\n      }\r\n\r\n\r\n    },\r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"]}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=style&index=0&id=a83bd3b0&scoped=true&lang=css&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\css-loader\\dist\\cjs.js","mtime":1672881375404},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAs8BA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\n// import mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n// mqtt\r\n// import mqttHandle from \"../../../utils/mqttHandle\";\r\nimport mqttConfig from \"@/utils/mqttConfig.js\";\r\nvar mqtt; //mqtt 处理对象（全局变量）\r\nvar client;\r\n// var topicSends; //订阅的topic 例如：[\"Time1\", \"EngineMain1\", \"Console1\", \"Location1\"]\r\n \r\nexport default {\r\n  data() {\r\n    return {\r\n        receiveNews: \"\",\r\n        topicSends:['img0','stream0','trajectory0','detection0'],\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n    window.getSimulationAreaEdit = this.getSimulationAreaEdit;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    // this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n   this.createMqtt();\r\n  },\r\n  methods: {\r\n     /** 创建mqtt */\r\n    createMqtt() {\r\n      //创建链接，接收数据\r\n      \r\n      mqtt = new mqttConfig(this.topicSends);\r\n      client = mqtt.createConnect();\r\n    client.subscribe(['img'+this.number,'stream'+this.number, 'trajectory'+this.number, 'detection'+this.number], { qos: 0 }, (err)=> {\r\n          if (!err) {\r\n            console.log(\"订阅成功\");\r\n            client.publish('msg_stream',JSON.stringify({\"msg_flag\":parseInt(this.number)})) \r\n          } else {\r\n            console.log('消息订阅失败！')\r\n          }\r\n          \r\n        }); \r\n      client.on(\"message\", (topic, message) => {\r\n        //数据分类\r\n        try {\r\n        //   this.receiveNews = this.receiveNews.concat(message);\r\n        //   this.realInfo(topic, this.receiveNews);\r\n          this.realInfo(topic, message);\r\n        } catch (error) {\r\n\r\n        }\r\n      });\r\n    },\r\n    //停止订阅mqtt\r\n    disConnect() {\r\n      if (client != null) {\r\n        client.unsubscribe(this.topicSends);\r\n        client = null;\r\n      }\r\n    },\r\n    /** 实时数据分类 */\r\n    realInfo(topic, message) {\r\n      switch (topic) {\r\n        // 接收托片\r\n        case \"img0\":\r\n        case \"img1\":\r\n        case \"img2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 树结构\r\n        case \"stream0\":\r\n        case \"stream1\":\r\n        case \"stream2\":\r\n          try {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 控制台输出\r\n        case \"trajectory0\":\r\n        case \"trajectory1\":\r\n        case \"trajectory2\":\r\n        case \"trajectory3\":\r\n          try {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //    console.log(\"message11\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp11\",temp)\r\n              const msg = JSON.parse(temp)\r\n                //  console.log(\"msg11\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getGuiJi(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 触发\r\n        case \"detection0\":\r\n        case \"detection1\":\r\n        case \"detection2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //   console.log(\"message\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp\",temp)\r\n              const msg = JSON.parse(temp)\r\n            //   console.log(\"msg\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getChuFa(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n      }\r\n      this.receiveNews = \"\";\r\n    },\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n   \r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //新增组件根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //修改模拟区组件、图形\r\n    getSimulationAreaEdit(id,type,componentType,name){\r\n        if(type=='图形'){\r\n        this.form.id = id\r\n        this.form.name = name\r\n        this.form.type = componentType\r\n        this.startFigureName = name\r\n        if(this.form.type=='轨迹'){\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n        }else if(type=='组件'){\r\n            this.componentId = id\r\n        this.componentForm.componentType = componentType\r\n        this.componentTitle = componentType\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n        }\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        // formData.append(\"Direction\",form.Direction);\r\n        // formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n   \r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"]}]}
\ No newline at end of file
diff --git a/node_modules/.cache/vue-loader/ee5e8a15d2207d52c2ba3792ba347b2d.json b/node_modules/.cache/vue-loader/ee5e8a15d2207d52c2ba3792ba347b2d.json
index c99b2207..a8e7e01e 100644
--- a/node_modules/.cache/vue-loader/ee5e8a15d2207d52c2ba3792ba347b2d.json
+++ b/node_modules/.cache/vue-loader/ee5e8a15d2207d52c2ba3792ba347b2d.json
@@ -1 +1 @@
-{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673506578716},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n  \r\n  },\r\n  methods: {\r\n\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n    // 测试：mqtt测试\r\n    testMqtt() {\r\n      this.getDataByMqtt()\r\n    },\r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type),JSON.stringify(form.id))\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n    // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\r\n       \r\n      const clientId = \"test_id_\" + String(new Date().getTime()); // 用户名\r\n      //   const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt\r\n      const host = 'ws://172.16.1.168:10087/';\r\n\r\n      const options = {\r\n        // 配置\r\n        // 测试：订阅本机IP\r\n        // host: host,\r\n        // port: port,\r\n        // host:\"172.16.1.168:10086\",\r\n        keepalive: 60, // 心跳时间，默认60s，设置为0禁用\r\n        username: 'admin',  // 用户名（可选）\r\n        password: '123456',  // 密码（可选）\r\n        clientId: clientId, // 客户端ID，默认随机生成\r\n        protocolId: \"MQTT\",\r\n        protocolVersion: 4,\r\n        clean: true, // false在离线时接收QoS1和2的消息\r\n        reconnectPeriod: 2000, // 重连间隔，默认1000毫秒\r\n        connectTimeout: 30 * 1000, // 收到CONNACK之前的等待时间\r\n        will: {\r\n          // 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）\r\n          topic: \"img1\", // 要发布的主题\r\n          payload: \"[MQTT-TEST] 遗嘱消息：连接异常断开！\", // 要发布的消息\r\n          qos: 0, // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次\r\n          retain: false, // 保留标志\r\n        },\r\n      };\r\n      if (this.mqttClient == undefined) {\r\n        \r\n        this.mqttClient = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host)  // 连接\r\n        // 错误回调\r\n        // console.log(\"this.mqttClient\", this.mqttClient)\r\n        this.mqttClient.on(\"error\", (err) => {\r\n          console.log(\"[MQTT-TEST] 连接错误：\", err);\r\n          this.mqttClient.end();\r\n        });\r\n        // 重连回调\r\n        this.mqttClient.on(\"reconnect\", (reconnect) => {\r\n        //   console.log(\"[MQTT-TEST] 重连中……\", reconnect);\r\n        });\r\n        \r\n        // 连接回调\r\n        this.mqttClient.on(\"connect\", (connect) => {\r\n        //   console.log(\"[MQTT-TEST] 已连接的客户端ID: \", connect);\r\n          \r\n          \r\n        //    this.client.connect('aaa', '111')\r\n         \r\n        //   this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });\r\n        //   this.mqttClient.subscribe('img1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img5', { qos: 0 });\r\n          // 订阅\r\n       this.mqttClient.subscribe('img'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('stream'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('trajectory'+this.number, { qos: 0 });\r\n         \r\n        \r\n          \r\n        \r\n        //   this.mqttClient.subscribe('stream1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream5', { qos: 0 });\r\n          \r\n        });\r\n        \r\n        // 接收回调\r\n        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n            \r\n          if (topic.indexOf(\"img0\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"img1\") != -1) {\r\n             try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img2\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img3\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img4\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img5\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"stream0\") != -1) {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n            // try {\r\n            //   const utf8decoder1 = new TextDecoder()\r\n            //   const u8arr = new Uint8Array(message)\r\n            //   const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n            //     document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n             \r\n            // } catch {\r\n            //   let imageType = 'arraybuffer';\r\n            //   const blob = new Blob([message], { type: imageType })\r\n            //   const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            // //   console.log(\"imageUrl\", imageUrl)\r\n            // }\r\n          } else if (topic.indexOf(\"stream1\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream2\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream3\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream4\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream5\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          }else{\r\n\r\n          }\r\n\r\n        });\r\n        this.mqttClient.publish('msg_flag', this.number);\r\n      }\r\n\r\n\r\n    },\r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+MA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AAKA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;;AAGA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n  \r\n  },\r\n  methods: {\r\n\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n    // 测试：mqtt测试\r\n    testMqtt() {\r\n      this.getDataByMqtt()\r\n    },\r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type),JSON.stringify(form.id))\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n    // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\r\n       \r\n      const clientId = \"test_id_\" + String(new Date().getTime()); // 用户名\r\n      //   const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt\r\n      const host = 'ws://172.16.1.168:10087/';\r\n\r\n      const options = {\r\n        // 配置\r\n        // 测试：订阅本机IP\r\n        // host: host,\r\n        // port: port,\r\n        // host:\"172.16.1.168:10086\",\r\n        keepalive: 60, // 心跳时间，默认60s，设置为0禁用\r\n        username: 'admin',  // 用户名（可选）\r\n        password: '123456',  // 密码（可选）\r\n        clientId: clientId, // 客户端ID，默认随机生成\r\n        protocolId: \"MQTT\",\r\n        protocolVersion: 4,\r\n        clean: true, // false在离线时接收QoS1和2的消息\r\n        reconnectPeriod: 2000, // 重连间隔，默认1000毫秒\r\n        connectTimeout: 30 * 1000, // 收到CONNACK之前的等待时间\r\n        will: {\r\n          // 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）\r\n          topic: \"img1\", // 要发布的主题\r\n          payload: \"[MQTT-TEST] 遗嘱消息：连接异常断开！\", // 要发布的消息\r\n          qos: 0, // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次\r\n          retain: false, // 保留标志\r\n        },\r\n      };\r\n      if (this.mqttClient == undefined) {\r\n        \r\n        this.mqttClient = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host, options); // 连接\r\n        // const client = mqtt.connect(host)  // 连接\r\n        // 错误回调\r\n        // console.log(\"this.mqttClient\", this.mqttClient)\r\n        this.mqttClient.on(\"error\", (err) => {\r\n          console.log(\"[MQTT-TEST] 连接错误：\", err);\r\n          this.mqttClient.end();\r\n        });\r\n        // 重连回调\r\n        this.mqttClient.on(\"reconnect\", (reconnect) => {\r\n        //   console.log(\"[MQTT-TEST] 重连中……\", reconnect);\r\n        });\r\n        \r\n        // 连接回调\r\n        this.mqttClient.on(\"connect\", (connect) => {\r\n        //   console.log(\"[MQTT-TEST] 已连接的客户端ID: \", connect);\r\n          \r\n          \r\n        //    this.client.connect('aaa', '111')\r\n         \r\n        //   this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });\r\n        //   this.mqttClient.subscribe('img1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('img5', { qos: 0 });\r\n          // 订阅\r\n       this.mqttClient.subscribe('img'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('stream'+this.number, { qos: 0 });\r\n        this.mqttClient.subscribe('trajectory'+this.number, { qos: 0 });\r\n         \r\n        \r\n          \r\n        \r\n        //   this.mqttClient.subscribe('stream1', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream2', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream3', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream4', { qos: 0 });\r\n        //   this.mqttClient.subscribe('stream5', { qos: 0 });\r\n          \r\n        });\r\n        \r\n        // 接收回调\r\n        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n            \r\n          if (topic.indexOf(\"img0\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"img1\") != -1) {\r\n             try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img2\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img3\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img4\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } else if (topic.indexOf(\"img5\") != -1) {\r\n            try {\r\n              const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n             \r\n            } catch {\r\n              let imageType = 'arraybuffer';\r\n              const blob = new Blob([message], { type: imageType })\r\n              const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            //   console.log(\"imageUrl\", imageUrl)\r\n            }\r\n          } \r\n          else if (topic.indexOf(\"stream0\") != -1) {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n            // try {\r\n            //   const utf8decoder1 = new TextDecoder()\r\n            //   const u8arr = new Uint8Array(message)\r\n            //   const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n            //     document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n             \r\n            // } catch {\r\n            //   let imageType = 'arraybuffer';\r\n            //   const blob = new Blob([message], { type: imageType })\r\n            //   const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)\r\n            // //   console.log(\"imageUrl\", imageUrl)\r\n            // }\r\n          } else if (topic.indexOf(\"stream1\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream2\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream3\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream4\") != -1) {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } else if (topic.indexOf(\"stream5\") != -1) {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          }else{\r\n\r\n          }\r\n\r\n        });\r\n        this.mqttClient.publish('msg_flag', this.number);\r\n      }\r\n\r\n\r\n    },\r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"]}]}
\ No newline at end of file
+{"remainingRequest":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\TransFlow\\src\\views\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\TransFlow\\src\\views\\index.vue","mtime":1673507216983},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\n\r\n// import mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n// mqtt\r\n// import mqttHandle from \"../../../utils/mqttHandle\";\r\nimport mqttConfig from \"@/utils/mqttConfig.js\";\r\nvar mqtt; //mqtt 处理对象（全局变量）\r\nvar client;\r\n// var topicSends; //订阅的topic 例如：[\"Time1\", \"EngineMain1\", \"Console1\", \"Location1\"]\r\n \r\nexport default {\r\n  data() {\r\n    return {\r\n        receiveNews: \"\",\r\n        topicSends:['img0','stream0','trajectory0','detection0'],\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n    window.getSimulationAreaEdit = this.getSimulationAreaEdit;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    // this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n   this.createMqtt();\r\n  },\r\n  methods: {\r\n     /** 创建mqtt */\r\n    createMqtt() {\r\n      //创建链接，接收数据\r\n      \r\n      mqtt = new mqttConfig(this.topicSends);\r\n      client = mqtt.createConnect();\r\n    client.subscribe(['img'+this.number,'stream'+this.number, 'trajectory'+this.number, 'detection'+this.number], { qos: 0 }, (err)=> {\r\n          if (!err) {\r\n            console.log(\"订阅成功\");\r\n            client.publish('msg_stream',JSON.stringify({\"msg_flag\":parseInt(this.number)})) \r\n          } else {\r\n            console.log('消息订阅失败！')\r\n          }\r\n          \r\n        }); \r\n      client.on(\"message\", (topic, message) => {\r\n        //数据分类\r\n        try {\r\n        //   this.receiveNews = this.receiveNews.concat(message);\r\n        //   this.realInfo(topic, this.receiveNews);\r\n          this.realInfo(topic, message);\r\n        } catch (error) {\r\n\r\n        }\r\n      });\r\n    },\r\n    //停止订阅mqtt\r\n    disConnect() {\r\n      if (client != null) {\r\n        client.unsubscribe(this.topicSends);\r\n        client = null;\r\n      }\r\n    },\r\n    /** 实时数据分类 */\r\n    realInfo(topic, message) {\r\n      switch (topic) {\r\n        // 接收托片\r\n        case \"img0\":\r\n        case \"img1\":\r\n        case \"img2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 树结构\r\n        case \"stream0\":\r\n        case \"stream1\":\r\n        case \"stream2\":\r\n          try {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 控制台输出\r\n        case \"trajectory0\":\r\n        case \"trajectory1\":\r\n        case \"trajectory2\":\r\n        case \"trajectory3\":\r\n          try {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //    console.log(\"message11\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp11\",temp)\r\n              const msg = JSON.parse(temp)\r\n                //  console.log(\"msg11\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getGuiJi(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 触发\r\n        case \"detection0\":\r\n        case \"detection1\":\r\n        case \"detection2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //   console.log(\"message\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp\",temp)\r\n              const msg = JSON.parse(temp)\r\n            //   console.log(\"msg\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getChuFa(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n      }\r\n      this.receiveNews = \"\";\r\n    },\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n   \r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //新增组件根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //修改模拟区组件、图形\r\n    getSimulationAreaEdit(id,type,componentType,name){\r\n        if(type=='图形'){\r\n        this.form.id = id\r\n        this.form.name = name\r\n        this.form.type = componentType\r\n        this.startFigureName = name\r\n        if(this.form.type=='轨迹'){\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n        }else if(type=='组件'){\r\n            this.componentId = id\r\n        this.componentForm.componentType = componentType\r\n        this.componentTitle = componentType\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n        }\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        // formData.append(\"Direction\",form.Direction);\r\n        // formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n   \r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+MA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/views","sourcesContent":["<template>\r\n  <div class=\"content-box\">\r\n\r\n    <!-- <div class=\"container\"> -->\r\n    <div >\r\n      <el-tabs type=\"border-card\"  v-model=\"activeName\">\r\n        <el-tab-pane label=\"xx路口\" name=\"first\" >\r\n            <div class=\"mapModuleApp\">\r\n                     <iframe id=\"mapModule\" src=\"./VideoWeb/index.html\" frameborder=\"0\" style=\"width: 100%; height:100%;\" scrolling='no'></iframe>\r\n                      <!-- <iframe src=\"./VideoWeb/index.html\" style=\"height: 100%; width: 100%;border: none\" \r\n          ref=\"iframe\"></iframe> -->\r\n                </div>\r\n                 <!-- <div style=\"width:20%;height:100%;display:inline-block;border:1px soild #eee;padding:15px;\">\r\n\r\n            <el-button type=\"primary\" @click=\"dialogFormVisible = true\">断面组件</el-button>\r\n            <el-button type=\"primary\" @click=\"areaComponent = true\">区域组件</el-button>\r\n            <el-button type=\"primary\" @click=\"trajectory=true\">轨迹组件</el-button>\r\n            <el-button type=\"primary\" @click=\"speed = true\">速度组件</el-button>\r\n            <el-button type=\"primary\" @click=\"flow = true\">流量组件</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">车头时距</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">排队数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">检测数</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">延误</el-button>\r\n            <el-button type=\"primary\" @click=\"indexModule = true\">拥堵</el-button>\r\n\r\n          </div> -->\r\n     \r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"数据看板\" name=\"second\">\r\n          <dataBoard :activeName=\"activeName\"></dataBoard>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析配置\" name=\"third\">\r\n          <analysisConfiguration></analysisConfiguration>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"分析状态\" name=\"fourth\">\r\n          <editModal></editModal>\r\n        </el-tab-pane>\r\n        <el-tab-pane label=\"存储\" name=\"five\">存储</el-tab-pane>\r\n      </el-tabs>\r\n      <!-- <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl' width=\"100%\" height=\"100%\"/>\r\n  </div>  \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl1' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl2' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl3' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl4' width=\"100%\" height=\"100%\"/>\r\n  </div> \r\n  <div style=\"width:30%;height:300px;display:inline-block\">\r\n    <img :src='imgUrl5' width=\"100%\" height=\"100%\"/>\r\n  </div>  -->\r\n\r\n    </div>\r\n    <!-- <div id=\"dialog\" style=\"height:500px\"> -->\r\n      <!-- <el-dialog  class=\"new-dialog\" :title=\"title+'组件'\" :modal=\"false\" :close-on-click-modal=\"false\" :visible.sync=\"dialogFormVisible\" v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" @close='closeForm(form)'>\r\n            <el-form ref=\"form\" :model=\"form\" label-width=\"80px\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        \r\n      </el-dialog> -->\r\n      <el-drawer\r\n      class=\"new-dialog\"\r\n  :visible.sync=\"dialogFormVisible\"\r\n  direction=\"btt\"\r\n  custom-class=\"demo-drawer\"\r\n  ref=\"drawer\"\r\n  :modal=\"false\" \r\n :close-on-click-modal=\"false\"\r\n  v-alterELDialogMarginTop=\"{marginTop:'0vh'}\" customClass='customWidth' width=\"100%\" \r\n  :wrapperClosable=\"false\" \r\n  :with-header=\"false\"\r\n  >\r\n      <div class=\"formBox\">\r\n        <el-form ref=\"form\" :model=\"form\" label-width=\"80px\" :inline=\"true\">\r\n          <el-form-item label=\"组件名称\">\r\n            <el-input v-model=\"form.name\"></el-input>\r\n          </el-form-item>\r\n          <el-form-item label=\"断面方向\" v-if=\"form.type=='断面'\">\r\n            <el-select v-model=\"form.Direction\" placeholder=\"请选择类型\">\r\n              <el-option label=\"正向\" value=\"正向\"></el-option>\r\n              <el-option label=\"反向\" value=\"反向\"></el-option>\r\n              <el-option label=\"双向\" value=\"双向\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n            <!-- <el-form-item label=\"速度阈值\" v-if=\"form.type=='区域'\">\r\n            <el-input-number v-model=\"form.StoppingSpeed\" :precision=\"1\" :step=\"0.1\"></el-input-number>\r\n          </el-form-item> -->\r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmit(form)\">确认</el-button>\r\n            <el-button  @click=\"closeFigure(form)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n        </div> \r\n     \r\n       \r\n</el-drawer>\r\n      <!-- 组件弹框 -->\r\n        <el-dialog :title=\"componentTitle+'指标组件'\" width=\"40%\" :visible.sync=\"component\">\r\n        <el-form ref=\"form\" :model=\"componentForm\" label-width=\"150px\" @close='closeComponentForm()'>\r\n          <el-form-item label=\"名称：\">\r\n            <el-input v-model=\"componentForm.componentName\"></el-input>\r\n          </el-form-item>\r\n          \r\n           <el-form-item label=\"类型筛选：\" v-if=\"componentForm.componentType=='类型'\">\r\n            <el-checkbox-group v-model=\"componentForm.typeFiltering\" >\r\n              <el-checkbox v-for=\"item in typeData\" :label=\"item\" :key=\"item\" >{{item}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"数值筛选：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-input-number v-model=\"componentForm.startValue\"></el-input-number>\r\n            <el-input-number v-model=\"componentForm.endValue\" style=\"margin-left:5%\"></el-input-number>\r\n          </el-form-item>\r\n          <el-form-item label=\"时间模式：\">\r\n            <el-select v-model=\"componentForm.timeMode\" placeholder=\"请选择时间模式\">\r\n              <el-option label=\"触发\" value=\"touch\"></el-option>\r\n              <el-option label=\"周期时刻\" value=\"timeing\"  v-if=\"componentForm.componentType!='排队数'&&componentForm.componentType!='检测数'&&componentForm.componentType!='延误'&&componentForm.componentType!='拥堵'\"></el-option>\r\n              <el-option label=\"周期统计\" value=\"date\" v-if=\"componentForm.componentType!='OD'\"></el-option>\r\n            </el-select>\r\n          </el-form-item>\r\n          <!-- <el-form-item label=\"触发类型：\" v-if=\"componentForm.timeModel=='touch'\">\r\n          <el-radio-group v-model=\"componentForm.touchType\" >\r\n            <el-radio label=\"实时（触发）\"></el-radio>\r\n            <el-radio label=\"间隔\"></el-radio>\r\n          </el-radio-group>\r\n        </el-form-item> -->\r\n        <el-form-item label=\"周期间隔：\">\r\n          <!-- <el-slider v-model=\"componentForm.cycleInterval\" show-input>\r\n            </el-slider> -->\r\n            <el-slider v-model=\"componentForm.cycleInterval\">\r\n            </el-slider>\r\n             <el-select v-model=\"componentForm.company\" placeholder=\"请选择单位\">\r\n              <!-- <el-option label=\"秒\" value=\"ss\"></el-option>\r\n              <el-option label=\"分钟\" value=\"mm\"></el-option>\r\n              <el-option label=\"小时\" value=\"hh\"></el-option>\r\n              <el-option label=\"天\" value=\"dd\"></el-option> -->\r\n              <el-option\r\n\t\t\t   v-for=\"item in timeSelect\"\r\n\t\t\t   :key=\"item.value\"\r\n\t\t\t   :label=\"item.label\"\r\n\t\t\t   :value=\"item.value\"\r\n\t\t\t ></el-option>\r\n            </el-select>\r\n        </el-form-item>\r\n        <!-- <el-form-item label=\"单位：\" >\r\n         \r\n        </el-form-item> -->\r\n        <el-form-item label=\"起点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.startSection\" @change=\"handleCheckedStartSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n          <el-form-item label=\"终点：\" v-if=\"componentForm.componentType=='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.endSection\" @change=\"handleCheckedendSection\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group>\r\n          </el-form-item>\r\n         <el-form-item label=\"展现形式：\" v-if=\"componentForm.componentType!='OD'\">\r\n            <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox label=\"数值\" name=\"type\" ></el-checkbox>\r\n              <el-checkbox label=\"表格\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n              <el-checkbox label=\"时间曲线图\" name=\"type\"></el-checkbox>\r\n               <el-checkbox label=\"直方图\" name=\"type\"  v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n                <el-checkbox label=\"饼状图\" name=\"type\" v-if=\"componentForm.componentType=='类型'\"></el-checkbox>\r\n              <el-checkbox label=\"均值图\" name=\"type\" v-if=\"componentForm.componentType!='拥堵'\"></el-checkbox>\r\n             \r\n            </el-checkbox-group>\r\n             <!-- <el-checkbox-group v-model=\"componentForm.presentation\" @change=\"handlePresentation\">\r\n              <el-checkbox v-for=\"item in sectionals\" :label=\"item.graphicName\" :key=\"item.graphicId\" >{{item.graphicName}}</el-checkbox>\r\n            </el-checkbox-group> -->\r\n          </el-form-item>\r\n          \r\n          <el-form-item>\r\n            <el-button type=\"primary\" @click=\"onSubmitComponent(componentForm)\">确认</el-button>\r\n            <el-button @click=\"closeComponent(componentForm)\">取消</el-button>\r\n          </el-form-item>\r\n        </el-form>\r\n      </el-dialog>\r\n    \r\n      \r\n    <!-- </div> -->\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\n// import mqtt from \"mqtt\"; // mqtt协议\r\nimport editModal from \"@/views/bounced/maintenanceRemind\";\r\nimport analysisConfiguration from \"@/views/bounced/analysisConfiguration\";\r\nimport dataBoard from \"@/views/bounced/dataBoard\";\r\nimport {getComponentData,getSectionalData} from \"../api/index\";\r\nimport  serverUrl from \"../config/apiurl.js\"\r\nimport axios from 'axios'\r\n// mqtt\r\n// import mqttHandle from \"../../../utils/mqttHandle\";\r\nimport mqttConfig from \"@/utils/mqttConfig.js\";\r\nvar mqtt; //mqtt 处理对象（全局变量）\r\nvar client;\r\n// var topicSends; //订阅的topic 例如：[\"Time1\", \"EngineMain1\", \"Console1\", \"Location1\"]\r\n \r\nexport default {\r\n  data() {\r\n    return {\r\n        receiveNews: \"\",\r\n        topicSends:['img0','stream0','trajectory0','detection0'],\r\n      trajectory:false,//轨迹\r\n      hideBoxShow: true, //隐藏箱子按钮显示隐藏\r\n      closeStatus: null,\r\n      modelOthers: false,\r\n      componentShow: \"\",\r\n      isShowBtn: true, //菜单按钮隐藏\r\n      isShowBtn1: false, //菜单按钮显示\r\n      inputVal: \"\",\r\n      dialogFormVisible: false,\r\n      areaComponent: false,\r\n      indexModule: false,\r\n      speed: false,\r\n      component:false,\r\n      sectionals:[],\r\n      activeName:'first',\r\n      VideoId:'',\r\n      title:'断面',\r\n      componentTitle:'速度',\r\n      form: {\r\n        name: '',\r\n        type:'',\r\n        id:'',\r\n        coordinate:'',\r\n        Direction:'正向',\r\n        StoppingSpeed:'5'\r\n      },\r\n      //初始图形名称\r\n    startFigureName:'',\r\n      areaComponentform: {\r\n        name: '',\r\n        region: '',\r\n        date1: '',\r\n        date2: '',\r\n        delivery: false,\r\n        type: [],\r\n        resource: '实时（触发）',\r\n        desc: ''\r\n      },\r\n      timeSelect:[\r\n        {\r\n         label:'秒',\r\n         value:'秒'   \r\n        },{\r\n          label:'分钟',\r\n         value:'分钟'  \r\n        },{\r\n          label:'小时',\r\n         value:'小时'  \r\n        },{\r\n          label:'天',\r\n         value:'天'  \r\n        }\r\n      ],\r\n      componentForm:{\r\n        //单位\r\n        company: \"秒\",\r\n        componentName: \"\",\r\n        componentParameterId: \"01888e05fac246b29e3a19a27c3d2ab0\",\r\n        //周期间隔\r\n        cycleInterval: \"\",\r\n        startSectionIds: \"\",\r\n        startSectionNames: \"\",\r\n        endSectionIds: \"\",\r\n        endSectionNames: \"\",\r\n        endValue: \"\",\r\n        //展现形式\r\n        presentationForm: \"\",\r\n        presentation:[],\r\n        startValue: \"\",\r\n        timeMode: \"触发\",\r\n        type: \"\",\r\n        startSection:[],\r\n        endSection:[],\r\n        componentType: \"\",\r\n        typeFiltering:''\r\n    },\r\n    typeData:[\"小汽车\",\"公交车\",\"卡车\",\"非机动车\",\"行人\"],\r\n    //展现形式\r\n    presentation:['数值','表格','时间曲线图','均值图'],\r\n\r\n      trackForm:{\r\n        name:\"\"\r\n      },\r\n      //   dateTime: this.$moment(new Date()).format(\"LL\"),\r\n      nowTime: \"\",\r\n      //   weekday: this.$moment().format(\"dddd\"),\r\n      ins: 0,\r\n      imgUrl: '',\r\n      imgUrl1: '',\r\n      imgUrl2: '',\r\n      imgUrl3: '',\r\n      imgUrl4: '',\r\n      imgUrl5: '',\r\n      btnPic: [],\r\n      Data: [\r\n        {\r\n          title: 'xx路口',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '数据看板',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        },\r\n        {\r\n          title: '分析配置',\r\n          url: ''\r\n        }\r\n      ],\r\n      messageInfo: [],\r\n      orderList: [],\r\n      enterList: [],\r\n      stockInfo: [],\r\n      perCent: 0,\r\n      perCent1: 0,\r\n      perCent2: 0,\r\n      facToal: \"\",\r\n      wbContent: '',\r\n      //   wxContent:'',\r\n      inContent: '',\r\n      outContent: '',\r\n      containerDetails: \"\",\r\n      locdesc: '',\r\n      weatherItem: {},\r\n      loadingShow1: true,\r\n      number:'',\r\n      componentId:''\r\n    //   carInfo: [], //小车信息\r\n    //   carName: '',\r\n    //   palletizerInfo: [], //码垛机信息\r\n    //   palletizerName: '',\r\n    //   destackerInfo: [], //拆垛机信息\r\n    //   destackerName: '',\r\n    //   hoistInfo: [], //提升机信息’\r\n    //   hoistName: '',\r\n    //   battaryStationInfo: [],//快换电池装置\r\n    //   battaryStationName: \"\",\r\n    //   conveyorInfo: [], //输送机信息\r\n    //   conveyorName: \"\",\r\n    };\r\n  },\r\n  mounted() {\r\n    window.getFigure = this.getFigureD;\r\n    window.getModifyTheName = this.getModifyTheNameN;\r\n    // window.getModifyTheName = this.getModifyTheNameN;\r\n    window.getSingleComponentId = this.getSingleComponentIdN;\r\n    window.getSimulationAreaEdit = this.getSimulationAreaEdit;\r\n  window.OnScene = this.OnSceneN;\r\n    this.getAllSectionalData(this.$route.query.id)\r\n    this.VideoId = this.$route.query.id\r\n    this.number = this.$route.query.num\r\n    //   this.getSingleComponentIdN()\r\n  },\r\n  created() {\r\n    // this.testMqtt()\r\n   this.componentForm.company = this.timeSelect[0].value;\r\n   this.createMqtt();\r\n  },\r\n  methods: {\r\n     /** 创建mqtt */\r\n    createMqtt() {\r\n      //创建链接，接收数据\r\n      \r\n      mqtt = new mqttConfig(this.topicSends);\r\n      client = mqtt.createConnect();\r\n    client.subscribe(['img'+this.number,'stream'+this.number, 'trajectory'+this.number, 'detection'+this.number], { qos: 0 }, (err)=> {\r\n          if (!err) {\r\n            console.log(\"订阅成功\");\r\n            client.publish('msg_stream',JSON.stringify({\"msg_flag\":parseInt(this.number)})) \r\n          } else {\r\n            console.log('消息订阅失败！')\r\n          }\r\n          \r\n        }); \r\n      client.on(\"message\", (topic, message) => {\r\n        //数据分类\r\n        try {\r\n        //   this.receiveNews = this.receiveNews.concat(message);\r\n        //   this.realInfo(topic, this.receiveNews);\r\n          this.realInfo(topic, message);\r\n        } catch (error) {\r\n\r\n        }\r\n      });\r\n    },\r\n    //停止订阅mqtt\r\n    disConnect() {\r\n      if (client != null) {\r\n        client.unsubscribe(this.topicSends);\r\n        client = null;\r\n      }\r\n    },\r\n    /** 实时数据分类 */\r\n    realInfo(topic, message) {\r\n      switch (topic) {\r\n        // 接收托片\r\n        case \"img0\":\r\n        case \"img1\":\r\n        case \"img2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n                document.getElementById(\"mapModule\").contentWindow.getDestination(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 树结构\r\n        case \"stream0\":\r\n        case \"stream1\":\r\n        case \"stream2\":\r\n          try {\r\n            const utf8decoder1 = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n              const temp = utf8decoder1.decode(u8arr)\t// 将二进制数据转为字符串\r\n              const msg = JSON.parse(temp)\r\n                document.getElementById(\"mapModule\").contentWindow.getData(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 控制台输出\r\n        case \"trajectory0\":\r\n        case \"trajectory1\":\r\n        case \"trajectory2\":\r\n        case \"trajectory3\":\r\n          try {\r\n            const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //    console.log(\"message11\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp11\",temp)\r\n              const msg = JSON.parse(temp)\r\n                //  console.log(\"msg11\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getGuiJi(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n        // 触发\r\n        case \"detection0\":\r\n        case \"detection1\":\r\n        case \"detection2\":\r\n          try {\r\n             const utf8decoder = new TextDecoder()\r\n              const u8arr = new Uint8Array(message)\r\n            //   console.log(\"message\",message)\r\n              const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n            //   console.log(\"temp\",temp)\r\n              const msg = JSON.parse(temp)\r\n            //   console.log(\"msg\",msg)\r\n                document.getElementById(\"mapModule\").contentWindow.getChuFa(JSON.stringify(msg))\r\n          } catch (error) {}\r\n          break;\r\n      }\r\n      this.receiveNews = \"\";\r\n    },\r\n    // handleClick(tab, event) {\r\n    //     console.log(tab, event);\r\n    //   },\r\n   \r\n    //初始化unity\r\n    OnSceneN(){\r\n         document.getElementById(\"mapModule\").contentWindow.postVideoId(JSON.stringify(this.$route.query.id))\r\n    },\r\n    // //新增组件根据组件id获取单个组件数据\r\n    getSingleComponentIdN(id,type,name){\r\n        console.log(\"id\",id)\r\n        console.log(\"type\",type)\r\n        console.log(\"name\",name)\r\n        this.componentId = id\r\n        this.componentForm.componentType = type\r\n        this.componentTitle = type\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n    },\r\n    //修改模拟区组件、图形\r\n    getSimulationAreaEdit(id,type,componentType,name){\r\n        if(type=='图形'){\r\n        this.form.id = id\r\n        this.form.name = name\r\n        this.form.type = componentType\r\n        this.startFigureName = name\r\n        if(this.form.type=='轨迹'){\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n        }else if(type=='组件'){\r\n            this.componentId = id\r\n        this.componentForm.componentType = componentType\r\n        this.componentTitle = componentType\r\n         getComponentData({AnalogAreaComponentId:id}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n            console.log(\"res\",res.data.data)\r\n           this.component=true\r\n           if(res.data.data.company!=''){\r\n            this.componentForm.company = res.data.data.company\r\n           }\r\n           if(res.data.data.timeMode!=''){\r\n            this.componentForm.timeMode = res.data.data.timeMode\r\n           }\r\n            this.componentForm.componentName = res.data.data.componentName+'-'+type\r\n            this.componentForm.componentParameterId = res.data.data.componentParameterId\r\n            this.componentForm.cycleInterval = res.data.data.cycleInterval\r\n            this.componentForm.startSectionIds = res.data.data.startSectionIds\r\n            this.componentForm.startSectionNames = res.data.data.startSectionNames\r\n            this.componentForm.endSectionIds = res.data.data.endSectionIds\r\n            this.componentForm.endSectionNames = res.data.data.endSectionNames\r\n            this.componentForm.endValue = res.data.data.endValue\r\n            this.componentForm.startValue = res.data.data.startValue\r\n            this.componentForm.presentationForm = res.data.data.presentationForm\r\n            this.componentForm.type = res.data.data.type\r\n            if(res.data.data.startSectionIds!=''){\r\n                console.log(\"startSectionIds\",res.data.data.startSectionIds)\r\n                var startSectionIdArr = []\r\n                var startSectionArr = []\r\n                startSectionIdArr  = res.data.data.startSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"startSectionIdArr\",startSectionIdArr)\r\n                startSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n\r\n                    startSectionArr.push(items.graphicName);\r\n                   this.componentForm.startSection = startSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.endSectionIds!=''){\r\n                console.log(\"endSectionIds\",res.data.data.endSectionIds)\r\n                var endSectionIdArr = []\r\n                var endSectionArr = []\r\n                endSectionIdArr  = res.data.data.endSectionIds.split(',')\r\n                console.log(\"this.sectionals\",this.sectionals)\r\n                console.log(\"endSectionIdArr\",endSectionIdArr)\r\n                endSectionIdArr.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicId) {\r\n                  endSectionArr.push(items.graphicName);\r\n                   this.componentForm.endSection = endSectionArr\r\n                }\r\n                });\r\n            });\r\n            }\r\n            if(res.data.data.presentationForm!=''){\r\n                var presentationN = []\r\n                presentationN  = res.data.data.presentationForm.split(',')\r\n                this.componentForm.presentation = presentationN\r\n            }\r\n        }\r\n        })\r\n        }\r\n    },\r\n    //获取所有断面数据\r\n    getAllSectionalData(VideoId){\r\n       getSectionalData({VideoId:VideoId}).then(res=>{\r\n         console.log(\"res\",res)\r\n        if(res.data.code==200){\r\n          this.sectionals=res.data.data\r\n        }\r\n        }) \r\n    },\r\n    figureType(type) {\r\n    if (type == 'Move') {\r\n        type = '轨迹'\r\n    } else if (type == 'Poly') {\r\n        type = '区域'\r\n    } else if (type == 'Line') {\r\n        type = '断面'\r\n    }\r\n    return type\r\n    },\r\n    getFigureD(item,index,indexNew){\r\n        console.log(\"图形类型\",item)\r\n        console.log(\"初始图形名称\",index)\r\n        this.startFigureName = index\r\n        console.log(\"图形位置\",indexNew)\r\n         this.dialogFormVisible = true\r\n        this.form.name = index\r\n        this.form.type = this.figureType(item)\r\n        this.form.coordinate = indexNew\r\n        this.form.id = ''\r\n         this.title = this.figureType(item)\r\n       \r\n        \r\n    },\r\n    //双击图形修改图形名称弹框\r\n    getModifyTheNameN(data){\r\n        console.log(\"data\",data)\r\n        var arr = [];\r\n        arr  = data.split(',')\r\n        console.log(\"arr\",arr)\r\n        this.form.id = arr[0]\r\n        this.form.name = arr[1]\r\n        this.form.type = arr[2]\r\n        this.startFigureName = arr[1]\r\n        if(this.form.type=='轨迹'){\r\n            // this.open2()\r\n           this.dialogFormVisible = true\r\n        }else if(this.form.type=='区域'){\r\n            this.dialogFormVisible = true\r\n        }else if(this.form.type=='断面'){\r\n            this.dialogFormVisible = true\r\n        }\r\n    },\r\n    //新增、编辑图形确认按钮\r\n    onSubmit(form){ \r\n        console.log(\"form\",form)\r\n        //新增\r\n        if(form.id==''){\r\n            let formData = new FormData();\r\n            if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        formData.append(\"Direction\",form.Direction);\r\n            }else if(form.type=='区域'){\r\n                formData.append(\"GraphicName\",form.name);\r\n        formData.append(\"GraphicType\",form.type);\r\n        formData.append(\"Coordinate\",form.coordinate);\r\n        formData.append(\"VideoId\",this.VideoId);\r\n        // formData.append(\"Direction\",form.Direction);\r\n        // formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Coordinate\",form.coordinate);\r\n                formData.append(\"VideoId\",this.VideoId);\r\n                // formData.append(\"Direction\",form.Direction);\r\n            }\r\n        \r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.addFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(res.data.data+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n        }else{\r\n            //编辑\r\n            let formData = new FormData();\r\n             if(form.type=='断面'){\r\n                formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }else if(form.type=='区域'){\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n        formData.append(\"StoppingSpeed\",form.StoppingSpeed);\r\n            }else{\r\n                 formData.append(\"GraphicName\",form.name);\r\n                formData.append(\"GraphicType\",form.type);\r\n                // formData.append(\"Direction\",form.Direction);\r\n                formData.append(\"GraphicId\",form.id);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editFigure,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                console.log(\"startFigureName\",this.startFigureName)\r\n                // document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureName(JSON.stringify(form.id+','+form.name+','+this.startFigureName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n\r\n        }\r\n         \r\n    },\r\n    //新增编辑组件取消\r\n    onSubmitComponent(componentForm){\r\n        this.component = false\r\n        let formData = new FormData();\r\n             if(componentForm.componentType=='OD'){\r\n                 //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"startSectionIds\",componentForm.startSectionIds);\r\n                formData.append(\"startSectionNames\",componentForm.startSectionNames);\r\n                formData.append(\"endSectionIds\",componentForm.endSectionIds);\r\n                formData.append(\"endSectionNames\",componentForm.endSectionNames);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",'矩阵图');\r\n                formData.append(\"type\",componentForm.type);\r\n             }else{\r\n                  //名称\r\n                formData.append(\"componentName\",componentForm.componentName);\r\n                //单位\r\n                formData.append(\"company\",componentForm.company);\r\n                //id\r\n                formData.append(\"componentParameterId\",componentForm.componentParameterId);\r\n                formData.append(\"cycleInterval\",componentForm.cycleInterval);\r\n                formData.append(\"endValue\",componentForm.endValue);\r\n                formData.append(\"startValue\",componentForm.startValue);\r\n                formData.append(\"timeMode\",componentForm.timeMode);\r\n                formData.append(\"presentationForm\",componentForm.presentationForm);\r\n                formData.append(\"type\",componentForm.type);\r\n             }\r\n        axios({\r\n                method: \"post\",\r\n                url: serverUrl.editComponent,\r\n                data:formData\r\n              }).then((res) => {\r\n                    console.log(\"res\",res)\r\n                     \r\n                     if(res.data.code==200){\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'success'\r\n                });\r\n                document.getElementById(\"mapModule\").contentWindow.postFigureId(JSON.stringify(res.data.data))\r\n                document.getElementById(\"mapModule\").contentWindow.editComponent(JSON.stringify(this.componentId+','+componentForm.componentName))\r\n                this.dialogFormVisible = false\r\n               }else{\r\n                 this.$message({\r\n                  message: res.data.msg,\r\n                  type: 'warning'\r\n                });\r\n               }\r\n              })\r\n    },\r\n     //新增编辑组件取消\r\n     closeComponent(componentForm){\r\n        this.component = false\r\n    }, \r\n    //新增、编辑图形取消按钮\r\n    closeFigure(form){\r\n        console.log(\"form\",form)\r\n        if(form.id!=''){\r\n            this.dialogFormVisible = false\r\n            // document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n       \r\n    },\r\n    closeComponentForm(){\r\n        this.component = false\r\n    },\r\n    closeForm(form){\r\n        \r\n        if(this.form.id!=''){\r\n            this.dialogFormVisible = false\r\n            document.getElementById(\"mapModule\").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))\r\n            //  document.getElementById(\"mapModule\").contentWindow.closeEdit(form.type,form.id)\r\n        }else{\r\n             this.dialogFormVisible = false\r\n        document.getElementById(\"mapModule\").contentWindow.delFigure()\r\n        }\r\n    },\r\n    //改变起点\r\n    handleCheckedStartSection(value){\r\n        console.log(\"改变起点\",value)\r\n        var startSectionIdArr = []\r\n        var startSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    startSectionIdArr.push(items.graphicId);\r\n                    startSectionNameArr.push(items.graphicName);\r\n                    let newStartSectionId = startSectionIdArr.join(\",\")\r\n                    let newStartSectionName = startSectionNameArr.join(\",\")\r\n                   this.componentForm.startSectionIds = newStartSectionId\r\n                   this.componentForm.startSectionNames = newStartSectionName\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //改变终点\r\n    handleCheckedendSection(value){\r\n        console.log(\"改变终点\",value)\r\n         var endSectionIdArr = []\r\n        var endSectionNameArr = []\r\n                value.forEach((item) => {\r\n                this.sectionals.forEach((items) => {\r\n                if (item == items.graphicName) {\r\n                    endSectionIdArr.push(items.graphicId);\r\n                    endSectionNameArr.push(items.graphicName);\r\n                    let newendSectionId = endSectionIdArr.join(\",\")\r\n                    let newEndSectionName = endSectionNameArr.join(\",\")\r\n                    console.log(\"newendSectionId\",newendSectionId)\r\n                    console.log(\"newEndSectionName\",newEndSectionName)\r\n                   this.componentForm.endSectionIds = newendSectionId\r\n                   this.componentForm.endSectionNames = newEndSectionName\r\n\r\n                }\r\n                });\r\n            });\r\n    },\r\n    //修改展现形式\r\n    handlePresentation(value){\r\n         console.log(\"展现形式\",value)\r\n          let presentation = value.join(\",\")\r\n          this.componentForm.presentationForm = presentation\r\n          console.log(\"this.componentForm.presentationForm\",this.componentForm.presentationForm)\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data) {\r\n      this.loadingShow1 = data\r\n    },\r\n\r\n   \r\n\r\n    handleSearch() {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(this.inputVal);\r\n      console.log(this.$refs.htModels, 'asdasdasd');\r\n      this.inputVal = ''\r\n    },\r\n    handleRow(val) {\r\n      this.modelOthers = true;\r\n      this.$refs.htModels.finbBox(val);\r\n    },\r\n    // 天气\r\n    handleWather() {\r\n      axios({ url: 'https://restapi.amap.com/v3/weather/weatherInfo?key=bc2b906032fdd8a63cbd0790d656b1d7&city=620100', methods: '' }).then(res => {\r\n        this.weatherItem = res.data.lives[0]\r\n        console.log(this.weatherItem, 'asdsads');\r\n      })\r\n    },\r\n    Onweather(name) {\r\n    },\r\n    //隐藏箱子\r\n    hideBox() {\r\n      this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    editModal,\r\n    analysisConfiguration,\r\n    dataBoard\r\n  },\r\n};\r\n</script>\r\n<style scoped>\r\n.el-form-item {\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.content-box::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog{\r\n      width: 49%;\r\n    height: 29%;\r\n    left: calc(26vw);\r\n    top: 71vh;\r\n    bottom: 0 /* right:auto;; */;\r\n}\r\n.formBox{\r\n    margin-top: 20px;\r\n     margin-left: 20px;\r\n}\r\n/* .new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0vh auto !important;\r\n        margin-top: 0vh!important;\r\n} */\r\n.new-dialog .el-dialog {\r\n    width:100%!important;\r\n        margin: 0 auto 0px!important;\r\n        /* margin-top: 0vh!important; */\r\n}\r\n.new-dialog .el-dialog__wrapper::-webkit-scrollbar {\r\n    display: none; /* Chrome Safari */\r\n}\r\n.new-dialog .customWidth{\r\n    width: 100%;\r\nmin-width: 150px;\r\n}\r\n.mapModuleApp{\r\n    /* width:100%; */\r\n    width:1600px;\r\n    height:900px;\r\n    display:inline-block;\r\n    border:1px soild #eee;\r\n}\r\n\r\n</style>\r\n"]}]}
\ No newline at end of file