+
-
+
{this.modelData.showCaption ? this.captionText : null}
diff --git a/src/control/toolbar/toolbar.tsx b/src/control/toolbar/toolbar.tsx
index 9f4f8b5c..94292883 100644
--- a/src/control/toolbar/toolbar.tsx
+++ b/src/control/toolbar/toolbar.tsx
@@ -13,6 +13,7 @@ import {
ToolbarController,
} from '@ibiz-template/runtime';
import { IBizPopperToolbar } from './popper-toolbar/popper-toolbar';
+import { convertBtnType } from '../../util';
import './toolbar.scss';
const btnContent = (
@@ -96,10 +97,9 @@ export const ToolbarControl = defineComponent({
return position === 'bottom' ? 'normal' : 'small';
});
- const btnType = (item: IDEToolbarItem) => {
- return (item as IDETBUIActionItem).actionLevel! > 100
- ? 'primary '
- : 'default';
+ const btnType = (item: IDETBUIActionItem) => {
+ if (item.actionLevel && item.actionLevel > 100) return 'primary';
+ return convertBtnType(item.buttonStyle);
};
const getChildrenActions = (item: IDETBGroupItem) => {
diff --git a/src/panel-component/panel-button-list/panel-button-list.controller.ts b/src/panel-component/panel-button-list/panel-button-list.controller.ts
index aca2d10f..a4ff8bbb 100644
--- a/src/panel-component/panel-button-list/panel-button-list.controller.ts
+++ b/src/panel-component/panel-button-list/panel-button-list.controller.ts
@@ -7,7 +7,11 @@ import {
UIActionButtonState,
UIActionUtil,
} from '@ibiz-template/runtime';
-import { IPanelButtonList } from '@ibiz/model-core';
+import {
+ IPanelButton,
+ IPanelButtonList,
+ IUIActionGroupDetail,
+} from '@ibiz/model-core';
import { PanelButtonListState } from './panel-button-list.state';
/**
@@ -129,28 +133,50 @@ export class PanelButtonListController extends PanelItemController
detail.id === id,
+ );
+ return panelButtons?.find(button => button.id === id);
+ }
+
+ /**
+ * 处理按钮点击
*
- * @param {string} actionId
- * @param {MouseEvent} event
+ * @param {string} id
+ * @param {MouseEvent} [event]
* @return {*} {Promise}
* @memberof PanelButtonListController
*/
- async doUIAction(actionId: string, event?: MouseEvent): Promise {
+ async handleClick(id: string, event?: MouseEvent): Promise {
+ const action = this.getModelById(id);
+ if (!action?.uiactionId) return;
await UIActionUtil.execAndResolved(
- actionId,
+ action.uiactionId,
{
context: this.panel.context,
params: {
panelDataParent: this.dataParent.model.id!,
...this.panel.params,
},
+ event,
data: [this.data],
view: this.panel.view,
- event,
+ ctrl: this.panel,
noWaitRoute: true,
},
- this.model.appId,
+ action.appId || this.model.appId,
);
}
diff --git a/src/panel-component/panel-button-list/panel-button-list.tsx b/src/panel-component/panel-button-list/panel-button-list.tsx
index e6b54b1b..7e0b926c 100644
--- a/src/panel-component/panel-button-list/panel-button-list.tsx
+++ b/src/panel-component/panel-button-list/panel-button-list.tsx
@@ -22,12 +22,9 @@ export const PanelButtonList = defineComponent({
const c = props.controller;
- const handleClick = async (
- actionId: string,
- e?: MouseEvent,
- ): Promise => {
+ const handleClick = async (id: string, e?: MouseEvent): Promise => {
e?.stopPropagation();
- c.doUIAction(actionId, e);
+ c.handleClick(id, e);
};
return {
diff --git a/src/panel-component/panel-button/panel-button.scss b/src/panel-component/panel-button/panel-button.scss
index 1ddfbd23..27482156 100644
--- a/src/panel-component/panel-button/panel-button.scss
+++ b/src/panel-component/panel-button/panel-button.scss
@@ -1,9 +1,20 @@
@include b(panel-button) {
- width: 100%;
- height: 100%;
- @include when('login-btn'){
- background-color: getCssVar(color,primary);
- color: getCssVar(color,fill,1);
- font-size: getCssVar(font-size,header,4);
+ width: 100%;
+ height: 100%;
+ @include when('login-btn') {
+ background-color: getCssVar(color, primary);
+ color: getCssVar(color, fill, 1);
+ font-size: getCssVar(font-size, header, 4);
+ }
+
+ @include e(content) {
+ @include flex(row, flex-start, center);
+ gap: getCssVar(spacing, extra, tight);
+ img,
+ i {
+ display: inline-block;
+ max-width: getCssVar(width-icon, medium);
+ max-height: getCssVar(width-icon, medium);
}
-}
\ No newline at end of file
+ }
+}
diff --git a/src/panel-component/panel-button/panel-button.tsx b/src/panel-component/panel-button/panel-button.tsx
index 15f4ec7a..94b39150 100644
--- a/src/panel-component/panel-button/panel-button.tsx
+++ b/src/panel-component/panel-button/panel-button.tsx
@@ -2,6 +2,7 @@ import { useNamespace } from '@ibiz-template/vue3-util';
import { IPanelButton } from '@ibiz/model-core';
import { defineComponent, PropType, computed } from 'vue';
import { PanelButtonController } from './panel-button.controller';
+import { convertBtnType } from '../../util';
import './panel-button.scss';
export const PanelButton = defineComponent({
@@ -23,7 +24,7 @@ export const PanelButton = defineComponent({
caption,
captionItemName,
renderMode,
- itemStyle,
+ buttonStyle,
showCaption,
sysImage,
codeName,
@@ -39,33 +40,14 @@ export const PanelButton = defineComponent({
});
const buttonType = computed(() => {
- if (Object.is(renderMode, 'LINK')) {
- return 'text';
- }
- if (itemStyle) {
- switch (itemStyle) {
- case 'PRIMARY':
- return 'primary';
- case 'SUCCESS':
- return 'success';
- case 'INFO':
- return 'default';
- case 'WARNING':
- return 'warning';
- case 'DANGER':
- return 'danger';
- case 'INVERSE':
- return 'default';
- default:
- return 'default';
- }
- }
- return 'default';
+ if (Object.is(renderMode, 'LINK')) return 'text';
+ return convertBtnType(buttonStyle);
});
const handleButtonClick = (event: MouseEvent) => {
props.controller.onActionClick(event);
};
+
// 类名控制
const classArr = computed(() => {
let result: Array = [ns.b(), ns.m(id)];
@@ -83,13 +65,13 @@ export const PanelButton = defineComponent({
return {
ns,
- captionText,
- buttonType,
- showCaption,
+ state,
sysImage,
codeName,
classArr,
- state,
+ buttonType,
+ captionText,
+ showCaption,
handleButtonClick,
};
},
@@ -97,17 +79,18 @@ export const PanelButton = defineComponent({
if (this.state.visible) {
return (
-
+
-
+
{this.showCaption ? this.captionText : null}
diff --git a/src/util/button-util/button-util.ts b/src/util/button-util/button-util.ts
new file mode 100644
index 00000000..9a015777
--- /dev/null
+++ b/src/util/button-util/button-util.ts
@@ -0,0 +1,12 @@
+/**
+ * 转换按钮类型
+ *
+ * @export
+ * @param {string} [buttonStyle]
+ * @return {*} {string}
+ */
+export function convertBtnType(buttonStyle?: string): string {
+ return !buttonStyle || ['INVERSE', 'INFO'].includes(buttonStyle)
+ ? 'default'
+ : buttonStyle.toLowerCase();
+}
diff --git a/src/util/index.ts b/src/util/index.ts
index 02bc696e..4fc48e9b 100644
--- a/src/util/index.ts
+++ b/src/util/index.ts
@@ -12,3 +12,4 @@ export { FullscreenUtil } from './fullscreen/fullscreen-util';
export * from './store';
export { usePopstateListener } from './use-popstate-util/use-popstate-util';
export { QrcodeUtil } from './qrcode-util/qrcode-util';
+export { convertBtnType } from './button-util/button-util';
--
Gitee