Files
crmeb_java/app/pages/users/user_integral/index.vue
stivepeim 0d32da772d 圣诞快乐
# v1.3 更新列表
    1. 【新增】砍价
	2. 【新增】拼团
	3. 【新增】一号通
	4. 【修复】商品sku 编辑时出现商品属性对应错误的问题
	5. 【修复】商品推广海报生成二维码可能会出错的问题【小程序调试中】
	6. 【修复】微信公众号和小程序头像可能获取不到的问题
	7. 【修复】下单时可能会出错的问题
	8. 【修复】pc管理端用户访问量
	9. 【修复】微信退款
	10. 【修复】管理端订单状态可能出现不正确的情况
	11. 【修复】WEB管理端-菜单色调,短信API更新,首页用户访问量,系统设置tab是自动选择下一及表单
	12. 【修复】系统设置出现更新不正确的问题
2020-12-23 15:56:45 +08:00

360 lines
14 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view>
<view class='integral-details'>
<view class='header'>
<view class='currentScore'>当前积分</view>
<view class="scoreNum">{{userInfo.integral||0}}</view>
<view class='line'></view>
<view class='nav acea-row'>
<view class='item'>
<view class='num'>{{userInfo.sumIntegral||0}}</view>
<view>累计积分</view>
</view>
<view class='item'>
<view class='num'>{{userInfo.deductionIntegral||0}}</view>
<view>累计消费</view>
</view>
<view class='item'>
<view class='num'>{{userInfo.yesterdayIntegral||0}}</view>
<view>今日获得</view>
</view>
</view>
</view>
<view class='wrapper'>
<view class='nav acea-row'>
<view class='item acea-row row-center-wrapper' :class='current==index?"on":""' v-for="(item,index) in navList" :key='index'
@click='nav(index)'><text class='iconfont' :class="item.icon"></text>{{item.name}}</view>
</view>
<view class='list' :hidden='current!=0'>
<view class='tip acea-row row-middle'><text class='iconfont icon-shuoming'></text>提示积分数值的高低会直接影响您的会员等级</view>
<view class='item acea-row row-between-wrapper' v-for="(item,index) in integralList" :key="index">
<view>
<view class='state'>{{item.mark}}</view>
<view>{{item.add_time}}</view>
</view>
<view class='num font-color' v-if="item.pm">+{{item.number}}</view>
<view class='num' v-else>-{{item.number}}</view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if="integralList.length>0">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view v-if="integralList.length == 0">
<emptyPage title="暂无积分记录哦~"></emptyPage>
</view>
</view>
<view class='list2' :hidden='current!=1'>
<navigator class='item acea-row row-between-wrapper' open-type='switchTab' hover-class='none' url='/pages/index/index'>
<view class='pictrue'>
<image src='../../../static/images/score.png'></image>
</view>
<view class='name'>购买商品可获得积分奖励</view>
<view class='earn'>赚积分</view>
</navigator>
<navigator class='item acea-row row-between-wrapper' hover-class='none' url='/pages/users/user_sgin/index'>
<view class='pictrue'>
<image src='../../../static/images/score.png'></image>
</view>
<view class='name'>每日签到可获得积分奖励</view>
<view class='earn'>赚积分</view>
</navigator>
</view>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import { postSignUser, getIntegralList } from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import emptyPage from '@/components/emptyPage.vue'
export default {
components: {
// #ifdef MP
authorize,
// #endif
emptyPage
},
data() {
return {
navList: [{
'name': '分值明细',
'icon': 'icon-mingxi'
},
{
'name': '分值提升',
'icon': 'icon-tishengfenzhi'
}
],
current: 0,
page: 1,
limit: 10,
integralList: [],
userInfo:{},
loadend: false,
loading: false,
loadTitle: '加载更多',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
this.getIntegralList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
this.getIntegralList();
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getUserInfo();
this.getIntegralList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
getUserInfo: function() {
let that = this;
postSignUser({
sign: 1,
integral: 1,
all: 1
}).then(function(res) {
that.$set(that,'userInfo',res.data);
});
},
/**
* 获取积分明细
*/
getIntegralList: function() {
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 list = res.data.list,
loadend = list.length < that.limit;
that.integralList = that.$util.SplitArray(list, that.integralList);
that.$set(that,'integralList',that.integralList);
that.page = that.page + 1;
that.loading = false;
that.loadend = loadend;
that.loadTitle = loadend ? '哼~😕我也是有底线的~' : "加载更多";
}, function(res) {
this.loading = false;
that.loadTitle = '加载更多';
});
},
nav: function(current) {
this.current = current;
}
}
}
</script>
<style scoped lang="scss">
.integral-details .header {
background-image: url('data:image/jpeg;base64,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');
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 460rpx;
font-size: 72rpx;
color: #fff;
padding: 31rpx 0 45rpx 0;
box-sizing: border-box;
text-align: center;
font-family: 'Guildford Pro';
}
.integral-details .header .currentScore {
font-size: 26rpx;
color: rgba(255, 255, 255, 0.8);
text-align: center;
margin-bottom: 11rpx;
}
.integral-details .header .scoreNum{
font-family: "Guildford Pro";
}
.integral-details .header .line {
width: 60rpx;
height: 3rpx;
background-color: #fff;
margin: 20rpx auto 0 auto;
}
.integral-details .header .nav {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.8);
flex: 1;
margin-top: 35rpx;
}
.integral-details .header .nav .item {
width: 33.33%;
text-align: center;
}
.integral-details .header .nav .item .num {
color: #fff;
font-size: 40rpx;
margin-bottom: 5rpx;
font-family: 'Guildford Pro';
}
.integral-details .wrapper .nav {
flex: 1;
width: 690rpx;
border-radius: 20rpx 20rpx 0 0;
margin: -96rpx auto 0 auto;
background-color: #f7f7f7;
height: 96rpx;
font-size: 30rpx;
color: #bbb;
}
.integral-details .wrapper .nav .item {
text-align: center;
width: 50%;
}
.integral-details .wrapper .nav .item.on {
background-color: #fff;
color: #e93323;
font-weight: bold;
border-radius: 20rpx 0 0 0;
}
.integral-details .wrapper .nav .item:nth-of-type(2).on {
border-radius: 0 20rpx 0 0;
}
.integral-details .wrapper .nav .item .iconfont {
font-size: 38rpx;
margin-right: 10rpx;
}
.integral-details .wrapper .list {
background-color: #fff;
padding: 24rpx 30rpx;
}
.integral-details .wrapper .list .tip {
font-size: 25rpx;
width: 690rpx;
height: 60rpx;
border-radius: 50rpx;
background-color: #fff5e2;
border: 1rpx solid #ffeac1;
color: #c8a86b;
padding: 0 20rpx;
box-sizing: border-box;
margin-bottom: 24rpx;
}
.integral-details .wrapper .list .tip .iconfont {
font-size: 35rpx;
margin-right: 15rpx;
}
.integral-details .wrapper .list .item {
height: 124rpx;
border-bottom: 1rpx solid #eee;
font-size: 24rpx;
color: #999;
}
.integral-details .wrapper .list .item .state {
font-size: 28rpx;
color: #282828;
margin-bottom: 8rpx;
}
.integral-details .wrapper .list .item .num {
font-size: 36rpx;
font-family: 'Guildford Pro';
}
.integral-details .wrapper .list2 {
background-color: #fff;
padding: 24rpx 0;
}
.integral-details .wrapper .list2 .item {
background-image: linear-gradient(to right, #fff7e7 0%, #fffdf9 100%);
width: 690rpx;
height: 180rpx;
position: relative;
border-radius: 10rpx;
margin: 0 auto 20rpx auto;
padding: 0 25rpx 0 180rpx;
box-sizing: border-box;
}
.integral-details .wrapper .list2 .item .pictrue {
width: 90rpx;
height: 150rpx;
position: absolute;
bottom: 0;
left: 45rpx;
}
.integral-details .wrapper .list2 .item .pictrue image {
width: 100%;
height: 100%;
}
.integral-details .wrapper .list2 .item .name {
width: 285rpx;
font-size: 30rpx;
font-weight: bold;
color: #c8a86b;
}
.integral-details .wrapper .list2 .item .earn {
font-size: 26rpx;
color: #c8a86b;
border: 2rpx solid #c8a86b;
text-align: center;
line-height: 52rpx;
height: 52rpx;
width: 160rpx;
border-radius: 50rpx;
}
</style>