vent-template/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="modalVisible = true">提交</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 :value="avePress.isAuto" name="radioGroup" @change="changeIsAuto">
                <a-radio :value="false">关闭</a-radio>
                <a-radio :value="true">开启</a-radio>
              </a-radio-group>
            </div>
            <div class="btn-box" style="text-align: center">
              <div class="btn btn1" @click="openModal">控制密码修改</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>
    <PasswordModal :modal-is-show="modalVisible" modal-title="提交" @handle-ok="handleControl" @handle-cancel="modalVisible = false" />
    <UpdatePassword @register="updatePwdRegister" @submit="changePassword" />
  </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, submitEdit, subList, updatePassword, validPassword } 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 PasswordModal from '../../comment/components/PasswordModal.vue';
  import UpdatePassword from '../../comment/components/UpdatePassword.vue';
  import { get } from 'lodash-es';
  import { useModal } from '/@/components/Modal';
  // 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({
    isAuto: false,
  });
  // 默认初始是第一行
  const isAutoControl = ref('1');

  function changeIsAuto({ target }) {
    formData.value.isAuto = target.value;
    modalVisible.value = true;
  }

  const changeType = (isAutoControl) => {
    isAutoControl;
    //
  };

  const modalVisible = ref(false);

  function handleControl(password) {
    validPassword({
      id: avePress.value.id,
      password,
    })
      .then(() => {
        return submitEdit({
          id: avePress.value.id,
          isAuto: formData.value.isAuto,
        })
          .then(() => {
            message.success('操作成功');
          })
          .catch(() => {
            message.error('操作失败');
          });
      })
      .catch((e) => {
        message.error(e);
      })
      .finally(() => {
        modalVisible.value = false;
        getAvePress();
      });
  }

  const avePress = ref<any>({ isAuto: false });
  function getAvePress() {
    subList({
      strType: 'sdg_fan_sys_gate',
    }).then(({ records }) => {
      avePress.value = get(records, '[0]');
    });
  }

  const { configs, fetchConfigs } = useInitConfigs();

  const [updatePwdRegister, { openModal, closeModal, setModalProps }] = useModal();

  function changePassword(values) {
    setModalProps({ confirmLoading: true });
    updatePassword({
      id: avePress.value.id,
      newPassword: values.password,
      oldPassword: values.oldpassword,
    })
      .then(() => {
        message.success('操作成功');
      })
      .catch((e) => {
        message.error(e);
      })
      .finally(() => {
        setModalProps({ confirmLoading: false });
        closeModal();
        getAvePress();
      });
  }

  onMounted(() => {
    // getMonitor()
    fetchConfigs('balancePressHome');
    getAvePress();
    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>