添加计分本草稿功能

2025-11-27 12:02:57 +08:00
parent c697a7edd0
commit 82a0ee83b2
7 changed files with 165 additions and 49 deletions
--- a/src/pages/point-book-create.vue
+++ b/src/pages/point-book-create.vue
@@ -49,7 +49,7 @@ const toEditPage = () => {
      bowtargetType: bowtargetType.value,
      amountGroup: amountGroup.value,
    });
-    uni.navigateTo({
+    uni.redirectTo({
      url: "/pages/point-book-edit",
    });
  } else {
--- a/src/pages/point-book-edit.vue
+++ b/src/pages/point-book-edit.vue
@@ -55,6 +55,7 @@ const onSubmit = async () => {
      Object.values(arrowGroups.value)
    );
    if (res.record_id) {
+      uni.removeStorageSync("last-point-record");
      uni.redirectTo({
        url: `/pages/point-book-detail?id=${res.record_id}`,
      });
@@ -65,26 +66,25 @@ const onClickRing = (ring) => {
  if (arrowGroups.value[currentGroup.value]) {
    arrowGroups.value[currentGroup.value][currentArrow.value] = { ring };
    if (currentArrow.value < amount.value - 1) currentArrow.value++;
+    uni.setStorageSync("last-point-record", arrowGroups.value);
  }
 };
 const deleteArrow = () => {
-  arrowGroups.value[currentGroup.value][currentArrow.value] = {};
+  const arrow = arrowGroups.value[currentGroup.value][currentArrow.value];
+  if (JSON.stringify(arrow) === "{}") {
+    currentArrow.value -= 1;
+  } else {
+    arrowGroups.value[currentGroup.value][currentArrow.value] = {};
+  }
+  uni.setStorageSync("last-point-record", arrowGroups.value);
 };
 const onEditDone = (arrow) => {
  arrowGroups.value[currentGroup.value][currentArrow.value] = arrow;
  if (currentArrow.value < amount.value - 1) currentArrow.value++;
+  uni.setStorageSync("last-point-record", arrowGroups.value);
 };

-onLoad(() => {
-  uni.enableAlertBeforeUnload({
-    message: "现在离开会导致未提交的数据丢失，是否继续？",
-    success: (res) => {
-      console.log("已启用离开提示");
-    },
-  });
-});
-
-onMounted(() => {
+onLoad((options) => {
  const pointBook = uni.getStorageSync("last-point-book");
  if (pointBook.bowtargetType) {
    bowtarget.value = pointBook.bowtargetType;
@@ -102,6 +102,22 @@ onMounted(() => {
      arrowGroups.value[i] = new Array(amount.value).fill({});
    }
  }
+  if (options.withDraft) {
+    const draft = uni.getStorageSync("last-point-record");
+    if (draft) {
+      Object.values(draft).some((arrows, index1) =>
+        arrows.some((arrow, index2) => {
+          currentArrow.value = index2;
+          currentGroup.value = index1 + 1;
+          return JSON.stringify(arrow) === "{}";
+        })
+      );
+      arrowGroups.value = draft;
+    }
+  }
+  // uni.enableAlertBeforeUnload({
+  //   message: "现在离开会导致未提交的数据丢失，是否继续？",
+  // });
 });
 </script>

@@ -140,8 +156,8 @@ onMounted(() => {
              : arrow.ring
              ? arrow.ring + " 环"
              : ""
-          }}</view
-        >
+          }}
+        </view>
      </view>
      <text>推荐在靶纸上落点计分，这样可获得稳定性分析</text>
      <view class="bow-rings">
--- a/src/pages/point-book-list.vue
+++ b/src/pages/point-book-list.vue
@@ -1,5 +1,6 @@
 <script setup>
-import { ref, onMounted } from "vue";
+import { ref } from "vue";
+import { onShow } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import SModal from "@/components/SModal.vue";
 import EditOption from "@/components/EditOption.vue";
@@ -16,6 +17,7 @@ const showModal = ref(false);
 const selectorIndex = ref(0);
 const list = ref([]);
 const removeId = ref("");
+const pointDraft = ref(null);

 const onListLoading = async (page) => {
  const result = await getPointBookListAPI(
@@ -64,6 +66,22 @@ const onSelectOption = (itemIndex, value) => {
  showModal.value = false;
  onListLoading(1);
 };
+
+const onRemoveDraft = () => {
+  pointDraft.value = null;
+  uni.removeStorageSync("last-point-record");
+};
+
+const toEditPage = () => {
+  uni.navigateTo({
+    url: "/pages/point-book-edit?withDraft=true",
+  });
+};
+
+onShow(() => {
+  const draft = uni.getStorageSync("last-point-record");
+  pointDraft.value = draft ? uni.getStorageSync("last-point-book") : null;
+});
 </script>

 <template>
@@ -97,6 +115,33 @@ const onSelectOption = (itemIndex, value) => {
      <view class="point-records">
        <ScrollList :onLoading="onListLoading">
          <uni-swipe-action>
+            <block v-if="pointDraft">
+              <uni-swipe-action-item>
+                <template v-slot:right>
+                  <view class="swipe-right" @click="onRemoveDraft">
+                    <image
+                      class="swipe-icon"
+                      src="../static/delete-white.png"
+                      mode="widthFix"
+                    />
+                  </view>
+                </template>
+                <view class="point-draft" v-if="pointDraft" @click="toEditPage">
+                  <text>{{ pointDraft.bowType.name }}</text>
+                  <text>{{ pointDraft.distance }}米</text>
+                  <text>{{ pointDraft.bowtargetType.name }}</text>
+                  <view>
+                    <image src="../static/draft-icon.png" mode="widthFix" />
+                    <text>本地草稿</text>
+                    <view>
+                      <text>计分待完成</text>
+                      <image src="../static/back.png" mode="widthFix" />
+                    </view>
+                  </view>
+                </view>
+              </uni-swipe-action-item>
+              <view :style="{ height: '25rpx' }" />
+            </block>
            <block v-for="(item, index) in list" :key="item.id">
              <uni-swipe-action-item>
                <template v-slot:right>
@@ -113,7 +158,7 @@ const onSelectOption = (itemIndex, value) => {
              <view
                v-if="index < list.length - 1"
                :style="{ height: '25rpx' }"
-              ></view>
+              />
            </block>
          </uni-swipe-action>
          <view class="no-data" v-if="list.length === 0">暂无数据</view>
@@ -274,4 +319,54 @@ const onSelectOption = (itemIndex, value) => {
  width: 44rpx;
  height: 44rpx;
 }
+.point-draft {
+  height: 200rpx;
+  border-radius: 25rpx;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+.point-draft > text {
+  font-weight: 500;
+  font-size: 40rpx;
+  color: #333333;
+  margin: 0 20rpx;
+}
+.point-draft > view:last-child {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background: #000000b3;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.point-draft > view:last-child > image {
+  width: 46rpx;
+  height: 38rpx;
+  margin-bottom: 10rpx;
+}
+.point-draft > view:last-child > text {
+  font-weight: 500;
+  font-size: 26rpx;
+  color: #ffffff;
+}
+.point-draft > view:last-child > view {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 22rpx;
+  color: #ffffff;
+  transform: translateX(8rpx);
+}
+.point-draft > view:last-child > view > image {
+  width: 30rpx;
+  height: 30rpx;
+  transform: rotate(180deg);
+}
 </style>
--- a/src/pages/point-book.vue
+++ b/src/pages/point-book.vue
@@ -58,29 +58,33 @@ const onSignin = () => {

 const startScoring = () => {
  if (user.value.id) {
-    uni.navigateTo({
-      url: "/pages/point-book-create",
-    });
+    const draft = uni.getStorageSync("last-point-record");
+    if (draft) {
+      showTip2.value = true;
+      return;
+    }
+    toScorePage();
  } else {
    showModal.value = true;
  }
 };

-const onRemoveRecord = (item) => {
-  removeId.value = item.id;
-  showTip2.value = true;
+const toScorePage = (withDraft) => {
+  showTip2.value = false;
+  if (withDraft) {
+    return uni.navigateTo({
+      url: "/pages/point-book-edit?withDraft=true",
+    });
+  }
+  uni.removeStorageSync("last-point-record");
+  return uni.navigateTo({
+    url: "/pages/point-book-create",
+  });
 };

-const confirmRemove = async () => {
-  try {
-    showTip2.value = false;
-    await removePointRecord(removeId.value);
-    const result = await getPointBookListAPI(1);
-    list.value = result.slice(0, 3);
-    uni.showToast({ title: "已删除", icon: "none" });
-  } catch (e) {
-    uni.showToast({ title: "删除失败，请重试", icon: "none" });
-  }
+const closeHint = () => {
+  showTip.value = false;
+  showTip2.value = false;
 };

 const loadData = async () => {
@@ -352,20 +356,21 @@ onShareTimeline(() => {
    <SModal :show="showModal" :onClose="() => (showModal = false)" :noBg="true">
      <Signin :onClose="() => (showModal = false)" :noBg="true" />
    </SModal>
-    <ScreenHint2
-      :show="showTip || showTip2"
-      :onClose="showTip ? () => (showTip = false) : null"
-    >
+    <ScreenHint2 :show="showTip || showTip2" :onClose="closeHint">
      <RewardUs
        v-if="showTip"
        :show="showTip"
        :onClose="() => (showTip = false)"
      />
      <view class="tip-content" v-if="showTip2">
-        <text>确认删除该记录吗？</text>
+        <text>发现未完成的记分，是否继续编辑？</text>
        <view>
-          <button hover-class="none" @click="showTip2 = false">取消</button>
-          <button hover-class="none" @click="confirmRemove">确认</button>
+          <button hover-class="none" @click="toScorePage(false)">
+            重新计分
+          </button>
+          <button hover-class="none" @click="toScorePage(true)">
+            继续编辑
+          </button>
        </view>
      </view>
    </ScreenHint2>