完成智慧充值模块

This commit is contained in:
gyq
2025-11-24 10:53:19 +08:00
parent e4f5cc8519
commit 046437ce54
14 changed files with 1342 additions and 1132 deletions

View File

@@ -1,92 +1,79 @@
<template>
<view>
<view
class="u-flex u-row-between u-m-b-24"
style="gap: 40rpx"
v-for="(item, index) in modelValue"
:key="index"
>
<view
class="choose-coupon u-flex-1 u-flex u-row-between"
@click="showCoupon(item, index)"
>
<template v-if="item.title">
<text>{{ item.title }}</text>
<view class="u-flex" @click.stop="item.title = ''">
<up-icon name="close" size="14"></up-icon>
</view>
</template>
<view>
<view class="u-flex u-row-between u-m-b-24" style="gap: 40rpx" v-for="(item, index) in modelValue" :key="index">
<view class="choose-coupon u-flex-1 u-flex u-row-between" @click="showCoupon(item, index)">
<template v-if="item.title">
<text>{{ item.title }}</text>
<view class="u-flex" @click.stop="item.title = ''">
<up-icon name="close" size="14"></up-icon>
</view>
</template>
<template v-else>
<text class="color-999">选择赠送券</text>
<up-icon name="arrow-down" size="14"></up-icon>
</template>
</view>
<view class="u-flex-1 u-flex">
<view class="u-flex-1 choose-coupon u-flex">
<input
class="u-flex-1"
placeholder=""
type="number"
v-model="item.num"
placeholder-class="color-999 u-font-28"
/>
<text class="no-wrap color-999">/1个码</text>
</view>
<view class="u-m-l-20">
<up-icon name="minus-circle-fill" color="#EB4F4F" size="18" @click="removeCoupon(index)"></up-icon>
</view>
</view>
</view>
<chooseCoupon
v-model="chooseCouponData.couponId"
v-model:show="chooseCouponData.show"
@confirm="confirmCoupon"
:list="couponList"
></chooseCoupon>
</view>
<template v-else>
<text class="color-999">选择赠送券</text>
<up-icon name="arrow-down" size="14"></up-icon>
</template>
</view>
<view class="u-flex-1 u-flex">
<view class="u-flex-1 choose-coupon u-flex">
<input class="u-flex-1" placeholder="" type="number" v-model="item.num" placeholder-class="color-999 u-font-28" />
<text class="no-wrap color-999">{{ tips }}</text>
</view>
<view class="u-m-l-20">
<up-icon name="minus-circle-fill" color="#EB4F4F" size="18" @click="removeCoupon(index)"></up-icon>
</view>
</view>
</view>
<chooseCoupon v-model="chooseCouponData.couponId" v-model:show="chooseCouponData.show" @confirm="confirmCoupon" :list="couponList"></chooseCoupon>
</view>
</template>
<script setup>
import { reactive, ref, onMounted } from "vue";
import chooseCoupon from "./choose-coupon.vue";
import { couponPage } from "@/http/api/market/index.js";
import { reactive, ref, onMounted } from 'vue';
import chooseCoupon from './choose-coupon.vue';
import { couponPage } from '@/http/api/market/index.js';
const props = defineProps({
tips: {
type: String,
default: '张/1个码'
}
});
const chooseCouponData = reactive({
couponId: "",
show: false,
index: -1,
item: null,
couponId: '',
show: false,
index: -1,
item: null
});
const modelValue = defineModel({
type: Array,
default: () => [],
type: Array,
default: () => []
});
const couponList = ref([]);
function showCoupon(item, index) {
chooseCouponData.couponId = item ? item.id : "";
chooseCouponData.show = true;
chooseCouponData.index = index;
chooseCouponData.item = item;
chooseCouponData.couponId = item ? item.id : '';
chooseCouponData.show = true;
chooseCouponData.index = index;
chooseCouponData.item = item;
}
function confirmCoupon(e) {
modelValue.value[chooseCouponData.index].id = e.id;
modelValue.value[chooseCouponData.index].title = e.title;
modelValue.value[chooseCouponData.index].id = e.id;
modelValue.value[chooseCouponData.index].title = e.title;
}
function removeCoupon(index) {
modelValue.value.splice(index, 1);
modelValue.value.splice(index, 1);
}
onMounted(() => {
couponPage({ size: 999 }).then((res) => {
couponList.value = res.records;
});
couponPage({ size: 999 }).then((res) => {
couponList.value = res.records;
});
});
</script>
<style lang="scss" scoped>
.choose-coupon {
padding: 10rpx 20rpx;
border-radius: 8rpx;
border: 1px solid #d9d9d9;
padding: 10rpx 20rpx;
border-radius: 8rpx;
border: 1px solid #d9d9d9;
}
</style>