feat: 修复commompopup按钮底边距在安卓上显示异常的问题、修复测试结果页偶尔出现不渲染雷达图的问题

src/components/CommonPopup/index.module.scss

@@ -48,7 +48,7 @@
     border-bottom: 1px solid rgba(0, 0, 0, 0.06);
 
     .common-popup__title {
-      font-family: 'PingFang SC';
+      font-family: "PingFang SC";
       font-weight: 600;
       font-size: 22px;
       line-height: 1.27em;
@@ -62,7 +62,7 @@
       display: flex;
       align-items: center;
       justify-content: center;
-      background: #FFFFFF;
+      background: #ffffff;
       border: 1px solid rgba(0, 0, 0, 0.06);
       border-radius: 50%;
       cursor: pointer;
@@ -100,7 +100,7 @@
     display: flex;
     gap: 8px;
     background: #fff;
-    padding-bottom: env(safe-area-inset-bottom);
+    padding-bottom: max(10px, env(safe-area-inset-bottom));
   }
 
   .common-popup__btn {
@@ -134,4 +134,4 @@
     border-radius: 12px !important;
     padding: 4px 10px;
   }
-}
+}

src/components/Radar/index.tsx

@@ -1,25 +1,12 @@
-import Taro, { useReady } from "@tarojs/taro";
-import { View, Canvas, Button } from "@tarojs/components";
-import { useEffect, useRef, forwardRef, useImperativeHandle } from "react";
+import Taro from "@tarojs/taro";
+import { View, Canvas } from "@tarojs/components";
+import { useEffect, forwardRef, useImperativeHandle } from "react";
 
 const RadarChart: React.FC = forwardRef((props, ref) => {
   const { data } = props;
 
-  const renderFnRef = useRef();
-  // const labels = [
-  //   "正手球质",
-  //   "正手控制",
-  //   "反手球质",
-  //   "反手控制",
-  //   "底线相持",
-  //   "场地覆盖",
-  //   "发球接发",
-  //   "接随机球",
-  //   "战术设计",
-  // ];
-  // const values = [50, 75, 60, 20, 40, 70, 65, 35, 75];
   const maxValue = 100;
-  const levels = 4;
+  const levels = 5;
   const radius = 100;
   const center = { x: 160, y: 160 };
 
@@ -35,14 +22,10 @@ const RadarChart: React.FC = forwardRef((props, ref) => {
         },
         { texts: [], vals: [] }
       );
-      renderFnRef.current && renderFnRef.current(texts, vals);
+      renderCanvas(texts, vals);
     }
   }, [data]);
 
-  useReady(() => {
-    renderFnRef.current = renderCanvas;
-  });
-
   function renderCanvas(labels, values) {
     const query = Taro.createSelectorQuery();
     query
@@ -57,12 +40,15 @@ const RadarChart: React.FC = forwardRef((props, ref) => {
         ctx.scale(dpr, dpr);
 
         // === 绘制圆形网格 ===
-        for (let i = 1; i <= levels; i++) {
+        for (let i = levels; i >= 1; i--) {
           const r = (radius / levels) * i;
           ctx.beginPath();
           ctx.arc(center.x, center.y, r, 0, Math.PI * 2);
-          if (i % 2 === 0) {
-            ctx.fillStyle = "rgba(0, 150, 200, 0.1)";
+          if (i % 2 === 1) {
+            ctx.fillStyle = "#fff";
+            ctx.fill();
+          } else {
+            ctx.fillStyle = "#CAFCF0";
             ctx.fill();
           }
           ctx.strokeStyle = "#bbb";
@@ -143,19 +129,6 @@ const RadarChart: React.FC = forwardRef((props, ref) => {
       }),
   }));
 
-  // 保存为图片
-  const saveImage = () => {
-    Taro.canvasToTempFilePath({
-      canvasId: "radarCanvas",
-      success: (res) => {
-        Taro.saveImageToPhotosAlbum({
-          filePath: res.tempFilePath,
-          success: () => Taro.showToast({ title: "保存成功" }),
-        });
-      },
-    });
-  };
-
   return (
     <View>
       <Canvas
@@ -163,7 +136,6 @@ const RadarChart: React.FC = forwardRef((props, ref) => {
         id="radarCanvas"
         style={{ width: "320px", height: "320px", background: "transparent" }}
       />
-      {/* <Button onClick={saveImage}>保存为图片</Button> */}
     </View>
   );
 });