Browse Source

Pull request #3362: KERNEL-14071 case/trigger、loader、segment、toolbar

Merge in VISUAL/fineui from ~ZHENFEI.LI/fineui:es6 to es6

* commit 'd393c6a05e17cb9222e1690d4f6af861c82550ca':
  KERNEL-14081 refactor: case/loader、segment、toolbar
  KERNEL-14071 refactor: case/trigger的es6化
es6
Zhenfei.Li-李振飞 2 years ago
parent
commit
721c68796a
  1. 51
      es6.js
  2. 2
      src/base/single/trigger/trigger.js
  3. 15
      src/case/index.js
  4. 3
      src/case/loader/index.js
  5. 131
      src/case/loader/loader.lazy.js
  6. 188
      src/case/loader/loader.list.js
  7. 171
      src/case/loader/sort.list.js
  8. 49
      src/case/segment/button.segment.js
  9. 2
      src/case/segment/index.js
  10. 77
      src/case/segment/segment.js
  11. 134
      src/case/toolbar/toolbar.multiselect.js
  12. 8
      src/case/trigger/index.js
  13. 105
      src/case/trigger/trigger.editor.js
  14. 33
      src/case/trigger/trigger.icon.js
  15. 84
      src/case/trigger/trigger.icon.text.js
  16. 67
      src/case/trigger/trigger.icon.text.select.js
  17. 159
      src/case/trigger/trigger.text.js
  18. 102
      src/case/trigger/trigger.text.select.js
  19. 66
      src/case/trigger/trigger.text.select.small.js
  20. 64
      src/case/trigger/trigger.text.small.js
  21. 367
      src/core/platform/web/dom.js
  22. 3
      src/core/utils/color.js

51
es6.js

@ -92,27 +92,36 @@ async function handleFile(srcName) {
}); });
const target = [ const target = [
"isNull", "isNull",
"toPix", "toPix",
"isKey", "isKey",
"isObject", "isObject",
"map", "map",
"extend", "extend",
"isFunction", "isFunction",
"isEmptyArray", "isEmptyArray",
"isArray", "isArray",
"Controller", "Controller",
clzName, clzName,
"createWidget", "createWidget",
"Events", "Events",
"emptyFn", "emptyFn",
"nextTick", "nextTick",
"bind", "bind",
"i18nText", "i18nText",
"isNotNull", "isNotNull",
"isString", "isString",
"isNumber", "isNumber",
"isEmpty", "isEmpty",
"isEmptyString",
"any",
"deepContains",
"isNotEmptyString",
"each",
"contains",
"remove",
"createItems",
"makeArrayByArray",
]; ];
target.forEach(t => { target.forEach(t => {

2
src/base/single/trigger/trigger.js

@ -12,7 +12,7 @@ export class Trigger extends Single {
const conf = super._defaultConfig(...arguments); const conf = super._defaultConfig(...arguments);
return extend(conf, { return extend(conf, {
_baseCls: (conf._baseCls || "") + " bi-trigger cursor-pointer", _baseCls: `${conf._baseCls || ""} bi-trigger cursor-pointer`,
height: 24, height: 24,
}); });
} }

15
src/case/index.js

@ -2,16 +2,29 @@ import * as button from "./button";
import * as calendarItem from "./calendar"; import * as calendarItem from "./calendar";
import * as pager from "./pager"; import * as pager from "./pager";
import * as editor from "./editor"; import * as editor from "./editor";
import * as trigger from "./trigger";
import * as loader from "./loader";
import * as segment from "./segment";
import { MultiSelectBar } from "./toolbar/toolbar.multiselect";
Object.assign(BI, { Object.assign(BI, {
...button, ...button,
...calendarItem, ...calendarItem,
...pager, ...pager,
...editor, ...editor,
...trigger,
...loader,
...segment,
MultiSelectBar,
}); });
export * from "./button"; export * from "./button";
export * from "./calendar"; export * from "./calendar";
export * from "./pager"; export * from "./pager";
export * from "./editor"; export * from "./editor";
export * from "./trigger";
export * from "./loader";
export * from "./segment";
export {
MultiSelectBar
};

3
src/case/loader/index.js

@ -0,0 +1,3 @@
export { LazyLoader } from "./loader.lazy";
export { ListLoader } from "./loader.list";
export { SortList } from "./sort.list";

131
src/case/loader/loader.lazy.js

@ -1,103 +1,106 @@
/** import { shortcut, Widget, extend, createWidget, takeRight, take } from "@/core";
* Created by roy on 15/11/6. import { Loader } from "@/base";
*/
BI.LazyLoader = BI.inherit(BI.Widget, { @shortcut()
_const: { export class LazyLoader extends Widget {
PAGE: 100 static xtype = "bi.lazy_loader"
},
_defaultConfig: function () { _const = {
return BI.extend(BI.LazyLoader.superclass._defaultConfig.apply(this, arguments), { PAGE: 100,
};
static EVENT_CHANGE = "EVENT_CHANGE"
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-lazy-loader", baseCls: "bi-lazy-loader",
el: {}, el: {},
items: [] items: [],
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const o = this.options;
BI.LazyLoader.superclass._init.apply(this, arguments); super._init(...arguments);
var all = o.items.length; const all = o.items.length;
this.loader = BI.createWidget({ this.loader = createWidget({
type: "bi.loader", type: "bi.loader",
element: this, element: this,
// 下面是button_group的属性 // 下面是button_group的属性
el: o.el, el: o.el,
itemsCreator: (options, populate) => {
itemsCreator: function (options, populate) { populate(this._getNextItems(options));
populate(self._getNextItems(options));
}, },
hasNext: function (option) { hasNext: option => option.count < all,
return option.count < all;
}
}); });
this.loader.on(BI.Loader.EVENT_CHANGE, function (obj) { this.loader.on(Loader.EVENT_CHANGE, obj => {
self.fireEvent(BI.LazyLoader.EVENT_CHANGE, obj); this.fireEvent(LazyLoader.EVENT_CHANGE, obj);
}); });
}, }
_getNextItems: function (options) {
var self = this, o = this.options; _getNextItems(options) {
var lastNum = o.items.length - this._const.PAGE * (options.times - 1); const o = this.options;
var lastItems = BI.takeRight(o.items, lastNum); const lastNum = o.items.length - this._const.PAGE * (options.times - 1);
var nextItems = BI.take(lastItems, this._const.PAGE); const lastItems = takeRight(o.items, lastNum);
const nextItems = take(lastItems, this._const.PAGE);
return nextItems; return nextItems;
}, }
populate: function (items) { populate(items) {
this.loader.populate(items); this.loader.populate(items);
}, }
addItems: function (items) { addItems(items) {
this.loader.addItems(items); this.loader.addItems(items);
}, }
empty: function () { empty() {
this.loader.empty(); this.loader.empty();
}, }
setNotSelectedValue: function () { setNotSelectedValue() {
this.loader.setNotSelectedValue.apply(this.loader, arguments); this.loader.setNotSelectedValue(...arguments);
}, }
getNotSelectedValue: function () { getNotSelectedValue() {
return this.loader.getNotSelectedValue(); return this.loader.getNotSelectedValue();
}, }
setValue: function () { setValue() {
this.loader.setValue.apply(this.loader, arguments); this.loader.setValue(...arguments);
}, }
getValue: function () { getValue() {
return this.loader.getValue.apply(this.loader, arguments); return this.loader.getValue(...arguments);
}, }
getAllButtons: function () { getAllButtons() {
return this.loader.getAllButtons(); return this.loader.getAllButtons();
}, }
getAllLeaves: function () { getAllLeaves() {
return this.loader.getAllLeaves(); return this.loader.getAllLeaves();
}, }
getSelectedButtons: function () { getSelectedButtons() {
return this.loader.getSelectedButtons(); return this.loader.getSelectedButtons();
}, }
getNotSelectedButtons: function () { getNotSelectedButtons() {
return this.loader.getNotSelectedButtons(); return this.loader.getNotSelectedButtons();
}, }
getIndexByValue: function (value) { getIndexByValue(value) {
return this.loader.getIndexByValue(value); return this.loader.getIndexByValue(value);
}, }
getNodeById: function (id) { getNodeById(id) {
return this.loader.getNodeById(id); return this.loader.getNodeById(id);
}, }
getNodeByValue: function (value) { getNodeByValue(value) {
return this.loader.getNodeByValue(value); return this.loader.getNodeByValue(value);
} }
}); }
BI.LazyLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.lazy_loader", BI.LazyLoader);

188
src/case/loader/loader.list.js

@ -1,105 +1,112 @@
import { shortcut, Widget, extend, emptyFn, Controller, createWidget, Events, nextTick, bind, isEmpty, isNumber, isObject, isFunction, each, isNotEmptyArray, DOM } from "@/core";
/** /**
* 恶心的加载控件 为解决排序问题引入的控件 * 恶心的加载控件 为解决排序问题引入的控件
* *
* Created by GUY on 2015/11/12. * Created by GUY on 2015/11/12.
* @class BI.ListLoader * @class ListLoader
* @extends BI.Widget * @extends Widget
*/ */
BI.ListLoader = BI.inherit(BI.Widget, { @shortcut()
_defaultConfig: function () { export class ListLoader extends Widget {
return BI.extend(BI.ListLoader.superclass._defaultConfig.apply(this, arguments), { static xtype = "bi.list_loader"
baseCls: "bi-list-loader",
isDefaultInit: true, // 是否默认初始化数据 static EVENT_CHANGE = "EVENT_CHANGE"
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-list-loader",
isDefaultInit: true, // 是否默认初始化数据
// 下面是button_group的属性 // 下面是button_group的属性
el: { el: {
type: "bi.button_group" type: "bi.button_group",
}, },
items: [], items: [],
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
onLoaded: BI.emptyFn, onLoaded: emptyFn,
// 下面是分页信息 // 下面是分页信息
count: false, count: false,
next: {}, next: {},
hasNext: BI.emptyFn hasNext: emptyFn,
}); });
}, }
_nextLoad: function () { _nextLoad() {
var self = this, o = this.options; const o = this.options;
this.next.setLoading(); this.next.setLoading();
o.itemsCreator.apply(this, [{times: ++this.times}, function () { o.itemsCreator.apply(this, [{
self.next.setLoaded(); times: ++this.times,
self.addItems.apply(self, arguments); }, (...args) => {
this.next.setLoaded();
this.addItems(...args);
}]); }]);
}, }
_init: function () { _init() {
BI.ListLoader.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
if (o.itemsCreator === false) { if (o.itemsCreator === false) {
o.next = false; o.next = false;
} }
this.button_group = BI.createWidget(o.el, { this.button_group = createWidget(o.el, {
type: "bi.button_group", type: "bi.button_group",
element: this, element: this,
chooseType: 0, chooseType: 0,
items: o.items, items: o.items,
behaviors: {}, behaviors: {},
layouts: [{ layouts: [{
type: "bi.vertical" type: "bi.vertical",
}] }],
}); });
this.button_group.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) { this.button_group.on(Controller.EVENT_CHANGE, (...args) => {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); const [type, , obj] = args;
if (type === BI.Events.CLICK) { this.fireEvent(Controller.EVENT_CHANGE, ...args);
self.fireEvent(BI.ListLoader.EVENT_CHANGE, obj); if (type === Events.CLICK) {
this.fireEvent(ListLoader.EVENT_CHANGE, obj);
} }
}); });
if (o.next !== false) { if (o.next !== false) {
this.next = BI.createWidget(BI.extend({ this.next = createWidget(extend({
type: "bi.loading_bar" type: "bi.loading_bar",
}, o.next)); }, o.next));
this.next.on(BI.Controller.EVENT_CHANGE, function (type) { this.next.on(Controller.EVENT_CHANGE, type => {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
self._nextLoad(); this._nextLoad();
} }
}); });
} }
BI.createWidget({ createWidget({
type: "bi.vertical", type: "bi.vertical",
element: this, element: this,
items: [this.next] items: [this.next],
}); });
o.isDefaultInit && BI.isEmpty(o.items) && BI.nextTick(BI.bind(function () { o.isDefaultInit && isEmpty(o.items) && nextTick(bind(function () {
this.populate(); this.populate();
}, this)); }, this));
if (BI.isNotEmptyArray(o.items)) { if (isNotEmptyArray(o.items)) {
this.populate(o.items); this.populate(o.items);
} }
}, }
hasNext: function () { hasNext() {
var o = this.options; const o = this.options;
if (BI.isNumber(o.count)) { if (isNumber(o.count)) {
return this.count < o.count; return this.count < o.count;
} }
return !!o.hasNext.apply(this, [{ return !!o.hasNext.apply(this, [{
times: this.times, times: this.times,
count: this.count count: this.count,
}]); }]);
}, }
addItems: function (items) { addItems(items) {
this.count += items.length; this.count += items.length;
if (BI.isObject(this.next)) { if (isObject(this.next)) {
this.options.items = this.options.items.concat(items); this.options.items = this.options.items.concat(items);
if (this.hasNext()) { if (this.hasNext()) {
this.next.setLoaded(); this.next.setLoaded();
@ -107,90 +114,91 @@ BI.ListLoader = BI.inherit(BI.Widget, {
this.next.setEnd(); this.next.setEnd();
} }
} }
this.button_group.addItems.apply(this.button_group, arguments); this.button_group.addItems(...arguments);
this.next.element.appendTo(this.element); this.next.element.appendTo(this.element);
}, }
populate: function (items) { populate(items) {
var self = this, o = this.options; const o = this.options;
if (arguments.length === 0 && (BI.isFunction(o.itemsCreator))) { if (arguments.length === 0 && (isFunction(o.itemsCreator))) {
o.itemsCreator.apply(this, [{times: 1}, function () { o.itemsCreator.apply(this, [{
if (arguments.length === 0) { times: 1,
}, (...args) => {
if (args.length === 0) {
throw new Error("参数不能为空"); throw new Error("参数不能为空");
} }
self.populate.apply(self, arguments); this.populate(...args);
o.onLoaded(); o.onLoaded();
}]); }]);
return; return;
} }
this.options.items = items; this.options.items = items;
this.times = 1; this.times = 1;
this.count = 0; this.count = 0;
this.count += items.length; this.count += items.length;
if (BI.isObject(this.next)) { if (isObject(this.next)) {
if (this.hasNext()) { if (this.hasNext()) {
this.next.setLoaded(); this.next.setLoaded();
} else { } else {
this.next.invisible(); this.next.invisible();
} }
} }
BI.DOM.hang([this.next]); DOM.hang([this.next]);
this.button_group.populate.apply(this.button_group, arguments); this.button_group.populate(...arguments);
this.next.element.appendTo(this.element); this.next.element.appendTo(this.element);
}, }
empty: function () { empty() {
BI.DOM.hang([this.next]); DOM.hang([this.next]);
this.button_group.empty(); this.button_group.empty();
this.next.element.appendTo(this.element); this.next.element.appendTo(this.element);
BI.each([this.next], function (i, ob) { each([this.next], (i, ob) => {
ob && ob.setVisible(false); ob && ob.setVisible(false);
}); });
}, }
setNotSelectedValue: function () { setNotSelectedValue() {
this.button_group.setNotSelectedValue.apply(this.button_group, arguments); this.button_group.setNotSelectedValue(...arguments);
}, }
getNotSelectedValue: function () { getNotSelectedValue() {
return this.button_group.getNotSelectedValue(); return this.button_group.getNotSelectedValue();
}, }
setValue: function () { setValue() {
this.button_group.setValue.apply(this.button_group, arguments); this.button_group.setValue(...arguments);
}, }
getValue: function () { getValue() {
return this.button_group.getValue.apply(this.button_group, arguments); return this.button_group.getValue(...arguments);
}, }
getAllButtons: function () { getAllButtons() {
return this.button_group.getAllButtons(); return this.button_group.getAllButtons();
}, }
getAllLeaves: function () { getAllLeaves() {
return this.button_group.getAllLeaves(); return this.button_group.getAllLeaves();
}, }
getSelectedButtons: function () { getSelectedButtons() {
return this.button_group.getSelectedButtons(); return this.button_group.getSelectedButtons();
}, }
getNotSelectedButtons: function () { getNotSelectedButtons() {
return this.button_group.getNotSelectedButtons(); return this.button_group.getNotSelectedButtons();
}, }
getIndexByValue: function (value) { getIndexByValue(value) {
return this.button_group.getIndexByValue(value); return this.button_group.getIndexByValue(value);
}, }
getNodeById: function (id) { getNodeById(id) {
return this.button_group.getNodeById(id); return this.button_group.getNodeById(id);
}, }
getNodeByValue: function (value) { getNodeByValue(value) {
return this.button_group.getNodeByValue(value); return this.button_group.getNodeByValue(value);
} }
}); }
BI.ListLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.list_loader", BI.ListLoader);

171
src/case/loader/sort.list.js

@ -1,58 +1,61 @@
import { shortcut, Widget, extend, emptyFn, Controller, createWidget, Events, each, stripEL } from "@/core";
/** /**
* Created by GUY on 2016/4/29. * Created by GUY on 2016/4/29.
* *
* @class BI.SortList * @class SortList
* @extends BI.Widget * @extends Widget
*/ */
BI.SortList = BI.inherit(BI.Widget, { @shortcut()
_defaultConfig: function () { export class SortList extends Widget {
return BI.extend(BI.SortList.superclass._defaultConfig.apply(this, arguments), { static xtype = "bi.sort_list"
baseCls: "bi-sort-list",
isDefaultInit: true, // 是否默认初始化数据 static EVENT_CHANGE = "EVENT_CHANGE"
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-sort-list",
isDefaultInit: true, // 是否默认初始化数据
// 下面是button_group的属性 // 下面是button_group的属性
el: { el: {
type: "bi.button_group" type: "bi.button_group",
}, },
items: [], items: [],
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
onLoaded: BI.emptyFn, onLoaded: emptyFn,
// 下面是分页信息 // 下面是分页信息
count: false, count: false,
next: {}, next: {},
hasNext: BI.emptyFn hasNext: emptyFn,
// containment: this.element, // containment: this.element,
// connectWith: ".bi-sort-list", // connectWith: ".bi-sort-list",
}); });
}, }
_init: function () { _init() {
BI.SortList.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
this.loader = BI.createWidget({ this.loader = createWidget({
type: "bi.list_loader", type: "bi.list_loader",
element: this, element: this,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
el: o.el, el: o.el,
items: this._formatItems(o.items), items: this._formatItems(o.items),
itemsCreator: function (op, callback) { itemsCreator (op, callback) {
o.itemsCreator(op, function (items) { o.itemsCreator(op, items => {
callback(self._formatItems(items)); callback(this._formatItems(items));
}); });
}, },
onLoaded: o.onLoaded, onLoaded: o.onLoaded,
count: o.count, count: o.count,
next: o.next, next: o.next,
hasNext: o.hasNext hasNext: o.hasNext,
}); });
this.loader.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) { this.loader.on(Controller.EVENT_CHANGE, (...args) => {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); const [type, value, obj] = args;
if (type === BI.Events.CLICK) { this.fireEvent(Controller.EVENT_CHANGE, ...args);
self.fireEvent(BI.SortList.EVENT_CHANGE, value, obj); if (type === Events.CLICK) {
this.fireEvent(SortList.EVENT_CHANGE, value, obj);
} }
}); });
@ -63,114 +66,116 @@ BI.SortList = BI.inherit(BI.Widget, {
cursor: o.cursor || "drag", cursor: o.cursor || "drag",
tolerance: o.tolerance || "intersect", tolerance: o.tolerance || "intersect",
placeholder: { placeholder: {
element: function ($currentItem) { element ($currentItem) {
var holder = BI.createWidget({ const holder = createWidget({
type: "bi.layout", type: "bi.layout",
cls: "bi-sortable-holder", cls: "bi-sortable-holder",
height: $currentItem.outerHeight() height: $currentItem.outerHeight(),
}); });
holder.element.css({ holder.element.css({
"margin-left": $currentItem.css("margin-left"), "margin-left": $currentItem.css("margin-left"),
"margin-right": $currentItem.css("margin-right"), "margin-right": $currentItem.css("margin-right"),
"margin-top": $currentItem.css("margin-top"), "margin-top": $currentItem.css("margin-top"),
"margin-bottom": $currentItem.css("margin-bottom"), "margin-bottom": $currentItem.css("margin-bottom"),
margin: $currentItem.css("margin") margin: $currentItem.css("margin"),
}); });
return holder.element; return holder.element;
}, },
update: function () { update () {
} },
}, },
start: function (event, ui) { start (event, ui) {
}, },
stop: function (event, ui) { stop: (event, ui) => {
self.fireEvent(BI.SortList.EVENT_CHANGE); this.fireEvent(SortList.EVENT_CHANGE);
}, },
over: function (event, ui) { over (event, ui) {
} },
}); });
}, }
_formatItems: function (items) { _formatItems(items) {
BI.each(items, function (i, item) { each(items, (i, item) => {
item = BI.stripEL(item); item = stripEL(item);
item.cls = item.cls ? item.cls + " sort-item" : "sort-item"; item.cls = item.cls ? `${item.cls} sort-item` : "sort-item";
item.attributes = { item.attributes = {
sorted: item.value sorted: item.value,
}; };
}); });
return items; return items;
}, }
hasNext: function () { hasNext() {
return this.loader.hasNext(); return this.loader.hasNext();
}, }
addItems: function (items) { addItems(items) {
this.loader.addItems(items); this.loader.addItems(items);
}, }
populate: function (items) { populate(items) {
if (items) { if (items) {
arguments[0] = this._formatItems(items); arguments[0] = this._formatItems(items);
} }
this.loader.populate.apply(this.loader, arguments); this.loader.populate(...arguments);
}, }
empty: function () { empty() {
this.loader.empty(); this.loader.empty();
}, }
setNotSelectedValue: function () { setNotSelectedValue() {
this.loader.setNotSelectedValue.apply(this.loader, arguments); this.loader.setNotSelectedValue(...arguments);
}, }
getNotSelectedValue: function () { getNotSelectedValue() {
return this.loader.getNotSelectedValue(); return this.loader.getNotSelectedValue();
}, }
setValue: function () { setValue() {
this.loader.setValue.apply(this.loader, arguments); this.loader.setValue(...arguments);
}, }
getValue: function () { getValue() {
return this.loader.getValue(); return this.loader.getValue();
}, }
getAllButtons: function () { getAllButtons() {
return this.loader.getAllButtons(); return this.loader.getAllButtons();
}, }
getAllLeaves: function () { getAllLeaves() {
return this.loader.getAllLeaves(); return this.loader.getAllLeaves();
}, }
getSelectedButtons: function () { getSelectedButtons() {
return this.loader.getSelectedButtons(); return this.loader.getSelectedButtons();
}, }
getNotSelectedButtons: function () { getNotSelectedButtons() {
return this.loader.getNotSelectedButtons(); return this.loader.getNotSelectedButtons();
}, }
getIndexByValue: function (value) { getIndexByValue(value) {
return this.loader.getIndexByValue(value); return this.loader.getIndexByValue(value);
}, }
getNodeById: function (id) { getNodeById(id) {
return this.loader.getNodeById(id); return this.loader.getNodeById(id);
}, }
getNodeByValue: function (value) { getNodeByValue(value) {
return this.loader.getNodeByValue(value); return this.loader.getNodeByValue(value);
}, }
getSortedValues: function () { getSortedValues() {
return this.loader.element.sortable("toArray", {attribute: "sorted"}); return this.loader.element.sortable("toArray", {
attribute: "sorted",
});
} }
}); }
BI.SortList.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.sort_list", BI.SortList);

49
src/case/segment/button.segment.js

@ -1,43 +1,48 @@
import { shortcut, extend, createWidget } from "@/core";
import { BasicButton } from "@/base";
/** /**
* 分段控件使用的button * 分段控件使用的button
* *
* Created by GUY on 2015/9/7. * Created by GUY on 2015/9/7.
* @class BI.SegmentButton * @class SegmentButton
* @extends BI.BasicButton * @extends BasicButton
*/ */
BI.SegmentButton = BI.inherit(BI.BasicButton, { @shortcut()
export class SegmentButton extends BasicButton {
static xtype = "bi.segment_button"
_defaultConfig: function () { _defaultConfig() {
var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments); const conf = super._defaultConfig(...arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select bi-card", return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-segment-button bi-list-item-select bi-card`,
shadow: true, shadow: true,
readonly: true, readonly: true,
hgap: 5 hgap: 5,
}); });
}, }
_init: function () { _init() {
BI.SegmentButton.superclass._init.apply(this, arguments); super._init(...arguments);
var opts = this.options, self = this; const opts = this.options;
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: "bi.label",
element: this, element: this,
textHeight: opts.height, textHeight: opts.height,
whiteSpace: opts.whiteSpace, whiteSpace: opts.whiteSpace,
text: opts.text, text: opts.text,
value: opts.value, value: opts.value,
hgap: opts.hgap hgap: opts.hgap,
}); });
}, }
setSelected: function () { setSelected() {
BI.SegmentButton.superclass.setSelected.apply(this, arguments); super.setSelected(...arguments);
}, }
setText: function (text) { setText(text) {
BI.SegmentButton.superclass.setText.apply(this, arguments); super.setText(...arguments);
this.text.setText(text); this.text.setText(text);
} }
}); }
BI.shortcut("bi.segment_button", BI.SegmentButton);

2
src/case/segment/index.js

@ -0,0 +1,2 @@
export { SegmentButton } from "./button.segment";
export { Segment } from "./segment";

77
src/case/segment/segment.js

@ -1,72 +1,79 @@
import { shortcut, Widget, extend, toPix, Controller, createWidget, createItems, makeArrayByArray } from "@/core";
import { ButtonGroup } from "@/base";
/** /**
* 单选按钮组 * 单选按钮组
* *
* Created by GUY on 2015/9/7. * Created by GUY on 2015/9/7.
* @class BI.Segment * @class Segment
* @extends BI.Widget * @extends Widget
*/ */
BI.Segment = BI.inherit(BI.Widget, { @shortcut()
_defaultConfig: function () { export class Segment extends Widget {
return BI.extend(BI.Segment.superclass._defaultConfig.apply(this, arguments), { static xtype = "bi.segment"
static EVENT_CHANGE = "EVENT_CHANGE"
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-segment", baseCls: "bi-segment",
items: [], items: [],
height: 24, height: 24,
}); });
}, }
_init: function () {
BI.Segment.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.buttonGroup = BI.createWidget({ const o = this.options;
this.buttonGroup = createWidget({
element: this, element: this,
type: "bi.button_group", type: "bi.button_group",
value: o.value, value: o.value,
items: [BI.createItems(o.items, { items: [createItems(o.items, {
type: "bi.segment_button", type: "bi.segment_button",
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
whiteSpace: o.whiteSpace, whiteSpace: o.whiteSpace,
})], })],
layouts: [{ layouts: [{
type: "bi.table", type: "bi.table",
columnSize: BI.makeArrayByArray(o.items, "fill"), columnSize: makeArrayByArray(o.items, "fill"),
}], }],
}); });
this.buttonGroup.on(BI.Controller.EVENT_CHANGE, function () { this.buttonGroup.on(Controller.EVENT_CHANGE, (...args) => {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); this.fireEvent(Controller.EVENT_CHANGE, ...args);
}); });
this.buttonGroup.on(BI.ButtonGroup.EVENT_CHANGE, function (value, obj) { this.buttonGroup.on(ButtonGroup.EVENT_CHANGE, (value, obj) => {
self.fireEvent(BI.Segment.EVENT_CHANGE, value, obj); this.fireEvent(Segment.EVENT_CHANGE, value, obj);
}); });
}, }
_setEnable: function (enable) { _setEnable(enable) {
BI.Segment.superclass._setEnable.apply(this, arguments); super._setEnable(...arguments);
if (enable === true) { if (enable === true) {
this.element.removeClass("base-disabled disabled"); this.element.removeClass("base-disabled disabled");
} else if (enable === false) { } else if (enable === false) {
this.element.addClass("base-disabled disabled"); this.element.addClass("base-disabled disabled");
} }
}, }
setValue: function (v) { setValue(v) {
this.buttonGroup.setValue(v); this.buttonGroup.setValue(v);
}, }
setEnabledValue: function (v) { setEnabledValue(v) {
this.buttonGroup.setEnabledValue(v); this.buttonGroup.setEnabledValue(v);
}, }
getValue: function () { getValue() {
return this.buttonGroup.getValue(); return this.buttonGroup.getValue();
}, }
populate: function (buttons) { populate(buttons) {
var o = this.options; const o = this.options;
this.buttonGroup.populate([BI.createItems(buttons, { this.buttonGroup.populate([createItems(buttons, {
type: "bi.segment_button", type: "bi.segment_button",
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
whiteSpace: o.whiteSpace, whiteSpace: o.whiteSpace,
})]); })]);
}, }
}); }
BI.Segment.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.segment", BI.Segment);

134
src/case/toolbar/toolbar.multiselect.js

@ -1,20 +1,29 @@
import { shortcut, extend, emptyFn, i18nText, Controller, createWidget, Events } from "@/core";
import { BasicButton, Checkbox } from "@/base";
import { HalfIconButton } from "../button";
/** /**
* guy * guy
* 复选导航条 * 复选导航条
* Created by GUY on 2015/8/25. * Created by GUY on 2015/8/25.
* @class BI.MultiSelectBar * @class MultiSelectBar
* @extends BI.BasicButton * @extends BasicButton
*/ */
BI.MultiSelectBar = BI.inherit(BI.BasicButton, { @shortcut()
_defaultConfig: function () { export class MultiSelectBar extends BasicButton {
return BI.extend(BI.MultiSelectBar.superclass._defaultConfig.apply(this, arguments), { static xtype = "bi.multi_select_bar"
static EVENT_CHANGE = "EVENT_CHANGE"
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-multi-select-bar", extraCls: "bi-multi-select-bar",
height: 25, height: 25,
text: BI.i18nText("BI-Select_All"), text: i18nText("BI-Select_All"),
isAllCheckedBySelectedValue: BI.emptyFn, isAllCheckedBySelectedValue: emptyFn,
// 手动控制选中 // 手动控制选中
disableSelected: true, disableSelected: true,
isHalfCheckedBySelectedValue: function (selectedValues) { isHalfCheckedBySelectedValue (selectedValues) {
return selectedValues.length > 0; return selectedValues.length > 0;
}, },
halfSelected: false, halfSelected: false,
@ -22,46 +31,47 @@ BI.MultiSelectBar = BI.inherit(BI.BasicButton, {
iconWidth: 14, iconWidth: 14,
iconHeight: 14, iconHeight: 14,
}); });
}, }
_init: function () {
BI.MultiSelectBar.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
var isSelect = o.selected === true; const o = this.options;
var isHalfSelect = !o.selected && o.halfSelected; const isSelect = o.selected === true;
this.checkbox = BI.createWidget({ const isHalfSelect = !o.selected && o.halfSelected;
this.checkbox = createWidget({
type: "bi.checkbox", type: "bi.checkbox",
stopPropagation: true, stopPropagation: true,
handler: function () { handler: () => {
self.setSelected(self.isSelected()); this.setSelected(this.isSelected());
}, },
selected: isSelect, selected: isSelect,
invisible: isHalfSelect, invisible: isHalfSelect,
iconWidth: o.iconWidth, iconWidth: o.iconWidth,
iconHeight: o.iconHeight iconHeight: o.iconHeight,
}); });
this.half = BI.createWidget({ this.half = createWidget({
type: "bi.half_icon_button", type: "bi.half_icon_button",
stopPropagation: true, stopPropagation: true,
handler: function () { handler: () => {
self.setSelected(true); this.setSelected(true);
}, },
invisible: isSelect || !isHalfSelect, invisible: isSelect || !isHalfSelect,
iconWidth: o.iconWidth, iconWidth: o.iconWidth,
iconHeight: o.iconHeight iconHeight: o.iconHeight,
}); });
this.checkbox.on(BI.Controller.EVENT_CHANGE, function () { this.checkbox.on(Controller.EVENT_CHANGE, () => {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.CLICK, self.isSelected(), self); this.fireEvent(Controller.EVENT_CHANGE, Events.CLICK, this.isSelected(), this);
}); });
this.checkbox.on(BI.Checkbox.EVENT_CHANGE, function () { this.checkbox.on(Checkbox.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiSelectBar.EVENT_CHANGE, self.isSelected(), self); this.fireEvent(MultiSelectBar.EVENT_CHANGE, this.isSelected(), this);
}); });
this.half.on(BI.Controller.EVENT_CHANGE, function () { this.half.on(Controller.EVENT_CHANGE, () => {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.CLICK, self.isSelected(), self); this.fireEvent(Controller.EVENT_CHANGE, Events.CLICK, this.isSelected(), this);
}); });
this.half.on(BI.HalfIconButton.EVENT_CHANGE, function () { this.half.on(HalfIconButton.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiSelectBar.EVENT_CHANGE, self.isSelected(), self); this.fireEvent(MultiSelectBar.EVENT_CHANGE, this.isSelected(), this);
}); });
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: "bi.label",
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
@ -71,43 +81,43 @@ BI.MultiSelectBar = BI.inherit(BI.BasicButton, {
text: o.text, text: o.text,
keyword: o.keyword, keyword: o.keyword,
value: o.value, value: o.value,
py: o.py py: o.py,
}); });
BI.createWidget({ createWidget({
type: "bi.htape", type: "bi.htape",
element: this, element: this,
items: [{ items: [{
width: o.iconWrapperWidth, width: o.iconWrapperWidth,
el: { el: {
type: "bi.center_adapt", type: "bi.center_adapt",
items: [this.checkbox, this.half] items: [this.checkbox, this.half],
} },
}, { }, {
el: this.text el: this.text,
}] }],
}); });
}, }
_setSelected: function (v) { _setSelected(v) {
this.checkbox.setSelected(!!v); this.checkbox.setSelected(!!v);
}, }
// 自己手动控制选中 beforeClick() {
beforeClick: function () { const isHalf = this.isHalfSelected(),
var isHalf = this.isHalfSelected(), isSelected = this.isSelected(); isSelected = this.isSelected();
if (isHalf === true) { if (isHalf === true) {
this.setSelected(true); this.setSelected(true);
} else { } else {
this.setSelected(!isSelected); this.setSelected(!isSelected);
} }
}, }
setSelected: function (v) { setSelected(v) {
this.checkbox.setSelected(v); this.checkbox.setSelected(v);
this.setHalfSelected(false); this.setHalfSelected(false);
}, }
setHalfSelected: function (b) { setHalfSelected(b) {
this.halfSelected = !!b; this.halfSelected = !!b;
if (b === true) { if (b === true) {
this.checkbox.setSelected(false); this.checkbox.setSelected(false);
@ -117,29 +127,27 @@ BI.MultiSelectBar = BI.inherit(BI.BasicButton, {
this.half.invisible(); this.half.invisible();
this.checkbox.visible(); this.checkbox.visible();
} }
}, }
isHalfSelected: function () { isHalfSelected() {
return !this.isSelected() && !!this.halfSelected; return !this.isSelected() && !!this.halfSelected;
}, }
isSelected: function () { isSelected() {
return this.checkbox.isSelected(); return this.checkbox.isSelected();
}, }
setValue: function (selectedValues) { setValue(selectedValues) {
BI.MultiSelectBar.superclass.setValue.apply(this, arguments); super.setValue(...arguments);
var isAllChecked = this.options.isAllCheckedBySelectedValue.apply(this, arguments); const isAllChecked = this.options.isAllCheckedBySelectedValue.apply(this, arguments);
this.setSelected(isAllChecked); this.setSelected(isAllChecked);
!isAllChecked && this.setHalfSelected(this.options.isHalfCheckedBySelectedValue.apply(this, arguments)); !isAllChecked && this.setHalfSelected(this.options.isHalfCheckedBySelectedValue.apply(this, arguments));
}, }
doClick: function () { doClick() {
BI.MultiSelectBar.superclass.doClick.apply(this, arguments); super.doClick(...arguments);
if(this.isValid()) { if (this.isValid()) {
this.fireEvent(BI.MultiSelectBar.EVENT_CHANGE, this.isSelected(), this); this.fireEvent(MultiSelectBar.EVENT_CHANGE, this.isSelected(), this);
} }
} }
}); }
BI.MultiSelectBar.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_bar", BI.MultiSelectBar);

8
src/case/trigger/index.js

@ -0,0 +1,8 @@
export { EditorTrigger } from "./trigger.editor";
export { IconTrigger } from "./trigger.icon";
export { IconTextTrigger } from "./trigger.icon.text";
export { SelectIconTextTrigger } from "./trigger.icon.text.select";
export { TextTrigger } from "./trigger.text";
export { SelectTextTrigger } from "./trigger.text.select";
export { SmallSelectTextTrigger } from "./trigger.text.select.small";
export { SmallTextTrigger } from "./trigger.text.small";

105
src/case/trigger/trigger.editor.js

@ -1,93 +1,98 @@
import { shortcut, extend, emptyFn, createWidget, toPix, Controller } from "@/core";
import { Trigger } from "@/base";
import { SignEditor } from "../editor";
/** /**
* 文本输入框trigger * 文本输入框trigger
* *
* Created by GUY on 2015/9/15. * Created by GUY on 2015/9/15.
* @class BI.EditorTrigger * @class EditorTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.EditorTrigger = BI.inherit(BI.Trigger, { @shortcut()
_defaultConfig: function (config) { export class EditorTrigger extends Trigger {
var conf = BI.EditorTrigger.superclass._defaultConfig.apply(this, arguments); static xtype = "bi.editor_trigger";
return BI.extend(conf, { static EVENT_CHANGE = "EVENT_CHANGE";
baseCls: (conf.baseCls || "") + " bi-editor-trigger bi-border-radius " + (config.simple ? "bi-border-bottom" : "bi-border"), static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_EMPTY = "EVENT_EMPTY";
static EVENT_VALID = "EVENT_VALID";
static EVENT_ERROR = "EVENT_ERROR";
_defaultConfig(config) {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-editor-trigger bi-border-radius ${config.simple ? "bi-border-bottom" : "bi-border"}`,
height: 24, height: 24,
validationChecker: BI.emptyFn, validationChecker: emptyFn,
quitChecker: BI.emptyFn, quitChecker: emptyFn,
allowBlank: false, allowBlank: false,
watermark: "", watermark: "",
errorText: "" errorText: "",
}); });
}, }
_init: function () { _init() {
BI.EditorTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options, c = this._const; const o = this.options;
this.editor = BI.createWidget({ this.editor = createWidget({
type: "bi.sign_editor", type: "bi.sign_editor",
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
value: o.value, value: o.value,
validationChecker: o.validationChecker, validationChecker: o.validationChecker,
quitChecker: o.quitChecker, quitChecker: o.quitChecker,
allowBlank: o.allowBlank, allowBlank: o.allowBlank,
watermark: o.watermark, watermark: o.watermark,
errorText: o.errorText, errorText: o.errorText,
title: function () { title: () => this.getValue(),
return self.getValue();
}
}); });
this.editor.on(BI.Controller.EVENT_CHANGE, function () { this.editor.on(Controller.EVENT_CHANGE, (...args) => {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); this.fireEvent(Controller.EVENT_CHANGE, ...args);
}); });
this.editor.on(BI.SignEditor.EVENT_CHANGE, function () { this.editor.on(SignEditor.EVENT_CHANGE, (...args) => {
self.fireEvent(BI.EditorTrigger.EVENT_CHANGE, arguments); this.fireEvent(EditorTrigger.EVENT_CHANGE, ...args);
}); });
this.editor.on(BI.SignEditor.EVENT_FOCUS, function () { this.editor.on(SignEditor.EVENT_FOCUS, (...args) => {
self.fireEvent(BI.EditorTrigger.EVENT_FOCUS, arguments); this.fireEvent(EditorTrigger.EVENT_FOCUS, ...args);
}); });
this.editor.on(BI.SignEditor.EVENT_EMPTY, function () { this.editor.on(SignEditor.EVENT_EMPTY, (...args) => {
self.fireEvent(BI.EditorTrigger.EVENT_EMPTY, arguments); this.fireEvent(EditorTrigger.EVENT_EMPTY, ...args);
}); });
this.editor.on(BI.SignEditor.EVENT_VALID, function () { this.editor.on(SignEditor.EVENT_VALID, (...args) => {
self.fireEvent(BI.EditorTrigger.EVENT_VALID, arguments); this.fireEvent(EditorTrigger.EVENT_VALID, ...args);
}); });
this.editor.on(BI.SignEditor.EVENT_ERROR, function () { this.editor.on(SignEditor.EVENT_ERROR, (...args) => {
self.fireEvent(BI.EditorTrigger.EVENT_ERROR, arguments); this.fireEvent(EditorTrigger.EVENT_ERROR, ...args);
}); });
BI.createWidget({ createWidget({
element: this, element: this,
type: "bi.horizontal_fill", type: "bi.horizontal_fill",
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
items: [ items: [
{ {
el: this.editor, el: this.editor,
width: "fill" width: "fill",
}, { }, {
el: { el: {
type: "bi.trigger_icon_button", type: "bi.trigger_icon_button",
width: o.triggerWidth || BI.toPix(o.height, 2) width: o.triggerWidth || toPix(o.height, 2),
}, },
width: "" width: "",
} }
] ],
}); });
}, }
getValue: function () { getValue() {
return this.editor.getValue(); return this.editor.getValue();
}, }
setValue: function (value) { setValue(value) {
this.editor.setValue(value); this.editor.setValue(value);
}, }
setText: function (text) { setText(text) {
this.editor.setState(text); this.editor.setState(text);
} }
}); }
BI.EditorTrigger.EVENT_CHANGE = "EVENT_CHANGE";
BI.EditorTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.EditorTrigger.EVENT_EMPTY = "EVENT_EMPTY";
BI.EditorTrigger.EVENT_VALID = "EVENT_VALID";
BI.EditorTrigger.EVENT_ERROR = "EVENT_ERROR";
BI.shortcut("bi.editor_trigger", BI.EditorTrigger);

33
src/case/trigger/trigger.icon.js

@ -1,30 +1,35 @@
import { shortcut, extend, createWidget } from "@/core";
import { Trigger } from "@/base";
/** /**
* 图标按钮trigger * 图标按钮trigger
* *
* Created by GUY on 2015/10/8. * Created by GUY on 2015/10/8.
* @class BI.IconTrigger * @class IconTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.IconTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class IconTrigger extends Trigger {
static xtype = "bi.icon_trigger"
_defaultConfig: function () { _defaultConfig() {
return BI.extend(BI.IconTrigger.superclass._defaultConfig.apply(this, arguments), { return extend(super._defaultConfig(...arguments), {
baseCls: "bi-icon-trigger", baseCls: "bi-icon-trigger",
extraCls: "pull-down-font", extraCls: "pull-down-font",
el: {}, el: {},
height: 24 height: 24,
}); });
}, }
_init: function () {
var o = this.options; _init() {
BI.IconTrigger.superclass._init.apply(this, arguments); const o = this.options;
this.iconButton = BI.createWidget(o.el, { super._init(...arguments);
this.iconButton = createWidget(o.el, {
type: "bi.trigger_icon_button", type: "bi.trigger_icon_button",
element: this, element: this,
width: o.width, width: o.width,
height: o.height, height: o.height,
extraCls: o.extraCls extraCls: o.extraCls,
}); });
} }
}); }
BI.shortcut("bi.icon_trigger", BI.IconTrigger);

84
src/case/trigger/trigger.icon.text.js

@ -1,29 +1,35 @@
import { shortcut, extend, isKey, createWidget, isEmptyString } from "@/core";
import { Trigger } from "@/base";
/** /**
* 文字trigger * 文字trigger
* *
* Created by GUY on 2015/9/15. * Created by GUY on 2015/9/15.
* @class BI.IconTextTrigger * @class IconTextTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.IconTextTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class IconTextTrigger extends Trigger {
static xtype = "bi.icon_text_trigger"
_defaultConfig: function () { _defaultConfig() {
var conf = BI.IconTextTrigger.superclass._defaultConfig.apply(this, arguments); const conf = super._defaultConfig(...arguments);
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-text-trigger", return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-text-trigger`,
height: 24, height: 24,
iconHeight: null, iconHeight: null,
iconWidth: null, iconWidth: null,
textCls: "" textCls: "",
}); });
}, }
_init: function () { _init() {
BI.IconTextTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: "bi.label",
cls: "select-text-label" + (BI.isKey(o.textCls) ? (" " + o.textCls) : ""), cls: `select-text-label${isKey(o.textCls) ? (` ${o.textCls}`) : ""}`,
textAlign: "left", textAlign: "left",
height: o.height, height: o.height,
hgap: o.textHgap, hgap: o.textHgap,
@ -32,19 +38,19 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
rgap: o.textRgap, rgap: o.textRgap,
tgap: o.textTgap, tgap: o.textTgap,
bgap: o.textBgap, bgap: o.textBgap,
text: o.text text: o.text,
}); });
this.trigerButton = BI.createWidget({ this.trigerButton = createWidget({
type: "bi.trigger_icon_button", type: "bi.trigger_icon_button",
width: o.triggerWidth || o.height width: o.triggerWidth || o.height,
}); });
BI.createWidget({ createWidget({
element: this, element: this,
type: "bi.horizontal_fill", type: "bi.horizontal_fill",
columnSize: ["", "fill", ""], columnSize: ["", "fill", ""],
ref: function (_ref) { ref: _ref => {
self.wrapper = _ref; this.wrapper = _ref;
}, },
items: [{ items: [{
el: { el: {
@ -53,41 +59,39 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
width: o.triggerWidth || o.height, width: o.triggerWidth || o.height,
iconCls: o.iconCls, iconCls: o.iconCls,
invisible: !o.iconCls, invisible: !o.iconCls,
ref: function (_ref) { ref: _ref => {
self.icon = _ref; this.icon = _ref;
}, },
iconHeight: o.iconHeight, iconHeight: o.iconHeight,
iconWidth: o.iconWidth, iconWidth: o.iconWidth,
disableSelected: true disableSelected: true,
} },
}, { }, {
el: this.text, el: this.text,
lgap: BI.isEmptyString(o.iconCls) ? 5 : 0 lgap: isEmptyString(o.iconCls) ? 5 : 0,
}, { }, {
el: this.trigerButton el: this.trigerButton,
}] }],
}); });
}, }
setValue: function (value) { setValue(value) {
this.text.setValue(value); this.text.setValue(value);
}, }
setIcon: function (iconCls) { setIcon(iconCls) {
var o = this.options;
this.icon.setIcon(iconCls); this.icon.setIcon(iconCls);
this.icon.setVisible(!!iconCls); this.icon.setVisible(!!iconCls);
}, }
setTextCls: function (cls) { setTextCls(cls) {
var o = this.options; const o = this.options;
var oldCls = o.textCls; const oldCls = o.textCls;
o.textCls = cls; o.textCls = cls;
this.text.element.removeClass(oldCls).addClass(cls); this.text.element.removeClass(oldCls).addClass(cls);
}, }
setText: function (text) { setText(text) {
this.text.setText(text); this.text.setText(text);
} }
}); }
BI.shortcut("bi.icon_text_trigger", BI.IconTextTrigger);

67
src/case/trigger/trigger.icon.text.select.js

@ -1,23 +1,28 @@
import { shortcut, extend, createWidget, isFunction, isArray, isNotNull, any, deepContains, Tree } from "@/core";
import { Trigger } from "@/base";
/** /**
* Created by Windy on 2017/12/12. * Created by Windy on 2017/12/12.
*/ */
BI.SelectIconTextTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class SelectIconTextTrigger extends Trigger {
static xtype = "bi.select_icon_text_trigger"
_defaultConfig: function () { _defaultConfig() {
return BI.extend(BI.SelectIconTextTrigger.superclass._defaultConfig.apply(this, arguments), { return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-text-trigger", baseCls: "bi-select-text-trigger",
height: 24, height: 24,
iconHeight: null, iconHeight: null,
iconWidth: null, iconWidth: null,
iconCls: "" iconCls: "",
}); });
}, }
_init: function () { _init() {
BI.SelectIconTextTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
var obj = this._digist(o.value, o.items); const obj = this._digist(o.value, o.items);
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.icon_text_trigger", type: "bi.icon_text_trigger",
element: this, element: this,
text: obj.text, text: obj.text,
@ -32,49 +37,49 @@ BI.SelectIconTextTrigger = BI.inherit(BI.Trigger, {
height: o.height, height: o.height,
iconHeight: o.iconHeight, iconHeight: o.iconHeight,
iconWidth: o.iconWidth, iconWidth: o.iconWidth,
iconWrapperWidth: o.iconWrapperWidth iconWrapperWidth: o.iconWrapperWidth,
}); });
}, }
_digist: function (vals, items) { _digist(vals, items) {
var o = this.options; const o = this.options;
vals = BI.isArray(vals) ? vals : [vals]; vals = isArray(vals) ? vals : [vals];
var result; let result;
var formatItems = BI.Tree.transformToArrayFormat(items); const formatItems = Tree.transformToArrayFormat(items);
BI.any(formatItems, function (i, item) { any(formatItems, (i, item) => {
if (BI.deepContains(vals, item.value)) { if (deepContains(vals, item.value)) {
result = { result = {
text: item.text || item.value, text: item.text || item.value,
iconCls: item.iconCls iconCls: item.iconCls,
}; };
return true; return true;
} }
}); });
if (BI.isNotNull(result)) { if (isNotNull(result)) {
return { return {
text: result.text, text: result.text,
textCls: "", textCls: "",
iconCls: result.iconCls iconCls: result.iconCls,
}; };
} else { } else {
return { return {
text: BI.isFunction(o.text) ? o.text() : o.text, text: isFunction(o.text) ? o.text() : o.text,
textCls: "bi-water-mark", textCls: "bi-water-mark",
iconCls: o.iconCls iconCls: o.iconCls,
}; };
} }
}, }
setValue: function (vals) { setValue(vals) {
var obj = this._digist(vals, this.options.items); const obj = this._digist(vals, this.options.items);
this.trigger.setText(obj.text); this.trigger.setText(obj.text);
this.trigger.setIcon(obj.iconCls); this.trigger.setIcon(obj.iconCls);
this.trigger.setTextCls(obj.textCls); this.trigger.setTextCls(obj.textCls);
}, }
populate: function (items) { populate(items) {
this.options.items = items; this.options.items = items;
} }
}); }
BI.shortcut("bi.select_icon_text_trigger", BI.SelectIconTextTrigger);

159
src/case/trigger/trigger.text.js

@ -1,41 +1,45 @@
import { shortcut, isFunction, isKey, isNotEmptyString } from "@/core";
import { Trigger } from "@/base";
/** /**
* 文字trigger * 文字trigger
* *
* Created by GUY on 2015/9/15. * Created by GUY on 2015/9/15.
* @class BI.TextTrigger * @class TextTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.TextTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class TextTrigger extends Trigger {
static xtype = "bi.text_trigger"
static EVENT_CLEAR = "EVENT_CLEAR"
props: function () { props() {
var self = this;
return { return {
baseCls: "bi-text-trigger", baseCls: "bi-text-trigger",
height: 24, height: 24,
textHgap: 6, textHgap: 6,
textCls: "", textCls: "",
allowClear: false, allowClear: false,
title: function () { title: () => this.text.getText(),
return self.text.getText();
},
defaultText: "", defaultText: "",
text: "", text: "",
}; };
}, }
render: function () { render() {
var self = this, o = this.options, c = this._const; const o = this.options;
var text = this.getText(); const text = this.getText();
var defaultText = this.getDefaultText(); const defaultText = this.getDefaultText();
var label = { const label = {
type: "bi.label", type: "bi.label",
ref: function (_ref) { ref: _ref => {
self.text = _ref; this.text = _ref;
}, },
cls: `select-text-label ${o.textCls} ${!BI.isNotEmptyString(text) && BI.isNotEmptyString(defaultText) ? "bi-tips" : ""}`, cls: `select-text-label ${o.textCls} ${!isNotEmptyString(text) && isNotEmptyString(defaultText) ? "bi-tips" : ""}`,
textAlign: "left", textAlign: "left",
height: o.height, height: o.height,
text: text || o.defaultText, text: text || o.defaultText,
@ -47,98 +51,93 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
rgap: o.textRgap, rgap: o.textRgap,
tgap: o.textTgap, tgap: o.textTgap,
bgap: o.textBgap, bgap: o.textBgap,
readonly: o.readonly readonly: o.readonly,
}; };
var triggerButton = { const triggerButton = {
type: "bi.trigger_icon_button", type: "bi.trigger_icon_button",
ref: function (_ref) { ref: _ref => {
self.triggerButton = _ref; this.triggerButton = _ref;
}, },
width: o.triggerWidth || o.height width: o.triggerWidth || o.height,
}; };
return ({ return ({
type: "bi.horizontal_fill", type: "bi.horizontal_fill",
columnSize: ["fill", ""], columnSize: ["fill", ""],
items: [ items: [{
{ el: label,
el: label, width: "fill",
width: "fill" }, {
}, { el: o.allowClear ? {
el: o.allowClear ? { type: "bi.vertical_adapt",
type: "bi.vertical_adapt", width: o.triggerWidth || o.height,
width: o.triggerWidth || o.height, height: o.height,
height: o.height, horizontalAlign: "left",
horizontalAlign: "left", scrollable: false,
scrollable: false, items: [{
items: [ el: {
{ type: "bi.icon_button",
el: { ref: _ref => {
type: "bi.icon_button", this.clearBtn = _ref;
ref: function (_ref) { },
self.clearBtn = _ref; cls: `close-h-font ${o.allowClear ? "clear-button" : ""}`,
}, stopPropagation: true,
cls: "close-h-font " + (o.allowClear ? "clear-button" : ""), width: o.triggerWidth || o.height,
stopPropagation: true, invisible: !isNotEmptyString(o.text),
width: o.triggerWidth || o.height, handler: () => {
invisible: !BI.isNotEmptyString(o.text), this.fireEvent(TextTrigger.EVENT_CLEAR);
handler: function () { },
self.fireEvent(BI.TextTrigger.EVENT_CLEAR); },
}, }, {
}, el: triggerButton,
}, { }],
el: triggerButton, } : triggerButton,
} }],
]
} : triggerButton,
}
]
}); });
}, }
getText: function () { getText() {
var o = this.options; const o = this.options;
return BI.isFunction(o.text) ? o.text() : o.text;
}, return isFunction(o.text) ? o.text() : o.text;
}
getDefaultText: function () { getDefaultText() {
var o = this.options; const o = this.options;
return BI.isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
}, return isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
}
getTextor: function () { getTextor() {
return this.text; return this.text;
}, }
setTextCls: function (cls) { setTextCls(cls) {
var o = this.options; const o = this.options;
var oldCls = o.textCls; const oldCls = o.textCls;
o.textCls = cls; o.textCls = cls;
this.text.element.removeClass(oldCls).addClass(cls); this.text.element.removeClass(oldCls).addClass(cls);
}, }
setText: function (text) { setText(text) {
if (this.options.allowClear) { if (this.options.allowClear) {
this.clearBtn.setVisible(BI.isNotEmptyString(text)); this.clearBtn.setVisible(isNotEmptyString(text));
} }
if (BI.isKey(text)) { if (isKey(text)) {
this.text.setText(text); this.text.setText(text);
this.text.element.removeClass("bi-tips"); this.text.element.removeClass("bi-tips");
} else if (BI.isKey(this.options.defaultText)) { } else if (isKey(this.options.defaultText)) {
this.text.setText(this.options.defaultText); this.text.setText(this.options.defaultText);
this.text.element.addClass("bi-tips"); this.text.element.addClass("bi-tips");
} else { } else {
this.text.setText(""); this.text.setText("");
this.text.element.removeClass("bi-tips"); this.text.element.removeClass("bi-tips");
} }
}, }
setTipType: function (v) { setTipType(v) {
this.text.options.tipType = v; this.text.options.tipType = v;
this.options.tipType = v; this.options.tipType = v;
} }
}); }
BI.TextTrigger.EVENT_CLEAR = "EVENT_CLEAR";
BI.shortcut("bi.text_trigger", BI.TextTrigger);

102
src/case/trigger/trigger.text.select.js

@ -1,32 +1,40 @@
import { shortcut, extend, emptyFn, createWidget, isFunction, isArray, Tree, each, contains, remove } from "@/core";
import { Trigger } from "@/base";
import { TextTrigger } from "./trigger.text";
/** /**
* 选择字段trigger * 选择字段trigger
* *
* Created by GUY on 2015/9/15. * Created by GUY on 2015/9/15.
* @class BI.SelectTextTrigger * @class SelectTextTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.SelectTextTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class SelectTextTrigger extends Trigger {
static xtype = "bi.select_text_trigger"
static EVENT_CLEAR = "EVENT_CLEAR"
_defaultConfig: function () { _defaultConfig() {
return BI.extend(BI.SelectTextTrigger.superclass._defaultConfig.apply(this, arguments), { return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-text-trigger", baseCls: "bi-select-text-trigger",
height: 24, height: 24,
allowClear: false, allowClear: false,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
defaultText: "", defaultText: "",
}); });
}, }
_init: function () { _init() {
BI.SelectTextTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
var text = this._digest(o.value, o.items); const text = this._digest(o.value, o.items);
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.text_trigger", type: "bi.text_trigger",
element: this, element: this,
height: o.height, height: o.height,
readonly: o.readonly, readonly: o.readonly,
text: text, text,
defaultText: o.defaultText, defaultText: o.defaultText,
textHgap: o.textHgap, textHgap: o.textHgap,
textVgap: o.textVgap, textVgap: o.textVgap,
@ -37,71 +45,67 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
tipType: o.tipType, tipType: o.tipType,
title: null, title: null,
allowClear: o.allowClear, allowClear: o.allowClear,
listeners: [ listeners: [{
{ eventName: TextTrigger.EVENT_CLEAR,
eventName: BI.TextTrigger.EVENT_CLEAR, action: () => {
action: function () { this.setText("");
self.setText(""); this.fireEvent(SelectTextTrigger.EVENT_CLEAR);
self.fireEvent(BI.SelectTextTrigger.EVENT_CLEAR); },
} }],
}
]
}); });
}, }
_digest: function (val, items) { _digest(val, items) {
var o = this.options; const o = this.options;
val = BI.isArray(val) ? val.slice() : [val]; val = isArray(val) ? val.slice() : [val];
var result = []; const result = [];
// 提升valueFormatter的优先级 // 提升valueFormatter的优先级
if (o.valueFormatter !== BI.emptyFn && BI.isFunction(o.valueFormatter)) { if (o.valueFormatter !== emptyFn && isFunction(o.valueFormatter)) {
BI.each(val, function (index, v) { each(val, (index, v) => {
result.push(o.valueFormatter(v)); result.push(o.valueFormatter(v));
}); });
return result.join(","); return result.join(",");
} }
var formatItems = BI.Tree.transformToArrayFormat(items); const formatItems = Tree.transformToArrayFormat(items);
BI.each(formatItems, function (i, item) { each(formatItems, (i, item) => {
if (BI.contains(val, item.value) && !BI.contains(result, item.text || item.value)) { if (contains(val, item.value) && !contains(result, item.text || item.value)) {
result.push(item.text || item.value); result.push(item.text || item.value);
BI.remove(val, item.value); remove(val, item.value);
} }
}); });
if (result.length > 0 && val.length === 0) { if (result.length > 0 && val.length === 0) {
return result.join(","); return result.join(",");
} else { } else {
return BI.isFunction(o.text) ? o.text() : o.text; return isFunction(o.text) ? o.text() : o.text;
} }
}, }
setText: function (text) { setText(text) {
this.options.text = text; this.options.text = text;
this.trigger.setText(text); this.trigger.setText(text);
}, }
setValue: function (val) { setValue(val) {
var formatText = this._digest(val, this.options.items); const formatText = this._digest(val, this.options.items);
this.trigger.setText(formatText); this.trigger.setText(formatText);
}, }
setTipType: function (v) { setTipType(v) {
this.options.tipType = v; this.options.tipType = v;
this.trigger.setTipType(v); this.trigger.setTipType(v);
}, }
getTextor: function () { getTextor() {
return this.trigger.getTextor(); return this.trigger.getTextor();
}, }
populate: function (items) { populate(items) {
this.options.items = items; this.options.items = items;
} }
}); }
BI.SelectTextTrigger.EVENT_CLEAR = "EVENT_CLEAR";
BI.shortcut("bi.select_text_trigger", BI.SelectTextTrigger);

66
src/case/trigger/trigger.text.select.small.js

@ -1,26 +1,31 @@
import { shortcut, extend, toPix, createWidget, isArray, deepContains, each, contains, Tree } from "@/core";
import { Trigger } from "@/base";
/** /**
* 选择字段trigger小一号的 * 选择字段trigger小一号的
* *
* @class BI.SmallSelectTextTrigger * @class SmallSelectTextTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.SmallSelectTextTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class SmallSelectTextTrigger extends Trigger {
static xtype = "bi.small_select_text_trigger"
_defaultConfig: function () { _defaultConfig() {
return BI.extend(BI.SmallSelectTextTrigger.superclass._defaultConfig.apply(this, arguments), { return extend(super._defaultConfig(...arguments), {
baseCls: "bi-small-select-text-trigger bi-border", baseCls: "bi-small-select-text-trigger bi-border",
height: 20, height: 20,
}); });
}, }
_init: function () { _init() {
BI.SmallSelectTextTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const o = this.options;
var obj = this._digest(o.value, o.items); const obj = this._digest(o.value, o.items);
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.small_text_trigger", type: "bi.small_text_trigger",
element: this, element: this,
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
text: obj.text, text: obj.text,
cls: obj.cls, cls: obj.cls,
textHgap: o.textHgap, textHgap: o.textHgap,
@ -30,15 +35,15 @@ BI.SmallSelectTextTrigger = BI.inherit(BI.Trigger, {
textTgap: o.textTgap, textTgap: o.textTgap,
textBgap: o.textBgap, textBgap: o.textBgap,
}); });
}, }
_digest: function(vals, items){ _digest(vals, items) {
var o = this.options; const o = this.options;
vals = BI.isArray(vals) ? vals : [vals]; vals = isArray(vals) ? vals : [vals];
var result = []; const result = [];
var formatItems = BI.Tree.transformToArrayFormat(items); const formatItems = Tree.transformToArrayFormat(items);
BI.each(formatItems, function (i, item) { each(formatItems, (i, item) => {
if (BI.deepContains(vals, item.value) && !BI.contains(result, item.text || item.value)) { if (deepContains(vals, item.value) && !contains(result, item.text || item.value)) {
result.push(item.text || item.value); result.push(item.text || item.value);
} }
}); });
@ -46,24 +51,23 @@ BI.SmallSelectTextTrigger = BI.inherit(BI.Trigger, {
if (result.length > 0) { if (result.length > 0) {
return { return {
cls: "", cls: "",
text: result.join(",") text: result.join(","),
} };
} else { } else {
return { return {
cls: "bi-water-mark", cls: "bi-water-mark",
text: o.text text: o.text,
} };
} }
}, }
setValue: function (vals) { setValue(vals) {
var formatValue = this._digest(vals, this.options.items); const formatValue = this._digest(vals, this.options.items);
this.trigger.element.removeClass("bi-water-mark").addClass(formatValue.cls); this.trigger.element.removeClass("bi-water-mark").addClass(formatValue.cls);
this.trigger.setText(formatValue.text); this.trigger.setText(formatValue.text);
}, }
populate: function (items) { populate(items) {
this.options.items = items; this.options.items = items;
} }
}); }
BI.shortcut("bi.small_select_text_trigger", BI.SmallSelectTextTrigger);

64
src/case/trigger/trigger.text.small.js

@ -1,23 +1,30 @@
import { shortcut, extend, createWidget } from "@/core";
import { Trigger } from "@/base";
/** /**
* 文字trigger(右边小三角小一号的) == * 文字trigger(右边小三角小一号的) ==
* *
* @class BI.SmallTextTrigger * @class SmallTextTrigger
* @extends BI.Trigger * @extends Trigger
*/ */
BI.SmallTextTrigger = BI.inherit(BI.Trigger, { @shortcut()
_defaultConfig: function () { export class SmallTextTrigger extends Trigger {
var conf = BI.SmallTextTrigger.superclass._defaultConfig.apply(this, arguments); static xtype = "bi.small_text_trigger"
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-text-trigger", _defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-text-trigger`,
height: 20, height: 20,
textHgap: 6, textHgap: 6,
}); });
}, }
_init: function () { _init() {
BI.SmallTextTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options, c = this._const; const o = this.options;
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: "bi.label",
textAlign: "left", textAlign: "left",
height: o.height, height: o.height,
@ -29,32 +36,29 @@ BI.SmallTextTrigger = BI.inherit(BI.Trigger, {
tgap: o.textTgap, tgap: o.textTgap,
bgap: o.textBgap, bgap: o.textBgap,
}); });
this.trigerButton = BI.createWidget({ this.trigerButton = createWidget({
type: "bi.trigger_icon_button", type: "bi.trigger_icon_button",
width: o.triggerWidth || o.height width: o.triggerWidth || o.height,
}); });
BI.createWidget({ createWidget({
element: this, element: this,
type: "bi.horizontal_fill", type: "bi.horizontal_fill",
items: [ items: [{
{ el: this.text,
el: this.text, width: "fill",
width: "fill" }, {
}, { el: this.trigerButton,
el: this.trigerButton, width: "",
width: "" }],
}
]
}); });
}, }
setValue: function (value) { setValue(value) {
this.text.setValue(value); this.text.setValue(value);
}, }
setText: function (text) { setText(text) {
this.text.setText(text); this.text.setText(text);
} }
}); }
BI.shortcut("bi.small_text_trigger", BI.SmallTextTrigger);

367
src/core/platform/web/dom.js

@ -502,207 +502,208 @@ export function getComboPositionByDirections(combo, popup, extraWidth, extraHeig
for (i = 0; i < directions.length; i++) { for (i = 0; i < directions.length; i++) {
direct = directions[i]; direct = directions[i];
switch (direct) { switch (direct) {
case "left": case "left":
leftRight.push(direct); leftRight.push(direct);
break; break;
case "right": case "right":
leftRight.push(direct); leftRight.push(direct);
break; break;
case "top": case "top":
topBottom.push(direct); topBottom.push(direct);
break; break;
case "bottom": case "bottom":
topBottom.push(direct); topBottom.push(direct);
break; break;
case "innerLeft": case "innerLeft":
innerLeftRight.push(direct); innerLeftRight.push(direct);
break; break;
case "innerRight": case "innerRight":
innerLeftRight.push(direct); innerLeftRight.push(direct);
break; break;
default: default:
break; break;
} }
} }
for (i = 0; i < directions.length; i++) { for (i = 0; i < directions.length; i++) {
let tW, tH;
direct = directions[i]; direct = directions[i];
switch (direct) { switch (direct) {
case "left": case "left":
if (!isNeedAdaptHeight) { if (!isNeedAdaptHeight) {
var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? 0 : extraHeight; tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? 0 : extraHeight;
if (isLeftSpaceEnough(combo, popup, tW)) { if (isLeftSpaceEnough(combo, popup, tW)) {
left = getLeftPosition(combo, popup, tW, container).left; left = getLeftPosition(combo, popup, tW, container).left;
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight, container); pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight, container);
} else { } else {
pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight, container); pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight, container);
}
pos.dir = `left,${pos.dir}`;
if (tbFirst) {
pos.change = "left";
}
pos.left = left;
return pos;
} }
} pos.dir = `left,${pos.dir}`;
lrFirst = true; if (tbFirst) {
break; pos.change = "left";
case "right":
if (!isNeedAdaptHeight) {
var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? extraWidth : extraHeight;
if (isRightSpaceEnough(combo, popup, tW)) {
left = getRightPosition(combo, popup, tW, container).left;
if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight, container);
} else {
pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight, container);
}
pos.dir = `right,${pos.dir}`;
if (tbFirst) {
pos.change = "right";
}
pos.left = left;
return pos;
} }
pos.left = left;
return pos;
} }
lrFirst = true; }
break; lrFirst = true;
case "top": break;
var tW = lrFirst ? extraHeight : extraWidth, tH = lrFirst ? extraWidth : extraHeight; case "right":
if (isTopSpaceEnough(combo, popup, tH)) { if (!isNeedAdaptHeight) {
top = getTopPosition(combo, popup, tH, container).top; tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? extraWidth : extraHeight;
if (leftRight[0] === "right") { if (isRightSpaceEnough(combo, popup, tW)) {
pos = getLeftAlignPosition(combo, popup, tW, container); left = getRightPosition(combo, popup, tW, container).left;
if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight, container);
} else { } else {
pos = getRightAlignPosition(combo, popup, tW, container); pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight, container);
} }
pos.dir = `top,${pos.dir}`; pos.dir = `right,${pos.dir}`;
if (lrFirst) { if (tbFirst) {
pos.change = "top"; pos.change = "right";
} }
pos.top = top; pos.left = left;
return pos; return pos;
} }
if (needAdaptHeight) { }
isNeedAdaptHeight = true; lrFirst = true;
break;
case "top":
tW = lrFirst ? extraHeight : extraWidth, tH = lrFirst ? extraWidth : extraHeight;
if (isTopSpaceEnough(combo, popup, tH)) {
top = getTopPosition(combo, popup, tH, container).top;
if (leftRight[0] === "right") {
pos = getLeftAlignPosition(combo, popup, tW, container);
} else {
pos = getRightAlignPosition(combo, popup, tW, container);
}
pos.dir = `top,${pos.dir}`;
if (lrFirst) {
pos.change = "top";
} }
tbFirst = true; pos.top = top;
break;
case "bottom": return pos;
var tW = lrFirst ? extraHeight : extraWidth, tH = lrFirst ? extraWidth : extraHeight; }
if (isBottomSpaceEnough(combo, popup, tH)) { if (needAdaptHeight) {
top = getBottomPosition(combo, popup, tH, container).top; isNeedAdaptHeight = true;
if (leftRight[0] === "right") { }
pos = getLeftAlignPosition(combo, popup, tW, container); tbFirst = true;
break;
case "bottom":
tW = lrFirst ? extraHeight : extraWidth, tH = lrFirst ? extraWidth : extraHeight;
if (isBottomSpaceEnough(combo, popup, tH)) {
top = getBottomPosition(combo, popup, tH, container).top;
if (leftRight[0] === "right") {
pos = getLeftAlignPosition(combo, popup, tW, container);
} else {
pos = getRightAlignPosition(combo, popup, tW, container);
}
pos.dir = `bottom,${pos.dir}`;
if (lrFirst) {
pos.change = "bottom";
}
pos.top = top;
return pos;
}
if (needAdaptHeight) {
isNeedAdaptHeight = true;
}
tbFirst = true;
break;
case "innerLeft":
if (!isNeedAdaptHeight) {
tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? 0 : extraHeight;
if (isInnerLeftSpaceEnough(combo, popup, tW)) {
left = getInnerLeftPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight);
} else { } else {
pos = getRightAlignPosition(combo, popup, tW, container); pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
} }
pos.dir = `bottom,${pos.dir}`; pos.dir = `innerLeft,${pos.dir}`;
if (lrFirst) { if (tbFirst) {
pos.change = "bottom"; pos.change = "innerLeft";
} }
pos.top = top; pos.left = left;
return pos; return pos;
} }
if (needAdaptHeight) { }
isNeedAdaptHeight = true; lrFirst = true;
} break;
tbFirst = true; case "innerRight":
break; if (!isNeedAdaptHeight) {
case "innerLeft": tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? extraWidth : extraHeight;
if (!isNeedAdaptHeight) { if (isInnerRightSpaceEnough(combo, popup, tW)) {
var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? 0 : extraHeight; left = getInnerRightPosition(combo, popup, tW).left;
if (isInnerLeftSpaceEnough(combo, popup, tW)) { if (topBottom[0] === "bottom") {
left = getInnerLeftPosition(combo, popup, tW).left; pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight);
if (topBottom[0] === "bottom") { } else {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight); pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
} else {
pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
}
pos.dir = `innerLeft,${pos.dir}`;
if (tbFirst) {
pos.change = "innerLeft";
}
pos.left = left;
return pos;
} }
} pos.dir = `innerLeft,${pos.dir}`;
lrFirst = true; if (tbFirst) {
break; pos.change = "innerRight";
case "innerRight":
if (!isNeedAdaptHeight) {
var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? extraWidth : extraHeight;
if (isInnerRightSpaceEnough(combo, popup, tW)) {
left = getInnerRightPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, tH, needAdaptHeight);
} else {
pos = getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
}
pos.dir = `innerLeft,${pos.dir}`;
if (tbFirst) {
pos.change = "innerRight";
}
pos.left = left;
return pos;
} }
pos.left = left;
return pos;
} }
break; }
default: break;
break; default:
break;
} }
} }
// 此处为四个方向放不下时挑空间最大的方向去放置, 也就是说我设置了弹出方向为"bottom,left", // 此处为四个方向放不下时挑空间最大的方向去放置, 也就是说我设置了弹出方向为"bottom,left",
// 最后发现实际弹出方向可能是"top,left",那么此时外界获取popup的方向应该是"top,left" // 最后发现实际弹出方向可能是"top,left",那么此时外界获取popup的方向应该是"top,left"
switch (directions[0]) { switch (directions[0]) {
case "left": case "left":
case "right": case "right":
if (isRightSpaceLarger(combo)) { if (isRightSpaceLarger(combo)) {
left = getRightAdaptPosition(combo, popup, extraWidth, container).left; left = getRightAdaptPosition(combo, popup, extraWidth, container).left;
firstDir = "right"; firstDir = "right";
} else { } else {
left = getLeftAdaptPosition(combo, popup, extraWidth, container).left; left = getLeftAdaptPosition(combo, popup, extraWidth, container).left;
firstDir = "left"; firstDir = "left";
} }
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = getTopAlignPosition(combo, popup, extraHeight, needAdaptHeight); pos = getTopAlignPosition(combo, popup, extraHeight, needAdaptHeight);
pos.left = left;
pos.dir = `${firstDir},${pos.dir}`;
return pos;
}
pos = getBottomAlignPosition(combo, popup, extraHeight, needAdaptHeight);
pos.left = left; pos.left = left;
pos.dir = `${firstDir},${pos.dir}`; pos.dir = `${firstDir},${pos.dir}`;
return pos; return pos;
default : }
if (isBottomSpaceLarger(combo)) { pos = getBottomAlignPosition(combo, popup, extraHeight, needAdaptHeight);
top = getBottomAdaptPosition(combo, popup, extraHeight, needAdaptHeight, container).top; pos.left = left;
firstDir = "bottom"; pos.dir = `${firstDir},${pos.dir}`;
} else {
top = getTopAdaptPosition(combo, popup, extraHeight, needAdaptHeight, container).top; return pos;
firstDir = "top"; default :
} if (isBottomSpaceLarger(combo)) {
if (leftRight[0] === "right") { top = getBottomAdaptPosition(combo, popup, extraHeight, needAdaptHeight, container).top;
pos = getLeftAlignPosition(combo, popup, extraWidth, container); firstDir = "bottom";
pos.top = top; } else {
pos.dir = `${firstDir},${pos.dir}`; top = getTopAdaptPosition(combo, popup, extraHeight, needAdaptHeight, container).top;
firstDir = "top";
return pos; }
} if (leftRight[0] === "right") {
pos = getRightAlignPosition(combo, popup, extraWidth, container); pos = getLeftAlignPosition(combo, popup, extraWidth, container);
pos.top = top; pos.top = top;
pos.dir = `${firstDir},${pos.dir}`; pos.dir = `${firstDir},${pos.dir}`;
return pos; return pos;
}
pos = getRightAlignPosition(combo, popup, extraWidth, container);
pos.top = top;
pos.dir = `${firstDir},${pos.dir}`;
return pos;
} }
} }
@ -715,26 +716,26 @@ export function getComboPosition(combo, popup, extraWidth, extraHeight, needAdap
popup.resetHeight && popup.resetHeight(maxHeight); popup.resetHeight && popup.resetHeight(maxHeight);
const position = getComboPositionByDirections(combo, popup, extraWidth, extraHeight, needAdaptHeight, directions || ["bottom", "top", "right", "left"], positionRelativeElement); const position = getComboPositionByDirections(combo, popup, extraWidth, extraHeight, needAdaptHeight, directions || ["bottom", "top", "right", "left"], positionRelativeElement);
switch (offsetStyle) { switch (offsetStyle) {
case "center": case "center":
if (position.change) { if (position.change) {
var p = getMiddleAdaptPosition(combo, popup, positionRelativeElement); const p = getMiddleAdaptPosition(combo, popup, positionRelativeElement);
position.top = p.top; position.top = p.top;
} else { } else {
var p = getCenterAdaptPosition(combo, popup, positionRelativeElement); const p = getCenterAdaptPosition(combo, popup, positionRelativeElement);
position.left = p.left; position.left = p.left;
} }
break; break;
case "middle": case "middle":
if (position.change) { if (position.change) {
var p = getCenterAdaptPosition(combo, popup, positionRelativeElement); const p = getCenterAdaptPosition(combo, popup, positionRelativeElement);
position.left = p.left; position.left = p.left;
} else { } else {
var p = getMiddleAdaptPosition(combo, popup, positionRelativeElement); const p = getMiddleAdaptPosition(combo, popup, positionRelativeElement);
position.top = p.top; position.top = p.top;
} }
break; break;
default: default:
break; break;
} }
if (needAdaptHeight === true) { if (needAdaptHeight === true) {
popup.resetHeight && popup.resetHeight(Math.min(viewportBounds.height - position.top - (positionRelativeElement ? positionRelativeElement.getBoundingClientRect().top : 0), maxHeight)); popup.resetHeight && popup.resetHeight(Math.min(viewportBounds.height - position.top - (positionRelativeElement ? positionRelativeElement.getBoundingClientRect().top : 0), maxHeight));

3
src/core/utils/color.js

@ -1,4 +1,5 @@
import { parseInt, parseFloat, isNull, isKey } from "../2.base"; import { parseInt, parseFloat, isNull, isKey } from "../2.base";
import * as DOMUtils from "../platform/web/dom";
export const DOM = { export const DOM = {
isColor(color) { isColor(color) {
@ -198,4 +199,6 @@ export const DOM = {
Math.floor(255 * (bgColor * (1 - A)) + G * A)},${ Math.floor(255 * (bgColor * (1 - A)) + G * A)},${
Math.floor(255 * (bgColor * (1 - A)) + B * A)})`; Math.floor(255 * (bgColor * (1 - A)) + B * A)})`;
}, },
...DOMUtils,
}; };

Loading…
Cancel
Save