diff --git a/CHANGELOG.md b/CHANGELOG.md index 2f11b3f0e1320e5a4dfc8cc60dd473d4c39a9026..4900e19762c6effa348d4cc77cdb3796403b9050 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,7 @@ - 更新数据多项选择视图,数据多项选择视图(左右关系)视图参数checkstrictly默认值为false - 直接内容组件同步图标组件内对图片路径的判断逻辑 +- 更新引用界面行为组图标 ### Fixed diff --git a/src/common/action-toolbar/action-toolbar.scss b/src/common/action-toolbar/action-toolbar.scss index 3d0a62e552c6a8179d27ccefaa376c844b38d119..1b8cb5e19480eb1781ca81d7cf017c7c0fc2993b 100644 --- a/src/common/action-toolbar/action-toolbar.scss +++ b/src/common/action-toolbar/action-toolbar.scss @@ -51,13 +51,19 @@ $action-toolbar: ( > span { width: 100%; } - @include m(caption) { + @include m(content) { display: flex; gap: getCssVar(spacing, extra, tight); align-items: center; justify-content: space-between; width: 100%; } + @include m(caption) { + display: flex; + align-items: center; + padding: getCssVar(action-toolbar, item-padding); + margin: getCssVar(action-toolbar, item-margin); + } } @include e('separator'){ diff --git a/src/common/action-toolbar/action-toolbar.tsx b/src/common/action-toolbar/action-toolbar.tsx index 0cc40f376b6701e1719072eeeaa127053c535ce7..74317b28c483ff2040708e79bc7b242460b31e79 100644 --- a/src/common/action-toolbar/action-toolbar.tsx +++ b/src/common/action-toolbar/action-toolbar.tsx @@ -124,6 +124,40 @@ export const IBizActionToolbar = defineComponent({ const popoverIndex = props.zIndex; + /** + * @description 绘制项内容 + * @param {IAppDEUIActionGroupDetail} detail + * @returns {*} + */ + const renderItemContent = (detail: IAppDEUIActionGroupDetail) => { + const caption = + detail.refUIActionGroup?.name || + detail.refUIActionGroup?.id || + detail.caption; + return [ +
+ {detail.showIcon && detail.sysImage && ( + + )} +
, +
+ {caption} +
, + ]; + }; + return { ns, dropdownRef, @@ -133,6 +167,7 @@ export const IBizActionToolbar = defineComponent({ groupButtonRef, popoverVisible, handleClick, + renderItemContent, calcActionItemClass, }; }, @@ -193,10 +228,12 @@ export const IBizActionToolbar = defineComponent({ this.ns.e('group-item'), ]} > -
- {actionGroup.name || actionGroup.id} +
+
+ {this.renderItemContent(detail)} +
-
- {detail.showIcon && detail.sysImage && ( - - )} -
-
- {detail.showCaption ? detail.caption : ''} -
+ {this.renderItemContent(detail)} , ]; } diff --git a/src/common/button-list/button-list.scss b/src/common/button-list/button-list.scss index c45f2e2348dcd4bca90ccc55dc1ac2403a62a6b6..81cd150c9b66654ba7b15fdb4327fea7db6093b8 100644 --- a/src/common/button-list/button-list.scss +++ b/src/common/button-list/button-list.scss @@ -51,10 +51,20 @@ $button-list: ( pointer-events: none; } @include m(group) { - .#{bem('button-list', 'button-content')} { + > span { + display: flex; justify-content: space-between; } } + @include m(group-icon) { + display: flex; + align-items: center; + justify-content: center; + width: getCssVar(button-list, icon-size); + height: getCssVar(button-list, icon-size); + margin-left: getCssVar(button-list, icon-margin); + font-size: getCssVar(button-list, icon-size); + } } @include e(dropdown) { @@ -120,7 +130,7 @@ $button-list: ( @include e(dropdown-popper) { @include set-component-css-var(button-list, $button-list); - >.el-scrollbar { + > .el-scrollbar { min-width: 150px; overflow: visible; } @@ -184,4 +194,4 @@ $button-list: ( border-color: var(--el-button-hover-border-color); } } -} \ No newline at end of file +} diff --git a/src/common/button-list/button-list.tsx b/src/common/button-list/button-list.tsx index c0c1dcca605a19046586df71c75f4195c4b0ad55..75e496eefd1182ccfc84800c9691053cb885c710 100644 --- a/src/common/button-list/button-list.tsx +++ b/src/common/button-list/button-list.tsx @@ -252,18 +252,26 @@ export const IBizButtonList = defineComponent({ type={convertBtnType(detail.buttonStyle)} >
- - {actionGroup.name || actionGroup.id} - - + {detail.showIcon && ( + + )} + {detail.showCaption && ( + + {actionGroup.name || actionGroup.id} + + )}
+ ); },