mky-vent-base/src/views/vent/BeltLaneThreeLevelFire/home/index.vue

<!-- eslint-disable vue/multi-word-component-names -->
<template>
  <div class="company-home">
    <div class="border">
      <customHeader>皮带巷三级防灭火系统</customHeader>
      <div class="box-container">
        <ModuleCommon
          v-for="cfg in configs"
          :key="cfg.deviceType"
          :show-style="cfg.showStyle"
          :module-data="cfg.moduleData"
          :module-name="cfg.moduleName"
          :device-type="cfg.deviceType"
          :data="readData"
          :visible="true"
          :style="{ zIndex: 1 }"
        />
      </div>
      <!-- 巷道模型组件 -->
      <VentModal />
    </div>
  </div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import customHeader from './customHeader.vue';
import { useInitConfigs, useInitPage } from '../../home/configurable/hooks/useInit';
import { testBeltLaneFire } from './beltFire.data';
import ModuleCommon from './components/ModuleCommon.vue';
import { list, systemList } from './beltFire.api';
import { BDFireMock } from './mock';
const { configs, fetchConfigs } = useInitConfigs();
const { updateEnhancedConfigs, updateData } = useInitPage('皮带巷三级防灭火系统');
const readData = {
  pdhzfxInfo: [
    {
      beltName: '测试1',
      sysList: [
        {
          beltName: '东翼胶带运输大巷皮带',
          warnlevel: '重大风险',
        },
        {
          beltName: '1102主运顺槽皮带',
          warnlevel: '报警',
        },
        {
          beltName: '1101主运顺槽皮带',
          warnlevel: '低分险',
        },
        {
          beltName: '东翼胶带运输大巷皮带',
          warnlevel: '一般风险',
        },
        {
          beltName: '东翼胶带运输大巷皮带',
          warnlevel: '较大风险',
        },
      ],
    },
  ],

  // csdata: [
  //   {
  //     beltName: '东翼胶带运输大巷皮带',
  //     warnlevel: '重大风险',
  //   },
  //   {
  //     beltName: '1102主运顺槽皮带',
  //     warnlevel: '报警',
  //   },
  //   {
  //     beltName: '1101主运顺槽皮带',
  //     warnlevel: '低分险',
  //   },
  //   {
  //     beltName: '东翼胶带运输大巷皮带',
  //     warnlevel: '一般风险',
  //   },
  //   {
  //     beltName: '东翼胶带运输大巷皮带',
  //     warnlevel: '较大风险',
  //   },
  // ],
  plmhInfo: [
    {
      beltName: '测试1',
      sysList: [
        {
          netstatus: '1',
          yxzt: '1',
          plsy: '1#区域 1.4MPa',
          kzms: '手动',
        },
      ],
    },
    {
      beltName: '测试2',
      sysList: [
        {
          netstatus: '1',
          yxzt: '1',
          plqy: '1#区域',
          plsy: '1.6MPa',
          kzms: '自动',
        },
      ],
    },
  ],
  fmhjcInfo: [
    {
      beltName: '测试1',
      sysList: [
        {
          warnLevel: '一般风险',
          deviceType: '微震测声传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '光纤测温传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'HCI传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '烟雾传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'CO传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '火焰传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '温度传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '多参数传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'AI视频火焰分析',
        },
      ],
    },
    {
      beltName: '测试2',
      sysList: [
        {
          warnLevel: '一般风险',
          deviceType: '微震测声传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '光纤测温传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'HCI传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '烟雾传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'CO传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '火焰传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '温度传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: '多参数传感器',
        },
        {
          warnLevel: '一般风险',
          deviceType: 'AI视频火焰分析',
        },
      ],
    },
  ],
  yjkfArray: [
    {
      beltName: '测试1',
      aqjkData: [
        {
          deviceName: '风门1',
          frontDoorStatus: '关闭',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门2',
          frontDoorStatus: '关闭',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门3',
          frontDoorStatus: '关闭',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门4',
          frontDoorStatus: '开启',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门5',
          frontDoorStatus: '开启',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门6',
          frontDoorStatus: '开启',
          backDoorStatus: '开启',
          netStatus: '在线',
        },
        {
          deviceName: '风门7',
          frontDoorStatus: '关闭',
          backDoorStatus: '关闭',
          netStatus: '在线',
        },
        {
          deviceName: '风门8',
          frontDoorStatus: '关闭',
          backDoorStatus: '关闭',
          netStatus: '在线',
        },
        {
          deviceName: '风门9',
          frontDoorStatus: '关闭',
          backDoorStatus: '关闭',
          netStatus: '在线',
        },
      ],
    },
  ],
};
// const readData = ref({});
function refresh() {
  fetchConfigs('belt').then(() => {
    configs.value = testBeltLaneFire;
    Promise.resolve(readData).then(updateData);
    // updateEnhancedConfigs(configs.value);
    // getDataSource();
  });
}
// async function getDataSource() {
//   const res = await list({ devicetype: 'belt', pagetype: 'normal' });
//   let dataSource: any = [];
//   dataSource = res.msgTxt[0] && res.msgTxt[0].datalist ? res.msgTxt[0].datalist[0] : {};
//   if (dataSource) {
//     readData.value = Object.assign(dataSource, dataSource.readData);
//   }
// }

// 查询关联设备列表
// async function getDeviceList() {
//   const res = await systemList({ devicetype: 'sys', systemID: optionValue.value });
//   const result = res.msgTxt;
//   const deviceArr = <DeviceType[]>[];
//   result.forEach((item) => {
//     const data = item['datalist'].filter((data: any) => {
//       const readData = data.readData;
//       return Object.assign(data, readData);
//     });
//     if (item.type != 'sys') {
//       deviceArr.unshift({ deviceType: item.type, deviceName: item['typeName'] ? item['typeName'] : item['datalist'][0]['typeName'], datalist: data });
//     }
//   });
//   deviceList.value = deviceArr;
//   deviceActive.value = deviceArr[0].deviceType;
//   deviceChange(0);
// }

function initInterval() {
  setInterval(() => {
    refresh();
  }, 60000);
}
onMounted(() => {
  refresh();
  initInterval();
});
</script>

<style lang="less" scoped>
.spray-wrapper {
  width: 100%;
  height: 100%;
  background-image: url('/@/assets/images/beltFire/baseMap.png');
  background-size: cover;
}

#spray3D {
  pointer-events: all;
}

.spray-wrapper :deep(.list-item_L .list-item__icon_L) {
  background-image: url('/@/assets/images/home-container/configurable/minehome/list-icon-file.png');
}
.spray-wrapper :deep(.list-item_N:nth-child(1)) {
  background-image: url('/@/assets/images/home-container/configurable/minehome/list-bg-n5.png');
}
.spray-wrapper :deep(.list-item_N:nth-child(2)) {
  background-image: url('/@/assets/images/home-container/configurable/minehome/list-bg-n6.png');
}
.company-home {
  background: url('/@/assets/images/beltFire/baseMap.png') no-repeat center;
  width: 100%;
  height: 100%;
  color: @white;
  position: relative;
  .border {
    width: 100%;
    height: 94%;
    background: url('/@/assets/images/beltFire/mainbj.png') no-repeat;
    background-size: 100% 100%;
  }
}
</style>