Cauchy.Ke
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

Pull request #1870: 无JIRA任务 生命周期严格按照beforemount render mounted的顺序执行 

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

* commit 'e47da52d7b1f05073229600bb88a42840fdfd3b6':
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  布局大一统
  生命周期严格按照beforemount render mounted的顺序执行
master
guy 4 years ago
parent
1641169925 e47da52d7b
commit
937be63b0b
14 changed files with 151 additions and 91 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/base/single/label/abstract.label.js
  2. 5
      src/core/4.widget.js
  3. 79
      src/core/platform/web/config.js
  4. 4
      src/core/wrapper/layout/flex/flex.horizontal.js
  5. 4
      src/core/wrapper/layout/flex/flex.vertical.js
  6. 5
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
  7. 5
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
  8. 8
      src/core/wrapper/layout/layout.inline.js
  9. 2
      src/less/core/wrapper/flex.horizontal.less
  10. 62
      src/less/core/wrapper/flex.wrapper.horizontal.less
  11. 52
      src/less/core/wrapper/flex.wrapper.vertical.less
  12. 4
      src/less/core/wrapper/inline.center.less
  13. 4
      src/less/core/wrapper/inline.horizontal.less
  14. 4
      src/less/core/wrapper/inline.vertical.less

4
src/base/single/label/abstract.label.js
Unescape View File

@ -83,7 +83,7 @@
});
return;
}
if (o.whiteSpace == "normal") { // 1.3
if (o.whiteSpace === "normal") { // 1.3
BI.extend(json, {
hgap: o.hgap,
vgap: o.vgap,
@ -152,7 +152,7 @@
});
return;
}
if (o.whiteSpace == "normal") { // 1.7
if (o.whiteSpace === "normal") { // 1.7
BI.extend(json, {
hgap: o.hgap,
vgap: o.vgap,

5
src/core/4.widget.js
Unescape View File

@ -221,7 +221,10 @@
}
this._mount();
this.__async === true && isMounted && callLifeHook(this, "mounted");
if (this.__async === true && isMounted) {
callLifeHook(this, "mounted");
this.fireEvent(BI.Events.MOUNT);
}
},
_setParent: function (parent) {

79
src/core/platform/web/config.js
Unescape View File

@ -14,13 +14,9 @@ BI.prepares.push(function () {
return _isSupportFlex;
};
BI.Plugin.configWidget("bi.horizontal", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), isLessIE8 = isIE && BI.getIEVersion() < 8;
if (isLessIE8) {
return ob;
}
// 在横向自适应场景下我们需要使用table的自适应撑出滚动条的特性（flex处理不了这种情况）
// 主要出现在center_adapt或者horizontal_adapt的场景，或者主动设置horizontalAlign的场景
if (ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch) {
// if (ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch) {
// 虽然有两个元素以上的时候，有场景是控制一个显示一个隐藏的效果，还无法通过flex来实现
// var justOneItem = (ob.items && ob.items.length <= 1);
// // 在这种情况下，也可以通过flex支持该布局
@ -42,9 +38,9 @@ BI.prepares.push(function () {
// ? BI.HorizontalAlign.Left : ob.horizontalAlign
// });
// }
return BI.extend({}, ob, {type: "bi.table_adapt"});
}
if (supportFlex) {
// return BI.extend({}, ob, {type: "bi.table_adapt"});
// }
if (isSupportFlex()) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_horizontal"});
@ -56,41 +52,42 @@ BI.prepares.push(function () {
// type: "bi.inline"
// });
// }
return BI.extend({}, ob, {type: "bi.inline"});
// 否则采用table，不过horizontalAlign的right就不支持了。
return BI.extend({}, ob, {type: "bi.table_adapt"});
});
BI.Plugin.configWidget("bi.center_adapt", function (ob) {
var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var isAdapt = !ob.horizontalAlign || ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
if (!isAdapt || justOneItem) {
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrollx !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_center_adapt"});
// }
}
if (!BI.isIE() || BI.getIEVersion() >= 8) {
return BI.extend({}, ob, {type: "bi.inline_center_adapt"});
}
}
return ob;
});
BI.Plugin.configWidget("bi.vertical_adapt", function (ob) {
var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var isAdapt = ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
if (!isAdapt || justOneItem) {
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_vertical_adapt"});
// }
}
if (!BI.isIE() || BI.getIEVersion() > 8) {
return BI.extend({}, ob, {type: "bi.inline_vertical_adapt"});
}
}
return ob;
// return BI.extend({}, ob, {type: "bi.table_adapt"});
});
// BI.Plugin.configWidget("bi.center_adapt", function (ob) {
// var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
// var isAdapt = !ob.horizontalAlign || ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
// if (!isAdapt || justOneItem) {
// if (supportFlex) {
// // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// // if (!isIE || (ob.scrollable !== true && ob.scrollx !== true && ob.scrolly !== true)) {
// return BI.extend({}, ob, {type: "bi.flex_center_adapt"});
// // }
// }
// if (!BI.isIE() || BI.getIEVersion() >= 8) {
// return BI.extend({}, ob, {type: "bi.inline_center_adapt"});
// }
// }
// return ob;
// });
// BI.Plugin.configWidget("bi.vertical_adapt", function (ob) {
// var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
// var isAdapt = ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
// if (!isAdapt || justOneItem) {
// if (supportFlex) {
// // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// // if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
// return BI.extend({}, ob, {type: "bi.flex_vertical_adapt"});
// // }
// }
// if (!BI.isIE() || BI.getIEVersion() > 8) {
// return BI.extend({}, ob, {type: "bi.inline_vertical_adapt"});
// }
// }
// return ob;
// });
BI.Plugin.configWidget("bi.horizontal_adapt", function (ob) {
var justOneItem = (ob.items && ob.items.length <= 1);
if (!ob.verticalAlign || ob.verticalAlign === BI.VerticalAlign.TOP) {

4
src/core/wrapper/layout/flex/flex.horizontal.js
Unescape View File

@ -41,9 +41,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.columnSize[i] !== "auto") {
if (o.horizontalAlign === BI.HorizontalAlign.Stretch && o.columnSize[i] === "fill") {
w.element.addClass("f-f");
} else {
if (!(o.horizontalAlign === BI.HorizontalAlign.Stretch && (o.columnSize[i] === "fill" || o.columnSize[i] === ""))) {
w.element.addClass("f-s-n");
}
}

4
src/core/wrapper/layout/flex/flex.vertical.js
Unescape View File

@ -40,9 +40,7 @@ BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.rowSize[i] !== "auto") {
if (o.verticalAlign === BI.VerticalAlign.Stretch && o.rowSize[i] === "fill") {
w.element.addClass("f-f");
} else {
if (!(o.verticalAlign === BI.VerticalAlign.Stretch && (o.rowSize[i] === "fill" || o.rowSize[i] === ""))) {
w.element.addClass("f-s-n");
}
}

5
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
Unescape View File

@ -37,9 +37,7 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.columnSize[i] !== "auto") {
if (o.horizontalAlign === BI.HorizontalAlign.Stretch && o.columnSize[i] !== "") {
w.element.addClass("f-f");
} else {
if (!(o.horizontalAlign === BI.HorizontalAlign.Stretch && (o.columnSize[i] === "fill" || o.columnSize[i] === ""))) {
w.element.addClass("f-s-n");
}
}
@ -48,6 +46,7 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
}
if (o.columnSize[i] === "fill") {
w.element.addClass("f-f");
this.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {

5
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
Unescape View File

@ -37,9 +37,7 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.rowSize[i] !== "auto") {
if (o.verticalAlign === BI.VerticalAlign.Stretch && o.rowSize[i] !== "") {
w.element.addClass("f-f");
} else {
if (!(o.verticalAlign === BI.VerticalAlign.Stretch && (o.rowSize[i] === "fill" && o.rowSize[i] === ""))) {
w.element.addClass("f-s-n");
}
}
@ -48,6 +46,7 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
}
if (o.rowSize[i] === "fill") {
w.element.addClass("f-f");
this.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {

8
src/core/wrapper/layout/layout.inline.js
Unescape View File

@ -42,7 +42,7 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
"vertical-align": o.verticalAlign
});
w.element.addClass("i-item");
if (o.columnSize[i] === "fill") {
if (o.columnSize[i] === "fill" || o.columnSize[i] === "") {
var left = o.hgap + (item.lgap || 0) + (item.hgap || 0),
right = o.hgap + (item.rgap || 0) + (item.hgap || 0);
for (var k = 0; k < i; k++) {
@ -51,9 +51,11 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
for (var k = i + 1; k < o.columnSize.length; k++) {
right += o.hgap + o.lgap + o.rgap + o.columnSize[k];
}
w.element.css("min-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
if (o.columnSize[i] === "fill") {
w.element.css("min-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
}
if (o.horizontalAlign === BI.HorizontalAlign.Stretch) {
w.element.width(0);
w.element.css("max-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
}
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {

2
src/less/core/wrapper/flex.horizontal.less
Unescape View File

@ -73,7 +73,7 @@
-o-align-items: center;
align-items: center;
&.f-scroll-x {
&.f-scroll-y {
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */

62
src/less/core/wrapper/flex.wrapper.horizontal.less
Unescape View File

@ -76,6 +76,36 @@
}
}
&.f-f {
> .f-s-h-w {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
&.h-stretch {
-webkit-flex-shrink: 1;
-moz-flex-shrink: 1;
-ms-flex-shrink: 1;
flex-shrink: 1;
}
}
}
&.h-stretch {
> .f-s-h-w {
-webkit-flex-shrink: 1;
-moz-flex-shrink: 1;
-ms-flex-shrink: 1;
flex-shrink: 1;
max-width: 100%;
}
}
&.h-right {
/* 09版 */
-webkit-box-pack: flex-end;
@ -101,6 +131,18 @@
align-items: flex-end;
}
&.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
& .f-s-h-w, & .flex-scrollable-horizontal-layout-wrapper {
.flex();
.horizontal();
@ -138,14 +180,14 @@
&.v-middle {
///* 09版 */
//-webkit-box-align: center;
///* 12版 */
//-webkit-align-items: center;
//-moz-align-items: center;
//-ms-align-items: center;
//-ms-flex-align: center;
//-o-align-items: center;
//align-items: center;
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
//> .c-e {
// margin-top: auto !important;
@ -181,10 +223,6 @@
align-items: stretch;
}
&.h-stretch {
min-width: 100%;
}
&.h-center {
///* 09版 */
//-webkit-box-pack: center;

52
src/less/core/wrapper/flex.wrapper.vertical.less
Unescape View File

@ -75,6 +75,36 @@
}
}
&.f-f {
> .f-s-v-w {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
&.v-middle {
-webkit-flex-shrink: 1;
-moz-flex-shrink: 1;
-ms-flex-shrink: 1;
flex-shrink: 1;
}
}
}
&.v-stretch {
> .f-s-v-w {
-webkit-flex-shrink: 1;
-moz-flex-shrink: 1;
-ms-flex-shrink: 1;
flex-shrink: 1;
max-height: 100%;
}
}
&.h-right {
/* 09版 */
-webkit-box-align: flex-end;
@ -147,15 +177,15 @@
//min-width: 100%;
&.h-center {
///* 09版 */
//-webkit-box-align: center;
///* 12版 */
//-webkit-align-items: center;
//-moz-align-items: center;
//-ms-align-items: center;
//-ms-flex-align: center;
//-o-align-items: center;
//align-items: center;
/* 09版 */
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
//> .c-e {
// margin-left: auto !important;
@ -187,10 +217,6 @@
align-items: stretch;
}
&.v-stretch {
min-height: 100%;
}
&.v-middle {
///* 09版 */
//-webkit-box-pack: center;

4
src/less/core/wrapper/inline.center.less
Unescape View File

@ -1,4 +1,4 @@
.bi-i-c-a, .bi-inline-center-adapt-layout {
.bi-inline-center-adapt-layout {
&:after {
display: inline-block;
width: 0;
@ -7,7 +7,7 @@
content: ' ';
}
& > .i-c-a-item, & > .inline-center-adapt-item {
& > .inline-center-adapt-item {
display: inline-block;
&.x-icon {

4
src/less/core/wrapper/inline.horizontal.less
Unescape View File

@ -1,4 +1,4 @@
.bi-i-h-a, .bi-inline-horizontal-adapt-layout {
.bi-inline-horizontal-adapt-layout {
&:after {
display: inline-block;
width: 0;
@ -7,7 +7,7 @@
content: ' ';
}
& > .i-h-a-item, & > .inline-horizontal-adapt-item {
& > .inline-horizontal-adapt-item {
display: inline-block;
&.x-icon {

4
src/less/core/wrapper/inline.vertical.less
Unescape View File

@ -1,4 +1,4 @@
.bi-i-v-a, .bi-inline-vertical-adapt-layout {
.bi-inline-vertical-adapt-layout {
&:after {
display: inline-block;
width: 0;
@ -7,7 +7,7 @@
content: ' ';
}
& > .i-v-a-item, & > .inline-vertical-adapt-item {
& > .inline-vertical-adapt-item {
display: inline-block;
&.x-icon {

Write Preview
Loading…
Cancel
Save