From 1b11f5cb22ff8f8ed57f8795695cd869d44458bd Mon Sep 17 00:00:00 2001 From: zsmj1994 Date: Tue, 6 Apr 2021 20:21:12 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E6=97=A0jira=20get=2038f0547=20(config.js)?= =?UTF-8?q?=20=E5=85=BC=E5=AE=B9=E5=B9=B3=E5=8F=B0final?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/platform/web/config.js | 79 +++++++++++++++++---------------- 1 file changed, 41 insertions(+), 38 deletions(-) diff --git a/src/core/platform/web/config.js b/src/core/platform/web/config.js index cf49db71c..030c03897 100644 --- a/src/core/platform/web/config.js +++ b/src/core/platform/web/config.js @@ -14,9 +14,13 @@ 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支持该布局 @@ -38,9 +42,9 @@ BI.prepares.push(function () { // ? BI.HorizontalAlign.Left : ob.horizontalAlign // }); // } - // return BI.extend({}, ob, {type: "bi.table_adapt"}); - // } - if (isSupportFlex()) { + return BI.extend({}, ob, {type: "bi.table_adapt"}); + } + if (supportFlex) { // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况 // if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) { return BI.extend({}, ob, {type: "bi.flex_horizontal"}); @@ -52,42 +56,41 @@ 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"}); + 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.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) { From e4dcbb9f8164827b5a4fd2379f94915bf69d613c Mon Sep 17 00:00:00 2001 From: zsmj1994 Date: Tue, 6 Apr 2021 20:22:16 +0800 Subject: [PATCH 2/3] =?UTF-8?q?Revert=20"DEC-18016=20fix:=20horizontal=5Fa?= =?UTF-8?q?dapt=E9=BB=98=E8=AE=A4horizontalAlign=E4=B8=BAleft"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This reverts commit e3545555 --- src/core/wrapper/layout/adapt/adapt.horizontal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/wrapper/layout/adapt/adapt.horizontal.js b/src/core/wrapper/layout/adapt/adapt.horizontal.js index d0663b2ee..8795a3cd4 100644 --- a/src/core/wrapper/layout/adapt/adapt.horizontal.js +++ b/src/core/wrapper/layout/adapt/adapt.horizontal.js @@ -8,7 +8,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, { return BI.extend(BI.HorizontalAdaptLayout.superclass.props.apply(this, arguments), { baseCls: "bi-h-a", verticalAlign: BI.VerticalAlign.Top, - horizontalAlign: BI.HorizontalAlign.Left, + horizontalAlign: BI.HorizontalAlign.Center, columnSize: [], scrollx: false, hgap: 0, From 178dc12b51bdd7a19b8c1051824038536eeec085 Mon Sep 17 00:00:00 2001 From: zsmj1994 Date: Tue, 6 Apr 2021 20:22:16 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E6=97=A0JIRA=20=20get=209b7224c=20(config.?= =?UTF-8?q?js)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/platform/web/config.js | 111 +++++++----------- .../wrapper/layout/adapt/adapt.horizontal.js | 2 +- src/less/base/single/icon.less | 6 +- 3 files changed, 48 insertions(+), 71 deletions(-) diff --git a/src/core/platform/web/config.js b/src/core/platform/web/config.js index 030c03897..ea1c29cf6 100644 --- a/src/core/platform/web/config.js +++ b/src/core/platform/web/config.js @@ -21,73 +21,40 @@ BI.prepares.push(function () { // 在横向自适应场景下我们需要使用table的自适应撑出滚动条的特性（flex处理不了这种情况） // 主要出现在center_adapt或者horizontal_adapt的场景，或者主动设置horizontalAlign的场景 if (ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch) { - // 虽然有两个元素以上的时候，有场景是控制一个显示一个隐藏的效果，还无法通过flex来实现 - // var justOneItem = (ob.items && ob.items.length <= 1); - // // 在这种情况下，也可以通过flex支持该布局 - // if (supportFlex) { - // // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况 - // // if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) { - // return BI.extend({}, ob, { - // type: "bi.flex_horizontal", - // horizontalAlign: !justOneItem && ob.horizontalAlign === BI.HorizontalAlign.Center - // ? BI.HorizontalAlign.Left : ob.horizontalAlign - // }); - // // } - // } - // // IE9以上可以使用calc计算布局 - // if (!isIE || BI.getIEVersion() > 8) { - // return BI.extend({}, ob, { - // type: "bi.inline", - // horizontalAlign: !justOneItem && ob.horizontalAlign === BI.HorizontalAlign.Center - // ? BI.HorizontalAlign.Left : ob.horizontalAlign - // }); - // } return BI.extend({}, ob, {type: "bi.table_adapt"}); } - if (supportFlex) { - // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况 - // if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) { + if (!isIE && supportFlex) { return BI.extend({}, ob, {type: "bi.flex_horizontal"}); - // } } - // // IE9以上采用inline - // if (!isIE || BI.getIEVersion() > 8) { - // return BI.extend({}, ob, { - // type: "bi.inline" + // // 解决使用inline_vertical_adapt的顺序问题 + // // 从右往左放置时，为了兼容，我们统一采用从右到左的放置方式 + // if (ob.horizontalAlign === BI.HorizontalAlign.Right) { + // return BI.extend({verticalAlign: BI.VerticalAlign.Top}, ob, { + // type: "bi.inline_vertical_adapt", + // items: ob.items && ob.items.reverse() // }); // } - // 否则采用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 isIE = BI.isIE(), 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)) { + if (!isIE && supportFlex) { 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 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 isIE = BI.isIE(), 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"}); + if (!isIE && supportFlex) { + return BI.extend({}, ob, {type: "bi.flex_vertical_center_adapt"}); } + return BI.extend({}, ob, {type: "bi.inline_vertical_adapt"}); } return ob; }); @@ -101,35 +68,45 @@ BI.prepares.push(function () { return ob; }); BI.Plugin.configWidget("bi.horizontal_float", function (ob) { - if (isSupportFlex()) { - // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况 - // if (!BI.isIE() || (ob.scrollable !== true && ob.scrollx !== true)) { + if (!BI.isIE() && isSupportFlex()) { return BI.extend({}, ob, {type: "bi.flex_horizontal_adapt"}); - // } } return BI.extend({}, ob, {type: "bi.inline_horizontal_adapt"}); }); - BI.Plugin.configWidget("bi.left_right_vertical_adapt", function (ob) { - if (isSupportFlex()) { - // IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况 - // if (!BI.isIE() || (ob.scrollable !== true && ob.scrolly !== true)) { - return BI.extend({}, ob, {type: "bi.flex_left_right_vertical_adapt"}); - // } - } - return ob; - }); + BI.Plugin.configWidget("bi.flex_horizontal", function (ob) { - if (ob.scrollable === true || ob.scrollx !== false) { - if (ob.hgap > 0 || ob.rgap > 0) {// flex中最后一个margin-right不生效 - return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal"}); - } + if (ob.scrollable === true || ob.scrolly === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal"}); } }); BI.Plugin.configWidget("bi.flex_vertical", function (ob) { if (ob.scrollable === true || ob.scrollx === true) { - if (ob.hgap > 0 || ob.rgap > 0) {// flex中最后一个margin-right不生效 - return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical"}); - } + return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical"}); + } + }); + BI.Plugin.configWidget("bi.flex_horizontal_adapt", function (ob) { + if (ob.scrollable === true || ob.scrollx === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal_adapt"}); + } + }); + BI.Plugin.configWidget("bi.flex_vertical_adapt", function (ob) { + if (ob.scrollable === true || ob.scrolly === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical_adapt"}); + } + }); + BI.Plugin.configWidget("bi.flex_horizontal_center_adapt", function (ob) { + if (ob.scrollable === true || ob.scrollx === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal_adapt"}); + } + }); + BI.Plugin.configWidget("bi.flex_vertical_center_adapt", function (ob) { + if (ob.scrollable === true || ob.scrolly === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical_adapt"}); + } + }); + BI.Plugin.configWidget("bi.flex_center_adapt", function (ob) { + if (ob.scrollable === true || ob.scrolly === true || ob.scrollx === true) { + return BI.extend({}, ob, {type: "bi.flex_scrollable_center_adapt"}); } }); diff --git a/src/core/wrapper/layout/adapt/adapt.horizontal.js b/src/core/wrapper/layout/adapt/adapt.horizontal.js index d0663b2ee..8795a3cd4 100644 --- a/src/core/wrapper/layout/adapt/adapt.horizontal.js +++ b/src/core/wrapper/layout/adapt/adapt.horizontal.js @@ -8,7 +8,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, { return BI.extend(BI.HorizontalAdaptLayout.superclass.props.apply(this, arguments), { baseCls: "bi-h-a", verticalAlign: BI.VerticalAlign.Top, - horizontalAlign: BI.HorizontalAlign.Left, + horizontalAlign: BI.HorizontalAlign.Center, columnSize: [], scrollx: false, hgap: 0, diff --git a/src/less/base/single/icon.less b/src/less/base/single/icon.less index 4de713164..3c1c307bc 100644 --- a/src/less/base/single/icon.less +++ b/src/less/base/single/icon.less @@ -1,5 +1,5 @@ .x-icon.b-font { - // todo 占位置,没问题后删掉文件 - //margin: auto; - //width: 100%; + // todo 删掉文件 + margin: auto; + width: 100%; }