代码优化

src/pages/point-book.vue

@@ -16,7 +16,7 @@ import {
   getPointBookStatisticsAPI,
 } from "@/apis";
 
-import { getElementRect } from "@/util";
+import { getElementRect, drawHeatMap } from "@/util";
 
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
@@ -45,55 +45,6 @@ const toListPage = () => {
   });
 };
 
-// 绘制热力图
-const drawHeatMap = (width, height, arrows) => {
-  try {
-    const ctx = uni.createCanvasContext("heatMapCanvas");
-
-    let minCount = 0;
-    let maxCount = 0;
-    // 计算最大和最小频次
-    arrows.forEach((point) => {
-      if (point.count > maxCount) {
-        maxCount = point.count;
-      }
-      if (point.count < minCount) {
-        minCount = point.count;
-      }
-    });
-    // 绘制热力点
-    arrows.forEach((point) => {
-      if (point.x === 0 && point.y === 0) return;
-      // 数量越多，半径越小（反比关系）
-      const radius = 20;
-
-      // 根据频次设置同一种颜色的5个深浅度
-      let color;
-      if (point.count >= maxCount * 0.5) {
-        color = "rgba(255, 232, 143, 0.7)"; // 最深 - 频次5次及以上
-      } else if (point.count >= maxCount * 0.4) {
-        color = "rgba(255, 232, 143, 0.5)"; // 较深 - 频次4次
-      } else if (point.count >= maxCount * 0.3) {
-        color = "rgba(255, 232, 143, 0.3)"; // 中等 - 频次3次
-      } else if (point.count >= maxCount * 0.2) {
-        color = "rgba(255, 232, 143, 0.2)"; // 较浅 - 频次2次
-      } else {
-        color = "rgba(255, 232, 143, 0.1)"; // 最浅 - 频次1次
-      }
-
-      // 绘制圆形热力点
-      ctx.setFillStyle(color);
-      ctx.beginPath();
-      ctx.arc(point.x * width, point.y * height, radius, 0, 2 * Math.PI);
-      ctx.fill();
-    });
-
-    ctx.draw();
-  } catch (error) {
-    console.error("绘制热力图失败:", error);
-  }
-};
-
 onShow(async () => {
   const result = await getPointBookListAPI(1);
   list.value = result.slice(0, 3);
@@ -272,7 +223,7 @@ onShareTimeline(() => {
         />
         <canvas canvas-id="heatMapCanvas" style="width: 100%; height: 100%" />
       </view>
-      <view class="reward">
+      <view class="reward" v-if="data.totalArrow">
         <button hover-class="none" @click="showTip = true">
           <image src="../static/reward-us.png" mode="widthFix" />
         </button>