CreateStructModal.vue 2.66 KB
<script setup lang="ts">
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { ref, unref } from 'vue';
  import { StructJSON } from '/@/api/device/model/modelOfMatterModel';
  import { DataActionModeEnum } from '/@/enums/toolEnum';
  import { DataTypeForm } from '../DataTypeForm';
  import { DataTypeEnum } from '/@/enums/objectModelEnum';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useI18n } from '/@/hooks/web/useI18n';

  const props = withDefaults(
    defineProps<{ value?: StructJSON[]; dataType?: DataTypeEnum[]; mode?: DataActionModeEnum }>(),
    {
      value: () => [],
      dataType: () => Object.values(DataTypeEnum),
    }
  );

  const { t } = useI18n();

  const dataTypeFormRef = ref<InstanceType<typeof DataTypeForm>>();

  const emits = defineEmits(['register', 'complete']);

  const currentMode = ref(DataActionModeEnum.CREATE);
  const currentEditIndex = ref<number>(-1);
  const [registerModal] = useModalInner(({ mode, record }: ModalParamsType<StructJSON>) => {
    unref(dataTypeFormRef)?.resetFieldsValue?.();
    currentMode.value = mode;
    currentEditIndex.value = props.value.findIndex(
      (item) => item.identifier === record?.identifier
    );

    if (mode === DataActionModeEnum.UPDATE) {
      unref(dataTypeFormRef)?.setFieldsValue?.(record);
    }
  });

  const { createMessage } = useMessage();

  const handleValidateHasSameIdentifier = (formValue?: StructJSON) => {
    const { identifier } = formValue || {};
    const message = '存在一致的标识符';
    if (unref(currentMode) === DataActionModeEnum.CREATE) {
      if (props.value.filter((item) => item.identifier === identifier).length >= 1) {
        createMessage.warn(message);
        return Promise.reject(message);
      }
    } else {
      const list = [...props.value];
      list.splice(unref(currentEditIndex), 1, formValue!);
      const existLength = list.filter((item) => item?.identifier === formValue?.identifier).length;
      if (existLength > 1) {
        createMessage.warn(message);
        return Promise.reject(message);
      }
    }

    return Promise.resolve();
  };

  const handleOk = async () => {
    await unref(dataTypeFormRef)?.validate?.();
    const value = unref(dataTypeFormRef)?.getFieldsValue?.();
    await handleValidateHasSameIdentifier(value);
    emits('complete', value, unref(currentEditIndex));
  };
</script>

<template>
  <BasicModal
    @register="registerModal"
    :title="t('common.createParams')"
    @ok="handleOk"
    :width="480"
    :show-ok-btn="mode !== DataActionModeEnum.READ"
  >
    <DataTypeForm ref="dataTypeFormRef" :data-type="dataType" show-remark :mode="mode" />
  </BasicModal>
</template>