计分本细节更新

src/pages/point-book-list.vue

@@ -5,14 +5,17 @@ import SModal from "@/components/SModal.vue";
 import EditOption from "@/components/EditOption.vue";
 import PointRecord from "@/components/PointRecord.vue";
 import ScrollList from "@/components/ScrollList.vue";
-import { getPointBookListAPI } from "@/apis";
+import ScreenHint2 from "@/components/ScreenHint2.vue";
+import { getPointBookListAPI, removePointRecord } from "@/apis";
 
+const showTip = ref(false);
 const bowType = ref({});
 const distance = ref(0);
 const bowtargetType = ref({});
 const showModal = ref(false);
 const selectorIndex = ref(0);
 const list = ref([]);
+const removeId = ref("");
 
 const onListLoading = async (page) => {
   const result = await getPointBookListAPI(
@@ -34,6 +37,22 @@ const openSelector = (index) => {
   showModal.value = true;
 };
 
+const onLongPress = (item) => {
+  removeId.value = item.id;
+  showTip.value = true;
+};
+
+const confirmRemove = async () => {
+  try {
+    showTip.value = false;
+    await removePointRecord(removeId.value);
+    list.value = list.value.filter((it) => it.id !== removeId.value);
+    uni.showToast({ title: "已删除", icon: "none" });
+  } catch (e) {
+    uni.showToast({ title: "删除失败，请重试", icon: "none" });
+  }
+};
+
 const onSelectOption = (itemIndex, value) => {
   if (itemIndex === 0) {
     bowType.value = value.name === bowType.value.name ? {} : value;
@@ -78,7 +97,7 @@ const onSelectOption = (itemIndex, value) => {
       <view class="point-records">
         <ScrollList :onLoading="onListLoading">
           <view v-for="(item, index) in list" :key="index">
-            <PointRecord :data="item" />
+            <PointRecord :data="item" :longPress="onLongPress" />
           </view>
           <view class="no-data" v-if="list.length === 0">暂无数据</view>
         </ScrollList>
@@ -119,6 +138,15 @@ const onSelectOption = (itemIndex, value) => {
           />
         </view>
       </SModal>
+      <ScreenHint2 :show="showTip">
+        <view class="tip-content">
+          <text>确认删除该记录吗</text>
+          <view>
+            <button hover-class="none" @click="showTip = false">取消</button>
+            <button hover-class="none" @click="confirmRemove">确认</button>
+          </view>
+        </view>
+      </ScreenHint2>
     </view>
   </Container>
 </template>
@@ -186,4 +214,34 @@ const onSelectOption = (itemIndex, value) => {
   color: #999999;
   font-size: 14px;
 }
+.tip-content {
+  width: 100%;
+  padding: 25px;
+  display: flex;
+  flex-direction: column;
+  color: #000;
+}
+.tip-content > text {
+  width: 100%;
+  text-align: center;
+  font-size: 14px;
+  margin-top: 5px;
+}
+.tip-content > view {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 20px;
+}
+.tip-content > view > button {
+  width: 48%;
+  background: linear-gradient(180deg, #fbfbfb 0%, #f5f5f5 100%);
+  border-radius: 22px;
+  border: 1px solid #eeeeee;
+  padding: 12px 0;
+  font-size: 14px;
+  color: #000;
+}
+.tip-content > view > button:last-child {
+  background: #fed847;
+}
 </style>