|
@@ -1,136 +1,159 @@
|
|
|
<template>
|
|
|
<view class="order-pages">
|
|
|
- <view class="order-list">
|
|
|
- <view class="order-list-item" @click="goView">
|
|
|
- <view>
|
|
|
- <view>高新二路站</view>
|
|
|
- <view class="order-finish">已完成</view>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-carNo">13709146191</view>
|
|
|
- <u-icon name="arrow-right" color="#666" size="28"></u-icon>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-price">
|
|
|
- <text>¥9.8</text>
|
|
|
- <text>微信支付</text>
|
|
|
+ <scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="reachBottom">
|
|
|
+ <view class="order-list">
|
|
|
+ <view v-for="item in list" :key="item.id" class="order-list-item" @click="goView(item)">
|
|
|
+ <view>
|
|
|
+ <view>{{item.storeName}}</view>
|
|
|
+ <view class="order-finish">{{item.payStatus}}</view>
|
|
|
</view>
|
|
|
- <view>2020-07-25 16:20:33</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="order-list-item">
|
|
|
- <view>
|
|
|
- <view>高新二路站</view>
|
|
|
- <view class="order-unPay">待支付</view>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-carNo">13709146191</view>
|
|
|
- <u-icon name="arrow-right" color="#666" size="28"></u-icon>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-price">
|
|
|
- <text>¥9.8</text>
|
|
|
- <text>微信支付</text>
|
|
|
+ <view>
|
|
|
+ <view class="order-carNo">{{item.customerMobile}}</view>
|
|
|
+ <u-icon name="arrow-right" color="#666" size="28"></u-icon>
|
|
|
</view>
|
|
|
- <view>2020-07-25 16:20:33</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="order-list-item">
|
|
|
- <view>
|
|
|
- <view>高新二路站</view>
|
|
|
- <view class="order-cansel">已取消</view>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-carNo">13709146191</view>
|
|
|
- <u-icon name="arrow-right" color="#666" size="28"></u-icon>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="order-price">
|
|
|
- <text>¥9.8</text>
|
|
|
- <text>微信支付</text>
|
|
|
+ <view>
|
|
|
+ <view class="order-price">
|
|
|
+ <text>¥{{item.paymentAmount}}</text>
|
|
|
+ <text>{{item.payType}}</text>
|
|
|
+ </view>
|
|
|
+ <view>2020-07-25 16:20:33</view>
|
|
|
</view>
|
|
|
- <view>2020-07-25 16:20:33</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ <u-empty :text="noDataText" img-width="120" v-if="list.length==0 && status!='loading'" mode="list"></u-empty>
|
|
|
+ <view style="padding: 20upx;">
|
|
|
+ <u-loadmore v-if="total>pageSize || status=='loading'" :status="status" />
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import {getOrderList, orderDetail} from '@/api/order.js'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ noDataText: '暂无数据',
|
|
|
+ status: 'loadmore',
|
|
|
list:[],
|
|
|
pageNo:1,
|
|
|
pageSize:15,
|
|
|
count:0,
|
|
|
- status:'loading'
|
|
|
};
|
|
|
},
|
|
|
+ onLoad() {
|
|
|
+ this.getList()
|
|
|
+ console.log(this.orderStatusList,'1111')
|
|
|
+ },
|
|
|
methods: {
|
|
|
+
|
|
|
+ getOptionName (list,val) {
|
|
|
+ let p = list.find((item) => {
|
|
|
+ return item.code == val
|
|
|
+ })
|
|
|
+ return p ? p.dispName : '-'
|
|
|
+ },
|
|
|
// 获取订单列表
|
|
|
getList() {
|
|
|
-
|
|
|
+ this.status = "loading"
|
|
|
+ let orderStatusList = this.$store.state.vuex_payStatus
|
|
|
+ let payTypeList = this.$store.state.vuex_payType
|
|
|
+ let params = {
|
|
|
+ pageNo: this.pageNo,
|
|
|
+ pageSize: this.pageSize
|
|
|
+ }
|
|
|
+ getOrderList(params).then(res=>{
|
|
|
+ this.status = "loadmore"
|
|
|
+ if(res.status == 200) {
|
|
|
+ let list = res.data.list
|
|
|
+ list.map(item => {
|
|
|
+ item.payStatus = this.getOptionName(orderStatusList,item.payStatus)
|
|
|
+ item.payType = item.payType ? this.getOptionName(payTypeList,item.payType) : ''
|
|
|
+ })
|
|
|
+ this.list = this.list.concat(list)
|
|
|
+ this.count = res.data.count
|
|
|
+ } else {
|
|
|
+ this.list = []
|
|
|
+ this.count = 0
|
|
|
+ this.noDataText = res.message
|
|
|
+ this.toashMsg(res.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
// 查看详情
|
|
|
goView(item){
|
|
|
uni.navigateTo({
|
|
|
url:"/pages/order/orderDetail?id="+item.id
|
|
|
})
|
|
|
+ },
|
|
|
+ // 滚动到底部自动加载下页
|
|
|
+ reachBottom() {
|
|
|
+ console.log(22)
|
|
|
+ if(this.list.length < this.count){
|
|
|
+ this.pageNo += 1
|
|
|
+ this.getList()
|
|
|
+ }else{
|
|
|
+ this.status = "nomore"
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
- // 滚动到底部自动加载下页
|
|
|
- onReachBottom() {
|
|
|
-
|
|
|
- }
|
|
|
+
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
+ page{
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
.order-pages{
|
|
|
width: 100%;
|
|
|
- .order-list{
|
|
|
- padding: 25rpx;
|
|
|
- .order-list-item{
|
|
|
- box-shadow: 1rpx 1rpx 5rpx #eee;
|
|
|
- border: 1px solid #eee;
|
|
|
- border-radius: 10rpx;
|
|
|
- margin: 30rpx 0;
|
|
|
- > view{
|
|
|
- padding:20rpx 30rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border-bottom: 1px dashed #eee;
|
|
|
- &:last-child{
|
|
|
- border: 0;
|
|
|
- }
|
|
|
- >view{
|
|
|
- &:first-child{
|
|
|
- flex-grow: 1;
|
|
|
- }
|
|
|
+ height: 100%;
|
|
|
+ .scroll-Y {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .order-list{
|
|
|
+ padding: 25rpx;
|
|
|
+ .order-list-item{
|
|
|
+ box-shadow: 1rpx 1rpx 5rpx #eee;
|
|
|
+ border: 1px solid #eee;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ margin: 30rpx 0;
|
|
|
+ > view{
|
|
|
+ padding:20rpx 30rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 1px dashed #eee;
|
|
|
&:last-child{
|
|
|
- padding-left: 15rpx;
|
|
|
+ border: 0;
|
|
|
}
|
|
|
- }
|
|
|
- .order-finish{
|
|
|
- color: #00aa00;
|
|
|
- }
|
|
|
- .order-unPay{
|
|
|
- color: #ff0000;
|
|
|
- }
|
|
|
- .order-cansel{
|
|
|
- color: #7e7b88;
|
|
|
- }
|
|
|
- .order-carNo{
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
- .order-price{
|
|
|
- text{
|
|
|
- margin-right: 20rpx;
|
|
|
- color: #666;
|
|
|
+ >view{
|
|
|
&:first-child{
|
|
|
- color: red;
|
|
|
- font-size: 32rpx;
|
|
|
+ flex-grow: 1;
|
|
|
+ }
|
|
|
+ &:last-child{
|
|
|
+ padding-left: 15rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .order-finish{
|
|
|
+ color: #00aa00;
|
|
|
+ }
|
|
|
+ .order-unPay{
|
|
|
+ color: #ff0000;
|
|
|
+ }
|
|
|
+ .order-cansel{
|
|
|
+ color: #7e7b88;
|
|
|
+ }
|
|
|
+ .order-carNo{
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+ .order-price{
|
|
|
+ text{
|
|
|
+ margin-right: 20rpx;
|
|
|
+ color: #666;
|
|
|
+ &:first-child{
|
|
|
+ color: red;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|