354 lines
7.4 KiB
Vue
354 lines
7.4 KiB
Vue
<!--分销商积分明细列表-->
|
|
<template>
|
|
<page-meta :page-style="themeColor"></page-meta>
|
|
<view>
|
|
<view class="tab color-bg">
|
|
<!--时间选择-->
|
|
<view class="tab-left">
|
|
<picker mode="date" :value="searchType.date" @change="bindDateChange" fields="month">
|
|
<view class="uni-input">
|
|
{{ date }}
|
|
<text class="iconfont iconiconangledown"></text>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
<!--选择类型-->
|
|
<view class="tab-right">
|
|
<picker @change="bindPickerChange" :value="type_index" :range="type_list" class="picker" range-key="label">
|
|
<text class="desc uni-input">{{ type_list[type_index].label }}</text>
|
|
<text class="iconfont iconiconangledown"></text>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<!--明细列表-->
|
|
<mescroll-uni @getData="getAccountInfo" class="member-point" ref="mescroll">
|
|
<view slot="list">
|
|
<block v-if="Object.keys(list).length > 0">
|
|
<view class="detailed-wrap">
|
|
<view class="cont">
|
|
<view class="detailed-item" v-for="(item, index) in list" :key="index">
|
|
<view class="info">
|
|
<view class="event">{{ item.remarks }}</view>
|
|
<view class="time-box">
|
|
<text class="time color-tip">{{ $util.timeStampTurnTime(item.create_time) }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="num increase-number color-base-text" v-if="parseInt(item.status) === 1">+{{ item.money }}</view>
|
|
<view class="num reduce-number" v-else>{{ item.money }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<block v-else>
|
|
<view class="cart-empty">
|
|
<ns-empty></ns-empty>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</mescroll-uni>
|
|
<!--加载动画-->
|
|
<loading-cover ref="loadingCover"></loading-cover>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
const currentDate = this.getDate({
|
|
format: true
|
|
});
|
|
return {
|
|
date: currentDate,
|
|
// 搜索时间
|
|
searchType: {
|
|
account_type: 0,
|
|
date: ''
|
|
},
|
|
// 搜索类型
|
|
type_index: 0,
|
|
type_list: [
|
|
{label: '积分', value: '0', type: 'integral'},
|
|
{label: '桑果', value: '1', type: 'integral_money'},
|
|
],
|
|
// 用户信息
|
|
memberInfo: {},
|
|
// 列表信息
|
|
list: [],
|
|
|
|
};
|
|
},
|
|
onShow() {
|
|
if (!uni.getStorageSync('token')) {
|
|
this.$util.redirectTo(
|
|
'/pages_tool/login/login',
|
|
{
|
|
back: '/pages_tool/member/point'
|
|
},
|
|
'redirectTo'
|
|
);
|
|
}
|
|
this.getMemberInfo();
|
|
},
|
|
onLoad(option) {
|
|
let integral_type = option.integral_type;
|
|
if(integral_type === 'integral') this.type_index = 0;
|
|
else if(integral_type === 'integral_money') this.type_index = 1;
|
|
},
|
|
computed: {},
|
|
methods: {
|
|
// 时间初始化
|
|
getDate(type) {
|
|
const date = new Date();
|
|
let year = date.getFullYear();
|
|
let month = date.getMonth() + 1;
|
|
let day = date.getDate();
|
|
|
|
if (type === 'start') {
|
|
year = year - 60;
|
|
} else if (type === 'end') {
|
|
year = year + 2;
|
|
}
|
|
month = month > 9 ? month : '0' + month;
|
|
day = day > 9 ? day : '0' + day;
|
|
return `${year}年${month}月`;
|
|
},
|
|
// 会员信息
|
|
getMemberInfo() {
|
|
this.$api.sendRequest({
|
|
url: '/api/member/info',
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.token = uni.getStorageSync('token');
|
|
this.memberInfo = res.data;
|
|
this.getAccountInfo();
|
|
} else {
|
|
this.token = null;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
//获取个人账户信息列表
|
|
getAccountInfo(mescroll) {
|
|
let _this = this;
|
|
if(!mescroll) return false;
|
|
|
|
_this.$api.sendRequest({
|
|
url: '/fenxiao/api/account/account_list',
|
|
data: {
|
|
page: mescroll.num,
|
|
account_type: _this.type_list[_this.type_index].type,
|
|
date: _this.searchType.date,
|
|
},
|
|
success: res => {
|
|
if(parseInt(res.code) === 0){
|
|
let list = res.data.list;
|
|
mescroll.endSuccess(list.length);
|
|
//设置列表数据
|
|
if (parseInt(mescroll.num) === 1) this.list = []; //如果是第一页需手动制空列表
|
|
this.list = this.list.concat(list); //追加新数据
|
|
|
|
}else{
|
|
this.$util.showToast({
|
|
title: res.message
|
|
});
|
|
}
|
|
// 关闭弹框
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
},
|
|
fail: res => {
|
|
mescroll.endErr();
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
}
|
|
});
|
|
},
|
|
// 变更类型
|
|
bindPickerChange(e) {
|
|
this.type_index = e.detail.value;
|
|
this.searchType.account_type = this.type_list[this.type_index].type;
|
|
this.$refs.mescroll.refresh();
|
|
},
|
|
|
|
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
/deep/ .fixed {
|
|
position: relative;
|
|
top: 0;
|
|
}
|
|
|
|
.tab {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 10;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
height: 80rpx;
|
|
background-color: $color-bg;
|
|
|
|
view {
|
|
flex: 1;
|
|
text-align: center;
|
|
line-height: 80rpx;
|
|
|
|
text {
|
|
margin-left: 10rpx;
|
|
font-size: $font-size-base;
|
|
}
|
|
}
|
|
.tab-left{
|
|
display: flex;
|
|
padding-left: 30rpx;
|
|
}
|
|
.tab-right{
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
padding-right: 40rpx;
|
|
}
|
|
}
|
|
|
|
.cart-empty {
|
|
margin-top: 208rpx !important;
|
|
}
|
|
|
|
.account-box {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
|
|
> image {
|
|
width: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
z-index: 1;
|
|
}
|
|
|
|
.accout-btn {
|
|
display: flex;
|
|
margin-top: 30rpx;
|
|
|
|
view {
|
|
width: 170rpx;
|
|
height: 44rpx;
|
|
border-radius: 22rpx;
|
|
border: 2rpx solid rgba(255, 255, 255, 0.4);
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-right: 44rpx;
|
|
}
|
|
}
|
|
|
|
.account-text {
|
|
position: relative;
|
|
padding: 50rpx 30rpx 34rpx 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
z-index: 9;
|
|
|
|
.headimg {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
background: #fff;
|
|
border: 4rpx solid #fff;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.point {
|
|
margin-left: 30rpx;
|
|
color: #fff;
|
|
font-size: 36rpx;
|
|
}
|
|
|
|
.iconjifen1 {
|
|
color: #fff;
|
|
margin-left: 8rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.detailed-wrap {
|
|
background: #fff;
|
|
position: relative;
|
|
z-index: 9;
|
|
padding-top: 80rpx;
|
|
|
|
.head {
|
|
display: flex;
|
|
height: 90rpx;
|
|
|
|
& > view {
|
|
flex: 1;
|
|
text-align: left;
|
|
padding: 0 $padding;
|
|
line-height: 90rpx;
|
|
}
|
|
}
|
|
|
|
.cont {
|
|
background: #fff;
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
|
|
.detailed-item {
|
|
padding: 30rpx 0 32rpx;
|
|
margin: 0 32rpx;
|
|
border-bottom: 2rpx solid $color-line;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
|
|
&:last-of-type {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.info {
|
|
padding-right: 180rpx;
|
|
|
|
.event {
|
|
font-size: $font-size-base;
|
|
line-height: 1.3;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.time-box {
|
|
line-height: 1;
|
|
margin-top: 24rpx;
|
|
}
|
|
|
|
.time {
|
|
font-size: $font-size-activity-tag;
|
|
color: $color-tip;
|
|
}
|
|
}
|
|
|
|
.num {
|
|
width: 160rpx;
|
|
position: absolute;
|
|
right: 17rpx;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
text-align: right;
|
|
font-size: $font-size-toolbar;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
/deep/ .increase-number{
|
|
color: #07c160!important;
|
|
}
|
|
/deep/ .reduce-number{
|
|
color: #ee0a24!important;
|
|
}
|
|
</style>
|