{"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":1671158425344},{"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\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\n\r\n\r\n\r\nimport axios from 'axios'\r\nexport default {\r\n  data() {\r\n    return {\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    //   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        // require(\"@/assets/images/homeActive.png\"),\r\n        // require(\"@/assets/images/battery.png\"),\r\n        // require(\"@/assets/images/stock.png\"),\r\n        // require(\"@/assets/images/productionInformation.png\"),\r\n        // require(\"@/assets/images/equipment.png\"),\r\n        // require(\"@/assets/images/operationMG.png\"),\r\n      ],\r\n      statusInfo: [\r\n        {\r\n          count: 15,\r\n          name: \"穿梭车在线数量\",\r\n        //   icon: require(\"../assets/images/运行设备图标.png\"),\r\n          color: \"#01A8FC\",\r\n        },\r\n        {\r\n          count: 26,\r\n          name: \"任务数量\",\r\n        //   icon: require(\"../assets/images/故障设备图标.png\"),\r\n          color: \"#FDA401\",\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      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\r\n    // this.getMessage();\r\n    // 消息提醒\r\n\r\n    // getfacKeepRecord({ type: 0 }).then((res) => {\r\n    //   this.messageInfo = this.messageInfo.concat(res.data);\r\n    //   console.log(this.messageInfo, \",,qweqw\");\r\n    //   // this.messageInfo.push(res.data[1]) \r\n    // });\r\n    // this.getDataByMqtt()\r\n    // this.getstatus();\r\n    // this.getInhouse();\r\n    // this.getOuthouse();\r\n    // this.handleWather();\r\n    // this.getDeviceStatusData()\r\n  },\r\n   created() {\r\n    this.testMqtt()\r\n    \r\n  },\r\n  methods: {\r\n     // 测试：mqtt测试\r\n    testMqtt() {\r\n         this.getDataByMqtt()\r\n      // 小车订阅\r\n    //   for (let key in this.carId) {\r\n    //     this.getDataByMqtt(\r\n    //       // \"ws:ht.mqtt.umayle.com:2022/mqtt\",\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"Car\" + key,\r\n    //       this.carId[key]\r\n    //     );\r\n    //   }\r\n    //   //输送机入库订阅\r\n    //   for (let i = 0; i < this.convoyorCIdGroup.length; i++) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"InConvoyor\" + this.convoyorCIdGroup[i],\r\n    //       this.convoyorCIdGroup[i]\r\n    //     );\r\n    //   }\r\n\r\n    //   //输送机出库订阅\r\n    //   for (let i = 0; i < this.outConvoyorCIdGroup.length; i++) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"OUTConvoyor\" + this.outConvoyorCIdGroup[i],\r\n    //       this.outConvoyorCIdGroup[i]\r\n    //     );\r\n    //   }\r\n\r\n    //   for (let key in this.BattaryArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"Battary_Sation\" + key,\r\n    //       this.BattaryArr[key]\r\n    //     );\r\n    //   }\r\n    //   // 升降机订阅elvArr\r\n    //   for (let key in this.elvArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"ELV\" + key,\r\n    //       this.elvArr[key]\r\n    //     );\r\n    //   }\r\n    //   // 拆码跺机订阅\r\n    //   for (let key in this.stampArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"INCMD\" + key,\r\n    //       this.stampArr[key]\r\n    //     );\r\n    //   }\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data){\r\n      this.loadingShow1 = data\r\n    },\r\n     // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\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 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        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        this.mqttClient.on(\"connect\", (connect) => {\r\n          console.log(\"[MQTT-TEST] 已连接的客户端ID: \",connect);\r\n            // 订阅\r\n           this.mqttClient.subscribe('img0', { qos: 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            this.mqttClient.subscribe('stream0', { qos: 0 });\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        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n          console.log(\"[MQTT-TEST] 已连接的客户端ID: \",message);\r\n    \r\n          console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          // 解析后端数据\r\n        //   let dataReceived = JSON.parse(message.toString());\r\n        //     console.log(\"[MQTT-TEST] 已连接的客户端ID: \",dataReceived);\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            //     console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n            //     this.imgUrl='data:image/png;base64,' + msg.pic;\r\n            //     console.log(\"imageUrl\",imageUrl)\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          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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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(\"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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl1='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl2='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl3='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl4='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl5='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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(\"stream0\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream0\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream1\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream2\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream3\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream4\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream5\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }\r\n         \r\n        });\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    //   switch (name) {\r\n\t// \t\t\t\tcase \"多云\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/Cloudy .png');\r\n\t// \t\t\t\tcase \"阴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/Cloudy .png')\r\n\t// \t\t\t\tcase \"暴雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainstorm.png')\r\n\t// \t\t\t\tcase \"冰雹\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/hail.png')\r\n\t// \t\t\t\tcase \"大风\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/gale.png')\r\n\t// \t\t\t\tcase \"大雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/bigsnow.png')\r\n\t// \t\t\t\tcase \"大雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/bigrain.png')\r\n\t// \t\t\t\tcase \"雷电\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/thunder.png')\r\n\t// \t\t\t\tcase \"雷阵雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/shower.png')\r\n\t// \t\t\t\tcase \"沙尘暴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/sand.png')\r\n\t// \t\t\t\tcase \"晴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/sun.png')\r\n\t// \t\t\t\tcase \"雾霾\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/smog.png')\r\n\t// \t\t\t\tcase \"小雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/snow.png')\r\n\t// \t\t\t\tcase \"小雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rain.png')\r\n\t// \t\t\t\tcase \"雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainlitter.png')\r\n\t// \t\t\t\tcase \"多云\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/night.png')\r\n\t// \t\t\t\tcase \"雨夹雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainsnow.png')\r\n\t// \t\t\t\tcase \"月亮\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/moon.png')\r\n\t// \t\t\t\tcase \"中雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/mieddlesnow.png')\r\n\t// \t\t\t\tcase \"中雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/middlerain.png')\r\n\t// \t\t\t}\r\n    },\r\n    //隐藏箱子\r\n    hideBox(){\r\n        this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    // echars,\r\n    // echarts1,\r\n    // echarts2,\r\n    // HomeLeft\r\n    // home,\r\n    // equipmentManage,\r\n    // batteryManagement, // 电池管理弹窗\r\n    // productionInformation, // 生产信息弹窗\r\n    // deviceManagement, // 设备信息弹窗\r\n    // operationMaintenance, // 运维指导弹窗\r\n    // container, // 货箱弹窗\r\n    // palletizer, // 码垛机弹窗\r\n    // packingStation, // 装箱站弹窗\r\n    // destacker, // 拆垛机弹窗\r\n    // hoist, // 提升机弹窗\r\n    // suttleCar, // 穿梭车弹窗\r\n    // battery, //电池设备弹窗\r\n    // wireFeeder, // 出库工单弹窗\r\n    // inFeeder,//入库工单弹窗\r\n    // lnventory,\r\n    // equipmentInspection, //设备巡检弹窗\r\n    // maintenance, //维保提醒\r\n    // maintenanceRemind,\r\n    // lnventoryLeft,\r\n    // maintenanceRemindTable,\r\n    // conveyor,// 输送机弹窗\r\n  },\r\n};\r\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA;;;;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;;AAEA;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;;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;;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;;;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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  <div class=\"container\">\r\n\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>\r\n</template>\r\n\r\n<script>\r\n\r\nimport mqtt from \"mqtt\"; // mqtt协议\r\n\r\n\r\n\r\nimport axios from 'axios'\r\nexport default {\r\n  data() {\r\n    return {\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    //   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        // require(\"@/assets/images/homeActive.png\"),\r\n        // require(\"@/assets/images/battery.png\"),\r\n        // require(\"@/assets/images/stock.png\"),\r\n        // require(\"@/assets/images/productionInformation.png\"),\r\n        // require(\"@/assets/images/equipment.png\"),\r\n        // require(\"@/assets/images/operationMG.png\"),\r\n      ],\r\n      statusInfo: [\r\n        {\r\n          count: 15,\r\n          name: \"穿梭车在线数量\",\r\n        //   icon: require(\"../assets/images/运行设备图标.png\"),\r\n          color: \"#01A8FC\",\r\n        },\r\n        {\r\n          count: 26,\r\n          name: \"任务数量\",\r\n        //   icon: require(\"../assets/images/故障设备图标.png\"),\r\n          color: \"#FDA401\",\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      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\r\n    // this.getMessage();\r\n    // 消息提醒\r\n\r\n    // getfacKeepRecord({ type: 0 }).then((res) => {\r\n    //   this.messageInfo = this.messageInfo.concat(res.data);\r\n    //   console.log(this.messageInfo, \",,qweqw\");\r\n    //   // this.messageInfo.push(res.data[1]) \r\n    // });\r\n    // this.getDataByMqtt()\r\n    // this.getstatus();\r\n    // this.getInhouse();\r\n    // this.getOuthouse();\r\n    // this.handleWather();\r\n    // this.getDeviceStatusData()\r\n  },\r\n   created() {\r\n    this.testMqtt()\r\n    \r\n  },\r\n  methods: {\r\n     // 测试：mqtt测试\r\n    testMqtt() {\r\n         this.getDataByMqtt()\r\n      // 小车订阅\r\n    //   for (let key in this.carId) {\r\n    //     this.getDataByMqtt(\r\n    //       // \"ws:ht.mqtt.umayle.com:2022/mqtt\",\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"Car\" + key,\r\n    //       this.carId[key]\r\n    //     );\r\n    //   }\r\n    //   //输送机入库订阅\r\n    //   for (let i = 0; i < this.convoyorCIdGroup.length; i++) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"InConvoyor\" + this.convoyorCIdGroup[i],\r\n    //       this.convoyorCIdGroup[i]\r\n    //     );\r\n    //   }\r\n\r\n    //   //输送机出库订阅\r\n    //   for (let i = 0; i < this.outConvoyorCIdGroup.length; i++) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"OUTConvoyor\" + this.outConvoyorCIdGroup[i],\r\n    //       this.outConvoyorCIdGroup[i]\r\n    //     );\r\n    //   }\r\n\r\n    //   for (let key in this.BattaryArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"Battary_Sation\" + key,\r\n    //       this.BattaryArr[key]\r\n    //     );\r\n    //   }\r\n    //   // 升降机订阅elvArr\r\n    //   for (let key in this.elvArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"ELV\" + key,\r\n    //       this.elvArr[key]\r\n    //     );\r\n    //   }\r\n    //   // 拆码跺机订阅\r\n    //   for (let key in this.stampArr) {\r\n    //     this.getDataByMqtt(\r\n    //       \"ws:220.163.114.157:8083/mqtt\",\r\n    //       \"INCMD\" + key,\r\n    //       this.stampArr[key]\r\n    //     );\r\n    //   }\r\n    },\r\n    //模型加载等待\r\n    loadingShow(data){\r\n      this.loadingShow1 = data\r\n    },\r\n     // mqtt订阅（独立）\r\n    getDataByMqtt(url, topic, cIdNum) {\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 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        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        this.mqttClient.on(\"connect\", (connect) => {\r\n          console.log(\"[MQTT-TEST] 已连接的客户端ID: \",connect);\r\n            // 订阅\r\n           this.mqttClient.subscribe('img0', { qos: 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            this.mqttClient.subscribe('stream0', { qos: 0 });\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        this.mqttClient.on(\"message\", (topic, message, packet) => {\r\n          console.log(\"[MQTT-TEST] 已连接的客户端ID: \",message);\r\n    \r\n          console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          // 解析后端数据\r\n        //   let dataReceived = JSON.parse(message.toString());\r\n        //     console.log(\"[MQTT-TEST] 已连接的客户端ID: \",dataReceived);\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            //     console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n            //     this.imgUrl='data:image/png;base64,' + msg.pic;\r\n            //     console.log(\"imageUrl\",imageUrl)\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          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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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(\"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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl1='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl2='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl3='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl4='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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                console.log(\"msg\",msg)   //msg为转换后的JSON数据\r\n                this.imgUrl5='data:image/png;base64,' + msg.pic;\r\n                console.log(\"imageUrl\",imageUrl)\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(\"stream0\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream0\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream1\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream2\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream3\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream4\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }else if (topic.indexOf(\"stream5\") != -1) {\r\n            console.log(\r\n            `[MQTT-TEST] 从主题 \"${topic}\" 收到的内容: ${message.toString()}`,\r\n            new Date(),\r\n            new Date().getMilliseconds()\r\n          );\r\n          }\r\n         \r\n        });\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    //   switch (name) {\r\n\t// \t\t\t\tcase \"多云\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/Cloudy .png');\r\n\t// \t\t\t\tcase \"阴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/Cloudy .png')\r\n\t// \t\t\t\tcase \"暴雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainstorm.png')\r\n\t// \t\t\t\tcase \"冰雹\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/hail.png')\r\n\t// \t\t\t\tcase \"大风\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/gale.png')\r\n\t// \t\t\t\tcase \"大雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/bigsnow.png')\r\n\t// \t\t\t\tcase \"大雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/bigrain.png')\r\n\t// \t\t\t\tcase \"雷电\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/thunder.png')\r\n\t// \t\t\t\tcase \"雷阵雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/shower.png')\r\n\t// \t\t\t\tcase \"沙尘暴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/sand.png')\r\n\t// \t\t\t\tcase \"晴\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/sun.png')\r\n\t// \t\t\t\tcase \"雾霾\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/smog.png')\r\n\t// \t\t\t\tcase \"小雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/snow.png')\r\n\t// \t\t\t\tcase \"小雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rain.png')\r\n\t// \t\t\t\tcase \"雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainlitter.png')\r\n\t// \t\t\t\tcase \"多云\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/night.png')\r\n\t// \t\t\t\tcase \"雨夹雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/rainsnow.png')\r\n\t// \t\t\t\tcase \"月亮\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/moon.png')\r\n\t// \t\t\t\tcase \"中雪\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/mieddlesnow.png')\r\n\t// \t\t\t\tcase \"中雨\":\r\n\t// \t\t\t\t\treturn require('../assets/weather/middlerain.png')\r\n\t// \t\t\t}\r\n    },\r\n    //隐藏箱子\r\n    hideBox(){\r\n        this.$refs.htModels.handleFirstBox();\r\n    }\r\n  },\r\n  components: {\r\n    // echars,\r\n    // echarts1,\r\n    // echarts2,\r\n    // HomeLeft\r\n    // home,\r\n    // equipmentManage,\r\n    // batteryManagement, // 电池管理弹窗\r\n    // productionInformation, // 生产信息弹窗\r\n    // deviceManagement, // 设备信息弹窗\r\n    // operationMaintenance, // 运维指导弹窗\r\n    // container, // 货箱弹窗\r\n    // palletizer, // 码垛机弹窗\r\n    // packingStation, // 装箱站弹窗\r\n    // destacker, // 拆垛机弹窗\r\n    // hoist, // 提升机弹窗\r\n    // suttleCar, // 穿梭车弹窗\r\n    // battery, //电池设备弹窗\r\n    // wireFeeder, // 出库工单弹窗\r\n    // inFeeder,//入库工单弹窗\r\n    // lnventory,\r\n    // equipmentInspection, //设备巡检弹窗\r\n    // maintenance, //维保提醒\r\n    // maintenanceRemind,\r\n    // lnventoryLeft,\r\n    // maintenanceRemindTable,\r\n    // conveyor,// 输送机弹窗\r\n  },\r\n};\r\n</script>\r\n<style>\r\n.el-header, .el-footer {\r\n    background-color: #B3C0D1;\r\n    color: #333;\r\n    text-align: center;\r\n    line-height: 60px;\r\n  }\r\n  \r\n  .el-aside {\r\n    background-color: #D3DCE6;\r\n    color: #333;\r\n    text-align: center;\r\n    line-height: 200px;\r\n  }\r\n  \r\n  .el-main {\r\n    background-color: #E9EEF3;\r\n    color: #333;\r\n    text-align: center;\r\n    line-height: 160px;\r\n  }\r\n  \r\n  body > .el-container {\r\n    margin-bottom: 40px;\r\n  }\r\n  \r\n  .el-container:nth-child(5) .el-aside,\r\n  .el-container:nth-child(6) .el-aside {\r\n    line-height: 260px;\r\n  }\r\n  \r\n  .el-container:nth-child(7) .el-aside {\r\n    line-height: 320px;\r\n  }\r\n</style>\r\n"]}]}