gasInjection-project/src/views/vent/monitorManager/balancePressMonitor/components/balancePressHomeBD.vue

<template>
  <a-spin tip="Loading..." :spinning="loading">
    <div class="monitor-container">
      <div class="lr left-box">
        <ventBox1>
          <template #title>
            <div>均压与低氧参数监测与设置</div>
          </template>
          <template #container>
            <div class="vent-flex-row-between auto-control mt-10px mb-10px">
              <div class="title">自动调节：</div>
              <a-radio-group v-model:value="isAutoControl" name="radioGroup" @change="changeType(isAutoControl)">
                <a-radio value="1">关闭</a-radio>
                <a-radio value="2">开启</a-radio>
              </a-radio-group>
            </div>
            <div class="input-box">
              <div class="divider-line">开始条件</div>
              <div v-for="(item, index) in settingParam1" class="input-item" :key="index">
                <div class="title">{{ item.title }}：</div>
                <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
                <div class="unit">{{ item.unit }}</div>
              </div>
              <div class="divider-line">调节参数</div>
              <div v-for="(item, index) in settingParam2" class="input-item" :key="index">
                <div class="title">{{ item.title }}：</div>
                <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
                <div class="unit">{{ item.unit }}</div>
              </div>
              <div class="divider-line">结束时间</div>
              <div v-for="(item, index) in settingParam3" class="input-item" :key="index">
                <div class="title">{{ item.title }}：</div>
                <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
                <div class="unit">{{ item.unit }}</div>
              </div>
            </div>
            <div class="btn-box" style="text-align: center">
              <div class="btn btn1" @click="onSubmit">提交</div>
            </div>
          </template>
        </ventBox1>
      </div>
      <div class="lr">
        <ventBox1>
          <template #title>
            <div>均压工作面风机与风门联动</div>
          </template>
          <template #container>
            <div class="vent-flex-row-between auto-control mt-10px mb-10px">
              <div class="title">自动调节：</div>
              <a-radio-group v-model:value="isAutoControl" name="radioGroup" @change="changeType(isAutoControl)">
                <a-radio value="1">关闭</a-radio>
                <a-radio value="2">开启</a-radio>
              </a-radio-group>
            </div>
            <div class="btn-box" style="text-align: center">
              <div class="btn btn1" @click="onSubmit">提交</div>
            </div>
          </template>
        </ventBox1>
      </div>
      <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="selectData"
        :visible="true"
      />
    </div>
  </a-spin>
</template>
<script setup lang="ts">
  import { ref, onMounted, onUnmounted, defineProps } from 'vue';
  import { mountedThree, destroy, setModelType, updateText, play } from '../balancePress.threejs';
  import { list } from '../balancePress.api';
  import ModuleCommon from '../../../home/configurable/components/ModuleCommon.vue';
  import { useInitConfigs } from '../../../home/configurable/hooks/useInit';
  import { useGlobSetting } from '/@/hooks/setting';
  import { settingParam1, settingParam2, settingParam3 } from '../balancePress.data';
  import { message } from 'ant-design-vue';
  import ventBox1 from '/@/components/vent/ventBox1.vue';
  // import { Config } from '../../../deviceManager/configurationTable/types';

  const props = defineProps({
    deviceId: {
      type: String,
      require: true,
    },
  });

  const { sysOrgCode } = useGlobSetting();

  const loading = ref(false);

  // 监测数据
  const selectData = ref();

  // https获取监测数据
  let timer: any = null;
  function getMonitor(flag?) {
    if (Object.prototype.toString.call(timer) === '[object Null]') {
      timer = setTimeout(
        async () => {
          if (props.deviceId) {
            const data = await getDataSource(props.deviceId);
            // Object.assign(selectData, data);
            updateText(selectData);
            selectData.value = data;
          }
          if (timer) {
            timer = null;
          }
          await getMonitor();
          loading.value = false;
        },
        flag ? 0 : 1000
      );
    }
  }

  async function getDataSource(systemID) {
    const res = await list({ devicetype: 'sys', systemID });

    const result = Array.from(res.msgTxt).reduce(
      (obj: any, e: any) => {
        obj[e.type] = e;

        // if (true) {
        if (sysOrgCode === 'sdmtjtswmk') {
          if (e.type.startsWith('fanlocal')) {
            obj.fanlocal.datalist.push(...e.datalist);
          }
          if (e.type.startsWith('safetymonitor')) {
            e.datalist.forEach((ele) => {
              if (ele.strinstallpos.includes('风门')) {
                obj.gate.datalist.push(ele);
              } else if (ele.strinstallpos.includes('风窗')) {
                obj.window.datalist.push(ele);
              } else if (ele.strinstallpos.includes('工作面')) {
                obj.work_surface.datalist.push(ele);
              } else {
                obj.others.datalist.push(ele);
              }
            });
          }
        }

        return obj;
      },
      {
        /** 用于归类fanlocal */
        fanlocal: { datalist: [] },
        /** 用于归类gate */
        gate: { datalist: [] },
        /** 用于归类window */
        window: { datalist: [] },
        /** 用于归类work_surface */
        work_surface: { datalist: [] },
        others: { datalist: [] },
      }
    );

    return result;
  }

  // const configs = ref<Config[]>([
  //   {
  //     deviceType: '',
  //     moduleName: '局扇',
  //     pageType: 'balancePressHome',
  //     moduleData: {
  //       header: {
  //         show: false,
  //         readFrom: '',
  //         selector: {
  //           show: false,
  //           value: '',
  //         },
  //         slot: {
  //           show: false,
  //           value: '',
  //         },
  //       },
  //       background: {
  //         show: false,
  //         type: 'image',
  //         link: '',
  //       },
  //       layout: {
  //         direction: 'row',
  //         items: [
  //           {
  //             name: 'complex_list',
  //             basis: '50%',
  //           },
  //           {
  //             name: 'complex_list',
  //             basis: '50%',
  //           },
  //         ],
  //       },
  //       complex_list: [
  //         {
  //           type: 'G',
  //           readFrom: 'fanlocal_steml_zj',
  //           mapFromData: false,
  //           items: [
  //             {
  //               title: '主机',
  //               contents: [
  //                 {
  //                   label: '运行状态',
  //                   value: '${datalist[0].readData.Fan1StartStatus_str}',
  //                   color: 'blue',
  //                 },
  //                 {
  //                   label: '运行频率',
  //                   value: '${datalist[0].readData.Fan1fHz}',
  //                   color: 'blue',
  //                 },
  //                 {
  //                   label: '输出电压',
  //                   value: '${datalist[0].readData.Fan1fHz}',
  //                   color: 'blue',
  //                 },
  //               ],
  //             },
  //           ],
  //         },
  //         {
  //           type: 'G',
  //           readFrom: 'fanlocal_steml_zj',
  //           mapFromData: false,
  //           items: [
  //             {
  //               title: '备机',
  //               contents: [
  //                 {
  //                   label: '运行状态',
  //                   value: '${datalist[0].readData.Fan2StartStatus_str}',
  //                   color: 'blue',
  //                 },
  //                 {
  //                   label: '运行频率',
  //                   value: '${datalist[0].readData.Fan2fHz}',
  //                   color: 'blue',
  //                 },
  //                 {
  //                   label: '输出电压',
  //                   value: '${datalist[0].readData.Fan2fHz}',
  //                   color: 'blue',
  //                 },
  //               ],
  //             },
  //           ],
  //         },
  //       ],
  //       to: '',
  //     },
  //     showStyle: {
  //       size: 'width:380px;height:200px;',
  //       version: '原版',
  //       position: 'top:150px;right:0;',
  //     },
  //   },
  //   {
  //     deviceType: '',
  //     moduleName: '其他模块A',
  //     pageType: 'balancePressHome',
  //     moduleData: {
  //       header: {
  //         show: false,
  //         readFrom: '',
  //         selector: {
  //           show: false,
  //           value: '',
  //         },
  //         slot: {
  //           show: false,
  //           value: '',
  //         },
  //       },
  //       background: {
  //         show: false,
  //         type: 'image',
  //         link: '',
  //       },
  //       layout: {
  //         direction: 'column',
  //         items: [
  //           {
  //             name: 'list',
  //             basis: '100%',
  //           },
  //         ],
  //       },
  //       list: [
  //         {
  //           type: 'K',
  //           readFrom: 'windrect_ds_four.datalist[0]',
  //           items: [
  //             {
  //               label: '网络状态',
  //               value: '${readData.netStatus_str}',
  //               color: 'blue',
  //             },
  //           ],
  //         },
  //       ],
  //       to: '',
  //     },
  //     showStyle: {
  //       size: 'width:380px;height:230px;',
  //       version: '原版',
  //       position: 'top:360px;right:0;',
  //     },
  //   },
  // ]);

  // const { configs, fetchConfigs } = useInitConfigs();

  const formData = ref({});
  // 默认初始是第一行
  const isAutoControl = ref('1');
  const changeType = (isAutoControl) => {
    isAutoControl;
    //
  };

  function onSubmit() {
    message.success('提交成功');
  }

  const { configs, fetchConfigs } = useInitConfigs();

  onMounted(() => {
    // getMonitor()
    fetchConfigs('balancePressHome');
    loading.value = true;
    mountedThree().then(async () => {
      await setModelType('balancePressBase'); //balancePressBase
      loading.value = false;
      timer = null;
      await getMonitor(true);
      play('startSmoke', 'top', 30, 'open', 0);
    });
    // loading.value = false;
    // timer = null;
    // getMonitor(true);
  });

  onUnmounted(() => {
    destroy();
    if (timer) {
      clearTimeout(timer);
    }
  });
</script>
<style lang="less" scoped>
  @import '/@/design/vent/modal.less';
  @import '../../comment/less/workFace.less';
  @ventSpace: zxm;
  .monitor-container {
    margin-top: 60px;
  }
</style>