fantasy-ngzorro 2.2.37 → 2.2.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/fantasy-ngzorro.umd.js +313 -222
- package/bundles/fantasy-ngzorro.umd.js.map +1 -1
- package/bundles/fantasy-ngzorro.umd.min.js +1 -1
- package/bundles/fantasy-ngzorro.umd.min.js.map +1 -1
- package/esm2015/hd-table/hd-table.component.js +234 -196
- package/esm2015/utils/hd-table-scroll.util.js +3 -2
- package/esm5/hd-table/hd-table.component.js +312 -222
- package/esm5/utils/hd-table-scroll.util.js +3 -2
- package/fantasy-ngzorro.metadata.json +1 -1
- package/fesm2015/fantasy-ngzorro.js +235 -196
- package/fesm2015/fantasy-ngzorro.js.map +1 -1
- package/fesm5/fantasy-ngzorro.js +313 -222
- package/fesm5/fantasy-ngzorro.js.map +1 -1
- package/hd-table/hd-table.component.d.ts +24 -21
- package/package.json +2 -2
- package/utils/hd-table-scroll.util.d.ts +4 -1
|
@@ -1126,7 +1126,8 @@ function getTableScrollXViewportWidth(nzTable, hostClass = "hd-table-container")
|
|
|
1126
1126
|
return getTableViewportWidth(nzTable, hostClass);
|
|
1127
1127
|
}
|
|
1128
1128
|
/**
|
|
1129
|
-
* 无数据或列宽未超出容器时不启用横向 scroll
|
|
1129
|
+
* 无数据或列宽未超出容器时不启用横向 scroll(表宽 100%、table-layout: auto)。
|
|
1130
|
+
* auto 布局下单元格 max-width 不生效,固定宽列会被均摊撑开;需要锁宽的场景见 hd-table 的横向布局。
|
|
1130
1131
|
* @param {?} nzTable
|
|
1131
1132
|
* @param {?} hasData
|
|
1132
1133
|
* @param {?=} colWidth
|
|
@@ -9124,6 +9125,67 @@ if (false) {
|
|
|
9124
9125
|
* @fileoverview added by tsickle
|
|
9125
9126
|
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
9126
9127
|
*/
|
|
9128
|
+
/**
|
|
9129
|
+
* 勾选列宽(px),与模板 nzWidth、less 兜底保持一致
|
|
9130
|
+
* @type {?}
|
|
9131
|
+
*/
|
|
9132
|
+
const SELECT_COL_WIDTH = 40;
|
|
9133
|
+
/**
|
|
9134
|
+
* 横向布局计算结果
|
|
9135
|
+
* @record
|
|
9136
|
+
*/
|
|
9137
|
+
function HdTableHorizontalLayout() { }
|
|
9138
|
+
if (false) {
|
|
9139
|
+
/**
|
|
9140
|
+
* 传给 nzScroll.x;只有列宽总和 <= 0 时为 null
|
|
9141
|
+
* @type {?}
|
|
9142
|
+
*/
|
|
9143
|
+
HdTableHorizontalLayout.prototype.scrollX;
|
|
9144
|
+
/**
|
|
9145
|
+
* 补到最后一列业务列上的宽度,列多时为 0
|
|
9146
|
+
* @type {?}
|
|
9147
|
+
*/
|
|
9148
|
+
HdTableHorizontalLayout.prototype.fluidExtra;
|
|
9149
|
+
/**
|
|
9150
|
+
* 实际渲染总宽 = 声明总宽 + fluidExtra
|
|
9151
|
+
* @type {?}
|
|
9152
|
+
*/
|
|
9153
|
+
HdTableHorizontalLayout.prototype.displayTotal;
|
|
9154
|
+
/**
|
|
9155
|
+
* 列少、靠补宽吃满容器,不需要真正横滚
|
|
9156
|
+
* @type {?}
|
|
9157
|
+
*/
|
|
9158
|
+
HdTableHorizontalLayout.prototype.isFluid;
|
|
9159
|
+
}
|
|
9160
|
+
/**
|
|
9161
|
+
* 列多(或量不到容器宽):scroll.x = 声明总宽,正常横滚
|
|
9162
|
+
* @param {?} declaredWidth
|
|
9163
|
+
* @return {?}
|
|
9164
|
+
*/
|
|
9165
|
+
function fixedLayout(declaredWidth) {
|
|
9166
|
+
return {
|
|
9167
|
+
scrollX: `${Math.ceil(declaredWidth)}px`,
|
|
9168
|
+
fluidExtra: 0,
|
|
9169
|
+
displayTotal: declaredWidth,
|
|
9170
|
+
isFluid: false,
|
|
9171
|
+
};
|
|
9172
|
+
}
|
|
9173
|
+
/**
|
|
9174
|
+
* 列少:scroll.x = 容器宽,差额补到最后一列业务列
|
|
9175
|
+
* @param {?} containerWidth
|
|
9176
|
+
* @param {?} declaredWidth
|
|
9177
|
+
* @return {?}
|
|
9178
|
+
*/
|
|
9179
|
+
function fluidLayout(containerWidth, declaredWidth) {
|
|
9180
|
+
/** @type {?} */
|
|
9181
|
+
const fluidExtra = Math.max(0, containerWidth - declaredWidth);
|
|
9182
|
+
return {
|
|
9183
|
+
scrollX: `${containerWidth}px`,
|
|
9184
|
+
fluidExtra,
|
|
9185
|
+
displayTotal: declaredWidth + fluidExtra,
|
|
9186
|
+
isFluid: true,
|
|
9187
|
+
};
|
|
9188
|
+
}
|
|
9127
9189
|
class HdTableComponent {
|
|
9128
9190
|
/**
|
|
9129
9191
|
* @param {?} hostEl
|
|
@@ -9213,21 +9275,19 @@ class HdTableComponent {
|
|
|
9213
9275
|
*/
|
|
9214
9276
|
this.virtualScrollActive = null;
|
|
9215
9277
|
/**
|
|
9216
|
-
*
|
|
9278
|
+
* 实际渲染列宽合计(含勾选/序号 + 补宽),合计 footer 表宽用
|
|
9217
9279
|
*/
|
|
9218
9280
|
this.tableColWidthTotal = 0;
|
|
9219
9281
|
/**
|
|
9220
|
-
*
|
|
9221
|
-
* 并设 scroll.x = 容器宽,避免表宽 100% 均摊撑开勾选列;拖拽改宽仍写 col.width。
|
|
9282
|
+
* 补到 fluidExtraTargetCol 上的宽度;只影响展示,不写回 col.width(列宽缓存、拖拽仍用声明宽)
|
|
9222
9283
|
*/
|
|
9223
9284
|
this.fluidExtraWidth = 0;
|
|
9224
9285
|
/**
|
|
9225
|
-
*
|
|
9226
|
-
* 用于关掉 ng-zorro fixed-header 带来的常驻 X 轴滚动条。
|
|
9286
|
+
* 列少、靠补宽吃满容器:模板据此加 hd-table--fluid-x,隐藏 fixed-header 常驻的横滚槽
|
|
9227
9287
|
*/
|
|
9228
9288
|
this.fluidHorizontal = false;
|
|
9229
9289
|
/**
|
|
9230
|
-
*
|
|
9290
|
+
* 接收补宽的列,缓存起来避免模板每个单元格都扫一遍 tableCols
|
|
9231
9291
|
*/
|
|
9232
9292
|
this.fluidExtraTargetCol = null;
|
|
9233
9293
|
/**
|
|
@@ -9434,10 +9494,8 @@ class HdTableComponent {
|
|
|
9434
9494
|
changes["tableData"]["currentValue"]["pageNumber"] !==
|
|
9435
9495
|
changes["tableData"]["previousValue"]["pageNumber"]) {
|
|
9436
9496
|
this.pendingResetScrollTop = true;
|
|
9437
|
-
// pageSize
|
|
9438
|
-
//
|
|
9439
|
-
// virtualScroll=false 时若这里跳过,空表初始化后的 fluid 不会补上,勾选列被撑开。
|
|
9440
|
-
// applyTableScrollMode(false) 在模式未变时只 dealScroll,不会强制重建清排序态。
|
|
9497
|
+
// 业务可能把 Page.pageSize 写成 content.length,换数据时就会走到这里,
|
|
9498
|
+
// 必须重算横向布局。滚动模式不变时不会重建,排序态不会被清掉。
|
|
9441
9499
|
this.applyTableScrollMode(false);
|
|
9442
9500
|
// 翻页/改 pageSize:主动多次复位,覆盖 CDK 异步渲染时序
|
|
9443
9501
|
this.scheduleResetTableBodyScrollTop();
|
|
@@ -9449,9 +9507,7 @@ class HdTableComponent {
|
|
|
9449
9507
|
}
|
|
9450
9508
|
if (changes["tableData"]) {
|
|
9451
9509
|
this.pendingResetScrollTop = true;
|
|
9452
|
-
//
|
|
9453
|
-
// 收款/付款编辑等页 [virtualScroll]=false + 异步灌数据:原先跳过会导致
|
|
9454
|
-
// 空表初始化后不再补宽,勾选列被均摊撑开。
|
|
9510
|
+
// 不论是否虚拟滚动,数据变化后都要重算横向布局
|
|
9455
9511
|
this.applyTableScrollMode(false);
|
|
9456
9512
|
// 数据更新后复位纵向滚动(含虚拟滚动场景)
|
|
9457
9513
|
this.scheduleResetTableBodyScrollTop();
|
|
@@ -9631,11 +9687,11 @@ class HdTableComponent {
|
|
|
9631
9687
|
return col.fixed === "left" ? `${col.fixedWidth || 0}px` : null;
|
|
9632
9688
|
}
|
|
9633
9689
|
/**
|
|
9634
|
-
* 开启合计时序号列的 left
|
|
9690
|
+
* 开启合计时序号列的 left(跟在勾选列后面)
|
|
9635
9691
|
* @return {?}
|
|
9636
9692
|
*/
|
|
9637
9693
|
get lineNumberLeft() {
|
|
9638
|
-
return this.showSelected ?
|
|
9694
|
+
return (this.showSelected ? SELECT_COL_WIDTH : 0) + "px";
|
|
9639
9695
|
}
|
|
9640
9696
|
/**
|
|
9641
9697
|
* @return {?}
|
|
@@ -9652,51 +9708,98 @@ class HdTableComponent {
|
|
|
9652
9708
|
return !(this.scroll && this.scroll.x);
|
|
9653
9709
|
}
|
|
9654
9710
|
/**
|
|
9655
|
-
*
|
|
9711
|
+
* @private
|
|
9712
|
+
* @param {?} col
|
|
9713
|
+
* @return {?}
|
|
9714
|
+
*/
|
|
9715
|
+
isColVisible(col) {
|
|
9716
|
+
return !!col && col.isShow !== false;
|
|
9717
|
+
}
|
|
9718
|
+
/**
|
|
9719
|
+
* 业务列声明宽:未配置时按 fixColWidth
|
|
9720
|
+
* @private
|
|
9721
|
+
* @param {?} col
|
|
9722
|
+
* @return {?}
|
|
9723
|
+
*/
|
|
9724
|
+
getColDeclaredWidth(col) {
|
|
9725
|
+
return col && col.width > 0 ? col.width : ColWidth.fixColWidth;
|
|
9726
|
+
}
|
|
9727
|
+
/**
|
|
9728
|
+
* 声明列宽合计:勾选列 + 序号列 + 可见业务列,不含补宽
|
|
9729
|
+
* @private
|
|
9730
|
+
* @return {?}
|
|
9731
|
+
*/
|
|
9732
|
+
getDeclaredColWidthTotal() {
|
|
9733
|
+
/** @type {?} */
|
|
9734
|
+
let total = 0;
|
|
9735
|
+
if (this.showSelected) {
|
|
9736
|
+
total += SELECT_COL_WIDTH;
|
|
9737
|
+
}
|
|
9738
|
+
if (this.showTableTotal) {
|
|
9739
|
+
total += this.lineNumberColWidth;
|
|
9740
|
+
}
|
|
9741
|
+
(this.tableCols || []).forEach((/**
|
|
9742
|
+
* @param {?} col
|
|
9743
|
+
* @return {?}
|
|
9744
|
+
*/
|
|
9745
|
+
(col) => {
|
|
9746
|
+
if (this.isColVisible(col)) {
|
|
9747
|
+
total += this.getColDeclaredWidth(col);
|
|
9748
|
+
}
|
|
9749
|
+
}));
|
|
9750
|
+
return total;
|
|
9751
|
+
}
|
|
9752
|
+
/**
|
|
9753
|
+
* 模板里 th / td / 合计 col 用的列宽:补宽目标列 = 声明宽 + fluidExtraWidth
|
|
9656
9754
|
* @param {?} col
|
|
9657
9755
|
* @return {?}
|
|
9658
9756
|
*/
|
|
9659
9757
|
getColDisplayWidth(col) {
|
|
9660
9758
|
/** @type {?} */
|
|
9661
|
-
const
|
|
9662
|
-
|
|
9663
|
-
|
|
9664
|
-
if (this.fluidExtraWidth <= 0 ||
|
|
9665
|
-
!col ||
|
|
9666
|
-
!this.fluidExtraTargetCol ||
|
|
9667
|
-
col !== this.fluidExtraTargetCol) {
|
|
9668
|
-
return base;
|
|
9759
|
+
const declared = this.getColDeclaredWidth(col);
|
|
9760
|
+
if (this.fluidExtraWidth > 0 && col && col === this.fluidExtraTargetCol) {
|
|
9761
|
+
return declared + this.fluidExtraWidth;
|
|
9669
9762
|
}
|
|
9670
|
-
return
|
|
9763
|
+
return declared;
|
|
9671
9764
|
}
|
|
9672
9765
|
/**
|
|
9673
|
-
*
|
|
9766
|
+
* 选出接收补宽的列:优先最后一列「非右侧固定」的可见列,
|
|
9767
|
+
* 避免把操作列等右固定列拉宽;全是右固定列时退回最后一列可见列。
|
|
9674
9768
|
* @private
|
|
9675
9769
|
* @return {?}
|
|
9676
9770
|
*/
|
|
9677
|
-
|
|
9678
|
-
|
|
9679
|
-
|
|
9680
|
-
|
|
9681
|
-
|
|
9682
|
-
|
|
9683
|
-
}
|
|
9684
|
-
for (let i = this.tableCols.length - 1; i >= 0; i--) {
|
|
9771
|
+
findFluidExtraTargetCol() {
|
|
9772
|
+
/** @type {?} */
|
|
9773
|
+
const cols = this.tableCols || [];
|
|
9774
|
+
/** @type {?} */
|
|
9775
|
+
let lastVisible = null;
|
|
9776
|
+
for (let i = cols.length - 1; i >= 0; i--) {
|
|
9685
9777
|
/** @type {?} */
|
|
9686
|
-
const
|
|
9687
|
-
if (
|
|
9688
|
-
|
|
9689
|
-
return;
|
|
9778
|
+
const col = cols[i];
|
|
9779
|
+
if (!this.isColVisible(col)) {
|
|
9780
|
+
continue;
|
|
9690
9781
|
}
|
|
9691
|
-
|
|
9692
|
-
|
|
9693
|
-
|
|
9694
|
-
|
|
9695
|
-
|
|
9696
|
-
this.fluidExtraTargetCol = c;
|
|
9697
|
-
return;
|
|
9782
|
+
if (col.fixed !== "right") {
|
|
9783
|
+
return col;
|
|
9784
|
+
}
|
|
9785
|
+
if (!lastVisible) {
|
|
9786
|
+
lastVisible = col;
|
|
9698
9787
|
}
|
|
9699
9788
|
}
|
|
9789
|
+
return lastVisible;
|
|
9790
|
+
}
|
|
9791
|
+
/**
|
|
9792
|
+
* 把横向布局结果写回组件状态(dealScroll / syncHorizontalScroll 共用)
|
|
9793
|
+
* @private
|
|
9794
|
+
* @param {?} layout
|
|
9795
|
+
* @return {?}
|
|
9796
|
+
*/
|
|
9797
|
+
applyHorizontalLayout(layout) {
|
|
9798
|
+
this.fluidExtraWidth = layout.fluidExtra;
|
|
9799
|
+
this.fluidHorizontal = layout.isFluid;
|
|
9800
|
+
this.fluidExtraTargetCol =
|
|
9801
|
+
layout.fluidExtra > 0 ? this.findFluidExtraTargetCol() : null;
|
|
9802
|
+
this.tableColWidthTotal = layout.displayTotal;
|
|
9700
9803
|
}
|
|
9701
9804
|
/**
|
|
9702
9805
|
* fluid → 100%;固定 → scroll.x(与表体同一套横向宽度)
|
|
@@ -9811,23 +9914,7 @@ class HdTableComponent {
|
|
|
9811
9914
|
// ng-zorro 只在 AfterViewInit 绑一次 header/body 的 scroll 同步;
|
|
9812
9915
|
// 若先以 y=null 创建再改成有 y,表头监听会丢,表现为列头不跟着横滚。
|
|
9813
9916
|
this.presetScrollBeforeRemount(useVirtual);
|
|
9814
|
-
this.
|
|
9815
|
-
this.cdr.markForCheck();
|
|
9816
|
-
setTimeout((/**
|
|
9817
|
-
* @return {?}
|
|
9818
|
-
*/
|
|
9819
|
-
() => {
|
|
9820
|
-
this.showTable = true;
|
|
9821
|
-
this.cdr.markForCheck();
|
|
9822
|
-
setTimeout((/**
|
|
9823
|
-
* @return {?}
|
|
9824
|
-
*/
|
|
9825
|
-
() => {
|
|
9826
|
-
this.dealScroll();
|
|
9827
|
-
this.cdr.markForCheck();
|
|
9828
|
-
this.afterTableRender(useVirtual);
|
|
9829
|
-
}));
|
|
9830
|
-
}));
|
|
9917
|
+
this.remountTable(useVirtual);
|
|
9831
9918
|
return;
|
|
9832
9919
|
}
|
|
9833
9920
|
/** @type {?} */
|
|
@@ -9839,32 +9926,40 @@ class HdTableComponent {
|
|
|
9839
9926
|
const nextHasX = !!(this.scroll && this.scroll.x);
|
|
9840
9927
|
/** @type {?} */
|
|
9841
9928
|
const nextHasY = !!(this.scroll && this.scroll.y);
|
|
9842
|
-
//
|
|
9843
|
-
// - y:ng-zorro 只在 AfterViewInit
|
|
9844
|
-
// - x
|
|
9845
|
-
// 不重建时勾选列仍按 auto 均摊撑开(收款编辑等异步灌数页)
|
|
9929
|
+
// scroll.x / scroll.y 从无到有(或反过来)时必须重建,原地改值不生效:
|
|
9930
|
+
// - y:ng-zorro 8 只在 AfterViewInit 绑一次表头/表体滚动同步,且决定表头是否拆成独立 table
|
|
9931
|
+
// - x:决定是否带 ant-table-fixed(table-layout: fixed),勾选列锁宽依赖它
|
|
9846
9932
|
if (prevHasY !== nextHasY || prevHasX !== nextHasX) {
|
|
9847
|
-
this.
|
|
9933
|
+
this.remountTable(useVirtual);
|
|
9934
|
+
return;
|
|
9935
|
+
}
|
|
9936
|
+
this.cdr.markForCheck();
|
|
9937
|
+
this.afterTableRender(useVirtual);
|
|
9938
|
+
}
|
|
9939
|
+
/**
|
|
9940
|
+
* 销毁并重建 nz-table:等 DOM 出来后再按真实容器宽重算一次横向布局
|
|
9941
|
+
* @private
|
|
9942
|
+
* @param {?} useVirtual
|
|
9943
|
+
* @return {?}
|
|
9944
|
+
*/
|
|
9945
|
+
remountTable(useVirtual) {
|
|
9946
|
+
this.showTable = false;
|
|
9947
|
+
this.cdr.markForCheck();
|
|
9948
|
+
setTimeout((/**
|
|
9949
|
+
* @return {?}
|
|
9950
|
+
*/
|
|
9951
|
+
() => {
|
|
9952
|
+
this.showTable = true;
|
|
9848
9953
|
this.cdr.markForCheck();
|
|
9849
9954
|
setTimeout((/**
|
|
9850
9955
|
* @return {?}
|
|
9851
9956
|
*/
|
|
9852
9957
|
() => {
|
|
9853
|
-
this.
|
|
9958
|
+
this.dealScroll();
|
|
9854
9959
|
this.cdr.markForCheck();
|
|
9855
|
-
|
|
9856
|
-
* @return {?}
|
|
9857
|
-
*/
|
|
9858
|
-
() => {
|
|
9859
|
-
this.dealScroll();
|
|
9860
|
-
this.cdr.markForCheck();
|
|
9861
|
-
this.afterTableRender(useVirtual);
|
|
9862
|
-
}));
|
|
9960
|
+
this.afterTableRender(useVirtual);
|
|
9863
9961
|
}));
|
|
9864
|
-
|
|
9865
|
-
}
|
|
9866
|
-
this.cdr.markForCheck();
|
|
9867
|
-
this.afterTableRender(useVirtual);
|
|
9962
|
+
}));
|
|
9868
9963
|
}
|
|
9869
9964
|
/**
|
|
9870
9965
|
* 重建前预设 scroll,保证 AfterViewInit 时 header/body 结构已正确
|
|
@@ -10582,27 +10677,27 @@ class HdTableComponent {
|
|
|
10582
10677
|
getVirtualScrollY(maxOffset) {
|
|
10583
10678
|
return `calc(100vh - ${maxOffset}px)`;
|
|
10584
10679
|
}
|
|
10585
|
-
|
|
10586
|
-
|
|
10587
|
-
|
|
10588
|
-
|
|
10589
|
-
|
|
10590
|
-
|
|
10591
|
-
|
|
10592
|
-
|
|
10593
|
-
|
|
10594
|
-
|
|
10595
|
-
|
|
10596
|
-
|
|
10597
|
-
*
|
|
10598
|
-
*
|
|
10599
|
-
* 补宽目标用 clientWidth
|
|
10680
|
+
/*
|
|
10681
|
+
* 横向布局(勾选列锁 40px 的关键)
|
|
10682
|
+
*
|
|
10683
|
+
* 勾选列只有在 table-layout: fixed 下才锁得住:ng-zorro 8 仅在 nzScroll.x 有值时
|
|
10684
|
+
* 给 table 加 ant-table-fixed;auto 布局下 table 宽 100%、每列都有 nzWidth,
|
|
10685
|
+
* 剩余空间会按比例摊到所有列(含勾选列),单元格上的 max-width 也不生效。
|
|
10686
|
+
* 所以只要有列(无论有没有数据)就一定设置 scroll.x:
|
|
10687
|
+
* - 列少:scroll.x = 容器宽,差额补到最后一列业务列(fluid,不出真横滚)
|
|
10688
|
+
* - 列多:scroll.x = 声明总宽,正常横滚
|
|
10689
|
+
* less 里勾选列的 40px 只是 fixed 布局下的兜底。
|
|
10690
|
+
*/
|
|
10691
|
+
/**
|
|
10692
|
+
* 按声明列宽合计 + 容器宽算出横向布局。
|
|
10693
|
+
* 判断「是否超宽」用 offsetWidth(含竖滚条槽),避免只因竖滚条就误开横滚;
|
|
10694
|
+
* 补宽目标用 clientWidth 并向下取整,避免表宽多 1px 逼出横滚条。
|
|
10600
10695
|
* @private
|
|
10601
10696
|
* @param {?} declaredColWidth
|
|
10602
10697
|
* @return {?}
|
|
10603
10698
|
*/
|
|
10604
10699
|
resolveHorizontalLayout(declaredColWidth) {
|
|
10605
|
-
if (
|
|
10700
|
+
if (declaredColWidth <= 0) {
|
|
10606
10701
|
return {
|
|
10607
10702
|
scrollX: null,
|
|
10608
10703
|
fluidExtra: 0,
|
|
@@ -10611,108 +10706,56 @@ class HdTableComponent {
|
|
|
10611
10706
|
};
|
|
10612
10707
|
}
|
|
10613
10708
|
/** @type {?} */
|
|
10614
|
-
let
|
|
10709
|
+
let compareWidth = this.nzTableComponent
|
|
10615
10710
|
? getTableScrollXViewportWidth(this.nzTableComponent)
|
|
10616
10711
|
: 0;
|
|
10617
|
-
//
|
|
10618
|
-
if (
|
|
10619
|
-
/** @type {?} */
|
|
10620
|
-
const hostW = ((/** @type {?} */ (this.hostEl.nativeElement))).offsetWidth;
|
|
10621
|
-
if (hostW > 0) {
|
|
10622
|
-
viewportCompare = hostW;
|
|
10623
|
-
}
|
|
10712
|
+
// 表体还没渲染出来(刚重建 / 在 spin 里)时用宿主宽兜底
|
|
10713
|
+
if (compareWidth <= 0 && this.hostEl && this.hostEl.nativeElement) {
|
|
10714
|
+
compareWidth = ((/** @type {?} */ (this.hostEl.nativeElement))).offsetWidth;
|
|
10624
10715
|
}
|
|
10625
|
-
|
|
10626
|
-
|
|
10627
|
-
|
|
10628
|
-
scrollX: `${Math.ceil(declaredColWidth)}px`,
|
|
10629
|
-
fluidExtra: 0,
|
|
10630
|
-
displayTotal: declaredColWidth,
|
|
10631
|
-
isFluid: false,
|
|
10632
|
-
};
|
|
10633
|
-
}
|
|
10634
|
-
/** @type {?} */
|
|
10635
|
-
const fillWidth = this.nzTableComponent
|
|
10636
|
-
? getTableViewportWidth(this.nzTableComponent)
|
|
10637
|
-
: 0;
|
|
10638
|
-
/** @type {?} */
|
|
10639
|
-
const target = Math.floor(fillWidth > 0 ? fillWidth : viewportCompare);
|
|
10640
|
-
/** @type {?} */
|
|
10641
|
-
const fluidExtra = Math.max(0, target - declaredColWidth);
|
|
10642
|
-
return {
|
|
10643
|
-
scrollX: `${target}px`,
|
|
10644
|
-
fluidExtra,
|
|
10645
|
-
displayTotal: declaredColWidth + fluidExtra,
|
|
10646
|
-
isFluid: true,
|
|
10647
|
-
};
|
|
10716
|
+
// 仍量不到(如宿主在 display:none 里):先按声明宽走 fixed,等 ResizeObserver 触发再转 fluid
|
|
10717
|
+
if (compareWidth <= 0) {
|
|
10718
|
+
return fixedLayout(declaredColWidth);
|
|
10648
10719
|
}
|
|
10649
|
-
//
|
|
10650
|
-
|
|
10651
|
-
|
|
10652
|
-
|
|
10653
|
-
|
|
10654
|
-
|
|
10655
|
-
|
|
10656
|
-
|
|
10720
|
+
// 1px 容差,避免亚像素误判
|
|
10721
|
+
if (declaredColWidth > compareWidth + 1) {
|
|
10722
|
+
return fixedLayout(declaredColWidth);
|
|
10723
|
+
}
|
|
10724
|
+
/** @type {?} */
|
|
10725
|
+
const fillWidth = this.nzTableComponent
|
|
10726
|
+
? getTableViewportWidth(this.nzTableComponent)
|
|
10727
|
+
: 0;
|
|
10728
|
+
/** @type {?} */
|
|
10729
|
+
const containerWidth = Math.floor(fillWidth > 0 ? fillWidth : compareWidth);
|
|
10730
|
+
return fluidLayout(containerWidth, declaredColWidth);
|
|
10657
10731
|
}
|
|
10658
10732
|
/**
|
|
10659
|
-
*
|
|
10733
|
+
* 表格渲染后按真实容器宽校正横向布局;只改 x,y 保持不变
|
|
10660
10734
|
* @private
|
|
10661
10735
|
* @return {?}
|
|
10662
10736
|
*/
|
|
10663
10737
|
syncHorizontalScroll() {
|
|
10664
|
-
/** @type {?} */
|
|
10665
|
-
let declared = 0;
|
|
10666
|
-
if (this.showSelected) {
|
|
10667
|
-
declared += 40;
|
|
10668
|
-
}
|
|
10669
|
-
if (this.showTableTotal) {
|
|
10670
|
-
declared += this.lineNumberColWidth;
|
|
10671
|
-
}
|
|
10672
|
-
if (this.tableCols) {
|
|
10673
|
-
this.tableCols.forEach((/**
|
|
10674
|
-
* @param {?} item
|
|
10675
|
-
* @return {?}
|
|
10676
|
-
*/
|
|
10677
|
-
(item) => {
|
|
10678
|
-
if (item && item.isShow !== false) {
|
|
10679
|
-
declared += item.width > 0 ? item.width : ColWidth.fixColWidth;
|
|
10680
|
-
}
|
|
10681
|
-
}));
|
|
10682
|
-
}
|
|
10683
10738
|
/** @type {?} */
|
|
10684
10739
|
const prevHasX = !!(this.scroll && this.scroll.x);
|
|
10685
10740
|
/** @type {?} */
|
|
10686
|
-
const layout = this.resolveHorizontalLayout(
|
|
10741
|
+
const layout = this.resolveHorizontalLayout(this.getDeclaredColWidthTotal());
|
|
10687
10742
|
/** @type {?} */
|
|
10688
|
-
const
|
|
10689
|
-
|
|
10690
|
-
|
|
10691
|
-
|
|
10692
|
-
|
|
10693
|
-
/** @type {?} */
|
|
10694
|
-
const sameExtra = this.fluidExtraWidth === layout.fluidExtra;
|
|
10695
|
-
/** @type {?} */
|
|
10696
|
-
const sameFluid = this.fluidHorizontal === layout.isFluid;
|
|
10697
|
-
if (sameX &&
|
|
10698
|
-
sameExtra &&
|
|
10699
|
-
sameFluid &&
|
|
10700
|
-
this.scroll &&
|
|
10701
|
-
this.scroll.y === currentY) {
|
|
10743
|
+
const unchanged = this.scroll &&
|
|
10744
|
+
this.scroll.x === layout.scrollX &&
|
|
10745
|
+
this.fluidExtraWidth === layout.fluidExtra &&
|
|
10746
|
+
this.fluidHorizontal === layout.isFluid;
|
|
10747
|
+
if (unchanged) {
|
|
10702
10748
|
setTimeout((/**
|
|
10703
10749
|
* @return {?}
|
|
10704
10750
|
*/
|
|
10705
10751
|
() => this.syncTotalFooterWithBody()));
|
|
10706
10752
|
return;
|
|
10707
10753
|
}
|
|
10708
|
-
this.
|
|
10709
|
-
this.
|
|
10710
|
-
this.refreshFluidExtraTargetCol();
|
|
10711
|
-
this.tableColWidthTotal = layout.displayTotal;
|
|
10712
|
-
this.scroll = { x: layout.scrollX, y: currentY };
|
|
10754
|
+
this.applyHorizontalLayout(layout);
|
|
10755
|
+
this.scroll = { x: layout.scrollX, y: this.scroll ? this.scroll.y : null };
|
|
10713
10756
|
this.cdr.markForCheck();
|
|
10714
|
-
//
|
|
10715
|
-
if (prevHasX !==
|
|
10757
|
+
// x 从无到有(或反过来)要重建才能切换 table-layout
|
|
10758
|
+
if (prevHasX !== !!layout.scrollX) {
|
|
10716
10759
|
this.applyTableScrollMode(true);
|
|
10717
10760
|
return;
|
|
10718
10761
|
}
|
|
@@ -10956,13 +10999,14 @@ class HdTableComponent {
|
|
|
10956
10999
|
* @return {?}
|
|
10957
11000
|
*/
|
|
10958
11001
|
dealScroll() {
|
|
11002
|
+
// 左侧固定列:从左往右累计偏移(勾选列、序号列在最前面)
|
|
10959
11003
|
/** @type {?} */
|
|
10960
|
-
let
|
|
11004
|
+
let leftOffset = 0;
|
|
10961
11005
|
if (this.showSelected) {
|
|
10962
|
-
|
|
11006
|
+
leftOffset += SELECT_COL_WIDTH;
|
|
10963
11007
|
}
|
|
10964
11008
|
if (this.showTableTotal) {
|
|
10965
|
-
|
|
11009
|
+
leftOffset += this.lineNumberColWidth;
|
|
10966
11010
|
}
|
|
10967
11011
|
this.tableCols.forEach((/**
|
|
10968
11012
|
* @param {?} item
|
|
@@ -10972,9 +11016,9 @@ class HdTableComponent {
|
|
|
10972
11016
|
if (!item.width) {
|
|
10973
11017
|
item.width = ColWidth.fixColWidth;
|
|
10974
11018
|
}
|
|
10975
|
-
if (item
|
|
10976
|
-
item.fixedWidth =
|
|
10977
|
-
|
|
11019
|
+
if (this.isColVisible(item)) {
|
|
11020
|
+
item.fixedWidth = leftOffset;
|
|
11021
|
+
leftOffset += item.width;
|
|
10978
11022
|
}
|
|
10979
11023
|
}));
|
|
10980
11024
|
// 右侧固定列:从右往左累计偏移,避免多列都 right:0 互相遮挡
|
|
@@ -10983,7 +11027,7 @@ class HdTableComponent {
|
|
|
10983
11027
|
for (let i = this.tableCols.length - 1; i >= 0; i--) {
|
|
10984
11028
|
/** @type {?} */
|
|
10985
11029
|
const item = this.tableCols[i];
|
|
10986
|
-
if (item
|
|
11030
|
+
if (!this.isColVisible(item)) {
|
|
10987
11031
|
continue;
|
|
10988
11032
|
}
|
|
10989
11033
|
if (item.fixed === "right") {
|
|
@@ -10995,11 +11039,8 @@ class HdTableComponent {
|
|
|
10995
11039
|
}
|
|
10996
11040
|
}
|
|
10997
11041
|
/** @type {?} */
|
|
10998
|
-
const layout = this.resolveHorizontalLayout(
|
|
10999
|
-
this.
|
|
11000
|
-
this.fluidHorizontal = layout.isFluid;
|
|
11001
|
-
this.refreshFluidExtraTargetCol();
|
|
11002
|
-
this.tableColWidthTotal = layout.displayTotal;
|
|
11042
|
+
const layout = this.resolveHorizontalLayout(this.getDeclaredColWidthTotal());
|
|
11043
|
+
this.applyHorizontalLayout(layout);
|
|
11003
11044
|
/** @type {?} */
|
|
11004
11045
|
const maxOffset = this.getScrollYMaxOffset();
|
|
11005
11046
|
/** @type {?} */
|
|
@@ -12201,24 +12242,22 @@ if (false) {
|
|
|
12201
12242
|
*/
|
|
12202
12243
|
HdTableComponent.prototype.virtualScrollActive;
|
|
12203
12244
|
/**
|
|
12204
|
-
*
|
|
12245
|
+
* 实际渲染列宽合计(含勾选/序号 + 补宽),合计 footer 表宽用
|
|
12205
12246
|
* @type {?}
|
|
12206
12247
|
*/
|
|
12207
12248
|
HdTableComponent.prototype.tableColWidthTotal;
|
|
12208
12249
|
/**
|
|
12209
|
-
*
|
|
12210
|
-
* 并设 scroll.x = 容器宽,避免表宽 100% 均摊撑开勾选列;拖拽改宽仍写 col.width。
|
|
12250
|
+
* 补到 fluidExtraTargetCol 上的宽度;只影响展示,不写回 col.width(列宽缓存、拖拽仍用声明宽)
|
|
12211
12251
|
* @type {?}
|
|
12212
12252
|
*/
|
|
12213
12253
|
HdTableComponent.prototype.fluidExtraWidth;
|
|
12214
12254
|
/**
|
|
12215
|
-
*
|
|
12216
|
-
* 用于关掉 ng-zorro fixed-header 带来的常驻 X 轴滚动条。
|
|
12255
|
+
* 列少、靠补宽吃满容器:模板据此加 hd-table--fluid-x,隐藏 fixed-header 常驻的横滚槽
|
|
12217
12256
|
* @type {?}
|
|
12218
12257
|
*/
|
|
12219
12258
|
HdTableComponent.prototype.fluidHorizontal;
|
|
12220
12259
|
/**
|
|
12221
|
-
*
|
|
12260
|
+
* 接收补宽的列,缓存起来避免模板每个单元格都扫一遍 tableCols
|
|
12222
12261
|
* @type {?}
|
|
12223
12262
|
* @private
|
|
12224
12263
|
*/
|