fantasy-ngzorro 1.0.43 → 1.0.45

package/bundles/fantasy-ngzorro.umd.js

@@ -1738,6 +1738,7 @@
             this.fb = fb;
             this.ngZone = ngZone;
             this.tableLoading = false;
+            this.showSearch = false;
             this.operateButtons = ['add', 'delete'];
             this.scroll = { x: '1px' };
             this.changeEvent = new core.EventEmitter();
@@ -1750,6 +1751,11 @@
             this.columnsNumber = 0;
             this.totalOptionList = [];
             this.showForm = false;
+            this.storeFormLinesData = []; // 缓存的总的表单数据
+            // 缓存的总的表单数据
+            this.filterStoreFormLinesData = []; // 筛选出来的数据列表
+            // 筛选出来的数据列表
+            this.filterIndexStore = []; // 筛选出来的数据在原始列表中的下标
         }
         /**
          * @return {?}
@@ -1758,6 +1764,8 @@
          * @return {?}
          */
         function () {
+            // 缓存一下总的表单数据
+            this.storeFormLinesData = this.formLinesData;
             this.init();
         };
         Object.defineProperty(HdFormLinesComponent.prototype, "linesFormArray", {
@@ -1780,6 +1788,94 @@
             enumerable: true,
             configurable: true
         });
+        // 暴露的方法，用于获取所有数据的valid状态
+        // 暴露的方法，用于获取所有数据的valid状态
+        /**
+         * @return {?}
+         */
+        HdFormLinesComponent.prototype.getValid = 
+        // 暴露的方法，用于获取所有数据的valid状态
+        /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            /** @type {?} */
+            var tmpValidateHdFormLines = this.fb.group({
+                'lines': this.fb.array([])
+            });
+            this.storeFormLinesData.forEach((/**
+             * @param {?} formLinesDataItem
+             * @return {?}
+             */
+            function (formLinesDataItem) {
+                /** @type {?} */
+                var formGroupObj = {};
+                _this.formLines.forEach((/**
+                 * @param {?} item
+                 * @return {?}
+                 */
+                function (item) {
+                    // 新增行 初始数据都为null
+                    formGroupObj[item.name] = _this.fb.control({ value: formLinesDataItem[item.name] === 0 ? 0 : (formLinesDataItem[item.name] || item.value || null), disabled: item.disabled }, item.require ? [forms.Validators.required] : []);
+                    if (item.selectOption && item.selectOption.label) {
+                        formGroupObj[item.selectOption.label] = _this.fb.control(formLinesDataItem[item.selectOption.label] || null, []);
+                    }
+                }));
+                formGroupObj.lineIndex = _this.fb.control(((/** @type {?} */ (tmpValidateHdFormLines.get('lines')))).controls.length, []);
+                /** @type {?} */
+                var formGroupTmp = _this.fb.group(formGroupObj);
+                _this.formLines.forEach((/**
+                 * @param {?} item
+                 * @return {?}
+                 */
+                function (item) {
+                    if (item.onChangeEvent) {
+                        formGroupTmp.get(item.name).valueChanges.subscribe((/**
+                         * @param {?} value
+                         * @return {?}
+                         */
+                        function (value) { return _this.triggerEvent(item.onChangeEvent, value, formGroupTmp); }));
+                    }
+                }));
+                ((/** @type {?} */ (tmpValidateHdFormLines.get('lines')))).insert(((/** @type {?} */ (tmpValidateHdFormLines.get('lines')))).controls.length, formGroupTmp);
+            }));
+            return tmpValidateHdFormLines.valid;
+        };
+        // 暴露的方法，用于获取所有数据
+        // 暴露的方法，用于获取所有数据
+        /**
+         * @return {?}
+         */
+        HdFormLinesComponent.prototype.getLines = 
+        // 暴露的方法，用于获取所有数据
+        /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            /** @type {?} */
+            var allLines = [];
+            this.storeFormLinesData.forEach((/**
+             * @param {?} formLinesDataItem
+             * @return {?}
+             */
+            function (formLinesDataItem) {
+                /** @type {?} */
+                var formGroupObj = {};
+                _this.formLines.forEach((/**
+                 * @param {?} item
+                 * @return {?}
+                 */
+                function (item) {
+                    // 新增行 初始数据都为null
+                    formGroupObj[item.name] = formLinesDataItem[item.name];
+                }));
+                formGroupObj.lineIndex = formLinesDataItem.lineIndex;
+                allLines.push(formGroupObj);
+            }));
+            return allLines;
+        };
         // 全局性的搜索（涵盖页面上所有的可视文字）
         // 全局性的搜索（涵盖页面上所有的可视文字）
         /**
@@ -1793,84 +1889,77 @@
         function () {
             var _this = this;
             this.tableLoading = true;
-            setTimeout((/**
+            /** @type {?} */
+            var filterValue = this.filterStr.trim().toLowerCase();
+            // 如果没有输入搜索字符串，则显示缓存内的所有数据
+            if (!filterValue) {
+                this.setStoreData();
+                return;
+            }
+            this.filterIndexStore = [];
+            // 根据搜索字符串过滤数据
+            /** @type {?} */
+            var filteredData = this.storeFormLinesData.filter((/**
+             * @param {?} data
+             * @param {?} index
              * @return {?}
              */
-            function () {
+            function (data, index) {
                 var e_1, _a;
-                /** @type {?} */
-                var filterValue = _this.filterStr.trim().toLowerCase();
-                // 如果没有输入搜索字符串或者没有数据，则显示所有数据
-                if (!filterValue || !_this.formLinesData || _this.formLinesData.length === 0) {
-                    _this.tableLoading = false;
-                    return;
-                }
-                // 根据搜索字符串过滤数据
-                /** @type {?} */
-                var filteredData = _this.formLinesData.filter((/**
-                 * @param {?} data
-                 * @return {?}
-                 */
-                function (data) {
-                    var e_2, _a;
-                    try {
-                        for (var _b = __values(_this.formLines), _c = _b.next(); !_c.done; _c = _b.next()) {
-                            var item = _c.value;
-                            /** @type {?} */
-                            var value = data[item.name] ? data[item.name].toString().toLowerCase() : '';
-                            if (value.includes(filterValue)) {
-                                return true;
-                            }
+                try {
+                    for (var _b = __values(_this.formLines), _c = _b.next(); !_c.done; _c = _b.next()) {
+                        var item = _c.value;
+                        /** @type {?} */
+                        var value = data[item.name] ? data[item.name].toString().toLowerCase() : '';
+                        if (value.includes(filterValue)) {
+                            _this.filterIndexStore.push(index);
+                            return true;
                         }
                     }
-                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
-                    finally {
-                        try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                        }
-                        finally { if (e_2) throw e_2.error; }
-                    }
-                    return false;
-                }));
-                // 如果没有匹配的数据，则显示空白表单行
-                if (filteredData.length === 0) {
-                    _this.tableLoading = false;
                 }
-                else {
-                    _this.validateHdFormLines = _this.fb.group({
-                        'lines': _this.fb.array([])
-                    });
-                    // 在这里把formlinesData里面匹配到的filteredData数据排序到最前面
-                    /** @type {?} */
-                    var sortedData = [];
+                catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                finally {
                     try {
-                        for (var _b = __values(_this.formLinesData), _c = _b.next(); !_c.done; _c = _b.next()) {
-                            var item = _c.value;
-                            if (filteredData.includes(item)) {
-                                sortedData.unshift(item);
-                            }
-                            else {
-                                sortedData.push(item);
-                            }
-                        }
+                        if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                     }
-                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                    finally {
-                        try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                    }
-                    _this.formLinesData = sortedData;
-                    _this.init();
-                    setTimeout((/**
-                     * @return {?}
-                     */
-                    function () {
-                        _this.tableLoading = false;
-                    }), 0);
+                    finally { if (e_1) throw e_1.error; }
                 }
-            }), 10);
+                return false;
+            }));
+            // 如果没有匹配的数据，则显示空白表单行
+            if (filteredData.length === 0) {
+                this.setStoreData();
+            }
+            else {
+                // 缓存一下筛选后的表单数据
+                this.filterStoreFormLinesData = filteredData;
+                // 处理筛选好的数据 然后重新渲染
+                this.formLinesData = filteredData;
+                this.init();
+                setTimeout((/**
+                 * @return {?}
+                 */
+                function () {
+                    _this.tableLoading = false;
+                }), 0);
+            }
+        };
+        /**
+         * @return {?}
+         */
+        HdFormLinesComponent.prototype.setStoreData = /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            this.formLinesData = this.storeFormLinesData;
+            this.init();
+            setTimeout((/**
+             * @return {?}
+             */
+            function () {
+                _this.tableLoading = false;
+            }), 0);
         };
         /**
          * @param {?} line
@@ -2015,7 +2104,6 @@
                 formGroupObj[item.name] = _this.fb.control({ value: item.value, disabled: item.disabled } || null, item.require && !item.hide ? [forms.Validators.required] : []);
             }));
             formGroupObj.lineIndex = this.fb.control(this.linesFormArray.controls.length, []);
-            formGroupObj.hide = this.fb.control(false, []);
             /** @type {?} */
             var formGroupSubmit = this.fb.group(formGroupObj);
             this.formLines.forEach((/**
@@ -2085,7 +2173,6 @@
                     }
                 }));
                 formGroupObj.lineIndex = _this.fb.control(_this.linesFormArray.controls.length, []);
-                formGroupObj.hide = _this.fb.control(false, []);
                 /** @type {?} */
                 var formGroupTmp = _this.fb.group(formGroupObj);
                 _this.formLines.forEach((/**
@@ -2196,6 +2283,31 @@
          * @return {?}
          */
         function (data) {
+            var _this = this;
+            if (data && data.lines && data.lines.length > 0) {
+                /** @type {?} */
+                var lines_1 = data.lines;
+                if (lines_1.length === this.storeFormLinesData.length) {
+                    lines_1.forEach((/**
+                     * @param {?} item
+                     * @param {?} index
+                     * @return {?}
+                     */
+                    function (item, index) {
+                        _this.storeFormLinesData[index] = __assign({}, _this.storeFormLinesData[index], item);
+                    }));
+                }
+                else {
+                    this.filterIndexStore.forEach((/**
+                     * @param {?} item
+                     * @param {?} index
+                     * @return {?}
+                     */
+                    function (item, index) {
+                        _this.storeFormLinesData[item] = __assign({}, _this.filterStoreFormLinesData[index], lines_1[index]);
+                    }));
+                }
+            }
             this.calculateLineNumber();
             this.changeEvent.emit(this.validateHdFormLines);
         };
@@ -2302,7 +2414,7 @@
         HdFormLinesComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'hd-form-lines',
-                        template: "<hd-button-group *ngIf=\"showForm\">\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\" *ngIf=\"!line.get('hide').value\">\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 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-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                          [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  <ng-container *ngIf=\"linesFormArray.controls.length > 10\">\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, 100, 200]\"\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 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-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                          [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  <ng-container *ngIf=\"linesFormArray.controls.length > 10\">\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, 100, 200]\"\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%}"]
                     }] }
         ];
@@ -2313,6 +2425,7 @@
         ]; };
         HdFormLinesComponent.propDecorators = {
             tableLoading: [{ type: core.Input }],
+            showSearch: [{ type: core.Input }],
             formLines: [{ type: core.Input }],
             formLinesData: [{ type: core.Input }],
             operateButtons: [{ type: core.Input }],
@@ -2337,6 +2450,8 @@
         /** @type {?} */
         HdFormLinesComponent.prototype.tableLoading;
         /** @type {?} */
+        HdFormLinesComponent.prototype.showSearch;
+        /** @type {?} */
         HdFormLinesComponent.prototype.formLines;
         /** @type {?} */
         HdFormLinesComponent.prototype.formLinesData;
@@ -2370,6 +2485,12 @@
         HdFormLinesComponent.prototype.showForm;
         /** @type {?} */
         HdFormLinesComponent.prototype.filterStr;
+        /** @type {?} */
+        HdFormLinesComponent.prototype.storeFormLinesData;
+        /** @type {?} */
+        HdFormLinesComponent.prototype.filterStoreFormLinesData;
+        /** @type {?} */
+        HdFormLinesComponent.prototype.filterIndexStore;
         /**
          * @type {?}
          * @private