You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
140 lines
3.3 KiB
140 lines
3.3 KiB
<template>
|
|
<view class="head">
|
|
<view class="address">
|
|
<div class="df">
|
|
<div class="address-img">
|
|
<image :src="$util.img('/upload/weapp/user/camera.png')" mode=""></image>
|
|
</div>
|
|
<div class="address-jigxi">
|
|
<div>江西省吉安市万安县兰花路614号</div>
|
|
<div>格娴茜<span>14498525585</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="address-button">
|
|
<image :src="$util.img('/upload/weapp/user/camera.png')" mode=""></image>
|
|
</div>
|
|
</view>
|
|
<view class="logistics">
|
|
<div>物流公司<span>顺丰</span></div>
|
|
<div>物流单号<span>384757577549985</span></div>
|
|
<div>订单编号<span>23948557757373756757</span></div>
|
|
</view>
|
|
<view class="Order-status">
|
|
<u-steps current="0" direction="column">
|
|
<u-steps-item title="运输中 12-24 18:16" desc="【义乌市转运中心直营】已出发下一站下一站下一站下一站是【广州是转运中心】。">
|
|
</u-steps-item>
|
|
<u-steps-item title="已揽收 12-24 18:16" desc="浙江省金华市转运中心直营已揽收。取件人：王二麻子（16655553636）新冠疫苗已接种" ></u-steps-item>
|
|
<u-steps-item title="已发货 12-24 18:16" desc="浙江省金华市转运中心直营已揽收。取件人：王二麻子（16655553636）新冠疫苗已接种"></u-steps-item>
|
|
<u-steps-item title="已下单 12-24 18:16" desc="商品已下单，商家运输中"></u-steps-item>
|
|
|
|
</u-steps>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
|
|
};
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.head{
|
|
padding: 24rpx;
|
|
.address{
|
|
width: 702rpx;
|
|
height: 172rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
.address-button{
|
|
position: relative;
|
|
width: 730rpx;
|
|
height: 6rpx;
|
|
bottom:-6rpx ;
|
|
image{
|
|
width: 730rpx;
|
|
height: 6rpx;
|
|
}
|
|
}
|
|
.address-img{
|
|
width: 44rpx;
|
|
height: 44rpx;
|
|
margin: 34rpx 8rpx 0 24rpx;
|
|
image{
|
|
width: 44rpx;
|
|
height: 44rpx;
|
|
}
|
|
}
|
|
.address-jigxi{
|
|
div:nth-child(1){
|
|
font-size: 32rpx;
|
|
font-family: PingFangSC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #222222;
|
|
line-height: 48rpx;
|
|
margin-top: 32rpx;
|
|
}
|
|
div:nth-child(2){
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #222222;
|
|
line-height: 44rpx;
|
|
margin-top: 8rpx;
|
|
span{
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
line-height: 44rpx;
|
|
margin-left: 16rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.logistics{
|
|
width: 702rpx;
|
|
height: 240rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
border: 2rpx solid #FFFFFF;
|
|
margin-top: 196rpx;
|
|
padding: 8rpx 32rpx 0 32rpx;
|
|
box-sizing: border-box;
|
|
div:nth-child(n+1){
|
|
margin-top: 24rpx;
|
|
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
line-height: 40rpx;
|
|
span{
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #222222;
|
|
line-height: 40rpx;
|
|
margin-left: 50rpx;
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
.Order-status{
|
|
width: 702rpx;
|
|
height: 634rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
margin-top: 24rpx;
|
|
padding: 32rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
</style>
|
|
|