smartswrtch-app/page_fenbao/statulist/myorder/detailxq/index.vue
2024-06-05 18:07:50 +08:00

170 lines
3.9 KiB
Vue

<template>
<view class="page">
<u-navbar title="订单详情" :border-bottom="false" :background="bgc" title-color='#fff' back-icon-color="#fff" title-size='36'
height='50'></u-navbar>
<view class="box">
<view class="listxq">
<view class="nav">
<text class="shen">订单状态</text>
<text class="qian" v-if="detailobj.status == 2">
已支付
</text>
<text class="qian" v-if="detailobj.status == 1">
未支付
</text>
<text class="qian" v-if="detailobj.status == 3">
已退款
</text>
<text class="qian" v-if="detailobj.status == 4">
已取消(用户)
</text>
<text class="qian" v-if="detailobj.status == 5">
已取消(系统)
</text>
<text class="qian" v-if="detailobj.status == 6">
支付中
</text>
</view>
<view class="nav">
<text class="shen">设备编号</text><text class="qian">{{detailobj.deviceName}}</text>
</view>
<view class="nav">
<text class="shen">服务模式</text><text class="qian">{{detailobj.suitName}}</text>
</view>
<view class="nav">
<text class="shen">用户</text><text class="qian">{{detailobj.userName}}</text>
</view>
<view class="nav">
<text class="shen">消费时间</text><text class="qian">{{detailobj.createTime}}</text>
</view>
<view class="nav">
<text class="shen">订单号</text><text class="qian">{{detailobj.billNo}}</text>
</view>
<view class="nav">
<text class="shen">支付方式</text><text class="qian">{{detailobj.channelName}}</text>
</view>
<view class="xian"></view>
<view class="nav">
<text class="shen">共计</text><text class="qian">¥{{detailobj.money}}</text>
</view>
</view>
<view class="pic" @click="btnad">
<image :src="imgad" mode="" class="pic"></image>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
billId:'',
detailobj:{},
imgad:''
}
},
onLoad(option) {
this.billId = option.billId
this.getlist()
this.getad()
},
methods: {
getlist(){
this.$u.get(`/app/bill/${this.billId}`).then((res) => {
if (res.code == 200) {
this.detailobj = res.data
}
})
},
btnad(){
this.$u.get("/app/ad").then((res) => {
if (res.code == 200) {
if(res.data.urlType == 1){
uni.navigateTo({
url:'/page_fenbao/webview?url=' + res.data.url
})
}else{
uni.navigateTo({
url: res.data.url
})
}
}
})
},
getad(){
this.$u.get("/app/ad").then((res) => {
if (res.code == 200) {
this.imgad = res.data.picture
}
})
},
}
}
</script>
<style lang="scss">
/deep/ .u-title{
padding-bottom: 22rpx;
}
/deep/ .u-icon__icon{
padding-bottom: 22rpx;
}
page {
background: linear-gradient(180deg, #8883F0 0%, rgba(255, 255, 255, 0) 100%);
}
.page {
width: 750rpx;
position: fixed;
top: 0;
left: 0;
.box{
width: 750rpx;
height: 1440rpx;
background: #F4F5F7;
border-radius: 0rpx 0rpx 0rpx 0rpx;
padding-top: 24rpx;
.pic{
width: 680rpx;
height: 238rpx;
margin: auto;
margin-top: 36rpx;
border-radius: 30rpx;
}
.listxq{
width: 680rpx;
height: 618rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin: auto;
padding: 32rpx 24rpx;
box-sizing: border-box;
.nav{
display: flex;
justify-content: space-between;
margin-top: 26rpx;
.shen{
font-size: 28rpx;
color: #3D3D3D;
}
.qian{
font-size: 26rpx;
color: #808080;
}
}
.xian{
width: 630rpx;
box-sizing: border-box;
height: 1px;
margin: auto;
background-color: #F3F3F3;
margin-top: 48rpx;
margin-bottom: 20rpx;
}
}
}
}
</style>