@kengic/vue 0.30.1-beta.96 → 0.31.0

package/component/KgTable/KgTable.tsx

@@ -1,1105 +0,0 @@
-import { ____DEBUG____, ____ERROR____ } from '@kengic/core.core';
-import { notification, Pagination, Table, TablePaginationConfig, TableSummary } from 'ant-design-vue';
-import { Key } from 'ant-design-vue/es/_util/type';
-import { ColumnType } from 'ant-design-vue/es/table/interface';
-import { AlignType, RowClassName } from 'ant-design-vue/es/vc-table/interface';
-import { FilterValue, SorterResult, TableCurrentDataSource, TableRowSelection } from 'ant-design-vue/lib/table/interface';
-import { AxiosResponse, Method } from 'axios';
-import dayjs from 'dayjs';
-import { cloneDeep, isNil, last, map, uniq, without } from 'lodash-es';
-import { computed, defineComponent, ExtractPropTypes, inject, nextTick, onMounted, onUnmounted, PropType, reactive, ref, toRaw, watch } from 'vue';
-import { useKg } from '../../config';
-import { KG, KG__VAR_SUBMIT_CONFIG__DISPLAY_TYPE } from '../../model';
-import { httpClient } from '../../service';
-import { KgUtil } from '../../util';
-import { useKgVar } from '../KgVar';
-import {
-    emit,
-    IKgTable$EventListenerParameter$onAfterRequest,
-    IKgTable$EventListenerParameter$onBeforeParseRequestParameter,
-    IKgTable$EventListenerParameter$onBeforeRequest,
-    IKgTable$EventListenerParameter$onBeforeSetDatas,
-    IKgTable$EventListenerParameter$onBeforeTransformDatas,
-    IKgTable$EventListenerParameter$onReady,
-    IKgTable$EventListenerParameter$onRequestError,
-    IKgTable$EventListenerParameter$onRowDoubleClick,
-} from './KgTable.event';
-import { KgTableHeadCell } from './KgTable.HeadCell';
-import KgTableInfo from './KgTable.Info';
-import { IKgTableRequestParameter, IKgTableRow, KG_TABLE_TD_CHECK_WIDTH } from './KgTable.model';
-import { _useCacheScrollState, _useColumns, _useDatas, _useDragColumn, _useLoading, _useRenderBodyCell, _useResizeObserver } from './KgTable.service';
-import './KgTable.less';
-
-export const getProps = () => ({
-    /** 是否禁用某行的勾选框. */
-    kgIsCheckboxDisabled: Function as PropType<(row: any) => boolean>,
-
-    /** 是否禁用表格. */
-    kgDisabled: {
-        type: Boolean as PropType<boolean>,
-        default: undefined,
-    },
-
-    /** 设置行的样式类名. */
-    kgRowClassName: Function as PropType<RowClassName<any>>,
-});
-
-export type IKgTableProps = Partial<ExtractPropTypes<ReturnType<typeof getProps>>>;
-
-// 表格
-export default defineComponent({
-    name: 'KgTable',
-    props: getProps(),
-    setup(props) {
-        const $dayjs = inject('$dayjs', dayjs);
-        const kgSlots = inject(KG.DI.KG_VAR.KG_SLOTS, null);
-        const kgProps = inject(KG.DI.KG_VAR.KG_PROPS, null);
-
-        const kg = useKg();
-        const kgVar = useKgVar();
-
-        // 监听查询条件点击查询按钮,
-        kgVar.kgSearch.onSearch(async (param) => {
-            request(param);
-            return false;
-        });
-
-        kgVar.kgSearch.onReset(async () => {
-            // 重置排序
-            sorterInfo.value = undefined;
-
-            // 点击'重置'按钮时, 只是清空查询条件, 不会触发新的查询,
-            return false;
-        });
-
-        kgVar.kgTable.$onAction(async ({ name, args }) => {
-            switch (name) {
-                case 'setRowSelect': {
-                    const row: IKgTableRow = args[0];
-                    const selected: boolean = args[1];
-
-                    const id = row[kgVar.kgTable.idKey.value];
-
-                    switch (true) {
-                        // 当前未勾选该行, 现在要勾选该行
-                        case selected && !kgVar.kgTable.selectedRowKeyList.value.includes(id):
-                            onSelectAll([...kgVar.kgTable.selectedRowKeyList.value, id]);
-                            break;
-
-                        // 当前已勾选该行, 现在要取消勾选该行
-                        case !selected && kgVar.kgTable.selectedRowKeyList.value.includes(id):
-                            onSelectAll(without(kgVar.kgTable.selectedRowKeyList.value, id));
-                            break;
-                    }
-                    break;
-                }
-
-                case 'clearDatas': {
-                    kgVar.kgTable.setDatas({ datas: [] });
-                    pageParams.total = 0;
-
-                    // 清空勾选的行
-                    onRowClick({ isContinueWhenKgDisabled: true });
-                    // 重置展开的行
-                    expandedRowKeys.value = [];
-                    break;
-                }
-            }
-        });
-
-        //region DATA
-        //----------------------------------------------------------------------------------------------------
-        /**
-         * 当前是否按下了 SHIFT 键.
-         */
-        const isShiftKeyDown = ref(false);
-
-        const kgTableRef = ref<HTMLDivElement | null>(null);
-        /** 当前展开的行. */
-        const expandedRowKeys = ref<Array<string>>([]);
-        const { columns, filterInfo, sorterInfo, scrollX } = _useColumns(props);
-        const { isLoading } = _useLoading();
-        const { renderBodyCell } = _useRenderBodyCell();
-        _useCacheScrollState(kgTableRef);
-        _useResizeObserver(kgTableRef);
-        _useDragColumn(kgTableRef, columns);
-        const { transformDatas, requestDescriptionList } = _useDatas();
-
-        /**
-         * 接口地址.
-         */
-        const requestUrl$$ = computed<string | null>(() => kgVar.varButtonSearch.value?.cmd ?? null);
-
-        /**
-         * 接口方法.
-         */
-        const requestMethod$$ = computed<Method>(() => (kgVar.varButtonSearch.value?.cmd_method as any) ?? 'GET');
-
-        /**
-         * 接口参数.
-         */
-        const requestParams$$ = computed<Record<string, any>>(() => {
-            let params: Record<string, any> = {
-                column: (sorterInfo.value?.field ?? undefined) as any,
-                order: sorterInfo.value?.order === 'ascend' ? 'asc' : sorterInfo.value?.order === 'descend' ? 'desc' : undefined,
-
-                pageNo: pageParams.pageIndex,
-                pageSize: pageParams.pageSize,
-
-                ...(kgVar.kgSearch.formModel?.value ?? {}),
-
-                // 「查询按钮」中设置的查询参数
-                ...KgUtil.parseRequestParamsToJSON(kgVar.varButtonSearch.value?.cmd_prm ?? ''),
-
-                // 「表格配置」中设置的查询参数
-                ...KgUtil.parseRequestParamsToJSON(kgVar.varGridConfig.value?.cmd_prm ?? ''),
-
-                ...parentRequestParamRecord$$.value,
-            };
-
-            // 将排序字段转换为 snake_case 命名方式
-            if (kgVar.varGridConfig.value?.convert_sort_field_to_under_score_flg === 1 && params.column) {
-                params.column = KgUtil.snakeCase(params.column);
-            }
-
-            return params;
-        });
-
-        /**
-         * 父亲界面接口参数.
-         */
-        const parentRequestParamRecord$$ = computed<Record<string, any>>(() => {
-            let paramRecord: Record<string, any> = {};
-
-            // 父子界面关联属性
-            if (kgVar.parentKgVar$$.value) {
-                const varChildDetail = kgVar.parentKgVar$$.value?.varChildDetails?.value?.find((i) => i.child_form_id === kgVar.fid);
-                const foreignKeyRecord = KgUtil.tryParseJSON(varChildDetail?.foreign_keys);
-
-                Object.keys(foreignKeyRecord).forEach((parentKey) => {
-                    paramRecord[foreignKeyRecord[parentKey]] = kgVar.parentKgVar$$.value?.kgTable?.selectedRow?.value?.[parentKey] ?? KG.__KG__NULL__;
-                });
-            }
-
-            return paramRecord;
-        });
-
-        /**
-         * 组件参数「是否禁用表格」.
-         */
-        const kgIsDisabled$$ = computed<boolean | undefined>(() => {
-            if (!isNil((kgProps?.value ?? kgVar.props.value)?.KgTable?.kgDisabled)) {
-                return (kgProps?.value ?? kgVar.props.value)?.KgTable?.kgDisabled;
-            }
-
-            if (!isNil(props.kgDisabled)) {
-                return props.kgDisabled;
-            }
-
-            return undefined;
-        });
-
-        /**
-         * 组件参数「是否禁用某行的勾选框」.
-         */
-        const kgIsCheckboxDisabled$$ = computed<((row: any) => boolean) | undefined>(() => {
-            if (!isNil((kgProps?.value ?? kgVar.props.value)?.KgTable?.kgIsCheckboxDisabled)) {
-                return (kgProps?.value ?? kgVar.props.value)?.KgTable?.kgIsCheckboxDisabled;
-            }
-
-            if (!isNil(props.kgIsCheckboxDisabled)) {
-                return props.kgIsCheckboxDisabled;
-            }
-
-            if (kgVar.varGridConfig$Props$$.value?.isCheckboxDisabled) {
-                return new Function('row', `try{ ${kgVar.varGridConfig$Props$$.value?.isCheckboxDisabled} } catch (e) { console.error(e); }`) as any;
-            }
-
-            return undefined;
-        });
-        const isBottomLeftDisabled = computed<boolean>(() => !!kgIsDisabled$$.value || isLoading.value || !!kgVar.isCreating.value || !!kgVar.isUpdating.value || !!kgVar.isCopying.value || !!kgVar.isDeleting.value);
-        const isBottomRightDisable$$ = computed<boolean>(
-            () => !!kgIsDisabled$$.value || isLoading.value || !!kgVar.isCreating.value || !!kgVar.isUpdating.value || !!kgVar.isCopying.value || !!kgVar.isDeleting.value || pageParams.total === 0,
-        );
-        /** 是否显示行展开图标这一列.  */
-        const isShowExpandColumn = computed<boolean>(() => !!(kgSlots ?? kgVar.slots.value)?.KgTable?.expandedRowRender);
-
-        /**
-         * 是否显示勾选框这一列.
-         */
-        const isShowCheckColumn$$ = computed<boolean>(() => kgVar.varGridConfig.value?.show_check_column_flg === 1);
-        /** 行勾选的配置. */
-        const rowSelection = computed<TableRowSelection<IKgTableRow> | undefined>(() => {
-            if (!isShowCheckColumn$$.value) {
-                return undefined;
-            }
-
-            return {
-                fixed: 'left',
-                columnWidth: KG_TABLE_TD_CHECK_WIDTH,
-                hideSelectAll: !kgVar.kgTable.isMultiSelect.value,
-                selectedRowKeys: kgVar.kgTable.selectedRowKeyList.value,
-                preserveSelectedRowKeys: false,
-                getCheckboxProps: (row: IKgTableRow) => {
-                    return {
-                        disabled: !!kgIsDisabled$$.value || !!kgVar.isCreating.value || !!kgVar.isUpdating.value || !!kgVar.isCopying.value || !!kgVar.isDeleting.value || !!kgIsCheckboxDisabled$$.value?.(row),
-                    };
-                },
-                onSelect: (value) => onSelect(value),
-                onChange: (selectedRowKeys) => kgVar.kgTable.isMultiSelect.value && onSelectAll(selectedRowKeys),
-            };
-        });
-
-        const class$$ = computed(() => {
-            let _class = 'kg-table';
-
-            if (kgVar.varGridConfig.value?.show_bottom_border_flg === 1) {
-                _class += ' kg-table--bottom-border';
-            }
-
-            if (!kgVar.kgTable.isShowBottomLeft.value && !kgVar.kgTable.isShowBottomRight.value) {
-                _class += ' kg-table--no-bottom';
-            }
-
-            // 正在进行表格内的表单提交
-            if (kgVar.kgSubmit.currentVarSubmitConfig$DisplayType.value === KG__VAR_SUBMIT_CONFIG__DISPLAY_TYPE.TABLE) {
-                _class += ' kg-table--submitting';
-            }
-
-            switch (kgVar.kgTable.getRowHeight) {
-                case 'L':
-                    _class += ' kg-table--row-low';
-                    break;
-                case 'M':
-                    _class += ' kg-table--row-medium';
-                    break;
-                case 'H':
-                    _class += ' kg-table--row-high';
-                    break;
-            }
-
-            if (isShiftKeyDown.value) {
-                _class += ' kg-table--is-shift-keydown';
-            }
-
-            if (kgVar.varGridConfig$Props$$.value?.isVisible === false) {
-                _class += ' kg-table--invisible';
-            }
-
-            return _class;
-        });
-        const kgTableButtomClass$$ = computed(() => {
-            let _class = 'kg-table-bottom';
-
-            if (kgVar.varGridConfig.value?.show_bottom_border_flg === 1) {
-                _class += ' kg-table-bottom--border';
-            }
-
-            return _class;
-        });
-        /** 分页参数. */
-        const pageParams = reactive({
-            pageIndex: 1,
-            pageSize: 10,
-            total: 0,
-        });
-        //endregion
-
-        //region WATCH
-        //----------------------------------------------------------------------------------------------------
-        //region pg_size_opt
-        //----------------------------------------------------------------------------------------------------
-        // 根据 VarGridConfig.pg_size_opt 设置 pageParams.pageSize 的初始值
-        const stopWatchPageSizeOption = watch(
-            kgVar.kgTable.pageSizeOption,
-            (pageSizeOption) => {
-                if (pageSizeOption) {
-                    setTimeout(() => stopWatchPageSizeOption());
-                    pageParams.pageSize = pageSizeOption;
-                    emit<IKgTable$EventListenerParameter$onReady>({ event: 'onReady', id: kgVar.fid, parameter: {} });
-                    kgVar.kgTable.setIsReady(true);
-                }
-            },
-            { immediate: true },
-        );
-        //endregion
-
-        //region pg_size_opts
-        //----------------------------------------------------------------------------------------------------
-        // 当 VarGridConfig.pg_size_opts 发生变更, 并且当前的 pageParams.pageSize 不在 pg_size_opts 列表中,
-        // 则更新 pageParams.pageSize 为 VarGridConfig.pg_size_opt 的值
-        watch(kgVar.kgTable.pageSizeOptions, (pageSizeOptions) => {
-            if (pageSizeOptions.length > 0 && !pageSizeOptions.includes(pageParams.pageSize)) {
-                pageParams.pageSize = kgVar.kgTable.pageSizeOption.value;
-            }
-        });
-        //endregion
-
-        //region 自动查询
-        //----------------------------------------------------------------------------------------------------
-        // 启用了自动查询, 且尚未查询过, 则自动查询
-        watch(
-            [kgVar.kgTable.isAutoRequest, kgVar.kgSearch.isReady, () => kgVar.kgTable.isRequested],
-            ([isAutoRequest, isReady, isRequested]) => {
-                if (isAutoRequest && isReady && !isRequested) {
-                    request({ isSearchFirstPage: true });
-                }
-            },
-            { immediate: true },
-        );
-        //endregion
-
-        //region 父亲界面接口参数,
-        //----------------------------------------------------------------------------------------------------
-        watch(
-            () => JSON.stringify(parentRequestParamRecord$$.value),
-            () => {
-                // 父子界面关联属性发生变更, 触发查询,
-                request({ isSearchFirstPage: true });
-            },
-        );
-        //endregion
-
-        //region 同步查询条件到状态管理
-        //----------------------------------------------------------------------------------------------------
-        watch(
-            requestParams$$,
-            (value) => {
-                kgVar.kgTable.setRequestParams(value);
-            },
-            { immediate: true },
-        );
-        //endregion
-
-        //region isCreating
-        //----------------------------------------------------------------------------------------------------
-        watch(kgVar.isCreating, (value, oldValue) => {
-            if (value === true) {
-                startCreating();
-            } else if (value === false && oldValue === true) {
-                stopCreating();
-            }
-        });
-        //endregion
-        //endregion
-
-        //region FUNCTION
-        //----------------------------------------------------------------------------------------------------
-        /**
-         * 按下 SHIFT 键时, 为了避免跟多选功能冲突, 禁用文本选中.
-         */
-        function onWindowKeyDown(event: KeyboardEvent) {
-            if (event.shiftKey) {
-                isShiftKeyDown.value = true;
-            }
-        }
-
-        /**
-         * 按下 SHIFT 键时, 为了避免跟多选功能冲突, 禁用文本选中.
-         */
-        function onWindowKeyUp(event: KeyboardEvent) {
-            if (!event.shiftKey) {
-                isShiftKeyDown.value = false;
-            }
-        }
-
-        /** 开始创建. */
-        function startCreating() {
-            // 表格内创建时, 则添加一行用于创建的空白行,
-            if (kgVar.kgSubmit.currentVarSubmitConfig$DisplayType.value === KG__VAR_SUBMIT_CONFIG__DISPLAY_TYPE.TABLE) {
-                const row = { [kgVar.kgTable.idKey.value]: KG.__KG__TABLE_TEMP_ID__ };
-                kgVar.kgTable.setDatas({ datas: [row, ...kgVar.kgTable.dataList] });
-                kgVar.kgTable.setSelectedRows({ selectedRows: [row] });
-            }
-        }
-
-        /** 结束创建. */
-        function stopCreating() {
-            // 移除用于创建的空白行
-            const row = kgVar.kgTable.dataList.find((i) => i[kgVar.kgTable.idKey.value] === KG.__KG__TABLE_TEMP_ID__);
-            if (row) {
-                kgVar.kgTable.setDatas({ datas: without(kgVar.kgTable.dataList, row) });
-                kgVar.kgTable.setSelectedRows({ selectedRows: [] });
-            }
-        }
-
-        /**
-         * 单击某行.
-         *
-         * @param param.event 鼠标点击事件.
-         * @param param.row 单击的行.
-         * @param param.isContinueWhenKgDisabled 当表格禁用时, 是否继续执行.
-         */
-        function onRowClick(param: { event?: MouseEvent; row?: IKgTableRow; isContinueWhenKgDisabled?: boolean } = {}) {
-            ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | 进入方法`, { param });
-            const { event, row, isContinueWhenKgDisabled = false } = param;
-
-            const selection = document.getSelection();
-            if (selection?.type === 'Range') {
-                // 禁用「SHIFT + 鼠标单击, 用于框选文本范围」功能, 因为会跟 SHIFT 多选功能冲突,
-                if (event?.shiftKey) {
-                    ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | 按住了 SHIFT 键, 因此清空选择的文本.`, { param });
-                    // 按住 SHIFT 键时, 清空选中的文本,
-                    selection.removeAllRanges();
-                } else {
-                    ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | 通过鼠标左键拖拽选择文本.`, { param });
-                    // 「通过鼠标左键拖拽选择文本」, 不属于单击事件, 不进行行勾选,
-                    return;
-                }
-            }
-
-            // 表格禁用/正在创建/正在更新/正在复制/正在删除
-            if ((!isContinueWhenKgDisabled && !!kgIsDisabled$$.value) || kgVar.isCreating.value || kgVar.isUpdating.value || kgVar.isCopying.value || kgVar.isDeleting.value) {
-                ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | 表格禁用/正在增删改复.`, { param });
-                return;
-            }
-
-            // 不支持行勾选
-            if (!rowSelection.value) {
-                ____DEBUG____(`KgTable | onRowClick() | 不支持行勾选.`);
-                return;
-            }
-
-            // 参数 row 为空, 表示清空所有勾选的行,
-            if (!row) {
-                ____DEBUG____(`KgTable | onRowClick() | 清空所有勾选的行.`);
-                kgVar.kgTable.setSelectedRows({ selectedRows: [] });
-                return;
-            }
-
-            // 禁用勾选,
-            if (kgIsCheckboxDisabled$$.value?.(row)) {
-                return;
-            }
-
-            switch (event?.detail) {
-                // UIEvent.detail 为 1, 表示这是单击事件
-                case 1:
-                    switch (kgVar.varGridConfig.value?.operation_on_row_click) {
-                        // 不做操作
-                        case 0:
-                            ____DEBUG____(`KgTable | onRowClick() | 不做操作.`, { VarGridConfig: kgVar.varGridConfig.value });
-                            break;
-
-                        // 如果该行当前未勾选, 则将该行勾选, 其他的行会取消勾选,
-                        // 如果该行当前已勾选, 则不做任何操作,
-                        case 1: {
-                            switch (kgVar.kgTable.isMultiSelect.value) {
-                                // 多选
-                                case true: {
-                                    const idKey = kgVar.kgTable.idKey.value;
-
-                                    switch (true) {
-                                        case event?.shiftKey: {
-                                            // 按住 SHIFT 键多选时, 需要勾选「上次勾选的行」和「本次勾选的行」之间的所有行, 因此先找出「上次勾选的行」,
-                                            const lastSelectedRow = last(kgVar.kgTable.selectedRows.value);
-                                            if (lastSelectedRow) {
-                                                const lastIndex = kgVar.kgTable.dataList.findIndex((i) => i[idKey] === lastSelectedRow[idKey]);
-                                                const currentIndex = kgVar.kgTable.dataList.findIndex((i) => i[idKey] === row[idKey]);
-
-                                                // 「上次勾选的行」和「本次勾选的行」是同一行, 不做操作,
-                                                if (lastIndex === currentIndex) {
-                                                } else {
-                                                    const fromIndex = Math.min(lastIndex, currentIndex);
-                                                    const toIndex = Math.max(lastIndex, currentIndex);
-
-                                                    // 将「本次勾选的行」放在最后, 变成下一次的「上次勾选的行」,
-                                                    kgVar.kgTable.setSelectedRows({ selectedRows: [...kgVar.kgTable.dataList.filter((i, index) => index >= fromIndex && index <= toIndex && i[idKey] !== row[idKey]), row] });
-                                                }
-                                            } else {
-                                                kgVar.kgTable.setSelectedRows({ selectedRows: [row] });
-                                            }
-                                            break;
-                                        }
-
-                                        case event?.ctrlKey:
-                                        case event?.metaKey: {
-                                            // 该行当前已经勾选
-                                            if (kgVar.kgTable.selectedRowKeyList.value.includes(row[idKey])) {
-                                                ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | CTRL 移除一行勾选.`, { row: row });
-                                                kgVar.kgTable.setSelectedRowKeys(without(kgVar.kgTable.selectedRowKeyList.value, row[idKey]));
-                                            }
-                                            // 该行当前尚未勾选
-                                            else {
-                                                ____DEBUG____(`${kgVar.fid} | KgTable | onRowClick() | CTRL 添加一行勾选.`, { row: row });
-                                                kgVar.kgTable.setSelectedRowKeys([...(kgVar.kgTable.selectedRowKeyList.value ?? []), row[idKey]]);
-                                            }
-
-                                            break;
-                                        }
-
-                                        // 只勾选当前行
-                                        case !event?.shiftKey && !event?.ctrlKey: {
-                                            kgVar.kgTable.setSelectedRows({ selectedRows: [row] });
-                                            break;
-                                        }
-                                    }
-                                    break;
-                                }
-
-                                // 单选
-                                case false: {
-                                    kgVar.kgTable.setSelectedRows({ selectedRows: [row] });
-                                    break;
-                                }
-                            }
-
-                            break;
-                        }
-                        // 如果该行当前未勾选, 则将该行添加到勾选列表,
-                        // 如果该行当前已勾选, 则将该行从勾选列表移除,
-                        // 相当于单击了该行前面的勾选控件,
-                        case 2:
-                            onSelect(row);
-                            break;
-
-                        default:
-                            break;
-                    }
-
-                    break;
-
-                // UIEvent.detail 为 2, 表示这是双击事件
-                case 2:
-                    emit<IKgTable$EventListenerParameter$onRowDoubleClick>({ event: 'onRowDoubleClick', id: kgVar.fid, parameter: { row: row } });
-                    break;
-            }
-        }
-
-        /**
-         * 查询表格数据.
-         */
-        function request(param: IKgTableRequestParameter = {}) {
-            ____DEBUG____(`${kgVar.fid} | KgTable | request() | 进入方法`, { param });
-            const stopWatch = watch(
-                kgVar.kgTable.isReady,
-                (isReady) => {
-                    if (isReady) {
-                        setTimeout(() => stopWatch());
-                        requestDataList();
-                    }
-                },
-                { immediate: true },
-            );
-
-            /**
-             * 查询表格列表数据.
-             */
-            async function requestDataList() {
-                ____DEBUG____(`${kgVar.fid} | KgTable | request().requestDataList() | 进入方法`);
-                if (param.isSearchFirstPage) {
-                    pageParams.pageIndex = 1;
-                }
-
-                kgVar.kgTable.setIsRequesting(true);
-
-                try {
-                    const response$ = ref<any>({});
-                    const unparsedRequestParams = cloneDeep(toRaw(requestParams$$.value));
-
-                    const dynamicQueryOperatorModel$ = ref(null);
-
-                    const eventResult$onBeforeParseRequestParameter = await emit<IKgTable$EventListenerParameter$onBeforeParseRequestParameter>({
-                        event: 'onBeforeParseRequestParameter',
-                        id: kgVar.fid,
-                        parameter: { dynamicQueryOperatorModel: dynamicQueryOperatorModel$, dynamicQueryOperatorModel$: dynamicQueryOperatorModel$, params: unparsedRequestParams },
-                    });
-
-                    /**
-                     * 如果某个参数的值为 {@link KG.__KG__NULL__}, 则无需再请求后端接口, 直接清空表格数据即可.
-                     */
-                    if (map(unparsedRequestParams, (i: any) => String(i)).includes(KG.__KG__NULL__)) {
-                        kgVar.kgTable.clearDatas();
-                        kgVar.kgTable.setIsRequesting(false);
-                        return;
-                    }
-
-                    const requestParamRecord = KgUtil.parseParams(unparsedRequestParams, kgVar.kgTable.kgSearchFid$$.value, $dayjs);
-                    let requestHeaderRecord: Record<string, any> = {};
-
-                    const eventResult$onBeforeRequest = await emit<IKgTable$EventListenerParameter$onBeforeRequest>({
-                        event: 'onBeforeRequest',
-                        id: kgVar.fid,
-                        parameter: { params: requestParamRecord, response: response$, response$: response$ },
-                    });
-
-                    if (eventResult$onBeforeRequest) {
-                        // 表格数据由外部提供, 不需要调用查询接口去获取
-                    } else {
-                        if (!requestUrl$$.value) {
-                            ____ERROR____(`${kgVar.fid} | KgTable | request() | 查询按钮没有配置接口.`, {
-                                VarButton: kgVar.varButtonSearch.value,
-                            });
-                            throw new Error('查询按钮没有配置接口.');
-                        }
-
-                        // 是否启用高级查询
-                        const isDynamicQuery = kg.option.KgSearch?.dynamicQuery?.on === true && kgVar.kgSearch.currentVarProfileMaster.value?.dyn_flg === 1;
-
-                        const { whereSql, whereSql01, whereSql02, whereSql03, whereSql04, whereSql05, orderBySql, operatorObjectJSON, whereObjectJSON } = KgUtil.getQueryHeaders({
-                            $dayjs: $dayjs,
-                            dynamicQueryOperatorModel: dynamicQueryOperatorModel$.value,
-                            formID: kgVar.fid,
-                            kgSearchFormID: kgVar.kgTable.kgSearchFid$$.value,
-                            params: unparsedRequestParams,
-                        });
-
-                        requestHeaderRecord = {
-                            [KG.HTTP_HEADER__KG_FORM_ID]: kgVar.fid,
-                            [KG.HTTP_HEADER__KG_IS_DYNAMIC_QUERY]: isDynamicQuery,
-                            [KG.HTTP_HEADER__KG_PAGE_INDEX]: requestParamRecord.pageNo,
-                            [KG.HTTP_HEADER__KG_PAGE_SIZE]: requestParamRecord.pageSize,
-                            [KG.HTTP_HEADER__KG_QUERY_OBJECT]: '{}',
-                            [KG.HTTP_HEADER__KG_QUERY_OPERATOR_OBJECT]: operatorObjectJSON,
-                            [KG.HTTP_HEADER__KG_QUERY_ORDER_BY_SQL]: orderBySql,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_OBJECT]: whereObjectJSON,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL]: whereSql,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL_01]: whereSql01,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL_02]: whereSql02,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL_03]: whereSql03,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL_04]: whereSql04,
-                            [KG.HTTP_HEADER__KG_QUERY_WHERE_SQL_05]: whereSql05,
-                        };
-
-                        let axiosResponse: { value: AxiosResponse<any> } = { value: {} as AxiosResponse<any> };
-                        try {
-                            axiosResponse.value = await httpClient().request(
-                                {
-                                    data: requestParamRecord,
-                                    headers: requestHeaderRecord,
-                                    method: requestMethod$$.value,
-                                    params: { formId: kgVar.fid, ...requestParamRecord },
-                                    url: requestUrl$$.value,
-                                },
-                                {
-                                    isReturnNativeResponse: true,
-                                    successMessageMode: 'none',
-                                },
-                            );
-                        } catch (e) {
-                            const eventResult$onRequestError = await emit<IKgTable$EventListenerParameter$onRequestError>({
-                                event: 'onRequestError',
-                                id: kgVar.fid,
-                                parameter: { axiosResponse: axiosResponse.value, e: e as Error },
-                            });
-                            if (eventResult$onRequestError) {
-                                // 继续后续逻辑,
-                            } else {
-                                // 重新抛出错误,
-                                throw e;
-                            }
-                        }
-
-                        // 请求没有返回数据
-                        if (!axiosResponse.value?.data) {
-                            notification.error({ message: kg.t('kg.KgTable.request-fail-no-data') });
-                            throw new Error(kg.t('kg.KgTable.request-fail-no-data'));
-                        }
-
-                        // 请求失败
-                        if (![0, 200].includes(axiosResponse.value.data.code ?? -1) || ('success' in axiosResponse.value.data && !axiosResponse.value.data.success)) {
-                            notification.error({ message: axiosResponse.value.data.message || kg.t('kg.KgTable.request-fail-error') });
-                            throw new Error(axiosResponse.value.data.message || kg.t('kg.KgTable.request-fail-error'));
-                        }
-
-                        if ('result' in axiosResponse.value.data) {
-                            response$.value = axiosResponse.value.data.result;
-                        } else if ('data' in axiosResponse.value.data) {
-                            response$.value = axiosResponse.value.data.data;
-                        }
-
-                        // prettier-ignore
-                        ____DEBUG____(`${kgVar.fid} | KgTable | request().requestDataList() | 查询成功`, { params: requestParamRecord, response: response$.value });
-                    }
-
-                    const eventResult$onBeforeTransformDatas = await emit<IKgTable$EventListenerParameter$onBeforeTransformDatas>({
-                        event: 'onBeforeTransformDatas',
-                        id: kgVar.fid,
-                        parameter: { response: response$ },
-                    });
-                    if (eventResult$onBeforeTransformDatas) {
-                        return;
-                    }
-
-                    const { datas, total } = transformDatas(response$);
-
-                    const eventResult$onBeforeSetDatas = await emit<IKgTable$EventListenerParameter$onBeforeSetDatas>({
-                        event: 'onBeforeSetDatas',
-                        id: kgVar.fid,
-                        parameter: { dataList$: datas, datas: datas, params: unparsedRequestParams, total: total },
-                    });
-                    if (eventResult$onBeforeSetDatas) {
-                        return;
-                    }
-
-                    // 记录旧的勾选的行
-                    const oldSelectedRowKeys = cloneDeep(toRaw(kgVar.kgTable.selectedRowKeyList.value));
-
-                    // 设置表格列表数据
-                    kgVar.kgTable.setDatas({ datas: datas.value, isPreserveSelectedRows: true });
-                    // 设置表格数据总数
-                    pageParams.total = total.value;
-
-                    // 请求系统描述数据
-                    requestDescriptionList();
-
-                    // 清空过滤状态
-                    filterInfo.value = {};
-                    // 清空勾选的行
-                    onRowClick({ isContinueWhenKgDisabled: true });
-                    // 清空展开的行
-                    expandedRowKeys.value = (() => {
-                        let _expandedRowKeys: Array<string> = [];
-
-                        // 默认展开全部的行, TODO LT
-                        if (false) {
-                            const fn = (_datas: Array<any>) => {
-                                for (let data of _datas) {
-                                    _expandedRowKeys.push(data[kgVar.kgTable.idKey.value]);
-
-                                    if (data.children && data.children.length > 0) {
-                                        fn(data.children);
-                                    }
-                                }
-                            };
-
-                            fn(datas.value);
-                        }
-
-                        return _expandedRowKeys;
-                    })();
-
-                    await nextTick();
-
-                    // 恢复查询之前行的勾选状态
-                    if (param.isPreserveSelectedRows) {
-                        kgVar.kgTable.setSelectedRowKeys(oldSelectedRowKeys);
-                    }
-                    // 勾选首行
-                    else if (kgVar.varGridConfig.value?.check_first_row_after_retrieve === 1) {
-                        if (datas.value.length > 0) {
-                            kgVar.kgTable.setSelectedRows({ selectedRows: [datas.value[0]] });
-                        }
-                    }
-                    // 恢复查询之前行的勾选状态
-                    else if (kgVar.varButtonSearch.value?.re_select_after_reload_flg !== 0) {
-                        kgVar.kgTable.setSelectedRowKeys(oldSelectedRowKeys);
-                    }
-                    // 清空勾选,
-                    else {
-                        kgVar.kgTable.setSelectedRowKeys([]);
-                    }
-
-                    const eventResult$onAfterRequest = await emit<IKgTable$EventListenerParameter$onAfterRequest>({
-                        event: 'onAfterRequest',
-                        id: kgVar.fid,
-                        parameter: {
-                            datas: datas,
-                            params: requestParamRecord,
-                            requestHeaderRecord: requestHeaderRecord,
-                            response: response$.value,
-                        },
-                    });
-
-                    kgVar.kgTable.setIsRequested(true);
-                } catch (e) {
-                    throw e;
-                } finally {
-                    kgVar.kgTable.setIsRequesting(false);
-                }
-            }
-        }
-
-        /** 全选. */
-        function onSelectAll(keys: Array<Key>) {
-            kgVar.kgTable.setSelectedRows({ selectedRows: keys.map((i) => kgVar.kgTable.dataList?.find((j) => j[kgVar.kgTable.idKey.value] === i)!).filter((i) => !!i) });
-        }
-
-        /**
-         * 单击勾选控件.
-         */
-        function onSelect(row: IKgTableRow) {
-            // 禁用勾选,
-            if (kgIsCheckboxDisabled$$.value?.(row)) {
-                return;
-            }
-
-            const idKey = kgVar.kgTable.idKey.value;
-            const id = row[idKey]!;
-
-            switch (kgVar.kgTable.isMultiSelect.value) {
-                // 多选
-                case true: {
-                    if (kgVar.kgTable.selectedRowKeyList.value.includes(id)) {
-                        kgVar.kgTable.setSelectedRowKeys(without(kgVar.kgTable.selectedRowKeyList.value, id));
-                    } else {
-                        kgVar.kgTable.setSelectedRowKeys([...(kgVar.kgTable.selectedRowKeyList.value ?? []), id]);
-                    }
-
-                    break;
-                }
-
-                // 单选
-                case false: {
-                    if (kgVar.kgTable.selectedRowKeyList.value?.includes(id)) {
-                        kgVar.kgTable.setSelectedRowKeys([]);
-                    } else {
-                        kgVar.kgTable.setSelectedRowKeys([id]);
-                    }
-
-                    break;
-                }
-            }
-        }
-
-        /**
-         * 拖动列宽.
-         *
-         * @param width 新的宽度.
-         * @param column 列.
-         */
-        function onTableResizeColumn(width: number, column: ColumnType) {
-            column.width = Number(width.toFixed(2));
-            kgVar.patchVarGridDetail({ properties: { width: width.toFixed(2) }, varName: column.dataIndex as any });
-        }
-
-        /**
-         * 分页/过滤/排序发生变更.
-         *
-         * @param pagination 分页.
-         * @param filters 过滤.
-         * @param sorter 排序.
-         * @param extra
-         */
-        async function onTableChange(pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<IKgTableRow> | SorterResult<IKgTableRow>[], extra: TableCurrentDataSource<IKgTableRow>) {
-            switch (extra.action) {
-                case 'sort': {
-                    if (!(sorter as SorterResult<any>).order) {
-                        sorterInfo.value = { field: undefined, order: undefined };
-                    } else {
-                        sorterInfo.value = sorter as SorterResult<any>;
-                    }
-
-                    await nextTick();
-
-                    request({ isSearchFirstPage: true });
-
-                    break;
-                }
-
-                case 'filter': {
-                    filterInfo.value = filters;
-                    break;
-                }
-            }
-        }
-
-        /**
-         * 点击展开图标.
-         *
-         * @param expanded 是否展开.
-         * @param row 行.
-         */
-        function onTableExpand(expanded: boolean, row: IKgTableRow) {
-            const key = row[kgVar.kgTable.idKey.value];
-
-            switch (kgVar.varGridConfig.value?.expand_accordion_flg) {
-                case 0:
-                    if (expanded) {
-                        expandedRowKeys.value = uniq([...expandedRowKeys.value, key]);
-                    } else {
-                        expandedRowKeys.value = without(expandedRowKeys.value, key);
-                    }
-                    break;
-
-                default:
-                    if (expanded) {
-                        expandedRowKeys.value = [key];
-                    } else {
-                        expandedRowKeys.value = [];
-                    }
-                    break;
-            }
-        }
-
-        /** 分页参数发生变更. */
-        function onPageChange(pageIndex: number, pageSize: number) {
-            if (pageSize !== pageParams.pageSize) {
-                pageParams.pageIndex = 1;
-                pageParams.pageSize = pageSize;
-            } else {
-                pageParams.pageIndex = pageIndex;
-            }
-
-            request();
-        }
-
-        /** 渲染表头的单元格. */
-        function renderHeaderCell(param: { column: ColumnType }) {
-            const { column } = param;
-
-            return (
-                <KgTableHeadCell
-                    column={column}
-                    kgDisabled={kgIsDisabled$$.value}
-                />
-            );
-        }
-
-        /** 渲染底部概要. */
-        function renderSummary() {
-            if (!(kgSlots ?? kgVar.slots.value)?.KgTable?.['summary.bodyCell']) {
-                return null;
-            }
-
-            return (
-                <TableSummary fixed={'bottom'}>
-                    <TableSummary.Row>
-                        {isShowExpandColumn.value && <TableSummary.Cell index={0} />}
-                        {isShowCheckColumn$$.value && <TableSummary.Cell index={isShowExpandColumn.value ? 1 : 0} />}
-                        {columns.value.map((column, index) => {
-                            const vname = String((column as ColumnType<any>).dataIndex);
-                            const varGridDetail = vname ? kgVar.getVarGridDetail({ varName: vname }) : null;
-
-                            const align: AlignType = (() => {
-                                if (!['left', 'center', 'right'].includes(varGridDetail?.align || '')) {
-                                    return 'left';
-                                }
-
-                                return varGridDetail?.align as AlignType;
-                            })();
-
-                            let _index = index;
-                            if (isShowExpandColumn.value && isShowCheckColumn$$.value) {
-                                _index += 2;
-                            } else if (isShowExpandColumn.value || isShowCheckColumn$$.value) {
-                                _index += 1;
-                            }
-
-                            return (
-                                <TableSummary.Cell
-                                    index={_index}
-                                    align={align}
-                                >
-                                    {(kgSlots ?? kgVar.slots.value)?.KgTable?.['summary.bodyCell']?.({
-                                        column,
-                                        index: _index,
-                                        varGridDetail,
-                                    })}
-                                </TableSummary.Cell>
-                            );
-                        })}
-                    </TableSummary.Row>
-                </TableSummary>
-            );
-        }
-
-        /** 渲染暂无数据. */
-        function renderEmptyText() {
-            // 未启用自动查询, 且尚未查询过, 则提示需要手动查询
-            if (!kgVar.kgTable.isAutoRequest.value && !kgVar.kgTable.isRequested) {
-                return kg.t('kg.KgTable.emptyText');
-            } else {
-                return kg.t('kg.emptyText');
-            }
-        }
-        //endregion
-
-        //region LIFECYCLE
-        //----------------------------------------------------------------------------------------------------
-        onMounted(() => {
-            window.addEventListener('keydown', onWindowKeyDown);
-            window.addEventListener('keyup', onWindowKeyUp);
-        });
-
-        onUnmounted(() => {
-            kgVar.kgTable.dispose();
-
-            window.removeEventListener('keydown', onWindowKeyDown);
-            window.removeEventListener('keyup', onWindowKeyUp);
-        });
-        //endregion
-
-        return () => (
-            <div
-                class={class$$.value}
-                kg-form-id={kgVar.fid}
-                ref={kgTableRef}
-            >
-                <Table
-                    class="kg-flex-table"
-                    size={'small'}
-                    scroll={{ x: scrollX.value, y: 'auto' }}
-                    bordered={kgVar.varGridConfig$Props$$.value?.bordered === true}
-                    pagination={false}
-                    showSorterTooltip={false}
-                    indentSize={17}
-                    columns={columns.value}
-                    dataSource={kgVar.kgTable.dataList}
-                    loading={isLoading.value}
-                    rowKey={kgVar.kgTable.idKey.value}
-                    rowClassName={(kgProps?.value ?? kgVar.props.value)?.KgTable?.kgRowClassName}
-                    expandColumnWidth={28}
-                    expandedRowKeys={expandedRowKeys.value}
-                    rowSelection={rowSelection.value}
-                    customRow={(row: IKgTableRow) => ({
-                        onClick: (event) => onRowClick({ event, row }),
-                    })}
-                    // @ts-ignore
-                    onResizeColumn={onTableResizeColumn}
-                    onChange={onTableChange}
-                    onExpand={onTableExpand}
-                >
-                    {{
-                        headerCell: renderHeaderCell,
-                        bodyCell: renderBodyCell,
-                        emptyText: renderEmptyText,
-                        expandedRowRender: (kgSlots ?? kgVar.slots.value)?.KgTable?.expandedRowRender,
-                        summary: renderSummary,
-                    }}
-                </Table>
-
-                {(kgVar.kgTable.isShowBottomLeft.value || kgVar.kgTable.isShowBottomRight.value) && (
-                    <div class={kgTableButtomClass$$.value}>
-                        <div class="left">
-                            {kgVar.kgTable.isShowBottomLeft.value && (
-                                <KgTableInfo
-                                    kgShowClearCheck={kgVar.kgTable.selectedRowKeyList.value.length > 0}
-                                    kgShowClearTable={pageParams.total > 0}
-                                    kgShowLocate={kgVar.kgTable.selectedRowKeyList.value.length > 0}
-                                    kgTotal={kgVar.kgTable.selectedRowKeyList.value.length}
-                                    kgDisabled={isBottomLeftDisabled.value}
-                                />
-                            )}
-                        </div>
-
-                        <div class="right">
-                            {kgVar.kgTable.isShowBottomRight.value && (
-                                <Pagination
-                                    size={'default'}
-                                    current={pageParams.pageIndex}
-                                    pageSize={pageParams.pageSize}
-                                    pageSizeOptions={kgVar.kgTable.pageSizeOptions.value.map((i) => String(i))}
-                                    total={pageParams.total}
-                                    showSizeChanger={true}
-                                    showQuickJumper={false}
-                                    hideOnSinglePage={false}
-                                    disabled={isBottomRightDisable$$.value}
-                                    locale={{ page: '' }}
-                                    showTotal={(total, range) =>
-                                        kg.t('kg.KgTable.totalText', {
-                                            from: range[0],
-                                            to: range[1],
-                                            total: total,
-                                        })
-                                    }
-                                    onChange={(pageIndex, pageSize) => onPageChange(pageIndex, pageSize)}
-                                />
-                            )}
-                        </div>
-                    </div>
-                )}
-            </div>
-        );
-    },
-});