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

feature-JimuReport-1106-yjl
yujinlong 1 month ago
parent 2ddc7ce380
commit 9125c48d8b

@ -124,8 +124,8 @@ export interface FormProps {
// Show confirmation button
showSubmitButton?: boolean
resetFunc?: () => Promise<void>
submitFunc?: () => Promise<void>
resetFunc?: (() => Promise<void>) | (() => void)
submitFunc?: (() => Promise<void>) | (() => void)
transformDateFunc?: (date: any) => string
colon?: boolean,
// 表单是否初始状态是只读属性

@ -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>

@ -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">
<RenderComponent v-if="action.isCustomIcon" :renderProp="action.icon" />
<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">
<RenderComponent v-if="action.isCustomIcon" :renderProp="action.icon" />
<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[]>,

@ -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

Loading…
Cancel
Save