zhaoyongnian
5 years ago
24 changed files with 1129 additions and 0 deletions
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 207 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 12 KiB |
@ -0,0 +1,205 @@ |
|||
// subpages/integralCentre/pages/index/index.js
|
|||
import { |
|||
userPointsRankinglist, |
|||
gradeRankinglist |
|||
} from "../../../../utils/integralCentre" |
|||
import { |
|||
getTimestamp |
|||
} from "../../../../utils/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
nodatapointsRanking: false, |
|||
points: 0, //积分
|
|||
pageIndex: 1, |
|||
pageSize: 15, |
|||
pointsRankinglist: [], //积分排行
|
|||
rankingType: 0, //排名方式
|
|||
typeList: [{ //排名方式：0-周，1-月
|
|||
type: "0", |
|||
name: "网格", |
|||
select: true |
|||
}, |
|||
{ |
|||
type: "1", |
|||
name: "街道", |
|||
select: false |
|||
}, |
|||
{ |
|||
type: "2", |
|||
name: "等级", |
|||
select: false |
|||
} |
|||
], |
|||
wg_y:'../../images/t-wg-yes.png', |
|||
wg_n:'../../images/t-wg-no.png', |
|||
jd_y:'../../images/t-jd-yes.png', |
|||
jd_n:'../../images/t-jd-no.png', |
|||
dj_y:'../../images/t-dj-yes.png', |
|||
dj_n:'../../images/t-dj-no.png', |
|||
timestamp: getTimestamp(), |
|||
loadMoreType: "none", |
|||
loadMoreVisible: true |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ //前面页面传过来的积分总数
|
|||
points: options.points |
|||
}) |
|||
this.pointsRankinglist(); //初始化加载积分记录列表
|
|||
}, |
|||
// 排行切换
|
|||
onButtonChange: function (e) { |
|||
const list = this.data.typeList |
|||
let that = this; |
|||
list.forEach(item => { |
|||
if (item.type === e.currentTarget.dataset.type) { |
|||
item.select = true |
|||
} else { |
|||
item.select = false |
|||
} |
|||
}) |
|||
that.setData({ |
|||
typeList: list, |
|||
rankingType: e.currentTarget.dataset.type, |
|||
pageIndex: 1, |
|||
pageSize: 15, |
|||
timestamp: this.data.timestamp, |
|||
pointsRankinglist: [], |
|||
nodatapointsRanking: false, |
|||
loadMoreType: "loading", |
|||
loadMoreVisible: true, |
|||
}) |
|||
if ( e.currentTarget.dataset.type == "2") { |
|||
that.gradeRankinglist() |
|||
} else { |
|||
that.pointsRankinglist() |
|||
} |
|||
}, |
|||
|
|||
// 积分记录-积分排行接口
|
|||
pointsRankinglist () { |
|||
let that = this |
|||
const para = { |
|||
pageIndex: 1, |
|||
pageSize: 20, |
|||
timestamp: this.data.timestamp, |
|||
rankingType: this.data.rankingType, //排名方式：0-周，1-月
|
|||
} |
|||
userPointsRankinglist(para).then(res => { |
|||
that.setData({ |
|||
pointsRankingUser: res.data.currentUser, |
|||
pointsRankinglist: that.data.pointsRankinglist.concat(res.data.rank), |
|||
}) |
|||
if (that.data.pointsRankinglist.length > 0) { |
|||
that.setData({ |
|||
nodatapointsRanking: false, |
|||
loadMoreType: "none", |
|||
}) |
|||
} else { |
|||
that.setData({ |
|||
nodatapointsRanking: true, |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
}) |
|||
} |
|||
}).catch(err => { |
|||
that.setData({ |
|||
pointsRankinglist: [], |
|||
nodatapointsRanking: true, |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
}) |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () {}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
//6.28 等级排行榜
|
|||
gradeRankinglist () { |
|||
let that = this |
|||
const para = { |
|||
pageIndex: 1, |
|||
pageSize: 20, |
|||
timestamp: getTimestamp() |
|||
} |
|||
gradeRankinglist(para).then(res => { |
|||
that.setData({ |
|||
pointsRankingUser: res.data.currentUser, |
|||
pointsRankinglist: that.data.pointsRankinglist.concat(res.data.rank), |
|||
}) |
|||
if (that.data.pointsRankinglist.length > 0) { |
|||
that.setData({ |
|||
nodatapointsRanking: false, |
|||
loadMoreType: "none", |
|||
}) |
|||
} else { |
|||
that.setData({ |
|||
nodatapointsRanking: true, |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
}) |
|||
} |
|||
}).catch(err => { |
|||
that.setData({ |
|||
pointsRankinglist: [], |
|||
nodatapointsRanking: true, |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
}) |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
bindtapRecord () { |
|||
wx.navigateTo({ |
|||
url: `/subpages/integralCentre/pages/record/record?points=${this.data.points}` |
|||
}) |
|||
}, |
|||
bindtapIntegralRule () { |
|||
wx.navigateTo({ |
|||
url: `/subpages/integralCentre/pages/noticeDetail/noticeDetail?modulecode=notice_points_rule` |
|||
}) |
|||
}, |
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,9 @@ |
|||
{ |
|||
"navigationBarTitleText": "积分中心", |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarBackgroundColor": "#D63534", |
|||
"usingComponents": { |
|||
"load-more": "../../../../components/loadMore/loadMore", |
|||
"no-data":"../../../../components/nodata/nodata" |
|||
} |
|||
} |
|||
@ -0,0 +1,60 @@ |
|||
<view class="home"> |
|||
<view class='title'> |
|||
<text class="number">{{points}}</text> |
|||
<text class="name">积分</text> |
|||
</view> |
|||
<!-- 积分兑换 --> |
|||
<view class="exchange"> |
|||
<image src="../../images/exchange.png" /> |
|||
</view> |
|||
<!-- 积分记录 积分规则 --> |
|||
<view class="classification"> |
|||
<view class="classification-item" bindtap="bindtapRecord"> |
|||
<image src="../../images/record.png" /> |
|||
<view class="classification-name">积分记录</view> |
|||
</view> |
|||
<view class="classification-item" bindtap="bindtapIntegralRule"> |
|||
<image src="../../images/note.png" /> |
|||
<view class="classification-name">积分规则</view> |
|||
</view> |
|||
</view> |
|||
<!-- tab 切换 --> |
|||
<view class="tab-more"> |
|||
<button wx:for="{{typeList}}" wx:key="index" wx:for-index="index" data-type="{{item.type}}" id="item-{{ item.type }}" bindtap="onButtonChange" class="{{item.select ? 'tab-but-w' : 'tab-but-y'}}" form-type='submit' plain='true' hover-class="hover-btn"> |
|||
<view class="{{item.select ? 'tab-but-name-w' : 'tab-but-name-y'}}">{{item.name}}</view> |
|||
<image wx:if="{{item.type == 0}}" class="tab-but-img-w" src="{{item.select ? wg_y : wg_n}}"></image> |
|||
<image wx:elif="{{item.type == 1}}" class="tab-but-img-w" src="{{item.select ? jd_y : jd_n}}"></image> |
|||
<image wx:else class="tab-but-img-w" src="{{item.select ? dj_y : dj_n}}"></image> |
|||
</button> |
|||
</view> |
|||
<!-- 我当前数据 --> |
|||
<view class="myRanking" wx:if="{{pointsRankingUser}}"> |
|||
<view class="myRanking-item"> |
|||
<view class="myRanking-left"> |
|||
<view class="number-first">{{pointsRankingUser.rank}}</view> |
|||
<image class="img-first" src="../../images/timg.png"></image> |
|||
<view class="name-first">{{pointsRankingUser.realName||pointsRankingUser.nickName}}</view> |
|||
</view> |
|||
<view class="myintegral"> |
|||
{{pointsRankingUser.points||pointsRankingUser.grade}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- 排名列表 --> |
|||
<view class="list"> |
|||
<view class="myRanking ranking" wx:for-index="index" wx:for-item="item" wx:key="index" wx:for="{{pointsRankinglist}}"> |
|||
<view class="myRanking-item"> |
|||
<view class="myRanking-left"> |
|||
<view class="number-first" class="{{index < 3 ? '' : 'number-first'}} {{index===0 ? 'color1_' : index===1 ? 'color2_' : index===2 ? 'color2_' : ''}}">{{item.rank}}</view> |
|||
<image class="img-first" src="../../images/timg.png"></image> |
|||
<view class="name">{{item.realName||item.nickName}}</view> |
|||
</view> |
|||
<view class="integral"> |
|||
{{item.points||item.grade}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<load-more loadMoreType="{{loadMoreType}}" loadMoreVisible="{{loadMoreVisible}}"></load-more> |
|||
</view> |
|||
<no-data isShow="{{nodatapointsRanking}}"></no-data> |
|||
</view> |
|||
@ -0,0 +1,213 @@ |
|||
page { |
|||
background: #f7f7f7; |
|||
} |
|||
|
|||
.home { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.title { |
|||
width: 100%; |
|||
height: 230rpx; |
|||
background: linear-gradient(180deg, #D42D30 0%, #DD5346 100%); |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
} |
|||
|
|||
.title .number { |
|||
height: 86rpx; |
|||
font-size: 86rpx; |
|||
line-height: 86rpx; |
|||
font-weight: bold; |
|||
color: rgba(255, 255, 255, 1); |
|||
margin-top: 55rpx; |
|||
} |
|||
|
|||
.title .name { |
|||
height: 32rpx; |
|||
font-size: 32rpx; |
|||
line-height: 32rpx; |
|||
font-weight: 500; |
|||
color: rgba(255, 255, 255, 1); |
|||
margin-top: 15rpx; |
|||
} |
|||
/* 积分兑换 */ |
|||
.exchange{ |
|||
width: 100%; |
|||
height: 118rpx; |
|||
background: #fff; |
|||
} |
|||
.exchange image{ |
|||
width: 100%; |
|||
height: 118rpx; |
|||
} |
|||
/* 积分记录 积分规则 */ |
|||
.classification{ |
|||
width: 100%; |
|||
height: 92rpx; |
|||
background: #fff; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.classification .classification-item{ |
|||
height: 34px; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0 30rpx; |
|||
} |
|||
.classification .classification-item image{ |
|||
width: 34rpx; |
|||
height: 34rpx; |
|||
} |
|||
.classification .classification-item .classification-name{ |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #999999; |
|||
margin-left: 6rpx; |
|||
} |
|||
/* tab切换 */ |
|||
.tab-more{ |
|||
margin-top: 16rpx; |
|||
width: 100%; |
|||
height: 148rpx; |
|||
background: #ffffff; |
|||
box-sizing: border-box; |
|||
padding: 40rpx 30rpx 0 30rpx; |
|||
display: flex; |
|||
/* justify-content: space-between; */ |
|||
align-items: center; |
|||
} |
|||
.tab-more .tab-but-w{ |
|||
width: 30%; |
|||
height: 90rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: 1rpx 6rpx 16rpx 0rpx rgba(203, 203, 203, 0.23); |
|||
border-radius: 12rpx; |
|||
border: none; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
.tab-more .tab-but-y{ |
|||
width: 30%; |
|||
height: 90rpx; |
|||
background: linear-gradient(86deg, #FECA04, #FF9E02); |
|||
box-shadow: 1px 6px 16px 0px rgba(202, 132, 44, 0.23); |
|||
border-radius: 12rpx; |
|||
border: none; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
.tab-but-name-w{ |
|||
font-size: 30rpx; |
|||
font-weight: 500; |
|||
color: #666666; |
|||
} |
|||
.tab-but-img-w{ |
|||
width: 42rpx; |
|||
height: 42rpx; |
|||
margin-left: 22rpx; |
|||
} |
|||
.tab-but-name-y{ |
|||
font-size: 32rpx; |
|||
font-weight: bold; |
|||
color: #FFFFFF; |
|||
} |
|||
button::after{ |
|||
border: none; |
|||
} |
|||
button { |
|||
padding: 0; |
|||
} |
|||
.hover-btn { |
|||
box-shadow: 0 0 10rpx rgba(63, 63, 63, 0.1) !important; |
|||
} |
|||
/* 排名列表 */ |
|||
.myRanking{ |
|||
width: 100%; |
|||
height: 138rpx; |
|||
background: #fff; |
|||
box-sizing: border-box; |
|||
padding: 0 55rpx; |
|||
} |
|||
.ranking{ |
|||
width: 100%; |
|||
height: 138rpx; |
|||
background: #fff; |
|||
box-sizing: border-box; |
|||
padding: 0 55rpx; |
|||
margin-top: 1rpx; |
|||
} |
|||
.myRanking .myRanking-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 138rpx; |
|||
} |
|||
.ranking .myRanking-item:last-child { |
|||
border-bottom: 1rpx solid #E5E5E5; |
|||
} |
|||
.myRanking .myRanking-item .myRanking-left{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.myRanking .myRanking-item .myRanking-left .number-first{ |
|||
font-size:38rpx; |
|||
font-weight:bold; |
|||
font-style:italic; |
|||
color:rgba(51,51,51,1); |
|||
} |
|||
.myRanking .myRanking-item .myRanking-left .img-first{ |
|||
width: 90rpx; |
|||
height: 90rpx; |
|||
border-radius: 50%; |
|||
margin-left: 48rpx; |
|||
} |
|||
.myRanking .myRanking-item .myRanking-left .name-first{ |
|||
font-size: 32rpx; |
|||
font-weight: 800; |
|||
color: #343434; |
|||
margin-left: 21rpx; |
|||
} |
|||
.myRanking .myRanking-item .myRanking-left .name{ |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #343434; |
|||
margin-left: 21rpx; |
|||
} |
|||
.myRanking .myRanking-item .myintegral{ |
|||
font-size: 34rpx; |
|||
font-weight: 800; |
|||
color: #B20005; |
|||
} |
|||
.myRanking .myRanking-item .integral{ |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #B20005; |
|||
} |
|||
.list{ |
|||
margin-top: 20rpx; |
|||
background: #fff; |
|||
} |
|||
.color1_{ |
|||
color:#d42e31; |
|||
font-size:38rpx; |
|||
font-weight:bold; |
|||
font-style:italic; |
|||
} |
|||
.color2_{ |
|||
color:#dd5800; |
|||
font-size:38rpx; |
|||
font-weight:bold; |
|||
font-style:italic; |
|||
} |
|||
.color3_{ |
|||
color:#ffa800; |
|||
font-size:38rpx; |
|||
font-weight:bold; |
|||
font-style:italic; |
|||
} |
|||
@ -0,0 +1,117 @@ |
|||
const api = require('../../../../utils/integralCentre') |
|||
import util from '../../../../utils/util' |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
noticeObj: {}, |
|||
noticeObjContent: "", |
|||
pageIndex:1, |
|||
pageSize:10, |
|||
noticeCategory:'', |
|||
preloadVisible: true, |
|||
nodata: false |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ |
|||
noticeCategory:options.modulecode |
|||
}) |
|||
if(options.modulecode == 'notice_points_rule'){ |
|||
wx.setNavigationBarTitle({ |
|||
title: '积分规则' |
|||
}) |
|||
this.noticelist() |
|||
} |
|||
}, |
|||
noticelist () { |
|||
let that = this; |
|||
let params = { |
|||
pageIndex: that.data.pageIndex, |
|||
pageSize: that.data.pageSize, |
|||
noticeCategory: that.data.noticeCategory |
|||
} |
|||
api.noticelist(params).then(function (res) { |
|||
if (res.data.length == 0) { |
|||
that.setData({ |
|||
nodata: true |
|||
}) |
|||
} else { |
|||
that.setData({ |
|||
nodata: false |
|||
}) |
|||
that.noticeDetail(res.data[0].id) |
|||
} |
|||
}).catch(err => { |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
noticeDetail (noticeId){ |
|||
let that = this; |
|||
api.noticeDetail(noticeId).then(function (res) { |
|||
that.setData({ |
|||
noticeObj: res.data, |
|||
noticeObjContent: util.formatRichText(res.data.noticeContent), |
|||
preloadVisible: false |
|||
}) |
|||
|
|||
console.log(that.data.noticeObj) |
|||
}).catch(err => { |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,6 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"no-data": "../../../../components/nodata/nodata" |
|||
}, |
|||
"navigationBarTitleText": "" |
|||
} |
|||
@ -0,0 +1,27 @@ |
|||
<wxs module="filter" src="../../../../utils/filter.wxs"></wxs> |
|||
<view class="notice-detail" hidden="{{nodata}}"> |
|||
<view class="selfContent" wx:if="{{!preloadVisible}}"> |
|||
<view class="detail-title">{{noticeObj.noticeTitle}}</view> |
|||
<view class="detail-subtitle"> |
|||
<view class="left"> |
|||
<span>{{noticeObj.deptName}}</span> |
|||
<span>{{filter.formatTime(noticeObj.noticeTime, 'yyyy-MM-dd')}}</span> |
|||
</view> |
|||
<view class="right"> |
|||
<view class="readNum"> |
|||
<image src="../../images/ic_yueduliang.png" /> |
|||
</view> |
|||
<view class="num">{{noticeObj.readingAmount}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="richContent"> |
|||
<rich-text space="nbsp" nodes="{{noticeObjContent}}"></rich-text> |
|||
</view> |
|||
</view> |
|||
<view class="preload" wx:else> |
|||
<view class="preload-title"></view> |
|||
<view class="preload-content"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<no-data isShow="{{nodata}}"></no-data> |
|||
@ -0,0 +1,256 @@ |
|||
page{ |
|||
background: #f7f7f7; |
|||
} |
|||
.notice-detail { |
|||
width: 100%; |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
padding: 20rpx; |
|||
background: #f7f7f7; |
|||
} |
|||
.richContent img{ |
|||
width: 100%!important; |
|||
height: auto; |
|||
} |
|||
.selfContent { |
|||
width: 100%; |
|||
/* display: table; */ |
|||
background: #ffffff; |
|||
border-radius: 16rpx; |
|||
box-sizing: border-box; |
|||
padding: 0 25rpx 38rpx; |
|||
} |
|||
.detail-title { |
|||
font-family: PingFang-SC-Bold; |
|||
font-size: 48rpx; |
|||
font-weight: bold; |
|||
line-height: 68rpx; |
|||
color: #333333; |
|||
padding-top: 40rpx; |
|||
} |
|||
.detail-subtitle { |
|||
display: flex; |
|||
width: 100%; |
|||
justify-content: space-between; |
|||
font-size: 22rpx; |
|||
color: #999999; |
|||
margin-top:45rpx; |
|||
} |
|||
.detail-subtitle .left span:nth-child(1){ |
|||
margin-right: 32rpx; |
|||
} |
|||
.detail-subtitle .right{ |
|||
display: flex; |
|||
height: 32rpx; |
|||
line-height: 32rpx; |
|||
} |
|||
.detail-subtitle .right .readNum { |
|||
/* display: inline-block; */ |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.detail-subtitle .right .readNum image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
float:left; |
|||
object-fit: cover; |
|||
} |
|||
.banner { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
margin: 39rpx 0 19rpx 0; |
|||
} |
|||
.banner image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
float:left; |
|||
object-fit: cover; |
|||
border-radius: 16rpx; |
|||
overflow: hidden; |
|||
} |
|||
.paragraph { |
|||
font-size: 38rpx; |
|||
line-height: 58rpx; |
|||
color: #333333; |
|||
text-indent: 76rpx; |
|||
margin-top:22rpx; |
|||
} |
|||
|
|||
.default { |
|||
border: 1px solid #eaeaea; |
|||
} |
|||
.default span { |
|||
color: #999999; |
|||
} |
|||
.active { |
|||
border: 1px solid #ffab00; |
|||
} |
|||
.active span { |
|||
color: #ffb700; |
|||
} |
|||
|
|||
/* preload start */ |
|||
.preload { |
|||
width: 100%; |
|||
background: #fff; |
|||
box-sizing: border-box; |
|||
border-radius: 16rpx; |
|||
padding: 0 24rpx; |
|||
overflow: hidden; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.preload-title { |
|||
width: 100%; |
|||
height: 80rpx; |
|||
border-radius: 8rpx; |
|||
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%); |
|||
animation: loading 1.4s ease infinite; |
|||
background-size: 400% 100%; |
|||
margin-top: 20rpx; |
|||
} |
|||
.preload-content { |
|||
width: 100%; |
|||
height: 200rpx; |
|||
border-radius: 8rpx; |
|||
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%); |
|||
animation: loading 1.4s ease infinite; |
|||
background-size: 400% 100%; |
|||
margin-top: 20rpx; |
|||
} |
|||
@keyframes loading { |
|||
0% { |
|||
background-position: 100% 50% |
|||
} |
|||
|
|||
100% { |
|||
background-position: 0 50% |
|||
} |
|||
} |
|||
/* preload end */ |
|||
|
|||
/* 轮播图start */ |
|||
|
|||
.altitle { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 66rpx; |
|||
background-color: black; |
|||
margin-top: 237rpx; |
|||
border-bottom-right-radius: 16rpx; |
|||
border-bottom-left-radius: 16rpx; |
|||
opacity: 0.5; |
|||
font-size: 22rpx; |
|||
font-weight: 500; |
|||
color: rgba(255, 255, 255, 1); |
|||
} |
|||
|
|||
.altitle-name { |
|||
margin: 10rpx 20rpx; |
|||
} |
|||
|
|||
.container { |
|||
width: 100vw; |
|||
} |
|||
|
|||
.page-body { |
|||
padding-top: 30rpx; |
|||
background: #fff; |
|||
height: 340rpx; |
|||
} |
|||
|
|||
.page-section { |
|||
width: 100%; |
|||
margin-bottom: 60rpx; |
|||
} |
|||
|
|||
.page-section_center { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
} |
|||
|
|||
.page-section:last-child { |
|||
margin-bottom: 0; |
|||
} |
|||
|
|||
.page-section-gap { |
|||
box-sizing: border-box; |
|||
padding: 0 30rpx; |
|||
} |
|||
|
|||
.page-section-spacing { |
|||
box-sizing: border-box; |
|||
height: 340rpx; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
.page-section-title { |
|||
font-size: 28rpx; |
|||
color: #999; |
|||
margin-bottom: 10rpx; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
} |
|||
|
|||
.page-section-gap .page-section-title { |
|||
padding-left: 0; |
|||
padding-right: 0; |
|||
} |
|||
|
|||
.swiper-item { |
|||
display: block; |
|||
height: 340rpx; |
|||
} |
|||
|
|||
.swiper-item video { |
|||
height: 340rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.notice-detail .banner { |
|||
overflow: hidden; |
|||
height: 340rpx !important; |
|||
display: flex; |
|||
width: 100%; |
|||
border-radius: 16rpx !important; |
|||
margin: 0rpx 0rpx 20rpx 0rpx; |
|||
} |
|||
|
|||
.dots { |
|||
display: flex; |
|||
justify-content: center; |
|||
margin-top: -16rpx; |
|||
z-index: 999; |
|||
position: relative; |
|||
} |
|||
|
|||
.dots .dot { |
|||
width: 8rpx; |
|||
height: 8rpx; |
|||
border-radius: 8rpx; |
|||
margin-left: 10rpx; |
|||
background: #d2d5da; |
|||
transition: all 0.3s; |
|||
} |
|||
|
|||
.dots .dot.active { |
|||
width: 24rpx; |
|||
background: #fff; |
|||
} |
|||
|
|||
.page-section-title { |
|||
margin-top: 60rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
swiper { |
|||
height: 340rpx; |
|||
box-shadow: 0px 4px 29px 0px rgba(63, 63, 63, 0.1); |
|||
border-radius: 16rpx; |
|||
overflow: hidden; |
|||
-webkit-backface-visibility: hidden; |
|||
-webkit-transform: translate3d(0, 0, 0); |
|||
} |
|||
|
|||
/* 轮播图end */ |
|||
@ -0,0 +1,124 @@ |
|||
import { |
|||
pointsRecordlist |
|||
} from "../../../../utils/integralCentre" |
|||
import { |
|||
getTimestamp |
|||
} from "../../../../utils/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
points: 0, |
|||
pointsRecordlist: [], //积分记录列表
|
|||
nodatapointsRecord: false, |
|||
pageIndex: 1, |
|||
pageSize: 15, |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
timestamp: getTimestamp() |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ |
|||
points: options.points |
|||
}) |
|||
this.pointsRecordlist(); //初始化加载积分记录列表
|
|||
}, |
|||
// 积分记录-积分记录接口
|
|||
pointsRecordlist () { |
|||
let that = this |
|||
const para = { |
|||
pageIndex: this.data.pageIndex, |
|||
pageSize: this.data.pageSize, |
|||
timestamp: this.data.timestamp, |
|||
} |
|||
pointsRecordlist(para).then(res => { |
|||
that.setData({ |
|||
pointsRecordlist: that.data.pointsRecordlist.concat(res.data), |
|||
loadMoreType: res.data.length === that.data.pageSize ? "loading" : "none", |
|||
}) |
|||
if (that.data.pointsRecordlist.length > 0) { |
|||
that.setData({ |
|||
nodatapointsRecord: false, |
|||
}) |
|||
} else { |
|||
that.setData({ |
|||
nodatapointsRecord: true, |
|||
loadMoreVisible: false, |
|||
}) |
|||
} |
|||
}).catch(err => { |
|||
that.setData({ |
|||
loadMoreType: "none", |
|||
loadMoreVisible: false, |
|||
pointsRecordlist: [], |
|||
nodatapointsRecord: true, |
|||
}) |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
this.setData({ |
|||
loadMoreVisible: true |
|||
}) |
|||
if (this.data.loadMoreType === "loading") { |
|||
this.setData({ |
|||
pageIndex: this.data.pageIndex + 1, |
|||
pageSize: this.data.pageSize, |
|||
timestamp: this.data.timestamp, |
|||
nodatapointsRecord: false, |
|||
}) |
|||
this.pointsRecordlist(); //初始化加载积分记录列表
|
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,9 @@ |
|||
{ |
|||
"navigationBarTitleText": "积分记录", |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarBackgroundColor": "#D63534", |
|||
"usingComponents": { |
|||
"load-more": "../../../../components/loadMore/loadMore", |
|||
"no-data":"../../../../components/nodata/nodata" |
|||
} |
|||
} |
|||
@ -0,0 +1,21 @@ |
|||
<view class="home"> |
|||
<view class="title-top"> |
|||
<image src="../../images/background-img.png" /> |
|||
<view class="number">{{points}}</view> |
|||
<view class="name">积分</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="list-item" wx:for-index="index" wx:for-item="item" wx:key="index" wx:for="{{pointsRecordlist}}"> |
|||
<view class="list-item-left"> |
|||
<view class="reason">{{item.ruleDesc}}</view> |
|||
<view class="date">{{item.operationTime}}</view> |
|||
</view> |
|||
<view class="fraction"> |
|||
<text wx:if="{{item.operationType == 0}}">-</text> |
|||
<text wx:else>+</text>{{item.points}}</view> |
|||
</view> |
|||
<no-data isShow="{{nodatapointsRecord}}"></no-data> |
|||
</view> |
|||
<!--加载更多提示--> |
|||
<load-more loadMoreType="{{loadMoreType}}" loadMoreVisible="{{loadMoreVisible}}"></load-more> |
|||
</view> |
|||
@ -0,0 +1,82 @@ |
|||
page { |
|||
background: #f7f7f7; |
|||
} |
|||
.home { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.title-top{ |
|||
width: 100%; |
|||
height: 260rpx; |
|||
} |
|||
.title-top image{ |
|||
width: 100%; |
|||
height: 260rpx; |
|||
position: absolute; |
|||
z-index: 8; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.title-top .number{ |
|||
position: absolute; |
|||
z-index: 9; |
|||
height: 86rpx; |
|||
width: 100%; |
|||
font-size: 86rpx; |
|||
line-height: 86rpx; |
|||
font-weight: bold; |
|||
color: #FFFFFF; |
|||
text-align: center; |
|||
margin-top: 55rpx; |
|||
} |
|||
.title-top .name{ |
|||
position: absolute; |
|||
z-index: 9; |
|||
height: 32rpx; |
|||
width: 100%; |
|||
text-align: center; |
|||
margin-top: 156rpx; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #FFFFFF; |
|||
line-height: 32rpx; |
|||
} |
|||
|
|||
.list{ |
|||
background: #FFFFFF; |
|||
margin-top: 30rpx; |
|||
padding: 0 30rpx; |
|||
box-sizing: border-box; |
|||
} |
|||
.list .list-item{ |
|||
width: 100%; |
|||
height: 138rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #E5E5E5; |
|||
} |
|||
.list .list-item:last-child { |
|||
border: none; |
|||
} |
|||
.list .list-item .list-item-left{ |
|||
height: 138rpx; |
|||
} |
|||
.list .list-item .list-item-left .reason{ |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #343434; |
|||
margin-top: 27rpx; |
|||
} |
|||
.list .list-item .list-item-left .date{ |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #9A9A9A; |
|||
margin-top: 10rpx; |
|||
} |
|||
.list .list-item .fraction{ |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #B20005; |
|||
} |
|||
Loading…
Reference in new issue