fantasy-ngzorro 1.2.10 → 1.2.12

package/fesm5/fantasy-ngzorro.js

@@ -1,4 +1,4 @@
-import { Component, ContentChild, NgModule, Injectable, ɵɵdefineInjectable, EventEmitter, Input, Output, NO_ERRORS_SCHEMA, NgZone, ɵɵinject, ChangeDetectorRef } from '@angular/core';
+import { Component, ContentChild, NgModule, Injectable, ɵɵdefineInjectable, EventEmitter, Input, Output, NO_ERRORS_SCHEMA, ɵɵinject, ChangeDetectorRef } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule, FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
 import { NgZorroAntdModule, InputBoolean, NzModalService } from 'ng-zorro-antd';
@@ -7,6 +7,7 @@ import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import { round } from 'lodash';
 import { InputBoolean as InputBoolean$1 } from 'ng-zorro-antd/core';
 import { NzTableModule } from 'ng-zorro-antd/table';
+import { Subject, of } from 'rxjs';
 import { debounceTime, delay } from 'rxjs/operators';
 import { NzModalService as NzModalService$1 } from 'ng-zorro-antd/modal';
 import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
@@ -16,7 +17,6 @@ import { NzResizableModule } from 'ng-zorro-antd/resizable';
 import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
 import { NzTreeModule } from 'ng-zorro-antd/tree';
 import { createInstance, INDEXEDDB } from 'localforage';
-import { of } from 'rxjs';
 
 /**
  * @fileoverview added by tsickle
@@ -1256,9 +1256,9 @@ var HdSpaceModule = /** @class */ (function () {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var HdFormLinesComponent = /** @class */ (function () {
-    function HdFormLinesComponent(fb, ngZone) {
+    function HdFormLinesComponent(fb) {
+        var _this = this;
         this.fb = fb;
-        this.ngZone = ngZone;
         this.tableLoading = false;
         this.showSearch = false;
         this.operateButtons = ['add', 'delete'];
@@ -1282,7 +1282,18 @@ var HdFormLinesComponent = /** @class */ (function () {
         this.isFilterData = false; // 是否是已经筛选过的数据
         // 是否是已经筛选过的数据
         this.formValid = false; // 表单当前的状态
+        // 表单当前的状态
+        this.searchSubject = new Subject();
+        this.debounceTimeout = 0; // 默认防抖时间
         this.textWidthCache = {};
+        this.searchSubscription = this.searchSubject.pipe(debounceTime(this.debounceTimeout)).subscribe((/**
+         * @param {?} __0
+         * @return {?}
+         */
+        function (_a) {
+            var fn = _a.fn, event = _a.event, line = _a.line;
+            return _this.triggerEvent(fn, event, line);
+        }));
     }
     /**
      * @return {?}
@@ -1328,6 +1339,70 @@ var HdFormLinesComponent = /** @class */ (function () {
     function () {
         return this.formValid;
     };
+    /**
+     * @param {?} fn
+     * @param {?} event
+     * @param {?} line
+     * @param {?} onSearchEventDebounceTime
+     * @return {?}
+     */
+    HdFormLinesComponent.prototype.onSearchEvent = /**
+     * @param {?} fn
+     * @param {?} event
+     * @param {?} line
+     * @param {?} onSearchEventDebounceTime
+     * @return {?}
+     */
+    function (fn, event, line, onSearchEventDebounceTime) {
+        var _this = this;
+        if (onSearchEventDebounceTime) {
+            // 更新防抖时间
+            this.debounceTimeout = onSearchEventDebounceTime;
+            // 取消之前的订阅
+            if (this.searchSubscription) {
+                this.searchSubscription.unsubscribe();
+            }
+            // 创建新的订阅
+            this.searchSubscription = this.searchSubject.pipe(debounceTime(this.debounceTimeout)).subscribe((/**
+             * @param {?} __0
+             * @return {?}
+             */
+            function (_a) {
+                var fn = _a.fn, event = _a.event, line = _a.line;
+                return _this.triggerEvent(fn, event, line);
+            }));
+            // 发送事件
+            this.searchSubject.next({ fn: fn, event: event, line: line });
+        }
+        else {
+            this.triggerEvent(fn, event, line);
+        }
+    };
+    /**
+     *
+     * @param fn 父组件函数
+     * @param event 事件值
+     * @param line 触发的行
+     */
+    /**
+     *
+     * @param {?} fn 父组件函数
+     * @param {?} event 事件值
+     * @param {?} line 触发的行
+     * @return {?}
+     */
+    HdFormLinesComponent.prototype.triggerEvent = /**
+     *
+     * @param {?} fn 父组件函数
+     * @param {?} event 事件值
+     * @param {?} line 触发的行
+     * @return {?}
+     */
+    function (fn, event, line) {
+        if (fn) {
+            fn(event, line);
+        }
+    };
     /**
      * @return {?}
      */
@@ -1792,31 +1867,6 @@ var HdFormLinesComponent = /** @class */ (function () {
             this.calculateLineNumber();
         }
     };
-    /**
-     *
-     * @param fn 父组件函数
-     * @param event 事件值
-     * @param line 触发的行
-     */
-    /**
-     *
-     * @param {?} fn 父组件函数
-     * @param {?} event 事件值
-     * @param {?} line 触发的行
-     * @return {?}
-     */
-    HdFormLinesComponent.prototype.triggerEvent = /**
-     *
-     * @param {?} fn 父组件函数
-     * @param {?} event 事件值
-     * @param {?} line 触发的行
-     * @return {?}
-     */
-    function (fn, event, line) {
-        if (fn) {
-            fn(event, line);
-        }
-    };
     /**
      * @param {?} event
      * @return {?}
@@ -2119,14 +2169,13 @@ var HdFormLinesComponent = /** @class */ (function () {
     HdFormLinesComponent.decorators = [
         { type: Component, args: [{
                     selector: 'hd-form-lines',
-                    template: "<hd-button-group *ngIf=\"showForm && showSearch\">\n  <ng-template #buttonGroupLeft>\n    <nz-input-group [nzSuffix]=\"suffixIconSearch\">\n      <input type=\"text\" nz-input (keyup.enter)=\"searchLines()\" placeholder=\"\u8BF7\u8F93\u5165\u5185\u5BB9\u641C\u7D22\" style=\"width: 300px;\"\n        [(ngModel)]=\"filterStr\" />\n    </nz-input-group>\n    <ng-template #suffixIconSearch>\n      <i nz-icon nzType=\"search\" (click)=\"searchLines()\"></i>\n    </ng-template>\n  </ng-template>\n</hd-button-group>\n<hd-space background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n<form *ngIf=\"showForm\" nz-form [formGroup]=\"validateHdFormLines\"\n  class=\"ant-advanced-search-form hd-formLines-container\">\n  <nz-table nzTemplateMode [nzFrontPagination]=\"false\" [nzLoading]=\"tableLoading\" [nzScroll]=\"scroll\">\n    <thead>\n      <tr>\n        <th nzWidth=\"58px\" nzLeft=\"0px\">\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: 80px\" 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=\"58px\" nzLeft=\"0px\">\n            {{line.get('lineIndex').value}}\n          </td>\n          <ng-container *ngFor=\"let formItem of formLines\">\n            <td *ngIf=\"!formItem.hide\" [nzAlign]=\"formItem.align ? formItem.align : 'left'\">\n              <nz-form-item>\n                <nz-form-control [nzErrorTip]=\"formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A'\">\n                  <ng-container [ngSwitch]=\"formItem.type\">\n                    <ng-container *ngSwitchCase=\"0\">\n                      <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                        <input [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) : null\"\n                          [maxlength]=\"formItem.maxLength || null\"\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=\"1\">\n                      <nz-select nzDropdownClassName=\"hd-select-table\"\n                        *ngIf=\"formItem.selectOption.tableColumns;else nomarlSelectTemplate\" nzShowSearch\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        nzAllowClear\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\"\n                        (nzOnSearch)=\"triggerEvent(formItem.onSearchEvent || null, $event, line)\"\n                        [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                        <nz-option nzCustomContent nzDisabled>\n                          <div class=\"hd-option-header\"\n                            *ngIf=\"(formItem.selectOption?.selectList?.length > 0 || line.get(formItem.selectOption.selectListName)?.value?.length > 0);else emptyTemplate\">\n                            <div class=\"hd-option-header-column\"\n                              *ngFor=\"let selectOptionTableColumn of formItem.selectOption.tableColumns;index as index \"\n                              [ngStyle]=\"{'width': selectOptionTableColumn?.width ? (selectOptionTableColumn.width + ((index === 0 && !selectOptionTableColumn.label) ? 12 : 0) + 'px') : 'unset'}\">\n                              {{selectOptionTableColumn.label}}\n                            </div>\n                          </div>\n                          <ng-template #emptyTemplate>\n                            <div class=\"hd-select-empty\">\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                          </ng-template>\n                        </nz-option>\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]=\"{'width': selectOptionTableColumn?.width ? selectOptionTableColumn.width + 'px' : 'unset'}\">\n                              <ng-container *ngIf=\"selectOptionTableColumn.icons;else notPictureTemplate\">\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                                </ng-container>\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>{{ judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])}}</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])}}</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 nzShowSearch [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                          [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                          nzAllowClear\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                          [formControlName]=\"formItem.name\"\n                          (nzOnSearch)=\"triggerEvent(formItem.onSearchEvent || null, $event, line)\"\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=\"2\">\n                      <nz-date-picker *ngIf=\"formItem.showTime\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\" nzShowTime\n                        nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                      </nz-date-picker>\n                      <nz-date-picker *ngIf=\"!formItem.showTime\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\">\n                      </nz-date-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"3\">\n                      <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"formItem.name\">\n                      </nz-range-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"4\">\n                      <textarea\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=\"5\">\n                      <div style=\"display: flex;align-items: center;\">\n                        <nz-input-number [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 || 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) : null\">\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}}</div>\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"6\">\n                      <nz-select nzMode=\"multiple\" [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        nzShowSearch nzAllowClear\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [ngStyle]=\"getStyle(line, formItem, '200px')\"\n                        (nzOnSearch)=\"triggerEvent(formItem.onSearchEvent || null, $event, line)\">\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=\"7\">\n                      {{(formItem.preserveNumber && line.get(formItem.name).value) ?\n                      LodashRound(line.get(formItem.name).value,formItem.preserveNumber).toFixed(formItem.preserveNumber)\n                      : line.get(formItem.name).value}}\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"8\">\n                      <nz-switch [formControlName]=\"formItem.name\"></nz-switch>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"9\">\n                      <nz-time-picker [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}}</div>\n            </td>\n          </ng-container>\n          <td style=\"width: 80px\" nzRight=\"0\">\n            <span class=\"common-btn-group\">\n              <a *ngIf=\"operateButtons.includes('add')\" (click)=\"addFormLine(line.get('lineIndex').value)\">\u6DFB\u52A0</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && !showDeleteConfirm\"\n                (click)=\"deleteFormLine(line.get('lineIndex').value)\">\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.get('lineIndex').value)\">\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>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{ (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n  </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    <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  </ng-container>\n</form>",
+                    template: "<hd-button-group *ngIf=\"showForm && showSearch\">\n  <ng-template #buttonGroupLeft>\n    <nz-input-group [nzSuffix]=\"suffixIconSearch\">\n      <input type=\"text\" nz-input (keyup.enter)=\"searchLines()\" placeholder=\"\u8BF7\u8F93\u5165\u5185\u5BB9\u641C\u7D22\" style=\"width: 300px;\"\n        [(ngModel)]=\"filterStr\" />\n    </nz-input-group>\n    <ng-template #suffixIconSearch>\n      <i nz-icon nzType=\"search\" (click)=\"searchLines()\"></i>\n    </ng-template>\n  </ng-template>\n</hd-button-group>\n<hd-space background=\"transparent\" type=\"row\" size=\"16\"></hd-space>\n<form *ngIf=\"showForm\" nz-form [formGroup]=\"validateHdFormLines\"\n  class=\"ant-advanced-search-form hd-formLines-container\">\n  <nz-table nzTemplateMode [nzFrontPagination]=\"false\" [nzLoading]=\"tableLoading\" [nzScroll]=\"scroll\">\n    <thead>\n      <tr>\n        <th nzWidth=\"58px\" nzLeft=\"0px\">\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: 80px\" 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=\"58px\" nzLeft=\"0px\">\n            {{line.get('lineIndex').value}}\n          </td>\n          <ng-container *ngFor=\"let formItem of formLines\">\n            <td *ngIf=\"!formItem.hide\" [nzAlign]=\"formItem.align ? formItem.align : 'left'\">\n              <nz-form-item>\n                <nz-form-control [nzErrorTip]=\"formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A'\">\n                  <ng-container [ngSwitch]=\"formItem.type\">\n                    <ng-container *ngSwitchCase=\"0\">\n                      <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                        <input [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) : null\"\n                          [maxlength]=\"formItem.maxLength || null\"\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=\"1\">\n                      <nz-select nzDropdownClassName=\"hd-select-table\"\n                        *ngIf=\"formItem.selectOption.tableColumns;else nomarlSelectTemplate\" nzShowSearch\n                        [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        nzAllowClear\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\"\n                        (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, line, formItem.onSearchEventEventDebounceTime)\"\n                        [ngStyle]=\"getStyle(line, formItem, '200px')\">\n                        <nz-option nzCustomContent nzDisabled>\n                          <div class=\"hd-option-header\"\n                            *ngIf=\"(formItem.selectOption?.selectList?.length > 0 || line.get(formItem.selectOption.selectListName)?.value?.length > 0);else emptyTemplate\">\n                            <div class=\"hd-option-header-column\"\n                              *ngFor=\"let selectOptionTableColumn of formItem.selectOption.tableColumns;index as index \"\n                              [ngStyle]=\"{'width': selectOptionTableColumn?.width ? (selectOptionTableColumn.width + ((index === 0 && !selectOptionTableColumn.label) ? 12 : 0) + 'px') : 'unset'}\">\n                              {{selectOptionTableColumn.label}}\n                            </div>\n                          </div>\n                          <ng-template #emptyTemplate>\n                            <div class=\"hd-select-empty\">\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                          </ng-template>\n                        </nz-option>\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]=\"{'width': selectOptionTableColumn?.width ? selectOptionTableColumn.width + 'px' : 'unset'}\">\n                              <ng-container *ngIf=\"selectOptionTableColumn.icons;else notPictureTemplate\">\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                                </ng-container>\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>{{ judgeColEmpty(selectOptionTableColumn.render ?\n                                    selectOptionTableColumn.render(selectItem) :\n                                    selectItem[selectOptionTableColumn.name])}}</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])}}</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 nzShowSearch [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                          [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                          nzAllowClear\n                          [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                          [formControlName]=\"formItem.name\"\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=\"2\">\n                      <nz-date-picker *ngIf=\"formItem.showTime\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\" nzShowTime\n                        nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                      </nz-date-picker>\n                      <nz-date-picker *ngIf=\"!formItem.showTime\"\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [nzDisabledDate]=\"formItem.hdDisabledDate\">\n                      </nz-date-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"3\">\n                      <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"formItem.name\">\n                      </nz-range-picker>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"4\">\n                      <textarea\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=\"5\">\n                      <div style=\"display: flex;align-items: center;\">\n                        <nz-input-number [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 || 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) : null\">\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}}</div>\n                      </div>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"6\">\n                      <nz-select nzMode=\"multiple\" [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                        [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                        nzShowSearch nzAllowClear\n                        [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                        [formControlName]=\"formItem.name\" [ngStyle]=\"getStyle(line, formItem, '200px')\"\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=\"7\">\n                      {{(formItem.preserveNumber && line.get(formItem.name).value) ?\n                      LodashRound(line.get(formItem.name).value,formItem.preserveNumber).toFixed(formItem.preserveNumber)\n                      : line.get(formItem.name).value}}\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"8\">\n                      <nz-switch [formControlName]=\"formItem.name\"></nz-switch>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"9\">\n                      <nz-time-picker [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}}</div>\n            </td>\n          </ng-container>\n          <td style=\"width: 80px\" nzRight=\"0\">\n            <span class=\"common-btn-group\">\n              <a *ngIf=\"operateButtons.includes('add')\" (click)=\"addFormLine(line.get('lineIndex').value)\">\u6DFB\u52A0</a>\n              <a class=\"common-danger-btn\" *ngIf=\"operateButtons.includes('delete') && !showDeleteConfirm\"\n                (click)=\"deleteFormLine(line.get('lineIndex').value)\">\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.get('lineIndex').value)\">\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>\u5408\u8BA1</td>\n        <ng-container *ngFor=\"let totalOption of totalOptionList\">\n          <td [nzAlign]=\"totalOption.align ? totalOption.align : 'left'\">{{ (totalOption.value || totalOption.value ===\n            0) ? (((totalOption.value % 1 === 0) && !totalOption.showDecimal ) ? totalOption.value :\n            LodashRound(totalOption.value,2).toFixed(2)) : '' }} </td>\n        </ng-container>\n      </tr>\n    </tbody>\n  </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    <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  </ng-container>\n</form>",
                     styles: ["::ng-deep .common-btn-group>a{font-size:12px;font-weight:400;color:#12a34f!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}::ng-deep .ant-input-number-input{height:28px}::ng-deep .ant-input-number{height:28px}textarea.ant-input{height:auto;min-height:28px}::ng-deep .ant-select-selection--multiple{min-height:28px}::ng-deep .ant-select-selection__rendered>ul>li{height:22px!important;margin-top:3px!important;line-height:22px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:28px!important}::ng-deep .ant-input{height:28px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:28px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:12px;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:12px;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-time-picker{width:100%}.hd-formLines-container ::ng-deep td{padding:1.5px 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 .ant-input-number{width:100%}::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}.hd-option-header{display:flex;align-items:center;color:rgba(0,0,0,.85);background:#f5f8f6}.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}"]
                 }] }
     ];
     /** @nocollapse */
     HdFormLinesComponent.ctorParameters = function () { return [
-        { type: FormBuilder },
-        { type: NgZone }
+        { type: FormBuilder }
     ]; };
     HdFormLinesComponent.propDecorators = {
         tableLoading: [{ type: Input }],
@@ -2212,17 +2261,27 @@ if (false) {
      * @type {?}
      * @private
      */
-    HdFormLinesComponent.prototype.textWidthCache;
+    HdFormLinesComponent.prototype.searchSubject;
     /**
      * @type {?}
      * @private
      */
-    HdFormLinesComponent.prototype.fb;
+    HdFormLinesComponent.prototype.debounceTimeout;
     /**
      * @type {?}
      * @private
      */
-    HdFormLinesComponent.prototype.ngZone;
+    HdFormLinesComponent.prototype.searchSubscription;
+    /**
+     * @type {?}
+     * @private
+     */
+    HdFormLinesComponent.prototype.textWidthCache;
+    /**
+     * @type {?}
+     * @private
+     */
+    HdFormLinesComponent.prototype.fb;
 }
 
 /**
@@ -2257,8 +2316,19 @@ var HdFormLinesModule = /** @class */ (function () {
 // import * as moment from 'moment';
 var HdFormComponent = /** @class */ (function () {
     function HdFormComponent(fb) {
+        var _this = this;
         this.fb = fb;
         this.changeEvent = new EventEmitter();
+        this.searchSubject = new Subject();
+        this.debounceTimeout = 0; // 默认防抖时间
+        this.searchSubscription = this.searchSubject.pipe(debounceTime(this.debounceTimeout)).subscribe((/**
+         * @param {?} __0
+         * @return {?}
+         */
+        function (_a) {
+            var fn = _a.fn, event = _a.event;
+            return _this.triggerEvent(fn, event);
+        }));
     }
     /**
      * @return {?}
@@ -2288,6 +2358,43 @@ var HdFormComponent = /** @class */ (function () {
             this.init();
         }
     };
+    /**
+     * @param {?} fn
+     * @param {?} event
+     * @param {?} onSearchEventDebounceTime
+     * @return {?}
+     */
+    HdFormComponent.prototype.onSearchEvent = /**
+     * @param {?} fn
+     * @param {?} event
+     * @param {?} onSearchEventDebounceTime
+     * @return {?}
+     */
+    function (fn, event, onSearchEventDebounceTime) {
+        var _this = this;
+        if (onSearchEventDebounceTime) {
+            // 更新防抖时间
+            this.debounceTimeout = onSearchEventDebounceTime;
+            // 取消之前的订阅
+            if (this.searchSubscription) {
+                this.searchSubscription.unsubscribe();
+            }
+            // 创建新的订阅
+            this.searchSubscription = this.searchSubject.pipe(debounceTime(this.debounceTimeout)).subscribe((/**
+             * @param {?} __0
+             * @return {?}
+             */
+            function (_a) {
+                var fn = _a.fn, event = _a.event;
+                return _this.triggerEvent(fn, event);
+            }));
+            // 发送事件
+            this.searchSubject.next({ fn: fn, event: event });
+        }
+        else {
+            this.triggerEvent(fn, event);
+        }
+    };
     /**
      * @param {?} fn
      * @param {?} event
@@ -2576,7 +2683,7 @@ var HdFormComponent = /** @class */ (function () {
     HdFormComponent.decorators = [
         { type: Component, args: [{
                     selector: 'hd-form',
-                    template: "<form nz-form [formGroup]=\"validateHdForm\" class=\"ant-advanced-search-form hd-formItem-container\">\n  <!-- \u6574\u4F53\u7ED3\u6784 -->\n  <div nz-row [nzGutter]=\"24\">\n    <!-- \u5BF9\u7EC4\u4EF6\u5217\u8868\u5FAA\u73AF\u5904\u7406 -->\n    <ng-container *ngFor=\"let formItem of formList;index as i\">\n      <div nz-row *ngIf=\"formItem.isRowFirst && formItem.isRowFirst === 1\">\n        <div nz-col *ngIf=\"!formItem.hide\" [nzSpan]=\"formItem.width? formItem.width * 6 : 6\">\n          <nz-form-item nzFlex>\n            <nz-form-label class=\"hd-formItem-label\" [nzNoColon]=\"true\">\n              <div class=\"hd-formItem-label-flex\">\n                <span>\n                  <span class=\"hd-formItem-label-require\" *ngIf=\"formItem.require\">*</span>\n                  <span\n                    [ngStyle]=\"{'color': formItem?.labelColor ? formItem.labelColor : null}\">{{formItem.label}}</span>\n                </span>\n                <ng-container *ngIf=\"formItem.explain\">\n                  <span class=\"hd-formItem-label-explain\">{{formItem.explain}}</span>\n                </ng-container>\n              </div>\n            </nz-form-label>\n            <nz-form-control class=\"hd-formItem-control\" [nzErrorTip]=\"formItemErrorTpl\">\n              <ng-template #formItemErrorTpl let-control>\n                <ng-container *ngFor=\"let validatorKey of formItem.validatorKeys;index as i\">\n                  <ng-container *ngIf=\"control.hasError(validatorKey.key)\">\n                    {{ validatorKey.label }}\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"control.hasError('required')\">\n                  {{ formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A' }}\n                </ng-container>\n              </ng-template>\n              <ng-container [ngSwitch]=\"formItem.type\">\n                <ng-container *ngSwitchCase=\"0\">\n                  <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                    <input nz-input [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                      [maxlength]=\"formItem.maxLength || null\"\n                      [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                      [formControlName]=\"formItem.name\" />\n                  </nz-input-group>\n                  <ng-template #inputCleanTemplate><i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\"\n                      nzType=\"close-circle\" *ngIf=\"validateHdForm.get(formItem.name).value && !formItem.disabled\"\n                      (click)=\"inputClean(formItem)\"></i></ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"1\">\n                  <nz-select nzShowSearch [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                    [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                    nzAllowClear [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\"\n                    (nzOnSearch)=\"triggerEvent(formItem.onSearchEvent || null, $event)\">\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                    <nz-option *ngIf=\"formItem.defaultLabel\" [nzLabel]=\"formItem.defaultLabel\"\n                      [nzValue]=\"formItem.value\" nzHide></nz-option>\n                  </nz-select>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"2\">\n                  <nz-date-picker *ngIf=\"!formItem.showTime\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\">\n                  </nz-date-picker>\n                  <nz-date-picker *ngIf=\"formItem.showTime\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\" nzShowTime nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                  </nz-date-picker>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"3\">\n                  <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"formItem.name\">\n                  </nz-range-picker>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"4\">\n                  <textarea [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                    [rows]=\"formItem.textAreaRows ? formItem.textAreaRows : 1\"\n                    [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\" rows=\"1\"\n                    nz-input [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"></textarea>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"5\">\n                  <nz-input-number [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                    [formControlName]=\"formItem.name\" [nzMin]=\"formItem?.inputNumber?.min || 0\"\n                    [nzMax]=\"formItem?.inputNumber?.max || 99999999\" [nzStep]=\"formItem?.inputNumber?.step || 1\"\n                    [nzPlaceHolder]=\"'\u8BF7\u8F93\u5165' + formItem.label\" [nzPrecision]=\"formItem?.inputNumber?.precision || 4\">\n                  </nz-input-number>\n                </ng-container>\n                <!-- \u591A\u9879\u9009\u62E9\u5668 -->\n                <ng-container *ngSwitchCase=\"6\">\n                  <nz-select [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                    [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                    nzMode=\"multiple\" nzShowSearch nzAllowClear\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\"\n                    (nzOnSearch)=\"triggerEvent(formItem.onSearchEvent || null, $event)\">\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 *ngIf=\"formItem.defaultLabel\">\n                      <nz-option *ngFor=\"let option of formItem.defaultLabel;index as i\" [nzLabel]=\"option\"\n                        [nzValue]=\"formItem.value[i]\" nzHide></nz-option>\n                    </ng-container>\n                  </nz-select>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"7\">\n                  <span>{{formItem.value || validateHdForm.get(formItem.name).value}}</span>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"8\">\n                  <nz-switch [formControlName]=\"formItem.name\"></nz-switch>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"9\">\n                  <nz-time-picker [formControlName]=\"formItem.name\"></nz-time-picker>\n                </ng-container>\n              </ng-container>\n            </nz-form-control>\n          </nz-form-item>\n        </div>\n        <!-- \u5FAA\u73AF\u6700\u591A\u56DB\u6B21 -->\n        <ng-container *ngFor=\"let columnItem of formItem.columnItems;index as columnItemIndex\">\n          <div nz-col *ngIf=\"!columnItem.hide\" [nzSpan]=\"columnItem.width? columnItem.width * 6 : 6\">\n            <nz-form-item nzFlex>\n              <nz-form-label class=\"hd-formItem-label\" [nzNoColon]=\"true\">\n                <div class=\"hd-formItem-label-flex\">\n                  <span>\n                    <span class=\"hd-formItem-label-require\" *ngIf=\"columnItem.require\">*</span>\n                    <span\n                      [ngStyle]=\"{'color': columnItem?.labelColor ? columnItem.labelColor : null}\">{{columnItem.label}}</span>\n                  </span>\n                  <ng-container *ngIf=\"columnItem.explain\">\n                    <span class=\"hd-formItem-label-explain\">{{columnItem.explain}}</span>\n                  </ng-container>\n                </div>\n              </nz-form-label>\n              <nz-form-control class=\"hd-formItem-control\" [nzErrorTip]=\"columnItemErrorTpl\">\n                <ng-template #columnItemErrorTpl let-control>\n                  <ng-container *ngFor=\"let validatorKey of columnItem.validatorKeys;index as i\">\n                    <ng-container *ngIf=\"control.hasError(validatorKey.key)\">\n                      {{ validatorKey.label }}\n                    </ng-container>\n                  </ng-container>\n                  <ng-container *ngIf=\"control.hasError('required')\">\n                    {{ columnItem.label + '\u4E0D\u80FD\u4E3A\u7A7A' }}\n                  </ng-container>\n                </ng-template>\n                <ng-container [ngSwitch]=\"columnItem.type\">\n                  <ng-container *ngSwitchCase=\"0\">\n                    <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                      <input *ngIf=\"columnItem.disabled === true;else inputTemplate\" nz-input\n                        [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\" [disabled]=\"true\"\n                        [attr.disabled]=\"true\" [maxlength]=\"columnItem.maxLength || null\"\n                        [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                        [formControlName]=\"columnItem.name\" />\n                      <ng-template #inputTemplate>\n                        <input nz-input [ngStyle]=\"{'color': columnItem?.color ? formItem.color : null}\"\n                          [maxlength]=\"columnItem.maxLength || null\"\n                          [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                          [formControlName]=\"columnItem.name\" />\n                      </ng-template>\n                    </nz-input-group>\n                    <ng-template #inputCleanTemplate><i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\"\n                        nzType=\"close-circle\" *ngIf=\"validateHdForm.get(columnItem.name).value  && !columnItem.disabled\"\n                        (click)=\"inputClean(columnItem)\"></i></ng-template>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"1\">\n                    <nz-select [nzServerSearch]=\"columnItem.selectOption.hdServerSearch || false\"\n                      [nzDropdownMatchSelectWidth]=\"columnItem.selectOption.hdDropdownMatchSelectWidth ? columnItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                      nzShowSearch nzAllowClear\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\"\n                      (nzOnSearch)=\"triggerEvent(columnItem.onSearchEvent || null, $event)\">\n                      <nz-option *ngFor=\"let selectItem of columnItem.selectOption.selectList\"\n                        [nzValue]=\"selectItem[columnItem.selectOption.value]\" [nzLabel]=\"columnItem.selectOption.showLabelAndValue ? '['+ selectItem[columnItem.selectOption.value] +']' +\n                        selectItem[columnItem.selectOption.label] : selectItem[columnItem.selectOption.label]\">\n                      </nz-option>\n                      <nz-option *ngIf=\"columnItem.defaultLabel\" [nzLabel]=\"columnItem.defaultLabel\"\n                        [nzValue]=\"columnItem.value\" nzHide></nz-option>\n                    </nz-select>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"2\">\n                    <nz-date-picker *ngIf=\"columnItem.showTime\" [nzDisabledDate]=\"columnItem.hdDisabledDate\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\" nzShowTime nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                    </nz-date-picker>\n                    <nz-date-picker *ngIf=\"!columnItem.showTime\" [nzDisabledDate]=\"columnItem.hdDisabledDate\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\">\n                    </nz-date-picker>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"3\">\n                    <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"columnItem.name\">\n                    </nz-range-picker>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"4\">\n                    <textarea [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\"\n                      [rows]=\"columnItem.textAreaRows ? columnItem.textAreaRows : 1\" rows=\"1\" nz-input\n                      [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                      [maxlength]=\"columnItem.maxLength || null\" [formControlName]=\"columnItem.name\"></textarea>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"5\">\n                    <nz-input-number [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\"\n                      [formControlName]=\"columnItem.name\" [nzMin]=\"columnItem?.inputNumber?.min || 0\"\n                      [nzMax]=\"columnItem?.inputNumber?.max || 99999999\" [nzStep]=\"columnItem?.inputNumber?.step || 1\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                      [nzPrecision]=\"columnItem?.inputNumber?.precision || 4\">\n                    </nz-input-number>\n                  </ng-container>\n                  <!-- \u591A\u9879\u9009\u62E9\u5668 -->\n                  <ng-container *ngSwitchCase=\"6\">\n                    <nz-select [nzServerSearch]=\"columnItem.selectOption.hdServerSearch || false\"\n                      [nzDropdownMatchSelectWidth]=\"columnItem.selectOption.hdDropdownMatchSelectWidth ? columnItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                      nzMode=\"multiple\" nzShowSearch nzAllowClear\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\"\n                      (nzOnSearch)=\"triggerEvent(columnItem.onSearchEvent || null, $event)\">\n                      <nz-option *ngFor=\"let selectItem of columnItem.selectOption.selectList\"\n                        [nzValue]=\"selectItem[columnItem.selectOption.value]\" [nzLabel]=\"columnItem.selectOption.showLabelAndValue ? '['+ selectItem[columnItem.selectOption.value] +']' +\n                        selectItem[columnItem.selectOption.label] : selectItem[columnItem.selectOption.label]\">\n                      </nz-option>\n                      <ng-container *ngIf=\"columnItem.defaultLabel\">\n                        <nz-option *ngFor=\"let option of columnItem.defaultLabel;index as i\" [nzLabel]=\"option\"\n                          [nzValue]=\"columnItem.value[i]\" nzHide></nz-option>\n                      </ng-container>\n                    </nz-select>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"7\">\n                    <span>{{columnItem.value || validateHdForm.get(columnItem.name).value}}</span>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"8\">\n                    <nz-switch [formControlName]=\"columnItem.name\"></nz-switch>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"9\">\n                    <nz-time-picker [formControlName]=\"columnItem.name\"></nz-time-picker>\n                  </ng-container>\n                </ng-container>\n              </nz-form-control>\n            </nz-form-item>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </div>\n</form>",
+                    template: "<form nz-form [formGroup]=\"validateHdForm\" class=\"ant-advanced-search-form hd-formItem-container\">\n  <!-- \u6574\u4F53\u7ED3\u6784 -->\n  <div nz-row [nzGutter]=\"24\">\n    <!-- \u5BF9\u7EC4\u4EF6\u5217\u8868\u5FAA\u73AF\u5904\u7406 -->\n    <ng-container *ngFor=\"let formItem of formList;index as i\">\n      <div nz-row *ngIf=\"formItem.isRowFirst && formItem.isRowFirst === 1\">\n        <div nz-col *ngIf=\"!formItem.hide\" [nzSpan]=\"formItem.width? formItem.width * 6 : 6\">\n          <nz-form-item nzFlex>\n            <nz-form-label class=\"hd-formItem-label\" [nzNoColon]=\"true\">\n              <div class=\"hd-formItem-label-flex\">\n                <span>\n                  <span class=\"hd-formItem-label-require\" *ngIf=\"formItem.require\">*</span>\n                  <span\n                    [ngStyle]=\"{'color': formItem?.labelColor ? formItem.labelColor : null}\">{{formItem.label}}</span>\n                </span>\n                <ng-container *ngIf=\"formItem.explain\">\n                  <span class=\"hd-formItem-label-explain\">{{formItem.explain}}</span>\n                </ng-container>\n              </div>\n            </nz-form-label>\n            <nz-form-control class=\"hd-formItem-control\" [nzErrorTip]=\"formItemErrorTpl\">\n              <ng-template #formItemErrorTpl let-control>\n                <ng-container *ngFor=\"let validatorKey of formItem.validatorKeys;index as i\">\n                  <ng-container *ngIf=\"control.hasError(validatorKey.key)\">\n                    {{ validatorKey.label }}\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"control.hasError('required')\">\n                  {{ formItem.label + '\u4E0D\u80FD\u4E3A\u7A7A' }}\n                </ng-container>\n              </ng-template>\n              <ng-container [ngSwitch]=\"formItem.type\">\n                <ng-container *ngSwitchCase=\"0\">\n                  <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                    <input nz-input [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                      [maxlength]=\"formItem.maxLength || null\"\n                      [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\"\n                      [formControlName]=\"formItem.name\" />\n                  </nz-input-group>\n                  <ng-template #inputCleanTemplate><i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\"\n                      nzType=\"close-circle\" *ngIf=\"validateHdForm.get(formItem.name).value && !formItem.disabled\"\n                      (click)=\"inputClean(formItem)\"></i></ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"1\">\n                  <nz-select nzShowSearch [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                    [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                    nzAllowClear [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\"\n                    (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, 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                    <nz-option *ngIf=\"formItem.defaultLabel\" [nzLabel]=\"formItem.defaultLabel\"\n                      [nzValue]=\"formItem.value\" nzHide></nz-option>\n                  </nz-select>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"2\">\n                  <nz-date-picker *ngIf=\"!formItem.showTime\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\">\n                  </nz-date-picker>\n                  <nz-date-picker *ngIf=\"formItem.showTime\" [nzDisabledDate]=\"formItem.hdDisabledDate\"\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\" nzShowTime nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                  </nz-date-picker>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"3\">\n                  <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"formItem.name\">\n                  </nz-range-picker>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"4\">\n                  <textarea [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                    [rows]=\"formItem.textAreaRows ? formItem.textAreaRows : 1\"\n                    [placeholder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u8F93\u5165' + formItem.label\" rows=\"1\"\n                    nz-input [maxlength]=\"formItem.maxLength || null\" [formControlName]=\"formItem.name\"></textarea>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"5\">\n                  <nz-input-number [ngStyle]=\"{'color': formItem?.color ? formItem.color : null}\"\n                    [formControlName]=\"formItem.name\" [nzMin]=\"formItem?.inputNumber?.min || 0\"\n                    [nzMax]=\"formItem?.inputNumber?.max || 99999999\" [nzStep]=\"formItem?.inputNumber?.step || 1\"\n                    [nzPlaceHolder]=\"'\u8BF7\u8F93\u5165' + formItem.label\" [nzPrecision]=\"formItem?.inputNumber?.precision || 4\">\n                  </nz-input-number>\n                </ng-container>\n                <!-- \u591A\u9879\u9009\u62E9\u5668 -->\n                <ng-container *ngSwitchCase=\"6\">\n                  <nz-select [nzServerSearch]=\"formItem.selectOption.hdServerSearch || false\"\n                    [nzDropdownMatchSelectWidth]=\"formItem.selectOption.hdDropdownMatchSelectWidth ? formItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                    nzMode=\"multiple\" nzShowSearch nzAllowClear\n                    [nzPlaceHolder]=\"formItem.placeholder ? formItem.placeholder : '\u8BF7\u9009\u62E9' + formItem.label\"\n                    [formControlName]=\"formItem.name\"\n                    (nzOnSearch)=\"onSearchEvent(formItem.onSearchEvent || null, $event, 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 *ngIf=\"formItem.defaultLabel\">\n                      <nz-option *ngFor=\"let option of formItem.defaultLabel;index as i\" [nzLabel]=\"option\"\n                        [nzValue]=\"formItem.value[i]\" nzHide></nz-option>\n                    </ng-container>\n                  </nz-select>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"7\">\n                  <span>{{formItem.value || validateHdForm.get(formItem.name).value}}</span>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"8\">\n                  <nz-switch [formControlName]=\"formItem.name\"></nz-switch>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"9\">\n                  <nz-time-picker [formControlName]=\"formItem.name\"></nz-time-picker>\n                </ng-container>\n              </ng-container>\n            </nz-form-control>\n          </nz-form-item>\n        </div>\n        <!-- \u5FAA\u73AF\u6700\u591A\u56DB\u6B21 -->\n        <ng-container *ngFor=\"let columnItem of formItem.columnItems;index as columnItemIndex\">\n          <div nz-col *ngIf=\"!columnItem.hide\" [nzSpan]=\"columnItem.width? columnItem.width * 6 : 6\">\n            <nz-form-item nzFlex>\n              <nz-form-label class=\"hd-formItem-label\" [nzNoColon]=\"true\">\n                <div class=\"hd-formItem-label-flex\">\n                  <span>\n                    <span class=\"hd-formItem-label-require\" *ngIf=\"columnItem.require\">*</span>\n                    <span\n                      [ngStyle]=\"{'color': columnItem?.labelColor ? columnItem.labelColor : null}\">{{columnItem.label}}</span>\n                  </span>\n                  <ng-container *ngIf=\"columnItem.explain\">\n                    <span class=\"hd-formItem-label-explain\">{{columnItem.explain}}</span>\n                  </ng-container>\n                </div>\n              </nz-form-label>\n              <nz-form-control class=\"hd-formItem-control\" [nzErrorTip]=\"columnItemErrorTpl\">\n                <ng-template #columnItemErrorTpl let-control>\n                  <ng-container *ngFor=\"let validatorKey of columnItem.validatorKeys;index as i\">\n                    <ng-container *ngIf=\"control.hasError(validatorKey.key)\">\n                      {{ validatorKey.label }}\n                    </ng-container>\n                  </ng-container>\n                  <ng-container *ngIf=\"control.hasError('required')\">\n                    {{ columnItem.label + '\u4E0D\u80FD\u4E3A\u7A7A' }}\n                  </ng-container>\n                </ng-template>\n                <ng-container [ngSwitch]=\"columnItem.type\">\n                  <ng-container *ngSwitchCase=\"0\">\n                    <nz-input-group [nzSuffix]=\"inputCleanTemplate\">\n                      <input *ngIf=\"columnItem.disabled === true;else inputTemplate\" nz-input\n                        [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\" [disabled]=\"true\"\n                        [attr.disabled]=\"true\" [maxlength]=\"columnItem.maxLength || null\"\n                        [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                        [formControlName]=\"columnItem.name\" />\n                      <ng-template #inputTemplate>\n                        <input nz-input [ngStyle]=\"{'color': columnItem?.color ? formItem.color : null}\"\n                          [maxlength]=\"columnItem.maxLength || null\"\n                          [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                          [formControlName]=\"columnItem.name\" />\n                      </ng-template>\n                    </nz-input-group>\n                    <ng-template #inputCleanTemplate><i nz-icon nz-tooltip class=\"ant-input-clear-icon\" nzTheme=\"fill\"\n                        nzType=\"close-circle\" *ngIf=\"validateHdForm.get(columnItem.name).value  && !columnItem.disabled\"\n                        (click)=\"inputClean(columnItem)\"></i></ng-template>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"1\">\n                    <nz-select [nzServerSearch]=\"columnItem.selectOption.hdServerSearch || false\"\n                      [nzDropdownMatchSelectWidth]=\"columnItem.selectOption.hdDropdownMatchSelectWidth ? columnItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                      nzShowSearch nzAllowClear\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\"\n                      (nzOnSearch)=\"onSearchEvent(columnItem.onSearchEvent || null, $event, columnItem.onSearchEventEventDebounceTime)\">\n                      <nz-option *ngFor=\"let selectItem of columnItem.selectOption.selectList\"\n                        [nzValue]=\"selectItem[columnItem.selectOption.value]\" [nzLabel]=\"columnItem.selectOption.showLabelAndValue ? '['+ selectItem[columnItem.selectOption.value] +']' +\n                        selectItem[columnItem.selectOption.label] : selectItem[columnItem.selectOption.label]\">\n                      </nz-option>\n                      <nz-option *ngIf=\"columnItem.defaultLabel\" [nzLabel]=\"columnItem.defaultLabel\"\n                        [nzValue]=\"columnItem.value\" nzHide></nz-option>\n                    </nz-select>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"2\">\n                    <nz-date-picker *ngIf=\"columnItem.showTime\" [nzDisabledDate]=\"columnItem.hdDisabledDate\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\" nzShowTime nzFormat=\"yyyy-MM-dd HH:mm:ss\">\n                    </nz-date-picker>\n                    <nz-date-picker *ngIf=\"!columnItem.showTime\" [nzDisabledDate]=\"columnItem.hdDisabledDate\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\">\n                    </nz-date-picker>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"3\">\n                    <nz-range-picker [nzPlaceHolder]=\"['\u5F00\u59CB\u65E5\u671F','\u7ED3\u675F\u65E5\u671F']\" [formControlName]=\"columnItem.name\">\n                    </nz-range-picker>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"4\">\n                    <textarea [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\"\n                      [rows]=\"columnItem.textAreaRows ? columnItem.textAreaRows : 1\" rows=\"1\" nz-input\n                      [placeholder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                      [maxlength]=\"columnItem.maxLength || null\" [formControlName]=\"columnItem.name\"></textarea>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"5\">\n                    <nz-input-number [ngStyle]=\"{'color': columnItem?.color ? columnItem.color : null}\"\n                      [formControlName]=\"columnItem.name\" [nzMin]=\"columnItem?.inputNumber?.min || 0\"\n                      [nzMax]=\"columnItem?.inputNumber?.max || 99999999\" [nzStep]=\"columnItem?.inputNumber?.step || 1\"\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u8F93\u5165' + columnItem.label\"\n                      [nzPrecision]=\"columnItem?.inputNumber?.precision || 4\">\n                    </nz-input-number>\n                  </ng-container>\n                  <!-- \u591A\u9879\u9009\u62E9\u5668 -->\n                  <ng-container *ngSwitchCase=\"6\">\n                    <nz-select [nzServerSearch]=\"columnItem.selectOption.hdServerSearch || false\"\n                      [nzDropdownMatchSelectWidth]=\"columnItem.selectOption.hdDropdownMatchSelectWidth ? columnItem.selectOption.hdDropdownMatchSelectWidth : false\"\n                      nzMode=\"multiple\" nzShowSearch nzAllowClear\n                      [nzPlaceHolder]=\"columnItem.placeholder ? columnItem.placeholder : '\u8BF7\u9009\u62E9' + columnItem.label\"\n                      [formControlName]=\"columnItem.name\"\n                      (nzOnSearch)=\"onSearchEvent(columnItem.onSearchEvent || null, $event, columnItem.onSearchEventEventDebounceTime)\">\n                      <nz-option *ngFor=\"let selectItem of columnItem.selectOption.selectList\"\n                        [nzValue]=\"selectItem[columnItem.selectOption.value]\" [nzLabel]=\"columnItem.selectOption.showLabelAndValue ? '['+ selectItem[columnItem.selectOption.value] +']' +\n                        selectItem[columnItem.selectOption.label] : selectItem[columnItem.selectOption.label]\">\n                      </nz-option>\n                      <ng-container *ngIf=\"columnItem.defaultLabel\">\n                        <nz-option *ngFor=\"let option of columnItem.defaultLabel;index as i\" [nzLabel]=\"option\"\n                          [nzValue]=\"columnItem.value[i]\" nzHide></nz-option>\n                      </ng-container>\n                    </nz-select>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"7\">\n                    <span>{{columnItem.value || validateHdForm.get(columnItem.name).value}}</span>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"8\">\n                    <nz-switch [formControlName]=\"columnItem.name\"></nz-switch>\n                  </ng-container>\n                  <ng-container *ngSwitchCase=\"9\">\n                    <nz-time-picker [formControlName]=\"columnItem.name\"></nz-time-picker>\n                  </ng-container>\n                </ng-container>\n              </nz-form-control>\n            </nz-form-item>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </div>\n</form>",
                     styles: ["::ng-deep .common-btn-group>a{font-size:12px;font-weight:400;color:#12a34f!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}::ng-deep .ant-input-number-input{height:28px}::ng-deep .ant-input-number{height:28px}textarea.ant-input{height:auto;min-height:28px}::ng-deep .ant-select-selection--multiple{min-height:28px}::ng-deep .ant-select-selection__rendered>ul>li{height:22px!important;margin-top:3px!important;line-height:22px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:28px!important}::ng-deep .ant-input{height:28px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:28px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:12px;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:12px;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-time-picker{width:100%}.hd-formItem-container .hd-formItem-label{width:108px;word-break:break-all;text-align:right}.hd-formItem-container .hd-formItem-control{width:calc(100% - 108px)}.hd-formItem-container .ant-input-number{width:100%}.hd-formItem-container .hd-formItem-label-flex{display:inline-flex;flex-direction:column}.hd-formItem-container .hd-formItem-label-flex span{display:inline-block}.hd-formItem-container .hd-formItem-label-flex .hd-formItem-label-require{margin-right:4px;color:#f5222d;font-size:12px;font-family:SimSun,sans-serif}.hd-formItem-container .hd-formItem-label-flex .hd-formItem-label-explain{margin-top:-13px;color:#f5222d}.hd-formItem-container textarea{margin-top:8px}"]
                 }] }
     ];
@@ -2599,6 +2706,21 @@ if (false) {
     HdFormComponent.prototype.validateHdForm;
     /** @type {?} */
     HdFormComponent.prototype.inputValue;
+    /**
+     * @type {?}
+     * @private
+     */
+    HdFormComponent.prototype.searchSubject;
+    /**
+     * @type {?}
+     * @private
+     */
+    HdFormComponent.prototype.debounceTimeout;
+    /**
+     * @type {?}
+     * @private
+     */
+    HdFormComponent.prototype.searchSubscription;
     /**
      * @type {?}
      * @private
@@ -4862,6 +4984,8 @@ if (false) {
     FormLine.prototype.canSearch;
     /** @type {?} */
     FormLine.prototype.onChangeEventDebounceTime;
+    /** @type {?} */
+    FormLine.prototype.onSearchEventEventDebounceTime;
 }
 var ColorOption = /** @class */ (function () {
     function ColorOption() {
@@ -5007,6 +5131,8 @@ if (false) {
     FormItem.prototype.validator;
     /** @type {?} */
     FormItem.prototype.onChangeEventDebounceTime;
+    /** @type {?} */
+    FormItem.prototype.onSearchEventEventDebounceTime;
 }
 var ValidatorKey = /** @class */ (function () {
     function ValidatorKey() {