Ver Fonte

Merge branch 'master' of http://git.liuniu946.com/hwq/mnsx

hwq há 2 anos atrás
pai
commit
e3877032c8
2 ficheiros alterados com 343 adições e 390 exclusões
  1. 9 0
      api/user.js
  2. 334 390
      pages/money/wallet.vue

+ 9 - 0
api/user.js

@@ -26,6 +26,15 @@ export function getUserInfo(data) {
 		method: 'get',
 		data
 	});
+}
+
+// 获取用户信息
+export function getUser(data) {
+	return request({
+		url: '/api/user',
+		method: 'get',
+		data
+	});
 }
 
 // 用户分享图

+ 334 - 390
pages/money/wallet.vue

@@ -1,392 +1,336 @@
-<template>
-	<view class="content">
-		<view class="content-money">
-			<view class="money-box">
-				<view class="money">
-					<text class="money-icon">¥</text>
-					{{ userInfo.now_money | getMoneyStyle }}
-				</view>
-			</view>
-		</view>
-		<view class="navbar">
-			<view
-				v-for="(item, index) in navList"
-				:key="index"
-				class="nav-item"
-				:class="{ current: tabCurrentIndex === index }"
-				@click="tabClick(index)"
-				v-if="item.text !== '全部'"
-			>
-				{{ item.text }}
-			</view>
-		</view>
-		<swiper :current="tabCurrentIndex" :style="{ height: maxheight + 'px' }" class="swiper-box" duration="300" @change="changeTab">
-			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex">
-				<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
-					<!-- 空白页 -->
-					<empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
-
-					<!-- 订单列表 -->
-					<view v-for="(item, index) in tabItem.orderList" :key="index" class="order-item flex">
-						<view class="title-box">
-							<view class="title">
-								<text>{{ item.title }}</text>
-							</view>
-							<view class="time">
-								<text>{{ item.add_time }}</text>
-							</view>
-						</view>
-						<view class="money">
-							<text>{{ (item.pm == 0 ? '-' : '+') + item.number }}</text>
-						</view>
-						<view class="jg"></view>
-					</view>
-					<uni-load-more :status="tabItem.loadingType"></uni-load-more>
-				</scroll-view>
-			</swiper-item>
-		</swiper>
-		<view class="add-btn" @click="addmoney">立刻充值</view>
-	</view>
-</template>
-
-<script>
-import { mapState, mapMutations } from 'vuex';
-import { spreadCommission, userBalance } from '@/api/wallet.js';
-import { getMoneyStyle } from '@/utils/rocessor.js';
-import { getUserInfo } from '@/api/user.js';
-import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
-import empty from '@/components/empty';
-export default {
-	filters: {
-		getMoneyStyle
-	},
-	components: {
-		empty,
-		uniLoadMore
-	},
-	onReady() {
-		// 初始化获取页面宽度
-		uni.createSelectorQuery()
-			.select('.content')
-			.fields(
-				{
-					size: true
-				},
-				data => {
-					console.log(data);
-					console.log(Math.floor((data.width / 750) * 300));
-					// 保存头部高度
-					this.maxheight = data.height - Math.floor((data.width / 750) * 570);
-					console.log(this.maxheight);
-				}
-			)
-			.exec();
-	},
-	data() {
-		return {
-			// 头部图高度
-			maxheight: '',
-			tabCurrentIndex: 0,
-			navList: [
-				{
-					state: 2,
-					text: '收入',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				},
-				{
-					state: 1,
-					text: '支出',
-					loadingType: 'more',
-					orderList: [],
-					page: 1, //当前页数
-					limit: 10 //每次信息条数
-				}
-			],
-			money: ''
-		};
-	},
-	computed: {
-		...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
-	},
-	onLoad(options) {},
-	onShow() {
-		this.loadData();
-		// 获取用户余额
-		getUserInfo({})
-			.then(({ data }) => {
-				this.setUserInfo(data);
-				// 获取用户数据完毕后在获取订单数据防止多次跳转到登录页
-			})
-			.catch(e => {
-				console.log(e);
-			});
-	},
-	methods: {
-		...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
-		// 页面跳转
-		navto(e) {
-			uni.navigateTo({
-				url: e
-			});
-		},
-		//获取收入支出信息
-		async loadData(source) {
-			//这里是将订单挂载到tab列表下
-			let index = this.tabCurrentIndex;
-			let navItem = this.navList[index];
-			let state = navItem.state;
-			if (source === 'tabChange' && navItem.loaded === true) {
-				//tab切换只有第一次需要加载数据
-				return;
-			}
-			if (navItem.loadingType === 'loading') {
-				//防止重复加载
-				return;
-			}
-			// 修改当前对象状态为加载中
-			navItem.loadingType = 'loading';
-
-			spreadCommission(
-				{
-					page: navItem.page,
-					limit: navItem.limit
-				},
-				state
-			)
-				.then(({ data }) => {
-					console.log(data, '获取数据');
-					// if (data.count > 0) {
-					// 	navItem.orderList = navItem.orderList.concat(data.list);
-					// 	console.log(navItem.orderList);
-					// 	navItem.page++;
-					// }
-					if (data.length > 0) {
-						data.forEach(item => {
-							console.log(item.list, '内部列表');
-							navItem.orderList = navItem.orderList.concat(item.list);
-						});
-						// navItem.orderList = navItem.orderList.concat(data[0].list);
-						console.log(navItem.orderList);
-						navItem.page++;
-					}
-					if (navItem.limit == data.length) {
-						//判断是否还有数据, 有改为 more, 没有改为noMore
-						navItem.loadingType = 'more';
-						return;
-					} else {
-						//判断是否还有数据, 有改为 more, 没有改为noMore
-						navItem.loadingType = 'noMore';
-					}
-					uni.hideLoading();
-					this.$set(navItem, 'loaded', true);
-				})
-				.catch(e => {
-					console.log(e);
-				});
-		},
-
-		//swiper 切换
-		changeTab(e) {
-			this.tabCurrentIndex = e.target.current;
-			this.loadData('tabChange');
-		},
-		//顶部tab点击
-		tabClick(index) {
-			this.tabCurrentIndex = index;
-		},
-		addmoney() {
-			uni.navigateTo({
-				url: '/pages/money/recharge'
-			});
-		}
+<<<<<<< HEAD
+<template>
+	<view class="content">
+		<view class="top-bg">
+
+		</view>
+		<view class="yue-wrap flex">
+			<view class="yue-tit">
+				总资产(CNY)
+			</view>
+			<view class="yue-num flex">
+				<view class="yue">
+					{{userInfo.now_money || '0.00'}}
+				</view>
+				<view class="cz" @click="navto('/pages/money/recharge')">
+					充值
+					<image src="../../static/icon/dz.png" mode="widthFix"></image>
+				</view>
+			</view>
+			<view class="lj-wrap flex">
+				<view class="">
+					累计消费:¥{{ userInfo.orderStatusSum || '0'}}
+				</view>
+				<view class="">
+					累计充值:¥{{ userInfo.recharge || '0' }}
+				</view>
+			</view>
+		</view>
+		<scroll-view scroll-y="true" class="jl-wrap" :style="{'height': maxheight}" @scrolltolower="loadData">
+			<view>
+				<empty v-if="navList[tabCurrentIndex].orderList.length == 0 && navList[tabCurrentIndex].loaded"></empty>
+				<view class="jl " v-for="item in navList[tabCurrentIndex].orderList">
+					<view class="jl-tit flex">
+						<view class="clamp2 tit">
+							{{item.title}}
+						</view>
+						<view class="price" :class="{'add':item.pm == 1,'jian': item.pm == 0}">
+							{{item.number*1}}
+						</view>
+					</view>
+					<view class="jl-mark flex">
+						<!-- <view class="mark">
+							{{item.mark}}
+						</view> -->
+						<view class="">
+							{{item.add_time}}
+						</view>
+					</view>
+				</view>
+				<uni-load-more :status="navList[tabCurrentIndex].loadingType"></uni-load-more>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex';
+	import {
+		spreadCommission,
+		userBalance
+	} from '@/api/wallet.js';
+	import {
+		getMoneyStyle
+	} from '@/utils/rocessor.js';
+	import {
+		getUserInfo,
+		getUser
+	} from '@/api/user.js';
+	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
+	import empty from '@/components/empty';
+	export default {
+		filters: {
+			getMoneyStyle
+		},
+		components: {
+			empty,
+			uniLoadMore
+		},
+		onReady() {
+			// 初始化获取页面宽度
+			var obj = this;
+			uni.getSystemInfo({
+				success: resu => {
+					const query = uni.createSelectorQuery();
+					query.select('.jl-wrap').boundingClientRect();
+					query.exec(function(res) {
+						obj.maxheight = resu.windowHeight - res[0].top + 'px';
+					});
+				},
+				fail: res => {}
+			});
+		},
+		data() {
+			return {
+				// 头部图高度
+				maxheight: '',
+				tabCurrentIndex: 0,
+				navList: [{
+						state: 0,
+						text: '收入',
+						loadingType: 'more',
+						orderList: [],
+						page: 1, //当前页数
+						limit: 10, //每次信息条数
+						loaded: false
+					}, {
+						state: 2,
+						text: '收入',
+						loadingType: 'more',
+						orderList: [],
+						page: 1, //当前页数
+						limit: 10, //每次信息条数
+						loaded: false
+					},
+					{
+						state: 1,
+						text: '支出',
+						loadingType: 'more',
+						orderList: [],
+						page: 1, //当前页数
+						limit: 10, //每次信息条数
+						loaded: false
+					},
+
+				],
+				money: '',
+				userInfo: {}
+			};
+		},
+		onLoad(options) {},
+		onShow() {
+			this.loadData();
+			this.getUserInfo()
+		},
+		methods: {
+			...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
+			getUserInfo() {
+				getUser({}).then(({ data }) => {
+					this.userInfo = data
+				});
+			},
+			// 页面跳转
+			navto(e) {
+				uni.navigateTo({
+					url: e
+				});
+			},
+			//获取收入支出信息
+			async loadData(source) {
+				//这里是将订单挂载到tab列表下
+				let index = this.tabCurrentIndex;
+				let navItem = this.navList[index];
+				let state = navItem.state;
+				if (source === 'tabChange' && navItem.loaded === true) {
+					//tab切换只有第一次需要加载数据
+					return;
+				}
+				if (navItem.loadingType === 'loading') {
+					//防止重复加载
+					return;
+				}
+				// 修改当前对象状态为加载中
+				navItem.loadingType = 'loading';
+
+				spreadCommission({
+							page: navItem.page,
+							limit: navItem.limit
+						},
+						state
+					)
+					.then(({
+						data
+					}) => {
+						console.log(data, '获取数据');
+						// if (data.count > 0) {
+						// 	navItem.orderList = navItem.orderList.concat(data.list);
+						// 	console.log(navItem.orderList);
+						// 	navItem.page++;
+						// }
+						if (data.length > 0) {
+							data.forEach(item => {
+								console.log(item.list, '内部列表')
+								navItem.orderList = navItem.orderList.concat(item.list)
+							})
+							// navItem.orderList = navItem.orderList.concat(data[0].list);
+							console.log(navItem.orderList);
+							navItem.page++;
+						}
+						if (navItem.limit == data.length) {
+							//判断是否还有数据, 有改为 more, 没有改为noMore
+							navItem.loadingType = 'more';
+							return;
+						} else {
+							//判断是否还有数据, 有改为 more, 没有改为noMore
+							navItem.loadingType = 'noMore';
+						}
+						uni.hideLoading();
+						this.$set(navItem, 'loaded', true);
+
+					})
+					.catch(e => {
+						console.log(e);
+					});
+			},
+
+			//swiper 切换
+			changeTab(e) {
+				this.tabCurrentIndex = e.target.current;
+				this.loadData('tabChange');
+			},
+			//顶部tab点击
+			tabClick(index) {
+				this.tabCurrentIndex = index;
+			},
+			addmoney() {
+				uni.navigateTo({
+					url: '/pages/money/recharge'
+				})
+			}
+		}
+	};
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #fff;
+		height: auto;
+		min-height: 100%;
+	}
+
+	.top-bg {
+		background-color: #ee2f72;
+		height: 180rpx;
+		width: 750rpx;
+	}
+
+	.yue-wrap {
+		width: 670rpx;
+		height: 320rpx;
+		margin: -160rpx auto 30rpx;
+		background: linear-gradient(-70deg, #FF77A7, #FF4A8A);
+		box-shadow: 0px 15rpx 22rpx 6rpx rgba(238, 47, 114, 0.1);
+		border-radius: 25rpx;
+		color: #fff;
+		font-size: 26rpx;
+		padding: 50rpx 75rpx;
+		flex-direction: column;
+		justify-content: space-between;
+		align-items: flex-start;
+
+		.yue-num {
+			width: 100%;
+			justify-content: space-between;
+
+			.yue {
+				font-size: 76rpx;
+				font-weight: bold;
+			}
+
+			.cz {
+				image {
+					width: 13rpx;
+					margin-left: 10rpx;
+				}
+			}
+		}
+
+		.lj-wrap {
+			width: 100%;
+			justify-content: space-between;
+			font-size: 24rpx;
+		}
+	}
+
+	.jl {
+		width: 670rpx;
+		margin: 0 auto 20rpx;
+		padding: 35rpx 30rpx;
+		background: #FFFFFF;
+		box-shadow: 0px 0px 28px 0px rgba(48, 48, 48, 0.1);
+		border-radius: 8px;
+
+		.jl-tit {
+			width: 100%;
+			font-size: 28rpx;
+			font-weight: bold;
+			color: #333333;
+
+			.tit {
+				max-width: 450rpx;
+			}
+
+			.price {
+				font-size: 38rpx;
+				font-weight: bold;
+
+			}
+
+			.add {
+				color: #EE2F72;
+
+				&::before {
+					content: '+';
+					font-size: 28rpx;
+					color: #EE2F72;
+				}
+			}
+
+			.jian {
+				color: #808080;
+
+				&::before {
+					content: '-';
+					font-size: 28rpx;
+				}
+			}
+		}
+
+		.jl-mark {
+			padding-top: 20rpx;
+			width: 100%;
+			font-size: 24rpx;
+			font-weight: 500;
+			color: #808080;
+			align-items: flex-start;
+
+			// justify-content: flex-end;
+			.mark {
+				max-width: 470rpx;
+			}
+		}
 	}
-};
-</script>
-
-<style lang="scss">
-page {
-	background: #ffffff;
-	height: 100%;
-}
-
-.content-money {
-	padding-bottom: 30rpx;
-	background: $page-color-base;
-
-	.moneyTx {
-		position: absolute;
-		top: 150rpx;
-		right: 0rpx;
-		width: 150rpx;
-		padding: 10rpx 30rpx;
-		border: 2px solid #ffffff;
-		border-top-left-radius: 99rpx;
-		border-bottom-left-radius: 99rpx;
-		color: #ffffff;
-		line-height: 1;
-		font-size: $font-base;
-	}
-
-	.buttom-box {
-		background-color: #ffffff;
-		text-align: center;
-		margin: 0 30rpx;
-		padding: 20rpx 0;
-		border-radius: $border-radius-sm;
-		margin-top: -60rpx;
-
-		.buttom {
-			font-size: $font-lg;
-			flex-grow: 1;
-		}
-
-		.interval {
-			width: 2px;
-			height: 60rpx;
-			background-color: #eeeeee;
-		}
-
-		.icon {
-			height: 50rpx;
-			width: 48rpx;
-			margin: 0 auto;
-
-			.icon-img {
-				width: 100%;
-				height: 100%;
-			}
-		}
-	}
-}
-
-.money-box {
-	background-color: $base-color;
-	height: 265rpx;
-	color: #ffffff;
-	text-align: center;
-
-	.text {
-		padding-top: 147rpx;
-		font-size: $font-sm;
-	}
-
-	.money {
-		padding-top: 100rpx;
-		// margin: auto 0;
-		font-size: 56rpx;
-		font-weight: bold;
-		color: #ffffff;
-
-		.money-icon {
-			font-size: 38rpx;
-			font-weight: bold;
-			color: #ffffff;
-		}
-	}
-}
-
-.navbar {
-	display: flex;
-	height: 40px;
-	padding: 0 5px;
-	background: #fff;
-	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
-	position: relative;
-	z-index: 10;
-
-	.nav-item {
-		flex: 1;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		height: 100%;
-		font-size: 15px;
-		color: #999999;
-		position: relative;
-
-		&.current {
-			color: $base-color;
-
-			&:after {
-				content: '';
-				position: absolute;
-				left: 50%;
-				bottom: 0;
-				transform: translateX(-50%);
-				width: 44px;
-				height: 0;
-				border-bottom: 2px solid $base-color;
-			}
-		}
-	}
-}
-
-// 列表
-
-.swiper-box {
-	padding-top: 10rpx;
-
-	.order-item {
-		padding: 20rpx 30rpx;
-		line-height: 1.5;
-		position: relative;
-
-		// border-bottom: 1rpx black solid;
-		.title-box {
-			.title {
-				font-size: $font-lg;
-				color: $font-color-base;
-			}
-
-			.time {
-				font-size: $font-base;
-				color: $font-color-light;
-			}
-		}
-
-		.money {
-			// color: #fd5b23;
-			color: #901b21;
-			font-size: $font-lg;
-		}
-
-		.jg {
-			width: 701rpx;
-			height: 2rpx;
-			background: #f0f4f8;
-			margin: 0 auto;
-			position: absolute;
-			bottom: 0;
-		}
-	}
-}
-
-.list-scroll-content {
-	height: 100%;
-}
-
-.content {
-	height: 100%;
-
-	.empty-content {
-		background-color: #ffffff;
-	}
-}
-
-.add-btn {
-	position: fixed;
-	bottom: 51rpx;
-	right: 39rpx;
-	width: 674rpx;
-	height: 88rpx;
-	background: #ee2f72;
-	border-radius: 44rpx;
-	color: #fff;
-	text-align: center;
-	line-height: 88rpx;
-	font-size: 34rpx;
-}
 </style>