Merge branch 'dev' of http://123.132.248.154:10000/HC_YFZX/vue-vben-admin into dev

表单调用接口对接完善，H5页面完善接口对接
2024-04-10 16:54:15 +08:00 · 2024-04-10 16:53:41 +08:00
4 changed files with 202 additions and 94 deletions
--- a/src/api/formrender/index.ts
+++ b/src/api/formrender/index.ts
@ -11,7 +11,9 @@ enum Api {
  GETFORMPAGEDATA = '/api/FormScheme/GetFormDataPage?id=', //获取表单分页数据
  SAVEFORMDATA = '/api/FormScheme/SaveForm', //新增编辑自定义表单
  DELFORMSDATA = '/api/FormScheme/DeleteFormData?id=', //删除表单数据
+  GETFORMSDATADETAIL = '/api/FormScheme/GetFormData', //删除表单数据详情
 }
+
 /**
 * @description: Get sample options value
 */
@ -26,3 +28,5 @@ export const delFormsData = (params: DeleteFormsParams) =>
    url: Api.DELFORMSDATA + params.id + '&key=' + params.key + '&keyValue=' + params.keyValue,
    params,
  });
+export const getFormsDataDetail = (params: DeleteFormsParams) =>
+  defHttp.get<AccountListGetResultModel[]>({ url: Api.GETFORMSDATADETAIL, params });
--- a/src/views/demo/h5html/index.vue
+++ b/src/views/demo/h5html/index.vue
@ -1,21 +1,19 @@
 <template>
-  <PageHeader title="返回" />
-  <div class="form-box">
-    <BasicForm ref="myDataBaseFormRef" @register="registerForm" v-if="formModalVisible" />
-  </div>
-  <div class="btn-box">
-    <a-button class="leftbtn" size="large" @click="closeModalClick">取消</a-button>
-    <a-button class="rightbtn" type="primary" size="large" @click="closeModalClick">保存</a-button>
+  <div :class="`${prefixCls}`">
+    <div :class="`${prefixCls}-header`">{{ paramsTitle }}</div>
+    <div :class="`${prefixCls}-content`">
+      <BasicForm ref="myDataBaseFormRef" @register="registerForm" v-if="formModalVisible" />
+    </div>
+    <div :class="`${prefixCls}-footer`">
+      <div :class="`${prefixCls}-footer-confirm`" @click="submitClick">保存</div>
+      <div :class="`${prefixCls}-footer-cancle`" @click="close">取消</div>
+    </div>
  </div>
 </template>
 <script lang="ts" setup>
  import { unref, ref, onMounted } from 'vue';
-  import {
-    getFormsDesignData,
-    getFormsPageData,
-    delFormsData,
-    saveFormsData,
-  } from '@/api/formrender/index';
+  import { getFormsDesignData, getFormsDataDetail, saveFormsData } from '@/api/formrender/index';
+  import { getOutKeyList } from '@/api/formdesign/index';
  import { FormSchema } from '@/components/Table';
  import { BasicForm, useForm } from '@/components/Form';
  import { useMessage } from '@/hooks/web/useMessage';
@ -27,10 +25,17 @@
  const formModalVisible = ref(false);
  const isUpdate = ref(true);
  const schemeId = ref();
-  const primaryQuery = ref();
+  const paramsKey = ref();
  const addQuery: any = ref([]);
  const formColumns: FormSchema[] = [];
+  const paramsTitle = route.query.name;
  const paramsCode = route.query.code;
+  const paramsKeyValue = route.query.keyValue; //keyValue编辑传新增不传
+  if (paramsKeyValue) {
+    isUpdate.value = true;
+  } else {
+    isUpdate.value = false;
+  }

  function generateUniqueDigits(length: number): number[] {
    const digits = new Set<number>();
@ -40,7 +45,6 @@
    }
    return Array.from(digits);
  }
-  const uniqueDigits = generateUniqueDigits(20);

  const [registerForm, { setFieldsValue, validate }] = useForm({
    labelWidth: 100,
@ -49,31 +53,32 @@
    showActionButtonGroup: false,
    baseColProps: { lg: 24, md: 24 },
  });
+  //取消
+  function close() {}
  //表单填写数据
-  async function ModalSureClick() {
+  async function submitClick() {
    try {
      const values = await validate();
      let query = values;
-      console.log('query', query);
      let params: any = {
-        schemeId: primaryQuery.value.id,
+        schemeId: schemeId.value,
        isUpdate: isUpdate.value,
-        pkey: primaryQuery.value.key,
+        pkey: paramsKey.value,
      };
-      console.log('params', params);
      if (unref(isUpdate)) {
-        params.pkeyValue = primaryQuery.value.keyValue;
+        params.pkeyValue = paramsKeyValue;
      } else {
        addQuery.value.forEach((item) => {
          if (item.type == 'main') {
            params.pkeyValue = item.value;
          }
-          query[item.field] = item.value;
+          if (!query[item.field]) {
+            query[item.field] = item.value;
+          }
        });
      }
      params.data = JSON.stringify(query);
-      console.log('query222', query);
-      console.log('params222', params);
+
      const data = await saveFormsData(params);
      if (data) {
        emit('success');
@ -82,6 +87,7 @@
        return createMessage.error('操作失败');
      }
    } finally {
+      console.log('err');
    }
  }
  function getPublicForm() {
@ -89,55 +95,144 @@
      code: paramsCode,
    };
    getFormsDesignData(params).then((res: Recordable) => {
-      console.log('res', res);
-      let columnObj = JSON.parse(res.entity.scheme);
      let formObj = JSON.parse(res.formScheme.scheme);
-      console.log('formObj', formObj);
      formObj.formInfo.schemas.forEach((item) => {
        formColumns.push(item);
      });
      formModalVisible.value = true;
      schemeId.value = res.formScheme.id;
+      paramsKey.value = formObj.primaryKey;
+      let arr: any = [];
+      formObj.db.forEach((val) => {
+        let params = {
+          dbCode: formObj.dbCode,
+          tableNames: val.name,
+        };
+        let chlidKey: any = ref();
+        if (val.type === 'chlid') {
+          getOutKeyList(params).then((res: Recordable) => {
+            if (res[0]) {
+              res[0].db_codecolumnsList.forEach((item) => {
+                if (item.isPrimaryKey == 1) {
+                  chlidKey.value = item.dbColumnName;
+                }
+              });
+            }
+          });
+        }
+        formObj.formInfo.schemas.forEach((item) => {
+          if (
+            item.componentProps.dataTable == val.name &&
+            formObj.primaryKey == item.componentProps.fieldName
+          ) {
+            arr.push({
+              type: val.type,
+              field: item.field,
+            });
+          }
+          if (
+            val.type == 'chlid' &&
+            val.name == item.componentProps.dataTable &&
+            chlidKey.value == item.componentProps.fieldName
+          ) {
+            arr.push({
+              type: val.type,
+              field: item.field,
+            });
+          }
+        });
+      });
+      let newArr: any = [...new Set(arr)];
+      addQuery.value = [];
+      if (newArr && !unref(isUpdate)) {
+        newArr.forEach((item) => {
+          addQuery.value.push({
+            type: item.type,
+            field: item.field,
+            value: generateUniqueDigits(20).join(''),
+          });
+        });
+      }
+
+      if (formObj.primaryKey) {
+        getFormDetail(formObj.primaryKey);
+      }
+    });
+  }
+  function getFormDetail(key: '') {
+    if (!paramsKeyValue) {
+      return;
+    }
+    let params = {
+      id: schemeId.value,
+      key: key,
+      keyValue: paramsKeyValue,
+    };
+    getFormsDataDetail(params).then((res: Recordable) => {
+      if (res) {
+        let obj: any = {};
+        res.forEach((item) => {
+          obj[item.columnName] = item.value;
+        });
+        setFieldsValue(obj);
+      }
    });
  }
  onMounted(() => {
    getPublicForm();
  });
+  const prefixCls = 'form-box';
 </script>
-<style scoped>
+<style lang="less" scoped>
  .form-box {
-    height: calc(100% - 90px);
-    padding: 20px 20px 40px 10px;
-    overflow: auto;
-  }
-
-  .btn-box {
-    display: flex;
-    position: fixed;
-    bottom: 0;
-    align-items: center;
-    justify-content: center;
    width: 100%;
-    height: 80px;
-    border-top: 1px solid #eee;
-  }
+    height: 100%;
+    background: #eceff9;

-  .leftbtn {
-    width: 100px;
-    margin-right: 20px;
-  }
+    &-header {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 80px;
+      background: #fff;
+      font-size: 16px;
+    }

-  .rightbtn {
-    width: 100px;
-  }
+    &-content {
+      height: calc(100% - 220px);
+      padding: 20px;
+      overflow: auto;
+    }

-  ::v-deep .ant-form-item-label {
-    flex: none !important;
-    padding-right: 10px !important;
-    text-align: right !important;
-  }
+    &-footer {
+      position: fixed;
+      bottom: 30px;
+      width: 100%;

-  ::v-deep .ant-form-item-control {
-    flex: none !important;
+      &-cancle {
+        width: 94%;
+        height: 50px;
+        margin-top: 10px;
+        margin-left: 3%;
+        border-radius: 4px;
+        background: #fff;
+        color: #a7afd0;
+        font-size: 18px;
+        line-height: 50px;
+        text-align: center;
+      }
+
+      &-confirm {
+        width: 94%;
+        height: 50px;
+        margin-left: 3%;
+        border-radius: 4px;
+        background: #1e5eff;
+        color: #fff;
+        font-size: 18px;
+        line-height: 50px;
+        text-align: center;
+      }
+    }
  }
 </style>
--- a/src/views/demo/onlineform/formCall/CallModal.vue
+++ b/src/views/demo/onlineform/formCall/CallModal.vue
@ -77,7 +77,6 @@
    }
    return Array.from(digits);
  }
-  const uniqueDigits = generateUniqueDigits(20);

  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
    labelWidth: 100,
@ -104,7 +103,9 @@
          if (item.type == 'main') {
            params.pkeyValue = item.value;
          }
-          query[item.field] = item.value;
+          if (!query[item.field]) {
+            query[item.field] = item.value;
+          }
        });
      }
      params.data = JSON.stringify(query);
@ -123,35 +124,4 @@
      setModalProps({ confirmLoading: false });
    }
  }
-  // async function handleSubmit() {
-  //   try {
-  //     const values = await validate();
-  //     let query = values;
-  //     // 调用接口
-  //     if (!unref(isUpdate)) {
-  //       const data = await addDataBaseInfo(query);
-  //       if (data) {
-  //         setModalProps({ confirmLoading: true });
-  //         closeModal();
-  //         emit('success');
-  //         return createMessage.success('新增成功');
-  //       } else {
-  //         return createMessage.error('新增失败');
-  //       }
-  //     } else {
-  //       query.databaseLinkId = detailValue.value.databaseLinkId
-  //       const data = await editDataBaseInfo(query);
-  //       if (data) {
-  //         setModalProps({ confirmLoading: true });
-  //         closeModal();
-  //         emit('success');
-  //         return createMessage.success('编辑成功');
-  //       } else {
-  //         return createMessage.error('编辑失败');
-  //       }
-  //     }
-  //   } finally {
-  //     setModalProps({ confirmLoading: false });
-  //   }
-  // }
 </script>
--- a/src/views/demo/onlineform/formCall/index.vue
+++ b/src/views/demo/onlineform/formCall/index.vue
@ -33,6 +33,7 @@
  import { BasicTable, useTable, BasicColumn } from '@/components/Table';
  import { BasicTree, TreeItem, TreeActionItem, TreeActionType } from '@/components/Tree';
  import { getFormsDesignData, getFormsPageData, delFormsData } from '@/api/formrender/index';
+  import { getOutKeyList } from '@/api/formdesign/index';
  import { searchFormSchema } from './index.data';
  import { PageWrapper } from '@/components/Page';
  import { cloneDeep } from 'lodash-es';
@ -53,6 +54,7 @@
  const treeVisible: any = ref(false);
  const paramsId: any = ref();
  const designData: any = ref();
+  const searchValue: any = ref();
  const addParamsArr: any = ref([]);
  const primaryKeyFailed: any = ref();
  const paramsCode = route.query.code;
@ -62,14 +64,14 @@
  const asyncExpandTreeRef = ref<Nullable<TreeActionType>>(null);
  const actionList: TreeActionItem[] = [];
  const [registerModal, { openModal }] = useModal();
-  const [registerTable, { reload, setColumns, getSelectRows }] = useTable({
+  const [registerTable, { reload, setColumns, getSelectRows, clearSelectedRowKeys }] = useTable({
    title: '表单列表',
    api: getFormsPageData,
    // rowKey: 'f_Id',
    columns: callColumns,
    formConfig: {
      labelWidth: 120,
-      schemas: searchFormSchema,
+      // schemas: searchFormSchema,
    },
    rowSelection: {
      type: 'radio',
@ -87,6 +89,7 @@
          rows: data.limit,
          keyWord: data.key,
        },
+        queryJson: searchValue.value,
      };
      return temp;
    },
@ -96,6 +99,24 @@
      let arr: any = [];
      if (rel.primaryKey) {
        rel.db.forEach((val) => {
+          let params = {
+            dbCode: rel.dbCode,
+            tableNames: val.name,
+          };
+          let chlidKey: any = ref();
+          if (val.type === 'chlid') {
+            getOutKeyList(params).then((res: Recordable) => {
+              if (res[0]) {
+                res[0].db_codecolumnsList.forEach((item) => {
+                  if (item.isPrimaryKey == 1) {
+                    chlidKey.value = item.dbColumnName;
+                  }
+                });
+              }
+            });
+          }
+
+          console.log('chlidKey', chlidKey);
          rel.formInfo.schemas.forEach((item) => {
            if (
              item.componentProps.dataTable == val.name &&
@ -106,6 +127,16 @@
                field: item.field,
              });
            }
+            if (
+              val.type == 'chlid' &&
+              val.name == item.componentProps.dataTable &&
+              chlidKey.value == item.componentProps.fieldName
+            ) {
+              arr.push({
+                type: val.type,
+                field: item.field,
+              });
+            }
          });
        });
      }
@ -191,11 +222,14 @@
              console.log('rrr', res);
              if (res) {
                createMessage.success('删除成功', 2);
+                setTimeout(() => {
+                  clearSelectedRowKeys();
+                  reload();
+                }, 100);
              } else {
                createMessage.error('删除失败', 2);
              }
            });
-            reload();
          },
        });
        break;
@ -219,10 +253,15 @@
        break;
    }
  };
-  function handleSelect(GroupId = '') {
-    console.log('GroupId', GroupId);
+  function handleSelect(selectedKeys: any, selected: any) {
+    const rel = selected.node.dataRef;
+    const obj: any = {};
+    obj[rel.key] = rel.value;
+    console.log('obj', obj);
+    searchValue.value = JSON.stringify(obj);
    reload();
  }
+
  function getPublicForm() {
    let params = {
      code: paramsCode,
Author	SHA1	Message	Date
zzq	fc4d5636c2	Merge branch 'dev' of http://123.132.248.154:10000/HC_YFZX/vue-vben-admin into dev	2024-04-10 16:54:15 +08:00
zzq	fbdb0819a9	表单调用接口对接完善，H5页面完善接口对接	2024-04-10 16:53:41 +08:00