fanruan
/
fineui
4
1
Fork 3
Code Issues 1 Pull Requests Releases Wiki Activity
Browse Source

BI-34242 弹窗提供可自适应body高度的配置

es6
windy 6 years ago
parent
575b8f5f98
commit
c7333a7242
15 changed files with 2103 additions and 921 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 83
      demo/js/core/popup/demo.popover.js
  2. 136
      dist/base.js
  3. 759
      dist/bundle.ie.js
  4. 68
      dist/bundle.ie.min.js
  5. 236
      dist/bundle.js
  6. 68
      dist/bundle.min.js
  7. 98
      dist/core.js
  8. 83
      dist/demo.js
  9. 759
      dist/fineui.ie.js
  10. 68
      dist/fineui.ie.min.js
  11. 234
      dist/fineui.js
  12. 60
      dist/fineui.min.js
  13. 234
      dist/fineui_without_jquery_polyfill.js
  14. 2
      dist/utils.min.js
  15. 136
      src/base/layer/layer.popover.js

83
demo/js/core/popup/demo.popover.js
Unescape View File

@ -7,18 +7,19 @@ Demo.Func = BI.inherit(BI.Widget, {
}, },
render: function () { render: function () {
var id = BI.UUID(); var id = BI.UUID();
var body;
return { return {
type: "bi.vertical", type: "bi.vertical",
vgap: 10, vgap: 10,
items: [{ items: [{
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(normal size)", text: "点击弹出Popover(normal size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
BI.Popovers.create(id, { BI.Popovers.create(id, {
type: "bi.bar_popover", type: "bi.bar_popover",
size: "big", size: "normal",
header: { header: {
type: "bi.label", type: "bi.label",
text: "这个是header" text: "这个是header"
@ -31,7 +32,7 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(small size)", text: "点击弹出Popover(small size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
@ -50,7 +51,7 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(big size)", text: "点击弹出Popover(big size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
@ -67,6 +68,80 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}).open(id); }).open(id);
} }
}, {
type: "bi.text_button",
text: "点击弹出Popover(normal size & adapt body区域高度是300)",
height: 30,
handler: function () {
BI.Popovers.remove(id);
BI.Popovers.create(id, {
type: "bi.bar_popover",
size: "normal",
logic: {
dynamic: true
},
header: {
type: "bi.label",
text: "这个是header"
},
body: {
type: "bi.vertical",
items: [{
type: "bi.button_group",
ref: function () {
body = this;
},
items: BI.map(BI.range(0, 10), function () {
return {
type: "bi.label",
text: "1",
height: 30
};
}),
layouts: [{
type: "bi.vertical"
}]
}]
}
}).open(id);
}
}, {
type: "bi.text_button",
text: "点击弹出Popover(small size & adapt body区域高度是900)",
height: 30,
handler: function () {
BI.Popovers.remove(id);
BI.Popovers.create(id, {
type: "bi.bar_popover",
size: "small",
logic: {
dynamic: true
},
header: {
type: "bi.label",
text: "这个是header"
},
body: {
type: "bi.vertical",
items: [{
type: "bi.button_group",
ref: function () {
body = this;
},
items: BI.map(BI.range(0, 30), function () {
return {
type: "bi.label",
text: "1",
height: 30
};
}),
layouts: [{
type: "bi.vertical"
}]
}]
}
}).open(id);
}
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(custom)", text: "点击弹出Popover(custom)",

136
dist/base.js vendored
Unescape View File

@ -5708,6 +5708,9 @@ BI.Popover = BI.inherit(BI.Widget, {
// width: 600, // width: 600,
// height: 500, // height: 500,
size: "normal", // small, normal, big size: "normal", // small, normal, big
logic: {
dynamic: false
},
header: null, header: null,
body: null, body: null,
footer: null footer: null
@ -5723,68 +5726,77 @@ BI.Popover = BI.inherit(BI.Widget, {
self.startX += deltaX; self.startX += deltaX;
self.startY += deltaY; self.startY += deltaY;
self.element.css({ self.element.css({
left: BI.clamp(self.startX, 0, W - size.width) + "px", left: BI.clamp(self.startX, 0, W - self.element.width()) + "px",
top: BI.clamp(self.startY, 0, H - size.height) + "px" top: BI.clamp(self.startY, 0, H - self.element.height()) + "px"
}); });
// BI-12134 没有什么特别好的方法 // BI-12134 没有什么特别好的方法
BI.Resizers._resize(); BI.Resizers._resize();
}, function () { }, function () {
self.tracker.releaseMouseMoves(); self.tracker.releaseMouseMoves();
}, _global); }, _global);
var items = { var items = [{
north: { el: {
el: { type: "bi.htape",
type: "bi.htape", cls: "bi-message-title bi-header-background",
cls: "bi-message-title bi-header-background", ref: function (_ref) {
ref: function (_ref) { self.dragger = _ref;
self.dragger = _ref;
},
items: [{
type: "bi.absolute",
items: [{
el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20,
top: 0,
right: 0,
bottom: 0
}]
}, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}]
}, },
height: this._constant.HEADER_HEIGHT items: [{
},
center: {
el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
el: BI.createWidget(o.body), el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20, left: 20,
top: 10, top: 0,
right: 20, right: 0,
bottom: 0 bottom: 0
}] }]
} }, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}],
height: this._constant.HEADER_HEIGHT
},
height: this._constant.HEADER_HEIGHT
}, {
el: o.logic.dynamic ? {
type: "bi.vertical",
cls: "popover-body",
ref: function () {
self.body = this;
},
hgap: 20,
tgap: 10,
items: [{
el: BI.createWidget(o.body)
}]
} : {
type: "bi.absolute",
items: [{
el: BI.createWidget(o.body),
left: 20,
top: 10,
right: 20,
bottom: 0
}]
} }
}; }];
if (o.footer) { if (o.footer) {
items.south = { items.push({
el: { el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
@ -5793,30 +5805,44 @@ BI.Popover = BI.inherit(BI.Widget, {
top: 0, top: 0,
right: 20, right: 20,
bottom: 0 bottom: 0
}] }],
height: 44
}, },
height: 44 height: 44
}; });
} }
var size = this._calculateSize(); var size = this._calculateSize();
return { return BI.extend({
type: "bi.border", type: o.logic.dynamic ? "bi.vertical" : "bi.vtape",
items: items, items: items,
width: size.width, width: size.width
}, o.logic.dynamic ? {
type: "bi.vertical",
scrolly: false
} : {
type: "bi.vtape",
height: size.height height: size.height
}; });
}, },
mounted: function () { mounted: function () {
var self = this; var self = this, o = this.options;
this.dragger.element.mousedown(function (e) { this.dragger.element.mousedown(function (e) {
var pos = self.element.offset(); var pos = self.element.offset();
self.startX = pos.left; self.startX = pos.left;
self.startY = pos.top; self.startY = pos.top;
self.tracker.captureMouseMoves(e); self.tracker.captureMouseMoves(e);
}); });
if (o.logic.dynamic) {
var height = this.element.height();
var compareHeight = BI.clamp(height, 200, 600) - (o.footer ? 84 : 44);
this.body.element.css({
"min-height": compareHeight,
"max-height": compareHeight
});
}
}, },
_calculateSize: function () { _calculateSize: function () {

759
dist/bundle.ie.js vendored
View File

File diff suppressed because it is too large Load Diff

68
dist/bundle.ie.min.js vendored
View File

File diff suppressed because one or more lines are too long

236
dist/bundle.js vendored
Unescape View File

@ -19586,7 +19586,7 @@ _.extend(BI, {
if(!_global.navigator) { if(!_global.navigator) {
return false; return false;
} }
return /safari/i.test(navigator.userAgent.toLowerCase()); return /safari/i.test(navigator.userAgent.toLowerCase()) && !/chrome/i.test(navigator.userAgent.toLowerCase());
}, },
isKhtml: function () { isKhtml: function () {
@ -31244,6 +31244,104 @@ BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
} }
}); });
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/** BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
* 自适应水平和垂直方向都居中容器
* @class BI.TableCenterAdaptLayout
* @extends BI.Layout
*/
BI.TableCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.TableCenterAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-table-center-adapt-layout",
columnSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.TableCenterAdaptLayout.superclass.render.apply(this, arguments);
this.$table = BI.Widget._renderEngine.createElement("<div>").css({
position: "relative",
display: "table",
width: "100%",
height: "100%",
"white-space": "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
if (!this.hasWidget(this._getChildName(i))) {
var w = BI.createWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
td = BI.createWidget({
type: "bi.default",
attributes: {
width: width
},
items: [w]
});
this.addWidget(this._getChildName(i), td);
} else {
td = this.getWidgetByName(this._getChildName(i));
td.element.attr("width", width);
}
td.element.css({"max-width": o.columnSize[i]});
if (i === 0) {
td.element.addClass("first-element");
}
td.element.css({
position: "relative",
display: "table-cell",
"vertical-align": "middle",
margin: "0",
padding: "0",
height: "100%"
});
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) + "px"
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": (i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) + "px"
});
}
return td;
},
appendFragment: function (frag) {
this.$table.append(frag);
this.element.append(this.$table);
},
resize: function () {
// console.log("center_adapt布局不需要resize");
},
populate: function (items) {
BI.TableCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.table_center_adapt", BI.TableCenterAdaptLayout);/**
*自适应水平和垂直方向都居中容器 *自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2. * Created by GUY on 2016/12/2.
* *
@ -41143,6 +41241,9 @@ BI.Popover = BI.inherit(BI.Widget, {
// width: 600, // width: 600,
// height: 500, // height: 500,
size: "normal", // small, normal, big size: "normal", // small, normal, big
logic: {
dynamic: false
},
header: null, header: null,
body: null, body: null,
footer: null footer: null
@ -41158,68 +41259,77 @@ BI.Popover = BI.inherit(BI.Widget, {
self.startX += deltaX; self.startX += deltaX;
self.startY += deltaY; self.startY += deltaY;
self.element.css({ self.element.css({
left: BI.clamp(self.startX, 0, W - size.width) + "px", left: BI.clamp(self.startX, 0, W - self.element.width()) + "px",
top: BI.clamp(self.startY, 0, H - size.height) + "px" top: BI.clamp(self.startY, 0, H - self.element.height()) + "px"
}); });
// BI-12134 没有什么特别好的方法 // BI-12134 没有什么特别好的方法
BI.Resizers._resize(); BI.Resizers._resize();
}, function () { }, function () {
self.tracker.releaseMouseMoves(); self.tracker.releaseMouseMoves();
}, _global); }, _global);
var items = { var items = [{
north: { el: {
el: { type: "bi.htape",
type: "bi.htape", cls: "bi-message-title bi-header-background",
cls: "bi-message-title bi-header-background", ref: function (_ref) {
ref: function (_ref) { self.dragger = _ref;
self.dragger = _ref;
},
items: [{
type: "bi.absolute",
items: [{
el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20,
top: 0,
right: 0,
bottom: 0
}]
}, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}]
}, },
height: this._constant.HEADER_HEIGHT items: [{
},
center: {
el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
el: BI.createWidget(o.body), el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20, left: 20,
top: 10, top: 0,
right: 20, right: 0,
bottom: 0 bottom: 0
}] }]
} }, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}],
height: this._constant.HEADER_HEIGHT
},
height: this._constant.HEADER_HEIGHT
}, {
el: o.logic.dynamic ? {
type: "bi.vertical",
cls: "popover-body",
ref: function () {
self.body = this;
},
hgap: 20,
tgap: 10,
items: [{
el: BI.createWidget(o.body)
}]
} : {
type: "bi.absolute",
items: [{
el: BI.createWidget(o.body),
left: 20,
top: 10,
right: 20,
bottom: 0
}]
} }
}; }];
if (o.footer) { if (o.footer) {
items.south = { items.push({
el: { el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
@ -41228,30 +41338,44 @@ BI.Popover = BI.inherit(BI.Widget, {
top: 0, top: 0,
right: 20, right: 20,
bottom: 0 bottom: 0
}] }],
height: 44
}, },
height: 44 height: 44
}; });
} }
var size = this._calculateSize(); var size = this._calculateSize();
return { return BI.extend({
type: "bi.border", type: o.logic.dynamic ? "bi.vertical" : "bi.vtape",
items: items, items: items,
width: size.width, width: size.width
}, o.logic.dynamic ? {
type: "bi.vertical",
scrolly: false
} : {
type: "bi.vtape",
height: size.height height: size.height
}; });
}, },
mounted: function () { mounted: function () {
var self = this; var self = this, o = this.options;
this.dragger.element.mousedown(function (e) { this.dragger.element.mousedown(function (e) {
var pos = self.element.offset(); var pos = self.element.offset();
self.startX = pos.left; self.startX = pos.left;
self.startY = pos.top; self.startY = pos.top;
self.tracker.captureMouseMoves(e); self.tracker.captureMouseMoves(e);
}); });
if (o.logic.dynamic) {
var height = this.element.height();
var compareHeight = BI.clamp(height, 200, 600) - (o.footer ? 84 : 44);
this.body.element.css({
"min-height": compareHeight,
"max-height": compareHeight
});
}
}, },
_calculateSize: function () { _calculateSize: function () {

68
dist/bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

98
dist/core.js vendored
Unescape View File

@ -31244,6 +31244,104 @@ BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
} }
}); });
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/** BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
* 自适应水平和垂直方向都居中容器
* @class BI.TableCenterAdaptLayout
* @extends BI.Layout
*/
BI.TableCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.TableCenterAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-table-center-adapt-layout",
columnSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.TableCenterAdaptLayout.superclass.render.apply(this, arguments);
this.$table = BI.Widget._renderEngine.createElement("<div>").css({
position: "relative",
display: "table",
width: "100%",
height: "100%",
"white-space": "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
if (!this.hasWidget(this._getChildName(i))) {
var w = BI.createWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
td = BI.createWidget({
type: "bi.default",
attributes: {
width: width
},
items: [w]
});
this.addWidget(this._getChildName(i), td);
} else {
td = this.getWidgetByName(this._getChildName(i));
td.element.attr("width", width);
}
td.element.css({"max-width": o.columnSize[i]});
if (i === 0) {
td.element.addClass("first-element");
}
td.element.css({
position: "relative",
display: "table-cell",
"vertical-align": "middle",
margin: "0",
padding: "0",
height: "100%"
});
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) + "px"
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": (i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) + "px"
});
}
return td;
},
appendFragment: function (frag) {
this.$table.append(frag);
this.element.append(this.$table);
},
resize: function () {
// console.log("center_adapt布局不需要resize");
},
populate: function (items) {
BI.TableCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.table_center_adapt", BI.TableCenterAdaptLayout);/**
*自适应水平和垂直方向都居中容器 *自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2. * Created by GUY on 2016/12/2.
* *

83
dist/demo.js vendored
Unescape View File

@ -6508,18 +6508,19 @@ Demo.Func = BI.inherit(BI.Widget, {
}, },
render: function () { render: function () {
var id = BI.UUID(); var id = BI.UUID();
var body;
return { return {
type: "bi.vertical", type: "bi.vertical",
vgap: 10, vgap: 10,
items: [{ items: [{
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(normal size)", text: "点击弹出Popover(normal size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
BI.Popovers.create(id, { BI.Popovers.create(id, {
type: "bi.bar_popover", type: "bi.bar_popover",
size: "big", size: "normal",
header: { header: {
type: "bi.label", type: "bi.label",
text: "这个是header" text: "这个是header"
@ -6532,7 +6533,7 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(small size)", text: "点击弹出Popover(small size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
@ -6551,7 +6552,7 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(big size)", text: "点击弹出Popover(big size & fixed)",
height: 30, height: 30,
handler: function () { handler: function () {
BI.Popovers.remove(id); BI.Popovers.remove(id);
@ -6568,6 +6569,80 @@ Demo.Func = BI.inherit(BI.Widget, {
} }
}).open(id); }).open(id);
} }
}, {
type: "bi.text_button",
text: "点击弹出Popover(normal size & adapt body区域高度是300)",
height: 30,
handler: function () {
BI.Popovers.remove(id);
BI.Popovers.create(id, {
type: "bi.bar_popover",
size: "normal",
logic: {
dynamic: true
},
header: {
type: "bi.label",
text: "这个是header"
},
body: {
type: "bi.vertical",
items: [{
type: "bi.button_group",
ref: function () {
body = this;
},
items: BI.map(BI.range(0, 10), function () {
return {
type: "bi.label",
text: "1",
height: 30
};
}),
layouts: [{
type: "bi.vertical"
}]
}]
}
}).open(id);
}
}, {
type: "bi.text_button",
text: "点击弹出Popover(small size & adapt body区域高度是900)",
height: 30,
handler: function () {
BI.Popovers.remove(id);
BI.Popovers.create(id, {
type: "bi.bar_popover",
size: "small",
logic: {
dynamic: true
},
header: {
type: "bi.label",
text: "这个是header"
},
body: {
type: "bi.vertical",
items: [{
type: "bi.button_group",
ref: function () {
body = this;
},
items: BI.map(BI.range(0, 30), function () {
return {
type: "bi.label",
text: "1",
height: 30
};
}),
layouts: [{
type: "bi.vertical"
}]
}]
}
}).open(id);
}
}, { }, {
type: "bi.text_button", type: "bi.text_button",
text: "点击弹出Popover(custom)", text: "点击弹出Popover(custom)",

759
dist/fineui.ie.js vendored
View File

File diff suppressed because it is too large Load Diff

68
dist/fineui.ie.min.js vendored
View File

File diff suppressed because one or more lines are too long

234
dist/fineui.js vendored
Unescape View File

@ -31486,6 +31486,104 @@ BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
} }
}); });
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/** BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
* 自适应水平和垂直方向都居中容器
* @class BI.TableCenterAdaptLayout
* @extends BI.Layout
*/
BI.TableCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.TableCenterAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-table-center-adapt-layout",
columnSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.TableCenterAdaptLayout.superclass.render.apply(this, arguments);
this.$table = BI.Widget._renderEngine.createElement("<div>").css({
position: "relative",
display: "table",
width: "100%",
height: "100%",
"white-space": "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
if (!this.hasWidget(this._getChildName(i))) {
var w = BI.createWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
td = BI.createWidget({
type: "bi.default",
attributes: {
width: width
},
items: [w]
});
this.addWidget(this._getChildName(i), td);
} else {
td = this.getWidgetByName(this._getChildName(i));
td.element.attr("width", width);
}
td.element.css({"max-width": o.columnSize[i]});
if (i === 0) {
td.element.addClass("first-element");
}
td.element.css({
position: "relative",
display: "table-cell",
"vertical-align": "middle",
margin: "0",
padding: "0",
height: "100%"
});
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) + "px"
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": (i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) + "px"
});
}
return td;
},
appendFragment: function (frag) {
this.$table.append(frag);
this.element.append(this.$table);
},
resize: function () {
// console.log("center_adapt布局不需要resize");
},
populate: function (items) {
BI.TableCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.table_center_adapt", BI.TableCenterAdaptLayout);/**
*自适应水平和垂直方向都居中容器 *自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2. * Created by GUY on 2016/12/2.
* *
@ -41385,6 +41483,9 @@ BI.Popover = BI.inherit(BI.Widget, {
// width: 600, // width: 600,
// height: 500, // height: 500,
size: "normal", // small, normal, big size: "normal", // small, normal, big
logic: {
dynamic: false
},
header: null, header: null,
body: null, body: null,
footer: null footer: null
@ -41400,68 +41501,77 @@ BI.Popover = BI.inherit(BI.Widget, {
self.startX += deltaX; self.startX += deltaX;
self.startY += deltaY; self.startY += deltaY;
self.element.css({ self.element.css({
left: BI.clamp(self.startX, 0, W - size.width) + "px", left: BI.clamp(self.startX, 0, W - self.element.width()) + "px",
top: BI.clamp(self.startY, 0, H - size.height) + "px" top: BI.clamp(self.startY, 0, H - self.element.height()) + "px"
}); });
// BI-12134 没有什么特别好的方法 // BI-12134 没有什么特别好的方法
BI.Resizers._resize(); BI.Resizers._resize();
}, function () { }, function () {
self.tracker.releaseMouseMoves(); self.tracker.releaseMouseMoves();
}, _global); }, _global);
var items = { var items = [{
north: { el: {
el: { type: "bi.htape",
type: "bi.htape", cls: "bi-message-title bi-header-background",
cls: "bi-message-title bi-header-background", ref: function (_ref) {
ref: function (_ref) { self.dragger = _ref;
self.dragger = _ref;
},
items: [{
type: "bi.absolute",
items: [{
el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20,
top: 0,
right: 0,
bottom: 0
}]
}, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}]
}, },
height: this._constant.HEADER_HEIGHT items: [{
},
center: {
el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
el: BI.createWidget(o.body), el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20, left: 20,
top: 10, top: 0,
right: 20, right: 0,
bottom: 0 bottom: 0
}] }]
} }, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}],
height: this._constant.HEADER_HEIGHT
},
height: this._constant.HEADER_HEIGHT
}, {
el: o.logic.dynamic ? {
type: "bi.vertical",
cls: "popover-body",
ref: function () {
self.body = this;
},
hgap: 20,
tgap: 10,
items: [{
el: BI.createWidget(o.body)
}]
} : {
type: "bi.absolute",
items: [{
el: BI.createWidget(o.body),
left: 20,
top: 10,
right: 20,
bottom: 0
}]
} }
}; }];
if (o.footer) { if (o.footer) {
items.south = { items.push({
el: { el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
@ -41470,30 +41580,44 @@ BI.Popover = BI.inherit(BI.Widget, {
top: 0, top: 0,
right: 20, right: 20,
bottom: 0 bottom: 0
}] }],
height: 44
}, },
height: 44 height: 44
}; });
} }
var size = this._calculateSize(); var size = this._calculateSize();
return { return BI.extend({
type: "bi.border", type: o.logic.dynamic ? "bi.vertical" : "bi.vtape",
items: items, items: items,
width: size.width, width: size.width
}, o.logic.dynamic ? {
type: "bi.vertical",
scrolly: false
} : {
type: "bi.vtape",
height: size.height height: size.height
}; });
}, },
mounted: function () { mounted: function () {
var self = this; var self = this, o = this.options;
this.dragger.element.mousedown(function (e) { this.dragger.element.mousedown(function (e) {
var pos = self.element.offset(); var pos = self.element.offset();
self.startX = pos.left; self.startX = pos.left;
self.startY = pos.top; self.startY = pos.top;
self.tracker.captureMouseMoves(e); self.tracker.captureMouseMoves(e);
}); });
if (o.logic.dynamic) {
var height = this.element.height();
var compareHeight = BI.clamp(height, 200, 600) - (o.footer ? 84 : 44);
this.body.element.css({
"min-height": compareHeight,
"max-height": compareHeight
});
}
}, },
_calculateSize: function () { _calculateSize: function () {

60
dist/fineui.min.js vendored
View File

File diff suppressed because one or more lines are too long

234
dist/fineui_without_jquery_polyfill.js vendored
Unescape View File

@ -20255,6 +20255,104 @@ BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
} }
}); });
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/** BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
* 自适应水平和垂直方向都居中容器
* @class BI.TableCenterAdaptLayout
* @extends BI.Layout
*/
BI.TableCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.TableCenterAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-table-center-adapt-layout",
columnSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.TableCenterAdaptLayout.superclass.render.apply(this, arguments);
this.$table = BI.Widget._renderEngine.createElement("<div>").css({
position: "relative",
display: "table",
width: "100%",
height: "100%",
"white-space": "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
if (!this.hasWidget(this._getChildName(i))) {
var w = BI.createWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
td = BI.createWidget({
type: "bi.default",
attributes: {
width: width
},
items: [w]
});
this.addWidget(this._getChildName(i), td);
} else {
td = this.getWidgetByName(this._getChildName(i));
td.element.attr("width", width);
}
td.element.css({"max-width": o.columnSize[i]});
if (i === 0) {
td.element.addClass("first-element");
}
td.element.css({
position: "relative",
display: "table-cell",
"vertical-align": "middle",
margin: "0",
padding: "0",
height: "100%"
});
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) + "px"
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": (i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) + "px"
});
}
return td;
},
appendFragment: function (frag) {
this.$table.append(frag);
this.element.append(this.$table);
},
resize: function () {
// console.log("center_adapt布局不需要resize");
},
populate: function (items) {
BI.TableCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.table_center_adapt", BI.TableCenterAdaptLayout);/**
*自适应水平和垂直方向都居中容器 *自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2. * Created by GUY on 2016/12/2.
* *
@ -29052,6 +29150,9 @@ BI.Popover = BI.inherit(BI.Widget, {
// width: 600, // width: 600,
// height: 500, // height: 500,
size: "normal", // small, normal, big size: "normal", // small, normal, big
logic: {
dynamic: false
},
header: null, header: null,
body: null, body: null,
footer: null footer: null
@ -29067,68 +29168,77 @@ BI.Popover = BI.inherit(BI.Widget, {
self.startX += deltaX; self.startX += deltaX;
self.startY += deltaY; self.startY += deltaY;
self.element.css({ self.element.css({
left: BI.clamp(self.startX, 0, W - size.width) + "px", left: BI.clamp(self.startX, 0, W - self.element.width()) + "px",
top: BI.clamp(self.startY, 0, H - size.height) + "px" top: BI.clamp(self.startY, 0, H - self.element.height()) + "px"
}); });
// BI-12134 没有什么特别好的方法 // BI-12134 没有什么特别好的方法
BI.Resizers._resize(); BI.Resizers._resize();
}, function () { }, function () {
self.tracker.releaseMouseMoves(); self.tracker.releaseMouseMoves();
}, _global); }, _global);
var items = { var items = [{
north: { el: {
el: { type: "bi.htape",
type: "bi.htape", cls: "bi-message-title bi-header-background",
cls: "bi-message-title bi-header-background", ref: function (_ref) {
ref: function (_ref) { self.dragger = _ref;
self.dragger = _ref;
},
items: [{
type: "bi.absolute",
items: [{
el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20,
top: 0,
right: 0,
bottom: 0
}]
}, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}]
}, },
height: this._constant.HEADER_HEIGHT items: [{
},
center: {
el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
el: BI.createWidget(o.body), el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20, left: 20,
top: 10, top: 0,
right: 20, right: 0,
bottom: 0 bottom: 0
}] }]
} }, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}],
height: this._constant.HEADER_HEIGHT
},
height: this._constant.HEADER_HEIGHT
}, {
el: o.logic.dynamic ? {
type: "bi.vertical",
cls: "popover-body",
ref: function () {
self.body = this;
},
hgap: 20,
tgap: 10,
items: [{
el: BI.createWidget(o.body)
}]
} : {
type: "bi.absolute",
items: [{
el: BI.createWidget(o.body),
left: 20,
top: 10,
right: 20,
bottom: 0
}]
} }
}; }];
if (o.footer) { if (o.footer) {
items.south = { items.push({
el: { el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
@ -29137,30 +29247,44 @@ BI.Popover = BI.inherit(BI.Widget, {
top: 0, top: 0,
right: 20, right: 20,
bottom: 0 bottom: 0
}] }],
height: 44
}, },
height: 44 height: 44
}; });
} }
var size = this._calculateSize(); var size = this._calculateSize();
return { return BI.extend({
type: "bi.border", type: o.logic.dynamic ? "bi.vertical" : "bi.vtape",
items: items, items: items,
width: size.width, width: size.width
}, o.logic.dynamic ? {
type: "bi.vertical",
scrolly: false
} : {
type: "bi.vtape",
height: size.height height: size.height
}; });
}, },
mounted: function () { mounted: function () {
var self = this; var self = this, o = this.options;
this.dragger.element.mousedown(function (e) { this.dragger.element.mousedown(function (e) {
var pos = self.element.offset(); var pos = self.element.offset();
self.startX = pos.left; self.startX = pos.left;
self.startY = pos.top; self.startY = pos.top;
self.tracker.captureMouseMoves(e); self.tracker.captureMouseMoves(e);
}); });
if (o.logic.dynamic) {
var height = this.element.height();
var compareHeight = BI.clamp(height, 200, 600) - (o.footer ? 84 : 44);
this.body.element.css({
"min-height": compareHeight,
"max-height": compareHeight
});
}
}, },
_calculateSize: function () { _calculateSize: function () {

2
dist/utils.min.js vendored
View File

File diff suppressed because one or more lines are too long

136
src/base/layer/layer.popover.js
Unescape View File

@ -19,6 +19,9 @@ BI.Popover = BI.inherit(BI.Widget, {
// width: 600, // width: 600,
// height: 500, // height: 500,
size: "normal", // small, normal, big size: "normal", // small, normal, big
logic: {
dynamic: false
},
header: null, header: null,
body: null, body: null,
footer: null footer: null
@ -34,68 +37,77 @@ BI.Popover = BI.inherit(BI.Widget, {
self.startX += deltaX; self.startX += deltaX;
self.startY += deltaY; self.startY += deltaY;
self.element.css({ self.element.css({
left: BI.clamp(self.startX, 0, W - size.width) + "px", left: BI.clamp(self.startX, 0, W - self.element.width()) + "px",
top: BI.clamp(self.startY, 0, H - size.height) + "px" top: BI.clamp(self.startY, 0, H - self.element.height()) + "px"
}); });
// BI-12134 没有什么特别好的方法 // BI-12134 没有什么特别好的方法
BI.Resizers._resize(); BI.Resizers._resize();
}, function () { }, function () {
self.tracker.releaseMouseMoves(); self.tracker.releaseMouseMoves();
}, _global); }, _global);
var items = { var items = [{
north: { el: {
el: { type: "bi.htape",
type: "bi.htape", cls: "bi-message-title bi-header-background",
cls: "bi-message-title bi-header-background", ref: function (_ref) {
ref: function (_ref) { self.dragger = _ref;
self.dragger = _ref;
},
items: [{
type: "bi.absolute",
items: [{
el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20,
top: 0,
right: 0,
bottom: 0
}]
}, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}]
}, },
height: this._constant.HEADER_HEIGHT items: [{
},
center: {
el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
el: BI.createWidget(o.body), el: BI.isPlainObject(o.header) ? BI.createWidget(o.header, {
extraCls: "bi-font-bold"
}) : {
type: "bi.label",
cls: "bi-font-bold",
height: this._constant.HEADER_HEIGHT,
text: o.header,
textAlign: "left"
},
left: 20, left: 20,
top: 10, top: 0,
right: 20, right: 0,
bottom: 0 bottom: 0
}] }]
} }, {
el: {
type: "bi.icon_button",
cls: "bi-message-close close-font",
height: this._constant.HEADER_HEIGHT,
handler: function () {
self.close();
}
},
width: 56
}],
height: this._constant.HEADER_HEIGHT
},
height: this._constant.HEADER_HEIGHT
}, {
el: o.logic.dynamic ? {
type: "bi.vertical",
cls: "popover-body",
ref: function () {
self.body = this;
},
hgap: 20,
tgap: 10,
items: [{
el: BI.createWidget(o.body)
}]
} : {
type: "bi.absolute",
items: [{
el: BI.createWidget(o.body),
left: 20,
top: 10,
right: 20,
bottom: 0
}]
} }
}; }];
if (o.footer) { if (o.footer) {
items.south = { items.push({
el: { el: {
type: "bi.absolute", type: "bi.absolute",
items: [{ items: [{
@ -104,30 +116,44 @@ BI.Popover = BI.inherit(BI.Widget, {
top: 0, top: 0,
right: 20, right: 20,
bottom: 0 bottom: 0
}] }],
height: 44
}, },
height: 44 height: 44
}; });
} }
var size = this._calculateSize(); var size = this._calculateSize();
return { return BI.extend({
type: "bi.border", type: o.logic.dynamic ? "bi.vertical" : "bi.vtape",
items: items, items: items,
width: size.width, width: size.width
}, o.logic.dynamic ? {
type: "bi.vertical",
scrolly: false
} : {
type: "bi.vtape",
height: size.height height: size.height
}; });
}, },
mounted: function () { mounted: function () {
var self = this; var self = this, o = this.options;
this.dragger.element.mousedown(function (e) { this.dragger.element.mousedown(function (e) {
var pos = self.element.offset(); var pos = self.element.offset();
self.startX = pos.left; self.startX = pos.left;
self.startY = pos.top; self.startY = pos.top;
self.tracker.captureMouseMoves(e); self.tracker.captureMouseMoves(e);
}); });
if (o.logic.dynamic) {
var height = this.element.height();
var compareHeight = BI.clamp(height, 200, 600) - (o.footer ? 84 : 44);
this.body.element.css({
"min-height": compareHeight,
"max-height": compareHeight
});
}
}, },
_calculateSize: function () { _calculateSize: function () {

Write Preview
Loading…
Cancel
Save