@cloudbase/weda-ui 3.4.12 → 3.4.13

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([]);
     // 行点击出参
@@ -136,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,
@@ -178,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 }) })),
             });
         }
         // 选择列
@@ -241,6 +237,8 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         isModel,
         isH5,
         isNoDataSourceBind,
+        viewFieldsData,
+        isViewTable,
     });
     const refreshTable = () => {
         // 清除选中的 key
@@ -252,7 +250,11 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
             setQueryParams((queryParams) => ({ ...queryParams, pageIndex: 1 }));
         }
     };
-    const isTableLoading = !isNoDataSourceBind && (tableLoading || fieldsLoading || !fields.length);
+    const isTableLoading = !isNoDataSourceBind &&
+        (tableLoading ||
+            fieldsLoading ||
+            !fields.length ||
+            (viewLoading && isViewTable));
     // 表格数据
     const mapTableData = () => {
         if (isMock || (isInIde() && isNoDataSourceBind)) {
@@ -347,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
     [
@@ -361,6 +367,9 @@ enableRefreshBtn = true, enableTableHeightSizeBtn = true, emptyText, ...props },
         query.pageNo,
         query.pageSize,
         dataSourceType,
+        bindMetadata,
+        defaultPageSize,
+        defaultPageIndex,
     ]);
     // 表格更改上下文数据
     // 移动端和自定义APIs场景不支持导入功能，监听变化存到表格上下文中
@@ -419,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();
@@ -434,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, setColumns: setColumns, 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/utils/hooks/useFormLegacy.js

@@ -58,8 +58,9 @@ export const useRules = (props) => {
 export const useStatus = (props) => {
     const { disabled: _disabled, readOnly: _readOnly, status } = props || {};
     const result = useMemo(() => {
-        const disabled = status === 'disabled' || !!_disabled;
-        const readOnly = status === 'readOnly' || !!_readOnly;
+        const rawReadOnly = typeof _readOnly === 'boolean' ? _readOnly : !!_disabled;
+        const disabled = status == null ? !!_disabled : status === 'disabled';
+        const readOnly = status == null ? rawReadOnly : status === 'readOnly';
         return { disabled, readOnly };
     }, [_disabled, _readOnly, status]);
     return result;

package/dist/web/weda-ui.css

@@ -301,6 +301,10 @@ body .weda-ui {
 .weda-ui.gsd-h5-react-formitem .wedatea2td-textarea-group,
 .weda-ui.gsd-h5-react-formitem .form-select-pc .wedatea2td-dropdown__header {
   font: inherit;
+}
+
+.weda-ui.gsd-h5-react-formitem .wedatea2td-input,
+.weda-ui.gsd-h5-react-formitem .form-select-pc .wedatea2td-dropdown__header {
   height: var(--wd-form-item-height-md);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "3.4.12",
+  "version": "3.4.13",
   "main": "./dist/index.js",
   "module": "./dist/index",
   "miniprogram": "mpdist",