fantasy-ngzorro 2.1.59 → 2.1.61

package/README.md

@@ -35,7 +35,9 @@
 | MC | 2023-2-10 | Readme 创建；按钮、按钮组、通用表格、筛选器、状态、详情头、详情单头、详情明细文档 |
 | MC | 2023-2-13 | 表单、明细表单、间隔、小标题文档；组件字段增加必填说明 |
 | — | 2026-5-20 | 补充 hd-table、hd-detail-lines-page 等组件；完善公共子类型（SelectOption、FormItem 等）文档 |
+| — | 2026-9-18 | `hd-form-lines` 选中回显（nzHide）认 `showLabelAndValue`，与下拉 `[value]label` 一致（对齐 `hd-form`） |
 | — | 2026-9-18 | `hd-detail-lines-page` 对齐 `hd-table` 支持虚拟滚动（`virtualScroll` / `virtualItemSize`）；千行勾选时减少 DOM 卡顿 |
+| — | 2026-9-20 | hd-detail-form 支持附件图片字段（`HdDetailFormFieldType.Accessory`，Figma 48×48 缩略图横排，不复用 hd-accessory-list） |
 | — | 2026-9-17 | hd-table / hd-detail-lines / hd-detail-lines-page 支持 `selectDisabledField` / `rowInvalidField`：按行字段控制勾选禁用、失效行样式 |
 | — | 2026-9-14 | 新增 `hd-accessory-list` 附件列表组件（分组 name + accessoryList，点击下载/查看） |
 | — | 2026-6-23 | hd-table 状态列支持 `stateField` 自定义取值字段、`isState` 按列名取值；hd-form Input 支持 `prefix` / `prefixIcon`；hd-detail-lines-page 支持 `isCrossPageSelect` 跨页勾选开关 |
@@ -577,14 +579,27 @@ this.hdFormLines.batchFillSelected({ remark: '批量备注' }); // 批量填充
 ### 示例
 
 ```html
-<hd-detail-form [formCols]="formCols"></hd-detail-form>
+<hd-detail-form [formCols]="formCols" (imageClick)="onDetailFormImageClick($event)"></hd-detail-form>
 ```
 
 ```typescript
+import { HdDetailFormFieldType, HdOption } from 'fantasy-ngzorro';
+
 formCols: HdOption[] = [
   { label: '收货单号', value: '202111030001' },
   { label: '地址', value: '江苏/南京市/玄武区 某某路', width: 2 },
-  { label: '备注', value: '...' }
+  { label: '备注', value: '...' },
+  // 附件图片：label + 图片地址列表（Figma 48×48 缩略图横排）
+  {
+    label: '食品经营许可证',
+    type: HdDetailFormFieldType.Accessory,
+    width: 2,
+    value: [
+      { name: '正面', path: 'https://oss.xxx.com/a.png' },
+      { name: '背面', path: 'https://oss.xxx.com/b.png' },
+      'https://oss.xxx.com/c.png', // 也支持纯地址字符串
+    ],
+  },
 ];
 ```
 
@@ -592,6 +607,15 @@ formCols: HdOption[] = [
 | ---- | ---- | ------ | ---- |
 | formCols | HdOption[] | — | 展示字段，见 [HdOption](#hdoption键值展示项) |
 | nzColumn | number \| object | `4` | 一行列数，默认固定 4 列 |
+| imageClick | EventEmitter | — | 附件图片点击回调 `{ image, path, index }`（`type=accessory` 时） |
+
+附件字段 `type: HdDetailFormFieldType.Accessory`（或 `'accessory'`）：
+
+- 对齐 Figma `items/description-cell`「图片」：标签 + **48×48** 缩略图横排（间距 6px，边框 `#E5E6EB`，圆角 4px）
+- `value` 支持：图片地址 `string` / `string[]`，或 `{ name?, path?/url? }[]`
+- 点击缩略图默认 `window.open` 打开原图，并触发 `imageClick`
+- 无图时展示 `<空>`
+- **不使用** `hd-accessory-list`（文件列表样式请用独立附件列表组件）
 
 ---
 
@@ -810,7 +834,7 @@ onAccessoryFileClick(e: { group: HdAccessoryGroup; file: any; path: string }) {
 | value | string | — | selectList 中作为绑定值的字段名 |
 | selectList | any[] | — | 静态选项列表 |
 | selectListName | string | — | 选项来自行数据某字段时使用（配合 hide 字段） |
-| showLabelAndValue | boolean | false | 选项展示为 `[value]label` |
+| showLabelAndValue | boolean | false | 选项与已选回显均为 `[value]label`（`hd-form` / `hd-form-lines`） |
 | hdDropdownMatchSelectWidth | boolean | false | 下拉宽度是否与控件一致 |
 | hdServerSearch | boolean | false | 是否远程搜索 |
 | hdShowSearch | boolean | true | 是否可搜索 |
@@ -903,7 +927,8 @@ selectOption: {
 | 参数 | 类型 | 说明 |
 | ---- | ---- | ---- |
 | label | string | 标签 |
-| value | any | 值 |
+| value | any | 值；附件类型时为图片地址 `string` / `string[]` 或 `{ name?, path?/url? }[]` |
+| type | string / HdDetailFormFieldType | 字段类型，默认文本；`accessory` 为附件图片缩略图 |
 | width | number | 占据列数，默认 1，最大 4；未传按 1 |
 | color | string | 文字颜色 |
 | hide | boolean | 是否隐藏 |

package/bundles/fantasy-ngzorro.umd.js

@@ -433,6 +433,44 @@
         return HdButtonModule;
     }());
 
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /** @enum {string} */
+    var HdDetailFormFieldType = {
+        /** 普通文本（默认） */
+        Text: "text",
+        /** 附件图片（描述项内横排缩略图） */
+        Accessory: "accessory",
+    };
+    /**
+     * 附件图片项（path 为图片地址）
+     * @record
+     */
+    function HdDetailFormImage() { }
+    if (false) {
+        /** @type {?|undefined} */
+        HdDetailFormImage.prototype.name;
+        /** @type {?|undefined} */
+        HdDetailFormImage.prototype.path;
+        /** @type {?|undefined} */
+        HdDetailFormImage.prototype.url;
+    }
+    var HdDetailFormService = /** @class */ (function () {
+        function HdDetailFormService() {
+        }
+        HdDetailFormService.decorators = [
+            { type: core.Injectable, args: [{
+                        providedIn: "root",
+                    },] }
+        ];
+        /** @nocollapse */
+        HdDetailFormService.ctorParameters = function () { return []; };
+        /** @nocollapse */ HdDetailFormService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function HdDetailFormService_Factory() { return new HdDetailFormService(); }, token: HdDetailFormService, providedIn: "root" });
+        return HdDetailFormService;
+    }());
+
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -444,6 +482,11 @@
              * 一行列数，默认固定 4 列（不再按屏幕宽度自适应）
              */
             this.nzColumn = 4;
+            /**
+             * 附件图片点击回调
+             */
+            this.imageClick = new core.EventEmitter();
+            this.HdDetailFormFieldType = HdDetailFormFieldType;
         }
         /**
          * @return {?}
@@ -453,7 +496,6 @@
          */
         function () {
             if (this.formCols && this.formCols.length > 0) {
-                // 剔除掉formCols里面不需要显示的内容
                 this.formCols = this.formCols.filter((/**
                  * @param {?} item
                  * @return {?}
@@ -470,9 +512,10 @@
          * @return {?}
          */
         function (changes) {
-            if (changes['formCols'] && JSON.stringify(changes['formCols'].currentValue) !== JSON.stringify(changes['formCols'].previousValue)) {
+            if (changes["formCols"] &&
+                JSON.stringify(changes["formCols"].currentValue) !==
+                    JSON.stringify(changes["formCols"].previousValue)) {
                 if (this.formCols && this.formCols.length > 0) {
-                    // 剔除掉formCols里面不需要显示的内容
                     this.formCols = this.formCols.filter((/**
                      * @param {?} item
                      * @return {?}
@@ -481,6 +524,118 @@
                 }
             }
         };
+        /**
+         * @param {?} col
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.isAccessory = /**
+         * @param {?} col
+         * @return {?}
+         */
+        function (col) {
+            return !!(col &&
+                (col.type === HdDetailFormFieldType.Accessory ||
+                    col.type === "accessory"));
+        };
+        /**
+         * 解析附件图片列表。value 支持：
+         * - string / string[]（图片地址）
+         * - { name?, path? / url? }[]
+         */
+        /**
+         * 解析附件图片列表。value 支持：
+         * - string / string[]（图片地址）
+         * - { name?, path? / url? }[]
+         * @param {?} col
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.getImageList = /**
+         * 解析附件图片列表。value 支持：
+         * - string / string[]（图片地址）
+         * - { name?, path? / url? }[]
+         * @param {?} col
+         * @return {?}
+         */
+        function (col) {
+            /** @type {?} */
+            var value = col && col.value;
+            if (value == null || value === "") {
+                return [];
+            }
+            /** @type {?} */
+            var list = Array.isArray(value) ? value : [value];
+            /** @type {?} */
+            var result = [];
+            list.forEach((/**
+             * @param {?} item
+             * @return {?}
+             */
+            function (item) {
+                if (item == null || item === "") {
+                    return;
+                }
+                if (typeof item === "string") {
+                    result.push({ path: item });
+                    return;
+                }
+                /** @type {?} */
+                var path = item.path || item.url || item.address || "";
+                if (!path) {
+                    return;
+                }
+                result.push({
+                    name: item.name || item.fileName,
+                    path: String(path),
+                });
+            }));
+            return result;
+        };
+        /**
+         * @param {?} col
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.hasImages = /**
+         * @param {?} col
+         * @return {?}
+         */
+        function (col) {
+            return this.getImageList(col).length > 0;
+        };
+        /**
+         * @param {?} image
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.getImagePath = /**
+         * @param {?} image
+         * @return {?}
+         */
+        function (image) {
+            return (image && (image.path || image.url)) || "";
+        };
+        /**
+         * @param {?} image
+         * @param {?} index
+         * @param {?=} event
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.onImageClick = /**
+         * @param {?} image
+         * @param {?} index
+         * @param {?=} event
+         * @return {?}
+         */
+        function (image, index, event) {
+            if (event) {
+                event.preventDefault();
+                event.stopPropagation();
+            }
+            /** @type {?} */
+            var path = this.getImagePath(image);
+            this.imageClick.emit({ image: image, path: path, index: index });
+            if (path) {
+                window.open(path, "_blank");
+            }
+        };
         /** HdOption.width：默认 1，最大 4 */
         /**
          * HdOption.width：默认 1，最大 4
@@ -515,16 +670,17 @@
         };
         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\" [nzSpan]=\"getColSpan(col)\">\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\" [nzSpan]=\"getColSpan(col)\">\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}::ng-deep .hd-table-container .ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-th-right-sticky{z-index:2;transform:translateZ(0)}::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-right-sticky{background:#f5f8f6!important}::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-right-sticky{background:#fff}::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-right-sticky{background:#ecf8f1!important}::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-th-right-sticky{box-shadow:none!important}::ng-deep .hd-table-container .ant-table-fixed-right{right:0!important}: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%}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child{width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;min-width:var(--hd-cascader-menu-min-width,auto);max-width:560px}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child .ant-cascader-menu-item{white-space:nowrap}.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}"]
+                        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      <!-- \u9644\u4EF6\u56FE\u7247\uFF1A\u6807\u7B7E\u4E0E\u9996\u56FE\u5DE6\u4E0A\u89D2\u9876\u5BF9\u9F50\uFF08Figma description-cell / \u56FE\u7247\uFF09 -->\n      <nz-descriptions-item *ngIf=\"isAccessory(col)\" [nzTitle]=\"col.label\" [nzSpan]=\"getColSpan(col)\">\n        <div class=\"hd-detail-form-images\" *ngIf=\"hasImages(col)\">\n          <a class=\"hd-detail-form-image\" *ngFor=\"let image of getImageList(col); let i = index\"\n            href=\"javascript:void(0)\"\n            (click)=\"onImageClick(image, i, $event)\"\n            [attr.title]=\"image.name || ('\u56FE\u7247' + (i + 1))\">\n            <img [src]=\"getImagePath(image)\" [alt]=\"image.name || ('\u56FE\u7247' + (i + 1))\" />\n          </a>\n        </div>\n        <span *ngIf=\"!hasImages(col)\">&lt;\u7A7A&gt;</span>\n      </nz-descriptions-item>\n      <!-- \u666E\u901A\u6587\u672C -->\n      <nz-descriptions-item *ngIf=\"!isAccessory(col) && !col.click\" [nzTitle]=\"col.label\" [nzSpan]=\"getColSpan(col)\">\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      <!-- \u53EF\u70B9\u51FB -->\n      <nz-descriptions-item *ngIf=\"!isAccessory(col) && col.click\" [nzTitle]=\"col.label\" [nzSpan]=\"getColSpan(col)\">\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}::ng-deep .hd-table-container .ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-th-right-sticky{z-index:2;transform:translateZ(0)}::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-right-sticky{background:#f5f8f6!important}::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-right-sticky{background:#fff}::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-right-sticky{background:#ecf8f1!important}::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-th-right-sticky{box-shadow:none!important}::ng-deep .hd-table-container .ant-table-fixed-right{right:0!important}: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%}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child{width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;min-width:var(--hd-cascader-menu-min-width,auto);max-width:560px}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child .ant-cascader-menu-item{white-space:nowrap}.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>span{vertical-align:top}.hd-detail-form-container ::ng-deep .ant-descriptions-item-label{color:#4b504e;font-size:14px;line-height:22px;padding-top:1px;vertical-align:top}.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;vertical-align:top;line-height:22px}.hd-detail-form-container ::ng-deep a{font-size:14px}.hd-detail-form-container ::ng-deep td{white-space:unset!important}.hd-detail-form-container .hd-detail-form-images{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}.hd-detail-form-container .hd-detail-form-image{display:inline-flex;flex-shrink:0;box-sizing:border-box;width:48px;height:48px;overflow:hidden;border:1px solid #e5e6eb;border-radius:4px;cursor:pointer;line-height:0}.hd-detail-form-container .hd-detail-form-image img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.hd-detail-form-container .hd-detail-form-image:hover{border-color:#20b95d}"]
                     }] }
         ];
         /** @nocollapse */
         HdDetailFormComponent.ctorParameters = function () { return []; };
         HdDetailFormComponent.propDecorators = {
             formCols: [{ type: core.Input }],
-            nzColumn: [{ type: core.Input }]
+            nzColumn: [{ type: core.Input }],
+            imageClick: [{ type: core.Output }]
         };
         return HdDetailFormComponent;
     }());
@@ -536,6 +692,13 @@
          * @type {?}
          */
         HdDetailFormComponent.prototype.nzColumn;
+        /**
+         * 附件图片点击回调
+         * @type {?}
+         */
+        HdDetailFormComponent.prototype.imageClick;
+        /** @type {?} */
+        HdDetailFormComponent.prototype.HdDetailFormFieldType;
     }
 
     /**
@@ -547,12 +710,9 @@
         }
         HdDetailFormModule.decorators = [
             { type: core.NgModule, args: [{
-                        imports: [
-                            common.CommonModule,
-                            ngZorroAntd.NgZorroAntdModule
-                        ],
+                        imports: [common.CommonModule, ngZorroAntd.NgZorroAntdModule],
                         exports: [HdDetailFormComponent],
-                        declarations: [HdDetailFormComponent]
+                        declarations: [HdDetailFormComponent],
                     },] }
         ];
         return HdDetailFormModule;
@@ -727,6 +887,12 @@
          * @type {?}
          */
         HdOption.prototype.width;
+        /**
+         * 字段类型，默认文本。
+         * `accessory`：附件图片，value 为图片地址 string / string[] 或 { name?, path?/url? }[]
+         * @type {?}
+         */
+        HdOption.prototype.type;
         /** @type {?} */
         HdOption.prototype.clickText;
         /** @type {?} */
@@ -6087,7 +6253,7 @@
         HdFormLinesComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "hd-form-lines",
-                        template: "<ng-container *ngIf=\"showForm && showToolbar\">\n  <hd-button-group class=\"hd-formLines-toolbar\">\n    <ng-template #buttonGroupLeft>\n      <!-- \u6709\u5168\u5C40\u641C\u7D22\uFF1A\u5DE6\u4FA7\u653E\u641C\u7D22\u6846 -->\n      <ng-container *ngIf=\"showSearch\">\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-container>\n      <!-- \u65E0\u5168\u5C40\u641C\u7D22\uFF1A\u5DE6\u4FA7\u653E\u81EA\u5B9A\u4E49\u6309\u94AE -->\n      <ng-container *ngIf=\"!showSearch\">\n        <ng-container *ngTemplateOutlet=\"formLinesLeftButton\"></ng-container>\n      </ng-container>\n    </ng-template>\n    <ng-template #buttonGroupRight>\n      <!-- \u6709\u5168\u5C40\u641C\u7D22\uFF1A\u53F3\u4FA7\u8303\u56F4\u518D\u5DE6\u53F3\u5206\u5F00 -->\n      <div class=\"hd-formLines-toolbar-right\" *ngIf=\"showSearch\">\n        <div class=\"hd-formLines-toolbar-right-left\">\n          <ng-container *ngTemplateOutlet=\"formLinesLeftButton\"></ng-container>\n        </div>\n        <div class=\"hd-formLines-toolbar-right-right\">\n          <ng-container *ngTemplateOutlet=\"formLinesRightButton\"></ng-container>\n        </div>\n      </div>\n      <!-- \u65E0\u5168\u5C40\u641C\u7D22\uFF1A\u53F3\u4FA7\u53EA\u653E\u81EA\u5B9A\u4E49\u53F3\u4FA7\u6309\u94AE -->\n      <ng-container *ngIf=\"!showSearch\">\n        <ng-container *ngTemplateOutlet=\"formLinesRightButton\"></ng-container>\n      </ng-container>\n    </ng-template>\n  </hd-button-group>\n  <hd-space background=\"transparent\" type=\"row\" size=\"12\"></hd-space>\n</ng-container>\n\n<!-- \u52FE\u9009\u63D0\u793A\uFF1A\u5355\u72EC\u4E00\u884C\uFF0C\u653E\u5728\u8868\u5355\u4E0A\u65B9 -->\n<ng-container *ngIf=\"showForm && showCheckbox && getSelectedCount() > 0\">\n  <nz-alert nzType=\"info\" [nzMessage]=\"selectionAlertTemplate\" nzShowIcon></nz-alert>\n  <hd-space background=\"transparent\" type=\"row\" size=\"12\"></hd-space>\n</ng-container>\n<ng-template #selectionAlertTemplate>\n  <span>\u5DF2\u9009\u62E9{{ getSelectedCount() }}\u6761\u6570\u636E</span>&nbsp;&nbsp;\n  <span class=\"common-btn-group\">\n    <a (click)=\"clearSelection()\">\u6E05\u7A7A</a>\n  </span>\n</ng-template>\n\n<!-- <hd-button type=\"primary\" (clickAction)=\"focusDom(0, 0)\">\u805A\u7126\u7B2C\u4E00\u4E2A</hd-button> -->\n\n<form *ngIf=\"showForm\" nz-form [formGroup]=\"validateHdFormLines\" class=\"ant-advanced-search-form hd-formLines-container\"\n  (keydown)=\"onKeyDown($event)\">\n  <nz-table nzTemplateMode [nzFrontPagination]=\"false\" [nzLoading]=\"tableLoading\" [nzScroll]=\"scroll\">\n    <thead>\n      <tr>\n        <th nzWidth=\"40px\" nzLeft=\"0px\" *ngIf=\"showCheckbox\">\n          <label nz-checkbox\n            [ngModel]=\"isAllChecked()\"\n            [nzIndeterminate]=\"isIndeterminate()\"\n            [ngModelOptions]=\"{standalone: true}\"\n            (ngModelChange)=\"onAllChecked($event)\"></label>\n        </th>\n        <th nzWidth=\"58px\" [nzLeft]=\"lineNumberLeft\" *ngIf=\"showLineNumber\">\u5E8F\u53F7</th>\n        <ng-container *ngFor=\"let item of formLines\">\n          <th *ngIf=\"!item.hide\" [nzAlign]=\"item.align ? item.align : 'left'\">\n            <span *ngIf=\"item.require\" style=\"color: red;\">*</span>{{ item.label }}\n          </th>\n        </ng-container>\n        <th [style.width.px]=\"operateColWidth\" nzRight=\"0\">\u64CD\u4F5C</th>\n      </tr>\n    </thead>\n    <tbody>\n      <ng-container\n        *ngFor=\"let line of linesFormArray.controls.slice((paginationPageIndex - 1) * paginationPageSize, (paginationPageIndex - 1) * paginationPageSize + paginationPageSize);index as dataIndex\"\n        formArrayName=\"lines\">\n        <tr [formGroup]=\"line\">\n          <td nzWidth=\"40px\" nzLeft=\"0px\" *ngIf=\"showCheckbox\">\n            <label nz-checkbox\n              [ngModel]=\"isLineChecked(line)\"\n              [ngModelOptions]=\"{standalone: true}\"\n              (ngModelChange)=\"onLineCheckedChange(line, $event)\"></label>\n          </td>\n          <td nzWidth=\"58px\" [nzLeft]=\"lineNumberLeft\" *ngIf=\"showLineNumber\">\n            {{ line.get('lineIndex').value }}\n          </td>\n          <ng-container *ngFor=\"let formItem of formLines; index as innerIndex\">\n            <td *ngIf=\"!formItem.hide\" [nzAlign]=\"formItem.align ? formItem.align : 'left'\">\n              <nz-form-item>\n                <nz-form-control\n                  [nzValidateStatus]=\"getControlValidateStatus(line, formItem)\"\n                  [nzErrorTip]=\"formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A'\">\n                  <ng-container [ngSwitch]=\"formItem.type\">\n                    <ng-container *ngSwitchCase=\"'Input'\">\n                      <nz-input-group [nzSuffix]=\"inputCleanTemplate\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        <input #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                          [ngStyle]=\"getStyle(line, formItem, '100px')\" nz-input\n                          [ngStyle]=\"{'color': formItem?.colorOption?.name ? line.get(formItem.colorOption.name ).value : null}\"\n                          [id]=\"'input-' + formItem.name + line.get('lineIndex').value\"\n                          (click)=\"formItem.isSelect ? selectValue('#input-' + formItem.name + line.get('lineIndex').value, dataIndex , innerIndex) : null\"\n                          (input)=\"limitInputLength($event, line, formItem)\"\n                          [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                          [formControlName]=\"formItem.name\" />\n                      </nz-input-group>\n                      <ng-template #inputCleanTemplate>\n                        <i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\" nzType=\"close-circle\"\n                          *ngIf=\"line.get(formItem.name).value && !line.get(formItem.name).disabled\"\n                          (click)=\"inputClean(formItem ,line)\"></i>\n                      </ng-template>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Select'\">\n                      <nz-select #formInputDom (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        nzDropdownClassName=\"hd-select-table\"\n                        *ngIf=\"formItem.selectOption.tableColumns;else nomarlSelectTemplate\"\n                        [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                        [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\"\n                        (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                        (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\"\n                        [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                        <div class=\"hd-select-empty\"\n                          *ngIf=\"!(formItem.selectOption?.selectList?.length > 0 || line.get(formItem.selectOption.selectListName)?.value?.length > 0)\">\n                          <img\n                            src=\"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI0MXB4IiB2aWV3Qm94PSIwIDAgNjQgNDEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUyLjUgKDY3NDY5KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDxnIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00NzIuMDAwMDAwLCAtMTMzNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDY0LjAwMDAwMCwgMTExNC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnICB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MC4wMDAwMDAsIDc4LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxnICB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNjguMDAwMDAwLCAxNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxnID4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxlbGxpcHNlICBmaWxsPSIjRjVGNUY1IiBjeD0iMzIiIGN5PSIzMyIgcng9IjMyIiByeT0iNyI+PC9lbGxpcHNlPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPGcgICB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjAwMDAwMCwgMC4wMDAwMDApIiBmaWxsLXJ1bGU9Im5vbnplcm8iIHN0cm9rZT0iI0Q5RDlEOSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQ2LDEyLjc2MDU2MDQgTDM1Ljg1NDMwNDcsMS4yNTczOTYzMyBDMzUuMzY3NDQxNCwwLjQ3MzgyNjYwNSAzNC42NTU4Nzg5LDAgMzMuOTA2NzYxNywwIEwxMi4wOTMyMzgzLDAgQzExLjM0NDEyMTEsMCAxMC42MzI1NTg2LDAuNDczOTUwMjU1IDEwLjE0NTY5NTMsMS4yNTczOTYzMyBMMi42MTQ3OTcyN2UtMTIsMTIuNzYwNTYwNCBMMCwyMiBMNDYsMjIgTDQ2LDEyLjc2MDU2MDQgWiIgID48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTMyLjYxMzI4MTMsMTUuOTMxNSBDMzIuNjEzMjgxMywxNC4zMjU4NTExIDMzLjYwNjk1MzEsMTMuMDAwMjM0IDM0LjgzOTY5OTIsMTMgTDQ2LDEzIEw0NiwzMS4xMzcxMjc3IEM0NiwzMy4yNTg5NTc0IDQ0LjY3OTM4NjcsMzUgNDMuMDUwNDI5NywzNSBMMi45NDk1NzAzMSwzNSBDMS4zMjA1MjM0NCwzNSAwLDMzLjI1ODg0MDQgMCwzMS4xMzcxMjc3IEwwLDEzIEwxMS4xNjAzMDA4LDEzIEMxMi4zOTMwNDY5LDEzIDEzLjM4NjcxODgsMTQuMzIyODA4NSAxMy4zODY3MTg4LDE1LjkyODQ1NzQgTDEzLjM4NjcxODgsMTUuOTQ5NjM4MyBDMTMuMzg2NzE4OCwxNy41NTUyODcyIDE0LjM5MTcxMDksMTguODUxMTgwOSAxNS42MjQ0NTcsMTguODUxMTgwOSBMMzAuMzc1NTQzLDE4Ljg1MTE4MDkgQzMxLjYwODI4OTEsMTguODUxMTgwOSAzMi42MTMyODEzLDE3LjU0MzM1MTEgMzIuNjEzMjgxMywxNS45Mzc3MDIxIEwzMi42MTMyODEzLDE1LjkzMTUgWiIgIGZpbGw9IiNGQUZBRkEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+\"\n                            alt=\"empty\">\n                          <p class=\"ant-empty-description\">\u6682\u65E0\u6570\u636E</p>\n                        </div>\n\n                        <nz-option nzCustomContent\n                          *ngFor=\"let selectItem of (formItem.selectOption.selectList || line.get(formItem.selectOption.selectListName).value)\"\n                          [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                          selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\">\n                          <div class=\"hd-option-line\">\n                            <div *ngFor=\"let selectOptionTableColumn of formItem.selectOption.tableColumns\"\n                              [ngStyle]=\"getSelectTableColumnStyle(selectOptionTableColumn)\">\n                              <ng-container *ngIf=\"selectOptionTableColumn.icons;else notPictureTemplate\">\n                                <div class=\"hd-option-icons\">\n                                  <ng-container *ngFor=\"let icon of selectOptionTableColumn.icons\">\n                                    <img *ngIf=\"icon.iconName === 'hd-recommend-star' && selectItem[icon.fieldName]\"\n                                      src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAVpJREFUOE+l07FLQkEcB/Dv7713Zg1GQ0SgW9AmTYVp1BRUokZBEI1u/QVBUBD1D0Rt0dQaPYmotXza1tKQzQ1Fk0iDHr5vPEOTUpO88e77+9zvjjtBh8HTOb8e0hu0eN8Xzz22ikonoGzHdgXcAVB16S75U/mbn/m2AK+mglqbBUAGvCIRuVCJ7HLXQCUTPQOxXi8Q4FolnYWuAH0+HaEpjrdxAyC3VSq33xKgPTWiYYUai8IjUCabw4Zw1XWNF2+OZrXoi+cLImBth4odfQAw0elCW6zdKvU2/wVkYs8ggzBlRqrcI/DrrK1wQ7DWAIToV8lsqGxHDwTY6qYbA1jpCVAux3oBSirhDPYCOL6kE/s/QB77UrnNJoDDVkCN6pI+BJH+6xINQdpKOCf1d/AEYBxgUUQC5PcLbPMDXy1lhGXx7r0G6ExklpBwI0xh2w7ID+UzL71iL/MJdzuZdDL/kXcAAAAASUVORK5CYII=\"\n                                      style=\"width: 16px;height: 16px;\">\n                                    <img *ngIf=\"icon.iconName === 'hd-img-star' && selectItem[icon.fieldName]\"\n                                      src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAyhJREFUWEe1ll1o1XYYxp8nPUmUihdCV3bAirvYzUC80Xpy3KwTZNR2CdOhDkTBwe6G32XzwqpjE3Qt4pUKZQqDyQZNTp1uY8yCJG0F2d2+LlWOOkShovQkaV45lcJpTdOTHJubBPI+z/Pj//H+/0TGR66uf8sPoz8A/Kstkp38YORxFitmEVU1vm1cBPlp9ZuQXtX0jmfxygQgvxSWBRWlDECvhgrwQFuqLufG4TAtRCaAwCl+IcDXtWEi2KFb7pUFBxCBEpSMMsDWGWEiNzXLe2/BASp2cTuJH+KCRMJ3dGvsrzQQqafAtw0XpBEfIhc00/tswQD8QWM1FP45d4A8V9XJN9k5Nl4vRKoR8G3jMshdyebRPs0cOftaAaRUbAsRrRRRhuczFsF/lPATNQrL3Hr7/nz1lGvvtkwGUSEC8gLkWfMGkAfQMp9J0n8ByhS5J+QDVr+BshBlUu6q3d5v9G3jIcg3GgnJqp2C853iCIB1WU0a1F2iOO2tPnK3CLQ1aJZKLpCfddPrmtoF8uuqZn9iyfcEzVQumYtlQDO9vS8PsprHd4xvAR7I7FuHUIBvdNP9crr0lT7g24U+UNlfh1f6Esrn2ofeuVphbCPyneJuAN+lT0jokZCduum9cobM2Qn9krEGEa6+hi36jEC3aro34vASW3FoG9si8sdGRoKCY6rlnpjLIxGgYhunSPY0AiAiP+mW93EmAN8ujoJobwgAuKOb7orUAHKjY1EwHjwFkGsEoKpVJ6WVH3n/p1oDwVBhk0TK742GV/UKYOZMt5QKoGIbX5E8mgwg4wCbADQn1c1uPvP2gWqB7xjDADck7OwBVan0QFFyQaj2A9wxV60A13XT7Uw1Ar5TlDiBQP6hRHs0a3Ss9n8wuK4jYtN5Em/H6B5ppht7r4jvhEOFtYiUGQEAnhDoV033ZNJwB45xRAS9IBfX1qnhRD7uhhQLENiFQ0Ll9LSBCM7olnu43gUpTjEfiPSB3D6tUQRbcpZ7bbZHLEBYKnRFogxV505rmjzIrtG/6w2fMS0l430RHAVoULBZtdybdQFkCcuqSXUtzxqSpHsBfmUdgJhaiDQAAAAASUVORK5CYII=\"\n                                      style=\"width: 16px;height: 16px;\">\n                                    <span *ngIf=\"icon.iconName === 'hd-select-close' && selectItem[icon.fieldName]\"\n                                      class=\"hd-select-close\">\n                                      \u7981\u7528\n                                    </span>\n                                    <span *ngIf=\"icon.iconName === 'hd-select-purchase' && selectItem[icon.fieldName]\"\n                                      class=\"hd-select-purchase\">\n                                      \u534F\n                                    </span>\n                                  </ng-container>\n                                </div>\n                              </ng-container>\n                              <ng-template #notPictureTemplate>\n                                <ng-container\n                                  *ngIf=\"!isTextOverflow(selectOptionTableColumn.render ? selectOptionTableColumn.render(selectItem) : selectItem[selectOptionTableColumn.name], selectOptionTableColumn.width);else overflowTemplate\">\n                                  <div>{{\n                                    judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])\n                                    }}\n                                  </div>\n                                </ng-container>\n                                <ng-template #overflowTemplate>\n                                  <div class=\"hd-option-overflow\" nz-tooltip\n                                    [nzTooltipTitle]=\"selectOptionTableColumn.render ? selectOptionTableColumn.render(selectItem) : selectItem[selectOptionTableColumn.name]\">\n                                    {{\n                                    judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])\n                                    }}\n                                  </div>\n                                </ng-template>\n                              </ng-template>\n                            </div>\n                          </div>\n                        </nz-option>\n                        <nz-option\n                          *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\"\n                          [nzLabel]=\"(formItem.selectOption.value === 'code' || formItem.selectOption.value === 'productCode' || formItem.selectOption.hdShowItemCode) ? ('['+ line.get(formItem.selectOption.value).value + ']' + line.get(formItem.selectOption.label).value) : line.get(formItem.selectOption.label).value\"\n                          [nzValue]=\"line.get(formItem.selectOption.value).value\" nzHide></nz-option>\n                      </nz-select>\n                      <ng-template #nomarlSelectTemplate>\n                        <nz-select #formInputDom (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                          [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                          [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                          [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                          [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                          [formControlName]=\"formItem.name\"\n                          (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                          (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\"\n                          [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                          <nz-option\n                            *ngFor=\"let selectItem of (formItem.selectOption.selectList || line.get(formItem.selectOption.selectListName).value)\"\n                            [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                          selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\">\n                          </nz-option>\n                          <nz-option\n                            *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\"\n                            [nzLabel]=\"(formItem.selectOption.value === 'code' || formItem.selectOption.value === 'productCode' || formItem.selectOption.hdShowItemCode) ? ('['+ line.get(formItem.selectOption.value).value + ']' + line.get(formItem.selectOption.label).value) : line.get(formItem.selectOption.label).value\"\n                            [nzValue]=\"line.get(formItem.selectOption.value).value\" nzHide></nz-option>\n                        </nz-select>\n                      </ng-template>\n\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Date'\">\n                      <nz-date-picker #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\" *ngIf=\"formItem.showTime\"\n                        [ngStyle]=\"getStyle(line, formItem, '150px')\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                        [nzShowToday]=\"formItem.hdShowToday !== false\" nzShowTime\n                        nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                      </nz-date-picker>\n                      <nz-date-picker #formInputDom *ngIf=\"!formItem.showTime\"\n                        [ngStyle]=\"getStyle(line, formItem, '150px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                        [nzShowToday]=\"formItem.hdShowToday !== false\">\n                      </nz-date-picker>\n                      <div *ngIf=\"formItem?.explainOptionRight?.show\"\n                        [style.color]=\"formItem?.explainOptionRight?.color ? formItem.explainOptionRight.color : null\">\n                        &nbsp;&nbsp;{{ line.get(formItem.explainOptionRight.name).value }}\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'DateRange'\">\n                      <nz-range-picker #formInputDom [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [nzDisabledDate]=\"formItem.hdDisabledDate\" [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\"\n                        [formControlName]=\"formItem.name\">\n                      </nz-range-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'TextArea'\">\n                      <textarea #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [ngStyle]=\"{'color': formItem?.colorOption?.name ? line.get(formItem.colorOption.name).value : null}\"\n                        [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                        [maxlength]=\"formItem.maxLength || null\" rows=\"4\" nz-input\n                        [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"></textarea>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'InputNumber'\">\n                      <div style=\"display: flex;align-items: center;\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        <nz-input-number #formInputDom [ngStyle]=\"getStyle(line, formItem, '100px')\"\n                          [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"\n                          [nzMin]=\"formItem?.inputNumber?.min || 0\" [nzMax]=\"formItem?.inputNumber?.max || 99999999\"\n                          [nzStep]=\"formItem?.inputNumber?.step || 1\"\n                          [nzPrecision]=\"formItem?.inputNumber?.precision != null ? formItem.inputNumber.precision : 2\"\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                          [nzId]=\"'inputNumber-' + formItem.name + line.get('lineIndex').value\"\n                          (click)=\"formItem.isSelect ? selectValue('#inputNumber-' + formItem.name + line.get('lineIndex').value, dataIndex , innerIndex) : setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        </nz-input-number>\n                        <div *ngIf=\"formItem?.explainOptionRight?.show\"\n                          [style.color]=\"formItem?.explainOptionRight?.color ? formItem.explainOptionRight.color : null\">\n                          &nbsp;&nbsp;{{ line.get(formItem.explainOptionRight.name).value }}\n                        </div>\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'MultipleSelect'\">\n                      <nz-select #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\" nzMode=\"multiple\"\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                        [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                        (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\">\n                        <nz-option *ngFor=\"let selectItem of formItem.selectOption.selectList\"\n                          [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                        selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\"></nz-option>\n                        <ng-container\n                          *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\">\n                          <nz-option *ngFor=\"let option of line.get(formItem.selectOption.value).value;index as i\"\n                            [nzLabel]=\"line.get(formItem.selectOption.label).value[i]\" [nzValue]=\"option\" nzHide>\n                          </nz-option>\n                        </ng-container>\n                      </nz-select>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'ViewDom'\">\n                      <span class=\"hd-formLines-viewDom\" *ngIf=\"!formItem?.hideViewDomValue\">\n                        {{\n                        (formItem.preserveNumber && line.get(formItem.name).value) ?\n                        LodashRound(line.get(formItem.name).value,\n                        formItem.preserveNumber).toFixed(formItem.preserveNumber)\n                        : line.get(formItem.name).value\n                        }}\n                      </span>\n                      <ng-container\n                        *ngTemplateOutlet=\"ViewDomRightTemplate;context:{formItem: formItem, formLine: line}\"></ng-container>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Switch'\">\n                      <nz-switch (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [formControlName]=\"formItem.name\"></nz-switch>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Time'\">\n                      <nz-time-picker #formInputDom [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [formControlName]=\"formItem.name\"></nz-time-picker>\n                    </ng-container>\n                  </ng-container>\n                </nz-form-control>\n              </nz-form-item>\n              <div *ngIf=\"formItem?.explainOption?.show\"\n                [style.color]=\"formItem?.explainOption?.color ? formItem.explainOption.color : null\">\n                {{ line.get(formItem.explainOption.name).value }}\n              </div>\n            </td>\n          </ng-container>\n          <td [style.width.px]=\"operateColWidth\" nzRight=\"0\">\n            <span class=\"common-btn-group\">\n              <a *ngIf=\"operateButtons.includes('add')\" (click)=\"addFormLine(line)\">\u6DFB\u52A0</a>\n              <a *ngIf=\"operateButtons.includes('copy')\" (click)=\"copyFormLine(line)\">\u590D\u5236</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && !showDeleteConfirm\"\n                (click)=\"deleteFormLine(line)\">\u5220\u9664</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && showDeleteConfirm\" nz-popconfirm\n                nzPopconfirmTitle=\"\u786E\u8BA4\u8981\u5220\u9664\u8BE5\u884C\u5417?\" nzPopconfirmPlacement=\"bottom\"\n                (nzOnConfirm)=\"deleteFormLine(line)\">\u5220\u9664</a>\n            </span>\n          </td>\n        </tr>\n      </ng-container>\n      <!-- \u5408\u8BA1\u533A\u57DF -->\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showCheckbox\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td [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, totalOption.preserveNumber).toFixed(totalOption.preserveNumber)) : ''\n            }}\n          </td>\n        </ng-container>\n      </tr>\n    </tbody>\n  </nz-table>\n  <nz-list\n    *ngIf=\"linesFormArray.controls.slice((paginationPageIndex - 1) * paginationPageSize, (paginationPageIndex - 1) * paginationPageSize + paginationPageSize).length === 0\"\n    [nzDataSource]=\"[]\"></nz-list>\n  <ng-container>\n    <hd-space background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n    <div class=\"hd-formLines-pagination\">\n      <div class=\"hd-formLines-pagination-left\">\n        <div *ngIf=\"showKeyboardOperateTip\">\u652F\u6301\u952E\u76D8\u64CD\u4F5C\uFF0C\u4F7F\u7528\n          <i nz-icon nzType=\"up-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"down-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"left-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"right-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <span style=\"font-size: 14px;margin-left: 4px;font-weight: bolder;\">Enter</span>\n          \u952E\u5207\u6362\u8868\u5355\u9879\n        </div>\n      </div>\n      <nz-pagination [nzSize]=\"'small'\" style=\"text-align: right;\" [nzPageIndex]=\"paginationPageIndex\"\n        [nzPageSize]=\"paginationPageSize\" [nzPageSizeOptions]=\"[10, 20, 30, 40, 50]\"\n        [nzTotal]=\"linesFormArray.controls.length\" nzShowSizeChanger (nzPageIndexChange)=\"pageIndexChange($event)\"\n        (nzPageSizeChange)=\"pageSizeChange($event)\" [nzShowTotal]=\"totalTemplate\"></nz-pagination>\n      <ng-template #totalTemplate let-total>\u5171 {{ linesFormArray.controls.length }} \u6761\u6570\u636E</ng-template>\n    </div>\n\n  </ng-container>\n</form>\n",
+                        template: "<ng-container *ngIf=\"showForm && showToolbar\">\n  <hd-button-group class=\"hd-formLines-toolbar\">\n    <ng-template #buttonGroupLeft>\n      <!-- \u6709\u5168\u5C40\u641C\u7D22\uFF1A\u5DE6\u4FA7\u653E\u641C\u7D22\u6846 -->\n      <ng-container *ngIf=\"showSearch\">\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-container>\n      <!-- \u65E0\u5168\u5C40\u641C\u7D22\uFF1A\u5DE6\u4FA7\u653E\u81EA\u5B9A\u4E49\u6309\u94AE -->\n      <ng-container *ngIf=\"!showSearch\">\n        <ng-container *ngTemplateOutlet=\"formLinesLeftButton\"></ng-container>\n      </ng-container>\n    </ng-template>\n    <ng-template #buttonGroupRight>\n      <!-- \u6709\u5168\u5C40\u641C\u7D22\uFF1A\u53F3\u4FA7\u8303\u56F4\u518D\u5DE6\u53F3\u5206\u5F00 -->\n      <div class=\"hd-formLines-toolbar-right\" *ngIf=\"showSearch\">\n        <div class=\"hd-formLines-toolbar-right-left\">\n          <ng-container *ngTemplateOutlet=\"formLinesLeftButton\"></ng-container>\n        </div>\n        <div class=\"hd-formLines-toolbar-right-right\">\n          <ng-container *ngTemplateOutlet=\"formLinesRightButton\"></ng-container>\n        </div>\n      </div>\n      <!-- \u65E0\u5168\u5C40\u641C\u7D22\uFF1A\u53F3\u4FA7\u53EA\u653E\u81EA\u5B9A\u4E49\u53F3\u4FA7\u6309\u94AE -->\n      <ng-container *ngIf=\"!showSearch\">\n        <ng-container *ngTemplateOutlet=\"formLinesRightButton\"></ng-container>\n      </ng-container>\n    </ng-template>\n  </hd-button-group>\n  <hd-space background=\"transparent\" type=\"row\" size=\"12\"></hd-space>\n</ng-container>\n\n<!-- \u52FE\u9009\u63D0\u793A\uFF1A\u5355\u72EC\u4E00\u884C\uFF0C\u653E\u5728\u8868\u5355\u4E0A\u65B9 -->\n<ng-container *ngIf=\"showForm && showCheckbox && getSelectedCount() > 0\">\n  <nz-alert nzType=\"info\" [nzMessage]=\"selectionAlertTemplate\" nzShowIcon></nz-alert>\n  <hd-space background=\"transparent\" type=\"row\" size=\"12\"></hd-space>\n</ng-container>\n<ng-template #selectionAlertTemplate>\n  <span>\u5DF2\u9009\u62E9{{ getSelectedCount() }}\u6761\u6570\u636E</span>&nbsp;&nbsp;\n  <span class=\"common-btn-group\">\n    <a (click)=\"clearSelection()\">\u6E05\u7A7A</a>\n  </span>\n</ng-template>\n\n<!-- <hd-button type=\"primary\" (clickAction)=\"focusDom(0, 0)\">\u805A\u7126\u7B2C\u4E00\u4E2A</hd-button> -->\n\n<form *ngIf=\"showForm\" nz-form [formGroup]=\"validateHdFormLines\" class=\"ant-advanced-search-form hd-formLines-container\"\n  (keydown)=\"onKeyDown($event)\">\n  <nz-table nzTemplateMode [nzFrontPagination]=\"false\" [nzLoading]=\"tableLoading\" [nzScroll]=\"scroll\">\n    <thead>\n      <tr>\n        <th nzWidth=\"40px\" nzLeft=\"0px\" *ngIf=\"showCheckbox\">\n          <label nz-checkbox\n            [ngModel]=\"isAllChecked()\"\n            [nzIndeterminate]=\"isIndeterminate()\"\n            [ngModelOptions]=\"{standalone: true}\"\n            (ngModelChange)=\"onAllChecked($event)\"></label>\n        </th>\n        <th nzWidth=\"58px\" [nzLeft]=\"lineNumberLeft\" *ngIf=\"showLineNumber\">\u5E8F\u53F7</th>\n        <ng-container *ngFor=\"let item of formLines\">\n          <th *ngIf=\"!item.hide\" [nzAlign]=\"item.align ? item.align : 'left'\">\n            <span *ngIf=\"item.require\" style=\"color: red;\">*</span>{{ item.label }}\n          </th>\n        </ng-container>\n        <th [style.width.px]=\"operateColWidth\" nzRight=\"0\">\u64CD\u4F5C</th>\n      </tr>\n    </thead>\n    <tbody>\n      <ng-container\n        *ngFor=\"let line of linesFormArray.controls.slice((paginationPageIndex - 1) * paginationPageSize, (paginationPageIndex - 1) * paginationPageSize + paginationPageSize);index as dataIndex\"\n        formArrayName=\"lines\">\n        <tr [formGroup]=\"line\">\n          <td nzWidth=\"40px\" nzLeft=\"0px\" *ngIf=\"showCheckbox\">\n            <label nz-checkbox\n              [ngModel]=\"isLineChecked(line)\"\n              [ngModelOptions]=\"{standalone: true}\"\n              (ngModelChange)=\"onLineCheckedChange(line, $event)\"></label>\n          </td>\n          <td nzWidth=\"58px\" [nzLeft]=\"lineNumberLeft\" *ngIf=\"showLineNumber\">\n            {{ line.get('lineIndex').value }}\n          </td>\n          <ng-container *ngFor=\"let formItem of formLines; index as innerIndex\">\n            <td *ngIf=\"!formItem.hide\" [nzAlign]=\"formItem.align ? formItem.align : 'left'\">\n              <nz-form-item>\n                <nz-form-control\n                  [nzValidateStatus]=\"getControlValidateStatus(line, formItem)\"\n                  [nzErrorTip]=\"formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A'\">\n                  <ng-container [ngSwitch]=\"formItem.type\">\n                    <ng-container *ngSwitchCase=\"'Input'\">\n                      <nz-input-group [nzSuffix]=\"inputCleanTemplate\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        <input #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                          [ngStyle]=\"getStyle(line, formItem, '100px')\" nz-input\n                          [ngStyle]=\"{'color': formItem?.colorOption?.name ? line.get(formItem.colorOption.name ).value : null}\"\n                          [id]=\"'input-' + formItem.name + line.get('lineIndex').value\"\n                          (click)=\"formItem.isSelect ? selectValue('#input-' + formItem.name + line.get('lineIndex').value, dataIndex , innerIndex) : null\"\n                          (input)=\"limitInputLength($event, line, formItem)\"\n                          [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                          [formControlName]=\"formItem.name\" />\n                      </nz-input-group>\n                      <ng-template #inputCleanTemplate>\n                        <i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\" nzType=\"close-circle\"\n                          *ngIf=\"line.get(formItem.name).value && !line.get(formItem.name).disabled\"\n                          (click)=\"inputClean(formItem ,line)\"></i>\n                      </ng-template>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Select'\">\n                      <nz-select #formInputDom (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        nzDropdownClassName=\"hd-select-table\"\n                        *ngIf=\"formItem.selectOption.tableColumns;else nomarlSelectTemplate\"\n                        [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                        [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\"\n                        (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                        (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\"\n                        [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                        <div class=\"hd-select-empty\"\n                          *ngIf=\"!(formItem.selectOption?.selectList?.length > 0 || line.get(formItem.selectOption.selectListName)?.value?.length > 0)\">\n                          <img\n                            src=\"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI0MXB4IiB2aWV3Qm94PSIwIDAgNjQgNDEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUyLjUgKDY3NDY5KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDxnIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00NzIuMDAwMDAwLCAtMTMzNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDY0LjAwMDAwMCwgMTExNC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnICB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MC4wMDAwMDAsIDc4LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxnICB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNjguMDAwMDAwLCAxNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxnID4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxlbGxpcHNlICBmaWxsPSIjRjVGNUY1IiBjeD0iMzIiIGN5PSIzMyIgcng9IjMyIiByeT0iNyI+PC9lbGxpcHNlPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPGcgICB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjAwMDAwMCwgMC4wMDAwMDApIiBmaWxsLXJ1bGU9Im5vbnplcm8iIHN0cm9rZT0iI0Q5RDlEOSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQ2LDEyLjc2MDU2MDQgTDM1Ljg1NDMwNDcsMS4yNTczOTYzMyBDMzUuMzY3NDQxNCwwLjQ3MzgyNjYwNSAzNC42NTU4Nzg5LDAgMzMuOTA2NzYxNywwIEwxMi4wOTMyMzgzLDAgQzExLjM0NDEyMTEsMCAxMC42MzI1NTg2LDAuNDczOTUwMjU1IDEwLjE0NTY5NTMsMS4yNTczOTYzMyBMMi42MTQ3OTcyN2UtMTIsMTIuNzYwNTYwNCBMMCwyMiBMNDYsMjIgTDQ2LDEyLjc2MDU2MDQgWiIgID48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTMyLjYxMzI4MTMsMTUuOTMxNSBDMzIuNjEzMjgxMywxNC4zMjU4NTExIDMzLjYwNjk1MzEsMTMuMDAwMjM0IDM0LjgzOTY5OTIsMTMgTDQ2LDEzIEw0NiwzMS4xMzcxMjc3IEM0NiwzMy4yNTg5NTc0IDQ0LjY3OTM4NjcsMzUgNDMuMDUwNDI5NywzNSBMMi45NDk1NzAzMSwzNSBDMS4zMjA1MjM0NCwzNSAwLDMzLjI1ODg0MDQgMCwzMS4xMzcxMjc3IEwwLDEzIEwxMS4xNjAzMDA4LDEzIEMxMi4zOTMwNDY5LDEzIDEzLjM4NjcxODgsMTQuMzIyODA4NSAxMy4zODY3MTg4LDE1LjkyODQ1NzQgTDEzLjM4NjcxODgsMTUuOTQ5NjM4MyBDMTMuMzg2NzE4OCwxNy41NTUyODcyIDE0LjM5MTcxMDksMTguODUxMTgwOSAxNS42MjQ0NTcsMTguODUxMTgwOSBMMzAuMzc1NTQzLDE4Ljg1MTE4MDkgQzMxLjYwODI4OTEsMTguODUxMTgwOSAzMi42MTMyODEzLDE3LjU0MzM1MTEgMzIuNjEzMjgxMywxNS45Mzc3MDIxIEwzMi42MTMyODEzLDE1LjkzMTUgWiIgIGZpbGw9IiNGQUZBRkEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+\"\n                            alt=\"empty\">\n                          <p class=\"ant-empty-description\">\u6682\u65E0\u6570\u636E</p>\n                        </div>\n\n                        <nz-option nzCustomContent\n                          *ngFor=\"let selectItem of (formItem.selectOption.selectList || line.get(formItem.selectOption.selectListName).value)\"\n                          [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                          selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\">\n                          <div class=\"hd-option-line\">\n                            <div *ngFor=\"let selectOptionTableColumn of formItem.selectOption.tableColumns\"\n                              [ngStyle]=\"getSelectTableColumnStyle(selectOptionTableColumn)\">\n                              <ng-container *ngIf=\"selectOptionTableColumn.icons;else notPictureTemplate\">\n                                <div class=\"hd-option-icons\">\n                                  <ng-container *ngFor=\"let icon of selectOptionTableColumn.icons\">\n                                    <img *ngIf=\"icon.iconName === 'hd-recommend-star' && selectItem[icon.fieldName]\"\n                                      src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAVpJREFUOE+l07FLQkEcB/Dv7713Zg1GQ0SgW9AmTYVp1BRUokZBEI1u/QVBUBD1D0Rt0dQaPYmotXza1tKQzQ1Fk0iDHr5vPEOTUpO88e77+9zvjjtBh8HTOb8e0hu0eN8Xzz22ikonoGzHdgXcAVB16S75U/mbn/m2AK+mglqbBUAGvCIRuVCJ7HLXQCUTPQOxXi8Q4FolnYWuAH0+HaEpjrdxAyC3VSq33xKgPTWiYYUai8IjUCabw4Zw1XWNF2+OZrXoi+cLImBth4odfQAw0elCW6zdKvU2/wVkYs8ggzBlRqrcI/DrrK1wQ7DWAIToV8lsqGxHDwTY6qYbA1jpCVAux3oBSirhDPYCOL6kE/s/QB77UrnNJoDDVkCN6pI+BJH+6xINQdpKOCf1d/AEYBxgUUQC5PcLbPMDXy1lhGXx7r0G6ExklpBwI0xh2w7ID+UzL71iL/MJdzuZdDL/kXcAAAAASUVORK5CYII=\"\n                                      style=\"width: 16px;height: 16px;\">\n                                    <img *ngIf=\"icon.iconName === 'hd-img-star' && selectItem[icon.fieldName]\"\n                                      src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAyhJREFUWEe1ll1o1XYYxp8nPUmUihdCV3bAirvYzUC80Xpy3KwTZNR2CdOhDkTBwe6G32XzwqpjE3Qt4pUKZQqDyQZNTp1uY8yCJG0F2d2+LlWOOkShovQkaV45lcJpTdOTHJubBPI+z/Pj//H+/0TGR66uf8sPoz8A/Kstkp38YORxFitmEVU1vm1cBPlp9ZuQXtX0jmfxygQgvxSWBRWlDECvhgrwQFuqLufG4TAtRCaAwCl+IcDXtWEi2KFb7pUFBxCBEpSMMsDWGWEiNzXLe2/BASp2cTuJH+KCRMJ3dGvsrzQQqafAtw0XpBEfIhc00/tswQD8QWM1FP45d4A8V9XJN9k5Nl4vRKoR8G3jMshdyebRPs0cOftaAaRUbAsRrRRRhuczFsF/lPATNQrL3Hr7/nz1lGvvtkwGUSEC8gLkWfMGkAfQMp9J0n8ByhS5J+QDVr+BshBlUu6q3d5v9G3jIcg3GgnJqp2C853iCIB1WU0a1F2iOO2tPnK3CLQ1aJZKLpCfddPrmtoF8uuqZn9iyfcEzVQumYtlQDO9vS8PsprHd4xvAR7I7FuHUIBvdNP9crr0lT7g24U+UNlfh1f6Esrn2ofeuVphbCPyneJuAN+lT0jokZCduum9cobM2Qn9krEGEa6+hi36jEC3aro34vASW3FoG9si8sdGRoKCY6rlnpjLIxGgYhunSPY0AiAiP+mW93EmAN8ujoJobwgAuKOb7orUAHKjY1EwHjwFkGsEoKpVJ6WVH3n/p1oDwVBhk0TK742GV/UKYOZMt5QKoGIbX5E8mgwg4wCbADQn1c1uPvP2gWqB7xjDADck7OwBVan0QFFyQaj2A9wxV60A13XT7Uw1Ar5TlDiBQP6hRHs0a3Ss9n8wuK4jYtN5Em/H6B5ppht7r4jvhEOFtYiUGQEAnhDoV033ZNJwB45xRAS9IBfX1qnhRD7uhhQLENiFQ0Ll9LSBCM7olnu43gUpTjEfiPSB3D6tUQRbcpZ7bbZHLEBYKnRFogxV505rmjzIrtG/6w2fMS0l430RHAVoULBZtdybdQFkCcuqSXUtzxqSpHsBfmUdgJhaiDQAAAAASUVORK5CYII=\"\n                                      style=\"width: 16px;height: 16px;\">\n                                    <span *ngIf=\"icon.iconName === 'hd-select-close' && selectItem[icon.fieldName]\"\n                                      class=\"hd-select-close\">\n                                      \u7981\u7528\n                                    </span>\n                                    <span *ngIf=\"icon.iconName === 'hd-select-purchase' && selectItem[icon.fieldName]\"\n                                      class=\"hd-select-purchase\">\n                                      \u534F\n                                    </span>\n                                  </ng-container>\n                                </div>\n                              </ng-container>\n                              <ng-template #notPictureTemplate>\n                                <ng-container\n                                  *ngIf=\"!isTextOverflow(selectOptionTableColumn.render ? selectOptionTableColumn.render(selectItem) : selectItem[selectOptionTableColumn.name], selectOptionTableColumn.width);else overflowTemplate\">\n                                  <div>{{\n                                    judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])\n                                    }}\n                                  </div>\n                                </ng-container>\n                                <ng-template #overflowTemplate>\n                                  <div class=\"hd-option-overflow\" nz-tooltip\n                                    [nzTooltipTitle]=\"selectOptionTableColumn.render ? selectOptionTableColumn.render(selectItem) : selectItem[selectOptionTableColumn.name]\">\n                                    {{\n                                    judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])\n                                    }}\n                                  </div>\n                                </ng-template>\n                              </ng-template>\n                            </div>\n                          </div>\n                        </nz-option>\n                        <nz-option\n                          *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\"\n                          [nzLabel]=\"(formItem.selectOption.showLabelAndValue || formItem.selectOption.value === 'code' || formItem.selectOption.value === 'productCode' || formItem.selectOption.hdShowItemCode) ? ('['+ line.get(formItem.selectOption.value).value + ']' + line.get(formItem.selectOption.label).value) : line.get(formItem.selectOption.label).value\"\n                          [nzValue]=\"line.get(formItem.selectOption.value).value\" nzHide></nz-option>\n                      </nz-select>\n                      <ng-template #nomarlSelectTemplate>\n                        <nz-select #formInputDom (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                          [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                          [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                          [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                          [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                          [formControlName]=\"formItem.name\"\n                          (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                          (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\"\n                          [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                          <nz-option\n                            *ngFor=\"let selectItem of (formItem.selectOption.selectList || line.get(formItem.selectOption.selectListName).value)\"\n                            [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                          selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\">\n                          </nz-option>\n                          <nz-option\n                            *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\"\n                            [nzLabel]=\"(formItem.selectOption.showLabelAndValue || formItem.selectOption.value === 'code' || formItem.selectOption.value === 'productCode' || formItem.selectOption.hdShowItemCode) ? ('['+ line.get(formItem.selectOption.value).value + ']' + line.get(formItem.selectOption.label).value) : line.get(formItem.selectOption.label).value\"\n                            [nzValue]=\"line.get(formItem.selectOption.value).value\" nzHide></nz-option>\n                        </nz-select>\n                      </ng-template>\n\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Date'\">\n                      <nz-date-picker #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\" *ngIf=\"formItem.showTime\"\n                        [ngStyle]=\"getStyle(line, formItem, '150px')\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                        [nzShowToday]=\"formItem.hdShowToday !== false\" nzShowTime\n                        nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                      </nz-date-picker>\n                      <nz-date-picker #formInputDom *ngIf=\"!formItem.showTime\"\n                        [ngStyle]=\"getStyle(line, formItem, '150px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                        [nzShowToday]=\"formItem.hdShowToday !== false\">\n                      </nz-date-picker>\n                      <div *ngIf=\"formItem?.explainOptionRight?.show\"\n                        [style.color]=\"formItem?.explainOptionRight?.color ? formItem.explainOptionRight.color : null\">\n                        &nbsp;&nbsp;{{ line.get(formItem.explainOptionRight.name).value }}\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'DateRange'\">\n                      <nz-range-picker #formInputDom [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [nzDisabledDate]=\"formItem.hdDisabledDate\" [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\"\n                        [formControlName]=\"formItem.name\">\n                      </nz-range-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'TextArea'\">\n                      <textarea #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [ngStyle]=\"{'color': formItem?.colorOption?.name ? line.get(formItem.colorOption.name).value : null}\"\n                        [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                        [maxlength]=\"formItem.maxLength || null\" rows=\"4\" nz-input\n                        [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"></textarea>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'InputNumber'\">\n                      <div style=\"display: flex;align-items: center;\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        <nz-input-number #formInputDom [ngStyle]=\"getStyle(line, formItem, '100px')\"\n                          [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"\n                          [nzMin]=\"formItem?.inputNumber?.min || 0\" [nzMax]=\"formItem?.inputNumber?.max || 99999999\"\n                          [nzStep]=\"formItem?.inputNumber?.step || 1\"\n                          [nzPrecision]=\"formItem?.inputNumber?.precision != null ? formItem.inputNumber.precision : 2\"\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                          [nzId]=\"'inputNumber-' + formItem.name + line.get('lineIndex').value\"\n                          (click)=\"formItem.isSelect ? selectValue('#inputNumber-' + formItem.name + line.get('lineIndex').value, dataIndex , innerIndex) : setActiveDomInFormLines(dataIndex , innerIndex)\">\n                        </nz-input-number>\n                        <div *ngIf=\"formItem?.explainOptionRight?.show\"\n                          [style.color]=\"formItem?.explainOptionRight?.color ? formItem.explainOptionRight.color : null\">\n                          &nbsp;&nbsp;{{ line.get(formItem.explainOptionRight.name).value }}\n                        </div>\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'MultipleSelect'\">\n                      <nz-select #formInputDom (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\" nzMode=\"multiple\"\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        [nzShowSearch]=\"formItem.selectOption.hdShowSearch != null ? formItem.selectOption.hdShowSearch : true\"\n                        [nzAllowClear]=\"formItem.selectOption.hdAllowClear != null ? formItem.selectOption.hdAllowClear : true\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (nzOpenChange)=\"onOpenChangeEvent(formItem.onOpenChangeEvent || null, $event, line, formItem.onOpenChangeEventDebounceTime, formItem)\"\n                        (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\">\n                        <nz-option *ngFor=\"let selectItem of formItem.selectOption.selectList\"\n                          [nzValue]=\"selectItem[formItem.selectOption.value]\" [nzLabel]=\"formItem.selectOption.showLabelAndValue ? '['+ selectItem[formItem.selectOption.value] +']' +\n                        selectItem[formItem.selectOption.label] : selectItem[formItem.selectOption.label]\"></nz-option>\n                        <ng-container\n                          *ngIf=\"formItem.selectOption.label && line.get(formItem.name) && line.get(formItem.selectOption.label)?.value && line.get(formItem.selectOption.value)?.value\">\n                          <nz-option *ngFor=\"let option of line.get(formItem.selectOption.value).value;index as i\"\n                            [nzLabel]=\"line.get(formItem.selectOption.label).value[i]\" [nzValue]=\"option\" nzHide>\n                          </nz-option>\n                        </ng-container>\n                      </nz-select>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'ViewDom'\">\n                      <span class=\"hd-formLines-viewDom\" *ngIf=\"!formItem?.hideViewDomValue\">\n                        {{\n                        (formItem.preserveNumber && line.get(formItem.name).value) ?\n                        LodashRound(line.get(formItem.name).value,\n                        formItem.preserveNumber).toFixed(formItem.preserveNumber)\n                        : line.get(formItem.name).value\n                        }}\n                      </span>\n                      <ng-container\n                        *ngTemplateOutlet=\"ViewDomRightTemplate;context:{formItem: formItem, formLine: line}\"></ng-container>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Switch'\">\n                      <nz-switch (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [formControlName]=\"formItem.name\"></nz-switch>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"'Time'\">\n                      <nz-time-picker #formInputDom [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (click)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        (focusin)=\"setActiveDomInFormLines(dataIndex , innerIndex)\"\n                        [formControlName]=\"formItem.name\"></nz-time-picker>\n                    </ng-container>\n                  </ng-container>\n                </nz-form-control>\n              </nz-form-item>\n              <div *ngIf=\"formItem?.explainOption?.show\"\n                [style.color]=\"formItem?.explainOption?.color ? formItem.explainOption.color : null\">\n                {{ line.get(formItem.explainOption.name).value }}\n              </div>\n            </td>\n          </ng-container>\n          <td [style.width.px]=\"operateColWidth\" nzRight=\"0\">\n            <span class=\"common-btn-group\">\n              <a *ngIf=\"operateButtons.includes('add')\" (click)=\"addFormLine(line)\">\u6DFB\u52A0</a>\n              <a *ngIf=\"operateButtons.includes('copy')\" (click)=\"copyFormLine(line)\">\u590D\u5236</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && !showDeleteConfirm\"\n                (click)=\"deleteFormLine(line)\">\u5220\u9664</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && showDeleteConfirm\" nz-popconfirm\n                nzPopconfirmTitle=\"\u786E\u8BA4\u8981\u5220\u9664\u8BE5\u884C\u5417?\" nzPopconfirmPlacement=\"bottom\"\n                (nzOnConfirm)=\"deleteFormLine(line)\">\u5220\u9664</a>\n            </span>\n          </td>\n        </tr>\n      </ng-container>\n      <!-- \u5408\u8BA1\u533A\u57DF -->\n      <tr *ngIf=\"showTotal\" class=\"hd-table-total\">\n        <td *ngIf=\"showCheckbox\"></td>\n        <td>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td [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, totalOption.preserveNumber).toFixed(totalOption.preserveNumber)) : ''\n            }}\n          </td>\n        </ng-container>\n      </tr>\n    </tbody>\n  </nz-table>\n  <nz-list\n    *ngIf=\"linesFormArray.controls.slice((paginationPageIndex - 1) * paginationPageSize, (paginationPageIndex - 1) * paginationPageSize + paginationPageSize).length === 0\"\n    [nzDataSource]=\"[]\"></nz-list>\n  <ng-container>\n    <hd-space background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n    <div class=\"hd-formLines-pagination\">\n      <div class=\"hd-formLines-pagination-left\">\n        <div *ngIf=\"showKeyboardOperateTip\">\u652F\u6301\u952E\u76D8\u64CD\u4F5C\uFF0C\u4F7F\u7528\n          <i nz-icon nzType=\"up-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"down-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"left-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <i nz-icon nzType=\"right-circle\" nzTheme=\"outline\" style=\"font-size: 16px;margin-left: 4px;\"></i>\n          <span style=\"font-size: 14px;margin-left: 4px;font-weight: bolder;\">Enter</span>\n          \u952E\u5207\u6362\u8868\u5355\u9879\n        </div>\n      </div>\n      <nz-pagination [nzSize]=\"'small'\" style=\"text-align: right;\" [nzPageIndex]=\"paginationPageIndex\"\n        [nzPageSize]=\"paginationPageSize\" [nzPageSizeOptions]=\"[10, 20, 30, 40, 50]\"\n        [nzTotal]=\"linesFormArray.controls.length\" nzShowSizeChanger (nzPageIndexChange)=\"pageIndexChange($event)\"\n        (nzPageSizeChange)=\"pageSizeChange($event)\" [nzShowTotal]=\"totalTemplate\"></nz-pagination>\n      <ng-template #totalTemplate let-total>\u5171 {{ linesFormArray.controls.length }} \u6761\u6570\u636E</ng-template>\n    </div>\n\n  </ng-container>\n</form>\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}::ng-deep .hd-table-container .ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-th-right-sticky{z-index:2;transform:translateZ(0)}::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-left-sticky,::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-right-sticky{background:#f5f8f6!important}::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-right-sticky{background:#fff}::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr.ant-table-row-hover>td.ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-left-sticky,::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-right-sticky{background:#ecf8f1!important}::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-th-right-sticky{box-shadow:none!important}::ng-deep .hd-table-container .ant-table-fixed-right{right:0!important}: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%}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child{width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;min-width:var(--hd-cascader-menu-min-width,auto);max-width:560px}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child .ant-cascader-menu-item{white-space:nowrap}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-formLines-toolbar{display:block}.hd-formLines-toolbar ::ng-deep .hd-button-group-right{flex:1;min-width:0;display:flex;justify-content:flex-end}.hd-formLines-toolbar-right{display:flex;align-items:center;justify-content:space-between;width:100%;margin-left:16px}.hd-formLines-toolbar-right-left,.hd-formLines-toolbar-right-right{display:flex;align-items:center}.hd-formLines-container ::ng-deep td{padding:4px 8px!important}.hd-formLines-container .ant-table-tbody>tr>td,.hd-formLines-container ::ng-deep .ant-table-thead>tr>th{padding:16px 8px}.hd-formLines-container ::ng-deep .hd-table-total>td{border:0!important}.hd-formLines-container ::ng-deep .ant-form-item{margin-bottom:0}.hd-formLines-container .ant-input-number{width:100%}.hd-formLines-container .hd-formLines-viewDom{font-size:14px}::ng-deep .hd-select-table .ant-select-dropdown-menu-item-disabled{background:#f5f8f6!important;border-bottom:1px solid #e8e8e8;position:-webkit-sticky;position:sticky;top:0;z-index:10;padding:0}::ng-deep .hd-select-table .ant-select-dropdown-menu-item-disabled:hover{background:#f5f8f6!important}::ng-deep .hd-option-header{display:flex;align-items:center;color:rgba(0,0,0,.85);background:#f5f8f6}::ng-deep .hd-option-header-column{padding:5px 0}.hd-option-line{display:flex;align-items:center}.hd-option-overflow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hd-select-empty{display:flex;align-items:center;flex-direction:column;padding:20px 0;background:#fff}::ng-deep .ant-empty-small{background:#fff!important;padding:8px 0;margin:0}.hd-formLines-pagination{display:flex;align-items:center;justify-content:space-between}.hd-formLines-pagination .hd-formLines-pagination-left{margin-left:10px;display:flex;align-items:center}.hd-option-icons{display:flex;align-items:center}.hd-select-close{display:block;height:16px;line-height:14px;text-align:center;padding:0 4px;border:1px solid #f5222d;color:#f5222d;font-size:14px}.hd-select-purchase{display:block;height:16px;line-height:14px;text-align:center;padding:0 4px;border:1px solid #20bd62;color:#20bd62;font-size:14px}"]
                     }] }
         ];
@@ -10910,24 +11076,6 @@
         TableTotalOption.prototype.insertName;
     }
 
-    /**
-     * @fileoverview added by tsickle
-     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var HdDetailFormService = /** @class */ (function () {
-        function HdDetailFormService() {
-        }
-        HdDetailFormService.decorators = [
-            { type: core.Injectable, args: [{
-                        providedIn: 'root'
-                    },] }
-        ];
-        /** @nocollapse */
-        HdDetailFormService.ctorParameters = function () { return []; };
-        /** @nocollapse */ HdDetailFormService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function HdDetailFormService_Factory() { return new HdDetailFormService(); }, token: HdDetailFormService, providedIn: "root" });
-        return HdDetailFormService;
-    }());
-
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -11381,6 +11529,7 @@
     exports.HdAccessoryListComponent = HdAccessoryListComponent;
     exports.HdButtonService = HdButtonService;
     exports.HdCurrentTableComponent = HdCurrentTableComponent;
+    exports.HdDetailFormFieldType = HdDetailFormFieldType;
     exports.HdDetailFormService = HdDetailFormService;
     exports.HdFilterService = HdFilterService;
     exports.HdFormLinesService = HdFormLinesService;