删除高级表单

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fs-admin",
-  "version": "1.7.3",
+  "version": "1.7.4",
   "scripts": {
     "dev": "vite --host",
     "build": "run-p type-check build-only",

src/components/core/ProCardList.vue

@@ -7,12 +7,12 @@ export default {
 <script setup lang="ts">
 import router from '@/router'
 import { ElMessage, ElMessageBox, type DialogProps } from 'element-plus'
-import type { AdvancedForm, BasicForm, ICRUD } from '@/types/form'
+import type { BasicForm, BasicFormItem, ICRUD } from '@/types/form'
 
 interface Props {
   crud: ICRUD
   pageSize?: number
-  formConfig: BasicForm | AdvancedForm
+  formConfig: BasicForm
   dialogConfig?: DialogProps
   height?: string
   cardHeight?: string
@@ -32,15 +32,19 @@ const emits = defineEmits(['click-create', 'click-edit'])
 // ============== 查询部分开始 ===============
 const query = ref<any>({})
 const searchList = ref<any>([])
+// 构造搜索列表
+const buildSearchList = (item: BasicFormItem) => {
+  if (item.search) {
+    searchList.value.push(Object.assign({}, item, { props: { ...item.props, disabled: false } }))
+  }
+  item.children && item.children.forEach(buildSearchList)
+}
 watch(
   () => props.formConfig.formItems,
   val => {
-    val.forEach((item: any) => {
-      if (item.group) {
-        searchList.value = searchList.value.concat(item.group.filter((item: any) => item.search))
-      } else {
-        item.search && searchList.value.push(item)
-      }
+    searchList.value = []
+    val.forEach((item: BasicFormItem) => {
+      buildSearchList(item)
     })
   },
   { immediate: true }

src/components/core/ProTable.vue

@@ -7,7 +7,7 @@ export default {
 <script setup lang="ts">
 import router from '@/router'
 import { ElMessage, ElMessageBox, type DialogProps } from 'element-plus'
-import type { AdvancedForm, BasicForm, BasicFormItem, ICRUD, FormSlot } from '@/types/form'
+import type { BasicForm, BasicFormItem, ICRUD, FormSlot } from '@/types/form'
 import type { VXEComponent, VxeToolbarProps, VxeToolbarEventProps } from 'vxe-table'
 import { buildFormSlots } from '@/utils/utils'
 
@@ -54,12 +54,8 @@ watch(
   () => props.formConfig.formItems,
   val => {
     searchList.value = []
-    val.forEach((item: any) => {
-      if (item.group) {
-        searchList.value = searchList.value.concat(item.group.filter((item: any) => item.search))
-      } else {
-        buildSearchList(item)
-      }
+    val.forEach((item: BasicFormItem) => {
+      buildSearchList(item)
     })
   },
   { immediate: true }
@@ -208,13 +204,6 @@ const handleFormSuccess = () => {
 // 构造表单插槽
 const formSlots = ref<FormSlot[]>([])
 buildFormSlots(props.formConfig.formItems, formSlots.value)
-// if (props.formConfig.advanced) {
-//   props.formConfig.formItems.forEach((item: any) => {
-//     item.group.forEach((subItem: any) => Array.prototype.push.apply(formSlots.value, subItem.slots))
-//   })
-// } else {
-//   props.formConfig.formItems.forEach((item: any) => Array.prototype.push.apply(formSlots.value, item.slots))
-// }
 // ============== 表单部分结束 ===============
 
 defineExpose({

src/components/core/form/AdvancedForm.vue

@@ -1,92 +0,0 @@
-<script setup lang="ts">
-import type { AdvancedForm, FormSlot } from '@/types/form'
-import { containerTypes } from '@/utils/constants'
-import { buildFormSlots } from '@/utils/utils'
-
-interface Props {
-  formConfig: AdvancedForm
-  formData: any
-  formSlots?: Array<FormSlot>
-}
-const props = defineProps<Props>()
-
-const formData = computed(() => {
-  if (props.formData.id) {
-    return props.formData
-  } else {
-    const res = props.formData
-    props.formConfig?.formItems.forEach(item => {
-      item.group.forEach(element => {
-        if (containerTypes.includes(element.type)) {
-          element.children?.forEach(tab => {
-            tab.children?.forEach(child => {
-              if (!child.notFormItem) {
-                res[child.name] =
-                  res[child.name] !== undefined && child.value !== undefined ? res[child.name] : child.value
-              }
-            })
-          })
-        } else {
-          if (!element.notFormItem) {
-            // 避免修改当前表单项value重置其他表单项的value
-            res[element.name] =
-              res[element.name] !== undefined && element.value !== undefined ? res[element.name] : element.value
-          }
-        }
-      })
-    })
-    return res
-  }
-})
-</script>
-
-<template>
-  <el-card
-    v-for="(item, index) in formConfig.formItems"
-    :key="index"
-    :header="item.label"
-    class="mb-16px"
-    shadow="never"
-  >
-    <el-row :gutter="20">
-      <el-col :span="sub.span || formConfig.span || 12" v-for="(sub, key) in item.group" :key="key">
-        <component
-          :is="'el-' + sub.type"
-          v-if="containerTypes.includes(sub.type)"
-          v-model="sub.value"
-          v-bind="sub.props"
-          :children="sub.children"
-          :formData="formData"
-          :formConfig="formConfig"
-          v-on="sub.events || {}"
-        >
-          <template #[slot.alias]="slotProps" v-for="slot in sub.slots" :key="slot.alias">
-            <slot :name="slot.alias" v-bind="slotProps"></slot>
-          </template>
-        </component>
-        <template v-else>
-          <el-form-item :label="sub.label" :rules="sub.rules" :prop="sub.name" v-show="!sub.hidden">
-            <form-comp :item="sub" v-model="formData[sub.name]">
-              <template #[slot.alias]="slotProps" v-for="slot in sub.slots" :key="slot.alias">
-                <slot :name="slot.alias" v-bind="slotProps"></slot>
-              </template>
-            </form-comp>
-          </el-form-item>
-        </template>
-        <!-- <el-form-item :label="sub.label" :rules="sub.rules" :prop="sub.name">
-          <form-comp :item="sub" v-model="formData[sub.name]">
-            <template #[slot.alias]="slotProps" v-for="slot in sub.slots" :key="slot.alias">
-              <slot :name="slot.alias" v-bind="slotProps"></slot>
-            </template>
-          </form-comp>
-        </el-form-item> -->
-      </el-col>
-    </el-row>
-  </el-card>
-</template>
-
-<style lang="scss" scoped>
-:deep(.el-select) {
-  width: 100%;
-}
-</style>

src/components/core/form/BasicForm.vue

@@ -28,7 +28,6 @@ const formData = computed(() => {
     return res
   }
 })
-console.log(formData.value)
 
 // 构造表单容器插槽
 buildContainerSlots(props.formConfig.formItems)

src/components/core/form/DialogForm.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { BasicForm, AdvancedForm, FormSlot } from '@/types/form'
+import type { BasicForm, FormSlot } from '@/types/form'
 import type { DialogProps } from 'element-plus'
 import { buildFormSlots } from '@/utils/utils'
 

src/components/core/form/ProForm.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { BasicForm, AdvancedForm, FormSlot } from '@/types/form'
+import type { BasicForm, FormSlot } from '@/types/form'
 import { ElMessage } from 'element-plus'
 import { buildFormSlots } from '@/utils/utils'
 
@@ -61,12 +61,7 @@ defineExpose({
 
 <template>
   <el-form :model="formInitData" ref="formRef" v-bind="formProps" class="form">
-    <advanced-form :formConfig="formConfig" :formData="formInitData" v-if="formConfig.advanced">
-      <template #[slot.alias]="slotProps" v-for="slot in formSlots" :key="slot.alias">
-        <slot :name="slot.alias" v-bind="slotProps"></slot>
-      </template>
-    </advanced-form>
-    <basic-form :formConfig="formConfig" :formData="formInitData" v-else>
+    <basic-form :formConfig="formConfig" :formData="formInitData">
       <template #[slot.alias]="slotProps" v-for="slot in formSlots" :key="slot.alias">
         <slot :name="slot.alias" v-bind="slotProps"></slot>
       </template>

src/types/form.ts

@@ -36,7 +36,6 @@ type Form = {
   props?: Partial<FormProps>
   route?: any
   span?: number
-  advanced?: boolean
 }
 
 export type BasicForm = Form & {

src/utils/utils.ts

@@ -1,5 +1,5 @@
 import dayjs from 'dayjs'
-import type { AdvancedFormItem, BasicFormItem, FormSlot } from '@/types/form'
+import type { BasicFormItem, FormSlot } from '@/types/form'
 import { useFormDesignerStore } from '@/stores/designer'
 import { containerTypes } from './constants'