215 lines
10 KiB
Vue
215 lines
10 KiB
Vue
<route lang="jsonc" type="page">{
|
|
"layout": "default",
|
|
"style": {
|
|
"navigationStyle": "custom",
|
|
"navigationBarBackgroundColor": "#fff"
|
|
}
|
|
}</route>
|
|
|
|
<template>
|
|
<view>
|
|
<view>
|
|
<navbar title="订单详情" custom-class="!bg-[transparent]"></navbar>
|
|
</view>
|
|
|
|
<view class="mt-38rpx">
|
|
<view class="">
|
|
<view class="mx-48rpx flex items-center">
|
|
<view class="rounded-4rpx w-60rpx text-center text-[#40AE36] border-2rpx border-solid border-[#40AE36] text-22rpx pb-4rpx" v-if="isGroupBuy">团购</view>
|
|
<view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx" v-if="isDirectSale">直营</view>
|
|
<template v-if="isRecharge">
|
|
<view class="w-600rpx line-2 ml-20rpx font-bold text-30rpx text-[#303133] leading-42rpx text-center">
|
|
门店余额充值
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="w-600rpx line-2 ml-20rpx font-bold text-30rpx text-[#303133] leading-42rpx text-left">
|
|
【{{ bill?.room?.title }}】{{ bill?.order?.group?.title || '' }}
|
|
</view>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="mt-30rpx text-40rpx text-[#303133] leading-56rpx text-center">
|
|
<text class="font-bold" v-if="bill.change_type == 1 || bill.change_type == 2 || bill.change_type == 4 || bill.change_type == 9">+</text>
|
|
<text class="font-bold" v-if="bill.change_type == 3 || bill.change_type == 5">-</text>
|
|
￥{{ bill.amount }}
|
|
</view>
|
|
|
|
<!-- <view class="flex items-center flex items-center justify-center mt-16rpx">
|
|
<wd-img width="28rpx" height="28rpx" :src="`${OSS}images/store/finance/image2.png`" mode="aspectFit" />
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="bill.change_type == 1">预定成功</view>
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="bill.change_type == 2">续订成功</view>
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="bill.change_type == 3">提现成功</view>
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="bill.change_type == 4">核销成功</view>
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="bill.change_type == 5">退款成功</view>
|
|
</view> -->
|
|
<view class="flex items-center flex items-center justify-center mt-16rpx">
|
|
<wd-img width="28rpx" height="28rpx" :src="`${OSS}images/store/finance/image2.png`" mode="aspectFit" />
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="isGroupBuy">核销成功</view>
|
|
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx" v-if="isDirectSale">结算成功</view>
|
|
</view>
|
|
|
|
<view class="mx-28rpx mt-72rpx">
|
|
<!-- 这一块内容是在直营店才显示 -->
|
|
<view v-if="isDirectSale">
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>预定门店</view>
|
|
<view>{{ bill?.store?.name }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>预约时间</view>
|
|
<view>{{ bill?.order?.update_dtime }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>预约时长</view>
|
|
<view>{{ bill?.order?.hours }}小时</view>
|
|
</view>
|
|
|
|
<view class="mt-20rpx">
|
|
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="isRecharge">
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>充值金额</view>
|
|
<view>￥{{ bill?.order?.recharge_price }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>赠送金额</view>
|
|
<view>￥{{ bill?.order?.gift_price }}</view>
|
|
</view>
|
|
|
|
<view class="mt-20rpx">
|
|
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 直营和团购都显示 -->
|
|
<view>
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>总收入</view>
|
|
<view>￥{{ bill?.order?.order_amount }}</view>
|
|
</view>
|
|
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="bill.change_type != 9">
|
|
<view>优惠券</view>
|
|
<view>-￥{{ bill?.order?.coupon_price }}</view>
|
|
</view>
|
|
|
|
<view class="mt-20rpx">
|
|
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
|
</view>
|
|
</view>
|
|
|
|
<view>
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>用户手机号</view>
|
|
<view>{{ bill?.order.mobile }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>订单编号</view>
|
|
<view>
|
|
<text>{{ bill?.order?.order_sn }}</text>
|
|
<wd-divider vertical />
|
|
<text class="text-[#4C9F44]" @click="copy(bill?.order?.order_sn)">复制</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 直营显示 -->
|
|
<view v-if="isDirectSale" class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>交易方式</view>
|
|
<view>{{ bill?.order?.pay_way_title }}</view>
|
|
</view>
|
|
|
|
<!-- 充值的支付方式 -->
|
|
<view v-if="isRecharge" class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>支付方式</view>
|
|
<view>{{ bill?.order?.pay_way_title }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>创建时间</view>
|
|
<view>{{ bill?.order?.dtime }}</view>
|
|
</view>
|
|
|
|
<!-- 团购显示 -->
|
|
<view v-if="isGroupBuy">
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>验券时间</view>
|
|
<view>{{ bill?.order?.group?.yanquan_dtime }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>验券门店</view>
|
|
<view>{{ bill?.store?.name }}</view>
|
|
</view>
|
|
|
|
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>券号</view>
|
|
<view>{{ bill?.order?.group?.qr_sn }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 直营显示 -->
|
|
<view v-if="isDirectSale" class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>付款时间</view>
|
|
<view>{{ bill?.order?.dtime }}</view>
|
|
</view>
|
|
|
|
<!-- 充值 -->
|
|
<view v-if="isRecharge" class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
|
<view>付款时间</view>
|
|
<view>{{ bill?.order?.pay_time }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
import { toTimes, copy } from '@/utils/tools'
|
|
import { getUserTransactionDetailsInfo } from '@/api/user'
|
|
|
|
const OSS = inject('OSS')
|
|
const bill = ref<any>({})
|
|
|
|
onLoad(async (args) => {
|
|
const id = Number(args.id) || 0
|
|
if (id) {
|
|
const res = await getUserTransactionDetailsInfo(id)
|
|
bill.value = res.details
|
|
}
|
|
})
|
|
|
|
// 团购
|
|
const isGroupBuy = computed(() => {
|
|
return bill.value.change_type === 4
|
|
})
|
|
|
|
// 直营
|
|
const isDirectSale = computed(() => {
|
|
return bill.value.change_type === 1 || bill.value.change_type === 2
|
|
})
|
|
|
|
// 充值
|
|
const isRecharge = computed(() => {
|
|
return bill.value.change_type === 9
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #fff;
|
|
}
|
|
</style>
|