点击拖拽创建的点可以继续拖拽

src/components/BowTargetEdit.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from "vue";
+import { ref, onMounted, onBeforeUnmount } from "vue";
 import { getElementRect, calcRing } from "@/util";
 
 const props = defineProps({
@@ -19,10 +19,6 @@ const props = defineProps({
     type: Function,
     default: null,
   },
-  scroll: {
-    type: Boolean,
-    default: true,
-  },
 });
 
 const rect = ref({});
@@ -44,6 +40,11 @@ const onClick = async (e) => {
     return;
   }
   if (props.id === 7 || props.id === 9) {
+    if (
+      e.detail.x < rect.value.width * 0.2 ||
+      e.detail.x > rect.value.width * 0.8
+    )
+      return;
     // 放大并通过滚动将点击位置置于视窗中心
     scale.value = 1.4;
     const viewportH = rect.value.width; // 容器高度等于宽度（100vw）
@@ -164,14 +165,44 @@ onMounted(async () => {
   capsuleHeight.value = menuBtnInfo.top - 9;
   const result = await getElementRect(".container");
   rect.value = result;
+  uni.$on("set-edit-arrow", (data) => {
+    if (data === null) {
+      arrow.value = null;
+      scale.value = 1;
+      scrollTop.value = 0;
+      return;
+    }
+    if (props.id === 7 || props.id === 9) {
+      scale.value = 1.4;
+      const viewportH = rect.value.width; // 容器高度等于宽度（100vw）
+      const contentH = scale.value * rect.value.width; // 内容高度
+      const clickYInContainer = contentH * data.y - rect.value.top;
+      let target = clickYInContainer * scale.value - viewportH / 2;
+      target = Math.max(0, Math.min(contentH - viewportH, target));
+      setTimeout(() => {
+        scrollTop.value = target > 180 ? target + 10 : target;
+      }, 200);
+    }
+    arrow.value = {
+      ...data,
+      x: data.x * scale.value,
+      y: data.y * scale.value,
+    };
+  });
+});
+
+onBeforeUnmount(() => {
+  uni.$off("set-edit-arrow");
 });
 </script>
 
 <template>
   <scroll-view
-    :scroll-y="scroll"
+    :scroll-y="scale > 1"
     scroll-with-animation
     :scroll-top="scrollTop"
+    :show-scrollbar="false"
+    :enhanced="true"
     class="container"
     @tap="onClick"
     @touchmove="onDrag"

src/pages/point-book-detail.vue

@@ -249,7 +249,6 @@ onShareTimeline(async () => {
           :id="targetId"
           :src="targetSrc"
           :arrows="arrows.filter((item) => item.x && item.y)"
-          :scroll="false"
         />
       </view>
       <view :style="{ transform: hasPoint ? 'translateY(-100rpx)' : 'none' }">

src/pages/point-book-edit.vue

@@ -76,6 +76,7 @@ const deleteArrow = () => {
   } else {
     arrowGroups.value[currentGroup.value][currentArrow.value] = {};
   }
+  uni.$emit("set-edit-arrow", null);
   uni.setStorageSync("last-point-record", arrowGroups.value);
 };
 const onEditDone = (arrow) => {
@@ -83,6 +84,15 @@ const onEditDone = (arrow) => {
   if (currentArrow.value < amount.value - 1) currentArrow.value++;
   uni.setStorageSync("last-point-record", arrowGroups.value);
 };
+const onSelectArrow = (index) => {
+  currentArrow.value = index;
+  const arrow = arrowGroups.value[currentGroup.value][currentArrow.value];
+  if (arrow && arrow.x && arrow.y) {
+    uni.$emit("set-edit-arrow", arrow);
+  } else {
+    uni.$emit("set-edit-arrow", null);
+  }
+};
 
 onLoad((options) => {
   const pointBook = uni.getStorageSync("last-point-book");
@@ -145,7 +155,7 @@ onLoad((options) => {
           v-if="arrowGroups[currentGroup]"
           v-for="(arrow, index) in arrowGroups[currentGroup]"
           :key="index"
-          @click="currentArrow = index"
+          @click="onSelectArrow(index)"
           :style="{
             borderColor: currentArrow === index ? '#FED847' : '#eeeeee',
             borderWidth: currentArrow === index ? '2px' : '1px',