更新：课程确认订单和订单支付功能初步完成
This commit is contained in:
@@ -31,7 +31,7 @@
|
||||
<!-- VIP优惠价 -->
|
||||
<view v-if="item.isVipPrice === 1 && item.vipPrice" class="price-info">
|
||||
<text class="vip-price">{{ parseFloat(item.vipPrice).toFixed(2) }} 天医币</text>
|
||||
<text class="vip-label">VIP到手价</text>
|
||||
<text class="vip-label">VIP优惠价</text>
|
||||
<text class="original-price">{{ parseFloat(item.price).toFixed(2) }} 天医币</text>
|
||||
</view>
|
||||
|
||||
|
||||
0
components/order/Payment.vue
Normal file
0
components/order/Payment.vue
Normal file
229
components/order/Price.vue
Normal file
229
components/order/Price.vue
Normal file
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<!-- 商品总价 -->
|
||||
<!-- <view class="price-item">
|
||||
<text class="label">{{ $t('order.totalPrice') }}</text>
|
||||
<text class="value">￥{{ totalPrice.toFixed(2) }}</text>
|
||||
</view> -->
|
||||
|
||||
<!-- 优惠券 -->
|
||||
<!-- <view class="price-item" @click="showCouponPopup = true">
|
||||
<view class="label-row">
|
||||
<text class="label">{{ $t('order.coupon') }}</text>
|
||||
</view>
|
||||
<view class="value-row">
|
||||
<template v-if="!selectedCoupon">
|
||||
<view v-if="availableCouponCount > 0" class="coupon-badge">
|
||||
<text>{{ $t('order.couponCount', { count: availableCouponCount }) }}</text>
|
||||
</view>
|
||||
<text v-else-if="couponList.length === 0" class="unavailable-text">
|
||||
{{ $t('order.noCoupon') }}
|
||||
</text>
|
||||
<text v-else class="unavailable-text">
|
||||
{{ $t('order.unavailable') }}
|
||||
</text>
|
||||
</template>
|
||||
<template v-else>
|
||||
<text class="discount-value">-￥{{ selectedCoupon.couponEntity.couponAmount }}</text>
|
||||
<text class="reselect-btn">{{ $t('order.reselect') }}</text>
|
||||
</template>
|
||||
<image
|
||||
v-if="availableCouponCount > 0 || selectedCoupon"
|
||||
src="/static/icon/icon_right.png"
|
||||
class="arrow-icon"
|
||||
/>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<!-- 活动立减 -->
|
||||
<view v-if="hasActivityDiscount" class="price-item">
|
||||
<text class="label">{{ $t('order.activityDiscount') }}</text>
|
||||
<text class="discount-value">-￥{{ activityDiscountAmount.toFixed(2) }}</text>
|
||||
</view>
|
||||
|
||||
<!-- VIP专享立减 -->
|
||||
<view v-if="vipPrice > 0" class="price-item">
|
||||
<view class="label-row">
|
||||
<text class="vip-icon">VIP</text>
|
||||
<text class="label">{{ $t('order.vipDiscount') }}</text>
|
||||
</view>
|
||||
<text class="discount-value">-￥{{ vipPrice.toFixed(2) }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 地区优惠 -->
|
||||
<view v-if="districtAmount > 0" class="price-item">
|
||||
<text class="label">{{ $t('order.districtDiscount') }}</text>
|
||||
<text class="discount-value">-￥{{ districtAmount.toFixed(2) }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 积分 -->
|
||||
<view v-if="initData && initData.user.jf > 0" class="price-item">
|
||||
<view class="label-row">
|
||||
<image src="/static/icon/jifen.png" class="icon-img" />
|
||||
<text class="label">{{ $t('order.points') }}</text>
|
||||
<text class="points-total">
|
||||
({{ $t('order.allPoints') }}：{{ initData.user.jf }})
|
||||
</text>
|
||||
</view>
|
||||
<text class="discount-value">-￥{{ jfNumberShow }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 积分输入 -->
|
||||
<view v-if="initData && initData.user.jf > 0" class="points-input-section">
|
||||
<text class="points-label">
|
||||
{{ $t('order.maxPoints', { max: jfNumberMax }) }}
|
||||
</text>
|
||||
<view class="points-input-box">
|
||||
<wd-input
|
||||
v-model="jfNumber"
|
||||
type="number"
|
||||
:placeholder="$t('order.pointsPlaceholder')"
|
||||
@input="handlePointsInput"
|
||||
@clear="handlePointsClear"
|
||||
clearable
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<wd-cell-group border class="p-0!">
|
||||
<wd-cell title="商品总价" :value="`${totalPrice.toFixed(2)}天医币`" />
|
||||
<wd-cell title="优惠券" :value="`-${selectedCoupon?.couponEntity?.couponAmount || 0}天医币`" />
|
||||
<wd-cell title="活动立减" :value="`-${selectedCoupon?.couponEntity?.couponAmount || 0}天医币`" />
|
||||
<wd-cell :value="`-${vipPrice.toFixed(2)}天医币`">
|
||||
<template #title><text class="text-[#f94f04] font-bold">VIP</text>专项立减</template>
|
||||
</wd-cell>
|
||||
<wd-cell title="地区优惠" :value="`-${selectedCoupon?.couponEntity?.couponAmount || 0}天医币`" />
|
||||
</wd-cell-group>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
totalPrice: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
vipPrice: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep(.wd-cell__wrapper) {
|
||||
padding: 5px 0;
|
||||
|
||||
.wd-cell__title {
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
.price-section {
|
||||
.price-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 15rpx 0;
|
||||
font-size: 28rpx;
|
||||
|
||||
.label-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10rpx;
|
||||
|
||||
.label {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.vip-icon {
|
||||
padding: 2rpx 8rpx;
|
||||
background-color: #f94f04;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
border-radius: 4rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.icon-img {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.points-total {
|
||||
font-size: 24rpx;
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.value-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10rpx;
|
||||
|
||||
.coupon-badge {
|
||||
padding: 4rpx 20rpx;
|
||||
background-color: #fceeeb;
|
||||
color: #ec4729;
|
||||
font-size: 24rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.unavailable-text {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.reselect-btn {
|
||||
padding: 4rpx 12rpx;
|
||||
background-color: #fe6035;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.discount-value {
|
||||
color: #fe6035;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.points-input-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 15rpx 0;
|
||||
margin-top: 10rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 20rpx;
|
||||
padding: 20rpx;
|
||||
|
||||
.points-label {
|
||||
font-size: 28rpx;
|
||||
color: #7dc1f0;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.points-input-box {
|
||||
width: 320rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user