You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
368 lines
8.4 KiB
368 lines
8.4 KiB
<template>
|
|
<page-meta :page-style="themeColor"></page-meta>
|
|
<z-paging ref="paging" v-model="list" @query="queryList" :auto="true" :auto-show-back-to-top="true">
|
|
<view slot="top">
|
|
<view class="point">
|
|
<view class="head-wrap color-base-bg" :style="{
|
|
backgroundImage: 'url(' + $util.img('public/uniapp/point/point_bg.png') + ')',
|
|
height: '300rpx'
|
|
}">
|
|
<view class="title">当前积分</view>
|
|
<view class="point">{{ pointInfo.point }}</view>
|
|
<view class="flex-box">
|
|
<view class="flex-item">
|
|
<view class="num">{{ pointInfo.totalPoint }}</view>
|
|
<view class="font-size-tag">累计积分</view>
|
|
</view>
|
|
<view class="flex-item">
|
|
<view class="num">{{ pointInfo.totalConsumePoint }}</view>
|
|
<view class="font-size-tag">累计消费</view>
|
|
</view>
|
|
<view class="flex-item">
|
|
<view class="num">{{ pointInfo.todayPoint }}</view>
|
|
<view class="font-size-tag">今日获得</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<div class="operate">
|
|
<u-row gutter="16">
|
|
<u-col span="4" v-for="(item, index) in operateList" :key="index">
|
|
<div class="operate-item" @click="operateClick(item)">
|
|
<image :src="item.img"></image>
|
|
<div>{{ item.name }}</div>
|
|
</div>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
|
|
<view><u-notice-bar :text="title" :step="true" direction="column" :fontSize="12"></u-notice-bar></view>
|
|
<div class="goods-list">
|
|
<div style="margin-bottom: 26rpx;">
|
|
<u-tabs keyName="type_name" :list="tabList" :current="current" lineColor="var(--base-color)"
|
|
:activeStyle="{
|
|
color: '#303133',
|
|
fontWeight: 'bold',
|
|
transform: 'scale(1.15)'
|
|
}" :inactiveStyle="{
|
|
color: '#999',
|
|
transform: 'scale(1)'
|
|
}" @click="click"></u-tabs>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<ns-login ref="login"></ns-login>
|
|
<loading-cover ref="loadingCover"></loading-cover>
|
|
</view>
|
|
</view>
|
|
<u-row gutter="16" class="goods-list">
|
|
<u-col span="4" v-for="(item, index) in list" :key="index" @click="itemClick(item.id)">
|
|
<div class="goods-item">
|
|
<image :src="$util.img(item.image)" mode="aspectFill"></image>
|
|
<div class="bottom">
|
|
<div class="name">{{ item.name }}</div>
|
|
<div v-if="item.type == 2">
|
|
<div class="price">{{ item.point }}积分</div>
|
|
</div>
|
|
<div v-if="item.type == 1" style="display: flex;">
|
|
<div class="price">{{ item.point }}积分+{{ item.price }}元</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</u-col>
|
|
</u-row>
|
|
</z-paging>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: [],
|
|
currentInfo: {},
|
|
current: 0,
|
|
repertory: 0,
|
|
title: [],
|
|
tabList: [],
|
|
operateList: [{
|
|
name: '每日签到',
|
|
img: this.$util.img('/upload/weapp/user/qd.png'),
|
|
path: '/pages_tool/member/signin'
|
|
},
|
|
{
|
|
name: '积分明细',
|
|
img: this.$util.img('/upload/weapp/user/mx.png'),
|
|
path: '/pages_tool/member/point_detail'
|
|
},
|
|
{
|
|
name: '兑换记录',
|
|
img: this.$util.img('/upload/weapp/user/jl.png'),
|
|
path: '/pages_tool/member/exchange_record'
|
|
}
|
|
],
|
|
pointInfo: {
|
|
point: 0,
|
|
totalPoint: 0,
|
|
totalConsumePoint: 0,
|
|
todayPoint: 0
|
|
}
|
|
};
|
|
},
|
|
onShow() {
|
|
//滚动通知
|
|
this.$api.sendRequest({
|
|
url: '/api/goodsexchange/getNoticeList ',
|
|
data: {},
|
|
success: res => {
|
|
res.data.list.forEach(item => {
|
|
this.title.push(`${item.create_time} ${item.nickname}兑换《${item.name}》`)
|
|
})
|
|
}
|
|
});
|
|
// 分类列表
|
|
this.$api.sendRequest({
|
|
url: '/api/goodsexchange/typelists',
|
|
data: {},
|
|
success: res => {
|
|
this.current = 0;
|
|
|
|
this.tabList = res.data;
|
|
this.currentInfo = res.data[0]
|
|
console.log(this.currentInfo, '分类列表0');
|
|
this.$refs.paging.reload()
|
|
}
|
|
});
|
|
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
setTimeout(() => {
|
|
this.$refs.login.open('/pages_tool/member/point');
|
|
});
|
|
} else {
|
|
this.getMemberPoint();
|
|
this.getMemberTotalPoint();
|
|
this.getMemberTotalConsumePoint();
|
|
this.getMemberTodayPoint();
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
async queryList(page, page_size) {
|
|
let url = '/api/goodsexchange/lists';
|
|
let obj = {
|
|
type_id: this.currentInfo.id,
|
|
page,
|
|
page_size
|
|
}
|
|
console.log(obj);
|
|
const res = await this.$api.sendRequest({
|
|
url,
|
|
data: obj,
|
|
async: false
|
|
})
|
|
this.$refs.paging.complete(res.data.list);
|
|
},
|
|
click(index) {
|
|
this.current = index.index;
|
|
this.currentInfo = this.tabList[index.index]
|
|
this.$refs.paging.reload()
|
|
// this.$api.sendRequest({
|
|
// url: '/api/goodsexchange/lists',
|
|
// data: {
|
|
// type_id: index.id
|
|
// },
|
|
// success: res => {
|
|
// console.log(res.data.list);
|
|
// this.list = res.data.list;
|
|
// }
|
|
// });
|
|
},
|
|
itemClick(id) {
|
|
uni.navigateTo({
|
|
url: `/pages_tool/member/point_goodsDetail?id=${id}`
|
|
});
|
|
},
|
|
operateClick(item) {
|
|
this.$util.redirectTo(item.path);
|
|
},
|
|
toSign() {
|
|
this.$util.redirectTo('/pages_tool/member/signin');
|
|
},
|
|
getMemberPoint() {
|
|
this.$api.sendRequest({
|
|
url: '/api/memberaccount/info',
|
|
data: {
|
|
account_type: 'point'
|
|
},
|
|
success: res => {
|
|
if (res.code == 0) {
|
|
this.pointInfo.point = parseInt(res.data.point);
|
|
}
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
},
|
|
fail: res => {
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
}
|
|
});
|
|
},
|
|
getMemberTotalPoint() {
|
|
this.$api.sendRequest({
|
|
url: '/api/memberaccount/sum',
|
|
data: {
|
|
account_type: 'point',
|
|
query_type: 'income'
|
|
},
|
|
success: res => {
|
|
if (res.code == 0) {
|
|
this.pointInfo.totalPoint = parseInt(res.data);
|
|
}
|
|
}
|
|
});
|
|
},
|
|
getMemberTotalConsumePoint() {
|
|
this.$api.sendRequest({
|
|
url: '/api/memberaccount/sum',
|
|
data: {
|
|
account_type: 'point',
|
|
query_type: 'pay'
|
|
},
|
|
success: res => {
|
|
if (res.code == 0) {
|
|
this.pointInfo.totalConsumePoint = Math.abs(parseInt(res.data));
|
|
}
|
|
}
|
|
});
|
|
},
|
|
getMemberTodayPoint() {
|
|
this.$api.sendRequest({
|
|
url: '/api/memberaccount/sum',
|
|
data: {
|
|
account_type: 'point',
|
|
query_type: 'income',
|
|
start_time: new Date(new Date().toLocaleDateString()).getTime() / 1000,
|
|
end_time: parseInt(new Date().getTime() / 1000)
|
|
},
|
|
success: res => {
|
|
if (res.code == 0) {
|
|
this.pointInfo.todayPoint = Math.abs(parseInt(res.data));
|
|
}
|
|
}
|
|
});
|
|
},
|
|
/**
|
|
* 获取充值提现配置
|
|
*/
|
|
getMemberrechargeConfig() {
|
|
this.$api.sendRequest({
|
|
url: '/memberrecharge/api/memberrecharge/config',
|
|
success: res => {
|
|
if (res.code >= 0 && res.data) {
|
|
this.memberrechargeConfig = res.data;
|
|
}
|
|
}
|
|
});
|
|
}
|
|
},
|
|
onBackPress(options) {
|
|
if (options.from === 'navigateBack') {
|
|
return false;
|
|
}
|
|
this.$util.redirectTo('/pages/member/index');
|
|
return true;
|
|
},
|
|
watch: {
|
|
storeToken: function(nVal, oVal) {
|
|
if (nVal) {
|
|
this.getMemberPoint();
|
|
this.getMemberTotalPoint();
|
|
this.getMemberTotalConsumePoint();
|
|
this.getMemberTodayPoint();
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
storeToken() {
|
|
return this.$store.state.token;
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './public/css/point.scss';
|
|
|
|
view {
|
|
line-height: 1;
|
|
}
|
|
|
|
.goods-list {
|
|
padding: 0 32rpx;
|
|
flex-wrap: wrap;
|
|
|
|
::v-deep {
|
|
.u-row {
|
|
flex-wrap: wrap;
|
|
}
|
|
}
|
|
|
|
.goods-item {
|
|
margin-bottom: 32rpx;
|
|
background: #ffffff;
|
|
border-radius: 16rpx;
|
|
|
|
.bottom {
|
|
padding: 16rpx;
|
|
|
|
.name {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #222222;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 1;
|
|
-webkit-box-orient: vertical;
|
|
margin-bottom: 16rpx;
|
|
}
|
|
|
|
.price {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: var(--base-color);
|
|
}
|
|
}
|
|
|
|
image {
|
|
border-radius: 16rpx 16rpx 0 0;
|
|
width: 100%;
|
|
height: 218rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.operate {
|
|
padding: 0 32rpx;
|
|
|
|
margin: 24rpx 0;
|
|
|
|
.operate-item {
|
|
background: #ffffff;
|
|
border-radius: 16rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 22rpx 0;
|
|
|
|
image {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin-right: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|