@cloudbase/weda-ui 3.10.1 → 3.11.0

package/dist/web/components/wd-select-multiple/wd-select-multiple.css

@@ -76,10 +76,6 @@
   color: var(--wd-color-text-placeholder) !important;
 }
 
-.wd-tag-root {
-  cursor: pointer;
-}
-
 .wd-pc-select-multiple-root .wd-form-item-wrap__control {
   overflow: hidden;
 }
@@ -91,3 +87,33 @@
   width: 100%;
   padding-right: calc(var(--wd-size-icon-md));
 }
+
+.wd-relation-select-overlay.multiple
+  .wedatea2td-dropdown-box
+  .wedatea2td-list--option
+  > li {
+  width: fit-content !important;
+  min-width: 100%;
+  padding: 0;
+}
+.wd-relation-select-overlay.multiple .wd-relation-select-option-wrap {
+  padding: 0 8px;
+  margin-top: -6px;
+}
+.wd-form-item.wd-pc-select-multiple-root .wedatea2td-dropdown__value div {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+/* h5端关联下拉样式 */
+.weda-ui-custom-picker__cloumns.weda-ui-custom-picker__cloumns--select-multiple.wd-relation-select-overlay
+  .weda-ui-custom-picker__cloumn-item {
+  height: auto;
+}
+.weda-ui-custom-picker__cloumns--select-multiple
+  .weda-ui-custom-picker__cloumn-item-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-left: 30px;
+}

package/dist/web/components/wd-select-multiple/wd-select-multiple.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { forwardRef, useState, useCallback, useRef } from 'react';
 import { WdFormItem, WdInputGroup, WdInputWrap } from '../wd-form-item';
-import SelectMultiple from '../form/selectMultiple';
+import { SelectCom as SelectMultiple } from '../wd-select/select';
 import { useHandleClear, useFixedIcon, SELECT_ICON_H5, SELECT_ICON_PC, } from '../../utils/hooks/useFormLegacy';
 import { useFormInputTrait } from '../../components/form-input-hooks';
-import { RecycleProvider } from '../../utils/hooks/useRecycle';
 import { useSelected } from '../../utils/hooks/use-selected';
 import { emptyObject } from '../../utils/constant';
 import { useSetWidgetApi } from '../../utils/widget-api/use-set-widget-api';
@@ -13,12 +12,13 @@ import { X_RUNTIME_DEFAULT } from '../../../configs/type-utils/x-runtime-default
 import './style';
 import { useDebouncedCallback, useSyncedRef } from '@react-hookz/web';
 import { isFormatWithRelation } from '../form/select/formats-util';
-import { RelationalSetting } from '../wd-select/relationalSetting';
+import { RelationalSetting } from '../wd-select/relationSelect/relationalSetting';
 /**
  * 下拉多选-标准化
  */
 export const WdSelectMultiple = forwardRef(function WdSelectMultiple(props, ref) {
-    const { classRoot = 'select-multiple', clearable = X_RUNTIME_DEFAULT.clearable, placeholder, range, enumName, format, primaryField, tipBlock = X_RUNTIME_DEFAULT.tipBlock, viewId, dataSourceName, events = emptyObject, ignoreCase = X_RUNTIME_DEFAULT.ignoreCase, staticSearchable = X_RUNTIME_DEFAULT.staticSearchable, where = X_RUNTIME_DEFAULT.where, enableRelationalSetting = X_RUNTIME_DEFAULT.enableRelationalSetting, enableRelationalRefresh = X_RUNTIME_DEFAULT.enableRelationalRefresh, addRelationButtonText = X_RUNTIME_DEFAULT.addRelationButtonText, enableAddRelationButton = X_RUNTIME_DEFAULT.enableAddRelationButton, popupContainer, } = props;
+    const { classRoot = 'select-multiple', clearable = X_RUNTIME_DEFAULT.clearable, placeholder, range, enumName, format, primaryField, tipBlock = X_RUNTIME_DEFAULT.tipBlock, viewId, dataSourceName, events = emptyObject, ignoreCase = X_RUNTIME_DEFAULT.ignoreCase, staticSearchable = X_RUNTIME_DEFAULT.staticSearchable, where = X_RUNTIME_DEFAULT.where, enableRelationalSetting = X_RUNTIME_DEFAULT.enableRelationalSetting, enableRelationalRefresh = X_RUNTIME_DEFAULT.enableRelationalRefresh, addRelationButtonText = X_RUNTIME_DEFAULT.addRelationButtonText, enableAddRelationButton = X_RUNTIME_DEFAULT.enableAddRelationButton, enableRelationOptionJump = X_RUNTIME_DEFAULT.enableRelationOptionJump, popupContainer, selectFields: customFields = [], // 自定义展示字段
+    selectFieldType = 'primary', } = props;
     const childRef = useRef(null);
     const [options, setOptions] = useState([]);
     const [innerHandle, setInnerHandle] = useState({});
@@ -48,6 +48,11 @@ export const WdSelectMultiple = forwardRef(function WdSelectMultiple(props, ref)
         disabled,
         value,
     });
+    const handleChange = (v) => {
+        var _a;
+        onChange === null || onChange === void 0 ? void 0 : onChange(v);
+        (_a = delayEvents === null || delayEvents === void 0 ? void 0 : delayEvents.change) === null || _a === void 0 ? void 0 : _a.call(delayEvents, { value: v });
+    };
     const isRelation = isFormatWithRelation(format);
     const LabelAdornment = isRelation && (_jsx(RelationalSetting, { size: props.size, refresh: () => {
             var _a;
@@ -81,7 +86,10 @@ export const WdSelectMultiple = forwardRef(function WdSelectMultiple(props, ref)
     }), [innerHandle, selectedLabel, primaryField, selectedItem, value], ref);
     const eventsRef = useSyncedRef(events);
     const debouncedTriggerSearchEvent = useDebouncedCallback((value) => {
-        eventsRef.current.search({ value });
+        var _a, _b;
+        if (typeof ((_a = eventsRef.current) === null || _a === void 0 ? void 0 : _a.search) === 'function') {
+            (_b = eventsRef.current) === null || _b === void 0 ? void 0 : _b.search({ value });
+        }
     }, [eventsRef], 
     // eslint-disable-next-line @typescript-eslint/no-magic-numbers
     300);
@@ -90,8 +98,11 @@ export const WdSelectMultiple = forwardRef(function WdSelectMultiple(props, ref)
     }, [debouncedTriggerSearchEvent]);
     if (!visible)
         return null;
-    return (_jsx(WdFormItem, { ...formItemProps, children: _jsxs(_Fragment, { children: [_jsx(WdInputGroup, { ...inputGroupProps, children: _jsx(WdInputWrap, { ...inputWrapProps, children: _jsx(RecycleProvider, { readOnly: readOnly, recycleBack: setOptions, format: format, portalContainer: popupContainer, onRelationTagClick: (item) => {
+    return (_jsx(WdFormItem, { ...formItemProps, children: _jsxs(_Fragment, { children: [_jsx(WdInputGroup, { ...inputGroupProps, children: _jsx(WdInputWrap, { ...inputWrapProps, children: _jsx(SelectMultiple, { ...props, setAllOption: setOptions, onRelationTagClick: (item) => {
                                 var _a;
                                 (_a = delayEvents === null || delayEvents === void 0 ? void 0 : delayEvents.onRelationTagClick) === null || _a === void 0 ? void 0 : _a.call(delayEvents, item);
-                            }, children: _jsx(SelectMultiple, { addRelationButtonText: addRelationButtonText, enableAddRelationButton: enableAddRelationButton, childRef: childRef, events: delayEvents, labelVisible: false, defaultValue: value, enumName: enumName, format: format, placeholder: placeholder, primaryField: primaryField, range: range, size: "full", tipBlock: tipBlock, viewId: viewId, dataSourceName: dataSourceName, readOnly: readOnly, disabled: disabled, mode: "selector", decorator: null, ignoreCase: ignoreCase, staticSearchable: staticSearchable, where: where, onChange: onChange, onSearchValueInput: onSearchValueInput, popupContainer: popupContainer }) }) }) }), layout === 'horizontal' && LabelAdornment] }) }));
+                            }, enableRelationOptionJump: enableRelationOptionJump, onRelationOptionJump: (item) => {
+                                var _a;
+                                (_a = delayEvents === null || delayEvents === void 0 ? void 0 : delayEvents.onRelationOptionJump) === null || _a === void 0 ? void 0 : _a.call(delayEvents, item);
+                            }, selectFieldType: selectFieldType, selectFields: customFields, isRelation: isRelation, addRelationButtonText: addRelationButtonText, enableAddRelationButton: enableAddRelationButton, childRef: childRef, events: delayEvents, labelVisible: false, value: value, enumName: enumName, format: format, placeholder: placeholder, primaryField: primaryField, options: range, size: "full", tipBlock: tipBlock, viewId: viewId, dataSourceName: dataSourceName, readOnly: readOnly, disabled: disabled, mode: "multiple", decorator: null, ignoreCase: ignoreCase, staticSearchable: staticSearchable, where: where, onChange: handleChange, onSearch: onSearchValueInput, popupContainer: popupContainer, searchable: true }) }) }), layout === 'horizontal' && LabelAdornment] }) }));
 });

package/dist/web/components/wd-table/components/FieldRender/index.d.ts

@@ -56,17 +56,18 @@ export declare const formatNumberFix: (val: any, field: any, setZero?: boolean)
  * 根据 fields 信息生成 column
  * h5 和 pc 部分参数不同
  */
-export declare const getColumns: ({ columnSets, fields, isH5, supportManyRelated, }: {
+export declare const getColumns: ({ columnSets, fields, isH5, supportManyRelated, showRelationWithTag, }: {
     columnSets?: any[];
     fields: any;
     isH5?: boolean;
     supportManyRelated: any;
+    showRelationWithTag: any;
 }) => any;
 /**
  * 根据 field 属性，生成 column 配置
  * https://git.woa.com/QBase/lcap/common-application-specs/blob/master/types/platform/datasource.ts
  */
-export declare const formatFieldToColumn: (field: any, isH5: any, columnSets: any, supportManyRelated: any) => {
+export declare const formatFieldToColumn: (field: any, isH5: any, columnSets: any, supportManyRelated: any, showRelationWithTag: any) => {
     width: any;
     render: (record: any) => JSX.Element;
     key: any;
@@ -109,13 +110,14 @@ export declare const slotRender: (Slot: any, props?: {}) => any;
  * slots: object 模型表格作用域插槽
  * isH5: 判断自定义插槽列能否展示，目前是正常展示
  */
-export declare const filterCustomColumns: ({ columns, columnSets, slots, fields, isH5, supportManyRelated, }: {
+export declare const filterCustomColumns: ({ columns, columnSets, slots, fields, isH5, supportManyRelated, showRelationWithTag, }: {
     columns: any;
     columnSets: any;
     slots: any;
     fields: any;
     isH5: any;
     supportManyRelated: any;
+    showRelationWithTag: any;
 }) => any;
 /**
  * 过滤字段列表
@@ -137,7 +139,7 @@ export declare const getFixedColumnSets: ({ fixedFront, fixedEnd, columnSets, }:
 /**
  * 列管理字段转换
  */
-export declare const getTableColumns: ({ fields, columnSets, slots, fixedFront, fixedEnd, isH5, supportManyRelated, }: {
+export declare const getTableColumns: ({ fields, columnSets, slots, fixedFront, fixedEnd, isH5, supportManyRelated, showRelationWithTag, }: {
     fields: any;
     columnSets: any;
     slots: any;
@@ -145,5 +147,6 @@ export declare const getTableColumns: ({ fields, columnSets, slots, fixedFront,
     fixedEnd: any;
     isH5: any;
     supportManyRelated: any;
+    showRelationWithTag?: boolean;
 }) => any;
 export declare const mapColumKey: (columnSets: any) => any;

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

@@ -39,7 +39,7 @@ export const TextWrap = React.memo(function TextWrapComp(props) {
 export function getFieldRender(field = {}, extra = {}) {
     var _a;
     const { type, format, items, properties, title, parentDatasource } = field;
-    const { modelType, showTip = true, detailText = '详情', isH5 } = extra;
+    const { modelType, showTip = true, detailText = '详情', isH5, showRelationWithTag = true, } = extra;
     const textProps = { showTip };
     // 枚举-旧，新版 TODO
     if ((_a = field['x-enumObj']) === null || _a === void 0 ? void 0 : _a.length) {
@@ -135,13 +135,19 @@ export function getFieldRender(field = {}, extra = {}) {
                 (format === 'father-son' || format === 'related')) {
                 const primaryField = ((_b = (_a = field === null || field === void 0 ? void 0 : field.parentDatasource) === null || _a === void 0 ? void 0 : _a.schema) === null || _b === void 0 ? void 0 : _b['x-primary-column']) || '';
                 const relatedField = (_c = extra === null || extra === void 0 ? void 0 : extra.columnSet) === null || _c === void 0 ? void 0 : _c.relatedField;
+                if (!showRelationWithTag) {
+                    if (typeof fieldValue === 'string') {
+                        return _jsx(TextWrap, { ...textProps, children: fieldValue });
+                    }
+                    return (_jsx(TextWrap, { ...textProps, children: fieldValue[relatedField] || fieldValue[primaryField] || '-' }));
+                }
                 if (typeof fieldValue === 'string') {
-                    return (_jsx(WdTag, { range: fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.split(',').map((i) => ({
+                    return fieldValue && fieldValue !== '-' ? (_jsx(WdTag, { range: fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.split(',').map((i) => ({
                             label: i,
                             value: i,
                             prefixType: 'inner',
                             prefixIcon: 'td:link-1',
-                        })), tagStyleType: 'light', tagStyleWidthCols: 4 }));
+                        })), tagStyleType: 'light', tagStyleWidthCols: 4 })) : ('-');
                 }
                 const val = fieldValue[relatedField] || fieldValue[primaryField];
                 return val ? (_jsx(WdTag, { range: val === null || val === void 0 ? void 0 : val.split(',').map((i) => ({
@@ -194,12 +200,15 @@ export function getFieldRender(field = {}, extra = {}) {
                 const primaryField = ((_e = (_d = field === null || field === void 0 ? void 0 : field.parentDatasource) === null || _d === void 0 ? void 0 : _d.schema) === null || _e === void 0 ? void 0 : _e['x-primary-column']) || '';
                 const relatedField = (_f = extra === null || extra === void 0 ? void 0 : extra.columnSet) === null || _f === void 0 ? void 0 : _f.relatedField;
                 const _readValue = fieldValue[relatedField] || fieldValue[primaryField];
-                return (_jsx(WdTag, { range: _readValue === null || _readValue === void 0 ? void 0 : _readValue.split(',').map((i) => ({
+                if (!showRelationWithTag) {
+                    return (_jsx(TextWrap, { ...textProps, children: fieldValue[relatedField] || fieldValue[primaryField] }));
+                }
+                return _readValue ? (_jsx(WdTag, { range: _readValue === null || _readValue === void 0 ? void 0 : _readValue.split(',').map((i) => ({
                         label: i,
                         value: i,
                         prefixType: 'inner',
                         prefixIcon: 'td:link-1',
-                    })), tagStyleType: 'light', tagStyleWidthCols: 4 }));
+                    })), tagStyleType: 'light', tagStyleWidthCols: 4 })) : ('-');
             }
             else {
                 return (_jsx(QuoteModal, { className: "e-object-view-modal", caption: title, size: MODAL_SIZE, text: detailText, children: objectRender({
@@ -314,6 +323,7 @@ export const DataTableView = ({ fields, value }) => {
             fields: rawFieldsSort,
             isH5: false,
             supportManyRelated: false,
+            showRelationWithTag: false,
         });
         return baseColumns;
     }, [rawFields]);
@@ -412,8 +422,8 @@ export const formatNumberFix = (val, field, setZero = false) => {
  * 根据 fields 信息生成 column
  * h5 和 pc 部分参数不同
  */
-export const getColumns = ({ columnSets = [], fields, isH5 = false, supportManyRelated, }) => fields === null || fields === void 0 ? void 0 : fields.map((item) => formatFieldToColumn(item, isH5, columnSets, supportManyRelated));
-const TableCell = ({ record, field, isH5, supportManyRelated }) => {
+export const getColumns = ({ columnSets = [], fields, isH5 = false, supportManyRelated, showRelationWithTag, }) => fields === null || fields === void 0 ? void 0 : fields.map((item) => formatFieldToColumn(item, isH5, columnSets, supportManyRelated, showRelationWithTag));
+const TableCell = ({ record, field, isH5, supportManyRelated, showRelationWithTag, }) => {
     const component = React.useMemo(() => {
         const { name } = field;
         const value = getFieldValue(name, record);
@@ -424,12 +434,14 @@ const TableCell = ({ record, field, isH5, supportManyRelated }) => {
                 relation: record[`@${name}`],
                 supportManyRelated,
                 isH5,
+                showRelationWithTag,
             }
             : {
                 modelType: 'table',
                 relation: record[`@${name}`],
                 supportManyRelated,
                 isH5,
+                showRelationWithTag,
             };
         return getFieldRender(field, extra)(value);
     }, [record, field, isH5]);
@@ -440,7 +452,7 @@ const TableCell = ({ record, field, isH5, supportManyRelated }) => {
  * 根据 field 属性，生成 column 配置
  * https://git.woa.com/QBase/lcap/common-application-specs/blob/master/types/platform/datasource.ts
  */
-export const formatFieldToColumn = (field, isH5, columnSets, supportManyRelated) => {
+export const formatFieldToColumn = (field, isH5, columnSets, supportManyRelated, showRelationWithTag) => {
     const { name, title } = field;
     // 计算列宽度，略大于计算宽度
     const width = getFieldWidth(field) + 10;
@@ -450,7 +462,7 @@ export const formatFieldToColumn = (field, isH5, columnSets, supportManyRelated)
         width: !item || (item === null || item === void 0 ? void 0 : item.widthType) === 'auto' || isIllegalWidth
             ? width
             : item === null || item === void 0 ? void 0 : item.width,
-        render: (record) => (_jsx(TableCell, { record: record, field: field, isH5: isH5, supportManyRelated: supportManyRelated })),
+        render: (record) => (_jsx(TableCell, { record: record, field: field, isH5: isH5, supportManyRelated: supportManyRelated, showRelationWithTag: showRelationWithTag })),
         key: name,
         slotKey: (item === null || item === void 0 ? void 0 : item.slotKey) || name,
         header: title,
@@ -725,7 +737,7 @@ const TableSlotCell = ({ record, rowKey, recordIndex, column, columnIndex, slot,
  * slots: object 模型表格作用域插槽
  * isH5: 判断自定义插槽列能否展示，目前是正常展示
  */
-export const filterCustomColumns = ({ columns, columnSets, slots, fields, isH5, supportManyRelated, }) => {
+export const filterCustomColumns = ({ columns, columnSets, slots, fields, isH5, supportManyRelated, showRelationWithTag, }) => {
     if (!Array.isArray(columnSets) || !(columnSets === null || columnSets === void 0 ? void 0 : columnSets.length))
         return columns;
     const columnSetsReg = columnSets.map((item) => {
@@ -774,6 +786,7 @@ export const filterCustomColumns = ({ columns, columnSets, slots, fields, isH5,
                     rowId: record._id,
                     supportManyRelated,
                     isH5,
+                    showRelationWithTag,
                 }
                 : {
                     modelType: 'table',
@@ -782,6 +795,7 @@ export const filterCustomColumns = ({ columns, columnSets, slots, fields, isH5,
                     rowId: record._id,
                     supportManyRelated,
                     isH5,
+                    showRelationWithTag,
                 };
             const value = getFieldValue(key, record, relatedField, isMany(_oriField));
             const component = getFieldRender(field, extra)(value);
@@ -897,12 +911,13 @@ export const getFixedColumnSets = ({ fixedFront = '', fixedEnd = '', columnSets,
 /**
  * 列管理字段转换
  */
-export const getTableColumns = ({ fields, columnSets, slots, fixedFront, fixedEnd, isH5, supportManyRelated, }) => {
+export const getTableColumns = ({ fields, columnSets, slots, fixedFront, fixedEnd, isH5, supportManyRelated, showRelationWithTag = true, }) => {
     const defaultColumns = getColumns({
         columnSets,
         fields,
         isH5: false,
         supportManyRelated,
+        showRelationWithTag,
     });
     let fixedColumnSets = columnSets;
     // h5端不冻结
@@ -920,6 +935,7 @@ export const getTableColumns = ({ fields, columnSets, slots, fixedFront, fixedEn
         fields,
         isH5,
         supportManyRelated,
+        showRelationWithTag,
     });
     return baseColumns.map((i) => ({
         ...i,

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

@@ -220,7 +220,7 @@ enablePagination = true, columnSelectType = 'select', defaultPageIndex = _defaul
     const renderTable = () => {
         return (_jsx(Table, { events: events, emptyText: emptyText, isH5: isH5, isNoDataSourceBind: isNoDataSourceBind, className: `${tableClassList} modal-table`, recordKey: recordKey, currentSize: tableHightSize, defaultPageIndex: defaultPageIndex, defaultPageSize: defaultPageSize, sortColumns: sortColumns, enablePagination: !isH5 && enablePagination, columnSelectType: columnSelectType, columns: columns, records: tableRecords, sort: queryParams.sort, selectedKeys: [], onSelectChange: () => { }, isError: false, isLoading: isTableLoading, rowColor: rowColor, queryParams: queryParams, total: total, setColumns: undefined, onQueryChange: (query) => {
                 setQueryParams({ ...queryParams, ...query });
-            }, rowClick: () => { }, errorObj: errorObj }));
+            }, rowClick: () => { }, cellClick: () => { }, errorObj: errorObj }));
     };
     return (_jsx(ConfigProvider, { classPrefix: classPrefix, children: _jsx(EnumHoc, { fields: authFields, children: _jsx("div", { className: classNames(wrapClassList, className), style: style, id: id, children: renderTable() }) }) }));
 });

package/dist/web/components/wd-table/components/Table/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare const BaseTableCom: ({ events, recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, errorObj, isLoading, queryParams, total, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot, }: {
+export declare const BaseTableCom: ({ events, recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, errorObj, isLoading, queryParams, total, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, cellClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot, }: {
     events: any;
     recordKey: any;
     className: any;
@@ -22,13 +22,14 @@ export declare const BaseTableCom: ({ events, recordKey, className, columns, set
     defaultPageSize: any;
     defaultPageIndex: any;
     rowClick: any;
+    cellClick: any;
     currentSize: any;
     isNoDataSourceBind: any;
     isH5: any;
     emptyText: any;
     __innerSlot?: React.ReactNode;
 }) => JSX.Element;
-export declare const BaseTable: React.MemoExoticComponent<({ events, recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, errorObj, isLoading, queryParams, total, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot, }: {
+export declare const BaseTable: React.MemoExoticComponent<({ events, recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, errorObj, isLoading, queryParams, total, onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, cellClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot, }: {
     events: any;
     recordKey: any;
     className: any;
@@ -51,6 +52,7 @@ export declare const BaseTable: React.MemoExoticComponent<({ events, recordKey,
     defaultPageSize: any;
     defaultPageIndex: any;
     rowClick: any;
+    cellClick: any;
     currentSize: any;
     isNoDataSourceBind: any;
     isH5: any;

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

@@ -33,7 +33,7 @@ const renderStatus = ({ isH5, status, isNoDataSourceBind, _emptyText, errorObj,
 // eslint-disable-next-line complexity
 export const BaseTableCom = ({ events, recordKey, className, columns, setColumns, records, sortColumns, sort, onSelectChange, selectedKeys, rowColor, isError, errorObj, isLoading, queryParams, total = defaultTotal, 
 // refreshTable,
-onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot = (_jsx(_Fragment, {})), }) => {
+onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageIndex, rowClick, cellClick, currentSize, isNoDataSourceBind, isH5, emptyText: _emptyText, __innerSlot = (_jsx(_Fragment, {})), }) => {
     var _a;
     const inEditor = isInIde();
     const tableRef = useRef(null);
@@ -87,8 +87,17 @@ onQueryChange, enablePagination, columnSelectType, defaultPageSize, defaultPageI
                         : undefined,
                 },
                 className: rowColor ? 'modal-table-rowcolor' : '',
-                onClick: () => {
-                    rowClick(context);
+                onClick: (e) => {
+                    if (rowClick) {
+                        rowClick(e, context);
+                    }
+                },
+            }),
+            cell: (props, context) => ({
+                onClick: (e) => {
+                    if (cellClick) {
+                        cellClick(e, context);
+                    }
                 },
             }),
         }),

package/dist/web/components/wd-table/hooks/useChooseList.d.ts

@@ -11,4 +11,5 @@ export declare const useChooseList: ({ dataSourceAPI, queryParams, childDbName,
     total: number;
     isValidating: boolean;
     empty: () => void;
+    getRelationOptions: () => Promise<void>;
 };

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

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useCallback } from 'react';
 const defaultPage = 1;
 const getDataBase = (format, fields) => {
     const filter = fields.filter((item) => (item === null || item === void 0 ? void 0 : item.format) === format);
@@ -37,41 +37,69 @@ export const mapResult = (records, primaryColumn) => {
     return records === null || records === void 0 ? void 0 : records.map((childItem) => ({
         value: childItem._id,
         text: childItem[primaryColumn] ? childItem[primaryColumn] : childItem._id,
+        label: childItem[primaryColumn] ? childItem[primaryColumn] : childItem._id,
+        extra: childItem,
     }));
 };
 export const useChooseList = ({ dataSourceAPI, queryParams, childDbName, primaryColumn, value, }) => {
     const [option, setOption] = useState([]);
     const [total, setTotal] = useState(0);
     const [loading, setLoading] = useState(true);
-    useEffect(() => {
-        async function fetchData() {
-            setLoading(true);
-            const [result, itemResult] = await Promise.all([
-                dataSourceAPI.getRecordList(queryParams, {
-                    db: childDbName,
-                }),
-                value
-                    ? dataSourceAPI.getRecord(value, {
-                        db: childDbName,
-                    })
-                    : Promise.resolve(),
-            ]);
-            let transformedRecords = [...((result === null || result === void 0 ? void 0 : result.records) || [])];
-            if (value &&
-                transformedRecords.findIndex((item) => item._id === value) < 0) {
-                transformedRecords = [itemResult, ...transformedRecords];
+    const unshiftVal = (transformedRecords, itemResult) => {
+        if (itemResult &&
+            transformedRecords.findIndex((item) => item._id === itemResult._id) < 0 &&
+            option.findIndex((item) => item._id === itemResult._id) < 0) {
+            return [itemResult, ...transformedRecords];
+        }
+        return transformedRecords;
+    };
+    const fetchData = useCallback(async () => {
+        setLoading(true);
+        const isMultiple = Array.isArray(value);
+        const promiseList = [
+            dataSourceAPI.getRecordList(queryParams, {
+                db: childDbName,
+            }),
+        ];
+        if (value === null || value === void 0 ? void 0 : value.length) {
+            if (isMultiple) {
+                value.forEach((i) => {
+                    if (i) {
+                        promiseList.push(dataSourceAPI.getRecord(i, {
+                            db: childDbName,
+                        }));
+                    }
+                });
             }
-            let optionRes = mapResult(transformedRecords, primaryColumn);
-            if ((queryParams === null || queryParams === void 0 ? void 0 : queryParams.pageNo) > defaultPage) {
-                optionRes = [...option, ...optionRes];
+            else {
+                promiseList.push(dataSourceAPI.getRecord(value, {
+                    db: childDbName,
+                }));
             }
-            setOption(optionRes);
-            setTotal(result === null || result === void 0 ? void 0 : result.total);
-            setLoading(false);
         }
-        fetchData();
+        const [result, ...rest] = await Promise.all(promiseList);
+        let transformedRecords = [...((result === null || result === void 0 ? void 0 : result.records) || [])];
+        const itemResult = [...rest];
+        // 若下拉列表中无选中值，则将选中值插到数组头部
+        if ((isMultiple && (value === null || value === void 0 ? void 0 : value.length)) || value) {
+            itemResult.forEach((i) => {
+                transformedRecords = unshiftVal(transformedRecords, i);
+            });
+        }
+        let optionRes = mapResult(transformedRecords, primaryColumn);
+        if ((queryParams === null || queryParams === void 0 ? void 0 : queryParams.pageNo) > defaultPage) {
+            optionRes = [...option, ...optionRes];
+        }
+        setOption(optionRes);
+        setTotal(result === null || result === void 0 ? void 0 : result.total);
+        setLoading(false);
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [childDbName, queryParams]);
+    }, [childDbName, primaryColumn, queryParams]);
+    useEffect(() => {
+        if (childDbName) {
+            fetchData();
+        }
+    }, [childDbName, fetchData]);
     return {
         result: option || [],
         total: total,
@@ -79,5 +107,6 @@ export const useChooseList = ({ dataSourceAPI, queryParams, childDbName, primary
         empty: () => {
             setOption([]);
         },
+        getRelationOptions: fetchData,
     };
 };

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

@@ -674,13 +674,13 @@ export const WdTable = forwardRef(function TableComp(tableProps, ref) {
     }, [isH5]);
     const hasFilterButton = !!filterFieldsData.length && !isExpression;
     // 行点击事件
-    const rowClick = (context) => {
+    const rowClick = (e, context) => {
         if (events === null || events === void 0 ? void 0 : events.tabTableRow) {
             events.tabTableRow({
                 record: context.record,
                 rowKey: context.rowKey,
                 recordIndex: context.recordIndex,
-            });
+            }, { originEvent: e });
         }
         setRowData({
             record: context.record,
@@ -688,6 +688,11 @@ export const WdTable = forwardRef(function TableComp(tableProps, ref) {
             recordIndex: context.recordIndex,
         });
     };
+    const cellClick = (e, context) => {
+        if (events === null || events === void 0 ? void 0 : events.cellClick) {
+            events.cellClick(context, { originEvent: e });
+        }
+    };
     // 选择事件
     const onSelectChange = (keys, context, empty = false) => {
         if (empty) {
@@ -750,7 +755,7 @@ export const WdTable = forwardRef(function TableComp(tableProps, ref) {
                                     enableTableHeightSizeBtn ||
                                     hasFilterButton) && (_jsx(ToolBar, { hasFilterButton: hasFilterButton, total: total, refreshTable: onRefreshBtnClick, setTableHightSize: setTableHightSize, currentSize: tableHightSize, setOpenMobileFilter: () => {
                                     setOpenMobileFilter(true);
-                                }, enableRefreshBtn: enableRefreshBtn, enableTableHeightSizeBtn: enableTableHeightSizeBtn, enablePagination: enablePagination })), _jsx(Table, { events: events, 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, isLoading: isTableLoading, rowColor: rowColor, queryParams: queryParams, total: total, onQueryChange: onQueryChange, rowClick: rowClick, isError: errorStatus, errorObj: errorMsg, __innerSlot: __innerSlot }), 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, { columnSets: columnSets, dbName: dbName, datasourceTitle: datasourceTitle, fields: fields, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, isImportFileModalByApiVisible: isImportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, refresh: refreshTable, supportManyRelated: supportManyRelated }), _jsx(ExportFileModal, { whereList: wList, fields: fields, columns: mapColumKey(columns), isExportFileModalByApiVisible: isExportFileModalByApiVisible, selectedKeys: selectedKeys, dbName: dbName, query: query, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, supportManyRelated: supportManyRelated }), _jsx(InOrOutRecordModal, { dbName: dbName, isInOrOutRecordModalVisible: isInOrOutRecordModalVisible, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible }), isH5 && (_jsx(Modal, { overlayClassName: `${classPrefix}-h5-table-overlay`, className: `${classPrefix}-h5-table-option-modal-wrap`, disableCloseIcon: true, title: "\u64CD\u4F5C", visible: isMobileOptionVisible, outerRef: modalRef, events: {
+                                }, enableRefreshBtn: enableRefreshBtn, enableTableHeightSizeBtn: enableTableHeightSizeBtn, enablePagination: enablePagination })), _jsx(Table, { events: events, 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, isLoading: isTableLoading, rowColor: rowColor, queryParams: queryParams, total: total, onQueryChange: onQueryChange, rowClick: rowClick, cellClick: cellClick, isError: errorStatus, errorObj: errorMsg, __innerSlot: __innerSlot }), 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, { columnSets: columnSets, dbName: dbName, datasourceTitle: datasourceTitle, fields: fields, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, isImportFileModalByApiVisible: isImportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, refresh: refreshTable, supportManyRelated: supportManyRelated }), _jsx(ExportFileModal, { whereList: wList, fields: fields, columns: mapColumKey(columns), isExportFileModalByApiVisible: isExportFileModalByApiVisible, selectedKeys: selectedKeys, dbName: dbName, query: query, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible, supportManyRelated: supportManyRelated }), _jsx(InOrOutRecordModal, { dbName: dbName, isInOrOutRecordModalVisible: isInOrOutRecordModalVisible, setIsImportFileModalByApiVisible: setIsImportFileModalByApiVisible, setIsExportFileModalByApiVisible: setIsExportFileModalByApiVisible, setIsInOrOutRecordModalVisible: setIsInOrOutRecordModalVisible }), isH5 && (_jsx(Modal, { overlayClassName: `${classPrefix}-h5-table-overlay`, className: `${classPrefix}-h5-table-option-modal-wrap`, disableCloseIcon: true, title: "\u64CD\u4F5C", visible: isMobileOptionVisible, outerRef: modalRef, events: {
                             close: () => {
                                 setIsMobileOptionVisible(false);
                             },

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

@@ -26,7 +26,7 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
     const size = useSize(props);
     const textareaRef = useRef(null);
     const counter = typeof value === 'string' ? value.length : 0;
-    const wrapRef = useRef(null);
+    const [isFocus, setIsFocus] = useState(focus);
     const root = `${classPrefix}-${classRoot}`;
     const inputWrap = `${classPrefix}-form-input-wrap`;
     const textareaWrap = `${classPrefix}-form-textarea-wrap`;
@@ -34,6 +34,7 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
         'size-width-hundred': true,
         'is-disabled': disabled,
         'textarea-restriction': counterVisible,
+        'is-focused': isFocus,
     });
     const countCls = `${textareaWrap}__label ${root}-${classRoot}__count-text`;
     const displayValue = (_a = (zhRef.current ? zhValue : value)) !== null && _a !== void 0 ? _a : '';
@@ -71,10 +72,12 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
     };
     const onFocus = function (e) {
         var _a;
+        setIsFocus(true);
         (_a = events.focus) === null || _a === void 0 ? void 0 : _a.call(events, { value: e.target.value }, { originEvent: e });
     };
     const onBlur = function (e) {
         var _a;
+        setIsFocus(false);
         (_a = events.blur) === null || _a === void 0 ? void 0 : _a.call(events, { value: e.target.value }, { originEvent: e });
     };
     const handleZhStart = () => {
@@ -105,5 +108,5 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
         disabled,
         readOnly,
     }), [innerHandle, name, value, label, required, visible, disabled, readOnly]);
-    return (visible && (_jsx(WdFormItem, { ...props, validateErrorMsg: validateErrorMsg, validateState: validateState, readOnly: readOnly, disabled: disabled, readValue: value, classRoot: classRoot, inputId: inputId, layout: props.layout, children: _jsxs("div", { className: cls, ref: wrapRef, onFocus: () => wrapRef.current.classList.add('is-focused'), onBlur: () => wrapRef.current.classList.remove('is-focused'), children: [_jsx("textarea", { id: inputId, ref: textareaRef, rows: 2, placeholder: placeholder, name: name, value: displayValue, maxLength: maxLength, autoFocus: focus, disabled: disabled, readOnly: readOnly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: handleKeyDown, onCompositionStart: handleZhStart, onCompositionEnd: handleZhEnd, ...startWithOnProps }), counterVisible && (_jsxs("label", { className: countCls, children: [counter, "/", maxLength] }))] }) })));
+    return (visible && (_jsx(WdFormItem, { ...props, validateErrorMsg: validateErrorMsg, validateState: validateState, readOnly: readOnly, disabled: disabled, readValue: value, classRoot: classRoot, inputId: inputId, layout: props.layout, children: _jsxs("div", { className: cls, children: [_jsx("textarea", { id: inputId, ref: textareaRef, rows: 2, placeholder: placeholder, name: name, value: displayValue, maxLength: maxLength, autoFocus: focus, disabled: disabled, readOnly: readOnly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: handleKeyDown, onCompositionStart: handleZhStart, onCompositionEnd: handleZhEnd, ...startWithOnProps }), counterVisible && (_jsxs("label", { className: countCls, children: [counter, "/", maxLength] }))] }) })));
 });

package/dist/web/utils/platform.js

@@ -284,12 +284,12 @@ export const textToString = (text) => {
  * 统一错误提示
  */
 export function alertErrorMessage({ message, duration = 3000, icon = 'none' }) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
     const smallScreen = (_b = (_a = window === null || window === void 0 ? void 0 : window.matchMedia('(max-width: 768px)')) === null || _a === void 0 ? void 0 : _a.matches) !== null && _b !== void 0 ? _b : isH5Platform();
     const touchDevice = (_d = (_c = window === null || window === void 0 ? void 0 : window.matchMedia('(pointer:coarse)')) === null || _c === void 0 ? void 0 : _c.matches) !== null && _d !== void 0 ? _d : smallScreen;
     const platform = touchDevice || smallScreen ? 'h5' : 'pc';
-    if (platform === 'h5') {
-        (_e = window === null || window === void 0 ? void 0 : window.app) === null || _e === void 0 ? void 0 : _e.showToast({
+    if (platform === 'h5' && ((_e = window === null || window === void 0 ? void 0 : window.app) === null || _e === void 0 ? void 0 : _e.showToast)) {
+        (_f = window === null || window === void 0 ? void 0 : window.app) === null || _f === void 0 ? void 0 : _f.showToast({
             title: message,
             icon,
             duration,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "3.10.1",
+  "version": "3.11.0",
   "main": "./dist/index.js",
   "module": "./dist/index",
   "miniprogram": "mpdist",
@@ -274,7 +274,7 @@
         "!.temp/dist/*.map"
       ],
       "webpack": false,
-      "limit": "900 KB"
+      "limit": "950 KB"
     }
   ],
   "nyc": {