<template>
  <div :class="$style['div']">
    <div class="box">
      <div class="box-border">
        <ul class="box-ul">
          <li>
            <div class="main-top">
              <div class="main-top-div1"></div>
              <div class="main-top-div2"></div>
            </div>
            <div class="main-bottom">
              <div class="synthesize">
                <div class="synthesize-top">
                  <div class="synthesizeMain-top">
                    <div></div>
                    <div>
                      <div class="synthesizeMain-top2-center"></div>
                    </div>
                  </div>
                  <div class="synthesizeMain-center">
                    <div class="synthesizeMain-center-box">
                      <div class="synthesizeMain-center-tip1" v-show="ismap">
                      <tip :val="synthesize[0]" msg=""></tip>
                    </div>
                    </div>
                    
                  </div>
                  <div class="synthesizeMain-bottom">
                    <div class="synthesizeMain-bottom-left">
                      <div></div>
                      <div></div>
                      <div></div>
                    </div>
                    <div class="synthesizeMain-bottom-right">
                      <div></div>
                      <div>
                        <div class="synthesizeMain-bottom-right-tip1" v-show="ismap">
                      <tip :val="synthesize[1]" msg=""></tip>
                    </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="synthesize-bottom">
                  <div class="Training"></div>
                  <div class="research">
                    <div class="research-left">
                      <div></div>
                      <div></div>
                    </div>
                    <div class="research-right">
                      <div>
                        <div class="research-right-tip1" v-show="ismap">
                      <tip :val="synthesize[2]" msg=""></tip>
                    </div>
                      </div>
                      <div></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="factory">
                <div class="factory-top">
                  <div class="Electric-control">
                    <div class="Electric-control-top">
                      <span class="staircase">楼梯</span>
                      <div class="Electric-control-tip" v-show="ismap">
                        <tip :val="ElectricControl[0]" msg=""></tip>
                      </div>
                    </div>
                    <div class="Electric-control-bottom">
                      <span class="staircase">楼梯</span>
                      <div class="Electric-control-bottom-tip1" v-show="ismap">
                        <tip :val="ElectricControl[1]" msg=""></tip>
                      </div>
                      <div class="Electric-control-bottom-tip2" v-show="ismap">
                        <tip :val="ElectricControl[2]" msg=""></tip>
                      </div>
                    </div>
                  </div>
                  <div class="dress">
                    <div class="dress-top">
                      <div class="dress-top-tip2" v-show="ismap">
                        <tip :val="Dress[1]" msg=""></tip>
                      </div>
                      <div class="dress-top-tip3" v-show="ismap">
                        <tip :val="Dress[3]" msg=""></tip>
                      </div>
                    </div>
                    <div class="dress-bottom">
                      <div class="dress-bottom-tip1" v-show="ismap">
                        <tip :val="Dress[0]" msg=""></tip>
                      </div>
                      <div class="dress-bottom-tip2" v-show="ismap">
                        <tip :val="Dress[2]" msg=""></tip>
                      </div>
                      <div class="dress-bottom-tip3" v-show="ismap">
                        <tip :val="Dress[4]" msg=""></tip>
                      </div>
                    </div>
                  </div>
                  <div class="Supporting">
                    <div class="Supporting-top">
                      <div class="Supporting-top-tip1" v-show="ismap">
                        <tip :val="Assort[1]" msg=""></tip>
                      </div>
                    </div>
                    <div class="Supporting-bottom">
                      <div class="Supporting-bottom-left">
                        <span class="staircase">楼梯</span>
                      </div>
                      <div class="Supporting-bottom-right"></div>
                      <div class="Supporting-bottom-tip1" v-show="ismap">
                        <tip :val="Assort[0]" msg=""></tip>
                      </div>
                      <div class="Supporting-bottom-tip2" v-show="ismap">
                        <tip :val="Assort[2]" msg=""></tip>
                      </div>
                    </div>
                  </div>
                  <div class="Blank-space"></div>
                  <div class="Home-textiles">
                    <div class="WestAirPump">
                      <div class="WestAirPump-box">
                        西气泵房
                        <div class="WestAirPump-box-tip1" v-show="ismap">
                      <tip :val="pumpHouse[1]" msg="控制设备内部<br/>"></tip>
                    </div>
                      </div>
                    </div>
                    <span class="staircase">楼梯</span>
                    <div class="Home-textiles-tip1" v-show="ismap">
                      <tip :val="HomeTextiles[0]" msg=""></tip>
                    </div>
                    <div class="Home-textiles-tip2" v-show="ismap">
                      <tip :val="HomeTextiles[1]" msg=""></tip>
                    </div>
                    <div class="MedicalPrevention-tip1" v-show="ismap">
                      <tip :val="MedicalPrevention[0]" msg="二楼<br/>"></tip>
                    </div>
                    <div class="MedicalPrevention-tip2" v-show="ismap">
                      <tip :val="MedicalPrevention[1]" msg="二楼<br/>"></tip>
                    </div>
                  </div>
                </div>
                <div class="factory-center">
                  <div class="Erdao-Post"></div>
                </div>
                <div class="factory-bottom">
                  <div class="AutomobileFinishing">
                    <div class="automobile" >
                      <div class="automobile-tip1" v-show="ismap">
                        <tip :val="automobile[0]" msg=""></tip>
                      </div>
                      <div class="automobile-tip2" v-show="ismap">
                        <tip :val="automobile[2]" msg=""></tip>
                      </div>
                      <div class="automobile-tip3" v-show="ismap">
                        <tip :val="automobile[1]" msg=""></tip>
                      </div>
                      <div class="automobile-tip4" v-show="ismap">
                        <tip :val="automobile[4]" msg=""></tip>
                      </div>
                      <div class="automobile-tip5" v-show="ismap">
                        <tip :val="automobile[5]" msg=""></tip>
                      </div>
                    </div>
                    <div class="fineMachining" @click="clickrouter(1)">
                      <div class="fineMachining-top">
                        <div class="fineMachining-top-devtip" v-show="!ismap">
                          <devtip :val="RefinedAdditionDev" msg=""></devtip>
                        </div>
                        <div class="fineMachining-top-tip1" v-show="ismap">
                          <tip :val="RefinedAddition[0]" msg=""></tip>
                        </div>
                        <div class="fineMachining-top-tip2" v-show="ismap">
                          <tip :val="RefinedAddition[1]" msg=""></tip>
                        </div>
                      </div>
                      <div class="fineMachining-center"></div>
                      <div class="fineMachining-bottom">
                        <div class="fineMachining-bottom-tip1" v-show="ismap">
                          <tip :val="RefinedAddition[2]" msg=""></tip>
                        </div>
                        <div class="fineMachining-bottom-tip2" v-show="ismap">
                          <tip :val="RefinedAddition[3]" msg=""></tip>
                        </div>
                        <div class="fineMachining-bottom-tip3" v-show="ismap">
                          <tip :val="automobile[3]" msg=""></tip>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="Machining"  @click="clickrouter(2)">
                    <div class="Machining-devtip" v-show="!ismap">
                          <devtip :val="MachiningDev" msg=""></devtip>
                        </div>
                    <div class="Machining-storehouseOne">
                      <div></div>
                      <div></div>
                    </div>
                    <div class="Machining-storehouseTwo">
                      <div></div>
                      <div></div>
                    </div>
                    <div class="Machining-assemble"></div>
                    <div class="Machining-machiningCenter"></div>
                    <div class="Eastern-air-pump">
                      <div class="Eastern-air-pump-box">
                        <div class="Eastern-air-pump-tip1" v-show="ismap">
                      <tip :val="pumpHouse[0]" msg="控制设备内部<br/>"></tip>
                    </div>
                      </div>
                    </div>
                    <div class="Machining-tip1" v-show="ismap">
                      <tip :val="Machining[0]" msg=""></tip>
                    </div>
                    <div class="Machining-tip2" v-show="ismap">
                      <tip :val="Machining[3]" msg=""></tip>
                    </div>
                    <div class="Machining-tip3" v-show="ismap">
                      <tip :val="Machining[1]" msg=""></tip>
                    </div>
                    <div class="Machining-tip4" v-show="ismap">
                      <tip :val="Machining[2]" msg=""></tip>
                    </div>
                  </div>
                  <div class="LargePieceFinishing" >
                    <div class="LargePieceFinishing-large-sized"  @click="clickrouter(3)">

                      <div>
                        <div class="LargePieceFinishing-large-sized-tip1" v-show="ismap">
                        <tip :val="Finishing[1]" msg=""></tip>
                      </div>
                      </div>
                      <div class="LargePieceFinishing-devtip" v-show="!ismap">
                          <devtip :val="largeSizedDev" msg=""></devtip>
                        </div>
                      <div class="LargePieceFinishing-tip1" v-show="ismap">
                        <tip :val="largeSized[2]" msg=""></tip>
                      </div>
                      <div class="LargePieceFinishing-tip2" v-show="ismap">
                        <tip :val="largeSized[3]" msg=""></tip>
                      </div>
                      <div class="LargePieceFinishing-tip3" v-show="ismap">
                        <tip :val="largeSized[4]" msg=""></tip>
                      </div>
                      <div class="LargePieceFinishing-tip4" v-show="ismap">
                        <tip :val="largeSized[5]" msg=""></tip>
                      </div>
                      <!--未安装 <div class="LargePieceFinishing-tip5">
                        <tip :val="largeSized[4]" msg=""></tip>
                      </div> -->
                      <div class="LargePieceFinishing-tip6" v-show="ismap">
                        <tip :val="largeSized[1]" msg=""></tip>
                      </div>
                      <div class="LargePieceFinishing-tip7" v-show="ismap">
                        <tip :val="largeSized[0]" msg=""></tip>
                      </div>
                    </div>
                    <div class="LargePieceFinishing-Finishing"  @click="clickrouter(4)">
                      <div class="LargePieceFinishing-Finishing-devtip" v-show="!ismap">
                          <devtip :val="FinishingDev" msg=""></devtip>
                        </div>
                      <div class="stoving"></div>
                      <div class="polish"></div>
                      <div
                        class="LargePieceFinishing-Finishing-sprayPaint"
                      ></div>
                      <div class="LargePieceFinishing-Finishing-none">
                        <div></div>
                        <div></div>
                        <div></div>
                        <div></div>
                      </div>
                      <div class="LargePieceFinishing-Finishing-dusting">
                        <div></div>
                        <div class="LargePieceFinishing-Finishing-dusting-B">
                          <div></div>
                          <div></div>
                        </div>
                      </div>
                      <div
                        class="LargePieceFinishing-Finishing-MultipleCategories"
                      >
                        <div class="MultipleCategories-left">
                          <div></div>
                          <div></div>
                        </div>
                        <div></div>
                      </div>
                      <div
                        class="LargePieceFinishing-Finishing-sandBlast"
                      ></div>
                      <div class="LargePieceFinishing-Finishing-tip1" v-show="ismap">
                        <tip :val="Finishing[0]" msg=""></tip>
                      </div>
                    </div>
                  </div>
                  <div class="weld"  @click="clickrouter(5)">
                    <div class="weld-BoilerRoom">
                      <div class="weld-BoilerRoom-box">
                        <div class="weld-BoilerRoom-tip1" v-show="ismap">
                        <tip :val="boiler[0]" msg=""></tip>
                      </div>
                      <div class="weld-BoilerRoom-tip2" v-show="ismap">
                        <tip :val="weld[1]" msg=""></tip>
                      </div>
                      </div>
                      
                    </div>
                    <div class="weld-devtip" v-show="!ismap">
                      <devtip :val="weldDev" msg=""></devtip>
                    </div>
                    <div class="weld-tip1" v-show="ismap">
                      <tip :val="weld[2]" msg=""></tip>
                    </div>
                    <div class="weld-tip2" v-show="ismap">
                      <tip :val="weld[3]" msg=""></tip>
                    </div>
                    <div class="weld-tip3" v-show="ismap">
                      <tip :val="weld[4]" msg=""></tip>
                    </div>
                    <div class="weld-tip4" v-show="ismap">
                      <tip :val="weld[0]" msg=""></tip>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="diningRoom"  >
              <div>
                <div class="diningRoom-tip2" v-show="ismap">
                    <tip :val="canteen[1]" msg=""></tip>
                  </div>
              </div>
              <div></div>
              <div></div>
              <div class="diningRoom-bottom">
                <div>
                  <div class="diningRoom-tip1" v-show="ismap">
                    <tip :val="canteen[0]" msg=""></tip>
                  </div>
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="dormitory-top"></div>
            <div class="dormitory-bottom">
              <div class="dormitory-bottom-one">
                <div>
                  <div class="dormitory-bottom-one-tip1" v-show="ismap">
                    <tip :val="BuildingTen[0]" msg=""></tip>
                  </div>
                </div>
                <div></div>
                <div></div>
              </div>
              <div class="dormitory-bottom-two">
                <div></div>
                <div></div>
                <div></div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <div class="tip-box">
      <div class="tip-box-border">
        <div class="DirectionalSign">
          
        </div>
        <div class="iconTip" :key="keynum">
          <div class="selectBotton">
            <div @click="()=>{ismap=true}">传感器</div>
            <div @click="()=>{ismap=false}">设备</div>
          </div>
          <ul v-show="ismap">
            <!-- <li class="colorTip">
              <div><span class="icon-blue"></span>在线</div>
              <div><span class="icon-red"></span>离线</div>
            </li> -->
            <li v-for="item in iconList" :key="item.id">
              <i :class="'iconfont ' + item.name + ' icon-logo'"></i
              >{{ "&nbsp&nbsp&nbsp" + item.value }}
              <div>{{ `&nbsp${item.allnum}/${item.allnum}` }}</div>
            </li>
          </ul>
          <ul v-show="!ismap">
            <li class="colorTip">
              <div><span class="icon-blue"></span>{{ t('messages.onLine') }}</div>
              <div><span class="icon-red"></span>{{t('messages.offline')}}</div>
            </li>
            <li v-for="item in devList" :key="item.id">
              <i :class="'iconfont ' + item.name + ' icon-logo'"></i
              >{{ "&nbsp&nbsp&nbsp" + item.value }}
              <div>{{ `&nbsp${item.allnum}/${item.allnum}` }}</div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { nextTick, reactive, ref, watch } from "vue";
import tip from "./tip.vue";
import devtip from "./tip2.vue";
import { useAerialViewStore } from "@/store/module/AerialView";
import { useRoute,useRouter } from "vue-router";
import {useMechanicsStore} from "@/store/module/Mechanics"
import { useI18n } from 'vue-i18n'
let {t} = useI18n();
let ismap=ref(true)

const storeMechanics = useMechanicsStore()
const router=useRouter()
const store = useAerialViewStore();
const ElectricControl = reactive([]); //电控
const Dress = reactive([]); //服装
const Assort = reactive([]); //配套
const HomeTextiles = reactive([]); //家纺
const MedicalPrevention = reactive([]); //医防
const automobile = reactive([]); //汽车
const RefinedAddition = reactive([]); //精加
const Machining = reactive([]); //机加
const largeSized = reactive([]); //大件
const Finishing = reactive([]); //精饰
const weld = reactive([]); //焊接
const canteen = reactive([]); //食堂
const boiler = reactive([]); //锅炉房
const pumpHouse = reactive([])//泵房
const BuildingTen = reactive([])//十号楼
const synthesize = reactive([])//综合楼

// 设备数据
const RefinedAdditionDev = reactive([]); //精加
const MachiningDev = reactive([]); //机加
const largeSizedDev = reactive([]); //大件
const FinishingDev = reactive([]); //精饰
const weldDev = reactive([]); //焊接
watch(
  () => store.sensorList,
  (newVal, oldVal) => {
    newVal.forEach((res) => {
      
      if (
        res.store.some(function (e) {
          return e == "电控";
        })
      ) {
        ElectricControl[0] = [];
        ElectricControl[1] = [];
        ElectricControl[2] = [];
        ElectricControl[0].push(...res.value["噪音"]);
        ElectricControl[0].push(...res.value["温湿度"]);
        ElectricControl[0].push(...res.value["网关"]);
        ElectricControl[1].push(...res.value["电力"]);
        ElectricControl[2].push(...res.value["水压"]);

        // ElectricControl = ...[ElectricControl]
      }
      if (
        res.store.some(function (e) {
          return e == "服装";
        })
      ) {
        Dress[0] = [];
        Dress[1] = [];
        Dress[2] = [];
        Dress[3] = [];
        Dress[4] = [];
        Dress[0].push(...res.value["网关"]);
        Dress[0].push(...res.value["噪音"]);
        Dress[0].push(...res.value["温湿度"]);
        res.value["水压"].forEach(item=>{
          if(item.id=='bdcd4fb0-b417-11ed-939a-bf37ddc1d39c'||item.id=='d377e190-b417-11ed-939a-bf37ddc1d39c'){
            Dress[1].push(...[item]);
          }
          if(item.id=='48956b00-b418-11ed-939a-bf37ddc1d39c'||item.id=='5d870d20-b418-11ed-939a-bf37ddc1d39c'){
            Dress[2].push(...[item]);
          }
        })
        
        res.value["电力"].forEach(item=>{
          if(item.id=='4113f350-34a8-11ed-a7e1-fd42bca6c8c6'){
            Dress[3].push(...[item]);
          }
          if(item.id=='26ce5580-34a8-11ed-a7e1-fd42bca6c8c6'){
            Dress[4].push(...[item]);
          }
        })
        
      }
      if (
        res.store.some(function (e) {
          return e == "配套";
        })
      ) {
        Assort[0] = [];
        Assort[1] = [];
        Assort[2] = [];
        res.value["水压"].forEach((item) => {
          if (item.id == "bfdcaf30-2763-11ed-a7e1-fd42bca6c8c6") {
            Assort[0].push(...[item]);
          }
          if (
            item.id == "f11cd700-b417-11ed-939a-bf37ddc1d39c" ||
            item.id == "06b678f0-b418-11ed-939a-bf37ddc1d39c"
          ) {
            Assort[2].push(...[item]);
          }
        });
        // Assort[0].push(...res.value['水压'])
        Assort[1].push(...res.value["噪音"]);
        Assort[1].push(...res.value["温湿度"]);
      }
      if (res.store.some(function (e) {return e == "家纺";})
      ) {
        HomeTextiles[0] = [];
        HomeTextiles[1] = [];
        HomeTextiles[0].push(...res.value["噪音"]);
        HomeTextiles[0].push(...res.value["温湿度"]);
        HomeTextiles[0].push(...res.value["网关"]);
        HomeTextiles[1].push(...res.value["电力"]);
      }
      if (res.store.some(function (e) {return e == "医防";})
      ) {
        MedicalPrevention[0] = [];
        MedicalPrevention[1] = [];
        MedicalPrevention[0].push(...res.value["噪音"]);
        MedicalPrevention[0].push(...res.value["温湿度"]);
        MedicalPrevention[0].push(...res.value["网关"]);
        MedicalPrevention[1].push(...res.value["电力"]);
      }
      if (
        res.store.some(function (e) {
          return e == "汽车";
        })
      ) {
        automobile[0] = [];
        automobile[1] = [];
        automobile[2] = [];
        automobile[3] = [];
        automobile[4] = [];
        automobile[5] = [];
        automobile[0].push(...res.value["噪音"]);
        automobile[0].push(...res.value["温湿度"]);
        // automobile[0].push(...res.value['网关'])
        res.value["水压"].forEach(item=>{
          if(item.id=='33086ce0-b410-11ed-939a-bf37ddc1d39c'){
            automobile[1].push(...[item]);
          }
          if(item.id=='c54a7ee0-b415-11ed-939a-bf37ddc1d39c'){
            automobile[2].push(...[item]);
          }
        })
        res.value["电力"].forEach(item=>{
          if(item.id=='34cecb50-8729-11ed-a926-570995ad0254'){
            automobile[3].push(...[item]);
          }
          if(item.id=='4601fb20-2f1f-11ed-a7e1-fd42bca6c8c6'){
            automobile[4].push(...[item]);
          }
          if(item.id=='e0363310-34a5-11ed-a7e1-fd42bca6c8c6'){
            automobile[5].push(...[item]);
          }
        })
      }
      if (
        res.store.some(function (e) {
          return e == "精加";
        })
      ) {
        RefinedAddition[0] = [];
        RefinedAddition[1] = [];
        RefinedAddition[2] = [];
        RefinedAddition[3] = [];
        RefinedAddition[0].push(...res.value["噪音"]);
        RefinedAddition[0].push(...res.value["温湿度"]);
        RefinedAddition[0].push(...res.value["网关"]);
        RefinedAddition[1].push(...res.value["电力"]);
        res.value["水压"].forEach(item=>{
          if(item.id=='fb3bb980-b41d-11ed-939a-bf37ddc1d39c'){
            RefinedAddition[2].push(...[item]);
          }
          if(item.id=='113afb10-b41e-11ed-939a-bf37ddc1d39c'){
            RefinedAddition[3].push(...[item]);
          }
        })
        // RefinedAddition[2].push(...res.value["水压"]);
      }
      if (
        res.store.some(function (e) {
          return e == "机加";
        })
      ) {
        Machining[0] = [];
        Machining[1] = [];
        Machining[2] = [];
        Machining[3] = [];
        Machining[0].push(...res.value["噪音"]);
        Machining[0].push(...res.value["温湿度"]);
        Machining[3].push(...res.value["网关"]);
        Machining[1].push(...res.value["电力"]);
        Machining[2].push(...res.value["水压"]);
      }

      if (
        res.store.some(function (e) {
          return e == "大件";
        })
      ) {
        largeSized[0] = [];
        largeSized[1] = [];
        largeSized[2] = [];
        largeSized[3] = [];
        largeSized[4] = [];
        largeSized[5] = [];
        largeSized[0].push(...res.value["噪音"]);
        largeSized[0].push(...res.value["温湿度"]);
        largeSized[0].push(...res.value["网关"]);
        // largeSized[0].push(res.value['燃气'])
        // largeSized[0].push(res.value['火花'])
        // largeSized[0].push(res.value['烟雾'])
        // largeSized[1].push(...res.value["电力"]);
        largeSized[2].push(...res.value["水压"]);
        largeSized[1].push(...res.value["粉尘"]);
        // largeSized[4].push(res.value['TVOC/甲醛'])
        res.value["电力"].forEach(item=>{
          if(item.id=='99267d60-34a8-11ed-a7e1-fd42bca6c8c6'){
            largeSized[3].push(...[item]);
          }
          if(item.id=='ae80f370-34a8-11ed-a7e1-fd42bca6c8c6'){
            largeSized[4].push(...[item]);
          }
          if(item.id=='c4f31b10-34a8-11ed-a7e1-fd42bca6c8c6'){
            largeSized[5].push(...[item]);
          }
        })
      }
      if (
        res.store.some(function (e) {
          return e == "精饰";
        })
      ) {
        Finishing[0] = [];
        Finishing[1] = [];
        Finishing[0].push(...res.value["噪音"]);
        Finishing[0].push(...res.value["温湿度"]);
        Finishing[0].push(...res.value["网关"]);
        Finishing[0].push(...res.value["燃气"]);
        Finishing[0].push(...res.value["火花"]);
        Finishing[0].push(...res.value["烟雾"]);
        Finishing[1].push(...res.value["电力"]);
        Finishing[0].push(...res.value["粉尘"]);
        Finishing[0].push(...res.value["TVOC/甲醛"]);
      }
      if (
        res.store.some(function (e) {
          return e == "焊接";
        })
      ) {
        weld[0] = [];
        weld[1] = [];
        weld[2] = [];
        weld[3] = [];
        weld[4] = [];
        weld[0].push(...res.value["噪音"]);
        weld[0].push(...res.value["温湿度"]);
        weld[0].push(...res.value["网关"]);
        weld[1].push(...res.value["水压"]);
        weld[0].push(...res.value["粉尘"]);
        // weld[0].push(...res.value['TVOC/甲醛'])
        res.value["电力"].forEach(item=>{
          if(item.id=='10e0e6e0-34ab-11ed-a7e1-fd42bca6c8c6'){
            weld[2].push(...[item]);
          }
          if(item.id=='25f48ff0-34ab-11ed-a7e1-fd42bca6c8c6'){
            weld[3].push(...[item]);
          }
          if(item.id=='f5d6c090-34aa-11ed-a7e1-fd42bca6c8c6'){
            weld[4].push(...[item]);
          }
        })
      }
      if (
        res.store.some(function (e) {
          return e == "食堂";
        })
      ) {
        canteen[0] = [];
        canteen[1] = [];
        canteen[0].push(...res.value["燃气"]);
        canteen[1].push(...res.value["水压"]);
      }
      if (
        res.store.some(function (e) {
          return e == "锅炉房";
        })
      ) {
        boiler[0] = [];
        boiler[1] = [];
        boiler[0].push(...res.value["燃气"]);
      }
      if (
        res.store.some(function (e) {
          return e == "泵房";
        })
      ) {
        pumpHouse[0] = [];
        pumpHouse[1] = [];
        res.value["电力"].forEach(item=>{
          if(item.id=='572aad20-34ab-11ed-a7e1-fd42bca6c8c6'){
            pumpHouse[0].push(...[item]);
          }
          if(item.id=='72c3f410-34ab-11ed-a7e1-fd42bca6c8c6'){
            pumpHouse[1].push(...[item]);
          }
        })
        res.value["气压"].forEach(item=>{
          if(item.id=='1b712c30-5bea-11ed-b30f-e9b5a4889d91'){
            pumpHouse[0].push(...[item]);
          }
          if(item.id=='03b0c4d0-3439-11ed-a7e1-fd42bca6c8c6'){
            pumpHouse[1].push(...[item]);
          }
        })
        
        
      }
      if (
        res.store.some(function (e) {
          return e == "十号楼";
        })
      ) {
        BuildingTen[0] = [];
        res.value["水压"].forEach(item=>{
          if(item.id=='84c7ec30-bf10-11ed-a0a7-a3c9555196a3'||item.id=='a8b72430-bf10-11ed-a0a7-a3c9555196a3'){
            BuildingTen[0].push(...[item]);
          }
        })
        
        
      }
      if (
        res.store.some(function (e) {
          return e == "综合楼";
        })
      ) {
        synthesize[0] = [];
        synthesize[1] = [];
        synthesize[2] = [];
        res.value["水压"].forEach(item=>{
          if(item.id=='868be5b0-ba62-11ed-939a-bf37ddc1d39c'||item.id=='bb55d800-ba62-11ed-939a-bf37ddc1d39c'){
            synthesize[0].push(...[item]);
          }
          if(item.id=='8d1049d0-bd7d-11ed-a0a7-a3c9555196a3'||item.id=='aed6fc80-bd7d-11ed-a0a7-a3c9555196a3'){
            synthesize[1].push(...[item]);
          }
          if(item.id=='b248f420-c9e6-11ed-a742-83feda1d6cb3'||item.id=='e5e31900-c9e6-11ed-a742-83feda1d6cb3'){
            synthesize[2].push(...[item]);
          }
        })
        
        
      }
    });
  },
  { deep: true, flush: "post" }
);
watch(
  () => store.devdataList,
  (newVal, oldVal) => {
    console.log(newVal,"设备数据");
    newVal.forEach(res=>{
      if(res.store=='机加车间'){
        MachiningDev.push(...res.value) 
      }
      if(res.store=='焊接车间'){
        weldDev.push(...res.value) 
      }
      if(res.store=='精饰车间'){
        FinishingDev.push(...res.value) 
      }
      if(res.store=='精加车间'){
        RefinedAdditionDev.push(...res.value) 
      }
      if(res.store=='大件车间'){
        largeSizedDev.push(...res.value) 
      }
    })
    keynum.value++
  },
  { deep: true, flush: "post" }
);
let clickrouter=(val)=>{
  storeMechanics.changePage(val)
  router.push({
    name:'Mechanicschild',
    params:{
      id:val
    }
})
}
let keynum=ref(0)
watch(
  () => store.iconList,
  (newVal, oldVal) => {
    iconList= newVal
    keynum.value++
  },
  { deep: true, flush: "post" }
);
let iconList = []
watch(
  () => store.devList,
  (newVal, oldVal) => {
   
    nextTick(()=>{
      devList= newVal
    })
    keynum.value++
  },
  { deep: true, flush: "post" }
);
let devList = []
</script>

<style module>
.div {
  width: 100%;
  height: 100%;
  display: flex;
}
</style>
<style scoped>
@import url("@/assets/css/AerialView/data.css");
@import url("@/assets/css/AerialView/AerialView.css");
@import url("@/assets/css/iconfont.css");
.icon-logo {
  font-size: 2rem;
  color: #fff;
}
.iconTip > ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.iconTip > ul > li {
  font-size: 1rem;
  width: 100%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.selectBotton{
  width: 80%;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* border-top: solid #fff 0.1rem;
  border-left: solid #fff 0.1rem;
  border-right: solid #fff 0.1rem; */
  border-radius:5px;
  margin: 10px
}
.selectBotton>div{
 width: 50%;
 height: 100%;
 display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  color: #fff;
}

</style>
