Browse Source

Fixed merge conflict

es6
Joker.Wang-王顺 2 years ago
parent
commit
7fd4fd7218
  1. 134
      es6.js
  2. 2
      src/base/0.base.js
  3. 230
      src/case/editor/editor.clear.js
  4. 304
      src/case/editor/editor.defaulttext.js
  5. 304
      src/case/editor/editor.shelter.js
  6. 313
      src/case/editor/editor.sign.js
  7. 338
      src/case/editor/editor.state.js
  8. 312
      src/case/editor/editor.state.simple.js
  9. 6
      src/case/editor/index.js
  10. 4
      src/case/index.js
  11. 100
      src/core/wrapper/layout/fill/auto.vtape.js
  12. 9
      src/core/wrapper/layout/fill/fill.horizontal.js
  13. 9
      src/core/wrapper/layout/fill/fill.vertical.js
  14. 147
      src/core/wrapper/layout/fill/float.fill.horizontal.js
  15. 4
      src/core/wrapper/layout/fill/index.js
  16. 49
      src/core/wrapper/layout/flex/flex.center.js
  17. 55
      src/core/wrapper/layout/flex/flex.horizontal.center.js
  18. 72
      src/core/wrapper/layout/flex/flex.horizontal.js
  19. 96
      src/core/wrapper/layout/flex/flex.leftrightvertical.center.js
  20. 55
      src/core/wrapper/layout/flex/flex.vertical.center.js
  21. 68
      src/core/wrapper/layout/flex/flex.vertical.js
  22. 7
      src/core/wrapper/layout/flex/index.js
  23. 49
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.center.js
  24. 55
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.center.js
  25. 83
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
  26. 55
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.center.js
  27. 83
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
  28. 5
      src/core/wrapper/layout/flex/wrapper/index.js
  29. 46
      src/core/wrapper/layout/float/float.absolute.center.js
  30. 66
      src/core/wrapper/layout/float/float.absolute.horizontal.js
  31. 178
      src/core/wrapper/layout/float/float.absolute.leftrightvertical.js
  32. 66
      src/core/wrapper/layout/float/float.absolute.vertical.js
  33. 68
      src/core/wrapper/layout/float/float.horizontal.js
  34. 5
      src/core/wrapper/layout/float/index.js
  35. 6
      src/core/wrapper/layout/index.js
  36. 4
      src/core/wrapper/layout/middle/index.js
  37. 76
      src/core/wrapper/layout/middle/middle.center.js
  38. 83
      src/core/wrapper/layout/middle/middle.float.center.js
  39. 77
      src/core/wrapper/layout/middle/middle.horizontal.js
  40. 68
      src/core/wrapper/layout/middle/middle.vertical.js
  41. 3
      src/core/wrapper/layout/responsive/index.js
  42. 68
      src/core/wrapper/layout/responsive/responsive.flex.horizontal.js
  43. 72
      src/core/wrapper/layout/responsive/responsive.flex.wrapper.horizontal.js
  44. 50
      src/core/wrapper/layout/responsive/responsive.inline..js
  45. 58
      src/core/wrapper/layout/responsive/responsive.inline.js
  46. 2
      src/core/wrapper/layout/sticky/index.js
  47. 42
      src/core/wrapper/layout/sticky/sticky.horizontal.js
  48. 42
      src/core/wrapper/layout/sticky/sticky.vertical.js

134
es6.js

@ -0,0 +1,134 @@
const fs = require("fs");
const srcName = process.argv[2];
const sourceCode = fs.readFileSync(srcName).toString();
const clzName = /BI\.(.*?)\s\=\sBI\.inherit\(/.exec(sourceCode)[1];
const superName = /inherit\(BI\.(.*?),/.exec(sourceCode)[1];
// const xtype = /BI.shortcut\(\"(.*?)\"/.exec(sourceCode)[1];
const collection = {
"static": {},
attr: {},
};
const BI = {
inherit(_, options) {
collection.methods = Object.keys(options)
.filter(key => typeof options[key] === "function")
.map(key => options[key]);
Object.keys(options)
.filter(key => typeof options[key] !== "function")
.forEach(key => {
collection.attr[key] = options[key];
});
return collection.static;
},
shortcut(xtype) {
collection.xtype = xtype;
},
};
eval(sourceCode);
let M = "";
let E = "";
let I = "";
let A = "";
const coreImport = {
shortcut: true,
};
if (superName === "Widget") {
coreImport.Widget = true;
}
Object.keys(collection.attr).forEach(key => {
A = `${key} = ${JSON.stringify(collection.attr[key])};`;
});
// 静态方法
Object.keys(collection.static).forEach(key => {
E += `\tstatic ${key} = "${collection.static[key]}"\n`;
});
// 对函数进行替换
collection.methods.forEach(el => {
let f = `${el.toString().replace(/^function/, el.name)}\n`;
// 换 BI.Button.superclass
f = f.replace(`BI.${clzName}.superclass`, "super");
// 换 super._defaultConfig
f = f.replace(
`super\._defaultConfig\.apply\(this\,\sarguments\)`,
"super._defaultConfig(arguments)"
);
// 换 super.xxx.apply
f = f.replace(/super\.(.*?)\.apply\(this\,\sarguments\)/, a => {
const f = /super\.(.*?)\.apply\(this\,\sarguments\)/.exec(a);
return `super.${f[1]}(...arguments)`;
});
const target = [
"isNull",
"toPix",
"isKey",
"isObject",
"map",
"extend",
"isFunction",
"isEmptyArray",
"isArray",
"Controller",
clzName,
"createWidget",
"Events",
"emptyFn",
"nextTick",
"bind",
"i18nText",
"isNotNull",
"isString",
"isNumber",
"isEmpty",
];
target.forEach(t => {
const arr = f.split(`BI.${t}`);
// nodejs 低版本没有 replaceAll
if (arr.length > 1) {
if (t !== clzName) coreImport[t] = true;
f = arr.join(t);
}
});
M += `${f}\n`;
});
Object.keys(coreImport).forEach(el => {
I += `${el},`;
});
const outputCode = `
import {${I}} from "@/core"
@shortcut()
export class ${clzName} extends ${superName} {
\tstatic xtype = "${collection.xtype}"
${A}
${E}
${M}
}
`;
// fs.writeFileSync(`${srcName}.js.raw`, sourceCode);
fs.writeFileSync(srcName, outputCode);

2
src/base/0.base.js

@ -7,7 +7,7 @@ import {
PopoverController,
ResizeController,
TooltipsController,
StyleLoaderManager,
StyleLoaderManager
} from "../core";
const Resizers = new ResizeController();

230
src/case/editor/editor.clear.js

@ -1,28 +1,56 @@
import { shortcut, Widget, extend, emptyFn, isKey, isFunction, createWidget, Controller, Events } from "@/core";
import { Editor, IconButton } from "@/base";
/**
* 有清楚按钮的文本框
* 有清按钮的文本框
* Created by GUY on 2015/9/29.
* @class BI.SmallTextEditor
* @extends BI.SearchEditor
* @class ClearEditor
* @extends Widget
*/
BI.ClearEditor = BI.inherit(BI.Widget, {
_defaultConfig: function () {
var conf = BI.ClearEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
@shortcut()
export class ClearEditor extends Widget {
static xtype = "bi.clear_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_BACKSPACE = "EVENT_BACKSPACE"
static EVENT_CLEAR = "EVENT_CLEAR"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_REMOVE = "EVENT_REMOVE"
static EVENT_EMPTY = "EVENT_EMPTY"
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: "bi-clear-editor",
height: 24,
errorText: "",
watermark: "",
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn
});
},
_init: function () {
var self = this, o = this.options;
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
self.setValue(newValue);
validationChecker: emptyFn,
quitChecker: emptyFn,
});
}
_init() {
const o = this.options;
o.value = isFunction(o.value) ? this.__watch(o.value, (context, newValue) => {
this.setValue(newValue);
}) : o.value;
BI.ClearEditor.superclass._init.apply(this, arguments);
this.editor = BI.createWidget({
super._init(...arguments);
this.editor = createWidget({
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -34,150 +62,128 @@ BI.ClearEditor = BI.inherit(BI.Widget, {
value: o.value,
autoTrim: o.autoTrim,
});
this.clear = BI.createWidget({
this.clear = createWidget({
type: "bi.icon_button",
stopEvent: true,
invisible: !BI.isKey(o.value),
cls: "search-close-h-font"
invisible: !isKey(o.value),
cls: "search-close-h-font",
});
this.clear.on(BI.IconButton.EVENT_CHANGE, function () {
self.setValue("");
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.STOPEDIT);
self.fireEvent(BI.ClearEditor.EVENT_CLEAR);
this.clear.on(IconButton.EVENT_CHANGE, () => {
this.setValue("");
this.fireEvent(Controller.EVENT_CHANGE, Events.STOPEDIT);
this.fireEvent(ClearEditor.EVENT_CLEAR);
});
BI.createWidget({
createWidget({
element: this,
type: "bi.htape",
items: [
{
el: this.editor
},
{
el: this.clear,
width: 24
}
]
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
items: [{
el: this.editor,
},
{
el: this.clear,
width: 24,
}
],
});
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.ClearEditor.EVENT_FOCUS);
this.editor.on(Editor.EVENT_FOCUS, () => {
this.fireEvent(ClearEditor.EVENT_FOCUS);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.ClearEditor.EVENT_BLUR);
this.editor.on(Editor.EVENT_BLUR, () => {
this.fireEvent(ClearEditor.EVENT_BLUR);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.ClearEditor.EVENT_CLICK);
this.editor.on(Editor.EVENT_CLICK, () => {
this.fireEvent(ClearEditor.EVENT_CLICK);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self._checkClear();
self.fireEvent(BI.ClearEditor.EVENT_CHANGE);
this.editor.on(Editor.EVENT_CHANGE, () => {
this._checkClear();
this.fireEvent(ClearEditor.EVENT_CHANGE);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.ClearEditor.EVENT_KEY_DOWN, v);
this.editor.on(Editor.EVENT_KEY_DOWN, v => {
this.fireEvent(ClearEditor.EVENT_KEY_DOWN, v);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.ClearEditor.EVENT_SPACE);
this.editor.on(Editor.EVENT_SPACE, () => {
this.fireEvent(ClearEditor.EVENT_SPACE);
});
this.editor.on(BI.Editor.EVENT_BACKSPACE, function () {
self.fireEvent(BI.ClearEditor.EVENT_BACKSPACE);
this.editor.on(Editor.EVENT_BACKSPACE, () => {
this.fireEvent(ClearEditor.EVENT_BACKSPACE);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.ClearEditor.EVENT_VALID);
this.editor.on(Editor.EVENT_VALID, () => {
this.fireEvent(ClearEditor.EVENT_VALID);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self.fireEvent(BI.ClearEditor.EVENT_ERROR);
this.editor.on(Editor.EVENT_ERROR, () => {
this.fireEvent(ClearEditor.EVENT_ERROR);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.ClearEditor.EVENT_ENTER);
this.editor.on(Editor.EVENT_ENTER, () => {
this.fireEvent(ClearEditor.EVENT_ENTER);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.ClearEditor.EVENT_RESTRICT);
this.editor.on(Editor.EVENT_RESTRICT, () => {
this.fireEvent(ClearEditor.EVENT_RESTRICT);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self._checkClear();
self.fireEvent(BI.ClearEditor.EVENT_EMPTY);
this.editor.on(Editor.EVENT_EMPTY, () => {
this._checkClear();
this.fireEvent(ClearEditor.EVENT_EMPTY);
});
this.editor.on(BI.Editor.EVENT_REMOVE, function () {
self.fireEvent(BI.ClearEditor.EVENT_REMOVE);
this.editor.on(Editor.EVENT_REMOVE, () => {
this.fireEvent(ClearEditor.EVENT_REMOVE);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self.fireEvent(BI.ClearEditor.EVENT_CONFIRM);
this.editor.on(Editor.EVENT_CONFIRM, () => {
this.fireEvent(ClearEditor.EVENT_CONFIRM);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self.fireEvent(BI.ClearEditor.EVENT_CHANGE_CONFIRM);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, () => {
this.fireEvent(ClearEditor.EVENT_CHANGE_CONFIRM);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.ClearEditor.EVENT_START);
this.editor.on(Editor.EVENT_START, () => {
this.fireEvent(ClearEditor.EVENT_START);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.ClearEditor.EVENT_PAUSE);
this.editor.on(Editor.EVENT_PAUSE, () => {
this.fireEvent(ClearEditor.EVENT_PAUSE);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.ClearEditor.EVENT_STOP);
this.editor.on(Editor.EVENT_STOP, () => {
this.fireEvent(ClearEditor.EVENT_STOP);
});
},
}
_checkClear: function () {
_checkClear() {
if (!this.getValue()) {
this.clear.invisible();
} else {
this.clear.visible();
}
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
focus: function () {
focus() {
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
},
}
getValue: function () {
getValue() {
if (this.isValid()) {
return this.editor.getValue();
}
},
}
setValue: function (v) {
setValue(v) {
this.editor.setValue(v);
if (BI.isKey(v)) {
if (isKey(v)) {
this.clear.visible();
}
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
}
});
BI.ClearEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.ClearEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.ClearEditor.EVENT_BLUR = "EVENT_BLUR";
BI.ClearEditor.EVENT_CLICK = "EVENT_CLICK";
BI.ClearEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.ClearEditor.EVENT_SPACE = "EVENT_SPACE";
BI.ClearEditor.EVENT_BACKSPACE = "EVENT_BACKSPACE";
BI.ClearEditor.EVENT_CLEAR = "EVENT_CLEAR";
BI.ClearEditor.EVENT_START = "EVENT_START";
BI.ClearEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.ClearEditor.EVENT_STOP = "EVENT_STOP";
BI.ClearEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.ClearEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.ClearEditor.EVENT_VALID = "EVENT_VALID";
BI.ClearEditor.EVENT_ERROR = "EVENT_ERROR";
BI.ClearEditor.EVENT_ENTER = "EVENT_ENTER";
BI.ClearEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.ClearEditor.EVENT_REMOVE = "EVENT_REMOVE";
BI.ClearEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.clear_editor", BI.ClearEditor);
}

304
src/case/editor/editor.defaulttext.js

@ -1,11 +1,36 @@
import { shortcut, Widget, emptyFn, isKey, isFunction, createWidget, nextTick, Controller } from "@/core";
import { Editor, TextButton } from "@/base";
/**
* dailer
* 有默认提示文字的输入框
* @class BI.DefaultTextEditor
* @extends BI.Widget
* @class DefaultTextEditor
* @extends Widget
*/
BI.DefaultTextEditor = BI.inherit(BI.Widget, {
props: function () {
@shortcut()
export class DefaultTextEditor extends Widget {
static xtype = "bi.default_text_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_EMPTY = "EVENT_EMPTY"
props() {
return {
baseCls: "bi-default-text-editor",
hgap: 4,
@ -14,21 +39,21 @@ BI.DefaultTextEditor = BI.inherit(BI.Widget, {
rgap: 0,
tgap: 0,
bgap: 0,
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
validationChecker: emptyFn,
quitChecker: emptyFn,
allowBlank: true,
watermark: "",
errorText: "",
height: 24,
defaultText: "", // 默认显示值,默认显示值与显示值的区别是默认显示值标记灰色
text: "", // 显示值
el: {}
el: {},
};
},
}
render: function () {
var self = this, o = this.options;
this.editor = BI.createWidget(o.el, {
render() {
const o = this.options;
this.editor = createWidget(o.el, {
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -48,239 +73,218 @@ BI.DefaultTextEditor = BI.inherit(BI.Widget, {
autoTrim: o.autoTrim,
});
var showText = BI.isFunction(o.text) ? o.text() : o.text;
const showText = isFunction(o.text) ? o.text() : o.text;
this.text = BI.createWidget({
this.text = createWidget({
type: "bi.text_button",
cls: BI.isKey(showText) ? "tip-text-style" : "bi-water-mark tip-text-style",
cls: isKey(showText) ? "tip-text-style" : "bi-water-mark tip-text-style",
textAlign: "left",
height: o.height,
text: showText || o.defaultText,
hgap: o.hgap + 2,
handler: function () {
self._showInput();
self.editor.focus();
self.editor.setValue("");
handler: () => {
this._showInput();
this.editor.focus();
this.editor.setValue("");
},
title: o.title,
warningTitle: o.warningTitle,
tipType: o.tipType
tipType: o.tipType,
});
this.text.on(BI.TextButton.EVENT_CHANGE, function () {
BI.nextTick(function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_CLICK_LABEL);
this.text.on(TextButton.EVENT_CHANGE, () => {
nextTick(() => {
this.fireEvent(DefaultTextEditor.EVENT_CLICK_LABEL);
});
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_FOCUS, arguments);
this.editor.on(Editor.EVENT_FOCUS, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_FOCUS, ...args);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_BLUR, arguments);
this.editor.on(Editor.EVENT_BLUR, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_BLUR, ...args);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_CLICK, arguments);
this.editor.on(Editor.EVENT_CLICK, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_CLICK, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_CHANGE, arguments);
this.editor.on(Editor.EVENT_CHANGE, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.DefaultTextEditor.EVENT_KEY_DOWN, arguments);
this.editor.on(Editor.EVENT_KEY_DOWN, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_KEY_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_VALID, arguments);
this.editor.on(Editor.EVENT_VALID, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_VALID, ...args);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.DefaultTextEditor.EVENT_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(DefaultTextEditor.EVENT_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.DefaultTextEditor.EVENT_CHANGE_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(DefaultTextEditor.EVENT_CHANGE_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_START, arguments);
this.editor.on(Editor.EVENT_START, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_START, ...args);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_PAUSE, arguments);
this.editor.on(Editor.EVENT_PAUSE, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_PAUSE, ...args);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_STOP, arguments);
this.editor.on(Editor.EVENT_STOP, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_STOP, ...args);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_SPACE, arguments);
this.editor.on(Editor.EVENT_SPACE, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_SPACE, ...args);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_ERROR, arguments);
this.editor.on(Editor.EVENT_ERROR, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_ERROR, ...args);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_ENTER, arguments);
this.editor.on(Editor.EVENT_ENTER, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_ENTER, ...args);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_RESTRICT, arguments);
this.editor.on(Editor.EVENT_RESTRICT, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_RESTRICT, ...args);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self.fireEvent(BI.DefaultTextEditor.EVENT_EMPTY, arguments);
this.editor.on(Editor.EVENT_EMPTY, (...args) => {
this.fireEvent(DefaultTextEditor.EVENT_EMPTY, ...args);
});
return {
type: "bi.absolute",
items: [
{
el: this.editor,
left: 0,
right: 0,
top: 0,
bottom: 0
}, {
el: this.text,
left: 0,
right: 0,
top: 0,
bottom: 0
}
]
items: [{
el: this.editor,
left: 0,
right: 0,
top: 0,
bottom: 0,
}, {
el: this.text,
left: 0,
right: 0,
top: 0,
bottom: 0,
}],
};
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
setTitle: function (title) {
setTitle(title) {
this.text.setTitle(title);
},
}
setWarningTitle: function (title) {
setWarningTitle(title) {
this.text.setWarningTitle(title);
},
}
doRedMark: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doRedMark() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doRedMark.apply(this.text, arguments);
},
this.text.doRedMark(...arguments);
}
unRedMark: function () {
this.text.unRedMark.apply(this.text, arguments);
},
unRedMark() {
this.text.unRedMark(...arguments);
}
doHighLight: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doHighLight() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doHighLight.apply(this.text, arguments);
},
this.text.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
focus: function () {
focus() {
if (this.options.disabled === false) {
this._showInput();
this.editor.focus();
}
},
}
blur: function () {
blur() {
this.editor.blur();
this._showHint();
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
_setText: function (v) {
_setText(v) {
this.text.setText(v);
this.text.setTitle(v);
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (k) {
setValue(k) {
this.editor.setValue(k);
},
}
getValue: function () {
getValue() {
return this.editor.getValue();
},
}
getState: function () {
getState() {
return this.text.getValue();
},
}
setState: function (v) {
var o = this.options;
if (BI.isKey(v)) {
setState(v) {
const o = this.options;
if (isKey(v)) {
this.text.setText(v);
this.text.element.removeClass("bi-water-mark");
return;
}
this.text.setText(o.defaultText);
this.text.element.addClass("bi-water-mark");
},
}
setTipType: function (v) {
setTipType(v) {
this.text.options.tipType = v;
},
}
getText: function () {
getText() {
return this.text.getText();
}
});
BI.DefaultTextEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.DefaultTextEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.DefaultTextEditor.EVENT_BLUR = "EVENT_BLUR";
BI.DefaultTextEditor.EVENT_CLICK = "EVENT_CLICK";
BI.DefaultTextEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.DefaultTextEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
BI.DefaultTextEditor.EVENT_START = "EVENT_START";
BI.DefaultTextEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.DefaultTextEditor.EVENT_STOP = "EVENT_STOP";
BI.DefaultTextEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.DefaultTextEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.DefaultTextEditor.EVENT_VALID = "EVENT_VALID";
BI.DefaultTextEditor.EVENT_ERROR = "EVENT_ERROR";
BI.DefaultTextEditor.EVENT_ENTER = "EVENT_ENTER";
BI.DefaultTextEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.DefaultTextEditor.EVENT_SPACE = "EVENT_SPACE";
BI.DefaultTextEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.default_text_editor", BI.DefaultTextEditor);
}

304
src/case/editor/editor.shelter.js

@ -1,37 +1,62 @@
import { shortcut, Widget, extend, emptyFn, isFunction, createWidget, Controller, isKey, nextTick, bind } from "@/core";
import { Editor, TextButton } from "@/base";
/**
* 带标记的文本框
* Created by GUY on 2016/1/25.
* @class BI.ShelterEditor
* @extends BI.Widget
* @class ShelterEditor
* @extends Widget
*/
BI.ShelterEditor = BI.inherit(BI.Widget, {
_defaultConfig: function () {
var conf = BI.ShelterEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-shelter-editor",
@shortcut()
export class ShelterEditor extends Widget {
static xtype = "bi.shelter_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_EMPTY = "EVENT_EMPTY"
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-shelter-editor`,
hgap: 4,
vgap: 2,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
validationChecker: emptyFn,
quitChecker: emptyFn,
allowBlank: true,
watermark: "",
errorText: "",
height: 24,
textAlign: "left"
textAlign: "left",
});
},
}
_init: function () {
var self = this, o = this.options;
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
self.setValue(newValue);
_init() {
const o = this.options;
o.value = isFunction(o.value) ? this.__watch(o.value, (context, newValue) => {
this.setValue(newValue);
}) : o.value;
BI.ShelterEditor.superclass._init.apply(this, arguments);
this.editor = BI.createWidget({
super._init(...arguments);
this.editor = createWidget({
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -49,7 +74,7 @@ BI.ShelterEditor = BI.inherit(BI.Widget, {
errorText: o.errorText,
autoTrim: o.autoTrim,
});
this.text = BI.createWidget({
this.text = createWidget({
type: "bi.text_button",
cls: "shelter-editor-text",
title: o.title,
@ -57,92 +82,90 @@ BI.ShelterEditor = BI.inherit(BI.Widget, {
tipType: o.tipType,
textAlign: o.textAlign,
height: o.height,
hgap: o.hgap + 2
hgap: o.hgap + 2,
});
this.text.on(BI.Controller.EVENT_CHANGE, function () {
arguments[2] = self;
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.text.on(Controller.EVENT_CHANGE, (...args) => {
args[2] = this;
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.text.on(BI.TextButton.EVENT_CHANGE, function () {
self.fireEvent(BI.ShelterEditor.EVENT_CLICK_LABEL);
this.text.on(TextButton.EVENT_CHANGE, () => {
this.fireEvent(ShelterEditor.EVENT_CLICK_LABEL);
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.ShelterEditor.EVENT_FOCUS, arguments);
this.editor.on(Editor.EVENT_FOCUS, (...args) => {
this.fireEvent(ShelterEditor.EVENT_FOCUS, ...args);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.ShelterEditor.EVENT_BLUR, arguments);
this.editor.on(Editor.EVENT_BLUR, (...args) => {
this.fireEvent(ShelterEditor.EVENT_BLUR, ...args);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.ShelterEditor.EVENT_CLICK, arguments);
this.editor.on(Editor.EVENT_CLICK, (...args) => {
this.fireEvent(ShelterEditor.EVENT_CLICK, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self.fireEvent(BI.ShelterEditor.EVENT_CHANGE, arguments);
this.editor.on(Editor.EVENT_CHANGE, (...args) => {
this.fireEvent(ShelterEditor.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.ShelterEditor.EVENT_KEY_DOWN, arguments);
this.editor.on(Editor.EVENT_KEY_DOWN, (...args) => {
this.fireEvent(ShelterEditor.EVENT_KEY_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.ShelterEditor.EVENT_VALID, arguments);
this.editor.on(Editor.EVENT_VALID, (...args) => {
this.fireEvent(ShelterEditor.EVENT_VALID, ...args);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self._showHint();
self._checkText();
self.fireEvent(BI.ShelterEditor.EVENT_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
this._showHint();
this._checkText();
this.fireEvent(ShelterEditor.EVENT_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self._showHint();
self._checkText();
self.fireEvent(BI.ShelterEditor.EVENT_CHANGE_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
this._showHint();
this._checkText();
this.fireEvent(ShelterEditor.EVENT_CHANGE_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.ShelterEditor.EVENT_START, arguments);
this.editor.on(Editor.EVENT_START, (...args) => {
this.fireEvent(ShelterEditor.EVENT_START, ...args);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.ShelterEditor.EVENT_PAUSE, arguments);
this.editor.on(Editor.EVENT_PAUSE, (...args) => {
this.fireEvent(ShelterEditor.EVENT_PAUSE, ...args);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.ShelterEditor.EVENT_STOP, arguments);
this.editor.on(Editor.EVENT_STOP, (...args) => {
this.fireEvent(ShelterEditor.EVENT_STOP, ...args);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.ShelterEditor.EVENT_SPACE, arguments);
this.editor.on(Editor.EVENT_SPACE, (...args) => {
this.fireEvent(ShelterEditor.EVENT_SPACE, ...args);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self._checkText();
self.fireEvent(BI.ShelterEditor.EVENT_ERROR, arguments);
this.editor.on(Editor.EVENT_ERROR, (...args) => {
this._checkText();
this.fireEvent(ShelterEditor.EVENT_ERROR, ...args);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.ShelterEditor.EVENT_ENTER, arguments);
this.editor.on(Editor.EVENT_ENTER, (...args) => {
this.fireEvent(ShelterEditor.EVENT_ENTER, ...args);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.ShelterEditor.EVENT_RESTRICT, arguments);
this.editor.on(Editor.EVENT_RESTRICT, (...args) => {
this.fireEvent(ShelterEditor.EVENT_RESTRICT, ...args);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self.fireEvent(BI.ShelterEditor.EVENT_EMPTY, arguments);
this.editor.on(Editor.EVENT_EMPTY, (...args) => {
this.fireEvent(ShelterEditor.EVENT_EMPTY, ...args);
});
BI.createWidget({
createWidget({
type: "bi.absolute",
element: this,
items: [
{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}
]
items: [{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}],
});
this._showHint();
self._checkText();
},
this._checkText();
}
_checkText: function () {
var o = this.options;
BI.nextTick(BI.bind(function () {
_checkText() {
const o = this.options;
nextTick(bind(function () {
if (this.editor.getValue() === "") {
this.text.setValue(o.watermark || "");
this.text.element.addClass("bi-water-mark");
@ -150,130 +173,109 @@ BI.ShelterEditor = BI.inherit(BI.Widget, {
this.text.setValue(this.editor.getValue());
this.text.element.removeClass("bi-water-mark");
}
BI.isKey(o.keyword) && this.text.doRedMark(o.keyword);
isKey(o.keyword) && this.text.doRedMark(o.keyword);
}, this));
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
setTitle: function (title) {
setTitle(title) {
this.text.setTitle(title);
},
}
setWarningTitle: function (title) {
setWarningTitle(title) {
this.text.setWarningTitle(title);
},
}
focus: function () {
focus() {
this._showInput();
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
this._showHint();
this._checkText();
},
}
doRedMark: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doRedMark() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doRedMark.apply(this.text, arguments);
},
this.text.doRedMark(...arguments);
}
unRedMark: function () {
this.text.unRedMark.apply(this.text, arguments);
},
unRedMark() {
this.text.unRedMark(...arguments);
}
doHighLight: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doHighLight() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doHighLight.apply(this.text, arguments);
},
this.text.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setTextStyle: function (style) {
setTextStyle(style) {
this.text.setStyle(style);
},
}
setValue: function (k) {
var o = this.options;
setValue(k) {
this.editor.setValue(k);
this._checkText();
},
}
getValue: function () {
getValue() {
return this.editor.getValue();
},
}
getState: function () {
getState() {
return this.text.getValue();
},
}
setState: function (v) {
setState(v) {
this._showHint();
this.text.setValue(v);
}
});
BI.ShelterEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.ShelterEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.ShelterEditor.EVENT_BLUR = "EVENT_BLUR";
BI.ShelterEditor.EVENT_CLICK = "EVENT_CLICK";
BI.ShelterEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.ShelterEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
BI.ShelterEditor.EVENT_START = "EVENT_START";
BI.ShelterEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.ShelterEditor.EVENT_STOP = "EVENT_STOP";
BI.ShelterEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.ShelterEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.ShelterEditor.EVENT_VALID = "EVENT_VALID";
BI.ShelterEditor.EVENT_ERROR = "EVENT_ERROR";
BI.ShelterEditor.EVENT_ENTER = "EVENT_ENTER";
BI.ShelterEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.ShelterEditor.EVENT_SPACE = "EVENT_SPACE";
BI.ShelterEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.shelter_editor", BI.ShelterEditor);
}

313
src/case/editor/editor.sign.js

@ -1,37 +1,63 @@
import { shortcut, Widget, extend, emptyFn, isFunction, createWidget, nextTick, isKey, bind, Controller } from "@/core";
import { Editor, TextButton } from "@/base";
/**
* 带标记的文本框
* Created by GUY on 2015/8/28.
* @class BI.SignEditor
* @extends BI.Widget
* @class SignEditor
* @extends Widget
*/
BI.SignEditor = BI.inherit(BI.Widget, {
_defaultConfig: function () {
var conf = BI.SignEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-sign-editor",
@shortcut()
export class SignEditor extends Widget {
static xtype = "bi.sign_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_QUICK_DOWN = "EVENT_QUICK_DOWN"
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_EMPTY = "EVENT_EMPTY"
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-sign-editor`,
hgap: 4,
vgap: 2,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
validationChecker: emptyFn,
quitChecker: emptyFn,
allowBlank: true,
watermark: "",
errorText: "",
textAlign: "left",
height: 24
height: 24,
});
},
}
_init: function () {
var self = this, o = this.options;
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
self.setValue(newValue);
_init() {
const o = this.options;
o.value = isFunction(o.value) ? this.__watch(o.value, (context, newValue) => {
this.setValue(newValue);
}) : o.value;
BI.SignEditor.superclass._init.apply(this, arguments);
this.editor = BI.createWidget({
super._init(...arguments);
this.editor = createWidget({
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -49,7 +75,7 @@ BI.SignEditor = BI.inherit(BI.Widget, {
errorText: o.errorText,
autoTrim: o.autoTrim,
});
this.text = BI.createWidget({
this.text = createWidget({
type: "bi.text_button",
cls: "sign-editor-text",
title: o.title,
@ -58,229 +84,206 @@ BI.SignEditor = BI.inherit(BI.Widget, {
textAlign: o.textAlign,
height: o.height,
hgap: o.hgap + 2,
handler: function () {
self._showInput();
self.editor.focus();
self.editor.selectAll();
}
handler: () => {
this._showInput();
this.editor.focus();
this.editor.selectAll();
},
});
this.text.on(BI.TextButton.EVENT_CHANGE, function () {
BI.nextTick(function () {
self.fireEvent(BI.SignEditor.EVENT_CLICK_LABEL);
this.text.on(TextButton.EVENT_CHANGE, () => {
nextTick(() => {
this.fireEvent(SignEditor.EVENT_CLICK_LABEL);
});
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.SignEditor.EVENT_FOCUS, arguments);
this.editor.on(Editor.EVENT_FOCUS, (...args) => {
this.fireEvent(SignEditor.EVENT_FOCUS, ...args);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.SignEditor.EVENT_BLUR, arguments);
this.editor.on(Editor.EVENT_BLUR, (...args) => {
this.fireEvent(SignEditor.EVENT_BLUR, ...args);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.SignEditor.EVENT_CLICK, arguments);
this.editor.on(Editor.EVENT_CLICK, (...args) => {
this.fireEvent(SignEditor.EVENT_CLICK, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self.fireEvent(BI.SignEditor.EVENT_CHANGE, arguments);
this.editor.on(Editor.EVENT_CHANGE, (...args) => {
this.fireEvent(SignEditor.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.SignEditor.EVENT_KEY_DOWN, arguments);
this.editor.on(Editor.EVENT_KEY_DOWN, (...args) => {
this.fireEvent(SignEditor.EVENT_KEY_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_QUICK_DOWN, function () {
self.fireEvent(BI.SignEditor.EVENT_QUICK_DOWN, arguments);
this.editor.on(Editor.EVENT_QUICK_DOWN, (...args) => {
this.fireEvent(SignEditor.EVENT_QUICK_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.SignEditor.EVENT_VALID, arguments);
this.editor.on(Editor.EVENT_VALID, (...args) => {
this.fireEvent(SignEditor.EVENT_VALID, ...args);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self._showHint();
self._checkText();
self.fireEvent(BI.SignEditor.EVENT_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
this._showHint();
this._checkText();
this.fireEvent(SignEditor.EVENT_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self._showHint();
self._checkText();
self.fireEvent(BI.SignEditor.EVENT_CHANGE_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
this._showHint();
this._checkText();
this.fireEvent(SignEditor.EVENT_CHANGE_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.SignEditor.EVENT_START, arguments);
this.editor.on(Editor.EVENT_START, (...args) => {
this.fireEvent(SignEditor.EVENT_START, ...args);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.SignEditor.EVENT_PAUSE, arguments);
this.editor.on(Editor.EVENT_PAUSE, (...args) => {
this.fireEvent(SignEditor.EVENT_PAUSE, ...args);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.SignEditor.EVENT_STOP, arguments);
this.editor.on(Editor.EVENT_STOP, (...args) => {
this.fireEvent(SignEditor.EVENT_STOP, ...args);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.SignEditor.EVENT_SPACE, arguments);
this.editor.on(Editor.EVENT_SPACE, (...args) => {
this.fireEvent(SignEditor.EVENT_SPACE, ...args);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self._checkText();
self.fireEvent(BI.SignEditor.EVENT_ERROR, arguments);
this.editor.on(Editor.EVENT_ERROR, (...args) => {
this._checkText();
this.fireEvent(SignEditor.EVENT_ERROR, ...args);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.SignEditor.EVENT_ENTER, arguments);
this.editor.on(Editor.EVENT_ENTER, (...args) => {
this.fireEvent(SignEditor.EVENT_ENTER, ...args);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.SignEditor.EVENT_RESTRICT, arguments);
this.editor.on(Editor.EVENT_RESTRICT, (...args) => {
this.fireEvent(SignEditor.EVENT_RESTRICT, ...args);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self.fireEvent(BI.SignEditor.EVENT_EMPTY, arguments);
this.editor.on(Editor.EVENT_EMPTY, (...args) => {
this.fireEvent(SignEditor.EVENT_EMPTY, ...args);
});
BI.createWidget({
createWidget({
type: "bi.absolute",
element: this,
items: [
{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}
]
items: [{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}],
});
this._showHint();
self._checkText();
},
this._checkText();
}
_checkText: function () {
var o = this.options;
BI.nextTick(BI.bind(function () {
_checkText() {
const o = this.options;
nextTick(bind(function () {
if (this.editor.getValue() === "") {
this.text.setValue(o.watermark || "");
this.text.element.addClass("bi-water-mark");
} else {
this.text.setValue(this.editor.getValue());
this.text.element.removeClass("bi-water-mark");
BI.isKey(o.keyword) && this.text.doRedMark(o.keyword);
isKey(o.keyword) && this.text.doRedMark(o.keyword);
}
}, this));
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
setTitle: function (title) {
setTitle(title) {
this.text.setTitle(title);
},
}
setTipType: function (v) {
setTipType(v) {
this.text.setTipType(v);
},
}
setWarningTitle: function (title) {
setWarningTitle(title) {
this.text.setWarningTitle(title);
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this._checkText();
this.editor.setWaterMark(v);
},
}
focus: function () {
focus() {
this._showInput();
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
this._showHint();
this._checkText();
},
}
doRedMark: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doRedMark() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doRedMark.apply(this.text, arguments);
},
this.text.doRedMark(...arguments);
}
unRedMark: function () {
this.text.unRedMark.apply(this.text, arguments);
},
unRedMark() {
this.text.unRedMark(...arguments);
}
doHighLight: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doHighLight() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doHighLight.apply(this.text, arguments);
},
this.text.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (k) {
setValue(k) {
this.editor.setValue(k);
this._checkText();
},
}
getValue: function () {
getValue() {
return this.editor.getValue();
},
}
getState: function () {
getState() {
return this.text.getValue();
},
}
setState: function (v) {
setState(v) {
this._showHint();
this.text.setValue(v);
}
});
BI.SignEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.SignEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.SignEditor.EVENT_BLUR = "EVENT_BLUR";
BI.SignEditor.EVENT_CLICK = "EVENT_CLICK";
BI.SignEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.SignEditor.EVENT_QUICK_DOWN = "EVENT_QUICK_DOWN";
BI.SignEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
BI.SignEditor.EVENT_START = "EVENT_START";
BI.SignEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.SignEditor.EVENT_STOP = "EVENT_STOP";
BI.SignEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.SignEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.SignEditor.EVENT_VALID = "EVENT_VALID";
BI.SignEditor.EVENT_ERROR = "EVENT_ERROR";
BI.SignEditor.EVENT_ENTER = "EVENT_ENTER";
BI.SignEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.SignEditor.EVENT_SPACE = "EVENT_SPACE";
BI.SignEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.sign_editor", BI.SignEditor);
}

338
src/case/editor/editor.state.js

@ -1,36 +1,61 @@
import { shortcut, Widget, extend, emptyFn, i18nText, isArray, createWidget, nextTick, Controller, isNotNull, isString, isKey, isFunction, isNumber, isEmpty } from "@/core";
import { TextButton, Editor } from "@/base";
/**
* guy
* 记录状态的输入框
* @class BI.StateEditor
* @extends BI.Single
* @class StateEditor
* @extends Single
*/
BI.StateEditor = BI.inherit(BI.Widget, {
_defaultConfig: function () {
var conf = BI.StateEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-state-editor",
@shortcut()
export class StateEditor extends Widget {
static xtype = "bi.state_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_EMPTY = "EVENT_EMPTY"
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-state-editor`,
hgap: 4,
vgap: 2,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
validationChecker: emptyFn,
quitChecker: emptyFn,
allowBlank: true,
watermark: "",
errorText: "",
height: 24,
defaultText: BI.i18nText("BI-Basic_Unrestricted"), // 默认显示值,默认显示值与显示值的区别是默认显示值标记灰色
defaultText: i18nText("BI-Basic_Unrestricted"), // 默认显示值,默认显示值与显示值的区别是默认显示值标记灰色
text: "", // 显示值
el: {}
el: {},
});
},
}
_init: function () {
BI.StateEditor.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.editor = BI.createWidget(o.el, {
_init() {
super._init(...arguments);
const o = this.options;
this.editor = createWidget(o.el, {
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -48,262 +73,243 @@ BI.StateEditor = BI.inherit(BI.Widget, {
errorText: o.errorText,
autoTrim: o.autoTrim,
});
this.text = BI.createWidget({
this.text = createWidget({
type: "bi.text_button",
cls: "bi-water-mark tip-text-style",
textAlign: "left",
height: o.height,
text: o.text,
hgap: o.hgap + 2,
handler: function () {
self._showInput();
self.editor.focus();
self.editor.setValue("");
handler: () => {
this._showInput();
this.editor.focus();
this.editor.setValue("");
},
title: BI.isNotNull(o.tipText) ? o.tipText : function () {
var title = "";
if (BI.isString(self.stateValue)) {
title = self.stateValue;
title: isNotNull(o.tipText) ? o.tipText : () => {
let title = "";
if (isString(this.stateValue)) {
title = this.stateValue;
}
if (BI.isArray(self.stateValue) && self.stateValue.length === 1) {
title = self.stateValue[0];
if (isArray(this.stateValue) && this.stateValue.length === 1) {
title = this.stateValue[0];
}
return title;
},
warningTitle: o.warningTitle,
tipType: o.tipType
tipType: o.tipType,
});
this.text.on(BI.TextButton.EVENT_CHANGE, function () {
BI.nextTick(function () {
self.fireEvent(BI.StateEditor.EVENT_CLICK_LABEL);
this.text.on(TextButton.EVENT_CHANGE, () => {
nextTick(() => {
this.fireEvent(StateEditor.EVENT_CLICK_LABEL);
});
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.StateEditor.EVENT_FOCUS, arguments);
this.editor.on(Editor.EVENT_FOCUS, (...args) => {
this.fireEvent(StateEditor.EVENT_FOCUS, ...args);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.StateEditor.EVENT_BLUR, arguments);
this.editor.on(Editor.EVENT_BLUR, (...args) => {
this.fireEvent(StateEditor.EVENT_BLUR, ...args);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.StateEditor.EVENT_CLICK, arguments);
this.editor.on(Editor.EVENT_CLICK, (...args) => {
this.fireEvent(StateEditor.EVENT_CLICK, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self.fireEvent(BI.StateEditor.EVENT_CHANGE, arguments);
this.editor.on(Editor.EVENT_CHANGE, (...args) => {
this.fireEvent(StateEditor.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.StateEditor.EVENT_KEY_DOWN, arguments);
this.editor.on(Editor.EVENT_KEY_DOWN, (...args) => {
this.fireEvent(StateEditor.EVENT_KEY_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.StateEditor.EVENT_VALID, arguments);
this.editor.on(Editor.EVENT_VALID, (...args) => {
this.fireEvent(StateEditor.EVENT_VALID, ...args);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.StateEditor.EVENT_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(StateEditor.EVENT_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.StateEditor.EVENT_CHANGE_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(StateEditor.EVENT_CHANGE_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.StateEditor.EVENT_START, arguments);
this.editor.on(Editor.EVENT_START, (...args) => {
this.fireEvent(StateEditor.EVENT_START, ...args);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.StateEditor.EVENT_PAUSE, arguments);
this.editor.on(Editor.EVENT_PAUSE, (...args) => {
this.fireEvent(StateEditor.EVENT_PAUSE, ...args);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.StateEditor.EVENT_STOP, arguments);
this.editor.on(Editor.EVENT_STOP, (...args) => {
this.fireEvent(StateEditor.EVENT_STOP, ...args);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.StateEditor.EVENT_SPACE, arguments);
this.editor.on(Editor.EVENT_SPACE, (...args) => {
this.fireEvent(StateEditor.EVENT_SPACE, ...args);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self.fireEvent(BI.StateEditor.EVENT_ERROR, arguments);
this.editor.on(Editor.EVENT_ERROR, (...args) => {
this.fireEvent(StateEditor.EVENT_ERROR, ...args);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.StateEditor.EVENT_ENTER, arguments);
this.editor.on(Editor.EVENT_ENTER, (...args) => {
this.fireEvent(StateEditor.EVENT_ENTER, ...args);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.StateEditor.EVENT_RESTRICT, arguments);
this.editor.on(Editor.EVENT_RESTRICT, (...args) => {
this.fireEvent(StateEditor.EVENT_RESTRICT, ...args);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self.fireEvent(BI.StateEditor.EVENT_EMPTY, arguments);
this.editor.on(Editor.EVENT_EMPTY, (...args) => {
this.fireEvent(StateEditor.EVENT_EMPTY, ...args);
});
BI.createWidget({
createWidget({
type: "bi.absolute",
element: this,
items: [
{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}
]
items: [{
el: this.text,
inset: 0,
}, {
el: this.editor,
inset: 0,
}],
});
this._showHint();
if (BI.isNotNull(o.text)) {
if (isNotNull(o.text)) {
this.setState(o.text);
}
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
doRedMark: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doRedMark() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doRedMark.apply(this.text, arguments);
},
this.text.doRedMark(...arguments);
}
unRedMark: function () {
this.text.unRedMark.apply(this.text, arguments);
},
unRedMark() {
this.text.unRedMark(...arguments);
}
doHighLight: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doHighLight() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doHighLight.apply(this.text, arguments);
},
this.text.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
focus: function () {
focus() {
if (this.options.disabled === false) {
this._showInput();
this.editor.focus();
}
},
}
blur: function () {
blur() {
this.editor.blur();
this._showHint();
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
_setText: function (v) {
_setText(v) {
this.text.setText(v);
this.text.setTitle(v);
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (k) {
setValue(k) {
this.editor.setValue(k);
},
}
getValue: function () {
getValue() {
return this.editor.getValue();
},
}
getState: function () {
getState() {
return this.editor.getValue().match(/[^\s]+/g);
},
}
setState: function (v) {
var o = this.options;
var defaultText = BI.isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
BI.StateEditor.superclass.setValue.apply(this, arguments);
setState(v) {
const o = this.options;
const defaultText = isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
super.setValue(...arguments);
this.stateValue = v;
if (BI.isNumber(v)) {
if (v === BI.Selection.All) {
this._setText(BI.i18nText("BI-Select_All"));
if (isNumber(v)) {
if (v === Selection.All) {
this._setText(i18nText("BI-Select_All"));
this.text.element.removeClass("bi-water-mark");
} else if (v === BI.Selection.Multi) {
this._setText(BI.i18nText("BI-Select_Part"));
} else if (v === Selection.Multi) {
this._setText(i18nText("BI-Select_Part"));
this.text.element.removeClass("bi-water-mark");
} else {
this._setText(BI.isKey(defaultText) ? defaultText : o.text);
BI.isKey(defaultText) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
this._setText(isKey(defaultText) ? defaultText : o.text);
isKey(defaultText) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
}
return;
}
if (BI.isString(v)) {
if (isString(v)) {
this._setText(v);
// 配置了defaultText才判断标灰,其他情况不标灰
(BI.isKey(defaultText) && defaultText === v) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
(isKey(defaultText) && defaultText === v) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
return;
}
if (BI.isArray(v)) {
if (BI.isEmpty(v)) {
this._setText(BI.isKey(defaultText) ? defaultText : o.text);
BI.isKey(defaultText) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
if (isArray(v)) {
if (isEmpty(v)) {
this._setText(isKey(defaultText) ? defaultText : o.text);
isKey(defaultText) ? this.text.element.addClass("bi-water-mark") : this.text.element.removeClass("bi-water-mark");
} else if (v.length === 1) {
this._setText(v[0]);
this.text.element.removeClass("bi-water-mark");
} else {
this._setText(BI.i18nText("BI-Select_Part"));
this._setText(i18nText("BI-Select_Part"));
this.text.element.removeClass("bi-water-mark");
}
}
},
}
setTipType: function (v) {
setTipType(v) {
this.text.options.tipType = v;
},
}
getText: function () {
getText() {
return this.text.getText();
}
});
BI.StateEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.StateEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.StateEditor.EVENT_BLUR = "EVENT_BLUR";
BI.StateEditor.EVENT_CLICK = "EVENT_CLICK";
BI.StateEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.StateEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
BI.StateEditor.EVENT_START = "EVENT_START";
BI.StateEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.StateEditor.EVENT_STOP = "EVENT_STOP";
BI.StateEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.StateEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.StateEditor.EVENT_VALID = "EVENT_VALID";
BI.StateEditor.EVENT_ERROR = "EVENT_ERROR";
BI.StateEditor.EVENT_ENTER = "EVENT_ENTER";
BI.StateEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.StateEditor.EVENT_SPACE = "EVENT_SPACE";
BI.StateEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.state_editor", BI.StateEditor);
}

312
src/case/editor/editor.state.simple.js

@ -1,36 +1,61 @@
import { shortcut, Widget, extend, emptyFn, i18nText, Controller, createWidget, nextTick, isNotNull, isKey, isFunction, isArray, isNumber, isEmpty } from "@/core";
import { Editor, TextButton } from "@/base";
/**
* 无限制-已选择状态输入框
* Created by GUY on 2016/5/18.
* @class BI.SimpleStateEditor
* @extends BI.Single
* @class SimpleStateEditor
* @extends Single
*/
BI.SimpleStateEditor = BI.inherit(BI.Widget, {
_defaultConfig: function () {
var conf = BI.SimpleStateEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-simple-state-editor",
@shortcut()
export class SimpleStateEditor extends Widget {
static xtype = "bi.simple_state_editor"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CLICK = "EVENT_CLICK"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"
static EVENT_START = "EVENT_START"
static EVENT_PAUSE = "EVENT_PAUSE"
static EVENT_STOP = "EVENT_STOP"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_ENTER = "EVENT_ENTER"
static EVENT_RESTRICT = "EVENT_RESTRICT"
static EVENT_SPACE = "EVENT_SPACE"
static EVENT_EMPTY = "EVENT_EMPTY"
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-simple-state-editor`,
hgap: 4,
vgap: 2,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0,
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
validationChecker: emptyFn,
quitChecker: emptyFn,
mouseOut: false,
allowBlank: true,
watermark: "",
errorText: "",
height: 24,
text: "",
defaultText: BI.i18nText("BI-Basic_Unrestricted"),
defaultText: i18nText("BI-Basic_Unrestricted"),
});
},
}
_init: function () {
BI.SimpleStateEditor.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.editor = BI.createWidget({
_init() {
super._init(...arguments);
const o = this.options;
this.editor = createWidget({
type: "bi.editor",
simple: o.simple,
height: o.height,
@ -48,241 +73,220 @@ BI.SimpleStateEditor = BI.inherit(BI.Widget, {
errorText: o.errorText,
autoTrim: o.autoTrim,
});
this.text = BI.createWidget({
this.text = createWidget({
type: "bi.text_button",
cls: "bi-water-mark",
textAlign: "left",
text: o.text,
height: o.height,
hgap: o.hgap + 2,
handler: function () {
self._showInput();
self.editor.focus();
self.editor.setValue("");
}
handler: () => {
this._showInput();
this.editor.focus();
this.editor.setValue("");
},
});
this.text.on(BI.TextButton.EVENT_CHANGE, function () {
BI.nextTick(function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_CLICK_LABEL);
this.text.on(TextButton.EVENT_CHANGE, () => {
nextTick(() => {
this.fireEvent(SimpleStateEditor.EVENT_CLICK_LABEL);
});
});
BI.createWidget({
createWidget({
type: "bi.absolute",
element: this,
items: [
{
el: this.text,
left: 0,
right: 0,
top: 0,
bottom: 0
}
]
items: [{
el: this.text,
left: 0,
right: 0,
top: 0,
bottom: 0,
}],
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, (...args) => {
this.fireEvent(Controller.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_FOCUS, arguments);
this.editor.on(Editor.EVENT_FOCUS, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_FOCUS, ...args);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_BLUR, arguments);
this.editor.on(Editor.EVENT_BLUR, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_BLUR, ...args);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_CLICK, arguments);
this.editor.on(Editor.EVENT_CLICK, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_CLICK, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_CHANGE, arguments);
this.editor.on(Editor.EVENT_CHANGE, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_CHANGE, ...args);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.SimpleStateEditor.EVENT_KEY_DOWN, arguments);
this.editor.on(Editor.EVENT_KEY_DOWN, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_KEY_DOWN, ...args);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_VALID, arguments);
this.editor.on(Editor.EVENT_VALID, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_VALID, ...args);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.SimpleStateEditor.EVENT_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(SimpleStateEditor.EVENT_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self._showHint();
self.fireEvent(BI.SimpleStateEditor.EVENT_CHANGE_CONFIRM, arguments);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
this._showHint();
this.fireEvent(SimpleStateEditor.EVENT_CHANGE_CONFIRM, ...args);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_START, arguments);
this.editor.on(Editor.EVENT_START, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_START, ...args);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_PAUSE, arguments);
this.editor.on(Editor.EVENT_PAUSE, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_PAUSE, ...args);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_STOP, arguments);
this.editor.on(Editor.EVENT_STOP, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_STOP, ...args);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_SPACE, arguments);
this.editor.on(Editor.EVENT_SPACE, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_SPACE, ...args);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_ERROR, arguments);
this.editor.on(Editor.EVENT_ERROR, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_ERROR, ...args);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_ENTER, arguments);
this.editor.on(Editor.EVENT_ENTER, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_ENTER, ...args);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_RESTRICT, arguments);
this.editor.on(Editor.EVENT_RESTRICT, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_RESTRICT, ...args);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
self.fireEvent(BI.SimpleStateEditor.EVENT_EMPTY, arguments);
this.editor.on(Editor.EVENT_EMPTY, (...args) => {
this.fireEvent(SimpleStateEditor.EVENT_EMPTY, ...args);
});
BI.createWidget({
createWidget({
type: "bi.vertical",
scrolly: false,
element: this,
items: [this.editor]
items: [this.editor],
});
this._showHint();
if (BI.isNotNull(o.text)) {
if (isNotNull(o.text)) {
this.setState(o.text);
}
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
doRedMark: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doRedMark() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doRedMark.apply(this.text, arguments);
},
this.text.doRedMark(...arguments);
}
unRedMark: function () {
this.text.unRedMark.apply(this.text, arguments);
},
unRedMark() {
this.text.unRedMark(...arguments);
}
doHighLight: function () {
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
doHighLight() {
if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
return;
}
this.text.doHighLight.apply(this.text, arguments);
},
this.text.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
focus: function () {
focus() {
this._showInput();
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
this._showHint();
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
_setText: function (v) {
_setText(v) {
this.text.setText(v);
this.text.setTitle(v);
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (k) {
setValue(k) {
this.editor.setValue(k);
},
}
getValue: function () {
getValue() {
return this.editor.getValue();
},
}
getState: function () {
getState() {
return this.editor.getValue().match(/[^\s]+/g);
},
}
setState: function (v) {
var o = this.options;
BI.SimpleStateEditor.superclass.setValue.apply(this, arguments);
var defaultText = BI.isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
if (BI.isNumber(v)) {
if (v === BI.Selection.All) {
this._setText(BI.i18nText("BI-Already_Selected"));
setState(v) {
const o = this.options;
super.setValue(...arguments);
const defaultText = isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
if (isNumber(v)) {
if (v === Selection.All) {
this._setText(i18nText("BI-Already_Selected"));
this.text.element.removeClass("bi-water-mark");
} else if (v === BI.Selection.Multi) {
this._setText(BI.i18nText("BI-Already_Selected"));
} else if (v === Selection.Multi) {
this._setText(i18nText("BI-Already_Selected"));
this.text.element.removeClass("bi-water-mark");
} else {
this._setText(BI.isKey(defaultText) ? defaultText : o.text);
this._setText(isKey(defaultText) ? defaultText : o.text);
this.text.element.addClass("bi-water-mark");
}
return;
}
if (!BI.isArray(v) || v.length === 1) {
if (!isArray(v) || v.length === 1) {
this._setText(v);
this.text.element.removeClass("bi-water-mark");
} else if (BI.isEmpty(v)) {
} else if (isEmpty(v)) {
this._setText(o.text);
this.text.element.addClass("bi-water-mark");
} else {
this._setText(BI.i18nText("BI-Already_Selected"));
this._setText(i18nText("BI-Already_Selected"));
this.text.element.removeClass("bi-water-mark");
}
},
}
getText: function () {
getText() {
return this.text.getText();
}
});
BI.SimpleStateEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.SimpleStateEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.SimpleStateEditor.EVENT_BLUR = "EVENT_BLUR";
BI.SimpleStateEditor.EVENT_CLICK = "EVENT_CLICK";
BI.SimpleStateEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.SimpleStateEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
BI.SimpleStateEditor.EVENT_START = "EVENT_START";
BI.SimpleStateEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.SimpleStateEditor.EVENT_STOP = "EVENT_STOP";
BI.SimpleStateEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.SimpleStateEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.SimpleStateEditor.EVENT_VALID = "EVENT_VALID";
BI.SimpleStateEditor.EVENT_ERROR = "EVENT_ERROR";
BI.SimpleStateEditor.EVENT_ENTER = "EVENT_ENTER";
BI.SimpleStateEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.SimpleStateEditor.EVENT_SPACE = "EVENT_SPACE";
BI.SimpleStateEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.simple_state_editor", BI.SimpleStateEditor);
}

6
src/case/editor/index.js

@ -0,0 +1,6 @@
export { ClearEditor } from "./editor.clear";
export { DefaultTextEditor } from "./editor.defaulttext";
export { ShelterEditor } from "./editor.shelter";
export { SignEditor } from "./editor.sign";
export { StateEditor } from "./editor.state";
export { SimpleStateEditor } from "./editor.state.simple";

4
src/case/index.js

@ -1,13 +1,17 @@
import * as button from "./button";
import * as calendarItem from "./calendar";
import * as pager from "./pager";
import * as editor from "./editor";
Object.assign(BI, {
...button,
...calendarItem,
...pager,
...editor,
});
export * from "./button";
export * from "./calendar";
export * from "./pager";
export * from "./editor";

100
src/core/wrapper/layout/fill/auto.vtape.js

@ -1,9 +1,17 @@
BI.AutoVerticalTapeLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.AutoVerticalTapeLayout.superclass.props.apply(this, arguments), {
import { shortcut } from "@/core/decorator";
import { extend, any, isEmptyObject, isNull, backAny } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
@shortcut()
export class AutoVerticalTapeLayout extends Layout {
static xtype = "bi.vtape_auto";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-auto-htape",
horizontalAlign: BI.HorizontalAlign.Stretch,
verticalAlign: BI.VerticalAlign.Stretch,
horizontalAlign: HorizontalAlign.Stretch,
verticalAlign: VerticalAlign.Stretch,
hgap: 0,
vgap: 0,
lgap: 0,
@ -11,16 +19,17 @@ BI.AutoVerticalTapeLayout = BI.inherit(BI.Layout, {
tgap: 0,
bgap: 0,
rowSize: [],
items: []
items: [],
});
},
}
render() {
const o = this.options;
render: function () {
var self = this, o = this.options;
return {
type: "bi.vtape",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
items: o.items,
horizontalAlign: o.horizontalAlign,
@ -35,65 +44,65 @@ BI.AutoVerticalTapeLayout = BI.inherit(BI.Layout, {
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
};
},
}
_handleResize: function () {
var self = this, o = this.options;
var items = o.items;
var top = {}, bottom = {};
_handleResize() {
const o = this.options;
const items = o.items;
const top = {}, bottom = {};
top[0] = o.innerVgap;
bottom[items.length - 1] = o.innerVgap;
BI.any(items, function (i, item) {
if (BI.isEmptyObject(item)) {
any(items, (i, item) => {
if (isEmptyObject(item)) {
return true;
}
var w = self.layout.getWidgetByName(self._getChildName(i));
var rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
const w = this.layout.getWidgetByName(this._getChildName(i));
let rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (o.rowSize.length > 0) {
if (item.height >= 1 && o.rowSize[i] >= 1 && o.rowSize[i] !== item.height) {
rowSize = item.height;
}
}
if (BI.isNull(top[i])) {
var preRowSize = o.rowSize.length > 0 ? o.rowSize[i - 1] : items[i - 1].height;
if (isNull(top[i])) {
let preRowSize = o.rowSize.length > 0 ? o.rowSize[i - 1] : items[i - 1].height;
if (preRowSize === "") {
preRowSize = self.layout.getWidgetByName(self._getChildName(i - 1)).element.height();
preRowSize = this.layout.getWidgetByName(this._getChildName(i - 1)).element.height();
}
top[i] = top[i - 1] + preRowSize + self._optimiseItemTgap(items[i - 1]) + self._optimiseItemBgap(items[i - 1]) + 2 * self._optimiseItemVgap(items[i - 1]) + o.vgap + o.tgap + o.bgap;
top[i] = top[i - 1] + preRowSize + this._optimiseItemTgap(items[i - 1]) + this._optimiseItemBgap(items[i - 1]) + 2 * this._optimiseItemVgap(items[i - 1]) + o.vgap + o.tgap + o.bgap;
}
w.element.css({
top: self._optimiseGap(top[i] + self._optimiseItemTgap(item) + self._optimiseItemVgap(item) + o.vgap + o.tgap)
top: this._optimiseGap(top[i] + this._optimiseItemTgap(item) + this._optimiseItemVgap(item) + o.vgap + o.tgap),
});
if (rowSize === "fill") {
return true;
}
});
BI.backAny(items, function (i, item) {
if (BI.isEmptyObject(item)) {
backAny(items, (i, item) => {
if (isEmptyObject(item)) {
return true;
}
var w = self.layout.getWidgetByName(self._getChildName(i));
var rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (BI.isNull(bottom[i])) {
var nextRowSize = o.rowSize.length > 0 ? o.rowSize[i + 1] : items[i + 1].height;
const w = this.layout.getWidgetByName(this._getChildName(i));
const rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (isNull(bottom[i])) {
let nextRowSize = o.rowSize.length > 0 ? o.rowSize[i + 1] : items[i + 1].height;
if (nextRowSize === "") {
nextRowSize = self.layout.getWidgetByName(self._getChildName(i + 1)).element.height();
nextRowSize = this.layout.getWidgetByName(this._getChildName(i + 1)).element.height();
}
bottom[i] = bottom[i + 1] + nextRowSize + self._optimiseItemTgap(items[i + 1]) + self._optimiseItemBgap(items[i + 1]) + 2 * self._optimiseItemVgap(items[i + 1]) + o.vgap + o.tgap + o.bgap;
bottom[i] = bottom[i + 1] + nextRowSize + this._optimiseItemTgap(items[i + 1]) + this._optimiseItemBgap(items[i + 1]) + 2 * this._optimiseItemVgap(items[i + 1]) + o.vgap + o.tgap + o.bgap;
}
w.element.css({
bottom: self._optimiseGap(bottom[i] + self._optimiseItemBgap(item) + self._optimiseItemVgap(item) + o.vgap + o.bgap),
bottom: this._optimiseGap(bottom[i] + this._optimiseItemBgap(item) + this._optimiseItemVgap(item) + o.vgap + o.bgap),
});
if (rowSize === "fill") {
return true;
}
});
},
}
mounted: function () {
mounted() {
if (window.ResizeObserver) {
this.resizeObserver = new window.ResizeObserver(this._handleResize.bind(this));
this.resizeObserver.observe(this.element[0]);
@ -103,23 +112,22 @@ BI.AutoVerticalTapeLayout = BI.inherit(BI.Layout, {
this.mutationObserver.observe(this.element[0], {
attributes: true,
childList: true,
subtree: true
subtree: true,
});
}
this._handleResize();
},
}
destroyed: function () {
destroyed() {
this.resizeObserver && this.resizeObserver.unobserve(this.element[0]);
this.mutationObserver && this.mutationObserver.disconnect();
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
this.layout.populate.apply(this.layout, arguments);
populate(...args) {
this.layout.populate(...args);
}
});
BI.shortcut("bi.vtape_auto", BI.AutoVerticalTapeLayout);
}

9
src/core/wrapper/layout/fill/fill.horizontal.js

@ -1,6 +1,9 @@
import { shortcut } from "@/core/decorator";
/**
* 横向填满布局
*/
BI.HorizontalFillLayout = function () {
};
BI.shortcut("bi.horizontal_fill", BI.HorizontalFillLayout);
@shortcut()
export class HorizontalFillLayout {
static xtype = "bi.horizontal_fill";
}

9
src/core/wrapper/layout/fill/fill.vertical.js

@ -1,6 +1,9 @@
import { shortcut } from "@/core/decorator";
/**
* 纵向填满布局
*/
BI.VerticalFillLayout = function () {
};
BI.shortcut("bi.vertical_fill", BI.VerticalFillLayout);
@shortcut()
export class VerticalFillLayout {
static xtype = "bi.vertical_fill";
}

147
src/core/wrapper/layout/fill/float.fill.horizontal.js

@ -1,9 +1,18 @@
BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatHorizontalFillLayout.superclass.props.apply(this, arguments), {
import { shortcut } from "@/core/decorator";
import { extend, any, isEmptyObject, isNull, backAny, isFunction, compact, each } from "@/core/2.base";
import { _lazyCreateWidget } from "@/core/5.inject";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
@shortcut()
export class FloatHorizontalFillLayout extends Layout {
static xtype = "bi.horizontal_float_fill";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-h-float-fill clearfix",
horizontalAlign: BI.HorizontalAlign.Stretch,
verticalAlign: BI.VerticalAlign.Stretch,
horizontalAlign: HorizontalAlign.Stretch,
verticalAlign: VerticalAlign.Stretch,
hgap: 0,
vgap: 0,
lgap: 0,
@ -11,134 +20,136 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
tgap: 0,
bgap: 0,
columnSize: [],
items: []
items: [],
});
},
render: function () {
BI.FloatHorizontalFillLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}
render() {
super.render(...arguments);
const o = this.options;
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
this.populate(newValue);
}) : o.items;
this.populate(items);
},
}
addItem: function (item) {
addItem(item) {
// do nothing
throw new Error("不能添加子组件");
},
}
stroke: function (items) {
var self = this, o = this.options;
items = BI.compact(items);
var rank = 0;
stroke(items) {
const o = this.options;
items = compact(items);
let rank = 0;
function createWidget (i, item, desc) {
if (o.verticalAlign !== BI.VerticalAlign.Stretch) {
var w = BI._lazyCreateWidget({
const createWidget = (i, item, desc) => {
let w;
if (o.verticalAlign !== VerticalAlign.Stretch) {
w = _lazyCreateWidget({
type: "bi.vertical_adapt",
horizontalAlign: BI.HorizontalAlign.Stretch,
horizontalAlign: HorizontalAlign.Stretch,
verticalAlign: o.verticalAlign,
columnSize: ["fill"],
items: [item]
items: [item],
});
} else {
var w = BI._lazyCreateWidget(item);
w = _lazyCreateWidget(item);
}
if (o.vgap + o.tgap + self._optimiseItemTgap(item) + self._optimiseItemVgap(item) !== 0) {
if (o.vgap + o.tgap + this._optimiseItemTgap(item) + this._optimiseItemVgap(item) !== 0) {
w.element.css({
"margin-top": self._optimiseGap(o.vgap + o.tgap + self._optimiseItemTgap(item) + self._optimiseItemVgap(item))
"margin-top": this._optimiseGap(o.vgap + o.tgap + this._optimiseItemTgap(item) + this._optimiseItemVgap(item)),
});
}
if (desc) {
if (o.hgap + o.rgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item) !== 0) {
if (o.hgap + o.rgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item) !== 0) {
w.element.css({
"margin-right": self._optimiseGap((i === o.items.length - 1 ? o.hgap : 0) + o.rgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item))
"margin-right": this._optimiseGap((i === o.items.length - 1 ? o.hgap : 0) + o.rgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item)),
});
}
if (o.hgap + o.lgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item) !== 0) {
if (o.hgap + o.lgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item) !== 0) {
w.element.css({
"margin-left": self._optimiseGap(o.hgap + o.lgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item))
"margin-left": this._optimiseGap(o.hgap + o.lgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item)),
});
}
} else {
if (o.hgap + o.lgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item) !== 0) {
if (o.hgap + o.lgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item) !== 0) {
w.element.css({
"margin-left": self._optimiseGap((i === 0 ? o.hgap : 0) + o.lgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item))
"margin-left": this._optimiseGap((i === 0 ? o.hgap : 0) + o.lgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item)),
});
}
if (o.hgap + o.rgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item) !== 0) {
if (o.hgap + o.rgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item) !== 0) {
w.element.css({
"margin-right": self._optimiseGap(o.hgap + o.rgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item))
"margin-right": this._optimiseGap(o.hgap + o.rgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item)),
});
}
}
if (o.vgap + o.bgap + self._optimiseItemBgap(item) + self._optimiseItemVgap(item) !== 0) {
if (o.vgap + o.bgap + this._optimiseItemBgap(item) + this._optimiseItemVgap(item) !== 0) {
w.element.css({
"margin-bottom": self._optimiseGap(o.vgap + o.bgap + self._optimiseItemBgap(item) + self._optimiseItemVgap(item))
"margin-bottom": this._optimiseGap(o.vgap + o.bgap + this._optimiseItemBgap(item) + this._optimiseItemVgap(item)),
});
}
var top = o.vgap + o.tgap + self._optimiseItemTgap(item) + self._optimiseItemVgap(item),
bottom = o.vgap + o.bgap + self._optimiseItemBgap(item) + self._optimiseItemVgap(item);
if (o.verticalAlign === BI.VerticalAlign.Stretch && BI.isNull(item.height)) {
const top = o.vgap + o.tgap + this._optimiseItemTgap(item) + this._optimiseItemVgap(item),
bottom = o.vgap + o.bgap + this._optimiseItemBgap(item) + this._optimiseItemVgap(item);
if (o.verticalAlign === VerticalAlign.Stretch && isNull(item.height)) {
w.element.css({
height: "calc(100% - " + self._optimiseGap(top + bottom) + ")"
height: `calc(100% - ${this._optimiseGap(top + bottom)})`,
});
}
w.element.css({
position: "relative"
position: "relative",
});
return w;
}
};
BI.any(items, function (i, item) {
if (BI.isEmptyObject(item)) {
any(items, (i, item) => {
if (isEmptyObject(item)) {
return true;
}
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
const columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (columnSize === "fill") {
return true;
}
var w = createWidget(i, item);
self.addWidget(self._getChildName(rank++), w);
const w = createWidget(i, item);
this.addWidget(this._getChildName(rank++), w);
w.element.css({
float: "left"
"float": "left",
});
});
BI.backAny(items, function (i, item) {
if (BI.isEmptyObject(item)) {
backAny(items, (i, item) => {
if (isEmptyObject(item)) {
return true;
}
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
const columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (columnSize === "fill") {
return true;
}
var w = createWidget(i, item, true);
self.addWidget(self._getChildName(rank++), w);
const w = createWidget(i, item, true);
this.addWidget(this._getChildName(rank++), w);
w.element.css({
float: "right"
"float": "right",
});
});
BI.each(items, function (i, item) {
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
each(items, (i, item) => {
const columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (columnSize === "fill") {
var w = createWidget(i, item);
self.addWidget(self._getChildName(rank++), w);
const w = createWidget(i, item);
this.addWidget(this._getChildName(rank++), w);
}
});
},
}
resize: function () {
resize() {
// console.log("填充布局不需要resize");
},
}
update: function (opt) {
update(opt) {
return this.forceUpdate(opt);
},
}
populate: function (items) {
BI.FloatHorizontalFillLayout.superclass.populate.apply(this, arguments);
populate(...args) {
super.populate(...args);
this._mount();
}
});
BI.shortcut("bi.horizontal_float_fill", BI.FloatHorizontalFillLayout);
}

4
src/core/wrapper/layout/fill/index.js

@ -0,0 +1,4 @@
export { AutoVerticalTapeLayout } from "./auto.vtape";
export { HorizontalFillLayout } from "./fill.horizontal";
export { VerticalFillLayout } from "./fill.vertical";
export { FloatHorizontalFillLayout } from "./float.fill.horizontal";

49
src/core/wrapper/layout/flex/flex.center.js

@ -1,30 +1,40 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexCenterLayout
* @extends BI.Layout
* @class FlexCenterLayout
* @extends Layout
*/
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexCenterLayout extends Layout {
static xtype = "bi.flex_center_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-c",
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: VerticalAlign.Middle,
horizontalAlign: HorizontalAlign.Center,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
@ -39,16 +49,15 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
bgap: o.bgap,
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);
}

55
src/core/wrapper/layout/flex/flex.horizontal.center.js

@ -1,15 +1,23 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
* @class FlexHorizontalCenter
* @extends Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexHorizontalCenter extends Layout {
static xtype = "bi.flex_horizontal_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-h-c",
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Center,
verticalAlign: VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
@ -17,15 +25,17 @@ BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
@ -40,17 +50,20 @@ BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
bgap: o.bgap,
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_center_adapt", BI.FlexHorizontalCenter);
}
@shortcut()
export class FlexHorizontalCenterAdapt extends FlexHorizontalCenter {
static xtype = "bi.flex_horizontal_center_adapt";
}

72
src/core/wrapper/layout/flex/flex.horizontal.js

@ -1,16 +1,24 @@
import { shortcut } from "@/core/decorator";
import { extend, isFunction, some } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
* @class FlexHorizontalLayout
* @extends Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexHorizontalLayout extends Layout {
static xtype = "bi.flex_horizontal";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-h",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left, // 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
verticalAlign: VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Left, // 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -18,52 +26,54 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
}
render() {
super.render(...arguments);
const o = this.options;
this.element.addClass(`v-${o.verticalAlign}`).addClass(`h-${o.horizontalAlign}`);
if (o.scrollable === true || o.scrollx === true) {
this.element.addClass("f-scroll-x");
}
if (o.scrollable === true || o.scrolly === true) {
this.element.addClass("f-scroll-y");
}
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
this.populate(newValue);
}) : o.items;
this.populate(items);
},
}
_hasFill: function () {
var o = this.options;
_hasFill() {
const o = this.options;
if (o.columnSize.length > 0) {
return o.columnSize.indexOf("fill") >= 0 || o.columnSize.indexOf("auto") >= 0;
}
return BI.some(o.items, function (i, item) {
return some(o.items, (i, item) => {
if (item.width === "fill" || item.width === "auto") {
return true;
}
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
_addElement(i, item) {
const o = this.options;
const w = super._addElement(...arguments);
let columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (o.columnSize.length > 0) {
if (item.width >= 1 && o.columnSize[i] >= 1 && o.columnSize[i] !== item.width) {
columnSize = null;
}
}
w.element.css({
position: "relative"
position: "relative",
});
if (columnSize !== "auto") {
if (columnSize === "fill" || columnSize === "") {
if (o.horizontalAlign !== BI.HorizontalAlign.Stretch) {
if (o.horizontalAlign !== HorizontalAlign.Stretch) {
if (o.scrollable === true || o.scrollx === true) {
w.element.addClass("f-s-n");
}
@ -93,12 +103,12 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
w.element.addClass("l-c");
}
this._handleGap(w, item, i);
return w;
},
}
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
populate(...args) {
super.populate(...args);
this._mount();
}
});
BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);
}

96
src/core/wrapper/layout/flex/flex.leftrightvertical.center.js

@ -1,6 +1,13 @@
BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexLeftRightVerticalAdaptLayout.superclass.props.apply(this, arguments), {
import { shortcut } from "@/core/decorator";
import { extend, isArray, each, map, stripEL } from "@/core/2.base";
import { Layout } from "../../layout";
@shortcut()
export class FlexLeftRightVerticalAdaptLayout extends Layout {
static xtype = "bi.flex_left_right_vertical_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-lr-v-c",
columnSize: [],
items: {},
@ -15,33 +22,35 @@ BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
rhgap: 0,
rtgap: 0,
rbgap: 0,
rvgap: 0
rvgap: 0,
});
},
render: function () {
var o = this.options, self = this;
BI.FlexLeftRightVerticalAdaptLayout.superclass.render.apply(this, arguments);
var items = this._formatItems(o.items);
}
render() {
const o = this.options;
super.render(...arguments);
const items = this._formatItems(o.items);
return {
type: "bi.flex_vertical_adapt",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
columnSize: o.columnSize.slice(0, (o.items.left || []).length).concat((o.items.right || []).length > 0 ? [""] : []),
items: items,
items,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
innerHgap: o.innerHgap,
innerVgap: o.innerVgap
innerVgap: o.innerVgap,
};
},
}
_formatItems: function (items) {
var self = this, o = this.options;
var left, right;
if (BI.isArray(items)) {
BI.each(items, function (i, item) {
_formatItems(items) {
const o = this.options;
let left, right;
if (isArray(items)) {
each(items, (i, item) => {
if (item.left) {
left = item.left;
}
@ -50,32 +59,34 @@ BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
}
});
}
var leftItems = left || items.left || [];
var rightItems = right || items.right || [];
leftItems = BI.map(leftItems, function (i, item) {
var json = {
el: BI.stripEL(item)
let leftItems = left || items.left || [];
const rightItems = right || items.right || [];
leftItems = map(leftItems, (i, item) => {
const json = {
el: stripEL(item),
};
if (o.lvgap + o.ltgap + self._optimiseItemTgap(item) + self._optimiseItemVgap(item) !== 0) {
json.tgap = o.lvgap + o.ltgap + self._optimiseItemTgap(item) + self._optimiseItemVgap(item);
if (o.lvgap + o.ltgap + this._optimiseItemTgap(item) + this._optimiseItemVgap(item) !== 0) {
json.tgap = o.lvgap + o.ltgap + this._optimiseItemTgap(item) + this._optimiseItemVgap(item);
}
if (o.lhgap + o.llgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.lhgap : 0) + o.llgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item);
if (o.lhgap + o.llgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.lhgap : 0) + o.llgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item);
}
if (o.lhgap + o.lrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item) !== 0) {
json.rgap = o.lhgap + o.lrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item);
if (o.lhgap + o.lrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item) !== 0) {
json.rgap = o.lhgap + o.lrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item);
}
if (o.lvgap + o.lbgap + self._optimiseItemBgap(item) + self._optimiseItemVgap(item) !== 0) {
json.bgap = o.lvgap + o.lbgap + self._optimiseItemBgap(item) + self._optimiseItemVgap(item);
if (o.lvgap + o.lbgap + this._optimiseItemBgap(item) + this._optimiseItemVgap(item) !== 0) {
json.bgap = o.lvgap + o.lbgap + this._optimiseItemBgap(item) + this._optimiseItemVgap(item);
}
return json;
});
return leftItems.concat({
el: {
type: "bi.flex_vertical_adapt",
columnSize: o.columnSize.slice(leftItems.length),
css: {
"margin-left": "auto"
"margin-left": "auto",
},
hgap: o.rhgap,
vgap: o.rvgap,
@ -83,22 +94,21 @@ BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
rgap: o.rrgap,
tgap: o.rtgap,
bgap: o.rbgap,
items: rightItems
}
items: rightItems,
},
});
},
}
resize: function () {
resize() {
this.layout.stroke(this._formatItems(this.options.items));
},
}
addItem: function () {
addItem() {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
populate(items) {
this.layout.populate(this._formatItems(items));
}
});
BI.shortcut("bi.flex_left_right_vertical_adapt", BI.FlexLeftRightVerticalAdaptLayout);
}

55
src/core/wrapper/layout/flex/flex.vertical.center.js

@ -1,16 +1,24 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
* @class FlexVerticalCenter
* @extends Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexVerticalCenter extends Layout {
static xtype = "bi.flex_vertical_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-v-c",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: HorizontalAlign.Left,
verticalAlign: VerticalAlign.Middle,
columnSize: [],
scrollx: false,
hgap: 0,
@ -18,15 +26,17 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
verticalAlign: o.verticalAlign,
horizontalAlign: o.horizontalAlign,
@ -41,17 +51,20 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
hgap: o.hgap,
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);
}
@shortcut()
export class FlexVerticalCenterAdapt extends FlexVerticalCenter {
static xtype = "bi.flex_vertical_center_adapt"
}

68
src/core/wrapper/layout/flex/flex.vertical.js

@ -1,15 +1,21 @@
import { shortcut } from "@/core/decorator";
import { extend, isFunction, some } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
* @class FlexVerticalLayout
* @extends Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexVerticalLayout extends Layout {
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-v",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Left,
verticalAlign: VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
@ -17,52 +23,54 @@ BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
}
render() {
super.render(...arguments);
const self = this, o = this.options;
this.element.addClass(`h-${o.horizontalAlign}`).addClass(`v-${o.verticalAlign}`);
if (o.scrollable === true || o.scrollx === true) {
this.element.addClass("f-scroll-x");
}
if (o.scrollable === true || o.scrolly === true) {
this.element.addClass("f-scroll-y");
}
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
self.populate(newValue);
}) : o.items;
this.populate(items);
},
}
_hasFill: function () {
var o = this.options;
_hasFill() {
const o = this.options;
if (o.rowSize.length > 0) {
return o.rowSize.indexOf("fill") >= 0 || o.rowSize.indexOf("auto") >= 0;
}
return BI.some(o.items, function (i, item) {
return some(o.items, (i, item) => {
if (item.height === "fill" || item.height === "auto") {
return true;
}
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
_addElement(i, item) {
const o = this.options;
const w = super._addElement.apply(this, arguments);
let rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (o.rowSize.length > 0) {
if (item.height >= 1 && o.rowSize[i] >= 1 && o.rowSize[i] !== item.height) {
rowSize = null;
}
}
w.element.css({
position: "relative"
position: "relative",
});
if (rowSize !== "auto") {
if (rowSize === "fill" || rowSize === "") {
if (o.verticalAlign !== BI.VerticalAlign.Stretch) {
if (o.verticalAlign !== VerticalAlign.Stretch) {
if (o.scrollable === true || o.scrolly === true) {
w.element.addClass("f-s-n");
}
@ -92,12 +100,12 @@ BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
w.element.addClass("l-c");
}
this._handleGap(w, item, null, i);
return w;
},
}
populate: function (items) {
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
populate(items) {
super.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);
}

7
src/core/wrapper/layout/flex/index.js

@ -0,0 +1,7 @@
export { FlexCenterLayout } from "./flex.center";
export { FlexHorizontalCenter, FlexHorizontalCenterAdapt } from "./flex.horizontal.center";
export { FlexHorizontalLayout } from "./flex.horizontal";
export { FlexLeftRightVerticalAdaptLayout } from "./flex.leftrightvertical.center";
export { FlexVerticalCenter, FlexVerticalCenterAdapt } from "./flex.vertical.center";
export { FlexVerticalLayout } from "./flex.vertical";
export * from "./wrapper";

49
src/core/wrapper/layout/flex/wrapper/flex.wrapper.center.js

@ -1,16 +1,24 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "@/core/wrapper/layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperCenterLayout
* @extends BI.Layout
* @class FlexWrapperCenterLayout
* @extends Layout
*/
BI.FlexWrapperCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexWrapperCenterLayout extends Layout {
static xtype = "bi.flex_scrollable_center_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-s-c",
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: HorizontalAlign.Center,
verticalAlign: VerticalAlign.Middle,
columnSize: [],
scrollx: false,
scrollable: true,
@ -19,15 +27,17 @@ BI.FlexWrapperCenterLayout = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_scrollable_horizontal",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
@ -40,16 +50,15 @@ BI.FlexWrapperCenterLayout = BI.inherit(BI.Layout, {
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_scrollable_center_adapt", BI.FlexWrapperCenterLayout);
}

55
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.center.js

@ -1,16 +1,24 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "@/core/wrapper/layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
* @class FlexVerticalCenter
* @extends Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexWrapperHorizontalCenter extends Layout {
static xtype = "bi.flex_scrollable_horizontal_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-s-v-c",
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Center,
verticalAlign: VerticalAlign.Top,
rowSize: [],
scrollable: true,
scrolly: false,
@ -19,15 +27,17 @@ BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_scrollable_vertical",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
@ -40,17 +50,20 @@ BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
vgap: o.vgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_scrollable_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_scrollable_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);
}
@shortcut()
export class FlexWrapperHorizontalCenterAdapt extends FlexWrapperHorizontalCenter {
static xtype = "bi.flex_scrollable_horizontal_center_adapt";
}

83
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js

@ -1,16 +1,25 @@
import { shortcut } from "@/core/decorator";
import { extend, isFunction, some } from "@/core/2.base";
import { Widget } from "@/core/4.widget";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "@/core/wrapper/layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
* @class FlexHorizontalLayout
* @extends Layout
*/
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexWrapperHorizontalLayout extends Layout {
static xtype = "bi.flex_scrollable_horizontal";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-s-h",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Left,
columnSize: [],
scrollable: null,
scrollx: true,
@ -19,47 +28,49 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("f-s-h-w v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}
render() {
super.render(...arguments);
const o = this.options;
this.element.addClass(`v-${o.verticalAlign}`).addClass(`h-${o.horizontalAlign}`);
this.$wrapper = Widget._renderEngine.createElement("<div>").addClass(`f-s-h-w v-${o.verticalAlign}`).addClass(`h-${o.horizontalAlign}`);
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
this.populate(newValue);
}) : o.items;
this.populate(items);
},
}
_hasFill: function () {
var o = this.options;
_hasFill() {
const o = this.options;
if (o.columnSize.length > 0) {
return o.columnSize.indexOf("fill") >= 0 || o.columnSize.indexOf("auto") >= 0;
}
return BI.some(o.items, function (i, item) {
return some(o.items, (i, item) => {
if (item.width === "fill" || item.width === "auto") {
return true;
}
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
_addElement(i, item) {
const o = this.options;
const w = super._addElement(...arguments);
let columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (o.columnSize.length > 0) {
if (item.width >= 1 && o.columnSize[i] >= 1 && o.columnSize[i] !== item.width) {
columnSize = null;
}
}
w.element.css({
position: "relative"
position: "relative",
});
if (columnSize !== "auto") {
if (columnSize === "fill" || columnSize === "") {
if (o.horizontalAlign !== BI.HorizontalAlign.Stretch) {
if (o.horizontalAlign !== HorizontalAlign.Stretch) {
if (o.scrollable === true || o.scrollx === true) {
w.element.addClass("f-s-n");
}
@ -91,21 +102,21 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
w.element.addClass("l-c");
}
this._handleGap(w, item, i);
return w;
},
}
appendFragment: function (frag) {
appendFragment(frag) {
this.$wrapper.append(frag);
this.element.append(this.$wrapper);
},
}
_getWrapper: function () {
_getWrapper() {
return this.$wrapper;
},
}
populate: function (items) {
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
populate(items) {
super.populate(...arguments);
this._mount();
}
});
BI.shortcut("bi.flex_scrollable_horizontal", BI.FlexWrapperHorizontalLayout);
}

55
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.center.js

@ -1,16 +1,24 @@
import { shortcut } from "@/core/decorator";
import { extend } from "@/core/2.base";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "@/core/wrapper/layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
* @class FlexVerticalCenter
* @extends Layout
*/
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexWrapperVerticalCenter extends Layout {
static xtype = "bi.flex_scrollable_vertical_adapt";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-s-v-c",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: HorizontalAlign.Left,
verticalAlign: VerticalAlign.Middle,
columnSize: [],
scrollx: false,
scrollable: true,
@ -19,15 +27,17 @@ BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
var self = this, o = this.options;
}
render() {
const o = this.options;
return {
type: "bi.flex_scrollable_horizontal",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
verticalAlign: o.verticalAlign,
horizontalAlign: o.horizontalAlign,
@ -40,17 +50,20 @@ BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
items: o.items
items: o.items,
};
},
}
resize: function () {
resize() {
this.layout.resize();
},
}
populate: function (items) {
populate(items) {
this.layout.populate(items);
}
});
BI.shortcut("bi.flex_scrollable_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_scrollable_vertical_center_adapt", BI.FlexWrapperVerticalCenter);
}
@shortcut()
export class FlexWrapperVerticalCenterAdapt extends FlexWrapperVerticalCenter {
static xtype = "bi.flex_scrollable_vertical_center_adapt";
}

83
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js

@ -1,16 +1,25 @@
import { shortcut } from "@/core/decorator";
import { extend, isFunction, some } from "@/core/2.base";
import { Widget } from "@/core/4.widget";
import { HorizontalAlign, VerticalAlign } from "@/core/constant";
import { Layout } from "@/core/wrapper/layout";
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
* @class FlexWrapperVerticalLayout
* @extends Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FlexWrapperVerticalLayout extends Layout {
static xtype = "bi.flex_scrollable_vertical";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-f-s-v",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Left,
verticalAlign: VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
@ -19,47 +28,49 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("f-s-v-w h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}
render() {
super.render(...arguments);
const o = this.options;
this.element.addClass(`v-${o.verticalAlign}`).addClass(`h-${o.horizontalAlign}`);
this.$wrapper = Widget._renderEngine.createElement("<div>").addClass(`f-s-v-w h-${o.horizontalAlign}`).addClass(`v-${o.verticalAlign}`);
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
this.populate(newValue);
}) : o.items;
this.populate(items);
},
}
_hasFill: function () {
var o = this.options;
_hasFill() {
const o = this.options;
if (o.rowSize.length > 0) {
return o.rowSize.indexOf("fill") >= 0 || o.rowSize.indexOf("auto") >= 0;
}
return BI.some(o.items, function (i, item) {
return some(o.items, (i, item) => {
if (item.height === "fill" || item.height === "auto") {
return true;
}
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
var rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
_addElement(i, item) {
const o = this.options;
const w = super._addElement(...arguments);
let rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (o.rowSize.length > 0) {
if (item.height >= 1 && o.rowSize[i] >= 1 && o.rowSize[i] !== item.height) {
rowSize = null;
}
}
w.element.css({
position: "relative"
position: "relative",
});
if (rowSize !== "auto") {
if (rowSize === "fill" || rowSize === "") {
if (o.verticalAlign !== BI.VerticalAlign.Stretch) {
if (o.verticalAlign !== VerticalAlign.Stretch) {
if (o.scrollable === true || o.scrolly === true) {
w.element.addClass("f-s-n");
}
@ -91,21 +102,21 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
w.element.addClass("l-c");
}
this._handleGap(w, item, null, i);
return w;
},
}
appendFragment: function (frag) {
appendFragment(frag) {
this.$wrapper.append(frag);
this.element.append(this.$wrapper);
},
}
_getWrapper: function () {
_getWrapper() {
return this.$wrapper;
},
}
populate: function (items) {
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
populate(items) {
super.populate(...arguments);
this._mount();
}
});
BI.shortcut("bi.flex_scrollable_vertical", BI.FlexWrapperVerticalLayout);
}

5
src/core/wrapper/layout/flex/wrapper/index.js

@ -0,0 +1,5 @@
export { FlexWrapperCenterLayout } from "./flex.wrapper.center";
export { FlexWrapperHorizontalCenter, FlexWrapperHorizontalCenterAdapt } from "./flex.wrapper.horizontal.center";
export { FlexWrapperHorizontalLayout } from "./flex.wrapper.horizontal";
export { FlexWrapperVerticalCenter, FlexWrapperVerticalCenterAdapt } from "./flex.wrapper.vertical.center";
export { FlexWrapperVerticalLayout } from "./flex.wrapper.vertical";

46
src/core/wrapper/layout/float/float.absolute.center.js

@ -1,36 +1,42 @@
import { shortcut } from "@/core/decorator";
import { extend, isFunction } from "@/core/2.base";
import { Layout } from "../../layout";
/**
* absolute实现的居中布局
* @class BI.FloatAbsoluteCenterLayout
* @extends BI.Layout
* @class FloatAbsoluteCenterLayout
* @extends Layout
*/
BI.FloatAbsoluteCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatAbsoluteCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FloatAbsoluteCenterLayout extends Layout {
static xtype = "bi.absolute_center_float";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-abs-c-fl",
});
},
}
render: function () {
BI.FloatAbsoluteCenterLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
render() {
super.render(...arguments);
const o = this.options;
const items = isFunction(o.items) ? this.__watch(o.items, (context, newValue) => {
this.populate(newValue);
}) : o.items;
this.populate(items);
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.FloatAbsoluteCenterLayout.superclass._addElement.apply(this, arguments);
_addElement(i, item) {
const w = super._addElement(...arguments);
w.element.addClass("bi-abs-c-item").css({
position: "absolute",
});
return w;
},
}
populate: function (items) {
BI.FloatAbsoluteCenterLayout.superclass.populate.apply(this, arguments);
populate(items) {
super.populate(...arguments);
this._mount();
}
});
BI.shortcut("bi.absolute_center_float", BI.FloatAbsoluteCenterLayout);
}

66
src/core/wrapper/layout/float/float.absolute.horizontal.js

@ -1,23 +1,32 @@
import { shortcut } from "@/core/decorator";
import { extend, map, isEmptyObject, stripEL, isWidget } from "@/core/2.base";
import { HorizontalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
* absolute实现的居中布局
* @class BI.FloatAbsoluteHorizontalLayout
* @extends BI.Layout
* @class FloatAbsoluteHorizontalLayout
* @extends Layout
*/
BI.FloatAbsoluteHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatAbsoluteHorizontalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FloatAbsoluteHorizontalLayout extends Layout {
static xtype = "bi.absolute_horizontal_float";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-abs-h-fl",
horizontalAlign: BI.HorizontalAlign.Center,
horizontalAlign: HorizontalAlign.Center,
rowSize: [],
vgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
}
render() {
const o = this.options;
super.render(...arguments);
render: function () {
var self = this, o = this.options;
BI.FloatAbsoluteHorizontalLayout.superclass.render.apply(this, arguments);
return {
type: "bi.vtape",
horizontalAlign: o.horizontalAlign,
@ -26,8 +35,8 @@ BI.FloatAbsoluteHorizontalLayout = BI.inherit(BI.Layout, {
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
hgap: "50%",
vgap: o.vgap,
@ -39,34 +48,35 @@ BI.FloatAbsoluteHorizontalLayout = BI.inherit(BI.Layout, {
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
};
},
}
_formatItems: function (items) {
var o = this.options;
if (o.horizontalAlign === BI.HorizontalAlign.Left) {
_formatItems(items) {
const o = this.options;
if (o.horizontalAlign === HorizontalAlign.Left) {
return items;
}
var cls = o.horizontalAlign === BI.HorizontalAlign.Right ? "bi-abs-r-x-item" : "bi-abs-c-x-item";
return BI.map(items, function (i, item) {
if (!item || BI.isEmptyObject(item)) {
const cls = o.horizontalAlign === HorizontalAlign.Right ? "bi-abs-r-x-item" : "bi-abs-c-x-item";
return map(items, (i, item) => {
if (!item || isEmptyObject(item)) {
return item;
}
var el = BI.stripEL(item);
if (BI.isWidget(el)) {
const el = stripEL(item);
if (isWidget(el)) {
el.element.addClass(cls);
} else {
el.cls = (el.cls || "") + cls;
}
return item;
});
},
}
resize: function () {
resize() {
this.layout.stroke(this._formatItems(this.options.items));
},
}
populate: function (items) {
populate(items) {
this.layout.populate(this._formatItems(items));
}
});
BI.shortcut("bi.absolute_horizontal_float", BI.FloatAbsoluteHorizontalLayout);
}

178
src/core/wrapper/layout/float/float.absolute.leftrightvertical.js

@ -1,8 +1,16 @@
BI.FloatAbsoluteLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatAbsoluteLeftRightVerticalAdaptLayout.superclass.props.apply(this, arguments), {
import { shortcut } from "@/core/decorator";
import { extend, map, isEmptyObject, stripEL, isWidget, isArray, each } from "@/core/2.base";
import { VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
@shortcut()
export class FloatAbsoluteLeftRightVerticalAdaptLayout extends Layout {
static xtype = "bi.absolute_left_right_vertical_float";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-abs-lr-v-fl",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: VerticalAlign.Middle,
items: {},
llgap: 0,
lrgap: 0,
@ -15,16 +23,18 @@ BI.FloatAbsoluteLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
rhgap: 0,
rtgap: 0,
rbgap: 0,
rvgap: 0
rvgap: 0,
});
},
render: function () {
var o = this.options, self = this;
BI.FloatAbsoluteLeftRightVerticalAdaptLayout.superclass.render.apply(this, arguments);
}
render() {
const o = this.options;
super.render(...arguments);
return {
type: "bi.htape",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
verticalAlign: o.verticalAlign,
items: this._formatItems(o.items),
@ -33,15 +43,15 @@ BI.FloatAbsoluteLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
innerVgap: o.innerVgap,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable
scrollable: o.scrollable,
};
},
}
_formatItems: function (items) {
var self = this, o = this.options;
var left, right;
if (BI.isArray(items)) {
BI.each(items, function (i, item) {
_formatItems(items) {
const o = this.options;
let left, right;
if (isArray(items)) {
each(items, (i, item) => {
if (item.left) {
left = item.left;
}
@ -50,98 +60,105 @@ BI.FloatAbsoluteLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
}
});
}
var leftItems = left || items.left || [];
var rightItems = right || items.right || [];
leftItems = BI.map(leftItems, function (i, item) {
var el = BI.stripEL(item);
if (o.verticalAlign === BI.VerticalAlign.Middle) {
if (BI.isWidget(el)) {
let leftItems = left || items.left || [];
let rightItems = right || items.right || [];
leftItems = map(leftItems, (i, item) => {
const el = stripEL(item);
if (o.verticalAlign === VerticalAlign.Middle) {
if (isWidget(el)) {
el.element.addClass("bi-abs-c-y-item");
} else {
el.cls = (el.cls || "") + "bi-abs-c-y-item";
el.cls = `${el.cls || ""}bi-abs-c-y-item`;
}
}
var json = {
el: el,
width: item.width
const json = {
el,
width: item.width,
};
// if (o.lvgap + o.ltgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
// json.tgap = o.lvgap + o.ltgap + (item.tgap || 0) + (item.vgap || 0);
// }
if (o.lhgap + o.llgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.lhgap : 0) + o.llgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item);
if (o.lhgap + o.llgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.lhgap : 0) + o.llgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item);
}
if (o.lhgap + o.lrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item) !== 0) {
json.rgap = o.lhgap + o.lrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item);
if (o.lhgap + o.lrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item) !== 0) {
json.rgap = o.lhgap + o.lrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item);
}
// if (o.lvgap + o.lbgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
// json.bgap = o.lvgap + o.lbgap + (item.bgap || 0) + (item.vgap || 0);
// }
return json;
});
rightItems = BI.map(rightItems, function (i, item) {
var el = BI.stripEL(item);
if (o.verticalAlign === BI.VerticalAlign.Middle) {
if (BI.isWidget(el)) {
rightItems = map(rightItems, (i, item) => {
const el = stripEL(item);
if (o.verticalAlign === VerticalAlign.Middle) {
if (isWidget(el)) {
el.element.addClass("bi-abs-c-y-item");
} else {
el.cls = (el.cls || "") + "bi-abs-c-y-item";
el.cls = `${el.cls || ""}bi-abs-c-y-item`;
}
}
var json = {
el: el,
width: item.width
const json = {
el,
width: item.width,
};
// if (o.rvgap + o.rtgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
// json.tgap = o.rvgap + o.rtgap + (item.tgap || 0) + (item.vgap || 0);
// }
if (o.rhgap + o.rlgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.rhgap : 0) + o.rlgap + self._optimiseItemLgap(item) + self._optimiseItemHgap(item);
if (o.rhgap + o.rlgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item) !== 0) {
json.lgap = (i === 0 ? o.rhgap : 0) + o.rlgap + this._optimiseItemLgap(item) + this._optimiseItemHgap(item);
}
if (o.rhgap + o.rrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item) !== 0) {
json.rgap = o.rhgap + o.rrgap + self._optimiseItemRgap(item) + self._optimiseItemHgap(item);
if (o.rhgap + o.rrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item) !== 0) {
json.rgap = o.rhgap + o.rrgap + this._optimiseItemRgap(item) + this._optimiseItemHgap(item);
}
// if (o.rvgap + o.rbgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
// json.bgap = o.rvgap + o.rbgap + (item.bgap || 0) + (item.vgap || 0);
// }
return json;
});
return leftItems.concat({}, rightItems);
},
}
resize: function () {
resize() {
this.layout.stroke(this._formatItems(this.options.items));
},
}
addItem: function () {
addItem() {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
populate(items) {
this.layout.populate(this._formatItems(items));
}
});
BI.shortcut("bi.absolute_left_right_vertical_float", BI.FloatAbsoluteLeftRightVerticalAdaptLayout);
}
@shortcut()
export class FloatAbsoluteRightVerticalAdaptLayout extends Layout {
static xtype = "bi.absolute_right_vertical_float";
BI.FloatAbsoluteRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatAbsoluteRightVerticalAdaptLayout.superclass.props.apply(this, arguments), {
props() {
return extend(super.props(...arguments), {
baseCls: "bi-abs-r-v-fl",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: VerticalAlign.Middle,
items: [],
lgap: 0,
rgap: 0,
hgap: 0
hgap: 0,
});
},
render: function () {
var o = this.options, self = this;
BI.FloatAbsoluteRightVerticalAdaptLayout.superclass.render.apply(this, arguments);
}
render() {
const o = this.options;
super.render(...arguments);
return {
type: "bi.htape",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
verticalAlign: o.verticalAlign,
items: [{}].concat(this._formatItems(o.items)),
@ -151,39 +168,40 @@ BI.FloatAbsoluteRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
vgap: "50%",
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable
scrollable: o.scrollable,
};
},
}
_formatItems: function (items) {
if (this.options.verticalAlign !== BI.VerticalAlign.Middle) {
_formatItems(items) {
if (this.options.verticalAlign !== VerticalAlign.Middle) {
return items;
}
return BI.map(items, function (i, item) {
if (!item || BI.isEmptyObject(item)) {
return map(items, (i, item) => {
if (!item || isEmptyObject(item)) {
return item;
}
var el = BI.stripEL(item);
if (BI.isWidget(el)) {
const el = stripEL(item);
if (isWidget(el)) {
el.element.addClass("bi-abs-c-y-item");
} else {
el.cls = (el.cls || "") + "bi-abs-c-y-item";
el.cls = `${el.cls || ""}bi-abs-c-y-item`;
}
return item;
});
},
}
resize: function () {
resize() {
this.layout.stroke([{}].concat(this._formatItems(this.options.items)));
},
}
addItem: function () {
addItem() {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
populate(items) {
this.layout.populate([{}].concat(this._formatItems(items)));
}
});
BI.shortcut("bi.absolute_right_vertical_float", BI.FloatAbsoluteRightVerticalAdaptLayout);
}

66
src/core/wrapper/layout/float/float.absolute.vertical.js

@ -1,23 +1,32 @@
import { shortcut } from "@/core/decorator";
import { extend, map, isEmptyObject, stripEL, isWidget } from "@/core/2.base";
import { VerticalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
* absolute实现的居中布局
* @class BI.FloatAbsoluteVerticalLayout
* @extends BI.Layout
* @class FloatAbsoluteVerticalLayout
* @extends Layout
*/
BI.FloatAbsoluteVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatAbsoluteVerticalLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FloatAbsoluteVerticalLayout extends Layout {
static xtype = "bi.absolute_vertical_float";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-abs-h-fl",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: VerticalAlign.Middle,
columnSize: [],
hgap: 0,
lgap: 0,
rgap: 0
rgap: 0,
});
},
}
render() {
const o = this.options;
super.render(...arguments);
render: function () {
var self = this, o = this.options;
BI.FloatAbsoluteVerticalLayout.superclass.render.apply(this, arguments);
return {
type: "bi.htape",
verticalAlign: o.verticalAlign,
@ -26,8 +35,8 @@ BI.FloatAbsoluteVerticalLayout = BI.inherit(BI.Layout, {
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
vgap: "50%",
hgap: o.hgap,
@ -39,34 +48,35 @@ BI.FloatAbsoluteVerticalLayout = BI.inherit(BI.Layout, {
innerHgap: o.innerHgap,
innerVgap: o.innerVgap,
};
},
}
_formatItems: function (items) {
var o = this.options;
if (o.verticalAlign === BI.VerticalAlign.Top) {
_formatItems(items) {
const o = this.options;
if (o.verticalAlign === VerticalAlign.Top) {
return items;
}
var cls = o.verticalAlign === BI.VerticalAlign.Bottom ? "bi-abs-b-y-item" : "bi-abs-c-y-item";
return BI.map(items, function (i, item) {
if (!item || BI.isEmptyObject(item)) {
const cls = o.verticalAlign === VerticalAlign.Bottom ? "bi-abs-b-y-item" : "bi-abs-c-y-item";
return map(items, (i, item) => {
if (!item || isEmptyObject(item)) {
return item;
}
var el = BI.stripEL(item);
if (BI.isWidget(el)) {
const el = stripEL(item);
if (isWidget(el)) {
el.element.addClass(cls);
} else {
el.cls = (el.cls || "") + cls;
}
return item;
});
},
}
resize: function () {
resize() {
this.layout.stroke(this._formatItems(this.options.items));
},
}
populate: function (items) {
populate(items) {
this.layout.populate(this._formatItems(items));
}
});
BI.shortcut("bi.absolute_vertical_float", BI.FloatAbsoluteVerticalLayout);
}

68
src/core/wrapper/layout/float/float.horizontal.js

@ -1,30 +1,37 @@
import { shortcut } from "@/core/decorator";
import { extend, map } from "@/core/2.base";
import { VerticalAlign, HorizontalAlign } from "@/core/constant";
import { Layout } from "../../layout";
/**
* 浮动的水平居中布局
*/
BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
@shortcut()
export class FloatHorizontalLayout extends Layout {
static xtype = "bi.horizontal_float";
props: function () {
return BI.extend(BI.InlineHorizontalAdaptLayout.superclass.props.apply(this, arguments), {
props() {
return extend(super.props(...arguments), {
baseCls: "bi-h-fl",
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: HorizontalAlign.Center,
verticalAlign: VerticalAlign.Top,
rowSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
}
render: function () {
var self = this, o = this.options;
if (o.verticalAlign === BI.VerticalAlign.Top) {
render() {
const o = this.options;
if (o.verticalAlign === VerticalAlign.Top) {
return {
type: "bi.vertical",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
items: this._formatItems(o.items),
vgap: o.vgap,
@ -32,22 +39,23 @@ BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
bgap: o.bgap,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable
scrollable: o.scrollable,
};
}
return {
type: "bi.inline",
items: [{
el: {
type: "bi.vertical",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
items: this._formatItems(o.items),
vgap: o.vgap,
tgap: o.tgap,
bgap: o.bgap
}
bgap: o.bgap,
},
}],
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
@ -55,13 +63,14 @@ BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
innerVgap: o.innerVgap,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable
scrollable: o.scrollable,
};
},
}
_formatItems: function (items) {
var o = this.options;
return BI.map(items, function (i, item) {
_formatItems(items) {
const o = this.options;
return map(items, (i, item) => {
return {
el: {
type: "bi.inline_horizontal_adapt",
@ -69,18 +78,17 @@ BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
items: [item],
hgap: o.hgap,
lgap: o.lgap,
rgap: o.rgap
}
rgap: o.rgap,
},
};
});
},
}
resize: function () {
resize() {
this.layout.stroke(this._formatItems(this.options.items));
},
}
populate: function (items) {
populate(items) {
this.layout.populate(this._formatItems(items));
}
});
BI.shortcut("bi.horizontal_float", BI.FloatHorizontalLayout);
}

5
src/core/wrapper/layout/float/index.js

@ -0,0 +1,5 @@
export { FloatAbsoluteCenterLayout } from "./float.absolute.center";
export { FloatAbsoluteHorizontalLayout } from "./float.absolute.horizontal";
export { FloatAbsoluteLeftRightVerticalAdaptLayout, FloatAbsoluteRightVerticalAdaptLayout } from "./float.absolute.leftrightvertical";
export { FloatAbsoluteVerticalLayout } from "./float.absolute.vertical";
export { FloatHorizontalLayout } from "./float.horizontal";

6
src/core/wrapper/layout/index.js

@ -15,3 +15,9 @@ export { TdLayout } from "./layout.td";
export { VerticalLayout } from "./layout.vertical";
export { WindowLayout } from "./layout.window";
export * from "./adapt";
export * from "./fill";
export * from "./flex";
export * from "./float";
export * from "./middle";
export * from "./responsive";
export * from "./sticky";

4
src/core/wrapper/layout/middle/index.js

@ -0,0 +1,4 @@
export { CenterLayout } from "./middle.center";
export { FloatCenterLayout } from "./middle.float.center";
export { HorizontalCenterLayout } from "./middle.horizontal";
export { VerticalCenterLayout } from "./middle.vertical";

76
src/core/wrapper/layout/middle/middle.center.js

@ -1,72 +1,80 @@
import { shortcut } from "@/core/decorator";
import { extend, each } from "@/core/2.base";
import { _lazyCreateWidget } from "@/core/5.inject";
import { Layout } from "../../layout";
/**
* 水平和垂直方向都居中容器, 非自适应用于宽度高度固定的面板
* @class BI.CenterLayout
* @extends BI.Layout
* @class CenterLayout
* @extends Layout
*/
BI.CenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.CenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class CenterLayout extends Layout {
static xtype = "bi.center";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-center",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
}
render: function () {
BI.CenterLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options;
var list = [], items = o.items;
BI.each(items, function (i) {
render() {
super.render(...arguments);
const o = this.options;
const list = [], items = o.items;
each(items, i => {
list.push({
column: i,
row: 0,
el: BI._lazyCreateWidget({
el: _lazyCreateWidget({
type: "bi.default",
cls: "center-element " + (i === 0 ? "first-element " : "") + (i === items.length - 1 ? "last-element" : "")
})
cls: `center-element ${i === 0 ? "first-element " : ""}${i === items.length - 1 ? "last-element" : ""}`,
}),
});
});
BI.each(items, function (i, item) {
each(items, (i, item) => {
if (item) {
var w = BI._lazyCreateWidget(item);
const w = _lazyCreateWidget(item);
w.element.css({
position: "absolute",
left: self._optimiseGap(o.hgap + o.lgap),
right: self._optimiseGap(o.hgap + o.rgap),
top: self._optimiseGap(o.vgap + o.tgap),
bottom: self._optimiseGap(o.vgap + o.bgap),
left: this._optimiseGap(o.hgap + o.lgap),
right: this._optimiseGap(o.hgap + o.rgap),
top: this._optimiseGap(o.vgap + o.tgap),
bottom: this._optimiseGap(o.vgap + o.bgap),
width: "auto",
height: "auto"
height: "auto",
});
list[i].el.addItem(w);
}
});
return {
type: "bi.grid",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
columns: list.length,
rows: 1,
items: list
items: list,
};
},
}
resize: function () {
resize() {
// console.log("center布局不需要resize");
},
}
addItem: function (item) {
addItem(item) {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
this.layout.populate.apply(this.layout, arguments);
populate(items) {
this.layout.populate(...arguments);
}
});
BI.shortcut("bi.center", BI.CenterLayout);
}

83
src/core/wrapper/layout/middle/middle.float.center.js

@ -1,71 +1,80 @@
import { shortcut } from "@/core/decorator";
import { extend, each } from "@/core/2.base";
import { _lazyCreateWidget } from "@/core/5.inject";
import { Layout } from "../../layout";
/**
* 浮动布局实现的居中容器
* @class BI.FloatCenterLayout
* @extends BI.Layout
* @class FloatCenterLayout
* @extends Layout
*/
BI.FloatCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class FloatCenterLayout extends Layout {
static xtype = "bi.float_center";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-float-center",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.FloatCenterLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options, items = o.items;
var list = [], width = 100 / items.length;
BI.each(items, function (i) {
var widget = BI._lazyCreateWidget({
type: "bi.default"
}
render() {
super.render(...arguments);
const o = this.options, items = o.items;
const list = [], width = 100 / items.length;
each(items, i => {
const widget = _lazyCreateWidget({
type: "bi.default",
});
widget.element.addClass("center-element " + (i === 0 ? "first-element " : "") + (i === items.length - 1 ? "last-element" : "")).css({
width: width + "%",
height: "100%"
widget.element.addClass(`center-element ${i === 0 ? "first-element " : ""}${i === items.length - 1 ? "last-element" : ""}`).css({
width: `${width}%`,
height: "100%",
});
list.push({
el: widget
el: widget,
});
});
BI.each(items, function (i, item) {
each(items, (i, item) => {
if (item) {
var w = BI._lazyCreateWidget(item);
const w = _lazyCreateWidget(item);
w.element.css({
position: "absolute",
left: self._optimiseGap(o.hgap + o.lgap),
right: self._optimiseGap(o.hgap + o.rgap),
top: self._optimiseGap(o.vgap + o.tgap),
bottom: self._optimiseGap(o.vgap + o.bgap),
left: this._optimiseGap(o.hgap + o.lgap),
right: this._optimiseGap(o.hgap + o.rgap),
top: this._optimiseGap(o.vgap + o.tgap),
bottom: this._optimiseGap(o.vgap + o.bgap),
width: "auto",
height: "auto"
height: "auto",
});
list[i].el.addItem(w);
}
});
return {
type: "bi.left",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
items: list
items: list,
};
},
}
resize: function () {
resize() {
// console.log("floatcenter布局不需要resize");
},
}
addItem: function (item) {
addItem(item) {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
this.layout.populate.apply(this.layout, arguments);
populate(items) {
this.layout.populate(...arguments);
}
});
BI.shortcut("bi.float_center", BI.FloatCenterLayout);
}

77
src/core/wrapper/layout/middle/middle.horizontal.js

@ -1,70 +1,79 @@
import { shortcut } from "@/core/decorator";
import { extend, each } from "@/core/2.base";
import { _lazyCreateWidget } from "@/core/5.inject";
import { Layout } from "../../layout";
/**
* 水平和垂直方向都居中容器, 非自适应用于宽度高度固定的面板
* @class BI.HorizontalCenterLayout
* @extends BI.Layout
* @class HorizontalCenterLayout
* @extends Layout
*/
BI.HorizontalCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.HorizontalCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class HorizontalCenterLayout extends Layout {
static xtype = "bi.horizontal_center";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-h-center",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
render: function () {
BI.HorizontalCenterLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options, items = o.items;
var list = [];
BI.each(items, function (i) {
}
render() {
super.render(...arguments);
const o = this.options, items = o.items;
const list = [];
each(items, i => {
list.push({
column: i,
row: 0,
el: BI._lazyCreateWidget({
el: _lazyCreateWidget({
type: "bi.default",
cls: "center-element " + (i === 0 ? "first-element " : "") + (i === items.length - 1 ? "last-element" : "")
})
cls: `center-element ${i === 0 ? "first-element " : ""}${i === items.length - 1 ? "last-element" : ""}`,
}),
});
});
BI.each(items, function (i, item) {
each(items, (i, item) => {
if (item) {
var w = BI._lazyCreateWidget(item);
const w = _lazyCreateWidget(item);
w.element.css({
position: "absolute",
left: self._optimiseGap(o.hgap + o.lgap),
right: self._optimiseGap(o.hgap + o.rgap),
top: self._optimiseGap(o.vgap + o.tgap),
bottom: self._optimiseGap(o.vgap + o.bgap),
width: "auto"
left: this._optimiseGap(o.hgap + o.lgap),
right: this._optimiseGap(o.hgap + o.rgap),
top: this._optimiseGap(o.vgap + o.tgap),
bottom: this._optimiseGap(o.vgap + o.bgap),
width: "auto",
});
list[i].el.addItem(w);
}
});
return {
type: "bi.grid",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
columns: list.length,
rows: 1,
items: list
items: list,
};
},
}
resize: function () {
resize() {
// console.log("horizontal_center布局不需要resize");
},
}
addItem: function (item) {
addItem(item) {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
this.layout.populate.apply(this.layout, arguments);
populate(items) {
this.layout.populate(...arguments);
}
});
BI.shortcut("bi.horizontal_center", BI.HorizontalCenterLayout);
}

68
src/core/wrapper/layout/middle/middle.vertical.js

@ -1,71 +1,79 @@
import { shortcut } from "@/core/decorator";
import { extend, each } from "@/core/2.base";
import { _lazyCreateWidget } from "@/core/5.inject";
import { Layout } from "../../layout";
/**
* 垂直方向都居中容器, 非自适应用于高度不固定的面板
* @class BI.VerticalCenterLayout
* @extends BI.Layout
* @class VerticalCenterLayout
* @extends Layout
*/
BI.VerticalCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.VerticalCenterLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class VerticalCenterLayout extends Layout {
static xtype = "bi.vertical_center";
props() {
return extend(super.props(...arguments), {
baseCls: "bi-v-center",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
bgap: 0,
});
},
}
render: function () {
BI.VerticalCenterLayout.superclass.render.apply(this, arguments);
var self = this, o = this.options, items = o.items;
var list = [];
BI.each(items, function (i) {
render() {
super.render(...arguments);
const self = this, o = this.options, items = o.items;
const list = [];
each(items, i => {
list.push({
column: 0,
row: i,
el: BI._lazyCreateWidget({
el: _lazyCreateWidget({
type: "bi.default",
cls: "center-element " + (i === 0 ? "first-element " : "") + (i === items.length - 1 ? "last-element" : "")
})
cls: `center-element ${i === 0 ? "first-element " : ""}${i === items.length - 1 ? "last-element" : ""}`,
}),
});
});
BI.each(items, function (i, item) {
each(items, (i, item) => {
if (item) {
var w = BI._lazyCreateWidget(item);
const w = _lazyCreateWidget(item);
w.element.css({
position: "absolute",
left: self._optimiseGap(o.hgap + o.lgap),
right: self._optimiseGap(o.hgap + o.rgap),
top: self._optimiseGap(o.vgap + o.tgap),
bottom: self._optimiseGap(o.vgap + o.bgap),
height: "auto"
height: "auto",
});
list[i].el.addItem(w);
}
});
return {
type: "bi.grid",
ref: function (_ref) {
self.layout = _ref;
ref: _ref => {
this.layout = _ref;
},
columns: 1,
rows: list.length,
items: list
items: list,
};
},
}
resize: function () {
resize() {
// console.log("vertical_center布局不需要resize");
},
}
addItem: function (item) {
addItem(item) {
// do nothing
throw new Error("不能添加子组件");
},
}
populate: function (items) {
this.layout.populate.apply(this.layout, arguments);
populate(items) {
this.layout.populate(...arguments);
}
});
BI.shortcut("bi.vertical_center", BI.VerticalCenterLayout);
}

3
src/core/wrapper/layout/responsive/index.js

@ -0,0 +1,3 @@
export { ResponsiveFlexHorizontalLayout } from "./responsive.flex.horizontal";
export { ResponsiveFlexWrapperHorizontalLayout } from "./responsive.flex.wrapper.horizontal";
export { ResponsiveInlineLayout } from "./responsive.inline";

68
src/core/wrapper/layout/responsive/responsive.flex.horizontal.js

@ -1,57 +1,59 @@
import { shortcut } from "@/core/decorator";
import { each } from "@/core/2.base";
import { HorizontalAlign } from "@/core/constant";
import { Resizers } from "@/base";
import { FlexHorizontalLayout } from "../flex";
/**
* 横向响应式布局
* Created by GUY on 2016/12/2.
*
* @class BI.ResponsiveFlexHorizontalLayout
* @extends BI.FlexHorizontalLayout
* @class ResponsiveFlexHorizontalLayout
* @extends FlexHorizontalLayout
*/
BI.ResponsiveFlexHorizontalLayout = BI.inherit(BI.FlexHorizontalLayout, {
// props: function () {
// return BI.extend(BI.ResponsiveFlexHorizontalLayout.superclass.props.apply(this, arguments), {
// // extraCls: "bi-responsive-f-h"
// });
// },
@shortcut()
export class ResponsiveFlexHorizontalLayout extends FlexHorizontalLayout {
static xtype = "bi.responsive_flex_horizontal";
mounted: function () {
var self = this, o = this.options;
if (o.horizontalAlign !== BI.HorizontalAlign.Center){
mounted() {
const o = this.options;
if (o.horizontalAlign !== HorizontalAlign.Center) {
return;
}
var defaultResize = function () {
const defaultResize = () => {
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth <= 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
self._handleReverseGap(child, o.items[i], i | 0);
each(this._children, (i, child) => {
this._clearGap(child);
this._handleReverseGap(child, o.items[i], i | 0);
});
self.element.css("flex-direction", "column");
this.element.css("flex-direction", "column");
}
}
}
}
var resize = function () {
};
const resize = () => {
defaultResize();
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth > 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
})
self.resize();
self.element.css("flex-direction", "row");
each(this._children, (i, child) => {
this._clearGap(child);
});
this.resize();
this.element.css("flex-direction", "row");
}
}
}
}
this.unResize = BI.Resizers.add(this.getName(), resize);
};
this.unResize = Resizers.add(this.getName(), resize);
defaultResize();
},
}
destroyed: function () {
destroyed() {
this.unResize?.();
}
});
BI.shortcut("bi.responsive_flex_horizontal", BI.ResponsiveFlexHorizontalLayout);
}

72
src/core/wrapper/layout/responsive/responsive.flex.wrapper.horizontal.js

@ -1,59 +1,61 @@
import { shortcut } from "@/core/decorator";
import { each } from "@/core/2.base";
import { HorizontalAlign } from "@/core/constant";
import { Resizers } from "@/base";
import { FlexWrapperHorizontalLayout } from "../flex";
/**
* 横向响应式布局
* Created by GUY on 2016/12/2.
*
* @class BI.ResponsiveFlexWrapperHorizontalLayout
* @extends BI.FlexWrapperHorizontalLayout
* @class ResponsiveFlexWrapperHorizontalLayout
* @extends FlexWrapperHorizontalLayout
*/
BI.ResponsiveFlexWrapperHorizontalLayout = BI.inherit(BI.FlexWrapperHorizontalLayout, {
// props: function () {
// return BI.extend(BI.ResponsiveFlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
// extraCls: "bi-responsive-f-h"
// });
// },
@shortcut()
export class ResponsiveFlexWrapperHorizontalLayout extends FlexWrapperHorizontalLayout {
static xtype = "bi.responsive_flex_scrollable_horizontal";
mounted: function () {
var self = this, o = this.options;
if (o.horizontalAlign !== BI.HorizontalAlign.Center){
mounted() {
const o = this.options;
if (o.horizontalAlign !== HorizontalAlign.Center) {
return;
}
var defaultResize = function () {
const defaultResize = () => {
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth <= 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
self._handleReverseGap(child, o.items[i], i | 0);
each(this._children, (i, child) => {
this._clearGap(child);
this._handleReverseGap(child, o.items[i], i | 0);
});
self.element.css("flex-direction", "column");
self.$wrapper.element.css("flex-direction", "column");
this.element.css("flex-direction", "column");
this.$wrapper.element.css("flex-direction", "column");
}
}
}
}
var resize = function () {
};
const resize = () => {
defaultResize();
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth > 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
})
self.resize();
self.element.css("flex-direction", "row");
self.$wrapper.element.css("flex-direction", "row");
each(this._children, (i, child) => {
this._clearGap(child);
});
this.resize();
this.element.css("flex-direction", "row");
this.$wrapper.element.css("flex-direction", "row");
}
}
}
}
this.unResize = BI.Resizers.add(this.getName(), resize);
};
this.unResize = Resizers.add(this.getName(), resize);
defaultResize();
},
}
destroyed: function () {
destroyed() {
this.unResize();
}
});
BI.shortcut("bi.responsive_flex_scrollable_horizontal", BI.ResponsiveFlexWrapperHorizontalLayout);
}

50
src/core/wrapper/layout/responsive/responsive.inline..js

@ -1,50 +0,0 @@
/**
* 横向响应式布局
* Created by GUY on 2016/12/2.
*
* @class BI.ResponsiveInlineLayout
* @extends BI.InlineLayout
*/
BI.ResponsiveInlineLayout = BI.inherit(BI.InlineLayout, {
mounted: function () {
var self = this, o = this.options;
if (o.horizontalAlign !== BI.HorizontalAlign.Center){
return;
}
var defaultResize = function () {
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
if (clientWidth <= 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
self._handleReverseGap(child, o.items[i], i | 0);
child.elemenet.css("display", "");
});
}
}
}
}
var resize = function () {
defaultResize();
if (o.scrollable !== true && o.scrollx !== true) {
var clientWidth = document.body.clientWidth;
if(self.element.width() > 2/3 * clientWidth){
if (clientWidth > 768) {
BI.each(self._children, function (i, child) {
self._clearGap(child);
})
self.resize();
}
}
}
}
this.unResize = BI.Resizers.add(this.getName(), resize);
defaultResize();
},
destroyed: function () {
this.unResize();
}
});
BI.shortcut("bi.responsive_inline", BI.ResponsiveInlineLayout);

58
src/core/wrapper/layout/responsive/responsive.inline.js

@ -0,0 +1,58 @@
import { shortcut } from "@/core/decorator";
import { each } from "@/core/2.base";
import { HorizontalAlign } from "@/core/constant";
import { Resizers } from "@/base";
import { InlineLayout } from "../layout.inline";
/**
* 横向响应式布局
* Created by GUY on 2016/12/2.
*
* @class ResponsiveInlineLayout
* @extends InlineLayout
*/
@shortcut()
export class ResponsiveInlineLayout extends InlineLayout {
static xtype = "bi.responsive_inline";
mounted() {
const o = this.options;
if (o.horizontalAlign !== HorizontalAlign.Center) {
return;
}
const defaultResize = () => {
if (o.scrollable !== true && o.scrollx !== true) {
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth <= 768) {
each(this._children, (i, child) => {
this._clearGap(child);
this._handleReverseGap(child, o.items[i], i | 0);
child.element.css("display", "");
});
}
}
}
};
const resize = () => {
defaultResize();
if (o.scrollable !== true && o.scrollx !== true) {
const clientWidth = document.body.clientWidth;
if (this.element.width() > 2 / 3 * clientWidth) {
if (clientWidth > 768) {
each(this._children, (i, child) => {
this._clearGap(child);
});
this.resize();
}
}
}
};
this.unResize = Resizers.add(this.getName(), resize);
defaultResize();
}
destroyed() {
this.unResize();
}
}

2
src/core/wrapper/layout/sticky/index.js

@ -0,0 +1,2 @@
export { HorizontalStickyLayout } from "./sticky.horizontal";
export { VerticalStickyLayout } from "./sticky.vertical";

42
src/core/wrapper/layout/sticky/sticky.horizontal.js

@ -1,29 +1,37 @@
import { shortcut } from "@/core/decorator";
import { extend, count, isNotNull } from "@/core/2.base";
import { VerticalAlign } from "@/core/constant";
import { FlexHorizontalLayout } from "../flex";
/**
* 横向黏性布局
*/
BI.HorizontalStickyLayout = BI.inherit(BI.FlexHorizontalLayout, {
props: function () {
return BI.extend(BI.HorizontalStickyLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class HorizontalStickyLayout extends FlexHorizontalLayout {
static xtype = "bi.horizontal_sticky";
props() {
return extend(super.props(...arguments), {
extraCls: "bi-h-sticky",
scrollx: true,
// horizontalAlign: BI.HorizontalAlign.Stretch,
verticalAlign: BI.VerticalAlign.Stretch
// horizontalAlign: HorizontalAlign.Stretch,
verticalAlign: VerticalAlign.Stretch,
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.HorizontalStickyLayout.superclass._addElement.apply(this, arguments);
var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
_addElement(i, item) {
const o = this.options;
const w = super._addElement(...arguments);
let columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
if (o.columnSize.length > 0) {
if (item.width >= 1 && o.columnSize[i] >= 1 && o.columnSize[i] !== item.width) {
columnSize = null;
}
}
if (columnSize !== "fill") {
var fillIndex;
BI.count(0, o.items.length, index => {
if (BI.isNotNull(fillIndex)) {
let fillIndex;
count(0, o.items.length, index => {
if (isNotNull(fillIndex)) {
return;
}
if ((o.columnSize[index] === "fill" || o.items[index].width === "fill")) {
@ -41,15 +49,15 @@ BI.HorizontalStickyLayout = BI.inherit(BI.FlexHorizontalLayout, {
w.element.css({
position: "sticky",
zIndex: 1,
right: 0
right: 0,
});
}
} else {
w.element.css({
overflow: ""
overflow: "",
});
}
return w;
}
});
BI.shortcut("bi.horizontal_sticky", BI.HorizontalStickyLayout);
}

42
src/core/wrapper/layout/sticky/sticky.vertical.js

@ -1,29 +1,37 @@
import { shortcut } from "@/core/decorator";
import { extend, count, isNotNull } from "@/core/2.base";
import { HorizontalAlign } from "@/core/constant";
import { FlexVerticalLayout } from "../flex";
/**
* 纵向黏性布局
*/
BI.VerticalStickyLayout = BI.inherit(BI.FlexVerticalLayout, {
props: function () {
return BI.extend(BI.VerticalStickyLayout.superclass.props.apply(this, arguments), {
@shortcut()
export class VerticalStickyLayout extends FlexVerticalLayout {
static xtype = "bi.vertical_sticky";
props() {
return extend(super.props(...arguments), {
extraCls: "bi-v-sticky",
scrolly: true,
horizontalAlign: BI.HorizontalAlign.Stretch,
// verticalAlign: BI.VerticalAlign.Stretch
horizontalAlign: HorizontalAlign.Stretch,
// verticalAlign: VerticalAlign.Stretch
});
},
}
_addElement: function (i, item) {
var o = this.options;
var w = BI.VerticalStickyLayout.superclass._addElement.apply(this, arguments);
var rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
_addElement(i, item) {
const o = this.options;
const w = super._addElement(...arguments);
let rowSize = o.rowSize.length > 0 ? o.rowSize[i] : item.height;
if (o.rowSize.length > 0) {
if (item.height >= 1 && o.rowSize[i] >= 1 && o.rowSize[i] !== item.height) {
rowSize = null;
}
}
if (rowSize !== "fill") {
var fillIndex;
BI.count(0, o.items.length, index => {
if (BI.isNotNull(fillIndex)) {
let fillIndex;
count(0, o.items.length, index => {
if (isNotNull(fillIndex)) {
return;
}
if ((o.rowSize[index] === "fill" || o.items[index].height === "fill")) {
@ -41,15 +49,15 @@ BI.VerticalStickyLayout = BI.inherit(BI.FlexVerticalLayout, {
w.element.css({
position: "sticky",
zIndex: 1,
bottom: 0
bottom: 0,
});
}
} else {
w.element.css({
overflow: ""
overflow: "",
});
}
return w;
}
});
BI.shortcut("bi.vertical_sticky", BI.VerticalStickyLayout);
}

Loading…
Cancel
Save