Browse Source

REPORT-97636 fix: 修改popover取消按钮样式、增加按钮高度可配

research/test
dailer 1 year ago
parent
commit
a122490af8
  1. 56
      packages/fineui/src/base/foundation/message.js
  2. 12
      packages/fineui/src/base/layer/layer.popover.js
  3. 16
      packages/fineui/src/case/combo/bubblecombo/popup.bubble.js

56
packages/fineui/src/base/foundation/message.js

@ -3,7 +3,22 @@
* 弹出提示消息框用于模拟阻塞操作通过回调函数实现 * 弹出提示消息框用于模拟阻塞操作通过回调函数实现
* @class Msg * @class Msg
*/ */
import { Widget, isString, isNull, isFunction, createWidget, remove, each, emptyFn, delay, zIndex_tip, i18nText, KeyCode, isPlainObject, SIZE_CONSANTS } from "../../core"; import {
Widget,
isString,
isNull,
isFunction,
createWidget,
remove,
each,
emptyFn,
delay,
zIndex_tip,
i18nText,
KeyCode,
isPlainObject,
SIZE_CONSANTS
} from "../../core";
import { Toast } from "../single"; import { Toast } from "../single";
export const Msg = (() => { export const Msg = (() => {
@ -13,17 +28,21 @@ export const Msg = (() => {
const toastStack = []; const toastStack = [];
const defaultConfig = {
buttonHeight: 24,
};
return { return {
alert (title, message, callback) { alert(title, message, callback, config = defaultConfig) {
this._show(false, title, message, callback); this._show(false, title, message, callback, config);
}, },
confirm (title, message, callback) { confirm(title, message, callback, config = defaultConfig) {
this._show(true, title, message, callback); this._show(true, title, message, callback, config);
}, },
prompt (title, message, value, callback, min_width) { prompt(title, message, value, callback, min_width) {
// Msg.prompt(title, message, value, callback, min_width); // Msg.prompt(title, message, value, callback, min_width);
}, },
toast (message, options, context) { toast(message, options, context) {
isString(options) && (options = { level: options }); isString(options) && (options = { level: options });
options = options || {}; options = options || {};
context = context || Widget._renderEngine.createElement("body"); context = context || Widget._renderEngine.createElement("body");
@ -40,7 +59,7 @@ export const Msg = (() => {
listeners: [ listeners: [
{ {
eventName: Toast.EVENT_DESTORY, eventName: Toast.EVENT_DESTORY,
action () { action() {
remove(toastStack, toast.element); remove(toastStack, toast.element);
let _height = SIZE_CONSANTS.TOAST_TOP; let _height = SIZE_CONSANTS.TOAST_TOP;
each(toastStack, (i, element) => { each(toastStack, (i, element) => {
@ -77,12 +96,12 @@ export const Msg = (() => {
toast.destroy?.(); toast.destroy?.();
}, 5000); }, 5000);
return function () { return function() {
toast.element.removeClass("bi-message-enter").addClass("bi-message-leave"); toast.element.removeClass("bi-message-enter").addClass("bi-message-leave");
toast.destroy?.(); toast.destroy?.();
}; };
}, },
_show (hasCancel, title, message, callback) { _show(hasCancel, title, message, callback, config) {
isNull($mask) && isNull($mask) &&
($mask = Widget._renderEngine ($mask = Widget._renderEngine
.createElement("<div class=\"bi-z-index-mask\">") .createElement("<div class=\"bi-z-index-mask\">")
@ -107,6 +126,7 @@ export const Msg = (() => {
bottom: 0, bottom: 0,
}) })
.appendTo("body"); .appendTo("body");
function close() { function close() {
messageShows[messageShows.length - 1].destroy(); messageShows[messageShows.length - 1].destroy();
messageShows.pop(); messageShows.pop();
@ -115,14 +135,16 @@ export const Msg = (() => {
$mask = null; $mask = null;
} }
} }
const controlItems = []; const controlItems = [];
if (hasCancel === true) { if (hasCancel === true) {
controlItems.push({ controlItems.push({
el: { el: {
type: "bi.button", type: "bi.button",
height: config.buttonHeight,
text: i18nText("BI-Basic_Cancel"), text: i18nText("BI-Basic_Cancel"),
level: "ignore", light: true,
handler () { handler() {
close(); close();
if (isFunction(callback)) { if (isFunction(callback)) {
callback.apply(null, [false]); callback.apply(null, [false]);
@ -134,8 +156,9 @@ export const Msg = (() => {
controlItems.push({ controlItems.push({
el: { el: {
type: "bi.button", type: "bi.button",
height: config.buttonHeight,
text: i18nText("BI-Basic_OK"), text: i18nText("BI-Basic_OK"),
handler () { handler() {
close(); close();
if (isFunction(callback)) { if (isFunction(callback)) {
callback.apply(null, [true]); callback.apply(null, [true]);
@ -152,7 +175,7 @@ export const Msg = (() => {
attributes: { attributes: {
tabIndex: 1, tabIndex: 1,
}, },
mounted () { mounted() {
this.element.keyup(e => { this.element.keyup(e => {
if (e.keyCode === KeyCode.ENTER) { if (e.keyCode === KeyCode.ENTER) {
close(); close();
@ -170,7 +193,8 @@ export const Msg = (() => {
}); });
try { try {
this.element.focus(); this.element.focus();
} catch (e) {} } catch (e) {
}
}, },
cls: "bi-card", cls: "bi-card",
items: { items: {
@ -194,7 +218,7 @@ export const Msg = (() => {
type: "bi.icon_button", type: "bi.icon_button",
cls: "bi-message-close close-font", cls: "bi-message-close close-font",
// height: 50, // height: 50,
handler () { handler() {
close(); close();
if (isFunction(callback)) { if (isFunction(callback)) {
callback.apply(null, [false]); callback.apply(null, [false]);

12
packages/fineui/src/base/layer/layer.popover.js

@ -46,6 +46,7 @@ export class Popover extends Widget {
body: null, body: null,
footer: null, footer: null,
footerHeight: 44, footerHeight: 44,
footerButtonHeight: 24,
closable: true, // BI-40839 是否显示右上角的关闭按钮 closable: true, // BI-40839 是否显示右上角的关闭按钮
bodyHgap: SIZE_CONSANTS.H_GAP_SIZE, bodyHgap: SIZE_CONSANTS.H_GAP_SIZE,
bodyTgap: SIZE_CONSANTS.V_GAP_SIZE, bodyTgap: SIZE_CONSANTS.V_GAP_SIZE,
@ -213,6 +214,7 @@ export class Popover extends Widget {
} }
); );
} }
// mounted之后绑定事件 // mounted之后绑定事件
mounted() { mounted() {
this.dragger.element.mousedown(e => { this.dragger.element.mousedown(e => {
@ -273,11 +275,13 @@ export class Popover extends Widget {
type: sizeValue.type || "default", type: sizeValue.type || "default",
}; };
} }
setDraggable(b) { setDraggable(b) {
this.options.draggable = b; this.options.draggable = b;
} }
hide() {} hide() {
}
open() { open() {
this.show(); this.show();
@ -305,7 +309,7 @@ export class BarPopover extends Popover {
} }
beforeCreate() { beforeCreate() {
const { footer, warningTitle } = this.options; const { footer, warningTitle, footerButtonHeight } = this.options;
footer || footer ||
(this.options.footer = { (this.options.footer = {
type: RightVerticalAdaptLayout.xtype, type: RightVerticalAdaptLayout.xtype,
@ -313,9 +317,10 @@ export class BarPopover extends Popover {
items: [ items: [
{ {
type: Button.xtype, type: Button.xtype,
height: footerButtonHeight,
text: this.options.btns[1], text: this.options.btns[1],
value: 1, value: 1,
level: "ignore", light: true,
handler: v => { handler: v => {
this.fireEvent(Popover.EVENT_CANCEL, v); this.fireEvent(Popover.EVENT_CANCEL, v);
this.close(v); this.close(v);
@ -323,6 +328,7 @@ export class BarPopover extends Popover {
}, },
{ {
type: Button.xtype, type: Button.xtype,
height: footerButtonHeight,
text: this.options.btns[0], text: this.options.btns[0],
warningTitle, warningTitle,
value: 0, value: 0,

16
packages/fineui/src/case/combo/bubblecombo/popup.bubble.js

@ -27,13 +27,13 @@ export class BubblePopupBarView extends BubblePopupView {
static EVENT_CLICK_TOOLBAR_BUTTON = "EVENT_CLICK_TOOLBAR_BUTTON"; static EVENT_CLICK_TOOLBAR_BUTTON = "EVENT_CLICK_TOOLBAR_BUTTON";
_defaultConfig () { _defaultConfig() {
return extend(super._defaultConfig(...arguments), { return extend(super._defaultConfig(...arguments), {
extraCls: "bi-bubble-bar-popup-view", extraCls: "bi-bubble-bar-popup-view",
buttons: [{ buttons: [{
value: false, value: false,
text: i18nText("BI-Basic_Cancel"), text: i18nText("BI-Basic_Cancel"),
level: "ignore", light: true,
}, { }, {
text: i18nText(i18nText("BI-Basic_OK")), text: i18nText(i18nText("BI-Basic_OK")),
value: true, value: true,
@ -43,7 +43,7 @@ export class BubblePopupBarView extends BubblePopupView {
}); });
} }
_createToolBar () { _createToolBar() {
const o = this.options; const o = this.options;
const items = []; const items = [];
@ -75,11 +75,11 @@ export class BubblePopupBarView extends BubblePopupView {
}); });
} }
_createContent () { _createContent() {
return this.options.el; return this.options.el;
} }
_createView () { _createView() {
const o = this.options; const o = this.options;
const view = createWidget({ const view = createWidget({
@ -102,7 +102,7 @@ export class TextBubblePopupBarView extends BubblePopupBarView {
static EVENT_CHANGE = "EVENT_CLICK_TOOLBAR_BUTTON"; static EVENT_CHANGE = "EVENT_CLICK_TOOLBAR_BUTTON";
_defaultConfig () { _defaultConfig() {
const config = super._defaultConfig(...arguments); const config = super._defaultConfig(...arguments);
return extend(config, { return extend(config, {
@ -111,7 +111,7 @@ export class TextBubblePopupBarView extends BubblePopupBarView {
}); });
} }
_createContent () { _createContent() {
const o = this.options; const o = this.options;
return { return {
@ -125,7 +125,7 @@ export class TextBubblePopupBarView extends BubblePopupBarView {
}; };
} }
populate (v) { populate(v) {
this.text.setText(v || this.options.text); this.text.setText(v || this.options.text);
} }
} }

Loading…
Cancel
Save