mky-vent-base/src/hooks/vent/useSystemSelect.ts

import { ref, nextTick } from 'vue';
import { defHttp } from '/@/utils/http/axios';

type DeviceType = { deviceType: string; deviceName: string; datalist: any[] };
type OptionType = { id: string; strsystype: string; systemname: string };
const getTableList = (params) => defHttp.get({ url: '/safety/ventanalyManageSystem/list', params });
// const getDeviceTableList = (params) => defHttp.get({ url: '/safety/ventanalyManageSystem/list', params });
const systemList = (params) => defHttp.post({ url: '/monitor/device', params });

/**
 * 用于setup关于系统设备下拉框相关的内容
 * @param sysType 对应的设备/类型码，可在设备管理 -> 设备类型管理里查阅
 * @param changeModalType 即 optionValue（选择了的设备）变化后的回调，参数为该 option
 */
export function useSystemSelect(sysType: string, changeModalType?: (param) => void) {
  const options = ref<OptionType[]>([]);
  const optionValue = ref('');
  const deviceList = ref<DeviceType[]>([]);
  const deviceActive = ref('');
  const deviceType = ref('');
  const deviceValue = ref({});
  const isRefresh = ref(true);

  /** 查询选中的场景下的关联设备监测数据 */
  async function getDeviceList(isFirst = false) {
    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);
      });
      deviceArr.unshift({
        deviceType: item.type,
        deviceName: item['typeName'] ? item['typeName'] : item['datalist'][0]['typeName'],
        datalist: data,
      });
    });
    deviceList.value = deviceArr;
    if (isFirst) {
      deviceChange(0);
      // getSelectRow(deviceActive.value);
    }
    return deviceArr;
  }
  /**查询场景类型下的场景列表 */
  async function getSysDataSource() {
    let res;
    if (sysType.startsWith('sys_')) {
      res = await getTableList({ strtype: sysType, pagetype: 'normal' });
      if (options.value.length == 0) {
        // 初始时选择第一条数据
        options.value = res.records || [];
      }
    } else {
      res = await systemList({ devicetype: sysType, pagetype: 'normal' });
      if (!options.value || options.value.length == 0) {
        // 初始时选择第一条数据
        const datalist = res.msgTxt[0].datalist || [];
        options.value = datalist.map((item) => {
          return { id: item['deviceID'], strsystype: sysType, systemname: item['strinstallpos'] };
        });
      }
    }
    if (!optionValue.value) {
      optionValue.value = options.value[0]['id'];
      getDeviceList(true);
      getSelectRow(optionValue.value);
    }
  }
  /**切换关联设备类型 */
  function deviceChange(index) {
    deviceValue.value = deviceList.value[index];
    deviceActive.value = optionValue.value;
    isRefresh.value = false;
    nextTick(() => {
      isRefresh.value = true;
    });
  }
  /** 切换场景 */
  async function getSelectRow(deviceID) {
    const currentData = options.value.find((item: any) => {
      return sysType.startsWith('sys_') ? item.id == deviceID : item.deviceID == deviceID;
    });
    optionValue.value = deviceID;
    if (changeModalType) changeModalType(currentData);
    getDeviceList(true);
  }

  return {
    /** 下拉框选项 */
    options,
    /** 下拉框目前选择的值 */
    optionValue,
    /** 设备列表 */
    deviceList,
    deviceActive,
    deviceType,
    isRefresh,
    /** 选中了的具体设备 */
    deviceValue,
    getSysDataSource,
    getSelectRow,
    deviceChange,
    getDeviceList,
  };
}