fantasy-ngzorro 2.1.22 → 2.1.24

package/bundles/fantasy-ngzorro.umd.js

@@ -497,7 +497,7 @@
         HdDetailFormComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'hd-detail-form',
-                        template: "<nz-content class=\"hd-detail-form-container\">\n  <nz-descriptions [nzColumn]=\"nzColumn\">\n    <ng-container *ngFor=\"let col of formCols\">\n      <nz-descriptions-item *ngIf=\"!col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{(col.value === '0' || col.value === 0 || col.value\n          )? col.value : '&lt;\u7A7A&gt;'}}</span>\n      </nz-descriptions-item>\n      <nz-descriptions-item *ngIf=\"col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"col.clickText\">\n          {{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}\n          <a (click)=\"triggerEvent(col.click || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText }}</a>\n        </span>\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"!col.clickText\">\n          <a (click)=\"triggerEvent(col.click || null)\">{{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}</a>\n        </span>\n      </nz-descriptions-item>\n    </ng-container>\n  </nz-descriptions>\n</nz-content>\n",
+                        template: "<nz-content class=\"hd-detail-form-container\">\n  <nz-descriptions [nzColumn]=\"nzColumn\">\n    <ng-container *ngFor=\"let col of formCols\">\n      <nz-descriptions-item *ngIf=\"!col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{(col.value === '0' || col.value === 0 || col.value\n          )? col.value : '&lt;\u7A7A&gt;'}}</span>\n      </nz-descriptions-item>\n      <nz-descriptions-item *ngIf=\"col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"col.clickText\">\n          {{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}\n          <a (click)=\"triggerEvent(col.click || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText }}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"!col.clickText\">\n          <a (click)=\"triggerEvent(col.click || null)\">{{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n      </nz-descriptions-item>\n    </ng-container>\n  </nz-descriptions>\n</nz-content>\n",
                         styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-detail-form-container{font-size:14px}.hd-detail-form-container ::ng-deep td.ant-descriptions-item{vertical-align:top;padding-top:6px!important;padding-bottom:6px!important;padding-left:0!important;font-size:14px}.hd-detail-form-container ::ng-deep .ant-descriptions-item-label{color:#4b504e;font-size:14px}.hd-detail-form-container ::ng-deep .ant-descriptions-item-content{word-break:break-all;color:rgba(0,0,0,.85);font-weight:400;font-size:14px}.hd-detail-form-container ::ng-deep a{font-size:14px}.hd-detail-form-container ::ng-deep td{white-space:unset!important}"]
                     }] }
         ];
@@ -707,6 +707,10 @@
         HdOption.prototype.clickText;
         /** @type {?} */
         HdOption.prototype.click;
+        /** @type {?} */
+        HdOption.prototype.clickText1;
+        /** @type {?} */
+        HdOption.prototype.click1;
     }
     var SelectOption = /** @class */ (function () {
         function SelectOption() {
@@ -836,18 +840,109 @@
         CascaderOption.prototype.options;
     }
 
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /**
+     * @record
+     */
+    function HdTableScrollConfig() { }
+    if (false) {
+        /** @type {?|undefined} */
+        HdTableScrollConfig.prototype.x;
+        /** @type {?|undefined} */
+        HdTableScrollConfig.prototype.y;
+    }
+    /**
+     * @param {?} nzTable
+     * @param {?=} hostClass
+     * @return {?}
+     */
+    function getTableViewportWidth(nzTable, hostClass) {
+        if (hostClass === void 0) { hostClass = "hd-table-container"; }
+        if (!nzTable || !nzTable.tableMainElement) {
+            return 0;
+        }
+        /** @type {?} */
+        var tableMain = (/** @type {?} */ (nzTable.tableMainElement.nativeElement));
+        /** @type {?} */
+        var wrapper = (/** @type {?} */ (tableMain.closest(".ant-table-wrapper")));
+        if (wrapper && wrapper.clientWidth > 0) {
+            return wrapper.clientWidth;
+        }
+        /** @type {?} */
+        var host = (/** @type {?} */ (tableMain.closest("." + hostClass)));
+        if (host && host.clientWidth > 0) {
+            return host.clientWidth;
+        }
+        return 0;
+    }
+    /**
+     * @param {?} nzTable
+     * @return {?}
+     */
+    function measureTableColWidth(nzTable) {
+        if (!nzTable || !nzTable.tableMainElement) {
+            return 0;
+        }
+        /** @type {?} */
+        var tableMain = (/** @type {?} */ (nzTable.tableMainElement.nativeElement));
+        /** @type {?} */
+        var headerTable = (/** @type {?} */ (tableMain.querySelector(".ant-table-header table")));
+        if (headerTable && headerTable.scrollWidth > 0) {
+            return headerTable.scrollWidth;
+        }
+        /** @type {?} */
+        var bodyTable = (/** @type {?} */ (tableMain.querySelector(".ant-table-body table")));
+        return bodyTable ? bodyTable.scrollWidth : 0;
+    }
+    /**
+     * 无数据或列宽未超出容器时不启用横向 scroll
+     * @param {?} nzTable
+     * @param {?} hasData
+     * @param {?=} colWidth
+     * @return {?}
+     */
+    function resolveAutoTableScroll(nzTable, hasData, colWidth) {
+        if (!hasData) {
+            return null;
+        }
+        /** @type {?} */
+        var width = colWidth != null && colWidth > 0
+            ? colWidth
+            : measureTableColWidth(nzTable);
+        if (width <= 0) {
+            return null;
+        }
+        /** @type {?} */
+        var viewportWidth = getTableViewportWidth(nzTable);
+        if (viewportWidth > 0) {
+            return width > viewportWidth ? { x: width + "px" } : null;
+        }
+        if (typeof window !== "undefined" && width > window.innerWidth - 32) {
+            return { x: width + "px" };
+        }
+        return null;
+    }
+
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     var HdDetailLinesComponent = /** @class */ (function () {
-        function HdDetailLinesComponent() {
+        function HdDetailLinesComponent(cdr) {
+            this.cdr = cdr;
             this.showSelected = false;
             this.allowDrop = false;
             this.showSearch = false;
             // 不传递这个字段时默认为查询所有字段是否有匹配的
             this.searchFields = [];
-            this.scroll = { x: "1px" };
+            /**
+             * 不传则按列宽与容器宽度自动计算横向滚动
+             */
+            this.scroll = null;
+            this.tableScroll = null;
             this.selectField = "billNumber";
             this.selectEvent = new core.EventEmitter();
             // 合计区域
@@ -878,6 +973,16 @@
             this.isFilterData = false;
             this.storeFormLinesData = []; // 缓存的总的列表数据
         }
+        Object.defineProperty(HdDetailLinesComponent.prototype, "effectiveScroll", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this.scroll != null ? this.scroll : this.tableScroll;
+            },
+            enumerable: true,
+            configurable: true
+        });
         /**
          * @return {?}
          */
@@ -890,6 +995,15 @@
             this.countSelected();
             this.calculateTotal();
         };
+        /**
+         * @return {?}
+         */
+        HdDetailLinesComponent.prototype.ngAfterViewInit = /**
+         * @return {?}
+         */
+        function () {
+            this.scheduleSyncHorizontalScroll();
+        };
         /**
          * @param {?} changes
          * @return {?}
@@ -911,6 +1025,51 @@
             }
             this.countSelected();
             this.calculateTotal();
+            if (changes["lines"] || changes["showSelected"]) {
+                this.scheduleSyncHorizontalScroll();
+            }
+        };
+        /**
+         * @private
+         * @return {?}
+         */
+        HdDetailLinesComponent.prototype.scheduleSyncHorizontalScroll = /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            if (this.scroll != null) {
+                return;
+            }
+            setTimeout((/**
+             * @return {?}
+             */
+            function () { return _this.syncHorizontalScroll(); }));
+        };
+        /**
+         * @private
+         * @return {?}
+         */
+        HdDetailLinesComponent.prototype.syncHorizontalScroll = /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            if (this.scroll != null) {
+                return;
+            }
+            /** @type {?} */
+            var hasData = !!(this.displayLines && this.displayLines.length);
+            /** @type {?} */
+            var nextScroll = resolveAutoTableScroll(this.nzTableComponent, hasData);
+            /** @type {?} */
+            var nextX = nextScroll ? nextScroll.x : null;
+            if (this.tableScroll && this.tableScroll.x === nextX) {
+                return;
+            }
+            this.tableScroll = nextScroll;
+            this.cdr.markForCheck();
         };
         /**
          * @private
@@ -961,6 +1120,7 @@
             this.tableLoading = false;
             this.countSelected();
             this.calculateTotal();
+            this.scheduleSyncHorizontalScroll();
         };
         // 全局性的搜索（涵盖页面上所有的可视文字）
         // 全局性的搜索（涵盖页面上所有的可视文字）
@@ -1038,6 +1198,7 @@
             this.tableLoading = false;
             this.countSelected();
             this.calculateTotal();
+            this.scheduleSyncHorizontalScroll();
         };
         /**
          * @private
@@ -1218,13 +1379,16 @@
         HdDetailLinesComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "hd-detail-lines",
-                        template: "<ng-container>\n  <hd-button-group *ngIf=\"showSearch\">\n    <ng-template #buttonGroupLeft>\n      <nz-input-group [nzSuffix]=\"suffixIconSearch\">\n        <input type=\"text\" nz-input (keyup.enter)=\"searchLines()\" placeholder=\"\u8BF7\u8F93\u5165\u5185\u5BB9\u641C\u7D22\" style=\"width: 300px;\"\n          [(ngModel)]=\"filterStr\" />\n      </nz-input-group>\n      <ng-template #suffixIconSearch>\n        <i nz-icon nzType=\"search\" (click)=\"searchLines()\"></i>\n      </ng-template>\n    </ng-template>\n  </hd-button-group>\n\n  <hd-space *ngIf=\"showSearch\" background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n\n  <nz-table #hdTable [nzScroll]=\"scroll\" class=\"hd-table-container\" nzShowSizeChanger\n    [nzFrontPagination]=\"hdFrontPagination\" [nzShowQuickJumper]=\"hdFrontPagination\" [nzShowTotal]=\"tableTotalTemplate\"\n    nzSize=\"middle\" [nzData]=\"displayLines\" [nzLoading]=\"tableLoading\" [(nzPageSize)]=\"tablePageSize\"\n    [nzPageSizeOptions]=\"[ 10, 50, 100, 200, 500, 1000 ]\"\n    (nzCurrentPageDataChange)=\"showSelected ? currentPageDataChange($event) : null\">\n    <thead>\n      <tr>\n        <th *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox [(nzChecked)]=\"isAllDisplayDataChecked\"\n          [nzIndeterminate]=\"isIndeterminate\" (nzCheckedChange)=\"checkAll($event)\"></th>\n        <ng-container *ngTemplateOutlet=\"detailLineHead\"></ng-container>\n      </tr>\n    </thead>\n    <tbody *ngIf=\"!allowDrop;else allowDropTemplate\">\n      <tr *ngFor=\"let data of hdTable.data;index as i\">\n        <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n          [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n        <ng-container *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: i}\"></ng-container>\n      </tr>\n      <!-- \u5408\u8BA1\u533A\u57DF -->\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showSelected\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n            (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n    <ng-template #allowDropTemplate>\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\n        <tr *ngFor=\"let data of hdTable.data;index as i\" cdkDrag>\n          <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n            [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n          <ng-container *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: i}\"></ng-container>\n        </tr>\n        <!-- \u5408\u8BA1\u533A\u57DF -->\n        <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n          <td *ngIf=\"showSelected\"></td>\n          <td>\u5408\u8BA1</td>\n          <ng-container *ngFor=\"let totalOption of totalOptionList\">\n            <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n              (totalOption.value || totalOption.value\n              === 0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n              LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n          </ng-container>\n        </tr>\n      </tbody>\n    </ng-template>\n    <ng-template #tableTotalTemplate>\n      \u5171 {{displayLines.length}} \u6761\u6570\u636E\n    </ng-template>\n  </nz-table>\n</ng-container>\n",
-                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}"]
+                        template: "<ng-container>\n  <hd-button-group *ngIf=\"showSearch\">\n    <ng-template #buttonGroupLeft>\n      <nz-input-group [nzSuffix]=\"suffixIconSearch\">\n        <input type=\"text\" nz-input (keyup.enter)=\"searchLines()\" placeholder=\"\u8BF7\u8F93\u5165\u5185\u5BB9\u641C\u7D22\" style=\"width: 300px;\"\n          [(ngModel)]=\"filterStr\" />\n      </nz-input-group>\n      <ng-template #suffixIconSearch>\n        <i nz-icon nzType=\"search\" (click)=\"searchLines()\"></i>\n      </ng-template>\n    </ng-template>\n  </hd-button-group>\n\n  <hd-space *ngIf=\"showSearch\" background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n\n  <nz-table #hdTable [nzScroll]=\"effectiveScroll\" class=\"hd-table-container\" nzShowSizeChanger\n    [nzFrontPagination]=\"hdFrontPagination\" [nzShowQuickJumper]=\"hdFrontPagination\" [nzShowTotal]=\"tableTotalTemplate\"\n    nzSize=\"middle\" [nzData]=\"displayLines\" [nzLoading]=\"tableLoading\" [(nzPageSize)]=\"tablePageSize\"\n    [nzPageSizeOptions]=\"[ 10, 50, 100, 200, 500, 1000 ]\"\n    (nzCurrentPageDataChange)=\"showSelected ? currentPageDataChange($event) : null\">\n    <thead>\n      <tr>\n        <th *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox [(nzChecked)]=\"isAllDisplayDataChecked\"\n          [nzIndeterminate]=\"isIndeterminate\" (nzCheckedChange)=\"checkAll($event)\"></th>\n        <ng-container *ngTemplateOutlet=\"detailLineHead\"></ng-container>\n      </tr>\n    </thead>\n    <tbody *ngIf=\"!allowDrop;else allowDropTemplate\">\n      <tr *ngFor=\"let data of hdTable.data;index as i\">\n        <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n          [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n        <ng-container *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: i}\"></ng-container>\n      </tr>\n      <!-- \u5408\u8BA1\u533A\u57DF -->\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showSelected\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n            (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n    <ng-template #allowDropTemplate>\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\n        <tr *ngFor=\"let data of hdTable.data;index as i\" cdkDrag>\n          <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n            [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n          <ng-container *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: i}\"></ng-container>\n        </tr>\n        <!-- \u5408\u8BA1\u533A\u57DF -->\n        <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n          <td *ngIf=\"showSelected\"></td>\n          <td>\u5408\u8BA1</td>\n          <ng-container *ngFor=\"let totalOption of totalOptionList\">\n            <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n              (totalOption.value || totalOption.value\n              === 0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n              LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n          </ng-container>\n        </tr>\n      </tbody>\n    </ng-template>\n    <ng-template #tableTotalTemplate>\n      \u5171 {{displayLines.length}} \u6761\u6570\u636E\n    </ng-template>\n  </nz-table>\n</ng-container>\n",
+                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}.hd-table-container ::ng-deep .ant-table-fixed-right{right:0!important}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr>td,.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-thead>tr>th{background:#f5f8f6}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr:hover>td{background:#fff}"]
                     }] }
         ];
         /** @nocollapse */
-        HdDetailLinesComponent.ctorParameters = function () { return []; };
+        HdDetailLinesComponent.ctorParameters = function () { return [
+            { type: core.ChangeDetectorRef }
+        ]; };
         HdDetailLinesComponent.propDecorators = {
+            nzTableComponent: [{ type: core.ViewChild, args: ["hdTable", { static: false },] }],
             lines: [{ type: core.Input }],
             showSelected: [{ type: core.Input }],
             allowDrop: [{ type: core.Input }],
@@ -1261,6 +1425,8 @@
         return HdDetailLinesComponent;
     }());
     if (false) {
+        /** @type {?} */
+        HdDetailLinesComponent.prototype.nzTableComponent;
         /** @type {?} */
         HdDetailLinesComponent.prototype.lines;
         /** @type {?} */
@@ -1271,9 +1437,14 @@
         HdDetailLinesComponent.prototype.showSearch;
         /** @type {?} */
         HdDetailLinesComponent.prototype.searchFields;
-        /** @type {?} */
+        /**
+         * 不传则按列宽与容器宽度自动计算横向滚动
+         * @type {?}
+         */
         HdDetailLinesComponent.prototype.scroll;
         /** @type {?} */
+        HdDetailLinesComponent.prototype.tableScroll;
+        /** @type {?} */
         HdDetailLinesComponent.prototype.selectField;
         /** @type {?} */
         HdDetailLinesComponent.prototype.selectedField;
@@ -1329,6 +1500,11 @@
         HdDetailLinesComponent.prototype.isFilterData;
         /** @type {?} */
         HdDetailLinesComponent.prototype.storeFormLinesData;
+        /**
+         * @type {?}
+         * @private
+         */
+        HdDetailLinesComponent.prototype.cdr;
     }
 
     /**
@@ -1363,7 +1539,8 @@
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     var HdDetailLinesPageComponent = /** @class */ (function () {
-        function HdDetailLinesPageComponent() {
+        function HdDetailLinesPageComponent(cdr) {
+            this.cdr = cdr;
             this.lines = [];
             /**
              * 与 hd-table 一致，可传 Page 对象；未传 lines 时使用 tableData.content
@@ -1371,7 +1548,11 @@
             this.tableData = new Page();
             this.showSelected = false;
             this.allowDrop = false;
-            this.scroll = { x: "1px" };
+            /**
+             * 不传则按列宽与容器宽度自动计算横向滚动
+             */
+            this.scroll = null;
+            this.tableScroll = null;
             this.selectField = "billNumber";
             this.selectEvent = new core.EventEmitter();
             this.showTotal = false;
@@ -1391,6 +1572,16 @@
             this.mapOfCheckList = {};
             this.isCrossPageSelectLocal = false;
         }
+        Object.defineProperty(HdDetailLinesPageComponent.prototype, "effectiveScroll", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this.scroll != null ? this.scroll : this.tableScroll;
+            },
+            enumerable: true,
+            configurable: true
+        });
         /**
          * @return {?}
          */
@@ -1404,6 +1595,15 @@
             this.countSelected();
             this.calculateTotal();
         };
+        /**
+         * @return {?}
+         */
+        HdDetailLinesPageComponent.prototype.ngAfterViewInit = /**
+         * @return {?}
+         */
+        function () {
+            this.scheduleSyncHorizontalScroll();
+        };
         /**
          * @param {?} changes
          * @return {?}
@@ -1431,6 +1631,53 @@
             }
             this.countSelected();
             this.calculateTotal();
+            if (changes["lines"] ||
+                changes["tableData"] ||
+                changes["showSelected"]) {
+                this.scheduleSyncHorizontalScroll();
+            }
+        };
+        /**
+         * @private
+         * @return {?}
+         */
+        HdDetailLinesPageComponent.prototype.scheduleSyncHorizontalScroll = /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            if (this.scroll != null) {
+                return;
+            }
+            setTimeout((/**
+             * @return {?}
+             */
+            function () { return _this.syncHorizontalScroll(); }));
+        };
+        /**
+         * @private
+         * @return {?}
+         */
+        HdDetailLinesPageComponent.prototype.syncHorizontalScroll = /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            if (this.scroll != null) {
+                return;
+            }
+            /** @type {?} */
+            var hasData = !!(this.displayLines && this.displayLines.length);
+            /** @type {?} */
+            var nextScroll = resolveAutoTableScroll(this.nzTableComponent, hasData);
+            /** @type {?} */
+            var nextX = nextScroll ? nextScroll.x : null;
+            if (this.tableScroll && this.tableScroll.x === nextX) {
+                return;
+            }
+            this.tableScroll = nextScroll;
+            this.cdr.markForCheck();
         };
         Object.defineProperty(HdDetailLinesPageComponent.prototype, "displayLines", {
             get: /**
@@ -1672,13 +1919,16 @@
         HdDetailLinesPageComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "hd-detail-lines-page",
-                        template: "<ng-container>\n  <nz-table #hdTable [nzScroll]=\"scroll\" class=\"hd-table-container\" nzShowSizeChanger nzShowQuickJumper\n    nzFrontPagination=\"false\" nzSize=\"middle\" [nzData]=\"displayLines\" [nzTotal]=\"totalCount\"\n    [(nzPageIndex)]=\"tablePageIndex\" [(nzPageSize)]=\"tablePageSize\" [nzLoading]=\"tableLoading\"\n    [nzPageSizeOptions]=\"[ 10, 50, 100, 200, 500, 1000 ]\" (nzPageIndexChange)=\"onPageIndexChange($event)\"\n    (nzPageSizeChange)=\"onPageSizeChange($event)\" [nzShowTotal]=\"tableTotalTemplate\"\n    (nzCurrentPageDataChange)=\"showSelected ? currentPageDataChange($event) : null\">\n    <thead>\n      <tr>\n        <th *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox [(nzChecked)]=\"isAllDisplayDataChecked\"\n          [nzIndeterminate]=\"isIndeterminate\" (nzCheckedChange)=\"checkAll($event)\"></th>\n        <ng-container *ngTemplateOutlet=\"detailLineHead\"></ng-container>\n      </tr>\n    </thead>\n    <tbody *ngIf=\"!allowDrop;else allowDropTemplate\">\n      <tr *ngFor=\"let data of hdTable.data;index as i\">\n        <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n          [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n        <ng-container\n          *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: getRowIndex(i)}\"></ng-container>\n      </tr>\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showSelected\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n            (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n    <ng-template #allowDropTemplate>\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\n        <tr *ngFor=\"let data of hdTable.data;index as i\" cdkDrag>\n          <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n            [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n          <ng-container\n            *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: getRowIndex(i)}\"></ng-container>\n        </tr>\n        <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n          <td *ngIf=\"showSelected\"></td>\n          <td>\u5408\u8BA1</td>\n          <ng-container *ngFor=\"let totalOption of totalOptionList\">\n            <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n              (totalOption.value || totalOption.value\n              === 0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n              LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n          </ng-container>\n        </tr>\n      </tbody>\n    </ng-template>\n    <ng-template #tableTotalTemplate>\n      \u5171 {{totalCount}} \u6761\u6570\u636E\n    </ng-template>\n  </nz-table>\n</ng-container>\n",
-                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}"]
+                        template: "<ng-container>\n  <nz-table #hdTable [nzScroll]=\"effectiveScroll\" class=\"hd-table-container\" nzShowSizeChanger nzShowQuickJumper\n    nzFrontPagination=\"false\" nzSize=\"middle\" [nzData]=\"displayLines\" [nzTotal]=\"totalCount\"\n    [(nzPageIndex)]=\"tablePageIndex\" [(nzPageSize)]=\"tablePageSize\" [nzLoading]=\"tableLoading\"\n    [nzPageSizeOptions]=\"[ 10, 50, 100, 200, 500, 1000 ]\" (nzPageIndexChange)=\"onPageIndexChange($event)\"\n    (nzPageSizeChange)=\"onPageSizeChange($event)\" [nzShowTotal]=\"tableTotalTemplate\"\n    (nzCurrentPageDataChange)=\"showSelected ? currentPageDataChange($event) : null\">\n    <thead>\n      <tr>\n        <th *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox [(nzChecked)]=\"isAllDisplayDataChecked\"\n          [nzIndeterminate]=\"isIndeterminate\" (nzCheckedChange)=\"checkAll($event)\"></th>\n        <ng-container *ngTemplateOutlet=\"detailLineHead\"></ng-container>\n      </tr>\n    </thead>\n    <tbody *ngIf=\"!allowDrop;else allowDropTemplate\">\n      <tr *ngFor=\"let data of hdTable.data;index as i\">\n        <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n          [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n        <ng-container\n          *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: getRowIndex(i)}\"></ng-container>\n      </tr>\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showSelected\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n            (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n    <ng-template #allowDropTemplate>\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\n        <tr *ngFor=\"let data of hdTable.data;index as i\" cdkDrag>\n          <td *ngIf=\"showSelected\" nzWidth=\"40px\" nzLeft=\"0px\" nzShowCheckbox\n            [(nzChecked)]=\"mapOfCheckedId[data[selectField]]\" (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n          <ng-container\n            *ngTemplateOutlet=\"detailLineBody;context:{$implicit: data, index: getRowIndex(i)}\"></ng-container>\n        </tr>\n        <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n          <td *ngIf=\"showSelected\"></td>\n          <td>\u5408\u8BA1</td>\n          <ng-container *ngFor=\"let totalOption of totalOptionList\">\n            <td *ngIf=\"!totalOption.isHide\" [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{\n              (totalOption.value || totalOption.value\n              === 0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n              LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n          </ng-container>\n        </tr>\n      </tbody>\n    </ng-template>\n    <ng-template #tableTotalTemplate>\n      \u5171 {{totalCount}} \u6761\u6570\u636E\n    </ng-template>\n  </nz-table>\n</ng-container>\n",
+                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}.hd-table-container ::ng-deep .ant-table-fixed-right{right:0!important}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr>td,.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-thead>tr>th{background:#f5f8f6}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr:hover>td{background:#fff}"]
                     }] }
         ];
         /** @nocollapse */
-        HdDetailLinesPageComponent.ctorParameters = function () { return []; };
+        HdDetailLinesPageComponent.ctorParameters = function () { return [
+            { type: core.ChangeDetectorRef }
+        ]; };
         HdDetailLinesPageComponent.propDecorators = {
+            nzTableComponent: [{ type: core.ViewChild, args: ["hdTable", { static: false },] }],
             lines: [{ type: core.Input }],
             tableData: [{ type: core.Input }],
             showSelected: [{ type: core.Input }],
@@ -1715,6 +1965,8 @@
         return HdDetailLinesPageComponent;
     }());
     if (false) {
+        /** @type {?} */
+        HdDetailLinesPageComponent.prototype.nzTableComponent;
         /** @type {?} */
         HdDetailLinesPageComponent.prototype.lines;
         /**
@@ -1726,9 +1978,14 @@
         HdDetailLinesPageComponent.prototype.showSelected;
         /** @type {?} */
         HdDetailLinesPageComponent.prototype.allowDrop;
-        /** @type {?} */
+        /**
+         * 不传则按列宽与容器宽度自动计算横向滚动
+         * @type {?}
+         */
         HdDetailLinesPageComponent.prototype.scroll;
         /** @type {?} */
+        HdDetailLinesPageComponent.prototype.tableScroll;
+        /** @type {?} */
         HdDetailLinesPageComponent.prototype.selectField;
         /** @type {?} */
         HdDetailLinesPageComponent.prototype.selectedField;
@@ -1772,6 +2029,11 @@
         HdDetailLinesPageComponent.prototype.mapOfCheckList;
         /** @type {?} */
         HdDetailLinesPageComponent.prototype.isCrossPageSelectLocal;
+        /**
+         * @type {?}
+         * @private
+         */
+        HdDetailLinesPageComponent.prototype.cdr;
     }
 
     /**
@@ -8136,60 +8398,32 @@
          * @private
          * @return {?}
          */
-        HdTableComponent.prototype.getTableViewportWidth = /**
+        HdTableComponent.prototype.hasTableData = /**
          * @private
          * @return {?}
          */
         function () {
-            if (!this.nzTableComponent || !this.nzTableComponent.tableMainElement) {
-                return 0;
-            }
-            /** @type {?} */
-            var tableMain = (/** @type {?} */ (this.nzTableComponent.tableMainElement
-                .nativeElement));
-            /** @type {?} */
-            var wrapper = (/** @type {?} */ (tableMain.closest(".ant-table-wrapper")));
-            if (wrapper && wrapper.clientWidth > 0) {
-                return wrapper.clientWidth;
-            }
-            /** @type {?} */
-            var host = (/** @type {?} */ (tableMain.closest(".hd-table-container")));
-            if (host && host.clientWidth > 0) {
-                return host.clientWidth;
-            }
-            return 0;
+            return !!(this.tableData &&
+                this.tableData.content &&
+                this.tableData.content.length);
         };
         /** 列总宽超出外层容器才启用横向 scroll（不能用 table 自身宽度，会被 scroll.x 撑宽） */
         /**
          * 列总宽超出外层容器才启用横向 scroll（不能用 table 自身宽度，会被 scroll.x 撑宽）
          * @private
          * @param {?} colWidth
-         * @param {?} useVirtual
          * @return {?}
          */
         HdTableComponent.prototype.resolveScrollX = /**
          * 列总宽超出外层容器才启用横向 scroll（不能用 table 自身宽度，会被 scroll.x 撑宽）
          * @private
          * @param {?} colWidth
-         * @param {?} useVirtual
          * @return {?}
          */
-        function (colWidth, useVirtual) {
-            if (colWidth <= 0) {
-                return useVirtual ? "1px" : null;
-            }
-            if (useVirtual) {
-                return colWidth + "px";
-            }
+        function (colWidth) {
             /** @type {?} */
-            var viewportWidth = this.getTableViewportWidth();
-            if (viewportWidth > 0) {
-                return colWidth > viewportWidth ? colWidth + "px" : null;
-            }
-            if (typeof window !== "undefined" && colWidth > window.innerWidth - 32) {
-                return colWidth + "px";
-            }
-            return null;
+            var autoScroll = resolveAutoTableScroll(this.nzTableComponent, this.hasTableData(), colWidth);
+            return autoScroll ? autoScroll.x : null;
         };
         /** 表格渲染后按实际容器宽度校正横向 scroll */
         /**
@@ -8207,7 +8441,7 @@
                 return;
             }
             /** @type {?} */
-            var scrollX = this.resolveScrollX(this.tableColWidthTotal, false);
+            var scrollX = this.resolveScrollX(this.tableColWidthTotal);
             if (this.scroll && this.scroll.x === scrollX && this.scroll.y === null) {
                 return;
             }
@@ -8244,22 +8478,24 @@
             var maxOffset = this.tableTotal ? 180 : 140;
             /** @type {?} */
             var useVirtual = this.useVirtualScroll;
+            /** @type {?} */
+            var scrollX = this.resolveScrollX(colWidth);
             if (this.virtualScroll && !useVirtual) {
                 this.scroll = {
-                    x: this.resolveScrollX(colWidth, false),
+                    x: scrollX,
                     y: null,
                 };
                 return;
             }
             if (!this.virtualScroll) {
                 this.scroll = {
-                    x: "1px",
+                    x: scrollX,
                     y: "calc(100vh - " + maxOffset + "px)",
                 };
                 return;
             }
             this.scroll = {
-                x: this.resolveScrollX(colWidth, true),
+                x: scrollX,
                 y: this.getVirtualScrollY(maxOffset),
             };
         };
@@ -8426,7 +8662,7 @@
                         selector: "hd-table",
                         template: "<ng-container>\n  <hd-button-group>\n    <ng-template #buttonGroupLeft>\n      <ng-container *ngTemplateOutlet=\"tableLeftButton\"></ng-container>\n      <hd-button *ngIf=\"showOperateColWarpButton\" type=\"default\" (click)=\"toggleShowDetail()\">{{showDetail ?\n        '\u7F29\u7565\u663E\u793A': '\u5C55\u5F00\u663E\u793A'}}</hd-button>\n    </ng-template>\n    <ng-template #buttonGroupRight>\n      <ng-container *ngTemplateOutlet=\"tableRightButton\"></ng-container>\n      <hd-button type=\"primary\" nz-dropdown nzTrigger=\"click\" [nzDropdownMenu]=\"menu\" (clickAction)=\"confirmDropdown()\"\n        [nzVisible]=\"isDropdownVisible\">\u8BBE\u7F6E\u5217</hd-button>\n      <nz-dropdown-menu #menu=\"nzDropdownMenu\">\n        <div style=\"max-height: 400px;overflow-y: scroll;\">\n          <div *ngIf=\"showListNodes && nowListNodes.length > 0\" nz-menu style=\"padding: 5px 10px;\">\n            <nz-tree *ngIf=\"showListNodes\" [nzData]=\"nowListNodes\" nzCheckable nzDraggable nzBlockNode\n              nzShowExpand=\"false\" (nzCheckBoxChange)=\"checkAction($event)\" [nzBeforeDrop]=\"beforeDrop\"\n              [nzTreeTemplate]=\"nzTreeTemplate\">\n            </nz-tree>\n            <ng-template #nzTreeTemplate let-node>\n              <span\n                class=\"ng-tns-c31-110 draggable ng-star-inserted ant-tree-node-content-wrapper ant-tree-node-content-wrapper-close\"\n                [title]=\"node.key\" draggable=\"true\" aria-grabbed=\"true\">\n                <span class=\"ant-tree-title\">\n                  <div class=\"hd-table-tree-node\">\n                    <span>{{node.key}}</span>\n                    <div *ngIf=\"!node.origin.disabled\" class=\"hd-table-tree-node-img\">\n                      <i nz-icon nzType=\"caret-up\" nzTheme=\"outline\"></i>\n                      <i nz-icon nzType=\"caret-down\" nzTheme=\"outline\"></i>\n                    </div>\n                  </div>\n                </span>\n              </span>\n            </ng-template>\n          </div>\n          <div *ngIf=\"showListNodes && hideListNodes.length > 0\" nz-menu style=\"padding: 5px 10px;\">\n            <nz-tree *ngIf=\"showListNodes\" [nzData]=\"hideListNodes\" nzCheckable nzShowExpand=\"false\"\n              (nzCheckBoxChange)=\"checkAction($event)\">\n            </nz-tree>\n          </div>\n        </div>\n        <div style=\"text-align: right;background: #fff;padding: 4px;\">\n          <hd-button style=\"margin-right: 4px;\" type=\"default\" size=\"small\" (clickAction)=\"cancelDropdown()\">\u53D6\u6D88\n          </hd-button>\n          <hd-button type=\"primary\" size=\"small\" (clickAction)=\"submitGrids()\">\u5B8C\u6210</hd-button>\n        </div>\n      </nz-dropdown-menu>\n    </ng-template>\n  </hd-button-group>\n  <hd-space type=\"row\" size=\"12\"></hd-space>\n  <ng-container *ngTemplateOutlet=\"tableTotal\"></ng-container>\n  <hd-space *ngIf=\"tableTotal\" type=\"row\" size=\"12\"></hd-space>\n  <nz-table *ngIf=\"showTable\" #hdTable class=\"hd-table-container\" [class.hd-table--virtual]=\"useVirtualScroll\" [nzScroll]=\"scroll\"\n    nzShowSizeChanger nzShowQuickJumper nzFrontPagination=\"false\" nzSize=\"middle\" [nzData]=\"tableData.content\"\n    [nzTotal]=\"tableData.totalElements\" [(nzPageIndex)]=\"tablePageIndex\" [nzLoading]=\"tableLoading\"\n    [nzPageSizeOptions]=\"[ 10, 50, 100, 200, 500, 1000 ]\" [(nzPageSize)]=\"tablePageSize\" (nzPageSizeChange)=\"search(true)\"\n    (nzPageIndexChange)=\"search(false)\" (nzCurrentPageDataChange)=\"showSelected ? currentPageDataChange($event) : null\"\n    [nzShowTotal]=\"tableTotalTemplate\" [nzVirtualScroll]=\"useVirtualScroll\" [nzVirtualItemSize]=\"useVirtualScroll ? effectiveVirtualItemSize : 0\"\n    [nzVirtualForTrackBy]=\"virtualTrackByRow\">\n    <thead (nzSortChange)=\"sort($event)\" nzSingleSort>\n      <tr>\n        <th nzWidth=\"40px\" nzLeft=\"0px\" *ngIf=\"showSelected\" nzShowCheckbox [(nzChecked)]=\"isAllDisplayDataChecked\"\n          [nzIndeterminate]=\"isIndeterminate\" (nzCheckedChange)=\"checkAll($event)\"></th>\n        <ng-container *ngFor=\"let col of tableCols\">\n          <th *ngIf=\"col.isShow\" [nzWidth]=\"col.width + 'px'\" [nzAlign]=\"col.align\"\n            [nzLeft]=\"col.fixed === 'left' ? col.fixedWidth + 'px' : null\"\n            [nzRight]=\"col.fixed === 'right' ? 0  + 'px' : null\" nz-resizable nzBounds=\"window\" nzPreview\n            (nzResizeEnd)=\"onResize($event, col)\" [nzShowSort]=\"col.canSort\" [nzSortKey]=\"col.name\">\n            {{ col.title }}\n            <nz-resize-handle nzDirection=\"right\">\n              <div class=\"resize-trigger\"></div>\n            </nz-resize-handle>\n          </th>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <ng-template *ngIf=\"useVirtualScroll\" nz-virtual-scroll let-data let-index=\"index\">\n        <tr class=\"hd-table-virtual-row\">\n          <ng-container *ngTemplateOutlet=\"tableCells; context: { $implicit: data, index: index }\"></ng-container>\n        </tr>\n      </ng-template>\n      <ng-container *ngIf=\"!useVirtualScroll\">\n        <tr *ngFor=\"let data of hdTable.data; trackBy: trackByRow; index as i\">\n          <ng-container *ngTemplateOutlet=\"tableCells; context: { $implicit: data, index: i }\"></ng-container>\n        </tr>\n      </ng-container>\n    </tbody>\n    <tfoot *ngIf=\"showTableTotal\">\n      <tr class=\"hd-table-total\">\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let tableTotalOption of tableTotalOptionList\">\n          <td>{{ tableTotalOption }}</td>\n        </ng-container>\n      </tr>\n    </tfoot>\n    <ng-template #tableTotalTemplate>\n      \u5171 {{tableData.totalElements}} \u6761\u6570\u636E\n    </ng-template>\n  </nz-table>\n</ng-container>\n\n<ng-template #tableCells let-data let-index=\"index\">\n  <td nzLeft=\"0px\" *ngIf=\"showSelected\" nzShowCheckbox [nzChecked]=\"mapOfCheckedId[data[selectField]]\"\n    (nzCheckedChange)=\"refreshStatus($event, data)\"></td>\n  <ng-container *ngFor=\"let col of tableCols; trackBy: trackByCol\">\n    <td *ngIf=\"col.isShow\" [ngStyle]=\"{'max-width': col.width + 'px'}\" [nzAlign]=\"col.align\"\n      [nzLeft]=\"col.fixed === 'left' ? col.fixedWidth + 'px' : null\"\n      [nzRight]=\"col.fixed === 'right' ? 0 + 'px' : null\"\n      [ngClass]=\"(col.canWarp && showDetail) ? 'common-td-wrap' : ''\">\n      <ng-container *ngIf=\"col.title === '\u64CD\u4F5C';else notOperateTemplate\">\n        <div class=\"common-btn-group\">\n          <ng-container *ngFor=\"let btn of col.btnList\">\n            <ng-container *ngIf=\"!needShowConfirm(btn, data);else showConfirmTemplate\">\n              <a *ngIf=\"btn.permission ? btn.permission(data) : true\"\n                [class]=\"btn.name === '\u5220\u9664' ? 'common-danger-btn': ''\"\n                (click)=\"triggerEvent(btn.click || null, data)\">{{ btn.name }}</a>\n            </ng-container>\n            <ng-template #showConfirmTemplate>\n              <a *ngIf=\"btn.permission ? btn.permission(data) : true\"\n                [class]=\"btn.name === '\u5220\u9664' ? 'common-danger-btn': ''\" nz-popconfirm\n                [nzPopconfirmTitle]=\"'\u786E\u8BA4\u8981' + btn.name + '\u5417?'\"\n                (nzOnConfirm)=\"triggerEvent(btn.click || null, data)\">{{\n                btn.name }}</a>\n            </ng-template>\n          </ng-container>\n        </div>\n      </ng-container>\n      <ng-template #notOperateTemplate>\n        <ng-container *ngIf=\"col.name === 'state' || col.isState;else otherTemplate\">\n          <hd-status [status]=\"data[getStateField(col)]\">\n            <ng-container *ngIf=\"(data | hdTableCell:col) as cell\">\n              <span *ngIf=\"cell.overflow && !(col.canWarp && showDetail)\" nz-tooltip [nzTooltipTitle]=\"cell.title\">{{ cell.display }}</span>\n              <span *ngIf=\"!cell.overflow || (col.canWarp && showDetail)\">{{ cell.display }}</span>\n            </ng-container>\n          </hd-status>\n        </ng-container>\n        <ng-template #otherTemplate>\n          <ng-container *ngIf=\"col.click;else noClickTemplate\">\n            <ng-container *ngIf=\"(data | hdTableCell:col) as cell\">\n              <a *ngIf=\"cell.overflow && !(col.canWarp && showDetail)\" nz-tooltip [nzTooltipTitle]=\"cell.title\"\n                [ngStyle]=\"{'color': cell.isEmpty ? '#2A3634' : (col?.color ? col.color : null)}\"\n                (click)=\"triggerEvent(col.click || null, data)\">{{ cell.display }}</a>\n              <a *ngIf=\"!cell.overflow || (col.canWarp && showDetail)\"\n                [ngStyle]=\"{'color': cell.isEmpty ? '#2A3634' : (col?.color ? col.color : null)}\"\n                (click)=\"triggerEvent(col.click || null, data)\">{{ cell.display }}</a>\n            </ng-container>\n          </ng-container>\n          <ng-template #noClickTemplate>\n            <ng-container *ngIf=\"(data | hdTableCell:col) as cell\">\n              <span *ngIf=\"cell.overflow && !(col.canWarp && showDetail)\" nz-tooltip [nzTooltipTitle]=\"cell.title\"\n                [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{ cell.display }}</span>\n              <span *ngIf=\"!cell.overflow || (col.canWarp && showDetail)\"\n                [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{ cell.display }}</span>\n            </ng-container>\n          </ng-template>\n        </ng-template>\n      </ng-template>\n    </td>\n  </ng-container>\n</ng-template>\n",
                         changeDetection: core.ChangeDetectionStrategy.OnPush,
-                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset;padding:0 6px!important}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.nz-resizable-preview{position:absolute;top:0;left:0;z-index:8;border:1px dashed #d1d1d1}.nz-resizable-handle{position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:9}.nz-resizable-handle-top{width:100%;height:10px;top:-5px;left:0}.nz-resizable-handle-right{height:100%}.nz-resizable-handle-bottom{width:100%;height:10px;bottom:-5px;left:0}.nz-resizable-handle-left{width:10px;height:100%;top:0;left:-5px}.nz-resizable-handle-topRight{width:20px;height:20px;top:-5px;right:-5px;z-index:10}.nz-resizable-handle-bottomRight{width:20px;height:20px;right:-5px;bottom:-5px;z-index:10}.nz-resizable-handle-bottomLeft{width:20px;height:20px;bottom:-5px;left:-5px;z-index:10}.nz-resizable-handle-topLeft{width:20px;height:20px;top:-5px;left:-5px;z-index:10}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottom,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-top{cursor:row-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-left,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-right{cursor:col-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottomRight,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-topLeft{cursor:nwse-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottomLeft,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-topRight{cursor:nesw-resize}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed;white-space:nowrap;text-overflow:ellipsis}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}.hd-table-container ::ng-deep cdk-virtual-scroll-viewport.ant-table-body .hd-table-virtual-row>td{box-sizing:border-box}.hd-table-container:not(.hd-table--virtual) ::ng-deep .ant-table-body{max-height:none!important;overflow-y:visible!important}::ng-deep .ant-dropdown-menu{border-radius:0}::ng-deep .ant-dropdown{margin-top:8px!important}.common-td-wrap{white-space:normal!important;word-break:break-all}.nz-resizable-preview{border-width:0 1px 0 0}.resize-trigger{width:10px;height:15px;position:relative;top:calc((100% - 15px)/ 2)}.resize-trigger::after{position:absolute;top:calc((100% - 15px)/ 2);left:0;background:#d5d5d5;content:'';width:1px;height:15px;z-index:1}.nz-resizable-handle-right{position:absolute;width:10px;top:0;right:-5px;z-index:inherit}.hd-table-tree-node{display:inline-flex;align-items:center;padding-right:10px}.hd-table-tree-node .hd-table-tree-node-img{display:flex;flex-direction:column;position:absolute;right:0;margin-top:-2.5px}.hd-table-tree-node .hd-table-tree-node-img i{opacity:.3}.hd-table-tree-node .hd-table-tree-node-img i:last-child{margin-top:-5px}img{width:20px;height:20px}.ant-table-th-left-sticky{z-index:2}::ng-deep .ant-table-thead>tr>th .ant-table-header-column .ant-table-column-sorters>:not(.ant-table-column-sorter){position:unset}"]
+                        styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset;padding:0 6px!important}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.nz-resizable-preview{position:absolute;top:0;left:0;z-index:8;border:1px dashed #d1d1d1}.nz-resizable-handle{position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:9}.nz-resizable-handle-top{width:100%;height:10px;top:-5px;left:0}.nz-resizable-handle-right{height:100%}.nz-resizable-handle-bottom{width:100%;height:10px;bottom:-5px;left:0}.nz-resizable-handle-left{width:10px;height:100%;top:0;left:-5px}.nz-resizable-handle-topRight{width:20px;height:20px;top:-5px;right:-5px;z-index:10}.nz-resizable-handle-bottomRight{width:20px;height:20px;right:-5px;bottom:-5px;z-index:10}.nz-resizable-handle-bottomLeft{width:20px;height:20px;bottom:-5px;left:-5px;z-index:10}.nz-resizable-handle-topLeft{width:20px;height:20px;top:-5px;left:-5px;z-index:10}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottom,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-top{cursor:row-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-left,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-right{cursor:col-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottomRight,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-topLeft{cursor:nwse-resize}.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-bottomLeft,.nz-resizable:not(.nz-resizable-resizing) .nz-resizable-handle-topRight{cursor:nesw-resize}.hd-table-container ::ng-deep .ant-pagination-options-quick-jumper input{border-radius:2px;border:1px solid #d9d9d9}.hd-table-container ::ng-deep .ant-pagination-options .ant-select-selection{border-radius:2px}.hd-table-container ::ng-deep .ant-table-thead>tr>th{border-bottom:1px solid #ecf1ed;white-space:nowrap;text-overflow:ellipsis}.hd-table-container ::ng-deep .ant-table-tbody>tr>td{border-bottom:1px solid #ecf1ed;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hd-table-container ::ng-deep .hd-table-total>td{border:0!important}.hd-table-container ::ng-deep cdk-virtual-scroll-viewport.ant-table-body .hd-table-virtual-row>td{box-sizing:border-box}.hd-table-container:not(.hd-table--virtual) ::ng-deep .ant-table-body{max-height:none!important;overflow-y:visible!important}.hd-table-container ::ng-deep .ant-table-fixed-right{right:0!important}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr>td,.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-thead>tr>th{background:#f5f8f6}.hd-table-container ::ng-deep .ant-table-fixed-right .ant-table-tbody>tr:hover>td{background:#fff}::ng-deep .ant-dropdown-menu{border-radius:0}::ng-deep .ant-dropdown{margin-top:8px!important}.common-td-wrap{white-space:normal!important;word-break:break-all}.nz-resizable-preview{border-width:0 1px 0 0}.resize-trigger{width:10px;height:15px;position:relative;top:calc((100% - 15px)/ 2)}.resize-trigger::after{position:absolute;top:calc((100% - 15px)/ 2);left:0;background:#d5d5d5;content:'';width:1px;height:15px;z-index:1}.nz-resizable-handle-right{position:absolute;width:10px;top:0;right:-5px;z-index:inherit}.hd-table-tree-node{display:inline-flex;align-items:center;padding-right:10px}.hd-table-tree-node .hd-table-tree-node-img{display:flex;flex-direction:column;position:absolute;right:0;margin-top:-2.5px}.hd-table-tree-node .hd-table-tree-node-img i{opacity:.3}.hd-table-tree-node .hd-table-tree-node-img i:last-child{margin-top:-5px}img{width:20px;height:20px}.ant-table-th-left-sticky{z-index:2}::ng-deep .ant-table-thead>tr>th .ant-table-header-column .ant-table-column-sorters>:not(.ant-table-column-sorter){position:unset}"]
                     }] }
         ];
         /** @nocollapse */