karlcarlo
a5c5d753b6
- 新增大量图片资源，包括图标、背景图、海报等，用于页面展示 - 添加字体文件及样式配置，支持自定义字体 - 引入 uni-ui 组件库，包括图标、弹窗、日期选择器等常用组件 - 添加网络状态监听、加密工具等基础工具函数 - 配置 Vuex 状态管理，包括购物车数量、热门搜索词等 - 增加页面组件，如用户协议、分销信息、提现状态等 - 配置项目构建和忽略文件，优化开发体验
160 lines
3.5 KiB
Vue
160 lines
3.5 KiB
Vue
<template>
|
||
<view>
|
||
<view v-if="integralList.length" class="month-list">
|
||
<view class="month-item" v-for="(integralItem, index) in integralList" :key="index">
|
||
<view class="month-top">{{ integralItem.time }}</view>
|
||
<view class="month-bottom">
|
||
<view class="item acea-row" v-for="item in integralItem.list" :key="item.id">
|
||
<view class="item-left">
|
||
<view>{{ item.mark }}</view>
|
||
<view class="fs-24 text--w111-999">{{item.add_time}}</view>
|
||
<view class="fs-24 text--w111-999" v-if="item.is_frozen && item.is_frozen == 1">积分冻结中，解冻时间：{{item.frozen_time}}</view>
|
||
|
||
</view>
|
||
<view>
|
||
<view class="item-right">{{ item.pm ? '+' : '-' }}{{ item.number }}</view>
|
||
<view class="wait pt-8" v-if="item.is_frozen == 1">冻结中</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="px-20 mt-20" v-else>
|
||
<emptyPage title='暂无积分记录~' src="/statics/images/noOrder.gif"></emptyPage>
|
||
</view>
|
||
<view class="loadingicon acea-row row-center-wrapper" v-if="integralList.length">{{ loadTitle }}</view>
|
||
<home></home>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getIntegralList
|
||
} from '@/api/user.js';
|
||
import emptyPage from '@/components/emptyPage.vue'
|
||
export default {
|
||
data() {
|
||
return {
|
||
page: 1,
|
||
limit: 10,
|
||
integralList: [],
|
||
list: [],
|
||
times: [],
|
||
loadend: false,
|
||
loading: false,
|
||
loadTitle: '加载更多',
|
||
}
|
||
},
|
||
components:{ emptyPage },
|
||
onLoad() {
|
||
this.getIntegralList();
|
||
},
|
||
onReachBottom() {
|
||
this.getIntegralList();
|
||
},
|
||
onPageScroll(object) {
|
||
uni.$emit('scroll');
|
||
},
|
||
methods: {
|
||
getIntegralList() {
|
||
let that = this;
|
||
if (that.loading) return;
|
||
if (that.loadend) return;
|
||
that.loading = true;
|
||
that.loadTitle = '';
|
||
getIntegralList({
|
||
page: that.page,
|
||
limit: that.limit
|
||
}).then(function(res) {
|
||
let data = res.data;
|
||
let list = data.list;
|
||
let times = data.times;
|
||
let integralList = [];
|
||
for (let i = 0; i < times.length; i++) {
|
||
if (!that.times.includes(times[i])) {
|
||
that.times.push(times[i]);
|
||
that.integralList.push({
|
||
time: times[i],
|
||
list: [],
|
||
});
|
||
}
|
||
}
|
||
for (let i = 0; i < that.integralList.length; i++) {
|
||
for (let j = 0; j < list.length; j++) {
|
||
if (times[i] == list[j].time_key) {
|
||
that.integralList[i].list.push(list[j]);
|
||
}
|
||
}
|
||
}
|
||
let loadend = list.length < that.limit;
|
||
that.page = that.page + 1;
|
||
that.loading = false;
|
||
that.loadend = loadend;
|
||
that.loadTitle = loadend ? '没有更多内容啦~' : "加载更多";
|
||
}, function(res) {
|
||
this.loading = false;
|
||
that.loadTitle = '加载更多';
|
||
});
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.month-list {
|
||
padding: 0 20rpx;
|
||
|
||
.month-top {
|
||
padding: 32rpx 0 24rpx;
|
||
font-size: 24rpx;
|
||
line-height: 34rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
.month-bottom {
|
||
padding: 0 24rpx;
|
||
border-radius: 24rpx;
|
||
background: #FFFFFF;
|
||
}
|
||
|
||
.item {
|
||
padding: 32rpx 0;
|
||
|
||
+.item {
|
||
border-top: 1rpx solid #EEEEEE;
|
||
}
|
||
}
|
||
|
||
.item-left {
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
.time {
|
||
margin-top: 12rpx;
|
||
font-size: 24rpx;
|
||
line-height: 34rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
.item-right {
|
||
font-family: Regular;
|
||
font-size: 36rpx;
|
||
line-height: 40rpx;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.loadingicon {
|
||
padding: 32rpx 0;
|
||
font-size: 26rpx;
|
||
line-height: 36rpx;
|
||
color: #CCCCCC;
|
||
}
|
||
.wait{
|
||
color: #FFB200;
|
||
text-align: right;
|
||
}
|
||
</style> |