|
|
@@ -0,0 +1,205 @@
|
|
|
+<template>
|
|
|
+ <view class="container" v-if="isShow">
|
|
|
+ <view class="headerBox">
|
|
|
+ <view class="tabBox">
|
|
|
+ <view class="tabItem" :class="tabIndex == 0 ? 'active' : ''" @tap="onChangeState(0)">积分收入</view>
|
|
|
+ <view class="tabItem" :class="tabIndex == 1 ? 'active' : ''" @tap="onChangeState(1)">积分支出</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="totalPointBox">
|
|
|
+ <text>总计：</text>
|
|
|
+ <text class="totalPoint">{{totalPoint}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="listHeader">
|
|
|
+ <text class="listHeader_time">时间</text>
|
|
|
+ <text class="listHeader_type">形式</text>
|
|
|
+ <text class="listHeader_point">积分</text>
|
|
|
+ </view>
|
|
|
+ <view class="contentBox">
|
|
|
+ <z-paging ref="paging" v-model="listData" @query="onGetList" refresher-update-time-key="list">
|
|
|
+ <view class="listInfoBox">
|
|
|
+ <view class="listInfo" v-for="(item, index) in listData" :key="index">
|
|
|
+ <text class="listInfo_time">{{item.creationTime}}</text>
|
|
|
+ <text class="listInfo_type">{{item.sourceTxt}}</text>
|
|
|
+ <text class="listInfo_point">{{item.points}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </z-paging>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ var that;
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isShow: false,
|
|
|
+ tabIndex: 0,
|
|
|
+ Direction: '',
|
|
|
+ listData: [],
|
|
|
+ isReLoad: false,
|
|
|
+ totalPoint: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ that = this;
|
|
|
+ that.onGetTotalPoint();
|
|
|
+ that.isShow = true;
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onGetTotalPoint(){
|
|
|
+ that.$admin.req({
|
|
|
+ method: 'GET',
|
|
|
+ url: '/api/v1/Snapshot/points/total?Direction=' + that.tabIndex,
|
|
|
+ }).then(res => {
|
|
|
+ that.totalPoint = res;
|
|
|
+ }, err => {
|
|
|
+ that.$util.msg(err);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onGetList(pageNo, pageSize) {
|
|
|
+ that.$admin.req({
|
|
|
+ method: 'GET',
|
|
|
+ url: '/api/v1/Snapshot/points?Direction=' + that.tabIndex + '&QueryIndex=' + (pageNo - 1) + '&QueryCount=' + pageSize,
|
|
|
+ }).then(res => {
|
|
|
+ if (res && res.length > 0) {
|
|
|
+ res.forEach((item, index) => {
|
|
|
+ item.creationTime = item.creationTime ? that.$util.formatTime(new Date(item.creationTime)).split(' ')[0] : '';
|
|
|
+ })
|
|
|
+ that.$refs.paging.complete(res);
|
|
|
+ } else if (res && res.length == 0) {
|
|
|
+ that.$refs.paging.complete([]);
|
|
|
+ } else {
|
|
|
+ that.$util.msg('网络出错！');
|
|
|
+ that.$refs.paging.complete(false);
|
|
|
+ }
|
|
|
+ typeof fun === 'function' && fun();
|
|
|
+ }, err => {
|
|
|
+ if (!that.isReLoad) {
|
|
|
+ that.isReLoad = true;
|
|
|
+ that.onGetOrderList(pageNo, pageSize);
|
|
|
+ } else {
|
|
|
+ that.$util.msg(err);
|
|
|
+ that.$refs.paging.complete(false);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 切换工单状态
|
|
|
+ onChangeState(tabIndex) {
|
|
|
+ if (that.tabIndex != tabIndex){
|
|
|
+ that.tabIndex = tabIndex;
|
|
|
+ that.$refs.paging.reload();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+ .container {
|
|
|
+ background-color: #F6F7F8;
|
|
|
+ }
|
|
|
+
|
|
|
+ .headerBox {
|
|
|
+ line-height: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox {
|
|
|
+ padding: 0;
|
|
|
+ line-height: 48rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabItem {
|
|
|
+ padding: 20rpx 0 30rpx;
|
|
|
+ display: inline-block;
|
|
|
+ width: calc(50%);
|
|
|
+ text-align: center;
|
|
|
+ color: #333333;
|
|
|
+ font-size: 28rpx;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .active {
|
|
|
+ color: #3e6ffd;
|
|
|
+ }
|
|
|
+
|
|
|
+ .active::after {
|
|
|
+ content: " ";
|
|
|
+ width: 52rpx;
|
|
|
+ height: 6rpx;
|
|
|
+ background-color: #3e6ffd;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: calc(50% - 26rpx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .totalPointBox{
|
|
|
+ padding: 30rpx 40rpx;
|
|
|
+ text-align: right;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .totalPoint {
|
|
|
+ color: #3e6ffd;
|
|
|
+ font-size: 36rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listHeader {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333;
|
|
|
+ padding: 30rpx 20rpx 20rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #3e6ffd;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listHeader_time{
|
|
|
+ width: 160rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listHeader_type{
|
|
|
+ width: calc(100% - 320rpx);
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listHeader_point{
|
|
|
+ width: 160rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .contentBox {
|
|
|
+ position: relative;
|
|
|
+ height: calc(100% - 250rpx);
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listInfo {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #333;
|
|
|
+ text-align: center;
|
|
|
+ padding: 30rpx 20rpx 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listInfo_time{
|
|
|
+ width: 160rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listInfo_type{
|
|
|
+ width: calc(100% - 320rpx);
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .listInfo_point{
|
|
|
+ width: 160rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #fe0000;
|
|
|
+ }
|
|
|
+</style>
|
zhaojiaqi