高级表单优化

Ben Lin

2024-07-02 2069d53e9be24adec3c8d6717fd7317555bd9a52

 src/views/tigerprojects/system/lowcode/high/index.vue

@@ -4,7 +4,7 @@
 * @version: 
 * @Date: 2024-06-18 15:09:48
 * @LastEditors: Ben Lin
 * @LastEditTime: 2024-07-02 03:42:25
 * @LastEditTime: 2024-07-02 22:51:31
-->
<!--
 *                        _oo0oo_
@@ -49,11 +49,11 @@
    @back="goBack"
  >
    <Suspense>
      <baseForm />
      <baseForm :entityName="entityName" />
    </Suspense>
    <!-- <a-card :title="titleInfo['baseTableTitle']" :bordered="false" class="!mt-5"> -->
      <Suspense>
        <dtl :entityName="entityName" />
      <dtl :entityName="entityName" @search="dtlFormSearch" />
      </Suspense>
    <!-- </a-card> -->
    <a-card
@@ -105,7 +105,13 @@
  import dtl from './dtl.vue';
  import baseForm from './baseForm.vue';
  import GeneralModal from '/@/views/components/GeneralModal.vue';
  import { AddListEntity, DeleteWhere, SaveEntity, getEntity } from '/@/api/tigerapi/system';
  import {
    AddAfterDelete,
    AddListEntity,
    DeleteWhere,
    SaveEntity,
    getEntity,
  } from '/@/api/tigerapi/system';
  import { useGlobSetting } from '/@/hooks/setting';
  import { useRoute, useRouter } from 'vue-router';
  import CustModal from '/@/views/components/CustModal.vue';
@@ -119,7 +125,6 @@
  import { buildUUID } from '/@/utils/uuid';
  import { isNullOrEmpty, isNullOrUnDef } from '/@/utils/is';
  import { useI18n } from '/@/hooks/web/useI18n';
import { Reactified } from '@vueuse/core';

  const { t } = useI18n();

@@ -135,9 +140,12 @@
    return tabStore.getTabList.find((item) => item.fullPath === route.fullPath)!;
  }
  const currentTab = getCurrentTab();
  const objParams = ref(JSON.parse(decodeURI(route.params?.id as string)));
  const routeParams = ref(JSON.parse(decodeURI(route.params?.id as string)));
  const entityName = ref(routeParams.value.Name);
  // 从sessionStorage中读取参数并转换回对象
  const savedParams = sessionStorage.getItem(`${routeParams.value.sName}_params`);
  const objParams = savedParams ? ref(JSON.parse(decodeURI(savedParams))) : ref({});
  const titleInfo = ref({}); //getTitle(objParams.value.Name);
  const entityName = ref(objParams.value.Name);
  const isAllUpdate = ref(objParams.value.CODE != '0');
  const globSetting = useGlobSetting();
  const formSchemas = ref({}); //弹出框或高级页面多表单结构
@@ -153,14 +161,16 @@
  const custImport = ref<any[]>([]);
  const others = ref<any>(null);
  const data = ref<any>({});
  const useTables = ref<any>({});
  for(const i in objParams.value['drawers']){
    data.value[objParams.value['drawers'][i]['name']] = ref<Recordable[]>([]);
  }
  provide<Ref<any>>('objParams', objParams.value);
  provide<Ref<any>>('objParams', objParams);
  provide<Ref<any>>('data', data);
  provide<Ref<any>>('others', others);
  provide<Ref<{}>>('useFormData', useFormData);
  provide<Ref<any>>('baseCards', baseCards);
  provide<Ref<any>>('useTables', useTables);

  const [registerCust, { openModal: openCustomModal, closeModal }] = useModal();
  const { setTitle } = useTabs();
@@ -200,19 +210,32 @@
          p.push(SaveEntity(res[Keys[i]], unref(isAllUpdate), baseCards.value[i]['entityName']));
        }
        Promise.all(p).then((action) => {
          DeleteWhere(
            ` ${objParams.value.pCode} = '${others.value[objParams.value.pCode]}'`,
            entityName.value,
          ).then((res) => {
            if (res.IsSuccessed) {
              data.value.forEach((item) => {
          // DeleteWhere(
          //   ` ${objParams.value.pCode} = '${others.value[objParams.value.pCode]}'`,
          //   entityName.value,
          // ).then((res) => {
          //   if (res.IsSuccessed) {
          //     data.value.forEach((item) => {
          //       item.ID = buildUUID();
          //     });
          //     AddListEntity(data.value, entityName.value).then((action) => {
          //       if (action.IsSuccessed) {
          //         cancel();
          //       }
          //     });
          //   }
          // });
          let where = `${objParams.value['drawers'][0]['code']} = '${others.value[objParams.value['drawers'][0]['code']]}'`;
          data.value[objParams.value['drawers'][0]['name']].forEach((item) => {
                item.ID = buildUUID();
              });
              AddListEntity(data.value, entityName.value).then((action) => {
          AddAfterDelete(
            objParams.value['drawers'][0]['name'],
            data.value[objParams.value['drawers'][0]['name']],
            where,
          ).then((action) => {
                if (action.IsSuccessed) {
                  cancel();
                }
              });
            }
          });
        });
@@ -249,6 +272,25 @@
  }

  /**
   * @description: 表格查询回调，根据对应子组件中表格的查询按钮提交事件转入动态调用的实体名方法去执行对应的查询逻辑，返回后刷新数据
   * @param {*} d
   * @return {*}
   */
  function dtlFormSearch(d) {
    try {
      var values = useTables.value[d.type][1].getForm().getFieldsValue();
      let data = custImport.value['default']()[0].FormSearch({ ...d, ...{ values: values } });
      useTables.value[d.type][1].setProps({
        dataSource: [],
      });
      useTables.value[d.type][1].setProps({
        dataSource: data,
      });
      useTables.value[d.type][1].reload();
    } catch (e) {}
  }

  /**
   * @description: Select 自定义onChange方法
   * @param {*} obj
   * @return {*}