feat: Search组件重构

src/views/Components/Form/DefaultForm.vue

@@ -6,7 +6,6 @@ import { useIcon } from '@/hooks/web/useIcon'
 import { ContentWrap } from '@/components/ContentWrap'
 import { useAppStore } from '@/store/modules/app'
 import { SelectOption, RadioOption, CheckboxOption, FormSchema } from '@/components/Form'
-import { useForm } from '@/hooks/web/useForm'
 import {
   ElOption,
   ElOptionGroup,
@@ -1455,18 +1454,11 @@ const schema = reactive<FormSchema[]>([
     }
   }
 ])
-
-const { register, formRef, methods } = useForm()
 </script>
 
 <template>
   <ContentWrap :title="t('formDemo.defaultForm')" :message="t('formDemo.formDes')">
-    <Form
-      @register="register"
-      :schema="schema"
-      label-width="auto"
-      :label-position="isMobile ? 'top' : 'right'"
-    />
+    <Form :schema="schema" label-width="auto" :label-position="isMobile ? 'top' : 'right'" />
   </ContentWrap>
 </template>
 

src/views/Components/Form/UseFormDemo.vue

@@ -95,7 +95,7 @@ const schema = reactive<FormSchema[]>([
   }
 ])
 
-const { register, methods } = useForm()
+const { formRegister, formMethods } = useForm()
 const {
   setProps,
   delSchema,
@@ -105,7 +105,7 @@ const {
   getComponentExpose,
   getFormItemExpose,
   getElFormExpose
-} = methods
+} = formMethods
 
 const changeLabelWidth = (width: number | string) => {
   setProps({
@@ -200,7 +200,6 @@ const setLabel = () => {
 }
 
 const addItem = () => {
-  const { addSchema } = methods
   if (unref(index) % 2 === 0) {
     addSchema({
       field: `field${unref(index)}`,
@@ -235,7 +234,6 @@ const verifyReset = async () => {
 const getDictOne = async () => {
   const res = await getDictOneApi()
   if (res) {
-    const { setSchema } = methods
     setSchema([
       {
         field: 'field2',
@@ -303,7 +301,7 @@ const inoutValidation = async () => {
     </ElButton>
   </ContentWrap>
   <ContentWrap :title="`UseForm ${t('formDemo.example')}`">
-    <Form :schema="schema" @register="register" />
+    <Form :schema="schema" @register="formRegister" />
   </ContentWrap>
 </template>
 

src/views/Components/Search.vue

@@ -10,8 +10,8 @@ import { useSearch } from '@/hooks/web/useSearch'
 
 const { t } = useI18n()
 
-const { register, methods } = useSearch()
-const { setSchema } = methods
+const { searchRegister, searchMethods } = useSearch()
+const { setSchema, setProps } = searchMethods
 
 const schema = reactive<FormSchema[]>([
   {
@@ -131,7 +131,10 @@ const schema = reactive<FormSchema[]>([
 const isGrid = ref(false)
 
 const changeGrid = (grid: boolean) => {
-  isGrid.value = grid
+  setProps({
+    isCol: grid
+  })
+  // isGrid.value = grid
 }
 
 const layout = ref('inline')
@@ -153,7 +156,7 @@ const getDictOne = async () => {
     setSchema([
       {
         field: 'field2',
-        path: 'componentPorps.options',
+        path: 'componentProps.options',
         value: res.data
       }
     ])
@@ -203,7 +206,7 @@ const handleSearch = (data: any) => {
       expand-field="field6"
       @search="handleSearch"
       @reset="handleSearch"
-      @register="register"
+      @register="searchRegister"
     />
   </ContentWrap>
 </template>