datasource.config.ts 5.61 KB
import { FormSchema } from '/@/components/Form';
import { DataSourceField } from '../../../config/common.config';
import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
import { findDictItemByCode } from '/@/api/system/dict';
import { getDeviceProfile } from '/@/api/alarm/position';
import { useSelectWidgetMode } from '/@/views/visual/dataSourceBindPanel/useContext';
import { DataActionModeEnum } from '/@/enums/toolEnum';
import { unref } from 'vue';
import { getMeetTheConditionsDevice } from '/@/api/dataBoard';
import { MasterDeviceList } from '/@/api/dataBoard/model';

export const formSchemas = (): FormSchema[] => {
  const mode = useSelectWidgetMode();
  const isUpdate = unref(mode) === DataActionModeEnum.UPDATE;
  return [
    {
      field: DataSourceField.DEVICE_NAME,
      component: 'Input',
      label: '设备名',
      show: false,
    },
    {
      field: DataSourceField.DEVICE_TYPE,
      component: 'ApiSelect',
      label: '设备类型',
      colProps: { span: 8 },
      rules: [{ message: '请选择设备类型', required: true }],
      componentProps: ({ formActionType }) => {
        const { setFieldsValue } = formActionType;
        return {
          api: findDictItemByCode,
          params: {
            dictCode: 'device_type',
          },
          valueField: 'itemValue',
          labelField: 'itemText',
          placeholder: '请选择设备类型',
          onChange: (value: DeviceTypeEnum) => {
            setFieldsValue({
              [DataSourceField.IS_GATEWAY_DEVICE]: value === DeviceTypeEnum.GATEWAY,
              [DataSourceField.DEVICE_PROFILE_ID]: null,
              [DataSourceField.DEVICE_ID]: null,
              [DataSourceField.ATTRIBUTE]: null,
              [DataSourceField.ATTRIBUTE_NAME]: null,
              [DataSourceField.TRANSPORT_TYPE]: null,
            });
          },
          getPopupContainer: () => document.body,
        };
      },
    },
    {
      field: DataSourceField.DEVICE_PROFILE_ID,
      component: 'ApiSelect',
      label: '产品',
      colProps: { span: 8 },
      rules: [{ required: true, message: '产品为必填项' }],
      componentProps: ({ formActionType, formModel }) => {
        const { setFieldsValue } = formActionType;
        const deviceType = formModel[DataSourceField.DEVICE_TYPE];
        return {
          api: async () => {
            if (!deviceType) return [];
            const list = await getDeviceProfile(deviceType);
            if (isUpdate) {
              const deviceProfileId = formModel[DataSourceField.DEVICE_PROFILE_ID];
              const record = list.find((item) => item.id === deviceProfileId);
              setFieldsValue({ [DataSourceField.TRANSPORT_TYPE]: record?.transportType });
            }
            return list;
          },
          labelField: 'name',
          valueField: 'id',
          placeholder: '请选择产品',
          onChange: (_, option = {} as Record<'transportType', string>) => {
            setFieldsValue({
              [DataSourceField.DEVICE_ID]: null,
              [DataSourceField.ATTRIBUTE]: null,
              [DataSourceField.ATTRIBUTE_NAME]: null,
              [DataSourceField.TRANSPORT_TYPE]: option[DataSourceField.TRANSPORT_TYPE],
            });
          },
          getPopupContainer: () => document.body,
        };
      },
    },
    {
      field: DataSourceField.ORIGINATION_ID,
      component: 'OrgTreeSelect',
      label: '组织',
      colProps: { span: 8 },
      rules: [{ required: true, message: '组织为必填项' }],
      componentProps({ formActionType }) {
        const { setFieldsValue } = formActionType;
        return {
          placeholder: '请选择组织',
          onChange() {
            setFieldsValue({
              [DataSourceField.DEVICE_ID]: null,
            });
          },
          showCreate: false,
          getPopupContainer: () => document.body,
        };
      },
    },
    {
      field: DataSourceField.DEVICE_PROFILE_ID,
      component: 'Input',
      label: '',
      show: false,
    },
    {
      field: DataSourceField.DEVICE_ID,
      component: 'ApiSelect',
      label: '设备',
      colProps: { span: 8 },
      rules: [{ required: true, message: '设备名称为必填项' }],
      componentProps({ formModel, formActionType }) {
        const { setFieldsValue } = formActionType;
        const organizationId = formModel[DataSourceField.ORIGINATION_ID];
        const deviceProfileId = formModel[DataSourceField.DEVICE_PROFILE_ID];
        const deviceType = formModel[DataSourceField.DEVICE_TYPE];

        return {
          api: async () => {
            if (organizationId) {
              try {
                const data = await getMeetTheConditionsDevice({
                  organizationId,
                  deviceProfileId,
                  deviceType,
                });
                if (data)
                  return data.map((item) => ({
                    ...item,
                    label: item.alias || item.name,
                    value: item.tbDeviceId,
                    deviceType: item.deviceType,
                  }));
              } catch (error) {}
            }
            return [];
          },
          onChange(_value, record: MasterDeviceList) {
            setFieldsValue({
              [DataSourceField.DEVICE_NAME]: record?.label,
            });
          },
          placeholder: '请选择设备',
          getPopupContainer: () => document.body,
        };
      },
    },
    {
      field: DataSourceField.DEVICE_RENAME,
      component: 'Input',
      label: '设备名',
      colProps: { span: 8 },
      componentProps: {
        placeholder: '设备重命名',
      },
    },
  ];
};