feat：公共form类型回调类型补充&表格操作列可设置自定义icon

src/components/Form/src/types/form.ts

@@ -124,8 +124,8 @@ export interface FormProps {
   // Show confirmation button
   showSubmitButton?: boolean
 
-  resetFunc?: () => Promise<void>
+  resetFunc?: (() => Promise<void>) | (() => void)
-  submitFunc?: () => Promise<void>
+  submitFunc?: (() => Promise<void>) | (() => void)
   transformDateFunc?: (date: any) => string
   colon?: boolean,
   // 表单是否初始状态是只读属性
@@ -145,9 +145,9 @@ export interface FormSchema {
   subLabel?: string
   // Help text on the right side of the text
   helpMessage?:
-    | string
+  | string
-    | string[]
+  | string[]
-    | ((renderCallbackParams: RenderCallbackParams) => string | string[])
+  | ((renderCallbackParams: RenderCallbackParams) => string | string[])
   // BaseHelp component props
   helpComponentProps?: Partial<HelpComponentProps>
   // Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
@@ -158,13 +158,13 @@ export interface FormSchema {
   component: ComponentType
   // Component parameters
   componentProps?:
-    | ((opt: {
+  | ((opt: {
-        schema: FormSchema
+    schema: FormSchema
-        tableAction: TableActionType
+    tableAction: TableActionType
-        formActionType: FormActionType
+    formActionType: FormActionType
-        formModel: Recordable
+    formModel: Recordable
-      }) => Recordable)
+  }) => Recordable)
-    | object
+  | object
   // Required
   required?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean)
 
@@ -203,10 +203,10 @@ export interface FormSchema {
   renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string
 
   renderComponentContent?:
-    | ((renderCallbackParams: RenderCallbackParams) => any)
+  | ((renderCallbackParams: RenderCallbackParams) => any)
-    | VNode
+  | VNode
-    | VNode[]
+  | VNode[]
-    | string
+  | string
 
   // Custom slot, in from-item
   slot?: string

src/components/Table/src/components/RenderComponent.vue

@@ -0,0 +1,15 @@
+<template>
+  <renderComponent />
+</template>
+<script lang="ts" setup>
+  import { VNode } from 'vue'
+
+  const props = defineProps<{
+    renderProp: VNode
+  }>()
+  const renderComponent = {
+    render: () => {
+      return props.renderProp
+    },
+  }
+</script>

src/components/Table/src/components/TableAction.vue

@@ -3,13 +3,19 @@
     <template v-for="(action, index) in getActions" :key="`${index}-${action.label}`">
       <Tooltip v-if="action.tooltip" v-bind="getTooltip(action.tooltip)">
         <PopConfirmButton v-bind="action">
-          <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }" />
+          <RenderComponent v-if="action.isCustomIcon" :renderProp="action.icon" />
-          <template v-if="action.label">{{ action.label }}</template>
+          <template v-else>
+            <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }" />
+            <template v-if="action.label">{{ action.label }}</template>
+          </template>
         </PopConfirmButton>
       </Tooltip>
       <PopConfirmButton v-else v-bind="action">
-        <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }" />
+        <RenderComponent v-if="action.isCustomIcon" :renderProp="action.icon" />
-        <template v-if="action.label">{{ action.label }}</template>
+        <template v-else>
+          <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }" />
+          <template v-if="action.label">{{ action.label }}</template>
+        </template>
       </PopConfirmButton>
       <Divider
         v-if="divider && index < getActions.length - 1"
@@ -37,6 +43,7 @@
   import Icon from '/@/components/Icon/index'
   import { ActionItem, TableActionType } from '/@/components/Table'
   import { PopConfirmButton } from '/@/components/Button'
+  import RenderComponent from './RenderComponent.vue'
   import { Dropdown } from '/@/components/Dropdown'
   import { useDesign } from '/@/hooks/web/useDesign'
   import { useTableContext } from '../hooks/useTableContext'
@@ -47,7 +54,15 @@
 
   export default defineComponent({
     name: 'TableAction',
-    components: { Icon, PopConfirmButton, Divider, Dropdown, MoreOutlined, Tooltip },
+    components: {
+      Icon,
+      PopConfirmButton,
+      Divider,
+      Dropdown,
+      MoreOutlined,
+      Tooltip,
+      RenderComponent,
+    },
     props: {
       actions: {
         type: Array as PropType<ActionItem[]>,

src/components/Table/src/types/tableAction.ts

@@ -1,11 +1,13 @@
 import { ButtonProps } from 'ant-design-vue/es/button/buttonTypes'
 import { TooltipProps } from 'ant-design-vue/es/tooltip/Tooltip'
 import { RoleEnum } from '/@/enums/roleEnum'
+import { VNode } from 'vue'
 export interface ActionItem extends ButtonProps {
   onClick?: Fn
   label?: string
   color?: 'success' | 'error' | 'warning'
-  icon?: string
+  isCustomIcon?: boolean
+  icon?: string | JSX.Element | VNode
   popConfirm?: PopConfirm
   disabled?: boolean
   divider?: boolean
@@ -24,16 +26,16 @@ export interface PopConfirm {
   cancel?: Fn
   icon?: string
   placement?:
-    | 'top'
+  | 'top'
-    | 'left'
+  | 'left'
-    | 'right'
+  | 'right'
-    | 'bottom'
+  | 'bottom'
-    | 'topLeft'
+  | 'topLeft'
-    | 'topRight'
+  | 'topRight'
-    | 'leftTop'
+  | 'leftTop'
-    | 'leftBottom'
+  | 'leftBottom'
-    | 'rightTop'
+  | 'rightTop'
-    | 'rightBottom'
+  | 'rightBottom'
-    | 'bottomLeft'
+  | 'bottomLeft'
-    | 'bottomRight'
+  | 'bottomRight'
 }