Просмотр исходного кода

[我的订单][增加]:我的订单列表增加,订单状态的切换以及上拉加载

tags/2.2.4
meo 6 лет назад
Родитель
Сommit
225bbce6a6
4 измененных файлов: 82 добавлений и 58 удалений
  1. Двоичные данные
      assets/img/dingdan.png
  2. +39
    -37
      pages/order/index/index.js
  3. +24
    -18
      pages/order/index/index.wxml
  4. +19
    -3
      pages/order/index/index.wxss

Двоичные данные
assets/img/dingdan.png Просмотреть файл

До После
Ширина: 200  |  Высота: 200  |  Размер: 6.5 KiB

+ 39
- 37
pages/order/index/index.js Просмотреть файл

@@ -21,7 +21,7 @@ Page({
list: [], list: [],
current: "", current: "",
current_scroll: "1", current_scroll: "1",
page: 2,
page: 1,
allow_load: true allow_load: true
}, },
onLoad(e) { onLoad(e) {
@@ -32,9 +32,8 @@ Page({
}, },


getList(key, pageNum) { getList(key, pageNum) {
wx.showLoading({
title: "loading..."
});
let that = this;

console.log(key); console.log(key);


/** /**
@@ -53,38 +52,38 @@ Page({
orderStatus: key orderStatus: key
}; };
} }
if(that.data.allow_load==''){
}
Http.get({
url: config.api.orderList,
data: variable
}).then(res => {
console.log(res);
console.log("姐姐的订单列表");
wx.hideLoading();


console.log(res);
if (pageNum >= res.data.pages) {
wx.showToast({
title: "加载完成喽",
icon: "success"
});
if (that.data.allow_load) {
wx.showLoading({
title: "加载中"
});
Http.get({
url: config.api.orderList,
data: variable
}).then(res => {
console.log(res);
console.log("姐姐的订单列表");
setTimeout(function() {
wx.hideLoading();
}, 1200);
if (pageNum >= res.data.pages) {
that.setData({
allow_load: false
});
}
/**
* 先赋值后渲染页面
* concat 不会改变原数组值
* push 会改变原数组值,但不会一条一条插入,而是整个数组插入
*/
that.data.list = that.data.list.concat(res.data.list);
that.setData({ that.setData({
allow_load: false
list: that.data.list
}); });
}
/**
* 先赋值后渲染页面
* concat 不会改变原数组值
* push 会改变原数组值,但不会一条一条插入,而是整个数组插入
*/
that.data.list = that.data.list.concat(res.data.list);
that.setData({
list: that.data.list
}); });
});
} else {
console.log("加载完成allow_load设置成false");
}
}, },
handleChange({ detail }) { handleChange({ detail }) {
this.setData({ this.setData({
@@ -92,19 +91,22 @@ Page({
}); });
}, },
handleChangeScroll({ detail }) { handleChangeScroll({ detail }) {
this.getList(detail.key, 1);
this.setData({ this.setData({
list:[],
allow_load: true,
current_scroll: detail.key current_scroll: detail.key
});
})
this.getList(detail.key, 1);
}, },
onReachBottom: function() { onReachBottom: function() {
var that = this; var that = this;
console.info("before++ " + that.data.page);
console.log(that.data.page);
that.data.page++; that.data.page++;
console.info("after++ " + that.data.page);
console.log(that.data.page);
that.setData({ that.setData({
page: that.data.page page: that.data.page
}); });
that.getList(0, that.data.page);
console.info("after++ " + that.data.page);
that.getList(that.data.current_scroll, that.data.page);
} }
}); });

+ 24
- 18
pages/order/index/index.wxml Просмотреть файл

@@ -2,30 +2,36 @@
<i-tabs class='tabs' current="{{ current_scroll }}" scroll bindchange="handleChangeScroll"> <i-tabs class='tabs' current="{{ current_scroll }}" scroll bindchange="handleChangeScroll">
<i-tab class='i-tab' wx:for="{{tabs}}" wx:key="unique" key="{{item.key}}" title="{{item.name}}"></i-tab> <i-tab class='i-tab' wx:for="{{tabs}}" wx:key="unique" key="{{item.key}}" title="{{item.name}}"></i-tab>
</i-tabs> </i-tabs>
<view class='section' wx:for='{{list}}' wx:key='{{index}}'>
<view class='detail_msg'>
<view class='logo'>
<image src='http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg'></image>
<view>
<view wx:if="{{list.length!=0}}" class='section' wx:for='{{list}}' wx:key='{{index}}'>
<view class='detail_msg'>
<view class='logo'>
<image src='http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg'></image>
</view>
<view class='info'>
<view>
<text>{{item.detail}}</text>
<text>等待付款</text>
</view>
<!-- <view><text>购买数量:</text>{{item.tenantId}}件</view> -->
<view>
<text>下单时间:</text>2018-07-10 11:30
</view>
</view>
</view> </view>
<view class='info'>
<view class='payment'>
<view> <view>
<text>{{item.detail}}</text>
<text>等待付款</text>
<text>¥{{item.payment}}</text>
<text>¥{{item.paymentType}}</text>
</view> </view>
<!-- <view><text>购买数量:</text>{{item.tenantId}}件</view> -->
<view>
<text>下单时间:</text>2018-07-10 11:30
<view class="btn">
<text>支付</text>
</view> </view>
</view> </view>
</view> </view>
<view class='payment'>
<view>
<text>¥{{item.payment}}</text>
<text>¥{{item.paymentType}}</text>
</view>
<view class="btn">
<text>支付</text>
</view>
<view class="dingdan" wx:if="{{list.length==0}}">
<image src="../../../assets/img/dingdan.png" mode="widthFix"></image>
<text>暂无订单</text>
</view> </view>
</view> </view>
</view> </view>

+ 19
- 3
pages/order/index/index.wxss Просмотреть файл

@@ -63,13 +63,15 @@
font-size: 24rpx; font-size: 24rpx;
} }
.info view:nth-child(2), .info view:nth-child(3) {
.info view:nth-child(2),
.info view:nth-child(3) {
color: #f96563; color: #f96563;
font-size: 24rpx; font-size: 24rpx;
padding-left: 4%; padding-left: 4%;
} }
.info view:nth-child(2) text, .info view:nth-child(3) text {
.info view:nth-child(2) text,
.info view:nth-child(3) text {
font-size: 22rpx; font-size: 22rpx;
color: #b8b8b8; color: #b8b8b8;
} }
@@ -101,7 +103,7 @@
text-decoration: line-through; text-decoration: line-through;
} }
.btn{
.btn {
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
@@ -122,3 +124,17 @@
font-size: 28rpx; font-size: 28rpx;
color: #fff; color: #fff;
} }
.dingdan{
margin-top: 200rpx;
}
.dingdan text {
display: block;
text-align: center;
font-size: 30rpx;
color: #999;
}
.dingdan image {
display: block;
width: 100rpx;
margin: 0 auto 16rpx;
}

Загрузка…
Отмена
Сохранить