|
|
|
@ -2,8 +2,11 @@ |
|
|
|
<view class="page"> |
|
|
|
<view class="fixed-head"> |
|
|
|
<view class="nav" :style="{'height': navHeight + 'px'}"> |
|
|
|
<view class="back" :style="{'top': backTop + 'px'}" @tap="back"><uni-icons type="left" size="26"></uni-icons></view> |
|
|
|
<view class="title" :style="{'top': titleTop + 'px','height': capsuleHeight + 'px','line-height': capsuleHeight + 'px'}">中转配送</view> |
|
|
|
<view class="back" :style="{'top': backTop + 'px'}" @tap="back"><uni-icons type="left" |
|
|
|
size="26"></uni-icons></view> |
|
|
|
<view class="title" |
|
|
|
:style="{'top': titleTop + 'px','height': capsuleHeight + 'px','line-height': capsuleHeight + 'px'}"> |
|
|
|
中转配送</view> |
|
|
|
</view> |
|
|
|
<view class="tabs"> |
|
|
|
<view class="tab" :class="{active: tab === 'wait'}" @tap="switchTab('wait')">待送达</view> |
|
|
|
@ -174,7 +177,8 @@ |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
getList() { |
|
|
|
this.NB.sendRequest("/mall/delivery/pageTransferDelivery", this.searchForm, false, 'post', 'application/json').then((res) => { |
|
|
|
this.NB.sendRequest("/mall/delivery/pageTransferDelivery", this.searchForm, false, 'post', |
|
|
|
'application/json').then((res) => { |
|
|
|
if (res.code == 200) { |
|
|
|
const records = res.result.records || [] |
|
|
|
this.list = this.searchForm.pageNum == 1 ? records : this.list.concat(records) |
|
|
|
@ -272,34 +276,208 @@ |
|
|
|
</script> |
|
|
|
|
|
|
|
<style> |
|
|
|
.page{height:100vh;background:#F5F8F5;padding:0 24rpx;box-sizing:border-box;position:relative;overflow:hidden;} |
|
|
|
.fixed-head{position:absolute;top:0;left:24rpx;right:24rpx;z-index:9;background:#F5F8F5;} |
|
|
|
.nav{position:relative;display:flex;align-items:center;justify-content:center;} |
|
|
|
.back{position:absolute;left:0;width:68rpx;height:68rpx;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;} |
|
|
|
.title{position:absolute;font-size:32rpx;font-weight:800;text-align:center;} |
|
|
|
.tabs{display:flex;background:#fff;border-radius:24rpx;padding:10rpx;} |
|
|
|
.tab{flex:1;text-align:center;height:70rpx;line-height:70rpx;border-radius:20rpx;font-weight:700;} |
|
|
|
.tab.active{background:linear-gradient(90deg,#e3ff96,#a6ffea);} |
|
|
|
.list{width:94%;position:absolute;left:24rpx;right:24rpx;bottom:0;box-sizing:border-box;padding-top:20rpx;padding-bottom:36rpx;} |
|
|
|
.card{background:#fff;border-radius:24rpx;padding:24rpx;margin-bottom:20rpx;box-shadow:0 10rpx 26rpx rgba(0,35,28,.08);} |
|
|
|
.card-head{display:flex;align-items:center;margin-bottom:20rpx;} |
|
|
|
.tag{background:#fff2e9;color:#f36c21;border-radius:12rpx;padding:8rpx 14rpx;font-weight:700;} |
|
|
|
.appointment-delivery-tag{margin-left:12rpx;padding:8rpx 14rpx;border-radius:12rpx;background:linear-gradient(135deg,#ff8f1f 0%,#ff6a3d 100%);color:#fff;font-size:22rpx;font-weight:800;box-shadow:0 8rpx 18rpx rgba(255,106,61,.16);} |
|
|
|
.code{margin-left:auto;font-weight:800;font-size:32rpx;} |
|
|
|
.row{display:flex;line-height:46rpx;} |
|
|
|
.label{width:120rpx;color:#7a8582;} |
|
|
|
.value{flex:1;font-weight:700;} |
|
|
|
.phone-value{display:flex;align-items:center;gap:16rpx;color:#123d35;} |
|
|
|
.phone{color:#0b9b73;text-decoration:underline;} |
|
|
|
.pickup-code{color:#f36c21;font-size:34rpx;letter-spacing:4rpx;} |
|
|
|
.address{margin-top:10rpx;color:#6c7773;line-height:40rpx;} |
|
|
|
.image-row image{width:160rpx;height:160rpx;border-radius:16rpx;margin-top:16rpx;} |
|
|
|
.arrive-info{margin-top:22rpx;padding:18rpx 20rpx;border-radius:18rpx;background:#f2f6f4;color:#0b9b73;font-weight:700;text-align:center;} |
|
|
|
.actions{display:flex;margin-top:22rpx;gap:18rpx;} |
|
|
|
.photo-btn,.main-btn{flex:1;height:76rpx;line-height:76rpx;text-align:center;border-radius:38rpx;font-weight:700;} |
|
|
|
.photo-btn{background:#f2f6f4;color:#0b9b73;} |
|
|
|
.main-btn{background:linear-gradient(90deg,#e3ff96,#a6ffea);color:#00231c;} |
|
|
|
.empty{text-align:center;color:#8a9692;padding:80rpx 0;} |
|
|
|
.page { |
|
|
|
height: 100vh; |
|
|
|
background: #F5F8F5; |
|
|
|
padding: 0 24rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
|
|
|
|
.fixed-head { |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
left: 24rpx; |
|
|
|
right: 24rpx; |
|
|
|
z-index: 9; |
|
|
|
background: #F5F8F5; |
|
|
|
} |
|
|
|
|
|
|
|
.nav { |
|
|
|
position: relative; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
|
|
|
|
.back { |
|
|
|
position: absolute; |
|
|
|
left: 0; |
|
|
|
width: 68rpx; |
|
|
|
height: 68rpx; |
|
|
|
border-radius: 50%; |
|
|
|
background: #fff; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
|
|
|
|
.title { |
|
|
|
position: absolute; |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: 800; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.tabs { |
|
|
|
display: flex; |
|
|
|
background: #fff; |
|
|
|
border-radius: 24rpx; |
|
|
|
padding: 10rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tab { |
|
|
|
flex: 1; |
|
|
|
text-align: center; |
|
|
|
height: 70rpx; |
|
|
|
line-height: 70rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
font-weight: 700; |
|
|
|
} |
|
|
|
|
|
|
|
.tab.active { |
|
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea); |
|
|
|
} |
|
|
|
|
|
|
|
.list { |
|
|
|
width: 94%; |
|
|
|
position: absolute; |
|
|
|
left: 24rpx; |
|
|
|
right: 24rpx; |
|
|
|
bottom: 0; |
|
|
|
box-sizing: border-box; |
|
|
|
padding-top: 20rpx; |
|
|
|
padding-bottom: 36rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.card { |
|
|
|
background: #fff; |
|
|
|
border-radius: 24rpx; |
|
|
|
padding: 24rpx; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
box-shadow: 0 10rpx 26rpx rgba(0, 35, 28, .08); |
|
|
|
} |
|
|
|
|
|
|
|
.card-head { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tag { |
|
|
|
background: #fff2e9; |
|
|
|
color: #f36c21; |
|
|
|
border-radius: 12rpx; |
|
|
|
padding: 8rpx 14rpx; |
|
|
|
font-weight: 700; |
|
|
|
} |
|
|
|
|
|
|
|
.appointment-delivery-tag { |
|
|
|
margin-left: 12rpx; |
|
|
|
padding: 8rpx 14rpx; |
|
|
|
border-radius: 12rpx; |
|
|
|
background: linear-gradient(135deg, #ff8f1f 0%, #ff6a3d 100%); |
|
|
|
color: #fff; |
|
|
|
font-size: 22rpx; |
|
|
|
font-weight: 800; |
|
|
|
box-shadow: 0 8rpx 18rpx rgba(255, 106, 61, .16); |
|
|
|
} |
|
|
|
|
|
|
|
.code { |
|
|
|
margin-left: auto; |
|
|
|
font-weight: 800; |
|
|
|
font-size: 32rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.row { |
|
|
|
display: flex; |
|
|
|
line-height: 46rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.label { |
|
|
|
width: 120rpx; |
|
|
|
color: #7a8582; |
|
|
|
} |
|
|
|
|
|
|
|
.value { |
|
|
|
flex: 1; |
|
|
|
font-weight: 700; |
|
|
|
} |
|
|
|
|
|
|
|
.phone-value { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
gap: 16rpx; |
|
|
|
color: #123d35; |
|
|
|
} |
|
|
|
|
|
|
|
.phone { |
|
|
|
color: #0b9b73; |
|
|
|
text-decoration: underline; |
|
|
|
} |
|
|
|
|
|
|
|
.pickup-code { |
|
|
|
color: #f36c21; |
|
|
|
font-size: 34rpx; |
|
|
|
letter-spacing: 4rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.address { |
|
|
|
margin-top: 10rpx; |
|
|
|
color: #6c7773; |
|
|
|
line-height: 40rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.image-row image { |
|
|
|
width: 160rpx; |
|
|
|
height: 160rpx; |
|
|
|
border-radius: 16rpx; |
|
|
|
margin-top: 16rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.arrive-info { |
|
|
|
margin-top: 22rpx; |
|
|
|
padding: 18rpx 20rpx; |
|
|
|
border-radius: 18rpx; |
|
|
|
background: #f2f6f4; |
|
|
|
color: #0b9b73; |
|
|
|
font-weight: 700; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.actions { |
|
|
|
display: flex; |
|
|
|
margin-top: 22rpx; |
|
|
|
gap: 18rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.photo-btn, |
|
|
|
.main-btn { |
|
|
|
flex: 1; |
|
|
|
height: 76rpx; |
|
|
|
line-height: 76rpx; |
|
|
|
text-align: center; |
|
|
|
border-radius: 38rpx; |
|
|
|
font-weight: 700; |
|
|
|
} |
|
|
|
|
|
|
|
.photo-btn { |
|
|
|
background: #f2f6f4; |
|
|
|
color: #0b9b73; |
|
|
|
} |
|
|
|
|
|
|
|
.main-btn { |
|
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea); |
|
|
|
color: #00231c; |
|
|
|
} |
|
|
|
|
|
|
|
.empty { |
|
|
|
text-align: center; |
|
|
|
color: #8a9692; |
|
|
|
padding: 80rpx 0; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-content { |
|
|
|
width: 680rpx; |
|
|
|
max-height: 880rpx; |
|
|
|
@ -312,27 +490,32 @@ |
|
|
|
linear-gradient(180deg, #ffffff 0%, #f8fffc 100%); |
|
|
|
box-shadow: 0 24rpx 56rpx rgba(0, 35, 28, 0.18); |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-header { |
|
|
|
margin-bottom: 26rpx; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-title { |
|
|
|
color: #143d35; |
|
|
|
font-size: 36rpx; |
|
|
|
font-weight: 900; |
|
|
|
line-height: 48rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-subtitle { |
|
|
|
margin-top: 8rpx; |
|
|
|
color: #7b8a85; |
|
|
|
font-size: 24rpx; |
|
|
|
line-height: 34rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-list { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 20rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-card { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
@ -342,6 +525,7 @@ |
|
|
|
background: rgba(255, 255, 255, 0.88); |
|
|
|
box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.06); |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-img { |
|
|
|
width: 128rpx; |
|
|
|
height: 128rpx; |
|
|
|
@ -350,26 +534,31 @@ |
|
|
|
border-radius: 22rpx; |
|
|
|
background: #f0f5f3; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-img image { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-info { |
|
|
|
flex: 1; |
|
|
|
min-width: 0; |
|
|
|
padding: 0 22rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-name { |
|
|
|
color: #172f2a; |
|
|
|
font-size: 30rpx; |
|
|
|
font-weight: 900; |
|
|
|
line-height: 42rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-spec { |
|
|
|
display: flex; |
|
|
|
align-items: flex-start; |
|
|
|
margin-top: 16rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-label { |
|
|
|
flex-shrink: 0; |
|
|
|
height: 34rpx; |
|
|
|
@ -381,6 +570,7 @@ |
|
|
|
font-weight: 800; |
|
|
|
line-height: 34rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-spec-text { |
|
|
|
flex: 1; |
|
|
|
margin-left: 12rpx; |
|
|
|
@ -389,6 +579,7 @@ |
|
|
|
line-height: 34rpx; |
|
|
|
word-break: break-all; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-quantity { |
|
|
|
width: 92rpx; |
|
|
|
height: 92rpx; |
|
|
|
@ -399,18 +590,21 @@ |
|
|
|
text-align: center; |
|
|
|
box-shadow: 0 10rpx 20rpx rgba(0, 35, 28, 0.08); |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-quantity-num { |
|
|
|
padding-top: 16rpx; |
|
|
|
font-size: 30rpx; |
|
|
|
font-weight: 900; |
|
|
|
line-height: 34rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-quantity-label { |
|
|
|
margin-top: 2rpx; |
|
|
|
color: #52736b; |
|
|
|
font-size: 20rpx; |
|
|
|
line-height: 28rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.product-popup-empty { |
|
|
|
padding: 80rpx 20rpx; |
|
|
|
border-radius: 28rpx; |
|
|
|
|
