diff --git a/src/editor/Catalog/index.tsx b/src/editor/Catalog/index.tsx index 0be61b7..7c3cc63 100644 --- a/src/editor/Catalog/index.tsx +++ b/src/editor/Catalog/index.tsx @@ -63,28 +63,31 @@ const Catalog = () => { }); return ( -
- - - - - - - - - - - - - - - - - -
+ <> +
覆盖物
+
+ + + + + + + + + + + + + + + + + +
+ ); }; diff --git a/src/editor/Catalog/style.less b/src/editor/Catalog/style.less index 1ec78d3..59f69fe 100644 --- a/src/editor/Catalog/style.less +++ b/src/editor/Catalog/style.less @@ -19,6 +19,6 @@ background-color: #e5e6e7; } .catalog-wrapper{ - height: 100%; + height: calc(100% - 36px); overflow-y: scroll; } \ No newline at end of file diff --git a/src/editor/Property/FineInput.tsx b/src/editor/Property/FineInput.tsx index 3298d5a..e549eb2 100644 --- a/src/editor/Property/FineInput.tsx +++ b/src/editor/Property/FineInput.tsx @@ -1,5 +1,5 @@ import { Input } from "antd"; -import { useState } from "react"; +import { useEffect, useState } from "react"; export type FineInputProps = { value: string | number; @@ -7,7 +7,11 @@ export type FineInputProps = { }; export const FineInput = (props: FineInputProps) => { - const [value, setValue] = useState(props.value); + const [value, setValue] = useState(""); + + useEffect(() => { + setValue(props.value); + }, [props]); return ( { const selectedIds = useSelector(selectedIdsSelector); const { overlays } = useSelector(mapOptionsSelector); - if (!selectedIds?.length) return <>; + if (!selectedIds?.length) + return ( + <> +
覆盖物
+ + ); const [id] = selectedIds; const overlay = overlays.find((overlay) => overlay.id === id)!; const { lngLat = [0, 0] } = overlay; @@ -69,40 +74,43 @@ const Property = () => { ); return ( -
-
- - - updateOverlayProps({ - id: overlay.id, - name: value, - }) - } - /> - - {overlay.type === OverlayTypes.Point ? positionPane : categoryPane} - {overlay.category === OverlayCategory.Building ? ( - + <> +
覆盖物
+
+ + updateOverlayProps({ id: overlay.id, - height: +value, + name: value, }) } /> - ) : null} - {overlay.type === OverlayTypes.Rectangle ? ( - - - - ) : null} - -
+ {overlay.type === OverlayTypes.Point ? positionPane : categoryPane} + {overlay.category === OverlayCategory.Building ? ( + + + updateOverlayProps({ + id: overlay.id, + height: +value, + }) + } + /> + + ) : null} + {overlay.type === OverlayTypes.Rectangle ? ( + + + + ) : null} + +
+ ); }; diff --git a/src/editor/index.less b/src/editor/index.less index db53325..ff196fd 100644 --- a/src/editor/index.less +++ b/src/editor/index.less @@ -66,6 +66,12 @@ body ::-webkit-scrollbar-thumb { body ::-webkit-scrollbar-corner { background-color: #eee; } +.pane-title{ + line-height: 24px; + padding:6px 12px; + background-color: #dbd8d8; + // color: #fff; +} /* stylelint-disable no-duplicate-selectors */ /* stylelint-disable */ /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */ diff --git a/src/store/actions/index.ts b/src/store/actions/index.ts index b5a66a1..b9fdbdd 100644 --- a/src/store/actions/index.ts +++ b/src/store/actions/index.ts @@ -115,11 +115,16 @@ export class EditorAction { selectOverlay(id: string, reset = true) { const { selectedIds } = this.store.getState(); if (selectedIds.indexOf(id) >= 0 && reset) { - this.mapEditor?.selectOverlays(); + if (reset) { + this.mapEditor?.selectOverlays(); + this.dispatch(StoreAction.selectOverlay()); + } else { + this.dispatch(StoreAction.selectOverlay(id)); + } } else { this.mapEditor?.selectOverlays([id]); + this.dispatch(StoreAction.selectOverlay(id)); } - this.dispatch(StoreAction.selectOverlay(id)); } updateOverlay(props: Partial) {