UI
This commit is contained in:
parent
c9ec5a5dbc
commit
ec6c4d6cea
|
|
@ -100,6 +100,7 @@
|
|||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 申请提货/已发货/完成提货 -->
|
||||
<view v-else class="order-list">
|
||||
<view class="order-item" v-for="(item, i) in listData" :key="i" @click="toOrder(item)">
|
||||
<view class="order-hd">
|
||||
|
|
@ -113,9 +114,7 @@
|
|||
<view class="pic">
|
||||
<image :src="a.goodslist_imgurl" lazy-load></image>
|
||||
<view class="num center">{{ a.prize_num }}</view>
|
||||
<view class="num"
|
||||
style="left:auto;right:0;border-radius:0rpx 0rpx 0rpx 15rpx;background: #FF4D1E;"
|
||||
v-if="a.fh_status==1">已发货</view>
|
||||
<view class="num2 center" v-if="a.fh_status==1">已发货</view>
|
||||
</view>
|
||||
|
||||
<view class="title hang1">
|
||||
|
|
@ -304,7 +303,7 @@
|
|||
</view>
|
||||
<view class="model-ft row">
|
||||
<view class="model-btn" @click="close('model')">取消</view>
|
||||
|
||||
|
||||
<view class="model-btn act" @click="$c.noDouble(submitLock)">
|
||||
确定
|
||||
</view>
|
||||
|
|
@ -953,7 +952,7 @@
|
|||
|
||||
&.act {
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
&::after {
|
||||
|
|
@ -970,7 +969,7 @@
|
|||
|
||||
&.unact {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
font-size: 28rpx;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
}
|
||||
|
|
@ -1098,19 +1097,20 @@
|
|||
left: 50%;
|
||||
bottom: 12rpx;
|
||||
transform: translateX(-50%);
|
||||
width: 50rpx;
|
||||
min-width: 50rpx;
|
||||
height: 38rpx;
|
||||
padding: 0 10rpx;
|
||||
border-radius: 18rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
.yu-tag {
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
|
|
@ -1234,6 +1234,22 @@
|
|||
color: #ffffff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.num2 {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
right: 10rpx;
|
||||
top: 10rpx;
|
||||
width: 80rpx;
|
||||
// transform: translateX(-50%);
|
||||
box-sizing: border-box;
|
||||
padding: 0 10rpx;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 16rpx;
|
||||
font-weight: 400;
|
||||
color: #E6F791;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
|
|
@ -1261,23 +1277,21 @@
|
|||
.btn {
|
||||
width: 160rpx;
|
||||
height: 60rpx;
|
||||
background: #3B3941;
|
||||
border-radius: 30rpx;
|
||||
border: 2rpx solid #D3AFFF;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #D3AFFF;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
width: 160rpx;
|
||||
height: 60rpx;
|
||||
border: 2rpx solid #FFFFFF;
|
||||
background: #894DD3;
|
||||
border-radius: 30rpx;
|
||||
background: #E6F791;
|
||||
border-radius: 16rpx;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1781,12 +1795,13 @@
|
|||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.model-ft {
|
||||
width: 100%;
|
||||
padding: 50rpx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
.model-btn {
|
||||
width: 220rpx;
|
||||
height: 72rpx;
|
||||
|
|
@ -1796,12 +1811,12 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #F5F5F5;
|
||||
|
||||
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #A5A5A5;
|
||||
|
||||
|
||||
&.act {
|
||||
background: #D8FD24;
|
||||
color: #333333;
|
||||
|
|
|
|||
|
|
@ -1,261 +1,255 @@
|
|||
<template>
|
||||
<view class="wuliu">
|
||||
<uni-nav-bar
|
||||
left-icon="left"
|
||||
title="订单详情"
|
||||
color="#fff"
|
||||
backgroundColor="transparent"
|
||||
:fixed="true"
|
||||
:statusBar="true"
|
||||
:border="false"
|
||||
@clickLeft="back"
|
||||
></uni-nav-bar>
|
||||
<view class="wuliu">
|
||||
<uni-nav-bar left-icon="left" title="物流详情" color="#000000" backgroundColor="transparent" :fixed="true"
|
||||
:statusBar="true" :border="false" @clickLeft="back"></uni-nav-bar>
|
||||
|
||||
<view class="status">
|
||||
<view class="status_image">
|
||||
<image :src="imgurl.goodslist_imgurl"></image>
|
||||
<!-- <view class="status_foot">共{{ imgurl.count }}件商品</view> -->
|
||||
</view>
|
||||
<view>
|
||||
<view class="sta_1">
|
||||
物流状态：
|
||||
<text>{{ imgurl.delivery_status }}</text>
|
||||
</view>
|
||||
<view class="sta_2">快递公司：{{ imgurl.courier_name }}</view>
|
||||
<view class="sta_3">
|
||||
快递单号：{{ imgurl.courier_number }}
|
||||
<text @click="copy(imgurl.courier_number)">复制</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="status">
|
||||
<view class="status_image">
|
||||
<image :src="imgurl.goodslist_imgurl"></image>
|
||||
<!-- <view class="status_foot">共{{ imgurl.count }}件商品</view> -->
|
||||
</view>
|
||||
<view>
|
||||
<view class="sta_1">
|
||||
物流状态：
|
||||
<text>{{ imgurl.delivery_status }}</text>
|
||||
</view>
|
||||
<view class="sta_2">快递公司：{{ imgurl.courier_name }}</view>
|
||||
<view class="sta_3 flex align-center">
|
||||
快递单号：{{ imgurl.courier_number }}
|
||||
<!-- <text @click="copy(imgurl.courier_number)">复制</text> -->
|
||||
<image @click="copy(imgurl.courier_number)" :src="$img1('shangdai/copy.png')" mode="widthFix"
|
||||
style="width: 28rpx; height: 28rpx; margin-left: 20rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="tracesData.length > 0" class="news_z">
|
||||
<view v-for="(item, index) in tracesData" :key="index" class="con">
|
||||
<view class="con_l">
|
||||
<view :class="index == 0 ? 'yuan2' : 'yuan'">
|
||||
<!-- <view v-if="index == 0" class="yuan3"></view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="con_r" :style="index == 0 ? 'color:#fff' : 'color:#ccc'">
|
||||
<view class="title" :style="index == 0 ? 'font-size:28rpx' : ''">
|
||||
{{ item.status }}
|
||||
</view>
|
||||
<view class="time" :style="index == 0 ? 'color:#fff' : 'color:#ccc'">
|
||||
{{ item.time }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="tracesData.length > 0" class="news_z">
|
||||
<view v-for="(item, index) in tracesData" :key="index" class="con">
|
||||
<view class="con_l">
|
||||
<view :class="index == 0 ? 'yuan2' : 'yuan'">
|
||||
<!-- <view v-if="index == 0" class="yuan3"></view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="con_r" :style="index == 0 ? 'color:#fff' : 'color:#ccc'">
|
||||
<view class="title" :style="index == 0 ? 'font-size:28rpx' : ''">
|
||||
{{ item.status }}
|
||||
</view>
|
||||
<view class="time" :style="index == 0 ? 'color:#fff' : 'color:#ccc'">
|
||||
{{ item.time }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tracesData: [],
|
||||
imgurl: {}
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.getData(e.id)
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tracesData: [],
|
||||
imgurl: {}
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.getData(e.id)
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
|
||||
getData(e) {
|
||||
let that = this
|
||||
that.req({
|
||||
url: 'warehouse_order_logistics',
|
||||
data: {
|
||||
id: e
|
||||
},
|
||||
success(res) {
|
||||
if (res.status == 1) {
|
||||
that.imgurl = res.data
|
||||
that.tracesData = res.data.delivery_list
|
||||
// that.tracesData = [
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// },
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// },
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// }
|
||||
// ]
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
copy(value) {
|
||||
uni.setClipboardData({
|
||||
data: value, //要被复制的内容
|
||||
success: () => {
|
||||
//复制成功的回调函数
|
||||
uni.showToast({
|
||||
//提示
|
||||
title: '复制成功'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
getData(e) {
|
||||
let that = this
|
||||
that.req({
|
||||
url: 'warehouse_order_logistics',
|
||||
data: {
|
||||
id: e
|
||||
},
|
||||
success(res) {
|
||||
if (res.status == 1) {
|
||||
that.imgurl = res.data
|
||||
that.tracesData = res.data.delivery_list
|
||||
// that.tracesData = [
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// },
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// },
|
||||
// {
|
||||
// status: '状态状态状态状态状态状态',
|
||||
// time: '时间时间'
|
||||
// }
|
||||
// ]
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
copy(value) {
|
||||
uni.setClipboardData({
|
||||
data: value, //要被复制的内容
|
||||
success: () => {
|
||||
//复制成功的回调函数
|
||||
uni.showToast({
|
||||
//提示
|
||||
title: '复制成功'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.qiehuan_line {
|
||||
margin: -10rpx auto;
|
||||
width: 30rpx;
|
||||
height: 20rpx;
|
||||
border-bottom: 2rpx solid #ff7514;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
.qiehuan_line {
|
||||
margin: -10rpx auto;
|
||||
width: 30rpx;
|
||||
height: 20rpx;
|
||||
border-bottom: 2rpx solid #ff7514;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
|
||||
.news_z {
|
||||
width: 690rpx;
|
||||
margin: 20rpx auto 0;
|
||||
background: #3B3941;
|
||||
}
|
||||
.news_z {
|
||||
width: 690rpx;
|
||||
margin: 20rpx auto 0;
|
||||
background: #3B3941;
|
||||
}
|
||||
|
||||
.yuan3 {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background: #1ff7f0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.yuan3 {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background: #1ff7f0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.yuan2 {
|
||||
background: #d0d1ff;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.yuan2 {
|
||||
background: #d0d1ff;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.time {
|
||||
color: #ffffff;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.time {
|
||||
color: #ffffff;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.con_l {
|
||||
width: 120rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
.con_l {
|
||||
width: 120rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
.title {
|
||||
/* color: rgba(255, 255, 255, 0.6); */
|
||||
line-height: 36rpx;
|
||||
}
|
||||
.title {
|
||||
/* color: rgba(255, 255, 255, 0.6); */
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
.con_r {
|
||||
width: 600rpx;
|
||||
font-size: 24rpx;
|
||||
border-bottom: 1rpx solid #666666;
|
||||
padding: 20rpx 0;
|
||||
margin-right: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.con_r {
|
||||
width: 600rpx;
|
||||
font-size: 24rpx;
|
||||
border-bottom: 1rpx solid #666666;
|
||||
padding: 20rpx 0;
|
||||
margin-right: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.yuan {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background: #666666;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.yuan {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background: #666666;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.con {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
.con {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
&:last-child {
|
||||
.con_r {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
.con_r {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sta_3 text {
|
||||
font-size: 20rpx;
|
||||
margin-left: 24rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
color: #ffffff;
|
||||
border: 1px solid;
|
||||
}
|
||||
.sta_3 text {
|
||||
font-size: 20rpx;
|
||||
margin-left: 24rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
color: #ffffff;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.sta_2,
|
||||
.sta_3 {
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.sta_2,
|
||||
.sta_3 {
|
||||
font-size: 24rpx;
|
||||
color: #8A8A8A;
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
|
||||
.sta_1 {
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.sta_1 {
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
font-weight: 500;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.status_foot {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
border-radius: 0 0 10rpx 10rpx;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
width: 100%;
|
||||
height: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.status_foot {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
border-radius: 0 0 10rpx 10rpx;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
width: 100%;
|
||||
height: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.status image {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.status image {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.status_image {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
margin-right: 34rpx;
|
||||
border-radius: 10rpx;
|
||||
position: relative;
|
||||
}
|
||||
.status_image {
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
margin-right: 34rpx;
|
||||
border-radius: 10rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.status {
|
||||
width: 690rpx;
|
||||
margin: 20rpx auto 0;
|
||||
background: #3B3941;
|
||||
border-radius: 20rpx;
|
||||
padding: 30rpx 24rpx 30rpx 24rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
}
|
||||
.status {
|
||||
width: 690rpx;
|
||||
margin: 20rpx auto 0;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
padding: 30rpx 24rpx 30rpx 24rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.wuliu {
|
||||
width: 100vw;
|
||||
/* background: #000000; */
|
||||
min-height: 100vh;
|
||||
padding-top: 2rpx;
|
||||
padding-bottom: 100rpx;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
background-attachment: fixed;
|
||||
background-size: 100vw 100vh;
|
||||
}
|
||||
</style>
|
||||
.wuliu {
|
||||
width: 100vw;
|
||||
background: #F7F7F7;
|
||||
min-height: 100vh;
|
||||
padding-top: 2rpx;
|
||||
padding-bottom: 100rpx;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
background-attachment: fixed;
|
||||
background-size: 100vw 100vh;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user