ZhaoTongYao
4 years ago
12 changed files with 293 additions and 11 deletions
|
After Width: | Height: | Size: 1.7 KiB |
@ -0,0 +1,79 @@ |
|||
import { |
|||
getCode, |
|||
getPointsLogs |
|||
} from "../../../../utils/integralCentre" |
|||
Page({ |
|||
data: { |
|||
codeUrl: '', |
|||
behaviorCode: 'points_exchange', //积分动作编码
|
|||
pageIndex: 1, |
|||
pageSize: 10, |
|||
pointList: [], |
|||
loadMoreVisible: false, //false
|
|||
loadMoreType: "none", |
|||
showLoading: true, |
|||
nodata: false, |
|||
_timer: null, |
|||
}, |
|||
onLoad: function () { |
|||
this.getCode() |
|||
this.getPointsLogs() |
|||
if (this.data._timer) { |
|||
clearInterval() |
|||
} |
|||
let _timer = null |
|||
_timer = setInterval(() => { |
|||
console.log('刷新') |
|||
this.getCode() |
|||
}, 1000 * 180) |
|||
}, |
|||
getCode() { |
|||
this.setData({ |
|||
showLoading: true |
|||
}) |
|||
getCode().then(res => { |
|||
this.setData({ |
|||
codeUrl: res.data.codeUrl, |
|||
showLoading: false |
|||
}) |
|||
}).catch(err => {}) |
|||
}, |
|||
getNewCode() { |
|||
this.getCode() |
|||
}, |
|||
// 获取居民兑换记录接口
|
|||
getPointsLogs() { |
|||
let para = { |
|||
pageIndex: this.data.pageIndex, |
|||
pageSize: this.data.pageSize, |
|||
behaviorCode: this.data.behaviorCode, |
|||
} |
|||
getPointsLogs(para).then((res) => { |
|||
this.setData({ |
|||
loadMoreVisible: true, |
|||
loadMoreType: res.data.length === this.data.pageSize ? 'loading' : 'none', |
|||
pointList: this.data.pointList.concat(res.data) |
|||
}) |
|||
if (this.data.pointList.length == 0) { |
|||
this.setData({ |
|||
loadMoreVisible: false, |
|||
nodata: true |
|||
}) |
|||
} |
|||
}).catch(() => { |
|||
this.setData({ |
|||
nodata: true |
|||
}) |
|||
}) |
|||
}, |
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
console.log('下拉了') |
|||
if (this.data.loadMoreType === 'loading') { |
|||
this.data.pageIndex += 1, |
|||
this.getPointsLogs() |
|||
} |
|||
}, |
|||
}) |
|||
@ -0,0 +1,9 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"load-more": "../../../../components/loadMore/loadMore", |
|||
"no-data": "../../../../components/nodata/nodata" |
|||
}, |
|||
"navigationBarTitleText": "积分中心", |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarBackgroundColor": "#DD5245" |
|||
} |
|||
@ -0,0 +1,33 @@ |
|||
<view class="exchange-index"> |
|||
<view class="exchange-header"> |
|||
<view class="background"></view> |
|||
<view class="exchange-code"> |
|||
<view class="code-text"> |
|||
<image src="../../images/code.png" class="code" /> |
|||
<text>兑换码</text> |
|||
</view> |
|||
<image src="{{codeUrl}}" class="code-img" bind:tap="getNewCode" wx:if="{{!showLoading}}" /> |
|||
<view class="code-img" wx:if="{{showLoading}}"> |
|||
<image src="../../../../images/loading.gif" class='loading' /> |
|||
</view> |
|||
<view class="code-footer" bind:tap="getNewCode">请点击兑换码刷新</view> |
|||
</view> |
|||
</view> |
|||
<view class="exchange-time"> |
|||
<view class="time-title"> |
|||
<text class="" style="margin-left:90rpx">兑换时间</text> |
|||
<text class="" style="margin-left:220rpx">说明</text> |
|||
<text class="" style="margin-left:160rpx">积分</text> |
|||
</view> |
|||
<view class="time-item-box"> |
|||
<view class="time-item" wx:for="{{pointList}}"> |
|||
<text class="time-item-time">{{item.operationTime}}</text> |
|||
<text class="time-item-remark">{{item.remark?item.remark:'暂无核销记录说明'}}</text> |
|||
<!-- <text class="time-item-num">-1000</text> --> |
|||
<text class="time-item-num">{{item.operationType==='1'? '+':'-'}}{{item.points}}</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<no-data isShow="{{nodata}}" wx:if="{{nodata}}"></no-data> |
|||
<load-more loadMoreVisible="{{loadMoreVisible}}" loadMoreType="{{loadMoreType}}" load-more-child='load-more-exchange'></load-more> |
|||
</view> |
|||
@ -0,0 +1,113 @@ |
|||
page { |
|||
/* background: #f7f7f7; */ |
|||
} |
|||
|
|||
.exchange-index { |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.exchange-header { |
|||
height: 680rpx; |
|||
/* border: 1rpx solid red; */ |
|||
} |
|||
|
|||
.exchange-header .background { |
|||
box-sizing: border-box; |
|||
width: 100%; |
|||
height: 80rpx; |
|||
background: #DD5245; |
|||
} |
|||
|
|||
.exchange-header .exchange-code { |
|||
box-sizing: border-box; |
|||
width: 660rpx; |
|||
height: 630rpx; |
|||
margin: 0 auto; |
|||
position: absolute; |
|||
top: 2%; |
|||
left: 50%; |
|||
transform: translate(-50%, 0%); |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
padding: 40rpx 30rpx; |
|||
box-shadow: 0px 0px 20rpx #eee; |
|||
} |
|||
|
|||
.exchange-code .code-text { |
|||
color: 32rpx; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.exchange-code .code-text text { |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
.exchange-code .code-text .code { |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
vertical-align: middle; |
|||
margin-right: 10rpx; |
|||
} |
|||
|
|||
.exchange-code .code-img { |
|||
width: 400rpx; |
|||
height: 400rpx; |
|||
margin-left: 110rpx; |
|||
margin-top: 50rpx; |
|||
} |
|||
|
|||
.loading { |
|||
width: 60rpx; |
|||
height: 60rpx; |
|||
margin-top: 170rpx; |
|||
margin-left: 150rpx; |
|||
} |
|||
|
|||
.exchange-code .code-footer { |
|||
margin-left: 200rpx; |
|||
font-size: 28rpx; |
|||
color: #999; |
|||
} |
|||
|
|||
.exchange-time .time-title { |
|||
box-sizing: border-box; |
|||
width: 100%; |
|||
font-weight: bold; |
|||
font-size: 30rpx; |
|||
color: #151515; |
|||
} |
|||
|
|||
.time-item-box { |
|||
padding: 0 20rpx; |
|||
} |
|||
|
|||
.exchange-time .time-item-box .time-item { |
|||
box-sizing: border-box; |
|||
width: 100%; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
font-size: 30rpx; |
|||
margin-top: 50rpx; |
|||
} |
|||
|
|||
.exchange-time .time-item-box .time-item .time-item-time { |
|||
width: 45%; |
|||
color: #151515; |
|||
} |
|||
|
|||
.exchange-time .time-item-box .time-item .time-item-remark { |
|||
width: 40%; |
|||
color: #151515; |
|||
} |
|||
|
|||
.exchange-time .time-item-box .time-item .time-item-num { |
|||
width: 15%; |
|||
color: #D60000; |
|||
text-align: center; |
|||
} |
|||
|
|||
/* 覆盖组件样式 */ |
|||
.load-more-exchange { |
|||
background: #fff !important; |
|||
} |
|||
Loading…
Reference in new issue