style: 修改样式

src/components/Form/src/Form.vue

@@ -182,41 +182,7 @@ export default defineComponent({
 
     // 渲染formItem
     const renderFormItem = (item: FormSchema) => {
-      // 单独给只有options属性的组件做判断
-      // const notRenderOptions = ['SelectV2', 'Cascader', 'Transfer']
-
-      // if (
-      //   item?.component !== 'SelectV2' &&
-      //   item?.component !== 'Cascader' &&
-      //   item?.componentProps?.options
-      // ) {
-      //   slotsMap.default = () => renderOptions(item)
-      // }
-
-      // const formItemSlots: Recordable = setFormItemSlots(slots, item.field)
-      // 如果有 labelMessage，自动使用插槽渲染
-      // if (item?.labelMessage) {
-      //   formItemSlots.label = () => {
-      //     return (
-      //       <>
-      //         <span>{item.label}</span>
-      //         <ElTooltip placement="right" raw-content>
-      //           {{
-      //             content: () => <span v-html={item.labelMessage}></span>,
-      //             default: () => (
-      //               <Icon
-      //                 icon="ep:warning"
-      //                 size={16}
-      //                 color="var(--el-color-primary)"
-      //                 class="ml-2px relative top-1px"
-      //               ></Icon>
-      //             )
-      //           }}
-      //         </ElTooltip>
-      //       </>
-      //     )
-      //   }
-      // }
+      const formItemSlots: Recordable = setFormItemSlots(slots, item.field)
       return (
         <ElFormItem {...(item.formItemProps || {})} prop={item.field} label={item.label || ''}>
           {{
@@ -291,7 +257,8 @@ export default defineComponent({
                   </Com>
                 )
               }
-            }
+            },
+            ...formItemSlots
           }}
         </ElFormItem>
       )

src/components/Form/src/helper/index.ts

@@ -86,7 +86,7 @@ export const setGridProp = (col: ColProps = {}): ColProps => {
 export const setComponentProps = (item: FormSchema): Recordable => {
   // const notNeedClearable = ['ColorPicker']
   // 拆分事件并组合
-  const onEvents = item?.componentProps?.on || {}
+  const onEvents = (item?.componentProps as any)?.on || {}
   const newOnEvents: Recordable = {}
 
   for (const key in onEvents) {
@@ -165,13 +165,13 @@ export const initModel = (schema: FormSchema[], formModel: Recordable) => {
 export const setFormItemSlots = (slots: Slots, field: string): Recordable => {
   const slotObj: Recordable = {}
   if (slots[`${field}-error`]) {
-    slotObj['error'] = (data: Recordable) => {
-      return getSlot(slots, `${field}-error`, data)
+    slotObj['error'] = (...args: any[]) => {
+      return getSlot(slots, `${field}-error`, args)
     }
   }
   if (slots[`${field}-label`]) {
-    slotObj['label'] = (data: Recordable) => {
-      return getSlot(slots, `${field}-label`, data)
+    slotObj['label'] = (...args: any[]) => {
+      return getSlot(slots, `${field}-label`, args)
     }
   }
   return slotObj

src/components/Form/src/types/index.ts

@@ -5,9 +5,11 @@ import {
   InputNumberProps,
   CascaderProps,
   CascaderNode,
-  CascaderValue
+  CascaderValue,
+  FormItemRule
 } from 'element-plus'
 import type { AxiosPromise } from 'axios'
+import { IEditorConfig } from '@wangeditor/editor'
 
 export interface PlaceholderModel {
   placeholder?: string
@@ -731,6 +733,11 @@ export interface TimeSelectComponentProps {
   style?: CSSProperties
 }
 
+export interface EditorComponentProps {
+  editorConfig?: IEditorConfig
+  style?: CSSProperties
+}
+
 export interface ColProps {
   span?: number
   xs?: number
@@ -752,10 +759,13 @@ export type FormValueType = string | number | string[] | number[] | boolean | un
 export interface FormItemProps {
   labelWidth?: string | number
   required?: boolean
-  rules?: Recordable
+  rules?: FormItemRule | FormItemRule[]
   error?: string
   showMessage?: boolean
   inlineMessage?: boolean
+  size?: ElementPlusSize
+  for?: string
+  validateStatus?: '' | 'error' | 'validating' | 'success'
   style?: CSSProperties
 }
 
@@ -800,6 +810,7 @@ export interface FormSchema {
     | DatePickerComponentProps
     | DateTimePickerComponentProps
     | TimePickerComponentProps
+    | EditorComponentProps
 
   /**
    * formItem组件属性，具体可以查看element-plus文档