提交 de499a14 作者: vben

fix: fix the display problem of table icon

上级 49827866
...@@ -26,10 +26,11 @@ ...@@ -26,10 +26,11 @@
### 🐛 Bug Fixes ### 🐛 Bug Fixes
- 修复 tree 文本超出挡住操作按钮问题 - tree: 修复文本超出挡住操作按钮问题
- 修复通过 useRedo 刷新页面参数丢失问题 - useRedo: 修复通过 useRedo 刷新页面参数丢失问题
- 修复表单校验先设置在校验及控制台错误信息问题 - form: 修复表单校验先设置在校验及控制台错误信息问题
- 修复`modal``drawer`组件传递数组参数问题 - `modal`&`drawer` 修复组件传递数组参数问题
- form: 修复`updateSchema`赋值含有`[]`时不生效
### 🎫 Chores ### 🎫 Chores
......
...@@ -24,20 +24,20 @@ export default defineComponent({ ...@@ -24,20 +24,20 @@ export default defineComponent({
}, },
setup(props) { setup(props) {
function renderButton(action: ActionItem, index: number) { function renderButton(action: ActionItem, index: number) {
const { disabled = false, label, icon, color = '', type = 'link' } = action; const { disabled = false, label, icon, color = '', type = 'link', ...actionProps } = action;
const button = ( const button = (
<Button <Button
type={type as any} type={type}
size="small" size="small"
disabled={disabled} disabled={disabled}
color={color} color={color}
{...action} {...actionProps}
key={`${index}-${label}`} key={`${index}-${label}`}
> >
{() => ( {() => (
<> <>
{icon && <Icon icon={icon} class="mr-1" />}
{label} {label}
{icon && <Icon icon={icon} />}
</> </>
)} )}
</Button> </Button>
...@@ -96,7 +96,7 @@ export default defineComponent({ ...@@ -96,7 +96,7 @@ export default defineComponent({
return renderPopConfirm(action, index); return renderPopConfirm(action, index);
})} })}
{dropDownActions && dropDownActions.length && ( {dropDownActions && dropDownActions.length && (
<Dropdown> <Dropdown overlayClassName="basic-tale-action-dropdown">
{{ {{
default: dropdownDefaultSLot, default: dropdownDefaultSLot,
overlay: () => { overlay: () => {
...@@ -106,6 +106,7 @@ export default defineComponent({ ...@@ -106,6 +106,7 @@ export default defineComponent({
default: () => { default: () => {
return dropDownActions.map((action, index) => { return dropDownActions.map((action, index) => {
const { disabled = false } = action; const { disabled = false } = action;
action.ghost = true;
return ( return (
<Menu.Item key={`${index}`} disabled={disabled}> <Menu.Item key={`${index}`} disabled={disabled}>
{() => { {() => {
......
...@@ -24,6 +24,11 @@ ...@@ -24,6 +24,11 @@
&-action { &-action {
display: flex; display: flex;
button {
display: flex;
align-items: center;
}
} }
&-toolbar { &-toolbar {
......
export interface ActionItem { import { ButtonProps } from 'ant-design-vue/es/button/buttonTypes';
export interface ActionItem extends ButtonProps {
onClick?: any; onClick?: any;
label: string; label: string;
disabled?: boolean;
color?: 'success' | 'error' | 'warning'; color?: 'success' | 'error' | 'warning';
type?: string;
props?: any;
icon?: string; icon?: string;
popConfirm?: PopConfirm; popConfirm?: PopConfirm;
} }
......
...@@ -32,6 +32,7 @@ import { ...@@ -32,6 +32,7 @@ import {
Result, Result,
Empty, Empty,
Avatar, Avatar,
Menu,
} from 'ant-design-vue'; } from 'ant-design-vue';
import { getApp } from '/@/setup/App'; import { getApp } from '/@/setup/App';
...@@ -78,5 +79,6 @@ export function registerGlobComp() { ...@@ -78,5 +79,6 @@ export function registerGlobComp() {
.use(Result) .use(Result)
.use(Empty) .use(Empty)
.use(Avatar) .use(Avatar)
.use(Menu)
.use(Tabs); .use(Tabs);
} }
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
:actions="[ :actions="[
{ {
label: '删除', label: '删除',
icon: 'ant-design:area-chart-outlined',
onClick: handleDelete.bind(null, record), onClick: handleDelete.bind(null, record),
}, },
]" ]"
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论