138 lines
2.7 KiB
Vue
138 lines
2.7 KiB
Vue
<template>
|
|
<view class="flex">
|
|
<view class="flex-column">
|
|
<image :src="textType[index].src" class="img"></image>
|
|
<view class="line"></view>
|
|
<view class="dot"></view>
|
|
</view>
|
|
<view style="width: 93%;">
|
|
<view class="drc">
|
|
<text class="text1">{{textType[index].tip}}</text>
|
|
<text class="text2">{{textType[index].desc}}</text>
|
|
</view>
|
|
<view style="margin-top: 20rpx;">
|
|
<view class="content">
|
|
<view>{{radiolist[2]}}</view>
|
|
<view style="color: #909399;">{{radiolist[0]}} {{radiolist[1]}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="querytot"></view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onShow } from '@dcloudio/uni-app';
|
|
import { ref } from 'vue'
|
|
const radiolist = ref([])
|
|
const lineHeight=ref('100rpx')//默认60rpx
|
|
const index=ref(0)
|
|
const textType=ref([
|
|
{
|
|
tip:'仓库处理中',
|
|
desc:'仓库正在加急发货，请耐心等待',
|
|
src:'../../static/0628仓库.png'
|
|
},
|
|
{
|
|
tip:'快递已发货',
|
|
desc:'快递已经发货，请耐心等待',
|
|
src:'../../static/0628仓库.png'
|
|
},
|
|
{
|
|
tip:'已完成',
|
|
desc:'本次服务已完成，欢迎再次购买',
|
|
src:'../../static/0628已完成.png'
|
|
},
|
|
{
|
|
tip:'已取消',
|
|
desc:'欢迎下次选购',
|
|
src:'../../static/0628已取消.png'
|
|
},
|
|
{
|
|
tip:'已关闭',
|
|
desc:'本次服务已关闭，有疑问可以联系我们。欢迎再次购买',
|
|
src:'../../static/0628已关闭.png'
|
|
},
|
|
])
|
|
const goodList=ref()
|
|
|
|
onShow(()=>{
|
|
goodList.value=JSON.parse(uni.getStorageSync('orderGoods'))
|
|
radiolist.value=goodList.value.deliveryAddress.split("\n")
|
|
|
|
if(goodList.value.status=='PAID'){
|
|
index.value=0
|
|
}else if(goodList.value.status=='DELIVERED'){
|
|
index.value=1
|
|
}else if(goodList.value.status=='FINISHED'){
|
|
index.value=2
|
|
}else if(goodList.value.status=='CANCELED'){
|
|
index.value=3
|
|
}else if(goodList.value.status=='CLOSED'){
|
|
index.value=4
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.querytot {
|
|
background: url(../../static/bottomBorder.png) bottom repeat-x;
|
|
background-size: 50%;
|
|
padding: 10rpx 0 0;
|
|
}
|
|
.img{
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
|
|
.flex-column {
|
|
display: flex;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
padding-left: 5%;
|
|
width: 7%;
|
|
}
|
|
|
|
.dot {
|
|
margin: 0 16rpx;
|
|
width: 30rpx;
|
|
height: 30rpx;
|
|
border-radius: 100%;
|
|
background-color: #ffc4bc;
|
|
}
|
|
|
|
.line {
|
|
border-right: 1rpx solid #000000;
|
|
width: 30rpx;
|
|
margin: 10rpx 0;
|
|
height: v-bind(lineHeight);
|
|
}
|
|
|
|
.drc {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-direction: column;
|
|
padding: 10rpx 20rpx;
|
|
|
|
.text1 {
|
|
color: red;
|
|
}
|
|
|
|
.text2 {
|
|
color: #999;
|
|
}
|
|
}
|
|
|
|
.img-icon {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
}
|
|
|
|
.content {
|
|
padding: 10rpx 20rpx;
|
|
}
|
|
</style> |