Frank
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

KERNEL-13928 refactor: es6化1.text.js

es6
impact 2 years ago
parent
a10539682f
commit
2314d4b58b
2 changed files with 170 additions and 164 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      src/base/index.js
  2. 331
      src/base/single/1.text.js

3
src/base/index.js
Unescape View File

@ -1,12 +1,15 @@
import Pane from "./1.pane";
import Single from "./single/0.single";
import Text from "./single/1.text";
BI.extend(BI, {
Pane,
Single,
Text,
});
export {
Pane,
Single,
Text,
}

331
src/base/single/1.text.js
Unescape View File

@ -3,172 +3,175 @@
* @class BI.Text
* @extends BI.Single
*/
!(function () {
BI.Text = BI.inherit(BI.Single, {
props: {
baseCls: "bi-text",
textAlign: "left",
whiteSpace: "normal",
lineHeight: null,
handler: null, // 如果传入handler,表示处理文字的点击事件，不是区域的
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
py: "",
highLight: false,
},
render: function () {
var self = this, o = this.options;
if (o.hgap + o.lgap > 0) {
this.element.css({
"padding-left": BI.pixFormat(o.hgap + o.lgap),
});
}
if (o.hgap + o.rgap > 0) {
this.element.css({
"padding-right": BI.pixFormat(o.hgap + o.rgap),
});
}
if (o.vgap + o.tgap > 0) {
this.element.css({
"padding-top": BI.pixFormat(o.vgap + o.tgap),
});
}
if (o.vgap + o.bgap > 0) {
this.element.css({
"padding-bottom": BI.pixFormat(o.vgap + o.bgap),
});
}
if (BI.isWidthOrHeight(o.height)) {
this.element.css({ lineHeight: BI.pixFormat(o.height) });
}
if (BI.isWidthOrHeight(o.lineHeight)) {
this.element.css({ lineHeight: BI.pixFormat(o.lineHeight) });
}
if (BI.isWidthOrHeight(o.maxWidth)) {
this.element.css({ maxWidth: BI.pixFormat(o.maxWidth) });
}
import { shortcut } from "../../core/decorator";
import { Single } from "../index";
import BI from "../../core/2.base";
@shortcut()
export default class Text extends Single {
static xtype = "bi.text";
props = {
baseCls: "bi-text",
textAlign: "left",
whiteSpace: "normal",
lineHeight: null,
handler: null, // 如果传入handler,表示处理文字的点击事件，不是区域的
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
py: "",
highLight: false,
}
render() {
const { vgap, hgap, lgap, rgap, tgap, bgap, height, lineHeight, maxWidth, textAlign, whiteSpace, handler, disabled, invalid, text: optionsText, value, keyword, highLight } = this.options;
if (hgap + lgap > 0) {
this.element.css({
textAlign: o.textAlign,
whiteSpace: this._getTextWrap(),
textOverflow: o.whiteSpace === "nowrap" ? "ellipsis" : "",
overflow: o.whiteSpace === "nowrap" ? "" : (BI.isWidthOrHeight(o.height) ? "auto" : ""),
"padding-left": BI.pixFormat(hgap + lgap),
});
if (o.handler && o.handler !== BI.emptyFn) {
this.text = BI.createWidget({
type: "bi.layout",
tagName: "span",
});
this.text.element.click(function (e) {
!o.disabled && !o.invalid && o.handler.call(self, self.getValue(), self, e);
});
BI.createWidget({
type: "bi.default",
element: this,
items: [this.text],
});
} else {
this.text = this;
}
var text = BI.isFunction(o.text) ? this.__watch(o.text, function (context, newValue) {
self.setText(newValue);
}) : o.text;
// 只要不是undefined就可以显示text值，否则显示value
if (!BI.isUndefined(text)) {
this.setText(text);
} else if (BI.isKey(o.value)) {
this.setText(o.value);
}
if (BI.isKey(o.keyword)) {
this.doRedMark(o.keyword);
}
if (o.highLight) {
this.doHighLight();
}
},
_getTextWrap: function () {
var o = this.options;
switch (o.whiteSpace) {
case "nowrap":
return "pre";
case "normal":
return "pre-wrap";
default:
return o.whiteSpace;
}
},
_getShowText: function () {
var o = this.options;
var text = BI.isFunction(o.text) ? o.text() : o.text;
return BI.isKey(text) ? BI.Text.formatText(text + "") : text;
},
_doRedMark: function (keyword) {
var o = this.options;
// render之后做的doRedMark,这个时候虽然标红了，但是之后text mounted执行的时候并没有keyword
o.keyword = keyword;
this.text.element.__textKeywordMarked__(this._getShowText(), keyword, o.py);
},
doRedMark: function (keyword) {
if (BI.isKey(keyword)) {
this._doRedMark(keyword);
}
},
unRedMark: function () {
var o = this.options;
o.keyword = "";
this.text.element.__textKeywordMarked__(this._getShowText(), "", o.py);
},
doHighLight: function () {
this.text.element.addClass("bi-high-light");
},
unHighLight: function () {
this.text.element.removeClass("bi-high-light");
},
setValue: function (text) {
BI.Text.superclass.setValue.apply(this, arguments);
if (!this.isReadOnly()) {
this.setText(text);
}
},
setStyle: function (css) {
this.text.element.css(css);
},
setText: function (text) {
BI.Text.superclass.setText.apply(this, arguments);
this.options.text = text;
this._doRedMark(this.options.keyword);
},
});
var formatters = [];
BI.Text.addTextFormatter = function (formatter) {
formatters.push(formatter);
};
BI.Text.formatText = function (text) {
if (formatters.length > 0) {
for (var i = 0, len = formatters.length; i < len; i++) {
text = formatters[i](text);
}
}
if (hgap + rgap > 0) {
this.element.css({
"padding-right": BI.pixFormat(hgap + rgap),
});
}
if (vgap + tgap > 0) {
this.element.css({
"padding-top": BI.pixFormat(vgap + tgap),
});
}
if (vgap + bgap > 0) {
this.element.css({
"padding-bottom": BI.pixFormat(vgap + bgap),
});
}
if (BI.isWidthOrHeight(height)) {
this.element.css({ lineHeight: BI.pixFormat(height) });
}
if (BI.isWidthOrHeight(lineHeight)) {
this.element.css({ lineHeight: BI.pixFormat(lineHeight) });
}
if (BI.isWidthOrHeight(maxWidth)) {
this.element.css({ maxWidth: BI.pixFormat(maxWidth) });
}
this.element.css({
textAlign: textAlign,
whiteSpace: this._getTextWrap(),
textOverflow: whiteSpace === "nowrap" ? "ellipsis" : "",
overflow: whiteSpace === "nowrap" ? "" : (BI.isWidthOrHeight(height) ? "auto" : ""),
});
if (handler && handler !== BI.emptyFn) {
this.text = BI.createWidget({
type: "bi.layout",
tagName: "span",
});
this.text.element.click((e) => {
!disabled && !invalid && handler.call(this, this.getValue(), this, e);
});
BI.createWidget({
type: "bi.default",
element: this,
items: [this.text],
});
} else {
this.text = this;
}
const text = BI.isFunction(optionsText) ? this.__watch(optionsText, (context, newValue) => {
this.setText(newValue);
}) : optionsText;
// 只要不是undefined就可以显示text值，否则显示value
if (!BI.isUndefined(text)) {
this.setText(text);
} else if (BI.isKey(value)) {
this.setText(value);
}
if (BI.isKey(keyword)) {
this.doRedMark(keyword);
}
if (highLight) {
this.doHighLight();
}
}
_getTextWrap() {
const { whiteSpace } = this.options;
switch (whiteSpace) {
case "nowrap":
return "pre";
case "normal":
return "pre-wrap";
default:
return whiteSpace;
}
}
return text;
};
BI.shortcut("bi.text", BI.Text);
}());
_getShowText() {
const { text: optionsText } = this.options;
const text = BI.isFunction(optionsText) ? optionsText() : optionsText;
return BI.isKey(text) ? Text.formatText(text + "") : text;
}
_doRedMark(keyword) {
const { py } = this.options;
// render之后做的doRedMark,这个时候虽然标红了，但是之后text mounted执行的时候并没有keyword
this.options.keyword = keyword;
this.text.element.__textKeywordMarked__(this._getShowText(), keyword, py);
}
doRedMark(keyword) {
if (BI.isKey(keyword)) {
this._doRedMark(keyword);
}
}
unRedMark() {
const { py } = this.options;
this.options.keyword = "";
this.text.element.__textKeywordMarked__(this._getShowText(), "", py);
}
doHighLight() {
this.text.element.addClass("bi-high-light");
}
unHighLight() {
this.text.element.removeClass("bi-high-light");
}
setValue(text) {
super.setValue(text);
if (!this.isReadOnly()) {
this.setText(text);
}
}
setStyle(css) {
this.text.element.css(css);
}
setText(text) {
super.setText(text);
this.options.text = text;
this._doRedMark(this.options.keyword);
}
}
const formatters = [];
Text.addTextFormatter = (formatter) => {
formatters.push(formatter);
};
Text.formatText = (text) => {
if (formatters.length > 0) {
for (let i = 0; i < formatters.length; i++) {
text = formatters[i](text);
}
}
return text;
};

Write Preview
Loading…
Cancel
Save