Browse Source

Pull request #3188: DESIGN-4355 feat: tooltip提示异步获取

Merge in VISUAL/fineui from ~DAILER/fineui:master to master

* commit '3390d8ed24de2a97c15c06a51a1fa795df822943':
  无JIRA fix: 图标写反了
  DESIGN-4355 feat: tooltip提示异步获取
  DESIGN-4355 feat: tooltip提示异步获取
es6
Dailer-刘荣歆 2 years ago
parent
commit
6fc27f6aaa
  1. 57
      src/base/single/0.single.js
  2. 4
      src/case/button/node/siwtcher.tree.node.js

57
src/base/single/0.single.js

@ -19,35 +19,37 @@ BI.Single = BI.inherit(BI.Widget, {
return BI.extend(conf, { return BI.extend(conf, {
readonly: false, readonly: false,
title: null, title: null,
warningTitle: null, warningTitle: null, // deprecated
tipType: null, // success或warning tipType: null, // deprecated success或warning
belowMouse: false, // title是否跟随鼠标 belowMouse: false, // title是否跟随鼠标
enableHover: false, enableHover: false,
}); });
}, },
_showToolTip: function (e, opt) { _showToolTip: function (e, opt) {
opt || (opt = {}); opt || (opt = {});
var self = this;
var o = this.options; var o = this.options;
var tooltipOpt = {};
var title = this.getTitle(); var title = this.getTitle();
if (BI.isPlainObject(title)) {
tooltipOpt = title; if (title instanceof Promise) {
this.requestingTitle = title;
title.then(resolvedTitle => {
// 由于是异步的,所以无法避免Promise resolve时机问题,所以设计为:鼠标移出了则不显示,并且只显示最后一次发起的查询结果
this.mouseOver && this.requestingTitle === title && showToolTip(this._getTooltipOptions(resolvedTitle));
});
} else { } else {
tooltipOpt.level = this.getTipType() || "success"; showToolTip(this._getTooltipOptions(title));
// 由于以前的用法,存在大量disabled:true搭配warningTitle的情况,所以这里做一个兼容,disabled:true的情况下,依然优先显示warningTitle,避免只设置了warningTitle而没有设置title的情况
if (BI.isNull(o.tipType) && !this.isEnabled()) {
tooltipOpt.text = (this.getWarningTitle() || title);
} else {
tooltipOpt.text = tooltipOpt.level === "success" ? title : (this.getWarningTitle() || title);
}
} }
if (BI.isKey(tooltipOpt.text)) {
BI.Tooltips.show(e, this.getName(), tooltipOpt, this, opt); function showToolTip(tooltipOpt) {
if (o.action) { if (BI.isKey(tooltipOpt.text) && !BI.Tooltips.has(self.getName())) {
BI.Actions.runAction(o.action, "hover", o, this); BI.Tooltips.show(e, self.getName(), tooltipOpt, self, opt);
if (o.action) {
BI.Actions.runAction(o.action, "hover", o, self);
}
BI.Actions.runGlobalAction("hover", o, self);
} }
BI.Actions.runGlobalAction("hover", o, this);
} }
}, },
@ -91,12 +93,30 @@ BI.Single = BI.inherit(BI.Widget, {
} }
}, },
_getTooltipOptions: function (title) {
var o = this.options;
var tooltipOpt = {};
if (BI.isPlainObject(title)) {
tooltipOpt = title;
} else {
tooltipOpt.level = this.getTipType() || "success";
// 由于以前的用法,存在大量disabled:true搭配warningTitle的情况,所以这里做一个兼容,disabled:true的情况下,依然优先显示warningTitle,避免只设置了warningTitle而没有设置title的情况
if (BI.isNull(o.tipType) && !this.isEnabled()) {
tooltipOpt.text = (this.getWarningTitle() || title);
} else {
tooltipOpt.text = tooltipOpt.level === "success" ? title : (this.getWarningTitle() || title);
}
}
return tooltipOpt;
},
enableHover: function (opt) { enableHover: function (opt) {
opt || (opt = {}); opt || (opt = {});
var self = this; var self = this;
if (!this._hoverBinded) { if (!this._hoverBinded) {
this.element.unbind("mouseenter.title").on("mouseenter.title", function (e) { this.element.unbind("mouseenter.title").on("mouseenter.title", function (e) {
self._e = e; self._e = e;
self.mouseOver = true;
if (self.getTipType() === "warning" || (BI.isKey(self.getWarningTitle()) && !self.isEnabled())) { if (self.getTipType() === "warning" || (BI.isKey(self.getWarningTitle()) && !self.isEnabled())) {
delayingTooltips = self.getName(); delayingTooltips = self.getName();
self.showTimeout = BI.delay(function () { self.showTimeout = BI.delay(function () {
@ -144,6 +164,7 @@ BI.Single = BI.inherit(BI.Widget, {
}); });
this.element.unbind("mouseleave.title").on("mouseleave.title", function (e) { this.element.unbind("mouseleave.title").on("mouseleave.title", function (e) {
self._e = null; self._e = null;
self.mouseOver = false;
self._clearTimeOut(); self._clearTimeOut();
self._hideTooltip(); self._hideTooltip();
}); });

4
src/case/button/node/siwtcher.tree.node.js

@ -32,10 +32,10 @@ BI.TreeNodeSwitcher = BI.inherit(BI.NodeButton, {
return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type2", "tree-expand-icon-type2"]; return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type2", "tree-expand-icon-type2"];
} else if (options.isLastNode) { } else if (options.isLastNode) {
// 最后一个节点 // 最后一个节点
return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type3", "tree-expand-icon-type3"]; return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type4", "tree-expand-icon-type4"];
} else { } else {
// 其他情况 // 其他情况
return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type4", "tree-expand-icon-type4"]; return BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? ["tree-solid-collapse-icon-type1", "tree-solid-expand-icon-type1"] : ["tree-collapse-icon-type3", "tree-expand-icon-type3"];
} }
}, },

Loading…
Cancel
Save