@cloudbase/weda-ui 3.1.3 → 3.1.4

package/dist/configs/components/carousel.json

@@ -83,7 +83,7 @@
                     "properties": {
                         "title": {
                             "type": "string",
-                            "title": "图片标题",
+                            "title": "标题",
                             "default": "图片1",
                             "x-index": 20
                         },
@@ -95,7 +95,7 @@
                                     "pattern": "^(((https?)://)|/resources/)[^\\s]+$"
                                 }
                             ],
-                            "title": "图片1",
+                            "title": "图片",
                             "default": "https://main.qcloudimg.com/raw/828ee6644f137d166b063ad7f5dda842.png",
                             "x-index": 30
                         },

package/dist/configs/components/form/checkbox.json

@@ -34,6 +34,7 @@
                         "target": "range",
                         "schema": {
                             "items": {
+                                "path": "range.*",
                                 "type": "object",
                                 "display": "label",
                                 "properties": {

package/dist/configs/components/form/form.json

@@ -2,24 +2,44 @@
     "$schema": "https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json",
     "data": {
         "properties": {
+            "formType": {
+                "type": "string",
+                "title": "表单场景",
+                "default": "create"
+            },
+            "datasourceType": {
+                "type": "string",
+                "title": "数据源类型",
+                "default": "model"
+            },
+            "dataSourceName": {
+                "type": "string",
+                "title": "数据模型"
+            },
+            "_id": {
+                "type": "string",
+                "title": "数据标识(_id)"
+            },
+            "methodCreate": {
+                "type": "string",
+                "title": "新增方法"
+            },
+            "methodGetItem": {
+                "type": "string",
+                "title": "查询方法"
+            },
+            "paramGetItem": {
+                "type": "object",
+                "title": "查询入参"
+            },
+            "methodUpdate": {
+                "type": "string",
+                "title": "更新方法"
+            },
             "layout": {
-                "x-platforms": ["PCWEB"],
-                "enum": [
-                    {
-                        "label": "水平",
-                        "value": "horizontal"
-                    },
-                    {
-                        "label": "垂直",
-                        "value": "vertical"
-                    }
-                ],
                 "type": "string",
                 "title": "布局方式",
-                "default": "horizontal",
-                "x-index": 50,
-                "x-category": "基础属性",
-                "remarks": "设置当前容器内表单类组件的标题和输入选择区域为左右布局或上下布局"
+                "default": "horizontal"
             },
             "contentSlot": {
                 "type": "slot",
@@ -35,6 +55,10 @@
         {
             "name": "reset",
             "title": "重置"
+        },
+        {
+            "name": "onInitValue",
+            "title": "获取初始值"
         }
     ],
     "meta": {

package/dist/configs/components/form/select.json

@@ -341,6 +341,7 @@
                         "target": "range",
                         "schema": {
                             "items": {
+                                "path": "range.*",
                                 "display": "label",
                                 "type": "object",
                                 "properties": {

package/dist/web/components/chart/common/core/eChartBar.js

@@ -43,7 +43,9 @@ class EchartBar extends EchartBase {
                             data: [],
                         };
                         sortedXAxisData.forEach((itemSource, index) => {
-                            this.config.series[j].name = itemSource.YLabels[j].Cn_Name;
+                            var _a, _b;
+                            this.config.series[j].name =
+                                (_b = (_a = itemSource.YLabels[j]) === null || _a === void 0 ? void 0 : _a.Cn_Name) !== null && _b !== void 0 ? _b : itemSource.YLabels[j].Name;
                             if ((itemSource.YLabels[j].Value === undefined ||
                                 itemSource.YLabels[j].Value === null) &&
                                 !xIsCountEmpty) {

package/dist/web/components/chart/common/core/eChartLine.js

@@ -43,7 +43,9 @@ class EchartLine extends EchartBase {
                             data: [],
                         };
                         sortedXAxisData.forEach((itemSource, index) => {
-                            this.config.series[j].name = itemSource.YLabels[j].Cn_Name;
+                            var _a, _b;
+                            this.config.series[j].name =
+                                (_b = (_a = itemSource.YLabels[j]) === null || _a === void 0 ? void 0 : _a.Cn_Name) !== null && _b !== void 0 ? _b : itemSource.YLabels[j].Name;
                             if ((itemSource.YLabels[j].Value === undefined ||
                                 itemSource.YLabels[j].Value === null) &&
                                 !xIsCountEmpty) {

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

@@ -35,7 +35,7 @@ name = 'formCheckbox', label = '标题', labelVisible = true, format = '', enumN
     // 两次range不同时, 需要刷新checkedItems
     const prevRangeRef = React.useRef();
     React.useEffect(() => {
-        if (!isObjectEqual(prevRangeRef.current, option)) {
+        if (!isObjectEqual(prevRangeRef.current, option, true)) {
             prevRangeRef.current = JSON.parse(JSON.stringify(option));
             setCheckedItems(fromEntries(option.map(({ value, checked }) => [value, !!checked])));
         }

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

@@ -7,3 +7,7 @@
   padding-left: 1.71429rem;
   padding-right: 1.71429rem;
 }
+
+.weda-form-toast .weui-icon_toast {
+  display: none !important;
+}

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

@@ -1,13 +1,32 @@
 /// <reference types="react" />
-import './index.css';
 import type { CommonFormPropsType } from '../types';
-export default function Form({ className, contentSlot, style, id, layout, }: {
+import './index.css';
+/**
+ * 表单容器组件
+ */
+export default function Form({ className, contentSlot, style, id, layout, formType, datasourceType, dataSourceName, _id, methodGetItem, paramGetItem, events, appCloud, }: {
     className: any;
     contentSlot: any;
     style: any;
     id: any;
     layout: any;
+    formType: any;
+    datasourceType: any;
+    dataSourceName: any;
+    _id: any;
+    methodGetItem: any;
+    paramGetItem: any;
+    events: any;
+    appCloud?: any;
 }): JSX.Element;
 export interface PropsType extends CommonFormPropsType {
     contentSlot?: any;
+    formType?: string;
+    datasourceType?: string;
+    dataSourceName?: string;
+    _id?: string;
+    methodCreate?: string;
+    methodGetItem?: string;
+    paramGetItem?: any;
+    methodUpdate?: string;
 }

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

@@ -1,19 +1,16 @@
 import * as React from 'react';
 import classNames from '../../../utils/classnames';
+import { ConfigProvider, Form as TeaForm, message as TeaMessage, } from 'tea-component';
+import { usePlatform, isInIde } from '../../../utils/platform';
+import { callDataSource, callConnector } from '../../../utils/tcb';
+import weui from '../../../utils/weui';
 import './index.css';
-import { ConfigProvider, Form as TeaForm } from 'tea-component';
-import { usePlatform } from '../../../utils/platform';
-export default function Form({ 
-// 系统属性
-className, 
-// 组件属性
-// title,
-// description,
-// tips,
-contentSlot, 
-// buttonSlot,
-style, id, layout, }) {
-    const platform = usePlatform();
+/**
+ * 表单容器组件
+ */
+export default function Form({ className, contentSlot, style, id, layout, formType, datasourceType, dataSourceName, _id, methodGetItem, paramGetItem, events, appCloud = { callDataSource, callConnector }, }) {
+    const platform = usePlatform(); // h5 | web
+    const isDataModel = !['connector', 'custom-connector'].includes(datasourceType); // 是否为数据模型，兼容历史 undefined
     const cls = classNames({
         'weda-ui': true,
         'weda-form': true,
@@ -22,10 +19,87 @@ style, id, layout, }) {
         'gsd-h5-react-form-pc': platform === 'pc',
         [className]: className,
     });
-    if (platform === 'pc') {
+    const timeRef = React.useRef(null);
+    React.useEffect(() => {
+        const getData = async () => {
+            var _a, _b;
+            try {
+                let initValue = {};
+                if (isDataModel) {
+                    // 数据模型查询条件
+                    if (formType === 'edit' && dataSourceName) {
+                        initValue = await appCloud.callDataSource({
+                            dataSourceName,
+                            methodName: 'wedaGetItem',
+                            params: { _id },
+                        }, true);
+                        if (Object.keys(initValue).length !== 0) {
+                            (_a = events === null || events === void 0 ? void 0 : events.onInitValue) === null || _a === void 0 ? void 0 : _a.call(events, initValue);
+                        }
+                        else {
+                            alertError(platform);
+                        }
+                    }
+                }
+                else {
+                    // 连接器查询条件
+                    if (formType === 'edit' &&
+                        dataSourceName &&
+                        methodGetItem &&
+                        paramGetItem) {
+                        initValue = await appCloud.callConnector({
+                            dataSourceName,
+                            methodName: methodGetItem,
+                            params: paramGetItem,
+                        }, true);
+                        if (Object.keys(initValue).length !== 0) {
+                            (_b = events === null || events === void 0 ? void 0 : events.onInitValue) === null || _b === void 0 ? void 0 : _b.call(events, initValue);
+                        }
+                    }
+                }
+            }
+            catch (e) {
+                alertError(platform);
+            }
+        };
+        if (dataSourceName && formType === 'edit') {
+            if ((isDataModel && _id) ||
+                (!isDataModel && paramGetItem && methodGetItem)) {
+                clearTimeout(timeRef.current);
+                timeRef.current = setTimeout(() => getData(), 100);
+            }
+        }
+    }, [
+        formType,
+        isDataModel,
+        dataSourceName,
+        _id,
+        platform,
+        methodGetItem,
+        paramGetItem,
+    ]);
+    // pc 渲染
+    const renderPc = () => {
         return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
             React.createElement(TeaForm, { layout: layout, className: cls, style: style, id: id }, contentSlot)));
+    };
+    // h5 渲染
+    const renderH5 = () => {
+        return (React.createElement("div", { className: cls, style: style, id: id },
+            React.createElement("div", { className: "weui-cells__group weui-cells__group_form" }, contentSlot)));
+    };
+    return platform === 'pc' ? renderPc() : renderH5();
+}
+/**
+ * 根据平台不同，展示不同的错误提示消息
+ */
+function alertError(platform = 'h5', message = '更新场景下未查询到数据') {
+    if (isInIde())
+        return;
+    if (platform === 'h5') {
+        weui.toast(message, { className: 'weda-form-toast' });
+    }
+    else {
+        TeaMessage.error({ content: message });
     }
-    return (React.createElement("div", { className: cls, style: style, id: id },
-        React.createElement("div", { className: "weui-cells__group weui-cells__group_form" }, contentSlot)));
 }

package/dist/web/components/form/location/common/mapChoose.js

@@ -123,9 +123,7 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
                 ],
             });
             // 监听中心点变化事件，更新marker的位置
-            map.on('center_changed', updateCenter);
-            map.on('drag', clearChooseLoc);
-            map.on('zoom', clearChooseLoc);
+            map.on('drag', mapDrag);
         }
     };
     const initCircle = (TMap, map) => {
@@ -153,23 +151,14 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
             new TMap.MultiCircle(circle);
         }
     };
-    const clearChooseLoc = () => {
-        setChooseLoc({});
-    };
-    const updateCenter = () => {
+    const mapDrag = () => {
         const TMap = getTMap();
         const canLoad = TMap && lat && lng && mapRef.current;
         if (canLoad) {
             const currentLocationsLatlng = currentLocations.latlng;
-            const nowPosition = new TMap.LatLng(currentLocationsLatlng.lat, currentLocationsLatlng.lng);
             let centerPosition = mapRef.current.getCenter();
             centerRef.current = centerPosition;
             markerRef.current.updateGeometries([
-                {
-                    id: `pointer-origin-${mapDomName}`,
-                    styleId: 'originPointer',
-                    position: nowPosition,
-                },
                 {
                     id: `pointer-${mapDomName}`,
                     styleId: 'pointer',
@@ -178,21 +167,27 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
             ]);
             exploreNear('updateCenter');
             // 计算距离
-            if (getRadius()) {
-                let latlng1 = {
-                    latitude: currentLocationsLatlng.lat,
-                    longitude: currentLocationsLatlng.lng,
-                };
-                let latlng2 = {
-                    latitude: centerPosition.getLat(),
-                    longitude: centerPosition.getLng(),
-                };
-                const distance = calculateDistance(latlng1, latlng2);
-                let isOutof = getRadius() && getRadius() < distance;
-                setIsOutofrange(isOutof);
-                if (!isPC) {
-                    changeSearchBoxHeight(false, isOutof);
-                }
+            compareDistance(currentLocationsLatlng, {
+                lat: centerPosition.getLat(),
+                lng: centerPosition.getLng(),
+            });
+        }
+    };
+    const compareDistance = (currentLocation, centerPosition) => {
+        if (getRadius()) {
+            let latlng1 = {
+                latitude: currentLocation.lat,
+                longitude: currentLocation.lng,
+            };
+            let latlng2 = {
+                latitude: centerPosition.lat,
+                longitude: centerPosition.lng,
+            };
+            const distance = calculateDistance(latlng1, latlng2);
+            let isOutof = getRadius() && getRadius() < distance;
+            setIsOutofrange(isOutof);
+            if (!isPC) {
+                changeSearchBoxHeight(false, isOutof, true);
             }
         }
     };
@@ -221,23 +216,88 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
                 let list = [...exploreList, ...res.data];
                 if (searchListPageSize.current === 1) {
                     list = res.data;
+                    setRealLocation({ lat, lng }, list);
+                }
+                else {
+                    setExploreList(list);
                 }
-                setExploreList(list);
+            }
+            else {
+                setRealLocation({ lat, lng }, []);
             }
         })
             .catch((error) => {
             setSearchLoadingStatus(false);
+            setRealLocation({ lat, lng }, []);
             console.log('explore error', error);
         });
     }, 500);
+    // 逆解析查询当前经纬度地址
+    const setRealLocation = (location, list) => {
+        const { lat, lng } = location;
+        let TMap = getTMap();
+        const Geocoder = new TMap.service.Geocoder();
+        Geocoder.getAddress({
+            location: new TMap.LatLng(lat, lng),
+        })
+            .then(({ status, result }) => {
+            var _a;
+            if (status == 0) {
+                let address = result.address;
+                let title = (_a = result === null || result === void 0 ? void 0 : result.formatted_addresses) === null || _a === void 0 ? void 0 : _a.recommend;
+                let item = {
+                    id: 'current-location',
+                    location: {
+                        lat,
+                        lng,
+                    },
+                    title: title ? title : address,
+                    address,
+                };
+                setChooseLoc(item);
+                changeLocation(item);
+                setExploreList([item, ...list]);
+            }
+        })
+            .catch((error) => {
+            console.log('getAddress error', error);
+            let item = {
+                id: 'current-location',
+                location: {
+                    lat,
+                    lng,
+                },
+                title: '[位置]',
+                address: '暂无地址信息',
+            };
+            setChooseLoc(item);
+            changeLocation(item);
+            setExploreList([item]);
+        });
+    };
     const chooseLoction = (value, type) => {
         const TMap = getTMap();
         //定义地图中心点坐标
         const center = new TMap.LatLng(value.location.lat, value.location.lng);
         mapRef.current.setCenter(center);
+        markerRef.current.updateGeometries([
+            {
+                id: `pointer-${mapDomName}`,
+                styleId: 'pointer',
+                position: center,
+            },
+        ]);
         setChooseLoc(value);
         changeLocation(value);
-        type && cancleSearch();
+        if (type) {
+            setExploreList([]);
+            cancleSearch();
+            mapDrag();
+        }
+        else {
+            const currentLocationsLatlng = currentLocations.latlng;
+            compareDistance(currentLocationsLatlng, value.location);
+        }
     };
     const changeSearchValue = (event) => {
         if (event.target.value) {
@@ -288,12 +348,9 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
         document.getElementsByClassName('map-choose-header_search_input')[0].blur();
         touchCoordinate.current.startY = event.changedTouches[0].clientY;
     };
-    const changeSearchBoxHeight = (status, currentOutofrange) => {
+    const changeSearchBoxHeight = (status, currentOutofrange, isInDrag) => {
         // 搜索区域默认 328px ，上拉 75% ，当超出范围多一个超出提示 46px
-        let isOut = isOutofrange;
-        if (currentOutofrange) {
-            isOut = currentOutofrange;
-        }
+        let isOut = isInDrag ? currentOutofrange : isOutofrange;
         const boxHeight = Math.ceil(clientHeight * 0.75);
         let searchBoxHeights = isOut ? 328 - 46 : 328;
         if (status) {
@@ -404,6 +461,7 @@ export default function MapChoose({ changeLocation, onConfirm, onClose, currentL
             mapRef.current.setCenter(nowPosition);
             searchListPageSize.current = 1;
             setChooseLoc({});
+            mapDrag();
         }
     };
     const getConfirm = () => {

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

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

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

@@ -0,0 +1,55 @@
+import React, { useMemo } from 'react';
+import { ConfigProvider, Select as TeaSelect, } from 'tea-component';
+import classNames from '../../../../utils/classnames';
+import { noop } from '../../../../utils/constant';
+import { useSyncValue } from '../../../../utils/useSyncValue';
+import weui from '../../../../utils/weui';
+export function PureSelectPc(props) {
+    const { size, onChange = noop, disabled, placeholder } = props;
+    const [value, setValue] = useSyncValue(props.value);
+    const options = useMemo(() => {
+        var _a;
+        return ((_a = props.options) !== null && _a !== void 0 ? _a : []).map((opt) => ({
+            text: opt.label,
+            value: opt.value,
+        }));
+    }, [props.options]);
+    return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+        React.createElement("div", { "data-testid": "form-select" },
+            React.createElement(TeaSelect, { matchButtonWidth: true, size: size, onChange: (v) => {
+                    onChange(v);
+                    setValue(v);
+                }, disabled: disabled, value: value, type: "simulate", appearance: "button", placeholder: placeholder, options: options }))));
+}
+export function PureSelectH5(props) {
+    const { placeholder, name, disabled, onChange = noop, options, layout, className, } = props;
+    const [value, setValue] = useSyncValue(props.value);
+    const subCls = classNames({
+        'weui-cell': true,
+        'weui-cell_active': true,
+        'weui-cell_form': true,
+        'weui-flex__item': layout !== 'vertical',
+        'weui-cell_disabled': disabled,
+    });
+    const onClick = () => {
+        weui.picker(options, {
+            id: String(Date.now()),
+            defaultValue: [value || options[0].value],
+            onConfirm(result) {
+                const item = result[0];
+                setValue(item.value);
+                onChange(item.value);
+            },
+            className,
+        });
+    };
+    const currentLabel = useMemo(() => {
+        const currentOpt = options.find((opt) => opt.value === value);
+        if (!currentOpt)
+            return '';
+        return currentOpt.label;
+    }, [options, value]);
+    return (React.createElement("div", { className: subCls },
+        React.createElement("div", { className: "weui-cell__bd weui-flex" },
+            React.createElement("input", { onClick: onClick, className: "weui-input", type: "select", name: name, placeholder: placeholder, value: currentLabel, disabled: disabled, autoComplete: 'off', readOnly: true, "data-testid": "form-item-select" }))));
+}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { PropsType } from './index';
-export default function Select({ events, name, placeholder, layout, mode, dateMode, disabled, range, where, primaryField, tipBlock, enumName, dataSourceName, viewId, format, defaultValue, startDate, endDate, defaultDate, startTime, endTime, defaultTime, defaultRegion, defaultMutiRegion, regionType, separator, onChange, }: PropsType): JSX.Element;
+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, onChange, }: PropsType): JSX.Element;
 export declare function decodeIsoDatetime(isoStringOrTimesnap: any, type: any, dateMode?: string): any;
 /**
  * 根据时间模式，构造 new Date()的传参格式单个日期和时间组件值