fix: 修复列表内容过多时滚动条位置不对问题#2

src/editor/Catalog/index.tsx

@@ -63,26 +63,28 @@ const Catalog = () => {
   });
 
   return (
-    <Collapse
+    <div className="catalog-wrapper">
-      defaultActiveKey={["1", "2", "3", "4", "5"]}
+      <Collapse
-      expandIconPosition="right"
+        defaultActiveKey={["1", "2", "3", "4", "5"]}
-    >
+        expandIconPosition="right"
-      <Panel header="矩形" key={1}>
+      >
-        <OverlayList overlays={rectangles} />
+        <Panel header="矩形" key={1}>
-      </Panel>
+          <OverlayList overlays={rectangles} />
-      <Panel header="多边形" key={2}>
+        </Panel>
-        <OverlayList overlays={polygons} />
+        <Panel header="多边形" key={2}>
-      </Panel>
+          <OverlayList overlays={polygons} />
-      <Panel header="多段线" key={3}>
+        </Panel>
-        <OverlayList overlays={polylines} />
+        <Panel header="多段线" key={3}>
-      </Panel>
+          <OverlayList overlays={polylines} />
-      <Panel header="圆形" key={4}>
+        </Panel>
-        <OverlayList overlays={circles} />
+        <Panel header="圆形" key={4}>
-      </Panel>
+          <OverlayList overlays={circles} />
-      <Panel header="标记点" key={5}>
+        </Panel>
-        <OverlayList overlays={points} />
+        <Panel header="标记点" key={5}>
-      </Panel>
+          <OverlayList overlays={points} />
-    </Collapse>
+        </Panel>
+      </Collapse>
+    </div>
   );
 };
 

src/editor/Catalog/style.less

@@ -17,3 +17,7 @@
 .overlay-item-selected {
   background-color: #e5e6e7;
 }
+.catalog-wrapper{
+  height: 100%;
+  overflow-y: scroll;
+}

src/editor/index.less

@@ -19,3 +19,49 @@
 #mapStage {
   height: 100%;
 }
+
+// ----------------------------- scroll thumb ---------------------
+body {
+  user-select: none;
+  /*---滚动条大小--*/
+  /*---滚动条默认显示样式--*/
+  /*---鼠标点击滚动条显示样式--*/
+  /*---滚动框背景样式--*/
+  /* 滚动条的滑轨背景颜色 */
+  /* 滑块颜色 */
+  /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
+}
+body ::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+  background: white;
+  border-left: 1px solid #e8e8e8;
+}
+body #node-editor-graph-root input {
+  color: #2b2b2b;
+}
+body ::-webkit-scrollbar-thumb {
+  border-width: 1px;
+  border-style: solid;
+  border-color: #e4e4e4;
+  border-radius: 6px;
+  background: #c9c9c9;
+}
+body ::-webkit-scrollbar-thumb:hover {
+  background-color: #c6c6c6;
+}
+body ::-webkit-scrollbar-track-piece {
+  border-radius: 0;
+}
+body ::-webkit-scrollbar-track {
+  background-color: #e4e4e4;
+}
+body ::-webkit-scrollbar-thumb {
+  background-color: rgba(0, 0, 0, 0.2);
+}
+body ::-webkit-scrollbar-corner {
+  background-color: #eee;
+}
+/* stylelint-disable no-duplicate-selectors */
+/* stylelint-disable */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */

src/store/reducers/map/index.ts

@@ -34,7 +34,6 @@ export function finishEditOverlay(state = initState, payload: any) {
     const { overlays } = draft.map;
     const existed = overlays.find((overlay) => overlay.id === id);
     if (existed) {
-      console.log(overlay);
       overlays[overlays.indexOf(existed)] = {
         ...existed,
         ...overlay,