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.
356 lines
7.0 KiB
356 lines
7.0 KiB
<template> |
|
<view class="container"> |
|
<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
|
<block slot="backText">返回</block> |
|
<block slot="content">订单提货</block> |
|
</cu-custom> |
|
|
|
<view class="code">提货码: {{code}}</view> |
|
|
|
<scroll-view v-if="dataList.length" class="list" :scroll-y="true" @scrolltolower="lower"> |
|
<view class="item" v-for="item,index in dataList" :key="index"> |
|
<view class="header">用户手机：{{item.customerPhone}}<text>{{item.statusMerge}}</text></view> |
|
<view class="introduce"> |
|
<image :src="item.oderDetailImg"></image> |
|
<view>{{item.productName}}</view> |
|
<view>规格：{{handler(item.attributeJson)}}</view> |
|
<view>￥{{item.marketPrice}} X{{item.orderNum}}</view> |
|
<view>共{{item.orderNum}}件商品已支付积分：{{item.payIntegral}}</view> |
|
</view> |
|
<view class="footer"> |
|
提货码：{{item.takeCode}} |
|
<view class="button" v-if="item.statusMerge=='待核销'" @click="determine">确定提货</view> |
|
</view> |
|
</view> |
|
</scroll-view> |
|
<view v-else class="empty"> |
|
<image src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/yunsite-empty.png"></image> |
|
<view>还没有订单哦~</view> |
|
</view> |
|
|
|
|
|
<view class="take-frame" v-if="controlWindows.code"> |
|
<view>请输入提货码</view> |
|
<view>提货码或手机后四位</view> |
|
<view class="code"> |
|
<xt-verify-code v-model="code" cursorColor="#333" boxNormalColor="#EAEAEA" boxActiveColor="#EAEAEA" |
|
@confirm="confirm" :size="4" :isFocus="false"></xt-verify-code> |
|
</view> |
|
</view> |
|
|
|
<!-- <button class="button" type="primary" @click="toggle('center')"><text class="button-text">居中</text></button> --> |
|
|
|
|
|
|
|
|
|
<uni-popup ref="popup"> |
|
<view class="determine-frame"> |
|
<view class="title">是否立即提货</view> |
|
<view class="buttons"> |
|
<view @click="$refs.popup.close()">取消</view> |
|
<view @click="submitFirm">确认</view> |
|
</view> |
|
</view> |
|
</uni-popup> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import serve from '@/api/packageIntegral/orderList.js' |
|
|
|
export default { |
|
options: { |
|
styleIsolation: 'shared' |
|
}, |
|
data() { |
|
return { |
|
code: '', |
|
controlWindows: { |
|
code: true |
|
}, |
|
paramter: { |
|
currentPage: 1, |
|
pagesize: 20, |
|
params: { |
|
takeCode: '', |
|
customerPhone:'' |
|
}, |
|
}, |
|
dataList: [] |
|
} |
|
}, |
|
|
|
onLoad() {}, |
|
|
|
methods: { |
|
determine() { |
|
this.$refs.popup.open('center') |
|
}, |
|
handler(json) { |
|
json = json.replace(/'/g, '"') |
|
let res = JSON.parse(json) |
|
let values = Object.values(res) |
|
let text =values.reduce((prev,item,index) => { |
|
let _text = `${index == 0 ? '' :','}${item}` |
|
return prev += _text |
|
},'') |
|
return text |
|
}, |
|
confirm() { |
|
this.controlWindows.code = false |
|
this.paramter.params.takeCode = this.code |
|
this.paramter.params.customerPhone = this.code |
|
this.getByPageCloudMini() |
|
}, |
|
getByPageCloudMini() { |
|
serve.getByPageCloudMini(this.paramter).then(res => { |
|
if (res.code === 20000) { |
|
if (!res.data.list.length) { |
|
uni.showToast({ |
|
title: '没有更多订单啦~', |
|
icon: 'none' |
|
}) |
|
return |
|
} |
|
if (this.paramter.currentPage == 1) { |
|
this.dataList = [] |
|
} |
|
this.dataList = this.dataList.concat(res.data.list) |
|
// console.log(this.dataList) |
|
} |
|
}) |
|
}, |
|
submitFirm(){ |
|
|
|
let data = {} |
|
data.id = this.dataList[0].orderId |
|
data.takeCode = this.dataList[0].takeCode |
|
serve.takeOrder(data).then(res => { |
|
if (res.code === 20000) { |
|
uni.showToast({ |
|
title: res.msg, |
|
icon: 'none' |
|
}); |
|
this.$refs.popup.close(); |
|
uni.navigateTo({ |
|
url: '/packageIntegral/orderDetails/index' |
|
}) |
|
} |
|
}) |
|
|
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
/deep/ .xt__verify-code .xt__input-ground .xt__box { |
|
width: 146rpx; |
|
height: 146rpx; |
|
border-width: 1rpx; |
|
border-radius: 14rpx; |
|
} |
|
|
|
.determine-frame { |
|
padding-top: 85rpx; |
|
width: 681rpx; |
|
height: 340rpx; |
|
background: #FFFFFF; |
|
border-radius: 15rpx; |
|
|
|
>.title { |
|
text-align: center; |
|
font-size: 38rpx; |
|
color: #000; |
|
|
|
} |
|
|
|
>.buttons { |
|
|
|
display: flex; |
|
justify-content: space-evenly; |
|
margin-top: 80rpx; |
|
|
|
>view { |
|
width: 250rpx; |
|
height: 76rpx; |
|
text-align: center; |
|
line-height: 76rpx; |
|
border-radius: 10rpx; |
|
font-size: 28rpx; |
|
|
|
&:nth-of-type(1) { |
|
background: #FFFFFF; |
|
border: 1rpx solid #B6B6B6; |
|
color: #333; |
|
} |
|
|
|
&:nth-of-type(2) { |
|
background: #FE0505; |
|
color: #fff; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.take-frame { |
|
position: fixed; |
|
top: 84px; |
|
left: 0; |
|
z-index: 100; |
|
padding-top: 94rpx; |
|
height: calc(100vh - 84px); |
|
width: 100%; |
|
background: #fff; |
|
|
|
>view { |
|
padding-left: 31rpx; |
|
|
|
&:nth-of-type(1) { |
|
font-size: 48rpx; |
|
font-weight: 550; |
|
color: #000; |
|
} |
|
|
|
&:nth-of-type(2) { |
|
margin-top: 18rpx; |
|
font-size: 36rpx; |
|
color: #999; |
|
} |
|
} |
|
|
|
>.code { |
|
padding-right: 31rpx; |
|
margin-top: 61rpx; |
|
} |
|
} |
|
|
|
.container { |
|
height: 100vh; |
|
display: flex; |
|
flex-direction: column; |
|
background: #fff; |
|
|
|
>.code { |
|
margin: 37rpx auto 0; |
|
width: 686rpx; |
|
height: 88rpx; |
|
line-height: 88rpx; |
|
text-align: center; |
|
font-size: 32rpx; |
|
color: #000; |
|
background: #F7F7F7; |
|
} |
|
|
|
>.list { |
|
margin-top: 23rpx; |
|
flex: 1; |
|
overflow-y: hidden; |
|
|
|
.item { |
|
position: relative; |
|
background: #fff; |
|
border-bottom: 12rpx solid #F1F2F7; |
|
|
|
&:nth-last-of-type(1) { |
|
border-bottom: none |
|
} |
|
|
|
.header { |
|
padding: 26rpx 23rpx 0; |
|
height: 80rpx; |
|
width: 100%; |
|
font-size: 30rpx; |
|
color: #666; |
|
border-bottom: 1rpx solid #D7D7D7; |
|
|
|
>text { |
|
float: right; |
|
color: #F83D3D; |
|
} |
|
} |
|
|
|
.introduce { |
|
position: relative; |
|
padding: 24rpx 29rpx 0 268rpx; |
|
min-height: 220rpx; |
|
|
|
>image { |
|
position: absolute; |
|
top: 13rpx; |
|
left: 34rpx; |
|
width: 220rpx; |
|
height: 220rpx; |
|
// border: 1px solid #333; |
|
} |
|
|
|
>view { |
|
&:nth-of-type(1) { |
|
font-size: 28rpx; |
|
color: #000; |
|
} |
|
|
|
&:nth-of-type(2), |
|
&:nth-of-type(3) { |
|
margin-top: 11rpx; |
|
font-size: 24rpx; |
|
color: #999; |
|
} |
|
|
|
&:nth-of-type(3) { |
|
margin-top: 18rpx; |
|
|
|
} |
|
|
|
&:nth-of-type(4) { |
|
margin-top: 11rpx; |
|
font-size: 26rpx; |
|
color: #333; |
|
} |
|
} |
|
} |
|
|
|
>.footer { |
|
position: relative; |
|
margin-top: 40rpx; |
|
line-height: 78rpx; |
|
padding: 0 34rpx 40rpx; |
|
font-size: 32rpx; |
|
color: #000; |
|
font-weight: 550; |
|
|
|
.button { |
|
position: absolute; |
|
top: 0; |
|
right: 40rpx; |
|
width: 198rpx; |
|
height: 78rpx; |
|
line-height: 78rpx; |
|
text-align: center; |
|
font-size: 28rpx; |
|
color: #FFF; |
|
background: #FE0606; |
|
border-radius: 10rpx; |
|
} |
|
} |
|
} |
|
} |
|
|
|
>.empty { |
|
margin: 218rpx auto 0; |
|
|
|
>image { |
|
width: 473rpx; |
|
height: 404rpx; |
|
} |
|
|
|
>view { |
|
margin-top: 45rpx; |
|
text-align: center; |
|
font-size: 28rpx; |
|
color: #999; |
|
} |
|
} |
|
|
|
} |
|
</style>
|
|
|