接口调试完毕

src/pages/point-book-detail.vue

@@ -2,21 +2,18 @@
 import { ref, onMounted, onUnmounted } from "vue";
 import { onLoad } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
-import BowTarget from "@/components/BowTarget.vue";
+import BowTargetEdit from "@/components/BowTargetEdit.vue";
 import ScreenHint2 from "@/components/ScreenHint2.vue";
 
 import { getPointBookDetailAPI } from "@/apis";
 
-onLoad(async (options) => {
-  if (options.id) {
-    const result = await getPointBookDetailAPI(options.id);
-    console.log(1212, result);
-  }
-});
-
 const selectedIndex = ref(0);
 const showTip = ref(false);
 const showTip2 = ref(false);
+const groups = ref([]);
+const data = ref({});
+const targetSrc = ref("");
+const arrows = ref([]);
 
 const openTip = (index) => {
   if (index === 1) showTip.value = true;
@@ -27,6 +24,29 @@ const closeTip = () => {
   showTip.value = false;
   showTip2.value = false;
 };
+
+const onSelect = (index) => {
+  selectedIndex.value = index;
+  data.value = groups.value[index];
+  arrows.value = groups.value[index].list.filter((item) => item.x && item.y);
+};
+
+onLoad(async (options) => {
+  if (options.id) {
+    const result = await getPointBookDetailAPI(options.id);
+    const config = uni.getStorageSync("point-book-config");
+    config.targetOption.some((item) => {
+      if (item.id === result.targetType) {
+        targetSrc.value = item.icon;
+      }
+    });
+    if (result.groups) {
+      groups.value = result.groups;
+      data.value = result.groups[0];
+      arrows.value = result.groups[0].list.filter((item) => item.x && item.y);
+    }
+  }
+});
 </script>
 
 <template>
@@ -34,9 +54,9 @@ const closeTip = () => {
     <view class="container">
       <view class="tab-bar">
         <view
-          v-for="(_, index) in [1, 2, 3, 4, 5]"
+          v-for="(_, index) in groups"
           :key="index"
-          @click="selectedIndex = index"
+          @click="onSelect(index)"
         >
           <text
             :style="{
@@ -66,23 +86,23 @@ const closeTip = () => {
               class="question-mark"
             />
           </view>
-          <text>98.99</text>
+          <text>{{ Number((data.stability || 0).toFixed(2)) }}</text>
         </view>
         <view>
           <view>黄心率</view>
-          <text>86.3%</text>
+          <text>{{ Number((data.yellowRate * 100).toFixed(2)) }}%</text>
         </view>
         <view>
           <view>10环数</view>
-          <text>65</text>
+          <text>{{ data.tenRings }}</text>
         </view>
         <view>
           <view>平均环数</view>
-          <text>8.99</text>
+          <text>{{ Number((data.averageRing || 0).toFixed(2)) }}</text>
         </view>
         <view>
           <view>总环数</view>
-          <text>700/999</text>
+          <text>{{ data.userTotalRing }}/{{ data.totalRing }}</text>
         </view>
       </view>
       <view class="title-bar">
@@ -96,7 +116,7 @@ const closeTip = () => {
           />
         </button>
       </view>
-      <BowTarget />
+      <BowTargetEdit :src="targetSrc" :arrows="arrows" />
       <ScreenHint2 :show="showTip || showTip2" :onClose="closeTip">
         <view class="tip-content">
           <block v-if="showTip">