187 lines
4.3 KiB
Vue
187 lines
4.3 KiB
Vue
<template>
|
|
<view :data-theme='theme()' :class="theme() || ''">
|
|
<view class="points-top theme-bg d-b-c">
|
|
<image class="bg-points" src="/static/bg-points.png" mode=""></image>
|
|
<view class="d-c d-c-c pr ww100 hh100">
|
|
<text class="f28 mb30">{{points_name()}}</text>
|
|
<text class="f72 fb">{{points}}</text>
|
|
<text class="f24 re-btn dominant" @click="isPop=true" v-if="is_trans_balance">提现</text>
|
|
</view>
|
|
<button v-if="is_open" class="right-btn" @click="gotoShop">{{points_name()}}商城<text class="icon iconfont icon-sanjiao1 ml10" style="color: #ffffff;font-size: 28rpx;"></text></button>
|
|
</view>
|
|
<!--列表-->
|
|
|
|
<view class="p-0-30 bg-white">
|
|
<view class="d-b-c border-b p-30-0" v-for="(item, index) in tableData" :key="index">
|
|
<view class="d-s-s f-w d-c flex-1">
|
|
<text class="f28">{{points_name(item.describe)}}</text>
|
|
<text class="pt10 gray9 20">{{item.create_time}}</text>
|
|
</view>
|
|
<view class="red f28" v-if="item.value>0">+{{item.value}}</view>
|
|
<view class="red f28" v-else>{{item.value}}</view>
|
|
</view>
|
|
<!-- 没有记录 -->
|
|
<view class="d-c-c p30" v-if="tableData.length==0 && !loading">
|
|
<text class="iconfont icon-wushuju"></text>
|
|
<text class="cont">亲，暂无相关记录哦</text>
|
|
</view>
|
|
<uni-load-more v-else :loadingType="loadingType"></uni-load-more>
|
|
</view>
|
|
<recharge :isPop="isPop" :discount_ratio="discount_ratio" @close="closePop"></recharge>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import uniLoadMore from "@/components/uni-load-more.vue";
|
|
import recharge from "./part/recharge.vue";
|
|
export default {
|
|
components: {
|
|
uniLoadMore,
|
|
recharge
|
|
},
|
|
data() {
|
|
return {
|
|
isPop: false,
|
|
/*是否加载完成*/
|
|
loadding: true,
|
|
indicatorDots: true,
|
|
autoplay: true,
|
|
interval: 2000,
|
|
duration: 500,
|
|
/*顶部刷新*/
|
|
topRefresh: false,
|
|
/*手机高度*/
|
|
phoneHeight: 0,
|
|
/*可滚动视图区域高度*/
|
|
scrollviewHigh: 0,
|
|
/*数据列表*/
|
|
tableData: [],
|
|
/*最后一页码数*/
|
|
last_page: 0,
|
|
/*当前页面*/
|
|
page: 1,
|
|
/*每页条数*/
|
|
list_rows: 20,
|
|
no_more: false,
|
|
loading: true,
|
|
points: 0,
|
|
is_open: false,
|
|
discount_ratio:'0',
|
|
is_trans_balance:false
|
|
};
|
|
},
|
|
computed: {
|
|
|
|
/*加载中状态*/
|
|
loadingType() {
|
|
if (this.loading) {
|
|
return 1;
|
|
} else {
|
|
if (this.tableData.length != 0 && this.no_more) {
|
|
return 2;
|
|
} else {
|
|
return 0;
|
|
}
|
|
}
|
|
}
|
|
},
|
|
onReady() {
|
|
uni.setNavigationBarTitle({
|
|
title: this.points_name()
|
|
});
|
|
},
|
|
mounted() {
|
|
/*获取数据*/
|
|
this.getData();
|
|
},
|
|
onReachBottom() {
|
|
let self = this;
|
|
if (self.page < self.last_page) {
|
|
self.page++;
|
|
self.getData();
|
|
}
|
|
self.no_more = true;
|
|
|
|
},
|
|
methods: {
|
|
closePop(e) {
|
|
if(e!=null){
|
|
this.page = 1;
|
|
this.tableData = [];
|
|
this.getData();
|
|
}
|
|
this.isPop = false;
|
|
},
|
|
/*获取数据*/
|
|
getData() {
|
|
let self = this;
|
|
let page = self.page;
|
|
let list_rows = self.list_rows;
|
|
self._get('points.log/index', {
|
|
page: page || 1,
|
|
list_rows: list_rows,
|
|
}, function(data) {
|
|
self.loading = false;
|
|
self.points = data.data.points;
|
|
self.discount_ratio = data.data.discount_ratio;
|
|
self.is_open = data.data.is_open;
|
|
self.is_trans_balance = data.data.is_trans_balance;
|
|
self.tableData = self.tableData.concat(data.data.list.data);
|
|
self.last_page = data.data.list.last_page;
|
|
if (data.data.list.last_page <= 1) {
|
|
self.no_more = true;
|
|
return false;
|
|
}
|
|
|
|
});
|
|
},
|
|
/*跳转积分商城*/
|
|
gotoShop() {
|
|
this.gotoPage('/pages/plus/points/list/list');
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.points-top {
|
|
box-sizing: border-box;
|
|
height: 346rpx;
|
|
padding: 0 30rpx;
|
|
color: #FFFFFF;
|
|
position: relative;
|
|
z-index: 1;
|
|
.bg-points{
|
|
width: 750rpx;
|
|
height: 346rpx;
|
|
z-index: 0;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
}
|
|
|
|
.re-btn {
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
width: 190rpx;
|
|
padding: 0 8rpx;
|
|
background-color: #FFFFFF;
|
|
border-radius: 30rpx;
|
|
margin-top: 46rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
}
|
|
.right-btn{
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
position: absolute;
|
|
right: 21rpx;
|
|
top: 12rpx;
|
|
background: none;
|
|
border: none;
|
|
padding: 0;
|
|
}
|
|
</style>
|