@yibozhang/pro-table 0.0.1

package/fesm2015/yibozhang-pro-table.js

@@ -0,0 +1,2448 @@
+import { __awaiter, __rest } from 'tslib';
+import { InjectionToken, EventEmitter, Component, Optional, Inject, Input, Output, ContentChild, ContentChildren, TemplateRef, NgModule, forwardRef, ChangeDetectorRef, ElementRef, ViewChild, ComponentFactoryResolver, ViewContainerRef, Injectable, ɵɵdefineInjectable, ɵɵinject } from '@angular/core';
+import { isEqual, hasIn, cloneDeep, isNil, debounce } from 'lodash-es';
+import { isObservable } from 'rxjs';
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { CommonModule } from '@angular/common';
+import { HttpClientModule, HttpClient } from '@angular/common/http';
+import { FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormArray, FormGroup, FormBuilder } from '@angular/forms';
+import { RouterModule } from '@angular/router';
+import { NzButtonModule } from 'ng-zorro-antd/button';
+import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
+import { NzDatePickerModule } from 'ng-zorro-antd/date-picker';
+import { NzFormModule } from 'ng-zorro-antd/form';
+import { NzGridModule } from 'ng-zorro-antd/grid';
+import { NzIconModule } from 'ng-zorro-antd/icon';
+import { NzInputModule } from 'ng-zorro-antd/input';
+import { NzModalModule } from 'ng-zorro-antd/modal';
+import { NzPopoverModule } from 'ng-zorro-antd/popover';
+import { NzSelectModule } from 'ng-zorro-antd/select';
+import { NzSpaceModule } from 'ng-zorro-antd/space';
+import { NzTableModule } from 'ng-zorro-antd/table';
+import { NzTypographyModule } from 'ng-zorro-antd/typography';
+import { NzCardModule } from 'ng-zorro-antd/card';
+import Sortable from 'sortablejs';
+import { NzAutocompleteModule } from 'ng-zorro-antd/auto-complete';
+import { NzInputNumberModule } from 'ng-zorro-antd/input-number';
+import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+
+const ɵ0 = () => [], ɵ1 = (value) => `${value}`, ɵ2 = (value) => value;
+const PRO_TABLE_DEFAULT_PROPS = {
+    input: {
+        name: "",
+        placeHolder: "",
+        disabled: false,
+        label: "",
+        value: "",
+    },
+    select: {
+        name: "",
+        options: [],
+        disabled: false,
+        label: "",
+        value: "",
+        allowClear: true,
+        placeHolder: "",
+    },
+    selectMultiple: {
+        name: "",
+        options: [],
+        disabled: false,
+        label: "",
+        value: [],
+        allowClear: true,
+        placeHolder: "请选择",
+    },
+    inputPlate: {
+        name: "",
+        label: "",
+        value: "",
+    },
+    checkbox: {
+        name: "",
+        options: [],
+        disabled: false,
+        label: "",
+        value: [],
+        noStyle: false,
+    },
+    date: {
+        name: "",
+        disabled: false,
+        label: "",
+        value: "",
+        allowClear: true,
+        placeHolder: "请选择",
+        showTime: false,
+        format: "yyyy-MM-dd",
+        mode: "date",
+    },
+    autoComplete: {
+        name: "",
+        disabled: false,
+        placeHolder: "请输入",
+        label: "",
+        value: "",
+        dataSource: ɵ0,
+        backFill: false,
+        defaultActiveFirstOption: false,
+        returnFullData: false,
+    },
+    inputNumber: {
+        name: "",
+        disabled: false,
+        label: "",
+        value: "",
+        placeHolder: "请输入",
+        min: 0,
+        max: 100,
+        precision: 0,
+        formatterPercent: ɵ1,
+        parserPercent: ɵ2,
+    },
+    custom: {
+        name: "",
+        value: null,
+        label: "",
+    },
+};
+const PRO_TABLE_DEFAULT_COLUMN = {
+    width: "",
+    align: "left",
+    fixedLeft: false,
+    fixedRight: false,
+    auxiliaryColumn: false,
+};
+
+const PRO_TABLE_COLUMN_REMOTE = new InjectionToken("PRO_TABLE_COLUMN_REMOTE");
+const PLATE_PREFIX_LOAD_SERVICE = new InjectionToken("PLATE_PREFIX_LOAD_SERVICE");
+
+class ProTableComponent {
+    constructor(columnRemote) {
+        this.columnRemote = columnRemote;
+        this.showSearchBtn = true;
+        this.showClearBtn = true;
+        this.title = null;
+        this.tableName = "";
+        this.multiRow = false;
+        this.columns = [];
+        this.showSearchBar = true;
+        this.showActionBar = true;
+        this.confirmBtnText = "查询";
+        this.clearBtnText = "清空";
+        this.labelWidth = "90px";
+        this.labelAlign = "right";
+        this.dataSource = [];
+        this.bordered = true;
+        this.outerBordered = true;
+        this.showPagination = true;
+        this.frontPagination = false;
+        this.scroll = null;
+        this.summaryData = null;
+        // 排序模式：local 本地排序；server 在线排序（提交给接口）
+        this.sortMode = "local";
+        this.showColumnSetting = false;
+        // 是否开启多列排序（默认单列）
+        this.multipleSort = false;
+        this.showCheckbox = false;
+        // 判断行是否禁用的函数
+        this.rowDisabled = () => false;
+        // 是否自动触发请求
+        this.autoTriggerRequest = true;
+        this.onRowClick = new EventEmitter();
+        this.onRowDbClick = new EventEmitter();
+        this.onValuesChange = new EventEmitter();
+        this.onResetFormBeforeReload = new EventEmitter();
+        this._savedSearchParams = {};
+        // 存储模板映射关系 - 通过字符串名称映射到模板引用
+        this.templateMap = new Map();
+        // 存储所有自定义模板的引用
+        this.customTemplates = new Map();
+        // 记录各列排序状态：'ascend' | 'descend' | null
+        this._sortMap = {};
+        // 记录多列排序的优先级（后设置的优先）
+        this._sortPriority = [];
+        // 存储每个 autoComplete 字段的防抖函数
+        this._autoCompleteDebounceMap = new Map();
+        // 仅在初始化时运行列配置预检查，避免后续调用重复触发
+        this._preCheckDone = false;
+        this._columns = [];
+        // 筛选表单数据存储
+        this._searchParams = {};
+        // 筛选表单list渲染数据
+        this._searchFiledColumns = [];
+        this._pageInfo = {
+            pageIndex: 1,
+            pageSize: 15,
+            total: 100,
+            pageSizeOptions: [10, 15, 20, 50, 100, 500, 1000],
+        };
+        this._loading = false;
+        this._selectedTableRow = null;
+        // 选中的行数据（用于复选框选择）
+        this._selectedRows = [];
+        // 全选状态
+        this._checkedAll = false;
+        // 半选状态（部分选中）
+        this._indeterminate = false;
+        // 远程columns
+        this._serverColumns = [];
+        // 存储 autoComplete 字段的数据源
+        this._autoCompleteDataSources = {};
+    }
+    fetchRemoteColumns() {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!((_a = this.columnRemote) === null || _a === void 0 ? void 0 : _a.getCol) || !this.tableName) {
+                return null;
+            }
+            try {
+                const res = yield this.columnRemote.getCol(this.tableName, this.multiRow);
+                return res;
+            }
+            catch (error) {
+                return null;
+            }
+        });
+    }
+    persistRemoteColumns(columns) {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!((_a = this.columnRemote) === null || _a === void 0 ? void 0 : _a.setCol) || !this.tableName) {
+                return null;
+            }
+            try {
+                const result = this.columnRemote.setCol(this.tableName, columns, this.multiRow);
+                if (result && isObservable(result)) {
+                    return yield result.toPromise();
+                }
+                return result;
+            }
+            catch (error) {
+                return null;
+            }
+        });
+    }
+    ngOnInit() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this._searchParams = {};
+            this.formateInnerColumns(this.columns);
+            yield this.setSearchParams(this.columns);
+            // 使用 Proxy 包装 _searchParams，拦截表单项值变化并向外发出事件
+            this._searchParams = this.createSearchParamsProxy(this._searchParams);
+            if (this.autoTriggerRequest) {
+                this.handleQuery();
+            }
+            this.queryDynamicColumns();
+        });
+    }
+    ngAfterContentInit() {
+        // 自动注册所有自定义模板
+        this.autoRegisterTemplates();
+    }
+    preCheckServerColumns() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const res = yield this.fetchRemoteColumns();
+            if (!res)
+                return false;
+            const initColumns = this.columns
+                .filter((col) => !col.auxiliaryColumn)
+                .map((column) => {
+                return {
+                    field: column.prop,
+                    isShow: !column.hideInTable,
+                    header: column.title,
+                    sortName: column.sortName || null,
+                };
+            });
+            if (res.code === 0) {
+                if (!isEqual(res.data.tabColumn, initColumns)) {
+                    const initRes = yield this.persistRemoteColumns(initColumns);
+                    if (initRes) {
+                        this.queryDynamicColumns();
+                    }
+                    return false;
+                }
+                else {
+                    console.log("一致");
+                    return true;
+                }
+            }
+            else {
+                return false;
+            }
+        });
+    }
+    queryDynamicColumns() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.tableName || !this.columnRemote)
+                return;
+            if (!this._preCheckDone) {
+                const checkResult = yield this.preCheckServerColumns();
+                this._preCheckDone = true;
+                if (!checkResult)
+                    return;
+            }
+            const res = yield this.fetchRemoteColumns();
+            if (!res)
+                return;
+            if (res.code === 0) {
+                const _tabColumn = res.data.tabColumn.map((item) => {
+                    return {
+                        title: item.header,
+                        prop: item.field,
+                        sortName: item.sortName,
+                        hideInTable: !item.isShow,
+                    };
+                });
+                this._serverColumns = _tabColumn;
+                this.updateTableColumns(_tabColumn);
+            }
+            else if (res.code === 10) {
+                // 如果未设置接口返回，需要默认调用一次修改函数初始化数据
+                const initColumns = this.columns
+                    .filter((col) => !col.auxiliaryColumn)
+                    .map((column) => {
+                    return {
+                        field: column.prop,
+                        isShow: true,
+                        header: column.title,
+                        sortName: column.sortName || null,
+                    };
+                });
+                // 调用修改接口初始化数据
+                const initRes = yield this.persistRemoteColumns(initColumns);
+                if (initRes) {
+                    this.queryDynamicColumns();
+                }
+            }
+        });
+    }
+    formateInnerColumns(columns) {
+        this._columns = columns
+            .filter((item) => !item.hideInTable)
+            .map((item) => {
+            return Object.assign(Object.assign({}, PRO_TABLE_DEFAULT_COLUMN), item);
+        });
+    }
+    // 自动注册模板的方法
+    autoRegisterTemplates() {
+        // 获取所有需要自定义模板的列
+        const columnsWithCustomRender = this._columns.filter((col) => col.customRender);
+        if (columnsWithCustomRender.length > 0) {
+            // 尝试从ContentChildren中查找对应的模板
+            columnsWithCustomRender.forEach((column) => {
+                const templateName = column.customRender;
+                const template = this.findTemplateByName(templateName);
+                if (template) {
+                    this.customTemplates.set(templateName, template);
+                }
+                else {
+                }
+            });
+        }
+        // 获取所有需要自定义label模板的列（使用原始columns，确保顺序正确）
+        const columnsWithCustomLabel = this.columns.filter((col) => col.customLabelRender);
+        if (columnsWithCustomLabel.length > 0) {
+            // 尝试从ContentChildren中查找对应的label模板
+            columnsWithCustomLabel.forEach((column) => {
+                const templateName = column.customLabelRender;
+                const template = this.findLabelTemplateByName(templateName, columnsWithCustomLabel);
+                if (template) {
+                    this.customTemplates.set(templateName, template);
+                }
+                else {
+                }
+            });
+        }
+    }
+    // 根据名称查找模板
+    findTemplateByName(templateName) {
+        return this.getTemplateFromContent(templateName);
+    }
+    // 从ContentChildren中查找指定名称的模板
+    getTemplateFromContent(templateName) {
+        const customRenderColumns = this._columns.filter((col) => col.customRender);
+        const templateIndex = customRenderColumns.findIndex((col) => col.customRender === templateName);
+        if (templateIndex >= 0) {
+            // 获取所有模板，并过滤掉特殊模板（actionBar和ImgActionBar）
+            // 这样可以避免因为特殊模板的位置导致索引计算错误
+            const templates = this.allTemplates.toArray();
+            const customTemplates = templates.filter((tpl) => tpl !== this.actionBarTpl && tpl !== this.imgActionBarTpl);
+            if (templateIndex < customTemplates.length) {
+                const template = customTemplates[templateIndex];
+                return template;
+            }
+        }
+        console.warn(`未找到模板 ${templateName}`);
+        return null;
+    }
+    // 根据名称查找label模板
+    findLabelTemplateByName(templateName, customLabelColumns) {
+        const templateIndex = customLabelColumns.findIndex((col) => col.customLabelRender === templateName);
+        if (templateIndex >= 0) {
+            // 获取所有模板，并过滤掉特殊模板（actionBar和ImgActionBar）
+            const templates = this.allTemplates.toArray();
+            const customTemplates = templates.filter((tpl) => tpl !== this.actionBarTpl && tpl !== this.imgActionBarTpl);
+            // 计算label模板的索引：需要跳过所有的customRender模板
+            const customRenderColumns = this._columns.filter((col) => col.customRender);
+            const labelTemplateIndex = customRenderColumns.length + templateIndex;
+            if (labelTemplateIndex < customTemplates.length) {
+                const template = customTemplates[labelTemplateIndex];
+                return template;
+            }
+        }
+        console.warn(`未找到label模板 ${templateName}`);
+        return null;
+    }
+    // 设置筛选表单默认属性
+    setSearchFormDefaultProp(columns) {
+        columns.forEach((item) => {
+            if (item.valueType) {
+                if (item.fieldProps) {
+                    item.fieldProps = Object.assign(Object.assign({}, PRO_TABLE_DEFAULT_PROPS[item.valueType]), item.fieldProps);
+                }
+                else {
+                    item.fieldProps = Object.assign({}, PRO_TABLE_DEFAULT_PROPS[item.valueType]);
+                }
+            }
+        });
+    }
+    // 动态设置Options
+    setSelectRequest(columns) {
+        columns.map((item) => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            if (item.fieldProps && hasIn(item.fieldProps, "request")) {
+                try {
+                    const options = yield ((_b = (_a = item.fieldProps).request) === null || _b === void 0 ? void 0 : _b.call(_a));
+                    item.fieldProps.options = options;
+                }
+                catch (error) {
+                    item.fieldProps.options = [];
+                }
+            }
+        }));
+    }
+    setSearchParams(columns) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this._searchFiledColumns = [];
+            columns
+                .filter((item) => {
+                const flag = !item.hideInSearch && item.valueType;
+                if (flag) {
+                    this._searchFiledColumns.push(cloneDeep(item));
+                }
+                return flag;
+            })
+                .forEach((column) => {
+                var _a, _b, _c;
+                const key = ((_a = column.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || column.prop;
+                let defaultValue = PRO_TABLE_DEFAULT_PROPS[column.valueType].value;
+                // 对于checkbox类型，从options中找出checked为true的项作为默认值
+                if (column.valueType === "checkbox") {
+                    const checkedValues = (((_b = column.fieldProps) === null || _b === void 0 ? void 0 : _b.options) || [])
+                        .filter((opt) => opt.checked)
+                        .map((opt) => opt.value);
+                    this._searchParams[key] =
+                        checkedValues.length > 0 ? checkedValues : defaultValue;
+                }
+                else {
+                    this._searchParams[key] = ((_c = column.fieldProps) === null || _c === void 0 ? void 0 : _c.value) || defaultValue;
+                }
+                // 初始化 autoComplete 数据源
+                if (column.valueType === "autoComplete") {
+                    this._autoCompleteDataSources[key] = [];
+                }
+            });
+            // 根据列的 order 字段进行排序，未设置 order 的放在最后
+            this._searchFiledColumns.sort((a, b) => {
+                const aOrder = isNil(a === null || a === void 0 ? void 0 : a.order) ? Number.MAX_SAFE_INTEGER : a.order;
+                const bOrder = isNil(b === null || b === void 0 ? void 0 : b.order) ? Number.MAX_SAFE_INTEGER : b.order;
+                if (aOrder === bOrder)
+                    return 0;
+                return aOrder - bOrder;
+            });
+            this.setSearchFormDefaultProp(this._searchFiledColumns);
+            // 并发加载所有需要异步获取的选项
+            this.setSelectRequest(this._searchFiledColumns);
+        });
+    }
+    updateTableColumns(injectColumns) {
+        // 1. 使用最原始的columns作为数据源，确保辅助列完全不受影响
+        const originalColumns = cloneDeep(this.columns);
+        // 2. 处理字段映射（如果提供了fields参数）
+        let processedInjectColumns = injectColumns;
+        // 3. 分离辅助列和非辅助列（使用原始数据）
+        const nonAuxiliaryColumns = originalColumns.filter((col) => !col.auxiliaryColumn);
+        // 4. 按照injectColumns的顺序重新排列非辅助列
+        const reorderedNonAuxiliaryColumns = [];
+        const remainingNonAuxiliaryColumns = [...nonAuxiliaryColumns]; // 复制一份用于查找和移除
+        processedInjectColumns.forEach((injectCol) => {
+            // 查找非辅助列中对应的下标
+            const existingColIndex = remainingNonAuxiliaryColumns.findIndex((col) => col.prop === injectCol.prop);
+            if (existingColIndex !== -1) {
+                // 如果找到相同列，用injectColumns中的属性覆盖原始columns中的属性
+                const existingCol = remainingNonAuxiliaryColumns[existingColIndex];
+                const updatedCol = Object.assign(Object.assign({}, existingCol), injectCol);
+                reorderedNonAuxiliaryColumns.push(updatedCol);
+                // 从剩余数组中移除，避免重复
+                remainingNonAuxiliaryColumns.splice(existingColIndex, 1);
+            }
+            else {
+                // 如果没找到对应的列，直接添加injectColumns中的列
+                reorderedNonAuxiliaryColumns.push(injectCol);
+            }
+        });
+        // 5. 处理剩余的原始columns中的非辅助列（在injectColumns中未出现的列）
+        // 这些列应该被隐藏（设置hideInTable为true）
+        remainingNonAuxiliaryColumns.forEach((remainingCol) => {
+            const hiddenCol = Object.assign(Object.assign({}, remainingCol), { hideInTable: true });
+            reorderedNonAuxiliaryColumns.push(hiddenCol);
+        });
+        // 6. 按照原始columns的顺序重新组合：保持辅助列的原始位置和属性
+        const finalColumns = [];
+        let nonAuxiliaryIndex = 0;
+        let auxiliaryIndex = 0;
+        originalColumns.forEach((originalCol) => {
+            if (originalCol.auxiliaryColumn) {
+                // 如果是辅助列，使用原始列数据，完全不进行任何修改
+                finalColumns.push(originalCol);
+                auxiliaryIndex++;
+            }
+            else {
+                // 如果是非辅助列，使用重新排序后的列，但保留原始列的所有属性
+                const reorderedCol = reorderedNonAuxiliaryColumns[nonAuxiliaryIndex];
+                if (reorderedCol) {
+                    // 合并原始列和重新排序后的列，确保保留所有原始属性
+                    const mergedCol = Object.assign(Object.assign({}, originalCol), reorderedCol);
+                    finalColumns.push(mergedCol);
+                }
+                else {
+                    // 如果重新排序后的列不存在，使用原始列
+                    finalColumns.push(originalCol);
+                }
+                nonAuxiliaryIndex++;
+            }
+        });
+        this.formateInnerColumns(finalColumns);
+    }
+    // 通过 Proxy 监听 _searchParams 的属性变更
+    createSearchParamsProxy(target) {
+        const self = this;
+        const handler = {
+            set(obj, prop, value) {
+                const key = String(prop);
+                const oldVal = obj[key];
+                if (oldVal === value) {
+                    obj[key] = value;
+                    return true;
+                }
+                obj[key] = value;
+                try {
+                    self.onValuesChange.emit({
+                        key,
+                        value,
+                        params: self.getSearchParams(),
+                    });
+                }
+                catch (e) { }
+                return true;
+            },
+        };
+        return new Proxy(target, handler);
+    }
+    clearEmptySearchParams() {
+        const cloneSearchParams = cloneDeep(this._searchParams);
+        return cloneSearchParams;
+    }
+    buildServerSortPayload() {
+        // 构建激活排序集合（按优先级从低到高，末尾优先）
+        const activeKeys = this._sortPriority.filter((k) => !!this._sortMap[k]);
+        if (activeKeys.length === 0)
+            return null;
+        const sorts = activeKeys.map((field) => {
+            // 查找对应的列配置，优先使用sortName字段
+            const column = this._columns.find((col) => col.prop === field);
+            const sortField = (column === null || column === void 0 ? void 0 : column.sortName) || field;
+            return {
+                field: sortField,
+                order: this._sortMap[field],
+            };
+        });
+        if (this.multipleSort) {
+            return sorts; // 以数组形式提交多列排序
+        }
+        const [first] = sorts;
+        return first; // 兼容单列结构 { field, order }
+    }
+    sortDataSourceInPlace() {
+        if (!Array.isArray(this.dataSource) || this.dataSource.length === 0)
+            return;
+        const activeKeys = this._sortPriority.filter((k) => !!this._sortMap[k]);
+        if (activeKeys.length === 0)
+            return;
+        // 复制一份优先级，从前到后优先级从低到高（最后设置的字段优先）
+        const keysInPriority = [...activeKeys];
+        this.dataSource.sort((a, b) => {
+            for (let i = keysInPriority.length - 1; i >= 0; i--) {
+                const field = keysInPriority[i];
+                const order = this._sortMap[field];
+                const av = a === null || a === void 0 ? void 0 : a[field];
+                const bv = b === null || b === void 0 ? void 0 : b[field];
+                const cmp = this.compareValues(av, bv);
+                if (cmp !== 0)
+                    return order === "ascend" ? cmp : -cmp;
+            }
+            return 0;
+        });
+    }
+    compareValues(aVal, bVal) {
+        if (aVal == null && bVal == null)
+            return 0;
+        if (aVal == null)
+            return -1;
+        if (bVal == null)
+            return 1;
+        if (aVal instanceof Date && bVal instanceof Date) {
+            return aVal.getTime() - bVal.getTime();
+        }
+        if (typeof aVal === "boolean" && typeof bVal === "boolean") {
+            return aVal === bVal ? 0 : aVal ? 1 : -1;
+        }
+        if (typeof aVal === "number" && typeof bVal === "number") {
+            return aVal - bVal;
+        }
+        if (typeof aVal === "string" && typeof bVal === "string") {
+            return aVal.localeCompare(bVal);
+        }
+        const aNum = Number(aVal);
+        const bNum = Number(bVal);
+        if (!isNaN(aNum) && !isNaN(bNum))
+            return aNum - bNum;
+        return String(aVal).localeCompare(String(bVal));
+    }
+    // 执行 autoComplete 数据源查询（实际执行逻辑）
+    executeAutoCompleteDataSource(event, column) {
+        var _a;
+        const fieldKey = ((_a = column.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || column.prop;
+        if (column.fieldProps.dataSource &&
+            typeof column.fieldProps.dataSource ===
+                "function") {
+            try {
+                const result = column.fieldProps.dataSource(event);
+                // 如果返回的是 Promise，处理异步结果
+                if (result instanceof Promise) {
+                    result
+                        .then((data) => {
+                        this._autoCompleteDataSources[fieldKey] = data || [];
+                    })
+                        .catch((error) => {
+                        console.error("AutoComplete dataSource error:", error);
+                        this._autoCompleteDataSources[fieldKey] = [];
+                    });
+                }
+                else {
+                    // 同步返回结果
+                    this._autoCompleteDataSources[fieldKey] = result || [];
+                }
+            }
+            catch (error) {
+                console.error("AutoComplete dataSource error:", error);
+                this._autoCompleteDataSources[fieldKey] = [];
+            }
+        }
+    }
+    getSearchParams(options) {
+        const { useSaved = false } = options || {};
+        const rawParams = useSaved ? this._savedSearchParams : this._searchParams;
+        const params = cloneDeep(rawParams || {});
+        return Object.assign({ params, pageInfo: {
+                pageIndex: this._pageInfo.pageIndex,
+                pageSize: this._pageInfo.pageSize,
+            } }, (this.sortMode === "server"
+            ? { sort: this.buildServerSortPayload() }
+            : {}));
+    }
+    reload(afterDelete) {
+        this.handleQuery(afterDelete);
+    }
+    setFieldsValue(fields) {
+        Object.keys(fields).forEach((k) => {
+            this._searchParams[k] = fields[k]; // 保留 Proxy，逐项赋值触发拦截
+        });
+    }
+    setFieldValue(key, value) {
+        this._searchParams[key] = value;
+    }
+    clearSelectedRow() {
+        this._selectedTableRow = null;
+    }
+    setColumns(columns, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // 更新 columns 输入属性
+            this.columns = cloneDeep(columns);
+            // 重新格式化内部列
+            this.formateInnerColumns(this.columns);
+            // 重新设置搜索参数（异步操作）
+            // 先清空旧的搜索参数，避免旧数据残留
+            this._searchParams = {};
+            yield this.setSearchParams(this.columns);
+            // 重新创建 Proxy，确保表单项值变化能正常触发事件
+            this._searchParams = this.createSearchParamsProxy(this._searchParams);
+            // 重新注册模板（如果组件已经初始化完成）
+            if (this.allTemplates) {
+                this.autoRegisterTemplates();
+            }
+            // 如果设置了 reload 选项为 true，则重新查询数据
+            if ((options === null || options === void 0 ? void 0 : options.reload) === true) {
+                this.handleQuery();
+            }
+        });
+    }
+    getSelectedRowData() {
+        return this._selectedTableRow;
+    }
+    getCheckedRows() {
+        return this._selectedRows;
+    }
+    // 获取指定名称的模板
+    getTemplate(name) {
+        if (!name)
+            return null;
+        try {
+            // 首先从自定义模板中查找
+            const customTemplate = this.customTemplates.get(name);
+            if (customTemplate) {
+                return customTemplate;
+            }
+            // 然后从通用模板映射中查找
+            const template = this.templateMap.get(name);
+            if (template) {
+                return template;
+            }
+            return null;
+        }
+        catch (error) {
+            return null;
+        }
+    }
+    getToolTipTextValue(column, data) {
+        const key = column.customRender && this.getTemplate(column.customRender)
+            ? ""
+            : column.ellipsis
+                ? column.prop
+                : "";
+        return !key ? "" : data[key];
+    }
+    getTableRowChecked(data) {
+        // 启用复选框时：行高亮应与复选框选中状态一致（支持多选）
+        if (this.showCheckbox) {
+            return this.isRowChecked(data);
+        }
+        // 未启用复选框时：仍然使用单选行高亮
+        if (!this._selectedTableRow)
+            return false;
+        return JSON.stringify(this._selectedTableRow) === JSON.stringify(data);
+    }
+    // 检查行是否被禁用
+    isRowDisabled(data) {
+        if (!this.showCheckbox)
+            return false;
+        return this.rowDisabled ? this.rowDisabled(data) : false;
+    }
+    // 检查行是否被复选框选中
+    isRowChecked(data) {
+        if (!this.showCheckbox)
+            return false;
+        return this._selectedRows.some((row) => JSON.stringify(row) === JSON.stringify(data));
+    }
+    // 切换行的选中状态
+    toggleRowChecked(data, checked, event) {
+        if (event) {
+            event.stopPropagation(); // 阻止事件冒泡，避免触发行点击
+        }
+        // 如果行被禁用，不允许切换选中状态
+        if (this.isRowDisabled(data)) {
+            return;
+        }
+        const index = this._selectedRows.findIndex((row) => JSON.stringify(row) === JSON.stringify(data));
+        if (checked) {
+            // 选中
+            if (index === -1) {
+                this._selectedRows.push(data);
+            }
+            // 勾选复选框时同步设置高亮选中行
+            this._selectedTableRow = data;
+        }
+        else {
+            // 取消选中
+            if (index > -1) {
+                this._selectedRows.splice(index, 1);
+            }
+            // 若当前高亮行为该行，则取消高亮
+            if (this._selectedTableRow &&
+                JSON.stringify(this._selectedTableRow) === JSON.stringify(data)) {
+                this._selectedTableRow = null;
+            }
+        }
+        this.updateCheckAllStatus();
+    }
+    // 更新全选状态
+    updateCheckAllStatus() {
+        if (!this.showCheckbox || !Array.isArray(this.dataSource)) {
+            this._checkedAll = false;
+            this._indeterminate = false;
+            return;
+        }
+        // 只计算可用的行（未禁用的行）
+        const availableRows = this.dataSource.filter((row) => !this.isRowDisabled(row));
+        const checkedCount = this._selectedRows.length;
+        const totalCount = availableRows.length;
+        this._checkedAll =
+            totalCount > 0 && checkedCount > 0 && checkedCount === totalCount;
+        this._indeterminate = checkedCount > 0 && checkedCount < totalCount;
+    }
+    // 全选/取消全选
+    toggleCheckAll(checked, event) {
+        if (event) {
+            event.stopPropagation();
+        }
+        if (checked) {
+            // 全选：只选中未禁用的行
+            this._selectedRows = this.dataSource.filter((row) => !this.isRowDisabled(row));
+            // 同步设置高亮选中行为第一条可选数据
+            const availableRows = this._selectedRows;
+            this._selectedTableRow =
+                availableRows.length > 0 ? availableRows[0] : null;
+        }
+        else {
+            // 取消全选
+            this._selectedRows = [];
+            // 取消高亮
+            this._selectedTableRow = null;
+        }
+        this.updateCheckAllStatus();
+    }
+    // 获取选中的行数据
+    getSelectedRows() {
+        return this._selectedRows;
+    }
+    // 清空选中的行
+    clearSelectedRows() {
+        this._selectedRows = [];
+        this._checkedAll = false;
+        this._indeterminate = false;
+        this._selectedTableRow = null;
+    }
+    handleFieldCheckBoxChange(checkBoxOptions, key) {
+        this.setFieldsValue({
+            [key]: checkBoxOptions
+                .filter((item) => item.checked)
+                .map((item) => item.value),
+        });
+    }
+    handleSearch() {
+        this._savedSearchParams = this.clearEmptySearchParams();
+        this._pageInfo.pageIndex = 1;
+        this.handleQuery();
+    }
+    handleResetForm() {
+        Object.keys(this._searchParams).forEach((key) => {
+            const targetColumn = this._searchFiledColumns.find((item) => {
+                var _a;
+                return (((_a = item.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || item.prop) === key;
+            });
+            // 对于checkbox类型，需要特殊处理默认值
+            if ((targetColumn === null || targetColumn === void 0 ? void 0 : targetColumn.valueType) === "checkbox") {
+                // 从原始columns配置中获取初始配置，以确保使用正确的默认值
+                const originalColumn = this.columns.find((item) => {
+                    var _a;
+                    return (((_a = item.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || item.prop) === key;
+                });
+                // 从原始options中找出checked为true的项作为默认值
+                const originalFieldProps = originalColumn === null || originalColumn === void 0 ? void 0 : originalColumn.fieldProps;
+                const checkedValues = ((originalFieldProps === null || originalFieldProps === void 0 ? void 0 : originalFieldProps.options) || [])
+                    .filter((opt) => opt.checked)
+                    .map((opt) => opt.value);
+                const defaultValue = checkedValues.length > 0
+                    ? checkedValues
+                    : PRO_TABLE_DEFAULT_PROPS[targetColumn.valueType].value;
+                this._searchParams[key] = defaultValue;
+                // 根据默认值恢复options的checked状态，使用原始options的结构
+                const defaultValues = Array.isArray(defaultValue) ? defaultValue : [];
+                const originalOptions = (originalFieldProps === null || originalFieldProps === void 0 ? void 0 : originalFieldProps.options) || [];
+                const targetFieldProps = targetColumn.fieldProps;
+                targetFieldProps.options = originalOptions.map((item) => {
+                    return Object.assign(Object.assign({}, item), { checked: defaultValues.includes(item.value) });
+                });
+            }
+            else {
+                this._searchParams[key] = (targetColumn === null || targetColumn === void 0 ? void 0 : targetColumn.fieldProps) ? (targetColumn === null || targetColumn === void 0 ? void 0 : targetColumn.fieldProps.value) ||
+                    PRO_TABLE_DEFAULT_PROPS[targetColumn.valueType].value
+                    : PRO_TABLE_DEFAULT_PROPS[targetColumn.valueType].value;
+            }
+        });
+        this._savedSearchParams = {};
+        this._pageInfo.pageIndex = 1;
+        this.onResetFormBeforeReload.emit();
+        this.handleQuery();
+    }
+    handlePageIndexChange(pageIndex) {
+        this._pageInfo.pageIndex = pageIndex;
+        this.handleQuery();
+    }
+    handlePageSizeChange(pageSize) {
+        this._pageInfo.pageSize = pageSize;
+        this._pageInfo.pageIndex = 1;
+        this.handleQuery();
+    }
+    handleQuery(afterDelete) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // 删除后刷新且当前页仅剩一条记录时，若不在第一页则先回退一页
+            if (afterDelete &&
+                Array.isArray(this.dataSource) &&
+                this.dataSource.length === 1 &&
+                this._pageInfo.pageIndex > 1) {
+                this._pageInfo.pageIndex = this._pageInfo.pageIndex - 1;
+            }
+            this._loading = true;
+            if (this.request) {
+                try {
+                    const result = yield this.request(Object.assign({ params: this.clearEmptySearchParams(), pageInfo: {
+                            pageIndex: this._pageInfo.pageIndex,
+                            pageSize: this._pageInfo.pageSize,
+                        } }, (this.sortMode === "server"
+                        ? { sort: this.buildServerSortPayload() }
+                        : {})));
+                    this.dataSource = result.data || [];
+                    this.summaryData = result.summaryData || null;
+                    // 本地排序模式：拿到数据后在前端排序
+                    if (this.sortMode === "local") {
+                        this.sortDataSourceInPlace();
+                    }
+                    this._pageInfo.total = result.total || 0;
+                    // 更新全选状态
+                    if (this.showCheckbox) {
+                        this.updateCheckAllStatus();
+                    }
+                }
+                catch (error) {
+                    console.error("查询失败:", error);
+                    this.dataSource = [];
+                    this._pageInfo.total = 0;
+                    this.summaryData = null;
+                }
+                finally {
+                    this._loading = false;
+                    this._selectedTableRow = null;
+                    // 清空选中行（可选，根据业务需求决定是否保留跨页选中）
+                    // this.clearSelectedRows();
+                }
+            }
+            else {
+                console.warn("未提供 _request 回调函数");
+                this._loading = false;
+            }
+            this.clearSelectedRows();
+        });
+    }
+    // 触发列排序变更
+    onSortChange(sortKey, sortOrder) {
+        // 单列排序：重置其它列；多列排序：保留其它列
+        if (!this.multipleSort) {
+            Object.keys(this._sortMap).forEach((key) => {
+                if (key !== sortKey)
+                    this._sortMap[key] = null;
+            });
+        }
+        this._sortMap[sortKey] = sortOrder;
+        // 维护优先级队列：有序列且非空 -> 置于末尾；为空 -> 移除
+        this._sortPriority = this._sortPriority.filter((k) => k !== sortKey);
+        if (sortOrder) {
+            this._sortPriority.push(sortKey);
+        }
+        if (this.sortMode === "local") {
+            this.sortDataSourceInPlace();
+        }
+        else {
+            // 在线排序：重新请求
+            this.handleQuery();
+        }
+    }
+    getSortOrder(sortKey) {
+        return this._sortMap[sortKey] || null;
+    }
+    handleTableRowClick(data) {
+        this._selectedTableRow = data;
+        // 如果开启了复选框，点击行时只选中点击行（如果行未被禁用）
+        if (this.showCheckbox && !this.isRowDisabled(data)) {
+            // 先清空所有选中行
+            this._selectedRows = [];
+            // 只选中当前点击的行
+            this.toggleRowChecked(data, true);
+        }
+        this.onRowClick.emit(this._selectedTableRow);
+    }
+    handleTableRowDbClick(data) {
+        this._selectedTableRow = data;
+        this.onRowDbClick.emit(this._selectedTableRow);
+    }
+    handleColumnsSettingConfirm() {
+        this.queryDynamicColumns();
+    }
+    // 处理 autoComplete 输入事件（带防抖）
+    handleAutoCompleteInput(event, column) {
+        var _a;
+        const fieldKey = ((_a = column.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || column.prop;
+        // 如果该字段还没有防抖函数，创建一个
+        if (!this._autoCompleteDebounceMap.has(fieldKey)) {
+            const debouncedFn = debounce((evt) => {
+                // 重新查找对应的 column，确保使用最新的配置
+                const currentColumn = this._searchFiledColumns.find((col) => { var _a; return (((_a = col.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || col.prop) === fieldKey; });
+                if (currentColumn) {
+                    this.executeAutoCompleteDataSource(evt, currentColumn);
+                }
+            }, 300); // 300ms 防抖延迟
+            this._autoCompleteDebounceMap.set(fieldKey, debouncedFn);
+        }
+        // 调用防抖函数
+        const debouncedFn = this._autoCompleteDebounceMap.get(fieldKey);
+        if (debouncedFn) {
+            debouncedFn(event);
+        }
+    }
+    // 获取 autoComplete 的数据源
+    getAutoCompleteDataSource(column) {
+        var _a;
+        const fieldKey = ((_a = column.fieldProps) === null || _a === void 0 ? void 0 : _a.name) || column.prop;
+        return this._autoCompleteDataSources[fieldKey] || [];
+    }
+    getFieldProps(column) {
+        return column.fieldProps;
+    }
+    // 获取指定名称的label模板
+    getLabelTemplate(name) {
+        if (!name)
+            return null;
+        try {
+            // 首先从自定义模板中查找
+            const customTemplate = this.customTemplates.get(name);
+            if (customTemplate) {
+                return customTemplate;
+            }
+            // 然后从通用模板映射中查找
+            const template = this.templateMap.get(name);
+            if (template) {
+                return template;
+            }
+            return null;
+        }
+        catch (error) {
+            return null;
+        }
+    }
+    // 获取 form-item 的动态类名
+    getFormItemClassName(column) {
+        const fieldName = this.getFieldProps(column).name || column.prop;
+        return `pro-table-${fieldName}-form-item`;
+    }
+}
+ProTableComponent.decorators = [
+    { type: Component, args: [{
+                selector: "app-pro-table",
+                template: "<app-page-container [title]=\"title\">\r\n  <ng-template #header>\r\n    <app-table-search-bar\r\n      *ngIf=\"showSearchBar\"\r\n      [labelWidth]=\"labelWidth\"\r\n      [labelAlign]=\"labelAlign\"\r\n    >\r\n      <ng-template #leftContent>\r\n        <nz-form-item\r\n          *ngFor=\"let column of _searchFiledColumns\"\r\n          [ngClass]=\"getFormItemClassName(column)\"\r\n        >\r\n          <nz-form-label *ngIf=\"!getFieldProps(column).hideLabel\" nzNoColon>\r\n            <!-- \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49label\u6A21\u677F -->\r\n            <ng-container\r\n              *ngIf=\"\r\n                column.customLabelRender &&\r\n                  getLabelTemplate(column.customLabelRender);\r\n                else defaultLabel\r\n              \"\r\n            >\r\n              <ng-container\r\n                [ngTemplateOutlet]=\"getLabelTemplate(column.customLabelRender)\"\r\n                [ngTemplateOutletContext]=\"{\r\n                  $implicit: column,\r\n                  column: column,\r\n                  fieldProps: getFieldProps(column)\r\n                }\"\r\n              >\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-template #defaultLabel>\r\n              {{ getFieldProps(column).label || column.title }}\r\n            </ng-template>\r\n          </nz-form-label>\r\n          <nz-form-control *ngIf=\"column.valueType === 'input'\">\r\n            <input\r\n              nz-input\r\n              [name]=\"getFieldProps(column).name || column.prop\"\r\n              [placeholder]=\"getFieldProps(column).placeHolder\"\r\n              [disabled]=\"getFieldProps(column).disabled\"\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n            />\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'inputPlate'\">\r\n            <app-plate-input\r\n              [name]=\"getFieldProps(column).name || column.prop\"\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n            ></app-plate-input>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'select'\">\r\n            <nz-select\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n              [nzAllowClear]=\"getFieldProps(column).allowClear\"\r\n              [nzPlaceHolder]=\"getFieldProps(column).placeHolder\"\r\n              [name]=\"getFieldProps(column).name || column.prop\"\r\n              [nzOptions]=\"getFieldProps(column).options\"\r\n              [nzDisabled]=\"getFieldProps(column).disabled\"\r\n            >\r\n            </nz-select>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'selectMultiple'\">\r\n            <nz-select\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n              [nzAllowClear]=\"getFieldProps(column).allowClear\"\r\n              [nzPlaceHolder]=\"getFieldProps(column).placeHolder\"\r\n              [name]=\"getFieldProps(column).name || column.prop\"\r\n              [nzOptions]=\"getFieldProps(column).options\"\r\n              [nzDisabled]=\"getFieldProps(column).disabled\"\r\n              nzMode=\"multiple\"\r\n            >\r\n            </nz-select>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'date'\">\r\n            <nz-date-picker\r\n              [nzShowTime]=\"getFieldProps(column).showTime\"\r\n              [nzFormat]=\"getFieldProps(column).format\"\r\n              [nzPlaceHolder]=\"getFieldProps(column).placeHolder\"\r\n              [nzAllowClear]=\"getFieldProps(column).allowClear\"\r\n              [nzDisabled]=\"getFieldProps(column).disabled\"\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n              [nzMode]=\"getFieldProps(column).mode\"\r\n            ></nz-date-picker>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'checkbox'\">\r\n            <nz-checkbox-group\r\n              [class]=\"\r\n                getFieldProps(column).noStyle\r\n                  ? 'pro-table-checkboxgroup-nostyle'\r\n                  : ''\r\n              \"\r\n              [(ngModel)]=\"getFieldProps(column).options\"\r\n              [nzDisabled]=\"getFieldProps(column).disabled\"\r\n              (ngModelChange)=\"\r\n                handleFieldCheckBoxChange(\r\n                  $event,\r\n                  getFieldProps(column).name || column.prop\r\n                )\r\n              \"\r\n            ></nz-checkbox-group>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'autoComplete'\">\r\n            <input\r\n              nz-input\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column)?.name || column.prop]\r\n              \"\r\n              (input)=\"handleAutoCompleteInput($event, column)\"\r\n              [nzAutocomplete]=\"auto\"\r\n              [disabled]=\"getFieldProps(column)?.disabled\"\r\n              [placeholder]=\"getFieldProps(column)?.placeHolder\"\r\n            />\r\n            <nz-autocomplete\r\n              [nzBackfill]=\"getFieldProps(column).backFill\"\r\n              [nzDefaultActiveFirstOption]=\"\r\n                getFieldProps(column).defaultActiveFirstOption\r\n              \"\r\n              [nzWidth]=\"getFieldProps(column).width\"\r\n              #auto\r\n            >\r\n              <nz-auto-option\r\n                *ngFor=\"let option of getAutoCompleteDataSource(column)\"\r\n                [nzValue]=\"\r\n                  getFieldProps(column).returnFullData ? option : option.value\r\n                \"\r\n                [nzLabel]=\"option.label\"\r\n                [nzDisabled]=\"option.disabled\"\r\n              >\r\n                {{ option.label }}\r\n              </nz-auto-option>\r\n            </nz-autocomplete>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'custom'\">\r\n            <app-dynamic-search-field\r\n              [component]=\"getFieldProps(column).component\"\r\n              [value]=\"_searchParams[getFieldProps(column).name || column.prop]\"\r\n              [props]=\"getFieldProps(column)\"\r\n              (valueChange)=\"\r\n                setFieldValue(getFieldProps(column).name || column.prop, $event)\r\n              \"\r\n            ></app-dynamic-search-field>\r\n          </nz-form-control>\r\n          <nz-form-control *ngIf=\"column.valueType === 'inputNumber'\">\r\n            <nz-input-number\r\n              [style.width]=\"'100%'\"\r\n              [(ngModel)]=\"\r\n                _searchParams[getFieldProps(column).name || column.prop]\r\n              \"\r\n              [nzPlaceHolder]=\"getFieldProps(column).placeHolder\"\r\n              [nzDisabled]=\"getFieldProps(column).disabled\"\r\n              [nzFormatter]=\"getFieldProps(column).formatterPercent\"\r\n              [nzParser]=\"getFieldProps(column).parserPercent\"\r\n            ></nz-input-number>\r\n          </nz-form-control>\r\n        </nz-form-item>\r\n      </ng-template>\r\n      <ng-template #actionTextBtn>\r\n        <nz-space [nzSize]=\"4\">\r\n          <nz-space-item *ngIf=\"showSearchBtn\">\r\n            <button nz-button nzType=\"primary\" (click)=\"handleSearch()\">\r\n              {{ confirmBtnText }}\r\n            </button>\r\n          </nz-space-item>\r\n          <nz-space-item *ngIf=\"showClearBtn\">\r\n            <button nz-button (click)=\"handleResetForm()\">\r\n              {{ clearBtnText }}\r\n            </button>\r\n          </nz-space-item>\r\n        </nz-space>\r\n      </ng-template>\r\n      <ng-template #actionImgBtn>\r\n        <nz-space>\r\n          <ng-container *ngTemplateOutlet=\"imgActionBarTpl\"></ng-container>\r\n          <nz-space-item class=\"setting-space-item\" *ngIf=\"showColumnSetting\">\r\n            <app-colmuns-setting\r\n              [columns]=\"columns\"\r\n              [selectedColumns]=\"_serverColumns\"\r\n              [tableName]=\"tableName\"\r\n              (afterConfirm)=\"handleColumnsSettingConfirm()\"\r\n            ></app-colmuns-setting>\r\n          </nz-space-item>\r\n        </nz-space>\r\n      </ng-template>\r\n    </app-table-search-bar>\r\n  </ng-template>\r\n  <ng-template #body>\r\n    <div class=\"mb-12\">\r\n      <ng-container *ngIf=\"showActionBar\">\r\n        <ng-container *ngTemplateOutlet=\"actionBarTpl\"></ng-container>\r\n      </ng-container>\r\n    </div>\r\n    <ng-container *ngIf=\"customTableRender\">\r\n      <ng-container *ngTemplateOutlet=\"customTableRender\"></ng-container>\r\n    </ng-container>\r\n    <nz-table\r\n      *ngIf=\"!customTableRender\"\r\n      #basicTable\r\n      nzSize=\"small\"\r\n      nzShowSizeChanger\r\n      [nzBordered]=\"bordered\"\r\n      [nzOuterBordered]=\"outerBordered\"\r\n      [nzData]=\"dataSource\"\r\n      [nzPageIndex]=\"_pageInfo.pageIndex\"\r\n      [nzPageSize]=\"_pageInfo.pageSize\"\r\n      [nzTotal]=\"_pageInfo.total\"\r\n      [nzPageSizeOptions]=\"_pageInfo.pageSizeOptions\"\r\n      [nzShowPagination]=\"showPagination\"\r\n      [nzShowTotal]=\"totalTemplate\"\r\n      [nzLoading]=\"_loading\"\r\n      [nzFrontPagination]=\"frontPagination\"\r\n      [nzScroll]=\"scroll\"\r\n      (nzPageIndexChange)=\"handlePageIndexChange($event)\"\r\n      (nzPageSizeChange)=\"handlePageSizeChange($event)\"\r\n    >\r\n      <thead>\r\n        <tr>\r\n          <!-- \u590D\u9009\u6846\u5217\uFF08\u5F53 showCheckbox=true \u65F6\u663E\u793A\uFF09 -->\r\n          <th\r\n            *ngIf=\"showCheckbox\"\r\n            [nzWidth]=\"'50px'\"\r\n            [nzAlign]=\"'center'\"\r\n            style=\"text-align: center\"\r\n          >\r\n            <label\r\n              nz-checkbox\r\n              [(ngModel)]=\"_checkedAll\"\r\n              [nzIndeterminate]=\"_indeterminate\"\r\n              (ngModelChange)=\"toggleCheckAll($event)\"\r\n              (click)=\"$event.stopPropagation()\"\r\n            ></label>\r\n          </th>\r\n          <th\r\n            *ngFor=\"let column of _columns\"\r\n            [nzWidth]=\"column.width\"\r\n            [nzAlign]=\"column.align\"\r\n            [nzLeft]=\"column.fixedLeft\"\r\n            [nzRight]=\"column.fixedRight\"\r\n            [nzShowSort]=\"!!column.sorter\"\r\n            [nzSortOrder]=\"getSortOrder(column.prop)\"\r\n            (nzSortOrderChange)=\"onSortChange(column.prop, $event)\"\r\n          >\r\n            {{ column.title }}\r\n          </th>\r\n        </tr>\r\n      </thead>\r\n\r\n      <tbody>\r\n        <tr\r\n          style=\"cursor: pointer\"\r\n          *ngFor=\"let data; let i = index; of: basicTable.data\"\r\n          [ngClass]=\"{\r\n            'ant-table-custom-row-selected': !!getTableRowChecked(data),\r\n            'ant-table-custom-row-even': i % 2 === 0,\r\n            'ant-table-custom-row-odd': i % 2 !== 0\r\n          }\"\r\n          (click)=\"handleTableRowClick(data)\"\r\n          (dblclick)=\"handleTableRowDbClick(data)\"\r\n        >\r\n          <!-- \u590D\u9009\u6846\u5217\uFF08\u5F53 showCheckbox=true \u65F6\u663E\u793A\uFF09 -->\r\n          <td\r\n            *ngIf=\"showCheckbox\"\r\n            [nzAlign]=\"'center'\"\r\n            style=\"text-align: center\"\r\n            (click)=\"$event.stopPropagation()\"\r\n          >\r\n            <label\r\n              nz-checkbox\r\n              [ngModel]=\"isRowChecked(data)\"\r\n              [nzDisabled]=\"isRowDisabled(data)\"\r\n              (ngModelChange)=\"toggleRowChecked(data, $event)\"\r\n            ></label>\r\n          </td>\r\n          <td\r\n            *ngFor=\"let column of _columns\"\r\n            [nzLeft]=\"column.fixedLeft\"\r\n            [nzRight]=\"column.fixedRight\"\r\n            [nzAlign]=\"column.align\"\r\n            class=\"pro-ellipsis\"\r\n            [title]=\"data[column.prop]\"\r\n          >\r\n            <!-- \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49\u6A21\u677F -->\r\n            <ng-container\r\n              *ngIf=\"\r\n                column.customRender && getTemplate(column.customRender);\r\n                let template\r\n              \"\r\n            >\r\n              <ng-template\r\n                [ngTemplateOutlet]=\"template\"\r\n                [ngTemplateOutletContext]=\"{\r\n                  $implicit: data,\r\n                  data: data,\r\n                  column: column,\r\n                  index: i,\r\n                  pageInfo: _pageInfo\r\n                }\"\r\n              >\r\n              </ng-template>\r\n            </ng-container>\r\n\r\n            <!-- \u9ED8\u8BA4\u6E32\u67D3\u903B\u8F91 -->\r\n            <ng-container\r\n              *ngIf=\"!column.customRender || !getTemplate(column.customRender)\"\r\n            >\r\n              {{ data[column.prop] }}\r\n            </ng-container>\r\n          </td>\r\n        </tr>\r\n        <tr *ngIf=\"summaryData && _pageInfo.total > 0\">\r\n          <!-- \u6C47\u603B\u884C\u7684\u590D\u9009\u6846\u5217\uFF08\u5F53 showCheckbox=true \u65F6\u663E\u793A\uFF0C\u4F46\u4E3A\u7A7A\uFF09 -->\r\n          <td\r\n            *ngIf=\"showCheckbox\"\r\n            style=\"font-weight: bold; border-right: 1px solid #e8e8e8\"\r\n          ></td>\r\n          <td\r\n            *ngFor=\"let column; let i = index; of: _columns\"\r\n            [nzLeft]=\"column.fixedLeft\"\r\n            [nzRight]=\"column.fixedRight\"\r\n            style=\"font-weight: bold; border-right: 1px solid #e8e8e8\"\r\n            [nzAlign]=\"column.align\"\r\n          >\r\n            <span *ngIf=\"i === 0\">\u603B\u8BA1</span>\r\n            <ng-container *ngIf=\"i !== 0 && column.summary\">\r\n              {{\r\n                column.summary?.format\r\n                  ? column.summary?.format(\r\n                      summaryData[column.summary?.name || column.prop]\r\n                    )\r\n                  : summaryData[column.summary?.name || column.prop]\r\n              }}\r\n            </ng-container>\r\n          </td>\r\n        </tr>\r\n      </tbody>\r\n      <ng-template #totalTemplate let-total\r\n        >\u5171 {{ _pageInfo.total }} \u6761\u8BB0\u5F55</ng-template\r\n      >\r\n    </nz-table>\r\n  </ng-template>\r\n</app-page-container>\r\n",
+                styles: [".pro-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::ng-deep .setting-space-item{margin-right:0!important}::ng-deep .pro-table-checkboxgroup-nostyle{white-space:nowrap}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body table{border-collapse:separate;border-spacing:0}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-tbody>tr>td{border-right:1px solid #e8e8e8!important}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-thead>tr>th{border-bottom:1px solid #e8e8e8!important;border-right:1px solid #e8e8e8!important;white-space:nowrap}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-tbody>tr>td:first-child,::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-thead>tr>th:first-child{border-left:none!important}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-cell-fix-left,::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-cell-fix-right,::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-header .ant-table-thead>tr>th.ant-table-cell-fix-left,::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-header .ant-table-thead>tr>th.ant-table-cell-fix-right{border-bottom:1px solid #e8e8e8!important;border-right:1px solid #e8e8e8!important}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-header .ant-table-thead>tr>th{border-top:1px solid #e8e8e8!important}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-tbody>tr>td:last-child,::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-thead>tr>th:last-child{border-right:1px solid #e8e8e8!important}::ng-deep .ant-table-bordered .ant-table-container .ant-table-content .ant-table-body .ant-table-tbody>tr:last-child>td{border-bottom:1px solid #e8e8e8!important}::ng-deep .table-search-bar-left .ant-form-item{margin-bottom:8px}"]
+            },] }
+];
+ProTableComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [PRO_TABLE_COLUMN_REMOTE,] }] }
+];
+ProTableComponent.propDecorators = {
+    showSearchBtn: [{ type: Input }],
+    showClearBtn: [{ type: Input }],
+    title: [{ type: Input }],
+    tableName: [{ type: Input }],
+    multiRow: [{ type: Input }],
+    columns: [{ type: Input }],
+    showSearchBar: [{ type: Input }],
+    showActionBar: [{ type: Input }],
+    confirmBtnText: [{ type: Input }],
+    clearBtnText: [{ type: Input }],
+    labelWidth: [{ type: Input }],
+    labelAlign: [{ type: Input }],
+    dataSource: [{ type: Input }],
+    bordered: [{ type: Input }],
+    outerBordered: [{ type: Input }],
+    showPagination: [{ type: Input }],
+    frontPagination: [{ type: Input }],
+    scroll: [{ type: Input }],
+    request: [{ type: Input }],
+    summaryData: [{ type: Input }],
+    sortMode: [{ type: Input }],
+    showColumnSetting: [{ type: Input }],
+    multipleSort: [{ type: Input }],
+    showCheckbox: [{ type: Input }],
+    rowDisabled: [{ type: Input }],
+    autoTriggerRequest: [{ type: Input }],
+    customTableRender: [{ type: Input }],
+    onRowClick: [{ type: Output }],
+    onRowDbClick: [{ type: Output }],
+    onValuesChange: [{ type: Output }],
+    onResetFormBeforeReload: [{ type: Output }],
+    actionBarTpl: [{ type: ContentChild, args: ["actionBar",] }],
+    imgActionBarTpl: [{ type: ContentChild, args: ["ImgActionBar",] }],
+    allTemplates: [{ type: ContentChildren, args: [TemplateRef,] }]
+};
+
+class PageContainerComponent {
+    constructor() {
+        this.title = "";
+    }
+    ngOnInit() { }
+}
+PageContainerComponent.decorators = [
+    { type: Component, args: [{
+                selector: "app-page-container",
+                template: "<nz-card\r\n  [nzBorderless]=\"true\"\r\n  [nzBodyStyle]=\"{ padding: '10px', width: '100%' }\"\r\n>\r\n  <div class=\"page-container-title\" *ngIf=\"title\">{{ title }}</div>\r\n  <div class=\"page-container-header\">\r\n    <ng-container *ngTemplateOutlet=\"headerTpl\"></ng-container>\r\n  </div>\r\n  <div class=\"page-container-body\">\r\n    <ng-container *ngTemplateOutlet=\"bodyTpl\"></ng-container>\r\n  </div>\r\n</nz-card>\r\n",
+                styles: [".page-container-title{border-left:3px solid #096dd9;color:#1d1d1d;font-size:16px;margin-bottom:16px;padding-left:10px}.page-container-body,.page-container-header{box-sizing:border-box;padding:7px}"]
+            },] }
+];
+PageContainerComponent.ctorParameters = () => [];
+PageContainerComponent.propDecorators = {
+    title: [{ type: Input }],
+    headerTpl: [{ type: ContentChild, args: ["header",] }],
+    bodyTpl: [{ type: ContentChild, args: ["body",] }]
+};
+
+class PageContainerModule {
+}
+PageContainerModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    HttpClientModule,
+                    RouterModule,
+                    NzCardModule,
+                    ReactiveFormsModule,
+                ],
+                declarations: [PageContainerComponent],
+                providers: [],
+                exports: [PageContainerComponent],
+            },] }
+];
+
+class PlateInputComponent {
+    constructor(cdr, elementRef, platePrefixLoadService) {
+        this.cdr = cdr;
+        this.elementRef = elementRef;
+        this.platePrefixLoadService = platePrefixLoadService;
+        this.nzPopoverVisible = false;
+        this.platePrefix = "";
+        this.plateSuffix = "";
+        this.platePrefixOptions = [];
+        this.disabled = false;
+        this.onChange = (value) => { };
+        this.onTouched = () => { };
+    }
+    ngOnInit() {
+        if (this.platePrefixLoadService) {
+            // 使用注入的全局服务加载车牌前缀选项
+            this.platePrefixLoadService
+                .loadPrefixOptions()
+                .then((data) => {
+                this.platePrefixOptions = data;
+            })
+                .catch(() => {
+                this.platePrefixOptions = [];
+            });
+        }
+        else {
+            // 如果没有注入服务，则保持空数组
+            this.platePrefixOptions = [];
+        }
+    }
+    handlePlatePrefix(value) {
+        this.platePrefix = value;
+        this.emitValue();
+        this.nzPopoverVisible = false;
+        this.removeClickOutsideListener();
+    }
+    writeValue(value) {
+        if (value) {
+            this.platePrefix = value.split("")[0];
+            this.plateSuffix = value
+                .split("")
+                .filter((item, index) => index > 0)
+                .join("");
+        }
+        else {
+            this.platePrefix = "";
+            this.plateSuffix = "";
+        }
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        const previousDisabled = this.disabled;
+        this.disabled = isDisabled;
+        // 如果禁用状态改变，关闭 popover 并移除监听器
+        if (previousDisabled !== isDisabled) {
+            this.nzPopoverVisible = false;
+            this.removeClickOutsideListener();
+            // 强制变更检测
+            this.cdr.detectChanges();
+        }
+    }
+    handlePrefixClick(event) {
+        if (this.disabled) {
+            event.preventDefault();
+            event.stopPropagation();
+            this.nzPopoverVisible = false;
+            return;
+        }
+        // 手动切换 popover 的显示/隐藏状态
+        this.nzPopoverVisible = !this.nzPopoverVisible;
+        // 如果打开了 popover，添加文档点击监听器
+        if (this.nzPopoverVisible) {
+            setTimeout(() => {
+                this.attachClickOutsideListener();
+            }, 0);
+        }
+        else {
+            this.removeClickOutsideListener();
+        }
+        event.stopPropagation(); // 阻止事件冒泡
+    }
+    attachClickOutsideListener() {
+        if (this.clickOutsideHandler) {
+            return;
+        }
+        this.clickOutsideHandler = (event) => {
+            const nativeElement = this.elementRef.nativeElement;
+            const target = event.target;
+            // 检查是否点击在 popover 内容区域内
+            const popoverContent = document.querySelector('.plate-input-popover');
+            const clickedInPopover = popoverContent && popoverContent.contains(target);
+            // 检查是否点击在组件内部（前缀按钮）
+            const clickedInComponent = nativeElement.contains(target);
+            // 如果点击既不在组件内部，也不在 popover 内容区域，则关闭 popover
+            if (!clickedInComponent && !clickedInPopover) {
+                this.nzPopoverVisible = false;
+                this.removeClickOutsideListener();
+                this.cdr.detectChanges();
+            }
+        };
+        // 使用捕获阶段，确保在其他事件处理之前执行
+        document.addEventListener('click', this.clickOutsideHandler, true);
+    }
+    removeClickOutsideListener() {
+        if (this.clickOutsideHandler) {
+            document.removeEventListener('click', this.clickOutsideHandler, true);
+            this.clickOutsideHandler = undefined;
+        }
+    }
+    ngOnDestroy() {
+        this.removeClickOutsideListener();
+    }
+    emitValue() {
+        const fullPlate = this.platePrefix + this.plateSuffix;
+        this.onChange(fullPlate);
+    }
+    onBlur() {
+        this.onTouched();
+    }
+    handleAntdPlateSuffixBlur(event) {
+        if (this.disabled)
+            return;
+        const value = event.target.value.toUpperCase();
+        this.plateSuffix = value;
+        this.emitValue();
+    }
+}
+PlateInputComponent.decorators = [
+    { type: Component, args: [{
+                selector: "app-plate-input",
+                template: "<div\r\n  class=\"plate-antd-input-container\"\r\n  [class.plate-antd-input-disabled]=\"disabled\"\r\n>\r\n  <div\r\n    class=\"plate-input-prefix\"\r\n    [class.plate-input-prefix-disabled]=\"disabled\"\r\n    nz-popover\r\n    nzPopoverPlacement=\"bottom\"\r\n    nzPopoverOverlayClassName=\"plate-input-popover\"\r\n    [(nzPopoverVisible)]=\"nzPopoverVisible\"\r\n    [nzPopoverTrigger]=\"'manual'\"\r\n    [nzPopoverContent]=\"contentTemplate\"\r\n    (click)=\"handlePrefixClick($event)\"\r\n  >\r\n    {{ platePrefix | uppercase }}\r\n    <i\r\n      class=\"plate-input-icon-down\"\r\n      [nzRotate]=\"nzPopoverVisible ? 180 : 0\"\r\n      nz-icon\r\n      nzType=\"down\"\r\n      nzTheme=\"outline\"\r\n    ></i>\r\n  </div>\r\n  <ng-template #contentTemplate>\r\n    <div nz-row style=\"height: 100%\">\r\n      <div\r\n        nz-col\r\n        nzSpan=\"4\"\r\n        *ngFor=\"let item of platePrefixOptions\"\r\n        class=\"plate-input-popover-item\"\r\n        (click)=\"!disabled && handlePlatePrefix(item.value)\"\r\n        [ngClass]=\"{\r\n          'plate-input-popover-item-active': item.value === platePrefix,\r\n          'plate-input-popover-item-default': item.value !== platePrefix\r\n        }\"\r\n      >\r\n        <div class=\"plate-input-popover-item-label\">\r\n          {{ item.label }}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n  <input\r\n    class=\"plate-input-suffix\"\r\n    type=\"text\"\r\n    nz-input\r\n    style=\"width: 75%\"\r\n    [value]=\"plateSuffix | uppercase\"\r\n    [disabled]=\"disabled\"\r\n    (blur)=\"!disabled && handleAntdPlateSuffixBlur($event)\"\r\n  />\r\n</div>\r\n",
+                providers: [
+                    {
+                        provide: NG_VALUE_ACCESSOR,
+                        useExisting: forwardRef(() => PlateInputComponent),
+                        multi: true,
+                    },
+                ],
+                styles: ["::ng-deep .plate-input-popover{box-sizing:border-box;padding:5px 0}::ng-deep .plate-input-popover .ant-popover-inner-content{height:264px;padding:0;width:387px}::ng-deep .plate-input-popover .ant-popover-inner-content .plate-input-popover-item{box-sizing:border-box;cursor:pointer;height:42px;padding:6px 12px}::ng-deep .plate-input-popover .ant-popover-inner-content .plate-input-popover-item .plate-input-popover-item-label{align-items:center;border:1px solid #ccc;display:flex;height:100%;justify-content:center;width:100%}::ng-deep .plate-input-popover .ant-popover-inner-content .plate-input-popover-item-default:hover{background-color:#eaeaea}::ng-deep .plate-input-popover .ant-popover-inner-content .plate-input-popover-item-active{background-color:#096dd9;color:#fff}::ng-deep .plate-input-prefix:hover:after{background-color:transparent;content:\"\";height:100%;position:absolute;right:0;top:0;width:1px;z-index:2}::ng-deep .plate-antd-input-container{display:flex;flex-wrap:nowrap;width:100%}::ng-deep .plate-antd-input-container .plate-input-prefix{align-items:center;border:1px solid #d9d9d9;border-radius:2px;cursor:pointer;display:flex;justify-content:center;min-height:32px;position:relative;text-align:center;width:60px}::ng-deep .plate-antd-input-container .plate-input-prefix .plate-input-icon-down{font-size:10px;position:absolute;right:5px;top:50%;transform:translateY(-50%)}::ng-deep .plate-antd-input-container .plate-input-prefix:hover:not(.plate-input-prefix-disabled){border-color:#40a9ff}::ng-deep .plate-antd-input-container .plate-input-prefix-disabled{background-color:#f5f5f5;border-color:#d9d9d9;color:rgba(0,0,0,.25);cursor:not-allowed}::ng-deep .plate-antd-input-container .plate-input-suffix{width:calc(100% - 60px)}"]
+            },] }
+];
+PlateInputComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: ElementRef },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [PLATE_PREFIX_LOAD_SERVICE,] }] }
+];
+
+class PlateInputModule {
+}
+PlateInputModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    NzGridModule,
+                    NzInputModule,
+                    NzPopoverModule,
+                    NzIconModule,
+                ],
+                declarations: [PlateInputComponent],
+                providers: [],
+                exports: [PlateInputComponent],
+            },] }
+];
+
+class TableSearchBarComponent {
+    constructor() {
+        this.leftColSpan = 21;
+        this.rightColSpan = 3;
+        this.labelWidth = "90px";
+        this.labelAlign = "right";
+    }
+    ngOnInit() {
+        this.setCSSVariablesToTarget();
+    }
+    ngAfterViewInit() {
+        this.setCSSVariablesToTarget();
+    }
+    setCSSVariablesToTarget() {
+        // setTimeout(() => {
+        //   const leftElement = document.querySelectorAll(".table-search-bar-left");
+        //   console.log('leftElement',leftElement);
+        //   if (leftElement.length > 0) {
+        //     leftElement.forEach((element) => {
+        //       (element as HTMLElement).style.setProperty(
+        //         "--label-width",
+        //         this.labelWidth
+        //       );
+        //       (element as HTMLElement).style.setProperty(
+        //         "--label-align",
+        //         this.labelAlign
+        //       );
+        //     });
+        //   }
+        // });
+    }
+}
+TableSearchBarComponent.decorators = [
+    { type: Component, args: [{
+                selector: "app-table-search-bar",
+                template: "<div class=\"table-search-bar\">\r\n  <div class=\"table-search-bar-left\" style=\"--label-width: {{ labelWidth }}; --label-align: {{ labelAlign }};\">\r\n    <ng-container *ngTemplateOutlet=\"leftContentTpl\"></ng-container>\r\n  </div>\r\n  <div class=\"table-search-bar-right\">\r\n    <nz-space nzDirection=\"vertical\" nzAlign=\"end\">\r\n      <nz-space-item>\r\n        <ng-container *ngTemplateOutlet=\"actionTextBtnTpl\"></ng-container>\r\n      </nz-space-item>\r\n      <nz-space-item>\r\n        <ng-container *ngTemplateOutlet=\"actionImgBtnTpl\"></ng-container>\r\n      </nz-space-item>\r\n    </nz-space>\r\n    <!-- <ng-container *ngTemplateOutlet=\"rightContentTpl\"></ng-container> -->\r\n  </div>\r\n</div>\r\n",
+                styles: ["::ng-deep .table-search-bar{align-items:flex-start;display:flex;flex-wrap:wrap;gap:16px;width:100%}::ng-deep .table-search-bar-left{display:flex;flex:1;flex-wrap:wrap;gap:0 normal;min-width:0}::ng-deep .table-search-bar-left ::ng-deep .ant-form-item{flex-shrink:0;flex-wrap:nowrap;width:250px}::ng-deep .table-search-bar-left ::ng-deep .ant-form-item .ant-form-item-label{flex-shrink:0;text-align:var(--label-align);width:var(--label-width)}::ng-deep .table-search-bar-left ::ng-deep .ant-form-item .ant-form-item-label label:after{content:\"\"}::ng-deep .table-search-bar-left ::ng-deep .ant-form-item .ant-picker{width:100%}::ng-deep .table-search-bar-right{align-items:flex-start;display:flex;flex-shrink:0}"]
+            },] }
+];
+TableSearchBarComponent.ctorParameters = () => [];
+TableSearchBarComponent.propDecorators = {
+    leftColSpan: [{ type: Input }],
+    rightColSpan: [{ type: Input }],
+    labelWidth: [{ type: Input }],
+    labelAlign: [{ type: Input }],
+    leftContentTpl: [{ type: ContentChild, args: ["leftContent",] }],
+    actionTextBtnTpl: [{ type: ContentChild, args: ["actionTextBtn",] }],
+    actionImgBtnTpl: [{ type: ContentChild, args: ["actionImgBtn",] }]
+};
+
+class TableSearchBarModule {
+}
+TableSearchBarModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    HttpClientModule,
+                    RouterModule,
+                    NzGridModule,
+                    ReactiveFormsModule,
+                    NzSpaceModule,
+                ],
+                declarations: [TableSearchBarComponent],
+                providers: [],
+                exports: [TableSearchBarComponent],
+            },] }
+];
+
+class ColmunsSettingComponent {
+    constructor(columnRemote) {
+        this.columnRemote = columnRemote;
+        this.columns = [];
+        this.selectedColumns = [];
+        this.afterConfirm = new EventEmitter();
+        this.modalVisible = false;
+        this.options = [];
+        this.sortableInstance = null;
+    }
+    ngOnInit() { }
+    ngAfterViewInit() {
+        this.initSortable();
+    }
+    ngOnDestroy() {
+        if (this.sortableInstance) {
+            this.sortableInstance.destroy();
+        }
+    }
+    initSortable() {
+        // 先销毁已存在的实例
+        if (this.sortableInstance) {
+            this.sortableInstance.destroy();
+            this.sortableInstance = null;
+        }
+        if (this.sortableContainer && this.sortableContainer.nativeElement) {
+            this.sortableInstance = new Sortable(this.sortableContainer.nativeElement, {
+                animation: 150,
+                ghostClass: "sortable-ghost",
+                chosenClass: "sortable-chosen",
+                dragClass: "sortable-drag",
+                handle: ".sort-list-item",
+                onEnd: (evt) => {
+                    this.onSortEnd(evt);
+                },
+            });
+        }
+    }
+    onSortEnd(evt) {
+        const { oldIndex, newIndex } = evt;
+        if (oldIndex !== newIndex) {
+            // 创建新的数组来避免直接修改输入属性
+            const newSelectedColumns = [...this.selectedColumns];
+            const movedItem = newSelectedColumns.splice(oldIndex, 1)[0];
+            newSelectedColumns.splice(newIndex, 0, movedItem);
+            // 更新 selectedColumns
+            this.selectedColumns = newSelectedColumns;
+        }
+    }
+    trackByColumn(index, item) {
+        return item.prop || index.toString();
+    }
+    /**
+     * 同步 options 数组的 checked 状态与 selectedColumns
+     */
+    syncOptionsWithSelectedColumns() {
+        const selectedProps = this.selectedColumns.map((col) => col.prop);
+        this.options.forEach((option) => {
+            option.checked = selectedProps.includes(option.value);
+        });
+    }
+    handleModalVisible() {
+        this.options = this.columns
+            .filter((item) => !item.auxiliaryColumn)
+            .map((item) => {
+            return {
+                label: item.title,
+                value: item.prop,
+                checked: item.hideInTable ? false : true,
+                sortName: item.sortName || null,
+            };
+        });
+        // 同步 options 的 checked 状态与当前 selectedColumns
+        this.syncOptionsWithSelectedColumns();
+        this.modalVisible = true;
+        // 模态框打开后重新初始化排序
+        setTimeout(() => {
+            this.initSortable();
+        }, 100);
+    }
+    handleModalClose() {
+        this.modalVisible = false;
+        if (this.sortableInstance) {
+            this.sortableInstance.destroy();
+            this.sortableInstance = null;
+        }
+    }
+    handleSelectRemove(key) {
+        this.selectedColumns = this.selectedColumns.filter((item) => item.prop !== key);
+        // 使用同步方法确保所有状态一致
+        this.syncOptionsWithSelectedColumns();
+    }
+    handleCheckBoxChange(value, record) {
+        if (!value) {
+            this.handleSelectRemove(record.value);
+        }
+        else {
+            this.selectedColumns.push({
+                title: record.label,
+                prop: record.value,
+                sortName: record.sortName,
+                hideInTable: false,
+            });
+            // 添加项目后同步状态
+            this.syncOptionsWithSelectedColumns();
+        }
+    }
+    handleConfirm() {
+        var _a;
+        if (!((_a = this.columnRemote) === null || _a === void 0 ? void 0 : _a.setCol) || !this.tableName) {
+            this.modalVisible = false;
+            this.afterConfirm.emit();
+            return;
+        }
+        const payload = this.selectedColumns.map((column) => {
+            return {
+                field: column.prop,
+                isShow: column.hideInTable ? false : true,
+                header: column.title,
+                sortName: column.sortName || null,
+            };
+        });
+        const result = this.columnRemote.setCol(this.tableName, payload);
+        const done = (res) => {
+            this.modalVisible = false;
+            this.afterConfirm.emit();
+        };
+        if (result && isObservable(result)) {
+            result.subscribe(done, () => done(null));
+        }
+        else {
+            Promise.resolve(result).finally(() => done(null));
+        }
+    }
+}
+ColmunsSettingComponent.decorators = [
+    { type: Component, args: [{
+                selector: "app-colmuns-setting",
+                template: "<div class=\"action-pic-btn\" (click)=\"handleModalVisible()\" title=\"\u5217\u8BBE\u7F6E\">\r\n  <i nz-icon nzType=\"setting\" nzTheme=\"outline\"></i>\r\n</div>\r\n\r\n<nz-modal\r\n  [(nzVisible)]=\"modalVisible\"\r\n  [nzWidth]=\"820\"\r\n  [nzTitle]=\"modalTitle\"\r\n  (nzOnCancel)=\"handleModalClose()\"\r\n  [nzContent]=\"modalBody\"\r\n  [nzBodyStyle]=\"{ padding: '12px' }\"\r\n  (nzOnOk)=\"handleConfirm()\"\r\n  [nzWrapClassName]=\"'draggable-modal'\"\r\n>\r\n  <ng-template #modalTitle>\r\n    <div\r\n      class=\"modal-drag-handle\"\r\n      cdkDrag\r\n      [cdkDragRootElement]=\"'.draggable-modal .ant-modal'\"\r\n      cdkDragHandle\r\n      [cdkDragBoundary]=\"'.draggable-modal'\"\r\n    >\r\n      <span>\u8BBE\u7F6E\u663E\u793A\u5B57\u6BB5</span>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template #modalBody>\r\n    <div class=\"modal-body\">\r\n      <div class=\"check-box-list\">\r\n        <div class=\"mb-12\">\u53EF\u9009\u5B57\u6BB5</div>\r\n        <nz-checkbox-wrapper style=\"width: 100%\">\r\n          <div nz-row [nzGutter]=\"[24, 24]\">\r\n            <div nz-col nzSpan=\"6\" *ngFor=\"let item of options\">\r\n              <label\r\n                nz-checkbox\r\n                nzValue=\"item.value\"\r\n                [ngModel]=\"item.checked\"\r\n                (ngModelChange)=\"handleCheckBoxChange($event, item)\"\r\n                >{{ item.label }}</label\r\n              >\r\n            </div>\r\n          </div>\r\n        </nz-checkbox-wrapper>\r\n      </div>\r\n      <div class=\"sort-list\">\r\n        <div nz-typography class=\"mb-4\">\u5F53\u524D\u5DF2\u7ECF\u9009\u5B9A\u7684\u5B57\u6BB5</div>\r\n        <div\r\n          nz-typography\r\n          nzType=\"secondary\"\r\n          class=\"mb-4\"\r\n          [style.fontSize]=\"'12px'\"\r\n        >\r\n          \u63D0\u793A\uFF1A\u53EF\u62D6\u52A8\u6392\u5E8F\r\n        </div>\r\n        <div #sortableContainer class=\"sortable-container\">\r\n          <div\r\n            class=\"sort-list-item mb-12\"\r\n            *ngFor=\"let item of selectedColumns; trackBy: trackByColumn\"\r\n          >\r\n            {{ item.title }}\r\n            <a\r\n              href=\"javascript:void(0)\"\r\n              class=\"fieldd-remove\"\r\n              title=\"\u5220\u9664\"\r\n              (click)=\"handleSelectRemove(item.prop)\"\r\n              >\u00D7</a\r\n            >\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</nz-modal>\r\n",
+                styles: [".action-pic-btn{align-items:center;cursor:pointer;display:inline-flex;height:32px;justify-content:center;width:32px}.modal-body{display:flex;height:600px;width:100%}.modal-body .check-box-list{height:100%;width:calc(100% - 200px)}.modal-body .sort-list{border-left:1px solid #e3e3e3;box-sizing:border-box;height:100%;overflow-y:auto;padding-left:12px;padding-right:12px;width:200px}.modal-body .sort-list .sortable-container{min-height:100px}.modal-body .sort-list .sort-list-item{-moz-user-select:none;-webkit-user-select:none;align-items:center;cursor:move;display:flex;justify-content:space-between;user-select:none}.modal-body .sort-list .sort-list-item a{font-size:18px}.modal-drag-handle{-moz-user-select:none;-webkit-user-select:none;cursor:move;user-select:none;width:100%}"]
+            },] }
+];
+ColmunsSettingComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [PRO_TABLE_COLUMN_REMOTE,] }] }
+];
+ColmunsSettingComponent.propDecorators = {
+    columns: [{ type: Input }],
+    selectedColumns: [{ type: Input }],
+    tableName: [{ type: Input }],
+    afterConfirm: [{ type: Output }],
+    sortableContainer: [{ type: ViewChild, args: ["sortableContainer", { static: false },] }]
+};
+
+class DynamicSearchFieldComponent {
+    constructor(cfr) {
+        this.cfr = cfr;
+        this.component = null;
+        this.props = null;
+        this.valueChange = new EventEmitter();
+        this.cmpRef = null;
+        this.isCva = false;
+        this.cvaOnChange = null;
+    }
+    ngOnInit() {
+        this.render();
+    }
+    ngOnChanges(changes) {
+        if (changes.component && !changes.component.firstChange) {
+            this.destroy();
+            this.render();
+            return;
+        }
+        if (this.cmpRef) {
+            if (changes.value && !changes.value.firstChange) {
+                if (this.isCva) {
+                    if (typeof this.cmpRef.instance.writeValue === 'function') {
+                        this.cmpRef.instance.writeValue(this.value);
+                    }
+                }
+                else if ('value' in this.cmpRef.instance) {
+                    this.cmpRef.instance.value = this.value;
+                }
+            }
+            if (changes.props && !changes.props.firstChange) {
+                this.applyProps();
+            }
+        }
+    }
+    render() {
+        if (!this.component)
+            return;
+        const factory = this.cfr.resolveComponentFactory(this.component);
+        this.vc.clear();
+        this.cmpRef = this.vc.createComponent(factory);
+        this.isCva = typeof this.cmpRef.instance.registerOnChange === 'function' && typeof this.cmpRef.instance.writeValue === 'function';
+        if (this.isCva) {
+            this.cmpRef.instance.writeValue(this.value);
+            this.cmpRef.instance.registerOnChange((v) => {
+                this.valueChange.emit(v);
+            });
+        }
+        else {
+            if ('value' in this.cmpRef.instance) {
+                this.cmpRef.instance.value = this.value;
+            }
+            if ('valueChange' in this.cmpRef.instance && this.cmpRef.instance.valueChange && typeof this.cmpRef.instance.valueChange.subscribe === 'function') {
+                this.cmpRef.instance.valueChange.subscribe((v) => {
+                    this.valueChange.emit(v);
+                });
+            }
+        }
+        this.applyProps();
+    }
+    applyProps() {
+        const p = this.props || {};
+        const extra = p.componentProps || {};
+        Object.keys(extra).forEach((k) => {
+            try {
+                this.cmpRef.instance[k] = extra[k];
+            }
+            catch (_a) { }
+        });
+    }
+    destroy() {
+        if (this.cmpRef) {
+            try {
+                this.cmpRef.destroy();
+            }
+            catch (_a) { }
+            this.cmpRef = null;
+        }
+    }
+    ngOnDestroy() {
+        this.destroy();
+    }
+}
+DynamicSearchFieldComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'app-dynamic-search-field',
+                template: `<ng-template #vc></ng-template>`
+            },] }
+];
+DynamicSearchFieldComponent.ctorParameters = () => [
+    { type: ComponentFactoryResolver }
+];
+DynamicSearchFieldComponent.propDecorators = {
+    component: [{ type: Input }],
+    value: [{ type: Input }],
+    props: [{ type: Input }],
+    valueChange: [{ type: Output }],
+    vc: [{ type: ViewChild, args: ['vc', { read: ViewContainerRef, static: true },] }]
+};
+
+class ProTableModule {
+}
+ProTableModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    HttpClientModule,
+                    RouterModule,
+                    NzFormModule,
+                    NzSelectModule,
+                    NzSpaceModule,
+                    NzGridModule,
+                    NzInputModule,
+                    ReactiveFormsModule,
+                    NzPopoverModule,
+                    NzIconModule,
+                    NzButtonModule,
+                    PageContainerModule,
+                    TableSearchBarModule,
+                    NzTableModule,
+                    PlateInputModule,
+                    NzDatePickerModule,
+                    NzModalModule,
+                    NzCheckboxModule,
+                    NzTypographyModule,
+                    DragDropModule,
+                    NzCheckboxModule,
+                    NzAutocompleteModule,
+                    NzInputNumberModule,
+                    NzToolTipModule,
+                ],
+                declarations: [ProTableComponent, ColmunsSettingComponent, DynamicSearchFieldComponent],
+                providers: [
+                    {
+                        // 默认不提供远程列服务，宿主可覆盖注入
+                        provide: PRO_TABLE_COLUMN_REMOTE,
+                        useValue: null,
+                    },
+                ],
+                exports: [ProTableComponent],
+            },] }
+];
+
+/**
+ * 默认的车牌前缀加载服务实现
+ * 使用 HttpClient 调用 API 获取车牌前缀选项
+ */
+class DefaultPlatePrefixLoadService {
+    constructor(http) {
+        this.http = http;
+        this.defaultApiUrl = "/PlateFirstWord/GetPlateFirstWord";
+    }
+    loadPrefixOptions() {
+        return this.http
+            .post(this.defaultApiUrl, { dictCode: "PlateFirstWord" })
+            .toPromise()
+            .then((list) => {
+            const options = [];
+            // 添加空选项（与旧版保持一致）
+            options.push({ label: "", value: "" });
+            // 转换数据格式
+            for (let i = 0; i < list.length; i++) {
+                options.push({
+                    label: list[i],
+                    value: list[i],
+                });
+            }
+            return options;
+        })
+            .catch(() => {
+            // 发生错误时返回空数组
+            return [];
+        });
+    }
+}
+DefaultPlatePrefixLoadService.decorators = [
+    { type: Injectable }
+];
+DefaultPlatePrefixLoadService.ctorParameters = () => [
+    { type: HttpClient }
+];
+
+// ==================== 服务类 ====================
+class AntdFormService {
+    // ==================== 构造函数 ====================
+    constructor(fb) {
+        this.fb = fb;
+        // ==================== 公共属性 ====================
+        this.formStore = {};
+        this.formModifyType = "create";
+        // ==================== 私有属性 ====================
+        this.labelWidth = "120px";
+        this.labelAlign = "right";
+        this.labelObservers = {};
+        this.errorMessageStore = {};
+        this.formArrayConfigStore = {};
+        this.INTERNAL_ID_FIELD = "__formItemId";
+        this.classPrefix = "ant-form-";
+        this.defaultErrorMessages = {
+            required: "该字段为必填项",
+            minlength: "输入长度不足",
+            maxlength: "输入长度超限",
+            email: "请输入合法的邮箱地址",
+            pattern: "输入格式不正确",
+        };
+    }
+    // ==================== 表单创建和初始化 ====================
+    // 初始化表单（支持 FormArray）
+    createFormGroup(name, config, options) {
+        const groupConfig = {};
+        this.errorMessageStore[name] = {};
+        Object.entries(config).forEach(([key, field]) => {
+            var _a, _b, _c;
+            if (this.isFormArrayConfig(field)) {
+                // FormArray 配置处理
+                if (!this.formArrayConfigStore[name]) {
+                    this.formArrayConfigStore[name] = {};
+                }
+                this.formArrayConfigStore[name][key] = {
+                    itemConfig: field.itemConfig,
+                    uniqueIdField: field.uniqueIdField,
+                };
+                const formArray = this.createFormArrayFromConfig(name, key, field.itemConfig, field.initialItems || [], field.uniqueIdField);
+                groupConfig[key] = formArray;
+                // 存储 FormArray 字段的错误消息配置，格式：arrayName[].fieldName
+                if (field.errorMessages) {
+                    Object.entries(field.errorMessages).forEach(([fieldName, errorMessages]) => {
+                        const errorMessageKey = `${key}[].${fieldName}`;
+                        this.errorMessageStore[name][errorMessageKey] = errorMessages;
+                    });
+                }
+            }
+            else {
+                // 普通字段配置
+                const fieldConfig = field;
+                groupConfig[key] = [
+                    { value: fieldConfig.value, disabled: (_a = fieldConfig.disabled) !== null && _a !== void 0 ? _a : false },
+                    (_c = (_b = fieldConfig.validators) === null || _b === void 0 ? void 0 : _b.call(fieldConfig)) !== null && _c !== void 0 ? _c : [],
+                ];
+                if (fieldConfig.errorMessages) {
+                    this.errorMessageStore[name][key] = fieldConfig.errorMessages;
+                }
+            }
+        });
+        if (options === null || options === void 0 ? void 0 : options.labelWidth) {
+            this.labelWidth = options.labelWidth;
+        }
+        if (options === null || options === void 0 ? void 0 : options.labelAlign) {
+            this.labelAlign = options.labelAlign;
+        }
+        this.formStore[name] = this.fb.group(groupConfig);
+        this.setCSSVariablesToTarget(name);
+        return this.formStore[name];
+    }
+    // ==================== 表单操作 ====================
+    // 重置表单
+    resetFormGroup(name, value) {
+        var _a;
+        (_a = this.formStore[name]) === null || _a === void 0 ? void 0 : _a.reset(value);
+    }
+    // 批量添加字段配置
+    addFieldsConfig(formName, fieldsConfig, options) {
+        var _a;
+        const result = {
+            success: true,
+            added: [],
+            failed: [],
+        };
+        // 1. 验证表单是否存在
+        const formGroup = this.formStore[formName];
+        if (!formGroup) {
+            // 如果表单不存在，所有字段都失败
+            Object.keys(fieldsConfig).forEach((fieldName) => {
+                var _a;
+                const error = `Form "${formName}" not found`;
+                result.failed.push({
+                    fieldName,
+                    error,
+                });
+                (_a = options === null || options === void 0 ? void 0 : options.onFieldAdded) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, false, error);
+            });
+            result.success = false;
+            return result;
+        }
+        // 2. 初始化 errorMessageStore 和 formArrayConfigStore（如果不存在）
+        if (!this.errorMessageStore[formName]) {
+            this.errorMessageStore[formName] = {};
+        }
+        if (!this.formArrayConfigStore[formName]) {
+            this.formArrayConfigStore[formName] = {};
+        }
+        // 3. 批量构建控件配置
+        const controlsToAdd = {};
+        const errorMessagesToAdd = {};
+        const formArrayConfigsToAdd = {};
+        // 4. 遍历所有字段配置，进行验证和构建
+        Object.entries(fieldsConfig).forEach(([fieldName, fieldConfig]) => {
+            var _a, _b, _c, _d, _e;
+            try {
+                // 4.1 检查字段是否已存在
+                if (formGroup.get(fieldName)) {
+                    const error = `Field "${fieldName}" already exists`;
+                    result.failed.push({
+                        fieldName,
+                        error,
+                    });
+                    (_a = options === null || options === void 0 ? void 0 : options.onFieldAdded) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, false, error);
+                    return;
+                }
+                // 4.2 根据字段类型创建控件
+                if (this.isFormArrayConfig(fieldConfig)) {
+                    // FormArray 处理
+                    const formArray = this.createFormArrayFromConfig(formName, fieldName, fieldConfig.itemConfig, fieldConfig.initialItems || [], fieldConfig.uniqueIdField);
+                    controlsToAdd[fieldName] = formArray;
+                    // 存储 FormArray 配置
+                    formArrayConfigsToAdd[fieldName] = {
+                        itemConfig: fieldConfig.itemConfig,
+                        uniqueIdField: fieldConfig.uniqueIdField,
+                    };
+                    // 存储错误消息
+                    if (fieldConfig.errorMessages) {
+                        Object.entries(fieldConfig.errorMessages).forEach(([itemFieldName, errorMessages]) => {
+                            const errorMessageKey = `${fieldName}[].${itemFieldName}`;
+                            errorMessagesToAdd[errorMessageKey] = errorMessages;
+                        });
+                    }
+                }
+                else {
+                    // 普通字段处理
+                    const fieldConfigTyped = fieldConfig;
+                    const controlOptions = {
+                        validators: (_c = (_b = fieldConfigTyped.validators) === null || _b === void 0 ? void 0 : _b.call(fieldConfigTyped)) !== null && _c !== void 0 ? _c : [],
+                    };
+                    const control = this.fb.control(fieldConfigTyped.value, controlOptions);
+                    // 设置 disabled 状态
+                    if (fieldConfigTyped.disabled) {
+                        control.disable();
+                    }
+                    controlsToAdd[fieldName] = control;
+                    // 存储错误消息
+                    if (fieldConfigTyped.errorMessages) {
+                        errorMessagesToAdd[fieldName] = fieldConfigTyped.errorMessages;
+                    }
+                }
+                result.added.push(fieldName);
+                (_d = options === null || options === void 0 ? void 0 : options.onFieldAdded) === null || _d === void 0 ? void 0 : _d.call(options, fieldName, true);
+            }
+            catch (error) {
+                const errorMessage = (error === null || error === void 0 ? void 0 : error.message) || (error === null || error === void 0 ? void 0 : error.toString()) || "Unknown error";
+                result.failed.push({
+                    fieldName,
+                    error: errorMessage,
+                });
+                (_e = options === null || options === void 0 ? void 0 : options.onFieldAdded) === null || _e === void 0 ? void 0 : _e.call(options, fieldName, false, errorMessage);
+            }
+        });
+        // 5. 批量添加到 FormGroup
+        if (Object.keys(controlsToAdd).length > 0) {
+            Object.entries(controlsToAdd).forEach(([fieldName, control]) => {
+                formGroup.addControl(fieldName, control);
+            });
+            // 6. 批量存储错误消息
+            Object.entries(errorMessagesToAdd).forEach(([key, messages]) => {
+                this.errorMessageStore[formName][key] = messages;
+            });
+            // 7. 批量存储 FormArray 配置
+            Object.entries(formArrayConfigsToAdd).forEach(([fieldName, config]) => {
+                this.formArrayConfigStore[formName][fieldName] = config;
+            });
+            // 8. 更新表单验证状态
+            if (options === null || options === void 0 ? void 0 : options.updateValueAndValidity) {
+                formGroup.updateValueAndValidity({
+                    emitEvent: (_a = options === null || options === void 0 ? void 0 : options.emitEvent) !== null && _a !== void 0 ? _a : true,
+                });
+            }
+        }
+        // 9. 判断整体是否成功
+        result.success = result.failed.length === 0;
+        return result;
+    }
+    // 批量删除字段配置
+    removeFieldsConfig(formName, fieldNames, options) {
+        const result = {
+            success: true,
+            removed: [],
+            failed: [],
+        };
+        // 1. 验证表单是否存在
+        const formGroup = this.formStore[formName];
+        if (!formGroup) {
+            fieldNames.forEach((fieldName) => {
+                var _a;
+                const error = `Form "${formName}" not found`;
+                result.failed.push({
+                    fieldName,
+                    error,
+                });
+                (_a = options === null || options === void 0 ? void 0 : options.onFieldRemoved) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, false, error);
+            });
+            result.success = false;
+            return result;
+        }
+        // 2. 批量收集需要清理的信息
+        const fieldsToRemove = [];
+        const errorMessageKeysToRemove = [];
+        const formArrayFields = [];
+        // 3. 验证每个字段并收集信息
+        fieldNames.forEach((fieldName) => {
+            var _a;
+            const control = formGroup.get(fieldName);
+            if (!control) {
+                const error = `Field "${fieldName}" not found`;
+                result.failed.push({
+                    fieldName,
+                    error,
+                });
+                (_a = options === null || options === void 0 ? void 0 : options.onFieldRemoved) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, false, error);
+                return;
+            }
+            // 判断是否是 FormArray
+            if (control instanceof FormArray) {
+                formArrayFields.push(fieldName);
+                // 收集 FormArray 相关的错误消息键（格式：arrayName[].fieldName）
+                if (this.errorMessageStore[formName]) {
+                    Object.keys(this.errorMessageStore[formName]).forEach((key) => {
+                        if (key.startsWith(`${fieldName}[].`)) {
+                            errorMessageKeysToRemove.push(key);
+                        }
+                    });
+                }
+            }
+            else {
+                // 普通字段的错误消息键
+                errorMessageKeysToRemove.push(fieldName);
+            }
+            fieldsToRemove.push(fieldName);
+        });
+        // 4. 批量执行删除操作
+        try {
+            // 4.1 从 FormGroup 中移除控件
+            fieldsToRemove.forEach((fieldName) => {
+                var _a;
+                formGroup.removeControl(fieldName);
+                result.removed.push(fieldName);
+                (_a = options === null || options === void 0 ? void 0 : options.onFieldRemoved) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, true);
+            });
+            // 4.2 批量删除错误消息
+            if (this.errorMessageStore[formName]) {
+                errorMessageKeysToRemove.forEach((key) => {
+                    delete this.errorMessageStore[formName][key];
+                });
+            }
+            // 4.3 批量删除 FormArray 配置
+            if (this.formArrayConfigStore[formName]) {
+                formArrayFields.forEach((fieldName) => {
+                    delete this.formArrayConfigStore[formName][fieldName];
+                });
+            }
+        }
+        catch (error) {
+            // 如果批量删除过程中出错，标记为失败
+            fieldsToRemove.forEach((fieldName) => {
+                var _a;
+                if (!result.removed.includes(fieldName)) {
+                    const errorMessage = (error === null || error === void 0 ? void 0 : error.message) || (error === null || error === void 0 ? void 0 : error.toString()) || "Failed to remove field";
+                    result.failed.push({
+                        fieldName,
+                        error: errorMessage,
+                    });
+                    (_a = options === null || options === void 0 ? void 0 : options.onFieldRemoved) === null || _a === void 0 ? void 0 : _a.call(options, fieldName, false, errorMessage);
+                }
+            });
+        }
+        // 5. 判断整体是否成功
+        result.success = result.failed.length === 0;
+        return result;
+    }
+    // 局部赋值（支持 FormArray 的智能更新，统一根据 action 字段判断操作类型）
+    patchFormValues(name, values, options) {
+        var _a;
+        const formGroup = this.formStore[name];
+        if (!formGroup) {
+            console.warn(`[AntdFormService] patchFormValues: form "${name}" not found.`);
+            return;
+        }
+        const processedValues = {};
+        Object.entries(values).forEach(([key, value]) => {
+            const control = formGroup.get(key);
+            // 检测是否是 FormArray
+            if (control instanceof FormArray && Array.isArray(value)) {
+                this.patchFormArray(name, key, value);
+                return;
+            }
+            // 普通字段，直接加入
+            processedValues[key] = value;
+        });
+        // 处理普通字段
+        if (Object.keys(processedValues).length > 0) {
+            formGroup.patchValue(processedValues, {
+                emitEvent: (_a = options === null || options === void 0 ? void 0 : options.emitEvent) !== null && _a !== void 0 ? _a : true,
+            });
+        }
+    }
+    // 表单校验（自动过滤内部字段）
+    validateForm(name, options) {
+        var _a, _b;
+        if (this.formStore[name].valid) {
+            const rawValue = this.formStore[name].getRawValue();
+            return this.excludeInternalFields(rawValue);
+        }
+        else {
+            // 递归校验所有控件，包括 FormArray 中的项
+            this.markAllControlsAsDirty(this.formStore[name], (_a = options === null || options === void 0 ? void 0 : options.emitEvent) !== null && _a !== void 0 ? _a : true, (_b = options === null || options === void 0 ? void 0 : options.onlySelf) !== null && _b !== void 0 ? _b : false);
+            return false;
+        }
+    }
+    // 递归标记所有无效控件为 dirty（包括 FormArray 中的项）
+    markAllControlsAsDirty(control, emitEvent, onlySelf) {
+        if (control.invalid) {
+            control.markAsDirty();
+            control.updateValueAndValidity({
+                emitEvent,
+                onlySelf,
+            });
+        }
+        // 如果是 FormGroup，递归处理所有子控件
+        if (control instanceof FormGroup) {
+            Object.values(control.controls).forEach((childControl) => {
+                this.markAllControlsAsDirty(childControl, emitEvent, onlySelf);
+            });
+        }
+        // 如果是 FormArray，递归处理数组中的每一项
+        if (control instanceof FormArray) {
+            control.controls.forEach((childControl) => {
+                this.markAllControlsAsDirty(childControl, emitEvent, onlySelf);
+            });
+        }
+    }
+    // ==================== 错误消息相关 ====================
+    // 获取字段首条错误提示，支持普通字段和 FormArray 字段（格式：arrayName.index.fieldName）
+    getFieldErrorMessage(name, controlName) {
+        var _a;
+        const formGroup = this.formStore[name];
+        if (!formGroup) {
+            console.warn(`[AntdFormService] getFieldErrorMessage: form "${name}" not found.`);
+            return "";
+        }
+        const control = formGroup.get(controlName);
+        if (!control) {
+            console.warn(`[AntdFormService] getFieldErrorMessage: control "${controlName}" not found in form "${name}".`);
+            return "";
+        }
+        if (!control.errors) {
+            return "";
+        }
+        // 解析 controlName，支持 FormArray 格式：arrayName.index.fieldName
+        let errorMessageKey = controlName;
+        const arrayMatch = controlName.match(/^(.+)\.(\d+)\.(.+)$/);
+        if (arrayMatch) {
+            // FormArray 格式：arrayName.index.fieldName -> 使用 arrayName[].fieldName 作为 key
+            const [, arrayName, , fieldName] = arrayMatch;
+            errorMessageKey = `${arrayName}[].${fieldName}`;
+        }
+        // 从 errorMessageStore 获取错误消息配置
+        const errorMessages = (_a = this.errorMessageStore[name]) === null || _a === void 0 ? void 0 : _a[errorMessageKey];
+        const mergedMessages = Object.assign(Object.assign({}, this.defaultErrorMessages), (errorMessages !== null && errorMessages !== void 0 ? errorMessages : {}));
+        for (const errorKey of Object.keys(control.errors)) {
+            const message = mergedMessages[errorKey];
+            if (message) {
+                // 不再支持函数形式，只返回字符串
+                return typeof message === "string" ? message : "";
+            }
+        }
+        return "";
+    }
+    // ==================== 监听相关 ====================
+    // 监听表单所有字段变更
+    watchFormChanges(name, handler, options) {
+        const formGroup = this.formStore[name];
+        if (!formGroup) {
+            console.warn(`[AntdFormService] watchFormChanges: form "${name}" not found.`);
+            return undefined;
+        }
+        return this.setupValueChangeSubscription(formGroup, handler, options);
+    }
+    // 监听指定字段变更
+    watchFieldChanges(name, controlName, handler, options) {
+        const formGroup = this.formStore[name];
+        if (!formGroup) {
+            console.warn(`[AntdFormService] watchFieldChanges: form "${name}" not found.`);
+            return undefined;
+        }
+        const control = formGroup.get(controlName);
+        if (!control) {
+            console.warn(`[AntdFormService] watchFieldChanges: control "${controlName}" not found in form "${name}".`);
+            return undefined;
+        }
+        return this.setupValueChangeSubscription(control, handler, options);
+    }
+    // ==================== 工具方法 ====================
+    // 获取表单类名
+    getFormClassName(name) {
+        return `${this.classPrefix}${name}`;
+    }
+    // 设置 CSS 变量到目标元素（支持持久化监听动态添加的元素）
+    setCSSVariablesToTarget(name) {
+        const selector = `.${this.getFormClassName(name)} .ant-form-item-label`;
+        const formContainerSelector = `.${this.getFormClassName(name)}`;
+        const applyStyles = () => {
+            const dom = document.querySelectorAll(selector);
+            if (!dom.length) {
+                return false;
+            }
+            let appliedCount = 0;
+            dom.forEach((item) => {
+                const target = item;
+                if (target.style.width !== this.labelWidth ||
+                    target.style.textAlign !== this.labelAlign) {
+                    target.style.width = this.labelWidth;
+                    target.style.textAlign = this.labelAlign;
+                    appliedCount++;
+                }
+            });
+            return appliedCount > 0;
+        };
+        if (this.labelObservers[name]) {
+            return;
+        }
+        let timeout = null;
+        const observer = new MutationObserver(() => {
+            cancelAnimationFrame(timeout);
+            timeout = requestAnimationFrame(() => {
+                setTimeout(() => {
+                    applyStyles();
+                }, 0);
+            });
+        });
+        const formContainer = document.querySelector(formContainerSelector);
+        observer.observe(formContainer || document.body, {
+            childList: true,
+            subtree: true,
+            attributes: true,
+        });
+        this.labelObservers[name] = observer;
+    }
+    // ==================== 私有方法 ====================
+    // 获取 FormArray
+    getFormArray(formName, arrayName) {
+        const formGroup = this.formStore[formName];
+        if (!formGroup) {
+            console.warn(`[AntdFormService] getFormArray: form "${formName}" not found.`);
+            return null;
+        }
+        const control = formGroup.get(arrayName);
+        if (!control || !(control instanceof FormArray)) {
+            console.warn(`[AntdFormService] getFormArray: array "${arrayName}" not found in form "${formName}".`);
+            return null;
+        }
+        return control;
+    }
+    // 判断是否是 FormArray 配置
+    isFormArrayConfig(field) {
+        return field.type === "array";
+    }
+    // 从配置创建 FormArray
+    createFormArrayFromConfig(formName, arrayName, itemConfig, initialItems, uniqueIdField) {
+        const formArray = this.fb.array([]);
+        initialItems.forEach((item) => {
+            const itemGroup = this.createItemFormGroup(itemConfig, item, uniqueIdField);
+            formArray.push(itemGroup);
+        });
+        return formArray;
+    }
+    // 生成内部ID（使用业务唯一字段或生成临时ID）
+    generateInternalId(itemData, uniqueIdField) {
+        // 优先使用业务唯一字段
+        if (uniqueIdField && (itemData === null || itemData === void 0 ? void 0 : itemData[uniqueIdField]) !== undefined) {
+            const businessId = itemData[uniqueIdField];
+            if (businessId !== null &&
+                businessId !== undefined &&
+                businessId !== "") {
+                return `business-${uniqueIdField}-${businessId}`;
+            }
+        }
+        // 如果没有业务ID，生成临时ID（用于新添加的项）
+        return `temp-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+    }
+    // 创建单个项的 FormGroup
+    createItemFormGroup(itemConfig, itemData, uniqueIdField) {
+        const groupConfig = {};
+        // 添加内部ID字段
+        const itemId = this.generateInternalId(itemData, uniqueIdField);
+        groupConfig[this.INTERNAL_ID_FIELD] = [
+            { value: itemId, disabled: true },
+            [],
+        ];
+        // 添加业务字段
+        Object.entries(itemConfig).forEach(([key, field]) => {
+            var _a, _b, _c;
+            // itemConfig 中的字段应该是 FieldConfig，不应该包含 FormArrayConfig
+            if (this.isFormArrayConfig(field)) {
+                console.warn(`[AntdFormService] createItemFormGroup: FormArrayConfig is not allowed in itemConfig. Skipping field "${key}".`);
+                return;
+            }
+            const fieldConfig = field;
+            const value = (itemData === null || itemData === void 0 ? void 0 : itemData[key]) !== undefined ? itemData[key] : fieldConfig.value;
+            groupConfig[key] = [
+                { value: value, disabled: (_a = fieldConfig.disabled) !== null && _a !== void 0 ? _a : false },
+                (_c = (_b = fieldConfig.validators) === null || _b === void 0 ? void 0 : _b.call(fieldConfig)) !== null && _c !== void 0 ? _c : [],
+            ];
+        });
+        return this.fb.group(groupConfig);
+    }
+    // 通过业务唯一字段查找内部ID
+    findFormArrayItemIdByBusinessField(formName, arrayName, uniqueIdField, businessIdValue) {
+        const formArray = this.getFormArray(formName, arrayName);
+        if (!formArray)
+            return null;
+        for (let i = 0; i < formArray.length; i++) {
+            const item = formArray.at(i);
+            const itemValue = item.getRawValue();
+            const internalId = itemValue[this.INTERNAL_ID_FIELD];
+            // 检查内部ID是否匹配业务ID
+            if (internalId && internalId.startsWith(`business-${uniqueIdField}-`)) {
+                const idInInternalId = internalId.replace(`business-${uniqueIdField}-`, "");
+                if (String(idInInternalId) === String(businessIdValue)) {
+                    return internalId;
+                }
+            }
+            // 也检查当前业务字段值是否匹配（处理业务ID更新的情况）
+            if (itemValue[uniqueIdField] === businessIdValue) {
+                return internalId;
+            }
+        }
+        return null;
+    }
+    // 通过内部ID查找项
+    findFormArrayItemById(formName, arrayName, itemId) {
+        var _a;
+        const formArray = this.getFormArray(formName, arrayName);
+        if (!formArray)
+            return null;
+        for (let i = 0; i < formArray.length; i++) {
+            const item = formArray.at(i);
+            const id = (_a = item.get(this.INTERNAL_ID_FIELD)) === null || _a === void 0 ? void 0 : _a.value;
+            if (id === itemId) {
+                return { index: i, formGroup: item };
+            }
+        }
+        return null;
+    }
+    // 获取操作类型（必须明确指定 action 字段）
+    getOperationType(itemData) {
+        if (!itemData || typeof itemData !== "object")
+            return null;
+        const action = itemData.action;
+        if (action === "delete" || action === "update" || action === "create") {
+            return action;
+        }
+        return null;
+    }
+    // 过滤操作字段（action 字段不保存到表单中）
+    filterOperationFields(itemData) {
+        if (!itemData || typeof itemData !== "object")
+            return itemData;
+        const filtered = {};
+        Object.entries(itemData).forEach(([key, value]) => {
+            if (key !== "action") {
+                filtered[key] = value;
+            }
+        });
+        return filtered;
+    }
+    // 处理 FormArray 的更新（统一根据 action 字段判断操作类型）
+    patchFormArray(formName, arrayName, newValues) {
+        var _a;
+        const formArray = this.getFormArray(formName, arrayName);
+        if (!formArray) {
+            console.warn(`[AntdFormService] patchFormArray: array "${arrayName}" not found in form "${formName}".`);
+            return;
+        }
+        const config = (_a = this.formArrayConfigStore[formName]) === null || _a === void 0 ? void 0 : _a[arrayName];
+        if (!config) {
+            console.warn(`[AntdFormService] patchFormArray: config not found for array "${arrayName}" in form "${formName}".`);
+            return;
+        }
+        const { itemConfig, uniqueIdField } = config;
+        // 统一根据 action 字段判断操作类型
+        const itemsToDelete = new Set();
+        const itemsToUpdate = new Map();
+        const itemsToAdd = [];
+        newValues.forEach((itemData) => {
+            if (!itemData || typeof itemData !== "object")
+                return;
+            const operationType = this.getOperationType(itemData);
+            if (!operationType) {
+                console.warn(`[AntdFormService] patchFormArray: Item missing required "action" field. Skipping.`, itemData);
+                return;
+            }
+            // 删除操作
+            if (operationType === "delete") {
+                if (uniqueIdField && itemData[uniqueIdField] !== undefined) {
+                    const businessId = itemData[uniqueIdField];
+                    const internalId = this.findFormArrayItemIdByBusinessField(formName, arrayName, uniqueIdField, businessId);
+                    if (internalId) {
+                        itemsToDelete.add(internalId);
+                    }
+                    else {
+                        console.warn(`[AntdFormService] patchFormArray: Cannot delete item with ${uniqueIdField}=${businessId}, item not found.`);
+                    }
+                }
+                else {
+                    console.warn(`[AntdFormService] patchFormArray: Cannot delete item, missing required uniqueIdField "${uniqueIdField}".`);
+                }
+                return;
+            }
+            // 更新操作
+            if (operationType === "update") {
+                if (uniqueIdField && itemData[uniqueIdField] !== undefined) {
+                    const businessId = itemData[uniqueIdField];
+                    const internalId = this.findFormArrayItemIdByBusinessField(formName, arrayName, uniqueIdField, businessId);
+                    if (internalId) {
+                        const filteredData = this.filterOperationFields(itemData);
+                        itemsToUpdate.set(internalId, filteredData);
+                    }
+                    else {
+                        console.warn(`[AntdFormService] patchFormArray: Cannot update item with ${uniqueIdField}=${businessId}, item not found. Skipping.`);
+                    }
+                }
+                else {
+                    console.warn(`[AntdFormService] patchFormArray: Cannot update item, missing required uniqueIdField "${uniqueIdField}". Skipping.`);
+                }
+                return;
+            }
+            // 创建操作
+            if (operationType === "create") {
+                const filteredData = this.filterOperationFields(itemData);
+                itemsToAdd.push(filteredData);
+            }
+        });
+        // 执行删除（需要从后往前删除，避免索引变化）
+        const deleteIndices = [];
+        itemsToDelete.forEach((itemId) => {
+            const found = this.findFormArrayItemById(formName, arrayName, itemId);
+            if (found) {
+                deleteIndices.push(found.index);
+            }
+        });
+        deleteIndices
+            .sort((a, b) => b - a)
+            .forEach((index) => {
+            formArray.removeAt(index);
+        });
+        // 执行更新
+        itemsToUpdate.forEach((itemData, itemId) => {
+            const found = this.findFormArrayItemById(formName, arrayName, itemId);
+            if (found) {
+                const _a = itemData, _b = this.INTERNAL_ID_FIELD, _ = _a[_b], dataToUpdate = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
+                found.formGroup.patchValue(dataToUpdate);
+            }
+        });
+        // 执行添加
+        itemsToAdd.forEach((itemData) => {
+            const newItem = this.createItemFormGroup(itemConfig, itemData, uniqueIdField);
+            formArray.push(newItem);
+        });
+    }
+    // 过滤内部字段（递归处理对象和数组）
+    excludeInternalFields(value) {
+        if (value === null || value === undefined) {
+            return value;
+        }
+        if (Array.isArray(value)) {
+            return value.map((item) => this.excludeInternalFields(item));
+        }
+        if (typeof value !== "object") {
+            return value;
+        }
+        const filtered = {};
+        Object.entries(value).forEach(([key, val]) => {
+            // 过滤以 __ 开头的内部字段和 action 字段
+            if (!key.startsWith("__") && key !== "action") {
+                filtered[key] = this.excludeInternalFields(val);
+            }
+        });
+        return filtered;
+    }
+    // 设置值变更订阅
+    setupValueChangeSubscription(target, handler, options) {
+        let valueChanges$ = target.valueChanges;
+        if ((options === null || options === void 0 ? void 0 : options.debounce) != null) {
+            valueChanges$ = valueChanges$.pipe(debounceTime(options.debounce));
+        }
+        if ((options === null || options === void 0 ? void 0 : options.distinctUntilChanged) !== false) {
+            valueChanges$ = valueChanges$.pipe(distinctUntilChanged());
+        }
+        if (options === null || options === void 0 ? void 0 : options.emitInitial) {
+            handler(target.value);
+        }
+        return valueChanges$.subscribe(handler);
+    }
+}
+AntdFormService.ɵprov = ɵɵdefineInjectable({ factory: function AntdFormService_Factory() { return new AntdFormService(ɵɵinject(FormBuilder)); }, token: AntdFormService, providedIn: "root" });
+AntdFormService.decorators = [
+    { type: Injectable, args: [{ providedIn: "root" },] }
+];
+AntdFormService.ctorParameters = () => [
+    { type: FormBuilder }
+];
+
+/*
+ * Public API Surface of pro-table
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AntdFormService, DefaultPlatePrefixLoadService, PLATE_PREFIX_LOAD_SERVICE, PRO_TABLE_COLUMN_REMOTE, PRO_TABLE_DEFAULT_COLUMN, PRO_TABLE_DEFAULT_PROPS, ProTableComponent, ProTableModule, ɵ0, ɵ1, ɵ2, PageContainerModule as ɵa, PageContainerComponent as ɵb, TableSearchBarModule as ɵc, TableSearchBarComponent as ɵd, PlateInputModule as ɵe, PlateInputComponent as ɵf, ColmunsSettingComponent as ɵg, DynamicSearchFieldComponent as ɵh };
+//# sourceMappingURL=yibozhang-pro-table.js.map