改成左滑删除

This commit is contained in:
kron
2025-11-04 14:38:16 +08:00
parent aa4fe1babd
commit 3f6d8cb821
7 changed files with 13239 additions and 949 deletions

View File

@@ -6,13 +6,16 @@ const props = defineProps({
type: Object,
default: () => {},
},
longPress: {
onRemove: {
type: Function,
default: () => {},
},
});
const bowOptions = ref({});
const targetOptions = ref({});
const rightOptions = [
{ text: "删除", style: { backgroundColor: "#ff4d4f", color: "#fff" } },
];
const toDetailPage = () => {
uni.navigateTo({
@@ -29,45 +32,54 @@ onMounted(() => {
targetOptions.value[item.id] = item;
});
});
const onSwipeActionClick = () => {
if (typeof props.onRemove === "function") props.onRemove(props.data);
};
</script>
<template>
<view
class="container"
@click="toDetailPage"
@longpress="longPress(props.data)"
>
<view class="left-part">
<view class="labels">
<view></view>
<text>{{
bowOptions[data.bowType] ? bowOptions[data.bowType].name : ""
}}</text>
<text>{{ data.distance }} </text>
<text>{{
targetOptions[data.targetType]
? targetOptions[data.targetType].name
: ""
}}</text>
<uni-swipe-action>
<uni-swipe-action-item
:right-options="rightOptions"
@click="onSwipeActionClick"
>
<view class="container" @click="toDetailPage">
<view class="left-part">
<view class="labels">
<view></view>
<text>{{
bowOptions[data.bowType] ? bowOptions[data.bowType].name : ""
}}</text>
<text>{{ data.distance }} </text>
<text>{{
targetOptions[data.targetType]
? targetOptions[data.targetType].name
: ""
}}</text>
</view>
<view>
<text>{{ data.createAt }}</text>
</view>
<view>
<text
>黄心率{{ Number((data.yellowRate * 100).toFixed(2)) }}%</text
>
<text>10环数{{ data.tenRings }}</text>
<text>平均{{ data.averageRing }}</text>
</view>
</view>
<view class="right-part">
<image src="../static/bow-target.png" mode="widthFix" />
<view class="arrow-amount">
<text>{{ data.actualTotalRing }}</text>
<text>/</text>
<text>{{ data.totalRing }}</text>
</view>
</view>
</view>
<view>
<text>{{ data.createAt }}</text>
</view>
<view>
<text>黄心率{{ Number((data.yellowRate * 100).toFixed(2)) }}%</text>
<text>10环数{{ data.tenRings }}</text>
<text>平均{{ data.averageRing }}</text>
</view>
</view>
<view class="right-part">
<image src="../static/bow-target.png" mode="widthFix" />
<view class="arrow-amount">
<text>{{ data.actualTotalRing }}</text>
<text>/</text>
<text>{{ data.totalRing }}</text>
</view>
</view>
</view>
</uni-swipe-action-item>
</uni-swipe-action>
</template>
<style scoped>
@@ -76,7 +88,6 @@ onMounted(() => {
display: flex;
align-items: center;
border-radius: 25rpx;
margin-bottom: 25rpx;
height: 200rpx;
border: 2rpx solid #fed848;
padding-left: 30rpx;
@@ -109,6 +120,7 @@ onMounted(() => {
}
.right-part > image {
width: 180rpx;
height: 180rpx;
}
.labels {
align-items: flex-end !important;