@cloudbase/weda-ui 3.4.11 → 3.4.13

package/dist/web/components/wd-switch/wd-switch.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { usePlatform } from '../../utils/platform';
+import { WdFormItem } from '../wd-form-item';
+import getLocalCounter from '../../utils/getLocalCounter';
+import { useSyncValue } from '../../utils/hooks/useSyncValue';
+import { emptyObject } from '../../utils/constant';
+import { useFormInputTrait } from '../form-input-hooks';
+import { useSize } from '../../utils/hooks/useFormLegacy';
+export const WdSwitch = React.forwardRef(function FormSwitch(props, inputRef) {
+    const { 
+    // 系统属性
+    name, label, events = emptyObject, } = props;
+    const size = useSize(props);
+    const [innerHandle, setInnerHandle] = React.useState({}); // hook里挂出的属性
+    /** 兼容从 Form 获取属性，必须引入，自动挂载组件方法 */
+    const traitProps = { ...props, inputRef, setInnerHandle };
+    const { value: defaultChecked, onChange: outerOnChange, disabled, readOnly, validateErrorMsg, validateState, visible, value, required, layout, } = useFormInputTrait(traitProps);
+    const [checked, setChecked] = useSyncValue(defaultChecked);
+    const { classPrefix } = useConfig();
+    const platform = usePlatform();
+    // 现在低码组件往源码组件传入的id不唯一, 暂时使用hashcode替代
+    const hashcode = getLocalCounter();
+    const _id = `switch-${hashcode}`;
+    const switchCls = classNames({
+        'is-checked': checked,
+        'is-disabled': disabled || readOnly,
+        'size-sm': !['h5'].includes(platform) && ['sm'].includes(size),
+        'size-md': !['h5'].includes(platform) && ['md'].includes(size),
+        'size-lg': ['h5'].includes(platform) || ['lg'].includes(size),
+    });
+    React.useImperativeHandle(inputRef, () => ({
+        ...innerHandle,
+        name,
+        value,
+        label,
+        required,
+        visible,
+        disabled,
+        readOnly,
+    }), [innerHandle, name, value, label, required, visible, disabled, readOnly]);
+    const onChange = (ev) => {
+        var _a;
+        const value = ev.target.checked;
+        setChecked(value);
+        outerOnChange === null || outerOnChange === void 0 ? void 0 : outerOnChange(value);
+        (_a = events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value }, { orgianalEvent: ev });
+    };
+    return (visible && (_jsx(WdFormItem, { ...props, testId: "form-switch", validateErrorMsg: validateErrorMsg, validateState: validateState, readValue: defaultChecked, classRoot: 'switch', disabled: disabled, layout: layout, children: _jsxs("label", { className: `${classPrefix}-switch ${switchCls}`, htmlFor: _id, children: [_jsx("input", { id: _id, name: name, className: `${classPrefix}-switch__input `, type: "checkbox", checked: checked, disabled: disabled || readOnly, onChange: onChange }), _jsx("div", { className: `${classPrefix}-switch__box` })] }, _id) })));
+});

package/dist/web/components/wd-table/components/FieldRender/index.js

@@ -16,6 +16,7 @@ import { QuoteModal } from './QuoteModal';
 import { TABLE_SLOT_PREFIX } from '../../../../utils/constant';
 import { getPrimaryField } from '../../../../utils/datasource';
 import { useConfig } from '../../../../utils/config-context';
+import { EnumHoc } from '../../../../utils/hooks/EnumHoc';
 import { ImagePreview } from './ImagePreview';
 const MODAL_SIZE = 'auto';
 // 文字提示框包裹组件
@@ -208,10 +209,10 @@ export const DataItemView = ({ fields, modelType, value }) => {
  * object，展示表格组件
  */
 export const DataTableView = ({ fields, value }) => {
+    var _a;
     const { classPrefix } = useConfig();
+    const rawFields = (_a = Object === null || Object === void 0 ? void 0 : Object.entries(fields.properties)) === null || _a === void 0 ? void 0 : _a.map(([name, field]) => Object.assign({}, field, { name }));
     const columns = useMemo(() => {
-        var _a;
-        const rawFields = (_a = Object === null || Object === void 0 ? void 0 : Object.entries(fields.properties)) === null || _a === void 0 ? void 0 : _a.map(([name, field]) => Object.assign({}, field, { name }));
         const rawFieldsSort = rawFields.sort((a, b) => a['x-index'] - b['x-index']);
         const baseColumns = getColumns({
             columnSets: [],
@@ -219,8 +220,8 @@ export const DataTableView = ({ fields, value }) => {
             isH5: false,
         });
         return baseColumns;
-    }, [fields]);
-    return (_jsx(ConfigProvider, { classPrefix: classPrefix, children: _jsx(Table, { className: `${classPrefix}-table-wrap`, bordered: "all", recordKey: "_id", records: [].concat(value), columns: columns }) }));
+    }, [rawFields]);
+    return (_jsx(ConfigProvider, { classPrefix: classPrefix, children: _jsx(EnumHoc, { fields: rawFields, children: _jsx(Table, { className: `${classPrefix}-table-wrap`, bordered: "all", recordKey: "_id", records: [].concat(value), columns: columns }) }) }));
 };
 /**
  * array类型，展示组件

package/dist/web/components/wd-table/components/FilterFieldsPanel/FilterFieldItem.js

@@ -40,6 +40,10 @@ export const FilterFieldItem = ({ updateFilterData, ...filterFieldItemConfig })
     const { filterType, isRange, label, options, fieldCalculation, value } = filterFieldItemConfig;
     const updateFilterConfig = (value) => {
         const lastFilterConfig = { ...filterFieldItemConfig, ...value };
+        // 选择为空不为空，则清空数据
+        if (['$empty', '$nempty'].includes(lastFilterConfig === null || lastFilterConfig === void 0 ? void 0 : lastFilterConfig.fieldCalculation.value)) {
+            lastFilterConfig.value = '';
+        }
         updateFilterData(lastFilterConfig);
     };
     useEffect(() => {

package/dist/web/components/wd-table/components/Table/index.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint max-lines: [error, 350] */
 import React, { useRef, useEffect } from 'react';
 import { Icon, Table, StatusTip, ConfigProvider } from 'tea-component';
 import { useResizeObserver } from '@react-hookz/web';
 import { useConfig } from '../../../../utils/config-context';
 import { isInIde } from '../../../../utils/platform';
-const { sortable, radioable, selectable, injectable, pageable, autotip, scrollable, } = Table.addons;
+const { sortable, radioable, selectable, injectable, pageable, autotip, scrollable, columnsResizable, } = Table.addons;
 import StatusContent from '../../../statusContent';
 import classNames from '../../../../utils/classnames';
 import { setTableHeaderStyle } from './util';
@@ -15,8 +16,18 @@ const miniPageSize = 10;
 // h5 端表格高度
 const tableHeight = { sm: 500, md: 580, lg: 880 };
 const tableHeaderHeight = 51;
+const renderStatus = ({ isH5, status, classPrefix, refreshTable, isNoDataSourceBind, _emptyText, }) => {
+    const text = {
+        loading: '数据加载中,请稍候...',
+        error: (_jsxs("p", { children: ["\u6570\u636E\u52A0\u8F7D\u5931\u8D25,", _jsx("span", { className: `${classPrefix}-empty-retry-text`, onClick: () => {
+                        refreshTable();
+                    }, children: "\u8BF7\u91CD\u8BD5" })] })),
+        empty: isNoDataSourceBind ? '请绑定数据源' : _emptyText,
+    };
+    return (_jsx(StatusContent, { emptyText: text[`${status}`], component: "table", icon: status, isH5: isH5 }));
+};
 // eslint-disable-next-line complexity
-export const BaseTableCom = ({ recordKey, className, columns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, isLoading, queryParams, total = defaultTotal, refreshTable, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, }) => {
+export const BaseTableCom = ({ recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, isLoading, queryParams, total = defaultTotal, refreshTable, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, }) => {
     var _a;
     const tableRef = useRef(null);
     const { classPrefix } = useConfig();
@@ -25,8 +36,11 @@ export const BaseTableCom = ({ recordKey, className, columns, records, sortColum
         ? (queryParams === null || queryParams === void 0 ? void 0 : queryParams.pageIndex) === pageIndexSpan && isLoading
         : isLoading;
     // table状态样式
+    const showStatus = isShowLoading || isError || !(records === null || records === void 0 ? void 0 : records.length);
     const classes = {
-        [`${classPrefix}-table--status`]: isShowLoading || isError || !(records === null || records === void 0 ? void 0 : records.length),
+        [`${classPrefix}-table-scroll-wrap`]: true,
+        [`${classPrefix}-table--status`]: showStatus,
+        [`${classPrefix}-table--without-pagination`]: !enablePagination,
     };
     // table 插件
     const tableAddons = [
@@ -48,11 +62,9 @@ export const BaseTableCom = ({ recordKey, className, columns, records, sortColum
         autotip({
             isLoading: isShowLoading,
             isError,
-            loadingText: (_jsx(StatusContent, { emptyText: '数据加载中,请稍候...', component: "table", icon: "loading", isH5: isH5 })),
-            emptyText: (_jsx(StatusContent, { emptyText: isNoDataSourceBind ? '请绑定数据源' : _emptyText, component: "table", icon: "empty", isH5: isH5 })),
-            errorText: (_jsx(StatusContent, { emptyText: _jsxs("p", { children: ["\u6570\u636E\u52A0\u8F7D\u5931\u8D25,", _jsx("span", { className: `${classPrefix}-empty-retry-text`, onClick: () => {
-                                refreshTable();
-                            }, children: "\u8BF7\u91CD\u8BD5" })] }), component: "table", icon: "error", isH5: isH5 })),
+            loadingText: null,
+            emptyText: null,
+            errorText: null,
         }),
         // 行背景色
         injectable({
@@ -71,6 +83,16 @@ export const BaseTableCom = ({ recordKey, className, columns, records, sortColum
             }),
         }),
     ];
+    // 仅运行态可编辑
+    if (!isInIde()) {
+        tableAddons.push(columnsResizable({
+            onResizeEnd: (columns) => {
+                setColumns(columns);
+            },
+            minWidth: 92,
+            maxWidth: 1000,
+        }));
+    }
     // 支撑分页的最大高度
     const tableDomHeight = (_a = tableRef.current) === null || _a === void 0 ? void 0 : _a.clientHeight;
     // 支持表格滚动，高度超过 500 开始显示滚动条
@@ -167,6 +189,15 @@ export const BaseTableCom = ({ recordKey, className, columns, records, sortColum
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [queryParams.pageIndex, currentSize, isLoading, isH5, total]);
-    return (_jsx("div", { className: `${classPrefix}-table-scroll-wrap`, children: _jsx(Table, { ref: tableRef, className: classNames(className, classes), bordered: true, recordKey: recordKey, columns: columns, records: records, addons: tableAddons, bottomTip: bottomTipCompRender() }) }));
+    const status = isShowLoading ? 'loading' : isError ? 'error' : 'empty';
+    return (_jsxs("div", { className: classNames(className, classes), children: [_jsx(Table, { ref: tableRef, className: className, bordered: true, recordKey: recordKey, columns: columns, records: records, addons: tableAddons, bottomTip: bottomTipCompRender() }), showStatus &&
+                renderStatus({
+                    isH5,
+                    status,
+                    classPrefix,
+                    refreshTable,
+                    isNoDataSourceBind,
+                    _emptyText,
+                })] }));
 };
 export const BaseTable = React.memo(BaseTableCom);

package/dist/web/components/wd-table/hooks/useQueryParams.js

@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 import { getQueryParams } from '../utils';
 import isObjectEqual from '../../../utils/isObjectEqual';
 // const defaultCount = 1;
-export const useQueryParams = ({ queryParams, wList, viewFieldsData, connectorParams, isModel, isViewTable, events, }) => {
+export const useQueryParams = ({ queryParams, wList, viewFieldsData, connectorParams, isModel, isViewTable, events, columns, }) => {
     const queryRef = useRef({});
     const [query, setQuery] = useState(() => {
         return getQueryParams({
@@ -12,6 +12,7 @@ export const useQueryParams = ({ queryParams, wList, viewFieldsData, connectorPa
             connectorParams,
             isModel,
             isViewTable,
+            columns,
         });
     });
     useEffect(() => {
@@ -23,6 +24,7 @@ export const useQueryParams = ({ queryParams, wList, viewFieldsData, connectorPa
             connectorParams,
             isModel,
             isViewTable,
+            columns,
         });
         if (!isObjectEqual(queryRef.current, query)) {
             queryRef.current = query;
@@ -36,6 +38,7 @@ export const useQueryParams = ({ queryParams, wList, viewFieldsData, connectorPa
         queryParams,
         viewFieldsData,
         wList,
+        columns,
     ]);
     return { query };
 };

package/dist/web/components/wd-table/hooks/useTableData.js

@@ -1,13 +1,18 @@
 import { useEffect, useCallback, useState } from 'react';
 const defaultPageNo = 1;
-export const useTableData = ({ dataSourceAPI, connectorMethod, query, events, isModel, dbName, isH5, isNoDataSourceBind, }) => {
+export const useTableData = ({ dataSourceAPI, connectorMethod, query, events, isModel, dbName, isH5, isNoDataSourceBind, viewFieldsData, isViewTable, }) => {
     const [total, setTotal] = useState(0);
     const [tableLoading, setTableLoading] = useState(true);
     const [tableData, setTableData] = useState([]);
     const fetch = useCallback(async () => {
+        var _a;
         if (isNoDataSourceBind) {
             return;
         }
+        // 视图配置请求返回查询参数，配置视图时，等待视图返回成功后再查询，避免多次查询
+        if (isModel && isViewTable && !((_a = viewFieldsData === null || viewFieldsData === void 0 ? void 0 : viewFieldsData.viewList) === null || _a === void 0 ? void 0 : _a.length)) {
+            return;
+        }
         let data = { records: [], total: 0 };
         setTableLoading(true);
         if (isModel) {

package/dist/web/components/wd-table/hooks/useViewFields.js

@@ -15,6 +15,6 @@ export const useViewFields = ({ selectedView, selectedViewIds, dbName, isModel,
         },
         viewFields: (data === null || data === void 0 ? void 0 : data.fields) || authFields,
         isError: error,
-        loading: !error && !data,
+        viewLoading: !error && !data,
     };
 };

package/dist/web/components/wd-table/utils/index.js

@@ -86,8 +86,8 @@ export const whereList = (whereProxy) => {
     }
 };
 // 获取最终的查询参数
-export const getQueryParams = ({ queryParams, wList, viewFieldsData, connectorParams, isModel, isViewTable, }) => {
-    var _a, _b;
+export const getQueryParams = ({ queryParams, wList, viewFieldsData, connectorParams, isModel, isViewTable, columns, }) => {
+    var _a, _b, _c;
     const _defaultPageSize = 10;
     const _defaultPageIndex = 1;
     const { pageIndex: pageNo, pageSize, sort } = queryParams;
@@ -125,6 +125,10 @@ export const getQueryParams = ({ queryParams, wList, viewFieldsData, connectorPa
     // 运行态主动排序进行覆盖
     if ((sort === null || sort === void 0 ? void 0 : sort.length) && sort[0].order) {
         params.orderBy = sort[0].by;
+        // 后端根据业务字段排序
+        params.orderBy =
+            ((_c = columns === null || columns === void 0 ? void 0 : columns.find((i) => params.orderBy === i.slotKey)) === null || _c === void 0 ? void 0 : _c.fieldKey) ||
+                params.orderBy;
         params.orderType = sort[0].order;
     }
     const _pageSize = parseInt(`${params.pageSize}`);

package/dist/web/components/wd-table/wd-table.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable max-lines */
-import { useRef, useEffect, useState, useMemo, useImperativeHandle, forwardRef, } from 'react';
+import { useRef, useEffect, useState, useMemo, useImperativeHandle, forwardRef, memo, } from 'react';
 import { ConfigProvider } from 'tea-component';
 import { Table, ExportFileModal, ImportFileModal, InOrOutRecordModal, deleteRecord, importHandleByApi, exportHandleByApi, exportHandle, FilterFieldsPanel, ToolBar, } from './components';
 import classNames from '../../utils/classnames';
@@ -24,22 +24,16 @@ import Modal from '../modal';
 import { WdButton } from '../wd-button';
 const _defaultPageIndex = 1;
 const _defaultPageSize = 10;
-const TableOption = ({ record, rowKey, recordIndex, column, columnIndex, slots, classPrefix, }) => {
+const TableOption = memo(function TableOption({ slots, ...props }) {
     const component = useMemo(() => {
         // 计算单元格的值
-        return slotRender(slots[CELL_CUSTOM_OPTION], {
-            record,
-            rowKey,
-            recordIndex,
-            column,
-            columnIndex,
-        });
-    }, [column, columnIndex, record, recordIndex, rowKey, slots]);
-    return (_jsx("div", { className: `${classPrefix}-pc-table-option-btn-wrap`, children: component }));
-};
-const GlobalButton = function GlobalButtonDom({ classPrefix, slots, }) {
+        return slotRender(slots[CELL_CUSTOM_OPTION], props);
+    }, [props, slots]);
+    return component;
+});
+const GlobalButton = memo(function GlobalButtonDom({ classPrefix, slots, }) {
     return _jsx("div", { className: `${classPrefix}-global-btn`, children: slotRender(slots) });
-};
+});
 // eslint-disable-next-line complexity
 export const WdTable = forwardRef(function TableComp({ className, style, dataSourceType, bindConnectMetadata = {
     datasource: { id: '', name: '', title: '' },
@@ -110,7 +104,9 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
     const { enumOptions } = useEnumContext();
     const dataSourceAPI = useMemo(() => new DataSource(dbName), [dbName]); // datasource 方法-模型
     // 插槽属性
-    const slots = getSlots(props);
+    const slots = useMemo(() => {
+        return getSlots(props);
+    }, [props]);
     // table选中key值
     const [selectedKeys, setSelectedKeys] = useState([]);
     // 行点击出参
@@ -118,8 +114,10 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
     // 筛选条件
     const wList = where;
     // 搜索和分页参数
-    const initPageIndex = isModel ? defaultPageIndex : connectorParams === null || connectorParams === void 0 ? void 0 : connectorParams.pageNo;
-    const initPageSize = isModel ? defaultPageSize : connectorParams === null || connectorParams === void 0 ? void 0 : connectorParams.pageSize;
+    let initPageIndex = isModel ? defaultPageIndex : connectorParams === null || connectorParams === void 0 ? void 0 : connectorParams.pageNo;
+    let initPageSize = isModel ? defaultPageSize : connectorParams === null || connectorParams === void 0 ? void 0 : connectorParams.pageSize;
+    initPageIndex = parseInt(initPageIndex);
+    initPageSize = parseInt(initPageSize);
     const [queryParams, setQueryParams] = useState({
         pageIndex: initPageIndex,
         pageSize: initPageSize,
@@ -134,7 +132,7 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
     // 过滤权限字段
     const { authFields, fieldsLoading } = useAuthFields(dbName, dbFieldNames, isNewData, isModel, connectorMethod);
     // 视图
-    const { viewFieldsData, viewFields } = useViewFields({
+    const { viewFieldsData, viewFields, viewLoading } = useViewFields({
         selectedView,
         selectedViewIds,
         dbName,
@@ -147,60 +145,11 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
     const filterFieldsData = getFilterFields(filterFields, fields);
     // 可排序字段
     const sortColumns = getSortColumns({ fields, columnSets });
-    // 查询参数
-    const { query } = useQueryParams({
-        queryParams,
-        wList,
-        viewFieldsData,
-        connectorParams,
-        isModel,
-        isViewTable,
-        events,
-    });
-    // 查询数据
-    const { tableData, total, tableLoading, getNewList } = useTableData({
-        dataSourceAPI,
-        dbName,
-        connectorMethod,
-        query,
-        events,
-        isModel,
-        isH5,
-        isNoDataSourceBind,
-    });
-    const refreshTable = () => {
-        // 清除选中的 key
-        setSelectedKeys([]);
-        if (queryParams.pageIndex === _defaultPageIndex) {
-            getNewList();
-        }
-        else {
-            setQueryParams((queryParams) => ({ ...queryParams, pageIndex: 1 }));
-        }
-    };
-    const isTableLoading = !isNoDataSourceBind && (tableLoading || fieldsLoading || !fields.length);
-    // 表格数据
-    const mapTableData = () => {
-        if (isMock || (isInIde() && isNoDataSourceBind)) {
-            return Mock.records;
-        }
-        // 加载过程中,pc端每次查询置空,h5端仅首页置空
-        // 避免编辑器内切换数据源时,column更改,table render还未更新造成渲染问题
-        if ((isTableLoading && !isH5) || isNoDataSourceBind) {
-            return [];
-        }
-        if (isTableLoading &&
-            isH5 &&
-            (queryParams === null || queryParams === void 0 ? void 0 : queryParams.pageIndex) === _defaultPageIndex) {
-            return [];
-        }
-        if (viewFieldsData === null || viewFieldsData === void 0 ? void 0 : viewFieldsData.selectedViewId) {
-            mapTableDataWithView(viewFieldsData, tableData);
-        }
-        return tableData;
-    };
-    const tableRecords = mapTableData();
     // 表格 columns
+    const [resizeColumns, setColumns] = useState([]);
+    useEffect(() => {
+        setColumns([]);
+    }, [columnSets]);
     const columns = useMemo(() => {
         if (isMock || (isInIde() && isNoDataSourceBind)) {
             return Mock.columns;
@@ -208,7 +157,7 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         if (fieldsLoading || isNoDataSourceBind) {
             return [];
         }
-        const baseColumns = getTableColumns({
+        let baseColumns = getTableColumns({
             fields,
             columnSets,
             slots,
@@ -225,7 +174,7 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
                 width: 150,
                 align: 'left',
                 fixed: 'right',
-                render: (record, rowKey, recordIndex, column, columnIndex) => (_jsx(TableOption, { slots: slots, classPrefix: classPrefix, record: record, rowKey: rowKey, recordIndex: recordIndex, column: column, columnIndex: columnIndex })),
+                render: (record, rowKey, recordIndex, column, columnIndex) => (_jsx("div", { className: `${classPrefix}-pc-table-option-btn-wrap`, children: _jsx(TableOption, { slots: slots, record: record, rowKey: rowKey, recordIndex: recordIndex, column: column, columnIndex: columnIndex }) })),
             });
         }
         // 选择列
@@ -246,6 +195,11 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
                 fixed: 'left',
             });
         }
+        baseColumns = baseColumns.map((i) => {
+            var _a;
+            const width = (_a = resizeColumns === null || resizeColumns === void 0 ? void 0 : resizeColumns.find((j) => i.key === j.key)) === null || _a === void 0 ? void 0 : _a.width;
+            return width ? { ...i, width } : i;
+        });
         return baseColumns;
     }, [
         isMock,
@@ -260,7 +214,68 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         enableCellCustomOption,
         columnSelectType,
         classPrefix,
+        resizeColumns,
     ]);
+    // 查询参数
+    const { query } = useQueryParams({
+        queryParams,
+        wList,
+        viewFieldsData,
+        connectorParams,
+        isModel,
+        isViewTable,
+        events,
+        columns,
+    });
+    // 查询数据
+    const { tableData, total, tableLoading, getNewList } = useTableData({
+        dataSourceAPI,
+        dbName,
+        connectorMethod,
+        query,
+        events,
+        isModel,
+        isH5,
+        isNoDataSourceBind,
+        viewFieldsData,
+        isViewTable,
+    });
+    const refreshTable = () => {
+        // 清除选中的 key
+        setSelectedKeys([]);
+        if (queryParams.pageIndex === _defaultPageIndex) {
+            getNewList();
+        }
+        else {
+            setQueryParams((queryParams) => ({ ...queryParams, pageIndex: 1 }));
+        }
+    };
+    const isTableLoading = !isNoDataSourceBind &&
+        (tableLoading ||
+            fieldsLoading ||
+            !fields.length ||
+            (viewLoading && isViewTable));
+    // 表格数据
+    const mapTableData = () => {
+        if (isMock || (isInIde() && isNoDataSourceBind)) {
+            return Mock.records;
+        }
+        // 加载过程中,pc端每次查询置空,h5端仅首页置空
+        // 避免编辑器内切换数据源时,column更改,table render还未更新造成渲染问题
+        if ((isTableLoading && !isH5) || isNoDataSourceBind) {
+            return [];
+        }
+        if (isTableLoading &&
+            isH5 &&
+            (queryParams === null || queryParams === void 0 ? void 0 : queryParams.pageIndex) === _defaultPageIndex) {
+            return [];
+        }
+        if (viewFieldsData === null || viewFieldsData === void 0 ? void 0 : viewFieldsData.selectedViewId) {
+            mapTableDataWithView(viewFieldsData, tableData);
+        }
+        return tableData;
+    };
+    const tableRecords = mapTableData();
     // 总数
     const beforeModalDestroy = () => {
         // 重新加载数据
@@ -334,6 +349,10 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         pageSize: query.pageSize,
         selectedRecords: tableRecords.filter((_) => selectedKeys.find((key) => _._id === key)),
         dataSourceType,
+        bindMetadata,
+        columnSets,
+        defaultPageSize,
+        defaultPageIndex,
     }), 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
@@ -348,6 +367,9 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         query.pageNo,
         query.pageSize,
         dataSourceType,
+        bindMetadata,
+        defaultPageSize,
+        defaultPageIndex,
     ]);
     // 表格更改上下文数据
     // 移动端和自定义APIs场景不支持导入功能，监听变化存到表格上下文中
@@ -406,6 +428,35 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
     }, [isH5]);
     const hasFilterButton = !!filterFieldsData.length;
     const recordKey = isInIde() ? undefined : '_id';
+    // 行点击事件
+    const rowClick = (context) => {
+        if (events === null || events === void 0 ? void 0 : events.tabTableRow) {
+            events.tabTableRow({
+                record: context.record,
+                rowKey: context.rowKey,
+                recordIndex: context.recordIndex,
+            });
+        }
+        setRowData({
+            record: context.record,
+            rowKey: context.rowKey,
+            recordIndex: context.recordIndex,
+        });
+    };
+    // 选择事件
+    const onSelectChange = (keys, context) => {
+        setSelectedKeys([].concat(keys));
+        if (events === null || events === void 0 ? void 0 : events.rowsSelect) {
+            const selectValue = columnSelectType === 'radio'
+                ? context === null || context === void 0 ? void 0 : context.record
+                : context === null || context === void 0 ? void 0 : context.selectedRecords;
+            events.rowsSelect(selectValue);
+        }
+    };
+    // 查询参数改变
+    const onQueryChange = (query) => {
+        setQueryParams({ ...queryParams, ...query });
+    };
     return (_jsx(ConfigProvider, { classPrefix: classPrefix, children: _jsx(EnumHoc, { fields: authFields, children: _jsxs("div", { className: classNames(wrapClassList, className), style: style, id: id, children: [_jsx(FilterFieldsPanel, { openMobileFilter: openMobileFilter, setOpenMobileFilter: setOpenMobileFilter, filterFields: filterFieldsData, fetchData: (searchValues = []) => {
                             if (isObjectEqual(queryParams.searchValues, searchValues)) {
                                 getNewList();
@@ -421,32 +472,7 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
                                     enableTableHeightSizeBtn ||
                                     hasFilterButton) && (_jsx(ToolBar, { hasFilterButton: hasFilterButton, total: total, refreshTable: refreshTable, setTableHightSize: setTableHightSize, currentSize: tableHightSize, setOpenMobileFilter: () => {
                                     setOpenMobileFilter(true);
-                                }, enableRefreshBtn: enableRefreshBtn, enableTableHeightSizeBtn: enableTableHeightSizeBtn, enablePagination: enablePagination })), _jsx(Table, { emptyText: emptyText, isH5: isH5, isNoDataSourceBind: isNoDataSourceBind, className: tableClassList, recordKey: recordKey, currentSize: tableHightSize, defaultPageIndex: defaultPageIndex, defaultPageSize: defaultPageSize, sortColumns: sortColumns, enablePagination: !isH5 && enablePagination, columnSelectType: columnSelectType, columns: columns, records: tableRecords, sort: queryParams.sort, selectedKeys: selectedKeys, onSelectChange: (keys, context) => {
-                                    setSelectedKeys([].concat(keys));
-                                    if (events === null || events === void 0 ? void 0 : events.rowsSelect) {
-                                        const selectValue = columnSelectType === 'radio'
-                                            ? context === null || context === void 0 ? void 0 : context.record
-                                            : context === null || context === void 0 ? void 0 : context.selectedRecords;
-                                        events.rowsSelect(selectValue);
-                                    }
-                                }, isError: false, isLoading: isTableLoading, rowColor: rowColor, queryParams: queryParams, total: total, refreshTable: () => {
-                                    refreshTable();
-                                }, onQueryChange: (query) => {
-                                    setQueryParams({ ...queryParams, ...query });
-                                }, rowClick: (context) => {
-                                    if (events === null || events === void 0 ? void 0 : events.tabTableRow) {
-                                        events.tabTableRow({
-                                            record: context.record,
-                                            rowKey: context.rowKey,
-                                            recordIndex: context.recordIndex,
-                                        });
-                                    }
-                                    setRowData({
-                                        record: context.record,
-                                        rowKey: context.rowKey,
-                                        recordIndex: context.recordIndex,
-                                    });
-                                } }), isH5 && enableGlobalButton && !isNoDataSourceBind && (_jsx("div", { className: `${classPrefix}-h5-table-wrap-footer`, children: _jsx(GlobalButton, { classPrefix: classPrefix, slots: slots === null || slots === void 0 ? void 0 : slots.globalButton }) }))] }), _jsx(ImportFileModal, { dbName: dbName, datasourceTitle: datasourceTitle, fields: fields, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, isImportFileModalByApiVisible: isImportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, refresh: () => {
+                                }, enableRefreshBtn: enableRefreshBtn, enableTableHeightSizeBtn: enableTableHeightSizeBtn, enablePagination: enablePagination })), _jsx(Table, { emptyText: emptyText, isH5: isH5, isNoDataSourceBind: isNoDataSourceBind, className: tableClassList, recordKey: recordKey, currentSize: tableHightSize, defaultPageIndex: defaultPageIndex, defaultPageSize: defaultPageSize, sortColumns: sortColumns, enablePagination: !isH5 && enablePagination, columnSelectType: columnSelectType, columns: columns, setColumns: setColumns, records: tableRecords, sort: queryParams.sort, selectedKeys: selectedKeys, onSelectChange: onSelectChange, isError: false, isLoading: isTableLoading, rowColor: rowColor, queryParams: queryParams, total: total, refreshTable: refreshTable, onQueryChange: onQueryChange, rowClick: rowClick }), isH5 && enableGlobalButton && !isNoDataSourceBind && (_jsx("div", { className: `${classPrefix}-h5-table-wrap-footer`, children: _jsx(GlobalButton, { classPrefix: classPrefix, slots: slots === null || slots === void 0 ? void 0 : slots.globalButton }) }))] }), _jsx(ImportFileModal, { dbName: dbName, datasourceTitle: datasourceTitle, fields: fields, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, isImportFileModalByApiVisible: isImportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, refresh: () => {
                             // 导入成功后刷新页面
                             refreshTable();
                         } }), _jsx(ExportFileModal, { whereList: wList, fields: fields, columns: mapColumKey(columns), isExportFileModalByApiVisible: isExportFileModalByApiVisible, selectedKeys: selectedKeys, dbName: dbName, query: query, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible }), _jsx(InOrOutRecordModal, { dbName: dbName, isInOrOutRecordModalVisible: isInOrOutRecordModalVisible, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible }), isH5 && (_jsx(Modal, { className: `${classPrefix}-h5-table-option-modal-wrap`, disableCloseIcon: true, title: "\u64CD\u4F5C", visible: isMobileOptionVisible, outerRef: modalRef, events: {

package/dist/web/components/wd-textarea/index.js

@@ -0,0 +1,3 @@
+import { WdTextarea } from './wd-textarea';
+export { WdTextarea };
+export default WdTextarea;