第一次提交

pages/personal/points.vue

@@ -0,0 +1,138 @@
+<template>
+	<view class="points-body">
+		<view  class="card flex ac jc">
+			<view class="balance">{{Number(user.integral.accountBalance).toFixed(0)}}</view>
+			<view class="label"> 当前积分 </view>
+		</view>
+		<view v-for="(item,index) in list" :key="index" class="points-item flex ac">
+			<view class="points-item-left oneflex">
+				<view class="label">{{item.type|type}}</view>
+				<view class="time">{{item.createTime}}</view>
+			</view>
+			<view class="points-item-right">
+				{{item.type==3||item.type==2?'-':'+'}}{{Number(item.occurAmount).toFixed(2)}}
+			</view>
+		</view>
+		<uni-load-more :status="loadingType"></uni-load-more>
+	</view>
+</template>
+<script>
+	import pointsApi from "@/api/product.js"
+	export default {
+		data() {
+			return {
+				user: uni.getStorageSync('user'),
+				list: [],
+				page: {
+					"currentPage": 1,
+					"pageSize": 10,
+					"params": {
+						"orderStatus": ""
+					}
+				},
+				loadingType: 'more', //加载更多状态 
+				pageData: null
+			}
+		},
+		filters: {
+			type(e) {
+				switch (Number(e)) {
+					case 1:
+						return "加油收入";
+					case 2:
+						return "加油退款";
+					case 3:
+						return "商品兑换";
+					case 4:
+						return "商品兑换退款";
+					default:
+						break;
+				}
+			}
+		},
+		onLoad() {
+			this.getList()
+		},
+		methods: {
+			onPullDownRefresh() {
+				this.page.currentPage = 1;
+				this.loadingType = 'more';
+				this.getList();
+			},
+			//加载更多
+			onReachBottom() {
+				this.page.currentPage += 1
+				this.getList();
+			},
+			async getList() {
+				if (this.loadingType === 'nomore') {
+					return;
+				};
+				await pointsApi.accountRecordByPage(this.page).then(res => {
+					if (res.code == 20000) {
+						this.list = this.page.currentPage != 1 ? this.list.concat(res.data.list) : res.data
+							.list;
+						this.loadingType = res.data.list.length < this.page.pageSize ? 'nomore' : 'more';
+					}
+				});
+				uni.stopPullDownRefresh()
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.points-body {
+		width: 100vw;
+		min-height: 100vh;
+		overflow: hidden;
+		padding-top: 357rpx;
+		background-color: #F2F2F2;
+		position: relative;
+		box-sizing: border-box;
+
+		.points-item {
+			background-color: #FFFFFF;
+			padding: 30rpx;
+			box-sizing: border-box;
+			border-bottom: solid 1rpx #F6F6F6;
+
+			.points-item-right {
+				color: #666666;
+				font-size: 28rpx;
+			}
+
+			.points-item-left {
+				.time {
+					font-size: 22rpx;
+					color: #999999;
+				}
+
+				.label {
+					color: #333333;
+					font-size: 28rpx;
+					margin-bottom: 15rpx;
+				}
+			}
+		}
+
+		.card {
+			width: 684rpx;
+			height: 337rpx;
+			background-color: #FE5439;
+			border-radius: 10rpx;
+			position: fixed;
+			top: 0;
+			left: 0;
+			right: 0;
+			margin: 10rpx auto;
+			color: #FFFFFF;
+			flex-direction: column;
+
+			.balance {
+				font-size: 64rpx;
+				font-weight: 600;
+			}
+		}
+	}
+</style>