保存默认工艺路线，工单批次优化

Ben Lin

2024-10-07 b6163e1bed94b4d02d1b6f01fdc2eb3f15ca22e3

 src/views/tigerprojects/system/lowcode/normalDrawer.vue

@@ -31,104 +31,216 @@
 * @LastEditTime: 2024-06-14 09:14:35
-->
<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="600px" @ok="handleSubmit">
  <BasicDrawer
    v-bind="$attrs"
    @register="registerDrawer"
    showFooter
    :title="getTitle"
    width="580px"
    @ok="handleSubmit"
  >
    <BasicForm @register="registerForm">
      <template #[item]="{ field }" v-for="item in crudColSlots" :key="item">
        <a-button v-if="field" class="mt-1 ml-1" size="small" @click="handleSelectItem(item)" preIcon="search|svg" />
        <NormalModal @register="registerItemAdd" @success="(d, u) => handleItemSuccess(d, u, item)" />
        <a-button
          v-if="field"
          class="mt-1 ml-1"
          size="small"
          @click="handleSelectItem(item)"
          preIcon="search|svg"
        />
        <GeneralModal
          v-if="showModal"
          @register="useModaldata[item][0]"
          @success="(d, u) => handleItemSuccess(d, u, item)"
        />
      </template>
    </BasicForm>
  </BasicDrawer>
</template>
<script lang="ts" setup>
import { ref, computed, unref, onMounted } from 'vue';
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
import { useGlobSetting } from '/@/hooks/setting';
import NormalModal from '/@/views/components/NormalModal.vue';
import { SaveEntity, fetchJson, formatValues } from '/@/api/tigerapi/system';
import { useModal } from '/@/components/Modal';
import { GetSelectSuccess, OpenSelectItem } from './data';
import { isArray, isNullOrEmpty } from '/@/utils/is';
  import { ref, computed, unref, onMounted, nextTick } from 'vue';
  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { useGlobSetting } from '/@/hooks/setting';
  import GeneralModal from '/@/views/components/GeneralModal.vue';
  import { SaveEntity, fetchJson, formatValues } from '/@/api/tigerapi/system';
  import { useModal } from '/@/components/Modal';
  import { isNullOrUnDef, isTimeViaRegExp8601 } from '/@/utils/is';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { useUserStore } from '/@/store/modules/user';
  import { dateUtil } from '/@/utils/dateUtil';

const emit = defineEmits(['success', 'register']);
const globSetting = useGlobSetting();
const isUpdate = ref(true);
const entityName = ref('');
const formSchema = ref([]);
const crudColSlots = ref<any>([]);
const [registerItemAdd, { openModal: openItemModal }] = useModal();
const [registerForm, { resetFields, setFieldsValue, getFieldsValue, validate }] = useForm({
  labelWidth: 140,
  schemas: formSchema as unknown as FormSchema[],
  actionColOptions: {
    span: 24,
  },
  showActionButtonGroup: false,
});
  const emit = defineEmits(['success', 'register']);
  const { t } = useI18n();
  const { createErrorModal } = useMessage();
  const globSetting = useGlobSetting();
  const isUpdate = ref(true);
  const ifSave = ref(true);
  const entityName = ref('');
  const formSchema = ref([]);
  const crudColSlots = ref<any>([]);
  const isExistSql = ref('');
  const useModaldata = ref({});
  const showModal = ref(false);
  const [registerForm, { resetFields, setFieldsValue, getFieldsValue, validate }] = useForm({
    labelWidth: 140,
    schemas: formSchema as unknown as FormSchema[],
    actionColOptions: {
      span: 24,
    },
    showActionButtonGroup: false,
  });

const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
  isUpdate.value = !!data?.isUpdate;
  entityName.value = data?.entityName;
  // formSchema.value = await fetchJson(
  //   `${globSetting.downloadUrl}/LowCode/${unref(entityName)}/${
  //     entityName.value
  //   }_addEditform.json`,
  // );
  formSchema.value = data?.formJson;
  crudColSlots.value = data?.crudColSlots;
  resetFields();
  setDrawerProps({ confirmLoading: false });

  if (unref(isUpdate)) {
    setFieldsValue({
      ...data.record,
    });
  }else{
    if(!isNullOrEmpty(data?.others)){}
    setFieldsValue(data?.others);
  }
});

const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));

onMounted(async () => { });
async function handleSubmit() {
  try {
    let values = await validate();
    //判断保存的值如果是[]数组的，就直接取[0]第一个值，一般针对上传模板的地址
    values = formatValues(values);
    setDrawerProps({ confirmLoading: true });
    // TODO custom api
    //保存
    SaveEntity(values, unref(isUpdate), unref(entityName)).then((action) => {
      if (action.IsSuccessed) {
        closeDrawer();
        emit('success');
      }
    });
  } finally {
  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    showModal.value = false;
    /* 动态import实体名.ts的自定义方法 */
    let m = {} as any;
    try {
      m = await import(`./entityts/${data?.keyName}.ts`);
    } catch (e) {}
    isUpdate.value = !!data?.isUpdate;
    ifSave.value = !!data?.ifSave;
    entityName.value = data?.entityName;
    formSchema.value = !isNullOrUnDef(m.default)
      ? m.default()[0].GetCrudForm(data?.name, data?.data, data.record)
      : data?.formJson;
    crudColSlots.value = data?.crudColSlots;
    isExistSql.value = data?.isExistSql;
    /* 如果插槽列表不为空，则初始化模态窗口 */
    if (!isNullOrUnDef(crudColSlots.value) && crudColSlots.value.length > 0) {
      await nextTick();
      crudColSlots.value.forEach((d) => {
        useModaldata.value[d] = useModal();
      });
      showModal.value = true;
    }
    resetFields();
    setDrawerProps({ confirmLoading: false });

    if (unref(isUpdate)) {
      /* 循环字段名，判断如果是时间的就转换成dayjs格式，否则时间选择器会出错 */
      const Keys = Object.getOwnPropertyNames(data.record);
      for (const k in Keys) {
        if (!isNullOrUnDef(data.record[Keys[k]]) && isTimeViaRegExp8601(data.record[Keys[k]])) {
          data.record[Keys[k]] = dateUtil(data.record[Keys[k]]); //转换成dayjs格式
        }
      }
      setFieldsValue({
        ...data.record,
      });
    } else {
      if (!isNullOrUnDef(data?.keyFieldValues)) {
        setFieldsValue(data?.keyFieldValues);
      }
    }
  });

  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));

  onMounted(async () => {});
  async function handleSubmit() {
    try {
      let values = await validate();
      //判断保存的值如果是[]数组的，就直接取[0]第一个值，一般针对上传模板的地址
      values = formatValues(values);
      setDrawerProps({ confirmLoading: true });
      // TODO custom api
      if (unref(ifSave)) {
        values.AUTH_ORG = useUserStore().getUserInfo.orgCode;
        //保存
        SaveEntity(
          values,
          unref(isUpdate),
          unref(entityName),
          `${isExistSql.value}='${values[isExistSql.value]}'`,
        ).then((action) => {
          if (action.IsSuccessed) {
            closeDrawer();
            emit('success', values, { isUpdate: isUpdate.value });
          } else {
            createErrorModal({ title: t('sys.api.errorTip'), content: action.Message });
          }
        });
      } else {
        closeDrawer();
        emit('success', values, { isUpdate: isUpdate.value });
      }
    } finally {
      setDrawerProps({ confirmLoading: false });
    }
  }
}

/**
 * @description: 弹出选择框选择成功后事件
 * @param {*} d
 * @param {*} u
 * @param {*} item
 * @return {*}
 */
function handleItemSuccess(d, u, item) {
  setFieldsValue(GetSelectSuccess(d, u, getFieldsValue()[`${item.replace(/add/, '')}PSelect_0`]));
}
  /**
   * @description: 弹出选择框选择成功后事件
   * @param {*} d
   * @param {*} u
   * @param {*} item
   * @return {*}
   */
  function handleItemSuccess(d, u, item) {
    /* 动态import实体名.ts的自定义方法 */
    try {
      import(`./entityts/${getFieldsValue()[`${item.replace(/add/, '')}PSelect_0`]}.ts`)
        .then((m) => {
          const [{ GetSelectSuccess }] = m.default();
          setFieldsValue(GetSelectSuccess(d, u));
        })
        .catch(() => {
          setFieldsValue({
            ITEM_CODE: d.values['val'],
          });
        });
    } catch (e) {}
  }

/**
 * @description: 弹出选择框
 * @param {*} item
 * @return {*}
 */
function handleSelectItem(item) {
  OpenSelectItem(openItemModal, getFieldsValue()[`${item.replace(/add/, '')}PSelect_0`]);
}
  /**
   * @description: 弹出选择框
   * @param {*} item
   * @return {*}
   */
  function handleSelectItem(item) {
    /* 动态import实体名.ts的自定义方法 */
    try {
      import(`./entityts/${getFieldsValue()[`${item.replace(/add/, '')}PSelect_0`]}.ts`)
        .then((m) => {
          const [{ OpenSelectItem }] = m.default();
          OpenSelectItem(useModaldata.value[item][1].openModal);
        })
        .catch((err) => {
          useModaldata.value[item][1].openModal(true, {
            title: '物料列表',
            schemas: [
              {
                field: 'ITEM_CODE',
                component: 'Input',
                label: '物料编码',
                colProps: {
                  span: 12,
                },
              },
            ],
            ItemColumns: [
              {
                title: t('物料编码'),
                dataIndex: 'ITEM_CODE',
                resizable: true,
                sorter: true,
                width: 200,
              },
              {
                title: t('物料名称'),
                dataIndex: 'ITEM_NAME',
                resizable: true,
                sorter: true,
                width: 180,
              },
            ],
            tableName: 'BAS_ITEM',
            rowKey: 'ITEM_CODE',
            searchInfo: { TABLE_NAME: 'BAS_ITEM' },
          });
        });
    } catch (e) {}
  }
</script>