@cloudbase/weda-ui 3.4.16 → 3.5.1

package/dist/web/components/form/select/allTimePicker/calendar.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import './calendar.css';
 import { weeks } from './dataUtils';
+import './style';
 /**
  * 日历组件
  */

package/dist/web/components/form/select/allTimePicker/dataUtils.d.ts

@@ -0,0 +1,25 @@
+export declare const weeks: string[];
+export declare const defaultData: () => {
+    id: string;
+    value: any[];
+}[];
+export declare const defaultDateTime: {
+    id: string;
+    value: string[];
+}[];
+export declare const getIndex: (index: any) => any;
+export declare const getLast: (index: any, array: any) => any;
+export declare const getFormatData: (data: any) => any;
+/**
+ * 动态获取日期时间数组的下标
+ */
+export declare const getCurrentYearIndex: () => any;
+export declare const getCurrentMonthIndex: () => any;
+export declare const getCurrentHoursIndex: () => any;
+export declare const getCurrentMinutesIndex: () => any;
+export declare const getCurrentSecondsIndex: () => number;
+export declare const isSpace: (str: any) => boolean;
+export declare const getIOSNotNaNDate: (data: any) => any;
+export declare const getLastDate: () => string;
+export declare const getStartDate: () => string;
+export declare const isTime: (date: any) => boolean;

package/dist/web/components/form/select/allTimePicker/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import type { CommonFormPropsType } from '../../types';
+import './style';
+/**
+ *  年月日时分秒日期选择器
+ */
+export default function AllTimePicker({ startDate, endDate, defaultDate, title, onAllTimeCallback, }: PropsType): JSX.Element;
+export interface PropsType extends CommonFormPropsType {
+    title?: string;
+    startDate?: string;
+    endDate?: string;
+    defaultDate?: string;
+    onAllTimeCallback: (val: string[]) => void;
+}

package/dist/web/components/form/select/allTimePicker/index.js

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from 'react';
 import Calendar from './calendar';
 import { Portal } from '../../../common/portal';
-import './index.css';
 import { defaultData, defaultDateTime, getCurrentHoursIndex, getCurrentMinutesIndex, getCurrentMonthIndex, getCurrentSecondsIndex, getCurrentYearIndex, getFormatData, getIndex, getIOSNotNaNDate, getLastDate, getStartDate, isSpace, isTime, } from './dataUtils';
+import './style';
 /**
  *  年月日时分秒日期选择器
  */
@@ -860,7 +860,7 @@ export default function AllTimePicker({ startDate, endDate, defaultDate, title,
         }
         return value === null || value === void 0 ? void 0 : value.replace(name, v);
     };
-    return (_jsx(Portal, { type: "div", children: _jsxs("div", { className: "weda-ui-custom-picker", children: [_jsx("div", { className: "weda-ui-custom-backdrop", "data-testid": "allTime-backdrop", onClick: () => {
+    return (_jsx(Portal, { type: "div", disableOutsidePointerEvents: true, disableOutsideScroll: true, children: _jsxs("div", { className: "weda-ui-custom-picker", children: [_jsx("div", { className: "weda-ui-custom-backdrop", "data-testid": "allTime-backdrop", onClick: () => {
                         onAllTimeCallback([]);
                     } }), _jsxs("div", { className: "weda-ui-custom-picker__inner", children: [_jsxs("div", { className: "weda-ui-custom-picker__header", children: [_jsx("div", { "data-testid": "allTime-cancel", className: "weda-ui-custom-picker__header-cancle", onClick: () => {
                                         onAllTimeCallback([]);

package/dist/web/components/form/select/allTimePicker/style.d.ts

@@ -0,0 +1,3 @@
+import './calendar.css';
+import './index.css';
+import '../../../style';

package/dist/web/components/form/select/allTimePicker/style.js

@@ -0,0 +1,3 @@
+import './calendar.css';
+import './index.css';
+import '../../../style';

package/dist/web/components/form/select/dropdown-select/h5.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import './style';
+export declare function SelectPickerH5({ updateValue, selectedValue, options, isTurnPages, loadMore, onSearchValue, reTry, status, isShow, params, }: {
+    updateValue: any;
+    selectedValue: any;
+    options: any;
+    isTurnPages: any;
+    loadMore: any;
+    onSearchValue: any;
+    reTry: any;
+    status: any;
+    isShow: any;
+    params: any;
+}): JSX.Element;

package/dist/web/components/form/select/dropdown-select/h5.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState, useMemo } from 'react';
 import { Portal } from '../../../common/portal';
-import './index.css';
 import { Status } from '../status';
 import Loading from '../status/loading';
 import Retry from '../status/retry';
 import Empty from '../status/empty';
 import AllEmpty from '../status/allEmpty';
 import { PAGE_SIZE, requestFatherRelatedOption, RequestOptionType, } from '../request';
+import './style';
 export function SelectPickerH5({ updateValue, selectedValue, options, isTurnPages, loadMore, onSearchValue, reTry, status, isShow, params, }) {
     const focusRef = useRef();
     const contentRef = useRef();
@@ -24,6 +24,7 @@ export function SelectPickerH5({ updateValue, selectedValue, options, isTurnPage
                 searchValue === '') {
                 // 没找到接口查询，该代码只执行一次，使用options.length > PAGE_SIZE限制
                 if (index === -1) {
+                    // 本地没找到
                     ((params === null || params === void 0 ? void 0 : params.dataSourceName) || (params === null || params === void 0 ? void 0 : params.viewId)) &&
                         requestFatherRelatedOption(params, 1, RequestOptionType.EQUAL, selectedValue).then((value) => {
                             if (value && value.option.length > 0) {
@@ -37,11 +38,9 @@ export function SelectPickerH5({ updateValue, selectedValue, options, isTurnPage
                             }
                         });
                 }
-                else {
-                    // eslint-disable-next-line rulesdir/no-call-upper-scope-func-in-use-memo -- 改不动了
-                    updateValue(options[index], true, false);
-                }
             }
+            // eslint-disable-next-line rulesdir/no-call-upper-scope-func-in-use-memo -- 改不动了
+            updateValue(options[index], true, false);
             return index;
         }
         else {
@@ -87,7 +86,7 @@ export function SelectPickerH5({ updateValue, selectedValue, options, isTurnPage
             loadMore();
         }
     };
-    return isShow ? (_jsx(Portal, { type: "div", children: _jsxs("div", { className: "weda-ui-custom-picker", children: [_jsx("div", { className: "weda-ui-custom-backdrop", onClick: () => {
+    return isShow ? (_jsx(Portal, { type: "div", disableOutsidePointerEvents: true, disableOutsideScroll: true, children: _jsxs("div", { className: "weda-ui-custom-picker", children: [_jsx("div", { className: "weda-ui-custom-backdrop", onClick: () => {
                         setInputFocus(false);
                         setSearchValue('');
                         updateValue(undefined, false, true);

package/dist/web/components/form/select/dropdown-select/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare function PureSelect({ params, selectedValue, updateValue, placeholder, size, disabled, isShow, }: {
+    params: any;
+    selectedValue: any;
+    updateValue: any;
+    placeholder: any;
+    size: any;
+    disabled: any;
+    isShow: any;
+}): JSX.Element;

package/dist/web/components/form/select/dropdown-select/index.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { SelectPickerH5 } from './h5';
-import { formatNeedDataFetch, PAGE_SIZE, requestEnumOption, requestFatherRelatedOption, RequestOptionType, transFormatTeaSelectKey, } from '../request';
+import { PAGE_SIZE, requestEnumOption, requestFatherRelatedOption, RequestOptionType, transFormatTeaSelectKey, } from '../request';
 import SelectPickerPc from './pc';
 import { usePlatform } from '../../../../utils/platform';
 import { Status } from '../status';
+import { isFormatNeedFetch, isSingleForeignFormat } from '../formats-util';
 import { useDebouncedEffect, useDeepCompareEffect } from '@react-hookz/web';
 export function PureSelect({ params, selectedValue, updateValue, placeholder, size, disabled, isShow, }) {
     const isRequestingRef = useRef(false);
@@ -24,11 +25,11 @@ export function PureSelect({ params, selectedValue, updateValue, placeholder, si
             format: '',
             controlledValue: [],
         };
-        const isTurnPages = format === 'father-son' || format === 'related';
+        const isTurnPages = isSingleForeignFormat(format);
         setFormat(format);
         setIsTurnPages(isTurnPages);
         // 手动配置
-        if (!formatNeedDataFetch.includes(format)) {
+        if (!isFormatNeedFetch(format)) {
             if (controlledValue.length === 0) {
                 setStatus(Status.ALl_EMPTY);
             }
@@ -87,7 +88,15 @@ export function PureSelect({ params, selectedValue, updateValue, placeholder, si
         requestFatherRelatedOption(params, pageNo, RequestOptionType.SEARCH, searchValue)
             .then((value) => {
             if (isSearch) {
-                setSearchOptions((opt) => opt.concat(value.option));
+                if (pageNo === 1) {
+                    setSearchOptions(value.option);
+                }
+                else {
+                    setSearchOptions((oldOptions) => {
+                        const newOptions = value.option.filter((item) => oldOptions.findIndex((i) => i.value === item.value) < 0);
+                        return oldOptions.concat(newOptions);
+                    });
+                }
                 if (pageNo === 1 && value.option.length === 0) {
                     setSearchStatus(Status.EMPTY);
                 }

package/dist/web/components/form/select/dropdown-select/pc.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import './style';
+export default function SelectPickerPc({ format, selectedValue, updateValue, placeholder, size, disabled, reTry, loadMore, status, options, onSearchValue, defaultSearchValue, findData, }: {
+    format: any;
+    selectedValue: any;
+    updateValue: any;
+    placeholder: any;
+    size: any;
+    disabled: any;
+    reTry: any;
+    loadMore: any;
+    status: any;
+    options: any;
+    onSearchValue: any;
+    defaultSearchValue: any;
+    findData: any;
+}): JSX.Element;

package/dist/web/components/form/select/dropdown-select/pc.js

@@ -6,7 +6,7 @@ import Loading from '../status/loading';
 import Retry from '../status/retry';
 import { Status } from '../status';
 import Empty from '../status/empty';
-import './index.css';
+import './style';
 export default function SelectPickerPc({ format, selectedValue, updateValue, placeholder, size, disabled, reTry, loadMore, status, options, onSearchValue, defaultSearchValue, findData, }) {
     const [showDelete, setShowDelete] = useState(false);
     const [optList, setOptList] = useState(options);

package/dist/web/components/form/select/dropdown-select/style.d.ts

@@ -0,0 +1,2 @@
+import './index.css';
+import '../../../style';

package/dist/web/components/form/select/dropdown-select/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../../../style';

package/dist/web/components/form/select/dropdown-select/ui.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { SelectProps } from 'tea-component';
+import { IUseoptionsParams } from '../request';
+interface IPureSelectProps extends Pick<SelectProps, 'size' | 'disabled' | 'value' | 'placeholder' | 'button'> {
+    name?: string;
+    onChange: (v: string) => void;
+    layout?: 'horizontal' | 'vertical';
+    className?: string;
+    params: IUseoptionsParams;
+    readOnly?: boolean;
+}
+export declare function PureSelectPc(props: IPureSelectProps): JSX.Element;
+export declare function PureSelectH5(props: IPureSelectProps): JSX.Element;
+export {};

package/dist/web/components/form/select/formats-util.d.ts

@@ -0,0 +1,5 @@
+declare const SINGLE_FOREIGN_FORMATS: readonly ["father-son", "related", "many-one", "one-one", "one-one-r"];
+export type TSingleForeignFormat = typeof SINGLE_FOREIGN_FORMATS[number];
+export declare function isSingleForeignFormat(format: string): format is TSingleForeignFormat;
+export declare function isFormatNeedFetch(format: string): boolean;
+export {};

package/dist/web/components/form/select/formats-util.js

@@ -0,0 +1,15 @@
+const SINGLE_FOREIGN_FORMATS = [
+    'father-son',
+    'related',
+    'many-one',
+    'one-one',
+    'one-one-r',
+];
+/** do NOT export this array */
+const formatNeedDataFetch = [...SINGLE_FOREIGN_FORMATS, 'x-enum'];
+export function isSingleForeignFormat(format) {
+    return SINGLE_FOREIGN_FORMATS.includes(format);
+}
+export function isFormatNeedFetch(format) {
+    return formatNeedDataFetch.includes(format);
+}

package/dist/web/components/form/select/h5.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { PropsType } from './index';
+export default function Select({ events, name, placeholder, layout, mode, dateMode, disabled, range, where, primaryField, enumName, dataSourceName, viewId, format, defaultValue, startDate, endDate, defaultDate, startTime, endTime, defaultTime, defaultRegion, defaultMutiRegion, separator, regionType, clearable, onChange, readOnly, }: PropsType): JSX.Element;
+export declare function decodeIsoDatetime(isoStringOrTimesnap: any, type: any, dateMode?: string): any;
+/**
+ * 根据时间模式，构造 new Date()的传参格式单个日期和时间组件值
+ */
+export declare const getFormatNewDateParams: (type: string, timeStr: string) => any[];
+/**
+ * 根据时间模式，将 picker 返回的值转成对应的 年-月-日
+ */
+export declare const formatDateModeValue: (result?: any[], dateMode?: string) => any;
+/**
+ * 不同时间模式对应的展示格式
+ */
+export declare const getDateModeFormat: (dateMode?: string) => "YYYY-MM-DD HH:mm:ss" | "YYYY" | "YYYY-MM" | "YYYY-MM-DD";

package/dist/web/components/form/select/h5.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import weui from '../../../utils/weui';
@@ -11,6 +11,9 @@ import { emptyObject } from '../../../utils/constant';
 import { PureSelectH5 } from './dropdown-select/ui';
 import AllTimePicker from './allTimePicker';
 import { getIOSNotNaNDate, isTime } from './allTimePicker/dataUtils';
+import { isSingleForeignFormat } from './formats-util';
+import { WdIcon } from '../../wd-icon';
+import { useConfig } from '../../../utils/config-context';
 export default function Select({ 
 // 系统属性
 events = emptyObject, 
@@ -23,8 +26,9 @@ startDate, endDate, defaultDate,
 // time mode
 startTime, endTime, defaultTime, 
 // region mode
-defaultRegion, defaultMutiRegion, separator, regionType, onChange, }) {
-    var _a;
+defaultRegion, defaultMutiRegion, separator, regionType, clearable = false, onChange, readOnly, }) {
+    var _a, _b;
+    const { classPrefix } = useConfig();
     const [date, setDate] = React.useState(decodeIsoDatetime(defaultDate, 'date', dateMode));
     const [time, setTime] = React.useState(decodeIsoDatetime(defaultTime, 'time'));
     const [regioDepth, setRegionDepth] = React.useState(3);
@@ -76,6 +80,11 @@ defaultRegion, defaultMutiRegion, separator, regionType, onChange, }) {
             };
         }
     });
+    const hasClearMode = ['date', 'time', 'datetime'].includes(mode);
+    const clearCls = classNames({
+        'weda-picker--date': hasClearMode,
+        'is-hover': hasClearMode && clearable && (date || time),
+    });
     //实现初始值触发change事件
     const defaultMutiRegionChange = function (treeValue, defaultMutiRegion) {
         var _a;
@@ -339,7 +348,7 @@ defaultRegion, defaultMutiRegion, separator, regionType, onChange, }) {
     let params = {
         controlledValue: range,
     };
-    if (format === 'father-son' || format === 'related') {
+    if (isSingleForeignFormat(format)) {
         params = {
             format,
             dataSourceName,
@@ -357,17 +366,24 @@ defaultRegion, defaultMutiRegion, separator, regionType, onChange, }) {
         };
     }
     if (mode === 'selector') {
-        return (_jsx(PureSelectH5, { className: "weda-ui weda-picker", name: name, value: selectedValue, placeholder: placeholder, disabled: disabled, params: params, onChange: (value) => {
+        return (_jsx(PureSelectH5, { className: "weda-ui weda-picker", name: name, value: selectedValue, placeholder: placeholder, disabled: disabled, readOnly: readOnly, params: params, onChange: (value) => {
                 var _a;
                 setSelectedValue(value);
                 (_a = events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value });
                 onChange === null || onChange === void 0 ? void 0 : onChange(value);
             } }));
     }
-    return (_jsx("div", { className: subCls, children: _jsx("div", { className: "weui-cell__bd weui-flex", children: _jsx("input", { onClick: onClick, className: "weui-input", type: "select", name: name, placeholder: placeholder, value: (_a = result[mode]) !== null && _a !== void 0 ? _a : '', disabled: disabled, autoComplete: 'off', readOnly: true, "data-testid": "form-item-select" }) }) }));
+    return readOnly ? (_jsx("div", { className: classNames('weui-cell', `${classPrefix}-form-read-color`), children: (_a = result[mode]) !== null && _a !== void 0 ? _a : '' })) : (_jsx("div", { className: subCls, children: _jsxs("div", { className: `weui-cell__bd weui-flex ${clearCls}`, children: [_jsx("input", { onClick: onClick, className: "weui-input", type: "select", name: name, placeholder: placeholder, value: (_b = result[mode]) !== null && _b !== void 0 ? _b : '', disabled: disabled, autoComplete: 'off', readOnly: true, "data-testid": "form-item-select" }), hasClearMode && (_jsx(WdIcon, { name: "td:close-circle-filled", onClick: (e) => {
+                        var _a;
+                        e.stopPropagation();
+                        setDate(null);
+                        setTime(null);
+                        onChange === null || onChange === void 0 ? void 0 : onChange(null);
+                        (_a = events === null || events === void 0 ? void 0 : events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: null });
+                    } }))] }) }));
 }
 export function decodeIsoDatetime(isoStringOrTimesnap, type, dateMode = 'day') {
-    if (!isoStringOrTimesnap) {
+    if (isoStringOrTimesnap == null) {
         return null;
     }
     if (typeof isoStringOrTimesnap === 'string' &&
@@ -378,10 +394,12 @@ export function decodeIsoDatetime(isoStringOrTimesnap, type, dateMode = 'day') {
         }
     }
     if (type === 'time') {
-        const time = isoStringOrTimesnap.match &&
-            isoStringOrTimesnap.match(/^(\d{2}):(\d{2})$/);
-        if (time && time[1] < 24 && time[2] < 60) {
-            return moment().hour(time[1]).minute(time[2]).format('HH:mm');
+        if (typeof isoStringOrTimesnap === 'string') {
+            const time = isoStringOrTimesnap.match &&
+                isoStringOrTimesnap.match(/^(\d{2}):(\d{2})$/);
+            if (time && Number(time[1]) < 24 && Number(time[2]) < 60) {
+                return moment().hour(time[1]).minute(time[2]).format('HH:mm');
+            }
         }
         else if (typeof isoStringOrTimesnap === 'number') {
             const timeSnap = Number(isoStringOrTimesnap);

package/dist/web/components/form/select/index.css

@@ -39,3 +39,16 @@
 .select-region-pc .wedatea2td-cascader-menu--thin .wedatea2td-list > li {
   padding: 10px 24px 10px 8px;
 }
+
+.weda-picker--date {
+  display: flex;
+  align-items: center;
+}
+
+.weda-picker--date .t-icon-close-circle-filled {
+  display: none;
+}
+
+.weda-picker--date.is-hover .t-icon-close-circle-filled {
+  display: block;
+}

package/dist/web/components/form/select/index.d.ts

@@ -0,0 +1,74 @@
+import * as React from 'react';
+import './moment-locale';
+import './style';
+import type { CommonFormPropsType } from '../types';
+import { IUseoptionsParams } from './request';
+import { TSingleForeignFormat } from './formats-util';
+export declare const moment: any;
+declare const Select: React.NamedExoticComponent<PropsType>;
+export default Select;
+export interface PropsType extends CommonFormPropsType {
+    size: 's' | 'm' | 'l' | 'full';
+    placeholder: string;
+    mode: 'selector' | 'date' | 'time' | 'datetime' | 'region' | 'mutiRegion';
+    dateMode?: 'day' | 'month' | 'year' | 'datetime';
+    range?: any[];
+    defaultValue?: string;
+    dataSourceName?: string;
+    viewId?: string;
+    enumName?: string;
+    format?: TSingleForeignFormat | 'x-enum';
+    primaryField?: string;
+    tipBlock?: any;
+    where?: {
+        groupLogic?: null | 'or' | 'and';
+        logicData?: {
+            keyType?: 'field' | 'var-font';
+            key: string;
+            rel: 'eq' | 'neq' | 'lt' | 'gt' | 'gte' | 'lte' | 'in' | 'nin' | 'search';
+            value: any;
+            valueType?: 'const' | 'var-font' | 'relative-amount' | 'field';
+            expression?: string | boolean;
+            logic?: null | 'or' | 'and' | string;
+            extra?: {
+                type?: 'string' | 'number' | 'boolean' | 'object' | 'array' | string;
+                format?: string | null;
+                isExpression?: boolean;
+            };
+        }[];
+    }[];
+    startDate?: string;
+    endDate?: string;
+    defaultDate?: string;
+    startTime?: string;
+    endTime?: string;
+    defaultTime?: string | number;
+    defaultRegion?: any[];
+    regionType?: 'levelOne' | 'levelTwo' | 'levelThree';
+    separator?: string;
+    requiredFlag?: boolean;
+    regionTree?: any[];
+    defaultMutiRegion?: string;
+    onChange?: (v: any) => void;
+    params?: IUseoptionsParams;
+    isTurnPages?: boolean;
+    clearable?: boolean;
+    readOnly?: boolean;
+}
+export declare const defaultProps: {
+    events: {};
+    label: string;
+    size: "l";
+    labelVisible: boolean;
+    name: string;
+    placeholder: string;
+    layout: string;
+    mode: string;
+    disabled: boolean;
+    requiredFlag: boolean;
+    range: {
+        name: string;
+        value: string;
+    }[];
+    separator: string;
+};

package/dist/web/components/form/select/index.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import * as _moment from 'moment';
-import 'moment/locale/zh-cn';
+import './moment-locale';
+import './style';
 import { usePlatform } from '../../../utils/platform';
 import SelectH5, { decodeIsoDatetime } from './h5';
 import classNames from '../../../utils/classnames';
@@ -14,6 +15,8 @@ import { getAreaCode, getRegionTree } from './region';
 import { CommonErrorBoundary } from '../../common/error-boundary';
 import { useLoopRenderDetect } from '../../common/use-loop-render-detect';
 import { PureSelectPc } from './dropdown-select/ui';
+import { isSingleForeignFormat } from './formats-util';
+import { useConfig } from '../../../utils/config-context';
 // @ts-ignore TODO: fix 与plugin构建阶段效果不同
 export const moment = (typeof _moment === 'function' ? _moment : _moment.default);
 const Select = React.memo(function Select(props) {
@@ -69,7 +72,8 @@ export const defaultProps = {
     separator: ',',
 };
 // const button = <Button type="icon" icon="more" />;
-function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, enumName, defaultValue, placeholder = '请选择', mode = 'selector', dateMode = 'day', events = emptyObject, disabled = false, range = defaultProps.range, startDate, endDate, defaultDate, defaultTime, startTime, endTime, defaultRegion, defaultMutiRegion, regionType, separator = defaultProps.separator, size = defaultProps.size, onChange, }) {
+function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, enumName, defaultValue, placeholder = '请选择', mode = 'selector', dateMode = 'day', events = emptyObject, disabled = false, range = defaultProps.range, startDate, endDate, defaultDate, defaultTime, startTime, endTime, defaultRegion, defaultMutiRegion, regionType, separator = defaultProps.separator, size = defaultProps.size, clearable = false, onChange, readOnly, }) {
+    const { classPrefix } = useConfig();
     // 两次默认值不同, 需要刷新
     const prevDefaultRef = React.useRef();
     const [date, setDate] = React.useState(decodeIsoDatetime(defaultDate, 'date'));
@@ -82,7 +86,7 @@ function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, e
     let params = {
         controlledValue: range,
     };
-    if (format === 'father-son' || format === 'related') {
+    if (isSingleForeignFormat(format)) {
         params = {
             format,
             dataSourceName,
@@ -156,8 +160,11 @@ function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, e
     const onDataChange = (value) => {
         var _a;
         let finalVal;
-        if (mode === 'date') {
-            finalVal = value.valueOf();
+        if (value == null) {
+            finalVal = value;
+        }
+        else if (mode === 'date') {
+            finalVal = value === null || value === void 0 ? void 0 : value.valueOf();
         }
         else if (mode === 'time') {
             finalVal = (value.hour() * 60 * 60 + value.minute() * 60) * 1000;
@@ -199,26 +206,35 @@ function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, e
                     value: date ? moment(date) : undefined,
                     'data-testid': 'form-item-select',
                     size,
+                    clearable,
                 };
                 if (dateMode === 'year') {
-                    return (_jsx(YearPicker, { ...dateProps, range: [
+                    return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: moment.isMoment(dateProps.value)
+                            ? dateProps.value.format('YYYY')
+                            : '' })) : (_jsx(YearPicker, { ...dateProps, range: [
                             startDate && dateProps.range[0],
                             endDate && dateProps.range[1],
                         ] }));
                 }
                 else if (dateMode === 'month') {
-                    return (_jsx(DatePicker.MonthPicker, { className: sizeClassName, ...dateProps }));
+                    return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: moment.isMoment(dateProps.value)
+                            ? dateProps.value.format('YYYY-MM')
+                            : '' })) : (_jsx(DatePicker.MonthPicker, { className: sizeClassName, ...dateProps }));
                 }
                 else if (dateMode === 'datetime') {
                     const startFormat = decodeIsoDatetime(startDate, 'date', 'datetime');
                     const endFormat = decodeIsoDatetime(endDate, 'date', 'datetime');
-                    return (_jsx(DatePicker, { showTime: true, className: sizeClassName, ...dateProps, range: [
+                    return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: moment.isMoment(dateProps.value)
+                            ? dateProps.value.format('YYYY-MM-DD HH:mm:ss')
+                            : '' })) : (_jsx(DatePicker, { showTime: true, className: sizeClassName, ...dateProps, range: [
                             moment(startFormat, 'YYYY-MM-DD HH:mm:ss'),
                             moment(endFormat, 'YYYY-MM-DD HH:mm:ss'),
                         ] }));
                 }
                 else {
-                    return _jsx(DatePicker, { className: sizeClassName, ...dateProps });
+                    return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: moment.isMoment(dateProps.value)
+                            ? dateProps.value.format('YYYY-MM-DD')
+                            : '' })) : (_jsx(DatePicker, { className: sizeClassName, ...dateProps }));
                 }
             }
             case 'time': {
@@ -226,12 +242,12 @@ function SelectPc({ name, where, dataSourceName, viewId, format, primaryField, e
                     ? decodeIsoDatetime(startTime, 'time')
                     : '00:00';
                 const end = endTime ? decodeIsoDatetime(endTime, 'time') : '23:59';
-                return (_jsx(TimePicker, { className: sizeClassName, onChange: onDataChange, disabled: disabled, placeholder: placeholder, value: time ? moment(time, 'HH:mm') : undefined, range: [moment(start, 'HH:mm'), moment(end, 'HH:mm')], format: "HH:mm" }));
+                return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: time })) : (_jsx(TimePicker, { className: sizeClassName, onChange: onDataChange, disabled: disabled, placeholder: placeholder, value: time ? moment(time, 'HH:mm') : undefined, range: [moment(start, 'HH:mm'), moment(end, 'HH:mm')], format: "HH:mm", clearable: clearable }));
             }
             case 'region':
-                return (_jsx(Cascader, { clearable: true, searchable: true, type: "menu", disabled: disabled, data: regionTree, multiple: false, onChange: onDataChange, className: sizeClassName, overlayClassName: "select-region-pc", valueRender: (options) => options.map(({ label, value }, index) => (_jsxs(React.Fragment, { children: [index !== 0 && `${separator}`, label || value] }, `${value}-${index}`))), value: region }));
+                return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: region })) : (_jsx(Cascader, { clearable: true, searchable: true, type: "menu", disabled: disabled, data: regionTree, multiple: false, onChange: onDataChange, className: sizeClassName, overlayClassName: "select-region-pc", valueRender: (options) => options.map(({ label, value }, index) => (_jsxs(React.Fragment, { children: [index !== 0 && `${separator}`, label || value] }, `${value}-${index}`))), placeholder: placeholder, value: region }));
             case 'mutiRegion':
-                return (_jsx(Cascader, { clearable: true, searchable: true, className: sizeClassName, overlayClassName: "select-region-pc", type: "menu", disabled: disabled, data: regionTree, multiple: false, onChange: onDataChange, valueRender: (options) => options.map(({ label, value }, index) => (_jsxs(React.Fragment, { children: [index !== 0 && ',', label || value] }, `${value}-${index}`))), value: mutiRegion }));
+                return readOnly ? (_jsx("div", { className: `${classPrefix}-select__disabled`, children: mutiRegion })) : (_jsx(Cascader, { clearable: true, searchable: true, className: sizeClassName, overlayClassName: "select-region-pc", type: "menu", disabled: disabled, data: regionTree, multiple: false, onChange: onDataChange, valueRender: (options) => options.map(({ label, value }, index) => (_jsxs(React.Fragment, { children: [index !== 0 && ',', label || value] }, `${value}-${index}`))), value: mutiRegion, placeholder: placeholder }));
         }
     };
     const dropdown = createDropdown();

package/dist/web/components/form/select/moment-locale.d.ts

@@ -0,0 +1 @@
+import 'moment/locale/zh-cn';

package/dist/web/components/form/select/moment-locale.js

@@ -0,0 +1 @@
+import 'moment/locale/zh-cn';

package/dist/web/components/form/select/region/index.d.ts

@@ -0,0 +1,6 @@
+export declare function getRegionTree(regionData: any, regionType: any, regionMode: any): any;
+export declare function regionPicker(options: any, regionTree: any[]): void;
+/**
+ * 获取运行态地区数据
+ */
+export declare function getAreaCode(): Promise<any>;