diff --git a/packages/plugins/map/src/client/block/MapBlock.tsx b/packages/plugins/map/src/client/block/MapBlock.tsx index a1197a3da1..40f9192aa1 100644 --- a/packages/plugins/map/src/client/block/MapBlock.tsx +++ b/packages/plugins/map/src/client/block/MapBlock.tsx @@ -14,14 +14,13 @@ const defaultImage = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAA/CAYAAACM5Lr9AAAFkklEQVR42s3VaWxUVRjG8ddiEKPRxAQTCVSWLnZaWmjpTgulpYUBExP9Agou4IKAogUKAgItlNJCgUIXINFPfsFoDCjibkQRI0QIICAQWUpZugKtpcv0+DxyYqaTe2/vTLf58Etu7znnPf+0k44opQw5i5qsjIFs2APHoBZatFq+02vZeq94yyKs0dOjsAzOTCtuVtNKWtX0UpeaXqHU07tgt4ZnvuMa93Avz/CsniE2WIQV3iEaCDnQ8F/MTgZ4h2d4ljNgmZ4pFszDpmIRIuFP57YWDMcFu7uHMziLMyEKxJBl2MbbM6DZub2NQ3sUZ3K2vkMMGIdNKbi1ADqcZe1q2i7VKzibd8BCEE8GUQ3PQ4ez3KWcGNCbeAfv0neKm85hWRvqo+Hu1LJ2HuwTvAt3tkAciKbDIDO/7iE4l7X9rpqCA30pa3uLwt3nYRAIuIfV5mcWN6msnapf8G405IGQMGry+prB0DiloqPfwng3G3SLDltXnTt5S6PK3NnRr9jAFhDJyLsZAJcz8SGcjOr+xAa0XGGTpOfeSMrYUKcyKlx+gS1oSkbY9VXpm2+rjHKXX2ALm2TS2qq96duaVHp5u19gC5skbc3V05N23FWT8NIfsIVNkra6siGttE2llbX7h9JWhaZ6mfj+lfaJZW3Kn6DJJRNWXWqbgN+Y39jRqtDUKKkrL15PxfdjammrfyhpVmiqlNQVfx9KwX/cFJT6A7awSVLeu1CeUlinxu9o8QsphbUKTWUyfvn5Wcm511QSXvoDtrBJkpedewzaE/E58wdsYZMopSQ55+z+pKK6fo9KKqpXaDkAIgxLWnomK3H1JZVQ0tyv2ICW6XAvLHHJ6QD4K6GgRsVjQ3/g3WzQLffCKGHJqfHgisOXaNy2f/oU7+TdukGIUW5xJ0vic6+oWGzsS7yTd4NoncPiF594GC7FFlSrcVub+gTv4p36btE6h1Fc9nFn7IpzKmZrY5/gXbwTxI0O8xD77rGPYtZeVtE42Jt4B+8C8WAcNu6dPwZDzVh8PYzdcqdXcDbvgMdBPDHEOG7R0Xkxqy6oKAzpDZzNO0AMmIfFvH1kABwZk1epIotv9yjOxOyj+g4xYB4W/dbvlAAdozGsJ3Gmni0mzMPGLvyN6IMo/NojNt/qEZyFmR+CWLAIW3CYaDDUR+D/TTgGdwdncJaeKRbMw8bM/9XdosjlZ5VjU0O3cAZngXTBPCzqzV/cPQAXHeuqVBgu8IVj/TXFGXqWdME8LHLez55mRSw9qUI31fuEZzFjNogNFmFvHPQUACfC8IUbUlTvlbDcSsWzeobYYB42+vWfjDwbnn3c6zCewdnnQGwyD4t47UcjAXA2JO+qCi6ss4V7eUafFZuswn4wM8ex+LgKwqV2cC/OzAXxgnlY+KvfmxkIVaPyr6tRhbWWuId79RnxgnmYY+53VlaHLj2lRm6stRSSc0ph7xoQL1mEzfnWyhPQNrKgGgE1hrjGPTAExEvmYWGvfNOVPUErz6vhiDDCNez5GMQHVmFfd2Vq6MLD6smCGkNc4x4QH5iHPfXyV125H64NX1eFkOpO+I5reo/4wDws9KUDdhSPxFdNIGLc8R3XQHxkFfalHYnB8w6qYRuqO+E7roH4yDws5MX9dtwHlYF5lQi6qYjPfKfXxEcWYbO/sKtsBP50QxFFI/D/De8qQLrBPCwYizY9M2r+of/D+Mx3ID6zDJv1uaVwGfAIBDqGJsbhZ9eQ/BuK+OwYlhzPNe7hXh9Yhe0zwqBB4IAYouCZn1wIXH5GEZ/d1sjBMzzrBfOwoBf2GWFYBMS4C03JWRA087OaoBmf3uCz5zrP8Kx9lmF7jXiE2RbBs95ghB0MIo8/pS0OeJAzvOBLmKY//BAGURBN+jmMa3qPkLdh/wKOL8SpLbnYFgAAAABJRU5ErkJggg=='; export const MapBlock = (props) => { - const { fieldNames, dataSource = [], fixedBlock, zoom, selectedRecordKeys, setSelectedRecordKeys } = useProps(props); + const { fieldNames, dataSource = [], fixedBlock, zoom, setSelectedRecordKeys } = useProps(props); const { getField, getPrimaryKey } = useCollection(); const field = getField(fieldNames?.field); const [isMapInitialization, setIsMapInitialization] = useState(false); const mapRef = useRef(); const geometryUtils: AMap.IGeometryUtil = mapRef.current?.aMap?.GeometryUtil; const [record, setRecord] = useState(); - const [visible, setVisible] = useState(false); const [selectingMode, setSelecting] = useState(''); const { t } = useMapTranslation(); const compile = useCompile(); @@ -166,7 +165,6 @@ export const MapBlock = (props) => { } if (data) { - setVisible(true); setRecord(data); } }; @@ -241,9 +239,7 @@ export const MapBlock = (props) => { ) : null} - - - + { }; const MapBlockDrawer = (props) => { - const { visible, setVisible } = props; + const { setVisible, record } = props; const fieldSchema = useFieldSchema(); const schema: Schema = useMemo( () => @@ -276,8 +272,10 @@ const MapBlockDrawer = (props) => { return ( schema && ( - - + + + + ) ); diff --git a/packages/plugins/map/src/client/components/AMap.tsx b/packages/plugins/map/src/client/components/AMap.tsx index 134af781f7..f341ea564c 100644 --- a/packages/plugins/map/src/client/components/AMap.tsx +++ b/packages/plugins/map/src/client/components/AMap.tsx @@ -19,6 +19,10 @@ export interface AMapComponentProps { onChange?: (value: number[]) => void; disabled?: boolean; mapType: string; + /** + * only ReadPretty + */ + readonly: string; zoom: number; type: MapEditorType; style?: React.CSSProperties; @@ -80,7 +84,7 @@ export interface AMapForwardedRefProps { const AMapComponent = React.forwardRef((props, ref) => { const { accessKey, securityJsCode } = useMapConfiguration(props.mapType) || {}; - const { value, onChange, block = false, disabled = block, zoom = 13, overlayCommonOptions } = props; + const { value, onChange, block = false, readonly, disabled = block, zoom = 13, overlayCommonOptions } = props; const { t } = useMapTranslation(); const fieldSchema = useFieldSchema(); const aMap = useRef(); @@ -252,7 +256,7 @@ const AMapComponent = React.forwardRef { if (!aMap.current) return; - if (!value || overlay.current) { + if (!value || (!readonly && overlay.current)) { return; } @@ -260,10 +264,11 @@ const AMapComponent = React.forwardRef { @@ -285,6 +290,7 @@ const AMapComponent = React.forwardRef { if (!mouseTool.current || !editor.current) return; const target = editor.current.getTarget(); @@ -310,7 +316,7 @@ const AMapComponent = React.forwardRef { - setTimeout(() => { + requestIdleCallback(() => { map.current = new amap.Map(id.current, { resizeEnable: true, zoom, @@ -318,7 +324,7 @@ const AMapComponent = React.forwardRef { if (err.includes('多个不一致的 key')) { @@ -393,17 +399,23 @@ const AMapComponent = React.forwardRef} > -
- -
+ {type !== 'point' ? ( +
+ +
+ ) : null} +
{ @@ -30,6 +30,7 @@ const AMapConfiguration = ({ type }) => { type, }) .then((res) => { + sessionStorage.removeItem(getSSKey(type)); message.success(t('Saved successfully')); }) .catch((err) => { diff --git a/packages/plugins/map/src/client/components/ReadPretty.tsx b/packages/plugins/map/src/client/components/ReadPretty.tsx index f250eee11a..b9ac54c2fa 100644 --- a/packages/plugins/map/src/client/components/ReadPretty.tsx +++ b/packages/plugins/map/src/client/components/ReadPretty.tsx @@ -1,5 +1,5 @@ import { useField, useFieldSchema, useForm } from '@formily/react'; -import { EllipsisWithTooltip, useCollection, useTableBlockContext } from '@nocobase/client'; +import { EllipsisWithTooltip, useCollection } from '@nocobase/client'; import React, { useEffect } from 'react'; import AMapComponent from './AMap'; @@ -10,8 +10,7 @@ const ReadPretty = (props) => { const collectionField = getField(fieldSchema.name); const mapType = props.mapType || collectionField?.uiSchema['x-component-props']?.mapType; const field = useField(); - const form = useForm() - + const form = useForm(); useEffect(() => { if (!field.title && collectionField?.uiSchema?.title) { field.title = collectionField.uiSchema.title; @@ -28,7 +27,7 @@ const ReadPretty = (props) => { ); } - return mapType === 'amap' ? : null; + return mapType === 'amap' ? : null; }; export default ReadPretty; diff --git a/packages/plugins/map/src/client/hooks/useMapConfiguration.ts b/packages/plugins/map/src/client/hooks/useMapConfiguration.ts index 824922c919..1790c1b569 100644 --- a/packages/plugins/map/src/client/hooks/useMapConfiguration.ts +++ b/packages/plugins/map/src/client/hooks/useMapConfiguration.ts @@ -1,15 +1,38 @@ -import { useRequest } from "@nocobase/client"; +import { useRequest } from '@nocobase/client'; +import { useMemo } from 'react'; export const MapConfigurationResourceKey = 'map-configuration'; +export const getSSKey = (type) => { + return `NOCOBASE_PLUGIN_MAP_CONFIGURATION_${type}`; +}; export const useMapConfiguration = (type: string) => { - return useRequest({ - resource: MapConfigurationResourceKey, - action: 'get', - params: { - type, + // cache + const config = useMemo(() => { + const d = sessionStorage.getItem(getSSKey(type)); + if (d) { + return JSON.parse(d); + } + return d; + }, [type]); + + if (config) return config; + + return useRequest( + { + resource: MapConfigurationResourceKey, + action: 'get', + params: { + type, + }, }, - }).data?.data; -} - - + { + onSuccess(data) { + sessionStorage.setItem(getSSKey(type), JSON.stringify(data?.data)); + }, + refreshOnWindowFocus: false, + refreshDeps: [], + manual: config ? true : false, + }, + ).data?.data; +};