修改

src/components/Common/pointItemBackgroundForecast/Container.jsx

@@ -0,0 +1,64 @@
+/*
+ * @Author: zhp
+ * @Date: 2024-09-12 16:11:31
+ * @LastEditTime: 2024-09-13 13:39:40
+ * @LastEditors: zhp
+ * @Description: 
+ */
+import { useEffect } from "react";
+import useIcon from "../../../hooks/useIcon";
+import cls from "./container.module.scss";
+import React, { useState } from 'react';
+const Container = (props) => {
+  let icon = useIcon(props.icon);
+  // console.log(props); 
+  // const [visible, setVisible] = useState(props.isVisible);
+  const desc = props.desc;
+ const [localVisible, setLocalVisible] = useState(props.isVisible);
+
+  // 确保局部状态与传入的isVisible同步
+  useEffect(() => {
+    setLocalVisible(props.isVisible);
+  }, [props.isVisible]);
+
+  const handleChangeIsVisible = () => {
+    const newVisibility = !localVisible;
+    setLocalVisible(newVisibility);
+    props.onVisibilityChange(newVisibility);
+  };
+  return (
+    <div
+      className={`${cls.container} ${props.className}`}
+      style={props.pending ? { filter: "grayscale(100%)" } : props.style}
+    >
+      <div className={cls.container__head}>
+        <h2>{props.title}</h2>
+        {desc && <div className={cls.graphBaseDesc}>{desc}</div>}
+          <img
+          src={icon}
+          alt="#"
+          onClick={handleChangeIsVisible}
+          className={props.icon == "close" ? cls.bigger : ""}
+        />
+      </div>
+      <div className={cls.container__content}>{props.children}</div>
+      {props.pending && (
+        <div
+          className={`${cls.container__content} pending-modal`}
+          style={{
+            position: "absolute",
+            top: 0,
+            left: 0,
+            width: "100%",
+            height: "100%",
+            borderRadius: "20px",
+            userSelect: "none",
+            cursor: "not-allowed",
+          }}
+        ></div>
+      )}
+    </div>
+  );
+};
+
+export default Container;