2021-10-6

pages.json

@@ -710,6 +710,7 @@
 				"text": "分类"
 			},
 			{
+<<<<<<< HEAD
 				"pagePath": "pages/cart/cart",
 				"iconPath": "static/tabBar/tab-cart.png",
 				"selectedIconPath": "static/tabBar/tab-cart-current.png",
@@ -723,4 +724,70 @@
 			}
 		]
 	}
+=======
+				"navigationBarBackgroundColor":"#72E3B4",
+				"navigationBarTextStyle":"white",
+			    "navigationBarTitleText": "店铺数据",
+			    "enablePullDownRefresh": false
+			}
+		},
+		{
+			"path" : "pages/merchant/onlineOrder",
+			"style" :                                                                                    
+			{
+				"navigationBarBackgroundColor":"#ffffff",
+				"navigationBarTextStyle":"black",
+			    "navigationBarTitleText": "在线下单",
+			    "enablePullDownRefresh": false
+			}
+		},
+		{
+			"path" : "pages/wallet/openMember",
+			"style" :                                                                                    
+			{
+				"navigationBarBackgroundColor":"#363533",
+				"navigationBarTextStyle":"white",
+			    "navigationBarTitleText": "开通会员",
+			    "enablePullDownRefresh": false
+			}
+		}
+    ],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "uni-app",
+		"navigationBarBackgroundColor": "#FFFFFF",
+		"backgroundColor": "#f8f8f8"
+	},
+	"tabBar": {
+		"color": "#C0C4CC",
+		"selectedColor": "#5DBC7C",
+		"borderStyle": "black",
+		"backgroundColor": "#ffffff",
+		"list": [{
+				"pagePath": "pages/index/index",
+				"iconPath": "static/tabBar/tab-home.png",
+				"selectedIconPath": "static/tabBar/tab-home-current.png",
+				"text": "首页"
+			},
+			{
+				"pagePath": "pages/category/category",
+				"iconPath": "static/tabBar/tab-cate.png",
+				"selectedIconPath": "static/tabBar/tab-cate-current.png",
+				"text": "分类"
+			},
+			{
+				"pagePath": "pages/cart/cart",
+				"iconPath": "static/tabBar/tab-cart.png",
+				"selectedIconPath": "static/tabBar/tab-cart-current.png",
+				"text": "购物车"
+			},
+			{
+				"pagePath": "pages/user/user",
+				"iconPath": "static/tabBar/tab-my.png",
+				"selectedIconPath": "static/tabBar/tab-my-current.png",
+				"text": "我的"
+			}
+		]
+	}
+>>>>>>> 5705ae03169c285084ea64fbe08c99a47a08f826
 }

pages/merchant/finance.vue

@@ -2,6 +2,9 @@
 	<view class="center">
 		<view class="top">
 			<image src="../../static/img/sybg.png" mode="" class="sybg"></image>
+			<picker mode="date" :value="now_date" @change="bindDateChange" :fields="'month'" :end="now_date">
+				<view class="uni-input choose-time">{{now_date}} ></view>
+			</picker>
 			<view class="top-card">
 				<view class="card-tit">
 					<view class="tit-point"></view>
@@ -101,6 +104,10 @@
 		},
 		data() {
 			let start = new Date(new Date().toLocaleDateString()).getTime()
+			let a = new Date()
+			let month = a.getMonth() + 1 + ''
+			let year = a.getFullYear() + ''
+			
 			return {
 				height: '',
 				list: [],
@@ -113,6 +120,7 @@
 				today_momey: '',//日营业额
 				tiday_start: start/1000,//今日零点时间戳
 				today_count: '',//今日订单数
+				now_date: year+ '-' + month  
 			}
 		},
 		computed: {
@@ -211,6 +219,11 @@
 					this.today_count= data.time
 				})
 			},
+			// 切换月份
+			bindDateChange(e) {
+				console.log(e.detail,'dddddddddddd')
+				this.now_date = e.detail.value
+			}
 		}
 	}
 </script>
@@ -418,5 +431,15 @@
 			}
 		}
 	}
+	.choose-time {
+		position: absolute;
+		top: 90rpx;
+		line-height: 1.5;
+		padding-left: 32rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #FFFFFF;
+	}
 </style>
 

pages/merchant/merchant.vue

@@ -33,8 +33,15 @@
 					<view class="bottom"><image src="../../static/merchant/shop.png" mode=""></image></view>
 					商品管理
 				</view>
+<<<<<<< HEAD
 				<view class="userInfoList-bottom">
 					<view class="bottom"><image src="../../static/merchant/xiadan.png" mode=""></image></view>
+=======
+				<view class="userInfoList-bottom" @click="navTo('/pages/merchant/onlineOrder')">
+					<view class="bottom">
+						<image src="../../static/merchant/xiadan.png" mode=""></image>
+					</view>
+>>>>>>> 5705ae03169c285084ea64fbe08c99a47a08f826
 					在线下单
 				</view>
 				<view class="userInfoList-bottom" @click="navTo('/pages/merchant/vipDetail')">

pages/merchant/onlineOrder.vue

@@ -0,0 +1,787 @@
+<template>
+	<view class="container">
+		<!-- 空白页 -->
+		<view v-if="!hasLogin || empty === true" class="empty">
+			<image src="/static/error/emptyCart.png" class="emptyImg" mode="aspectFit"></image>
+			<view v-if="hasLogin" class="empty-tips">
+				空空如也
+				<navigator class="navigator" v-if="hasLogin" url="../index/index" open-type="switchTab">随便逛逛>
+				</navigator>
+			</view>
+			<view v-else class="empty-tips">
+				空空如也
+				<view class="navigator" @click="navToLogin">去登陆></view>
+			</view>
+		</view>
+		<view v-else>
+			<!-- 购物车头部 -->
+			<view class="cart-hand flex">
+				<view class="hand-tit">
+					购物车共 <text>{{ ' '+cartList.length}} 件</text>商品
+				</view>
+				<view class="hand-btn" @click="clearCart()">
+					清空购物车
+				</view>
+			</view>
+			<!-- 列表 -->
+			<view class="cart-list">
+				<block v-for="(item, index) in cartList" :key="item.id">
+					<view class="cart-item" :class="{ 'b-b': index !== cartList.length - 1 }">
+						<view class="image-wrapper">
+							<image :src="item.productInfo.image" :class="[item.loaded]" mode="aspectFill" lazy-load
+								@load="onImageLoad('cartList', index)" @error="onImageError('cartList', index)"></image>
+							<view class="iconfont iconroundcheckfill checkbox" :class="{ checked: item.checked }"
+								@click="check('item', index)"></view>
+						</view>
+						<view class="item-right">
+							<text class="clamp title">{{ item.productInfo.store_name }}</text>
+							<!-- <text class="attr">{{ item.productInfo.attrInfo.suk }}</text> -->
+							<text class="price">¥{{ item.productInfo.price }}</text>
+							<!-- <uni-number-box
+								class="step"
+								:min="1"
+								:max="item.productInfo.stock"
+								:value="item.cart_num > item.productInfo.stock ? item.productInfo.stock : item.cart_num"
+								:isMax="item.cart_num >= item.productInfo.stock ? true : false"
+								:isMin="item.cart_num === 1"
+								:index="index"
+								@eventChange="numberChange"
+							></uni-number-box> -->
+							<view class="munbox flex">
+								<image src="../../static/icon/reduce.png" mode="" @click="reduce(item,index)"></image>
+								<input type="number" :value="item.cart_num" disabled />
+								<image src="../../static/icon/add.png" mode="" @click="add(item)"></image>
+							</view>
+						</view>
+						<!-- <text class="del-btn iconfont iconclose" @click="deleteCartItem(index)"></text> -->
+					</view>
+				</block>
+			</view>
+			<!-- 底部菜单栏 -->
+			<view class="action-section">
+				<view class="checkbox">
+					<view class="iconfont iconroundcheckfill icon-checked-box" @click="check('all')"
+						:class="{ 'icon-checked': allChecked }"></view>
+					<!-- <view class="clear-btn" @click="allChecked ? clearCart() : ''" :class="{ show: allChecked }"><text>清空</text></view> -->
+				</view>
+				<view class="total-box">
+					<text class="price">合计：¥{{ total }}</text>
+					<!-- <text class="coupon">
+						已优惠
+						<text>74.35</text>
+						元
+					</text> -->
+				</view>
+				<button type="primary" class="no-border confirm-btn" @click="createOrder">去结算</button>
+			</view>
+		</view>
+		<view class="btm-btn">
+			<view class="btn-item" @click="openQr">
+				扫码添加
+			</view>
+			<view class="btn-item btn-item1" @click="entQr">
+				输入条码
+			</view>
+		</view>
+		<uni-popup ref="popuphx" class="agree-wrapper">
+			<view class="hx-wrapper">
+				<view class="hx-img">
+					<image src="../../static/img/hxbg.png" mode=""></image>
+				</view>
+				<view class="hx-body">
+					<view class="hx-title">
+						输入商品条码
+					</view>
+					<input type="text" v-model="code" placeholder="请输入条码" placeholder-class="hx-placeholder" />
+					<view class="hx-btn" @click="confirmAdd">
+						确认添加
+					</view>
+				</view>
+				<view class="hx-close" @click="close">
+					<image src="../../static/icon/close.png" mode=""></image>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import {
+		getCartList,
+		getCartNum,
+		cartDel
+	} from '@/api/cart.js';
+	import {
+		mapState
+	} from 'vuex';
+	import uniNumberBox from '@/components/uni-number-box.vue';
+	import uniPopup from '@/components/uni-popup/uni-popup.vue'
+	import {
+		saveUrl,
+		interceptor
+	} from '@/utils/loginUtils.js';
+	export default {
+		components: {
+			uniNumberBox,
+			uniPopup
+		},
+		data() {
+			return {
+				total: 0, //总价格
+				allChecked: false, //全选状态  true|false
+				empty: false, //空白页现实  true|false
+				cartList: [],
+				code: '', //商品条码
+			};
+		},
+		onShow() {
+			// 只有登录时才加载数据
+			if (this.hasLogin) {
+				this.loadData();
+			}
+		},
+		watch: {
+			//显示空白页
+			cartList(e) {
+				let empty = e.length === 0 ? true : false;
+				if (this.empty !== empty) {
+					this.empty = empty;
+				}
+			}
+		},
+		computed: {
+			...mapState(['weichatObj']),
+			...mapState('user', ['hasLogin'])
+		},
+		methods: {
+			reduce(item, index) {
+				if (item.cart_num == 1) {
+					uni.showModal({
+						content: '删除该商品？',
+						success: e => {
+							if (e.confirm) {
+								this.deleteCartItem(index)
+							}
+						}
+					});
+
+				} else {
+					item.cart_num--
+					this.newNumberChange(item)
+				}
+			},
+			add(item) {
+				console.log(item)
+				if (item.productInfo.stock > item.cart_num) {
+					item.cart_num++
+					this.newNumberChange(item)
+				} else {
+					return
+				}
+			},
+			//请求数据
+			async loadData() {
+				let obj = this;
+				getCartList({})
+					.then(function(e) {
+						// 获取当前购物车物品增加数量
+						let nub = obj.cartList.length;
+						// 获取之前对象数组
+						let aArray = obj.cartList.reverse();
+						// 获取返回数据对象数组
+						let bArray = e.data.valid.reverse();
+						obj.cartList = bArray
+							.map((item, ind) => {
+								// 设置返回数据默认为勾选状态
+								item.checked = true;
+								// 获取相同数组之前对象的数据
+								let carlist = aArray[ind];
+								// 判断之前是否已经加载完毕
+								if (carlist && carlist.loaded == 'loaded') {
+									item.loaded = 'loaded';
+								}
+								return item;
+							})
+							.reverse();
+						obj.calcTotal(); //计算总价
+					})
+					.catch(function(e) {
+						console.log(e);
+					});
+			},
+			//监听image加载完成
+			onImageLoad(key, index) {
+				// 修改载入完成后图片class样式
+				this.$set(this[key][index], 'loaded', 'loaded');
+			},
+			//监听image加载失败
+			onImageError(key, index) {
+				this[key][index].image = '/static/error/errorImage.jpg';
+			},
+			// 跳转到登录页
+			navToLogin() {
+				// 保存地址
+				saveUrl();
+				// 登录拦截
+				interceptor();
+			},
+			//选中状态处理
+			check(type, index) {
+				if (type === 'item') {
+					this.cartList[index].checked = !this.cartList[index].checked;
+				} else {
+					const checked = !this.allChecked;
+					const list = this.cartList;
+					list.forEach(item => {
+						item.checked = checked;
+					});
+					this.allChecked = checked;
+				}
+				this.calcTotal(type);
+			},
+			//数量
+			numberChange(data) {
+				let arr = this.cartList[data.index];
+				arr.cart_num = data.number;
+				getCartNum({
+						id: arr.id,
+						number: data.number
+					})
+					.then(e => {
+						console.log(e);
+					})
+					.catch(function(e) {
+						console.log(e);
+					});
+				this.calcTotal();
+			},
+			newNumberChange(item) {
+				getCartNum({
+						id: item.id,
+						number: item.cart_num
+					})
+					.then(e => {
+						console.log(e);
+					})
+					.catch(function(e) {
+						console.log(e);
+					});
+				this.calcTotal();
+			},
+			//删除
+			deleteCartItem(index) {
+				let list = this.cartList;
+				let row = list[index];
+				let id = row.id;
+				cartDel({
+					ids: id
+				});
+				this.cartList.splice(index, 1);
+				uni.hideLoading();
+				this.calcTotal();
+			},
+			//清空
+			clearCart() {
+				uni.showModal({
+					content: '清空购物车？',
+					success: e => {
+						if (e.confirm) {
+							let st = this.cartList.map(e => {
+								return e.id;
+							});
+							cartDel({
+								ids: st.join(',')
+							}).then(e => {
+								console.log(e);
+							});
+							this.cartList = [];
+						}
+					}
+				});
+			},
+			//计算总价
+			calcTotal() {
+				let list = this.cartList;
+				if (list.length === 0) {
+					this.empty = true;
+					return;
+				}
+				let total = 0;
+				let checked = true;
+				list.forEach(item => {
+					if (item.checked === true) {
+						total += item.productInfo.price * item.cart_num;
+					} else if (checked === true) {
+						checked = false;
+					}
+				});
+				this.allChecked = checked;
+				this.total = Number(total.toFixed(2));
+			},
+			//创建订单
+			createOrder() {
+				let list = this.cartList;
+				let goodsData = [];
+				list.forEach(item => {
+					if (item.checked) {
+						goodsData.push(item.id);
+					}
+				});
+
+				uni.navigateTo({
+					url: '/pages/order/createOrder?id=' + goodsData.join(',')
+				});
+			},
+			entQr() {
+				this.$refs.popuphx.open()
+			},
+			close() {
+				this.$refs.popuphx.close()
+				this.code = ''
+			},
+			confirmAdd() {
+				console.log('确认添加', this.code)
+				this.close()
+			},
+			openQr() {
+				let obj = this;
+				// #ifndef H5
+				uni.scanCode({
+					success(e) {
+						// obj.orderVerific(e.result);
+						console.log(e.result)
+					}
+				});
+				// #endif
+				// #ifdef H5
+				this.weichatObj.scanQRCode({
+					needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
+					scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有
+					success: function(res) {
+						// obj.orderVerific(res.resultStr); // 当needResult 为 1 时，扫码返回的结果
+						console.log(res.resultStr)
+					}
+				});
+				// #endif
+			},
+		}
+	};
+</script>
+
+<style lang="scss">
+	.container {
+		padding-bottom: 134rpx;
+		background-color: $page-color-base;
+
+		/* 空白页 */
+		.empty {
+			position: fixed;
+			left: 0;
+			top: 0;
+			width: 100%;
+			height: 100vh;
+			padding-bottom: 100rpx;
+			display: flex;
+			justify-content: center;
+			flex-direction: column;
+			align-items: center;
+			background: #fff;
+
+			.emptyImg {
+				width: 300rpx;
+				height: 250rpx;
+				margin-bottom: 30rpx;
+			}
+
+			.empty-tips {
+				display: flex;
+				font-size: $font-sm + 2rpx;
+				color: $font-color-disabled;
+
+				.navigator {
+					color: $uni-color-primary;
+					margin-left: 16rpx;
+				}
+			}
+		}
+	}
+
+	/* 购物车列表项 */
+	.cart-item {
+		width: 710rpx;
+		height: 210rpx;
+		background: #FFFFFF;
+		box-shadow: 0px 0px 10rpx 0rpx rgba(0, 0, 0, 0.1);
+		border-radius: 10rpx;
+		margin: 20rpx auto;
+
+		display: flex;
+		position: relative;
+		padding: 30rpx 26rpx 30rpx 80rpx;
+
+		.image-wrapper {
+			width: 150rpx;
+			height: 150rpx;
+			flex-shrink: 0;
+			position: relative;
+
+			image {
+				border-radius: 8rpx;
+			}
+		}
+
+		.checkbox {
+			display: flex;
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			left: -65rpx;
+			margin: auto 0;
+			height: 50rpx;
+			z-index: 8;
+			font-size: 44rpx;
+			line-height: 1;
+			padding: 4rpx;
+			color: $font-color-disabled;
+			background: #fff;
+			border-radius: 50px;
+		}
+
+		.item-right {
+			display: flex;
+			flex-direction: column;
+			flex: 1;
+			overflow: hidden;
+			position: relative;
+			padding-left: 30rpx;
+
+			.munbox {
+				width: 144rpx;
+				height: 44rpx;
+				position: absolute;
+				bottom: 0;
+				right: 0;
+
+				input {
+					display: inline-block;
+					text-align: center;
+				}
+
+				image {
+					flex-shrink: 0;
+					width: 44rpx;
+					height: 44rpx;
+				}
+			}
+
+			.title,
+			.price {
+				font-size: $font-base + 2rpx;
+				color: $font-color-dark;
+				height: 40rpx;
+				line-height: 40rpx;
+			}
+
+			.attr {
+				font-size: $font-sm + 2rpx;
+				color: $font-color-light;
+				height: 50rpx;
+				line-height: 50rpx;
+
+				font-size: 26rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #999999;
+			}
+
+			.price {
+				// height: 50rpx;
+				// line-height: 50rpx;
+				padding-top: 20rpx;
+				font-size: 34rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #FF4C4C;
+			}
+
+			.step {
+				margin-top: 20rpx;
+			}
+
+			.title {
+				font-size: 34rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+			}
+		}
+
+		.del-btn {
+			padding: 4rpx 10rpx;
+			font-size: 34rpx;
+			height: 50rpx;
+			color: $font-color-light;
+		}
+	}
+
+	/* 底部栏 */
+	.action-section {
+		/* #ifdef H5 */
+		margin-bottom: 97rpx;
+		/* #endif */
+		position: fixed;
+		left: 0rpx;
+		bottom: 0rpx;
+		z-index: 95;
+		display: flex;
+		align-items: center;
+		width: 750rpx;
+		height: 100rpx;
+		padding: 0 30rpx;
+		// background: rgba(255, 255, 255, 0.9);
+		background: #fff;
+
+		// box-shadow: 0 0 20rpx 0 rgba(0, 0, 0, 0.5);
+		// border-radius: 16rpx;
+		.checkbox {
+			height: 52rpx;
+			position: relative;
+
+			.icon-checked-box {
+				border-radius: 50rpx;
+				background-color: #ffffff;
+				width: 52rpx;
+				height: 100%;
+				position: relative;
+				z-index: 5;
+				font-size: 53rpx;
+				line-height: 1;
+				color: $font-color-light;
+
+				&::after {
+					content: '全选';
+					width: 100rpx;
+					position: absolute;
+					top: 0;
+					bottom: 0;
+					margin: auto;
+					line-height: 1.5;
+					padding-left: 10rpx;
+					font-size: 32rpx;
+					font-family: PingFang SC;
+					font-weight: bold;
+					color: #767477;
+				}
+			}
+
+			.icon-checked {
+				color: $base-color;
+			}
+		}
+
+		.clear-btn {
+			position: absolute;
+			left: 26rpx;
+			top: 0;
+			z-index: 4;
+			width: 0;
+			height: 52rpx;
+			line-height: 52rpx;
+			padding-left: 38rpx;
+			font-size: $font-base;
+			color: #fff;
+			background: $font-color-disabled;
+			border-radius: 0 50px 50px 0;
+			opacity: 0;
+			transition: 0.2s;
+
+			&.show {
+				opacity: 1;
+				width: 120rpx;
+			}
+		}
+
+		.total-box {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			text-align: right;
+			padding-right: 40rpx;
+			color: #FF6F0F;
+			font-weight: bold;
+
+			.price {
+				font-size: 32rpx;
+
+				// font-size: $font-lg;
+				// color: $font-color-dark;
+
+			}
+
+			.coupon {
+				font-size: $font-sm;
+
+				// color: $font-color-light;
+				text {
+					font-weight: bold;
+					color: $font-color-dark;
+				}
+			}
+		}
+
+		.confirm-btn {
+			padding: 0 38rpx;
+			margin: 0;
+			border-radius: 100px;
+			height: 76rpx;
+			line-height: 76rpx;
+			font-size: $font-base + 2rpx;
+			background: $base-color;
+			font-weight: bold;
+		}
+	}
+
+	/* 复选框选中状态 */
+	.action-section .checkbox.checked,
+	.cart-item .checkbox.checked {
+		color: $base-color;
+	}
+
+	.cart-hand {
+		width: 750rpx;
+		height: 88rpx;
+		background: #FFFFFF;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #333333;
+		line-height: 88rpx;
+		padding-left: 28rpx;
+		padding-right: 26rpx;
+
+		.hand-tit {
+			text {
+				color: #FF4C4C;
+			}
+
+		}
+
+		.hand-btn {
+			width: 164rpx;
+			height: 62rpx;
+			border: 2rpx solid #FF4C4C;
+			border-radius: 31rpx;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FF4C4C;
+			line-height: 62rpx;
+			text-align: center;
+		}
+	}
+
+	.btm-btn {
+		z-index: 95;
+		display: flex;
+		position: fixed;
+		bottom: 0;
+		text-align: center;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #FFFFFF;
+		line-height: 97rpx;
+		width: 750rpx;
+
+		.btn-item {
+			height: 100%;
+			width: 50%;
+			background-color: #31332d;
+		}
+
+		.btn-item1 {
+			background-color: #5DBC7C;
+		}
+	}
+
+	.cart-list {
+		padding-bottom: 97rpx;
+	}
+
+	.hx-wrapper {
+		width: 536rpx;
+		height: 630rpx;
+		position: relative;
+
+		// background-color: #fff;
+		.hx-img {
+			width: 536rpx;
+			height: 281rpx;
+
+			image {
+				width: 536rpx;
+				height: 281rpx;
+			}
+		}
+
+		.hx-close {
+			position: absolute;
+			left: 243rpx;
+			bottom: -80rpx;
+			width: 52rpx;
+			height: 52rpx;
+
+			image {
+				width: 52rpx;
+				height: 52rpx;
+			}
+		}
+
+		.hx-body {
+			width: 536rpx;
+			height: 349rpx;
+			background-color: #fff;
+			border-radius: 0 0 10rpx 10rpx;
+
+			.hx-title {
+				width: 536rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #333333;
+				line-height: 1;
+				padding-top: 42rpx;
+				text-align: center;
+			}
+
+			input {
+				width: 439rpx;
+				height: 68rpx;
+				background: #DBF3E9;
+				border-radius: 10rpx;
+				margin: 39rpx auto 0;
+				padding-left: 26rpx;
+
+				.hx-placeholder {
+					font-size: 26rpx;
+					font-weight: 500;
+					color: #52C696;
+				}
+			}
+
+			.hx-btn {
+				margin: 44rpx auto 0;
+				width: 353rpx;
+				height: 71rpx;
+				background: #52C696;
+				border-radius: 34rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #F8F9F9;
+				line-height: 71rpx;
+				text-align: center;
+			}
+
+
+		}
+	}
+</style>

pages/merchant/storeData.vue

@@ -1,6 +1,9 @@
 <template>
 	<view class="content">
 		<view class="headr">
+			<picker mode="date" :value="now_date" @change="bindDateChange" :fields="'month'" :end="now_date">
+				<view class="uni-input choose-time">{{now_date}} ></view>
+			</picker>
 			<view class="month">
 				<image src="../../static/icon/sdata.png" mode=""></image>
 				<view class="store-data">
@@ -20,7 +23,7 @@
 			</view>
 		</view>
 		<view class="search-wrapper" v-if="is_show">
-			<input type="text" value="" v-model="keyword" focus/>
+			<input type="text" value="" v-model="keyword" focus />
 			<view class="btn" @click="search">
 				搜索
 			</view>
@@ -74,18 +77,22 @@
 	export default {
 		data() {
 			let arr = []
-			for(let i = 0; i< 10 ; i++) {
+			for (let i = 0; i < 10; i++) {
 				arr.push(i)
 			}
+			let a = new Date()
+			let month = a.getMonth() + 1 + ''
+			let year = a.getFullYear() + ''
 			return {
-				is_show: false,//搜索是否显示
-				keyword: '',//搜索关键字
-				height: '',//滚动区域高度
-				dataList: arr,//月订单
+				is_show: false, //搜索是否显示
+				keyword: '', //搜索关键字
+				height: '', //滚动区域高度
+				dataList: arr, //月订单
 				loaded: true,
 				loadingType: 'more',
 				page: 1,
 				limit: 10,
+				now_date: '2021-10',
 			}
 		},
 		components: {
@@ -113,17 +120,18 @@
 			},
 			search() {
 				console.log('search')
-				// if(this.keyword == '') {
-				// 	this
-				// }
 			},
 			loadData() {
 				let obj = this
 				console.log('加载数据')
-				if(obj.loadingType == 'noMore' || obj.loadingType == 'loading' ) {
-					return 
+				if (obj.loadingType == 'noMore' || obj.loadingType == 'loading') {
+					return
 				}
-				
+
+			},
+			bindDateChange(e) {
+				console.log(e.detail,'dddddddddddd')
+				this.now_date = e.detail.value
 			}
 		}
 	}
@@ -133,6 +141,7 @@
 	page {
 		background-color: #f5f5f5;
 	}
+
 	.headr {
 		height: 357rpx;
 		background-color: #72E3B4;
@@ -147,10 +156,12 @@
 			margin: auto;
 			height: 275rpx;
 			width: 275rpx;
+
 			image {
 				width: 100%;
 				height: 100%;
 			}
+
 			.store-data {
 				position: absolute;
 				height: 275rpx;
@@ -162,6 +173,7 @@
 				flex-direction: column;
 				align-items: center;
 				justify-content: center;
+
 				.data {
 					font-size: 50rpx;
 					font-family: PingFang SC;
@@ -169,6 +181,7 @@
 					color: #FFFFFF;
 					padding-bottom: 20rpx;
 				}
+
 				.tit {
 					font-size: 30rpx;
 					font-family: PingFang SC;
@@ -179,6 +192,7 @@
 		}
 
 	}
+
 	.search-wrapper {
 		width: 702rpx;
 		height: 66rpx;
@@ -193,17 +207,20 @@
 		font-family: PingFang SC;
 		font-weight: 500;
 		color: #999999;
+
 		// line-height: 35px;
 		image {
 			height: 33rpx;
 			width: 33rpx;
 			margin-right: 22rpx;
 		}
+
 		input {
 			width: auto;
 			flex-grow: 1;
 			padding-left: 30rpx;
 		}
+
 		.btn {
 			width: 150rpx;
 			text-align: center;
@@ -211,8 +228,10 @@
 			color: #72E3B4;
 		}
 	}
+
 	.list-wrapper {
 		.swiper-box {
+
 			// background-color: #bfa;
 			.item {
 				width: 702rpx;
@@ -222,12 +241,15 @@
 				box-shadow: 0px 0px 20rpx 0px rgba(50, 50, 52, 0.06);
 				border-radius: 10rpx;
 				margin: 0 auto 15rpx;
+
 				&:last-of-type {
 					margin: 0 auto;
 				}
+
 				.item-top {
 					line-height: 83rpx;
 					max-height: 83rpx;
+
 					.user-name {
 						flex-grow: 1;
 						height: 83rpx;
@@ -237,6 +259,7 @@
 						color: #666666;
 						padding-right: 30rpx;
 					}
+
 					.top-status {
 						width: 100rpx;
 						flex-shrink: 0;
@@ -246,8 +269,10 @@
 						color: #52C696;
 					}
 				}
+
 				.item-body {
 					justify-content: flex-start;
+
 					image {
 						width: 160rpx;
 						height: 160rpx;
@@ -256,10 +281,12 @@
 						flex-shrink: 0;
 						margin-right: 9rpx;
 					}
+
 					.goods-info {
 						width: 100%;
 						height: 160rpx;
 						position: relative;
+
 						.good-name {
 							width: 311rpx;
 							line-height: 37rpx;
@@ -268,6 +295,7 @@
 							font-weight: 500;
 							color: #3F454B;
 						}
+
 						.good-id {
 							// width: 273px;
 							line-height: 40rpx;
@@ -276,6 +304,7 @@
 							font-weight: 400;
 							color: #666666;
 						}
+
 						.tag {
 							margin-top: 6rpx;
 							width: 102rpx;
@@ -288,7 +317,9 @@
 							font-weight: 500;
 							color: #52C696;
 						}
-						.good-price, .good-num {
+
+						.good-price,
+						.good-num {
 							position: absolute;
 							top: 0;
 							right: 0;
@@ -299,12 +330,14 @@
 							font-weight: 500;
 							color: #333333;
 						}
+
 						.good-num {
 							color: #666666;
 							top: 39rpx;
 						}
 					}
 				}
+
 				.item-btm {
 					text-align: right;
 					font-size: 26rpx;
@@ -315,4 +348,12 @@
 			}
 		}
 	}
+	.choose-time {
+		line-height: 1.5;
+		padding-left: 30rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #FFFFFF;
+	}
 </style>

pages/user/user.vue

@@ -73,7 +73,7 @@
 			</view>
 		</view>
 		<!-- <view class="cover-container"> -->
-			<view class="vip">
+			<view class="vip" @click="navTo('/pages/wallet/openMember')">
 				<image src="../../static/user/upgrade.png" mode=""></image>
 			</view>
 		

pages/wallet/openMember.vue

@@ -0,0 +1,929 @@
+<template>
+	<view class="conter">
+		<view class="top">
+			<view class="bg">
+				<view class="bg-item">
+					
+				</view>
+			</view>
+			<view class="card">
+				<view class="opennow">
+					立即开通
+				</view>
+				<view class="card-top flex">
+					<view class="avtur"><image :src="userInfo.avatar || '/static/error/missing-face.png'" mode=""></image></view>
+					<view class="main">
+						<view class="name">{{ userInfo.nickname }}</view>
+						<view class="tip" v-if="userInfo.pay_valid_time == null">尚未开通会员</view>
+						<view class="tip" v-else>
+							<text v-if="type">离会员到期仅剩{{ day }}天</text>
+							<text else>会员已过期</text>
+						</view>
+					</view>
+				</view>
+				<view class="bottom flex" style="z-index: 9; margin-top: 94rpx;">
+					<view class="font">
+						<view class="font-title">会员卡</view>
+						<view class="font-tip">¥500/永久 终身付费会员</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="vip">
+			<view class="system-title">
+				<view class="img" style="margin-right: 45rpx;"><image class="img" src="../../static/img/vip-left.png"></image></view>
+				<view class="title">会员特权</view>
+				<view class="img" style="margin-left: 45rpx;"><image class="img" src="../../static/img/vip-right.png"></image></view>
+			</view>
+			<view class="item-box flex">
+				<view class="item" v-for="(item, index) in viplist" :key="index">
+					<image :src="item.pic" mode=""></image>
+					<view class="item-title">{{ item.title }}</view>
+					<view class="item-tip">{{ item.tip }}</view>
+				</view>
+			</view>
+		</view>
+		<view class="vip">
+			<view class="system-title">
+				<view class="img" style="margin-right: 45rpx;"><image class="img" src="../../static/img/vip-left.png"></image></view>
+				<view class="title">会员特权</view>
+				<view class="img" style="margin-left: 45rpx;"><image class="img" src="../../static/img/vip-right.png"></image></view>
+			</view>
+			<view class="money-box flex">
+				<view class="money" v-for="(item, index) in 3" @click="changevip(item, index)" :class="{ current: index == choose }">
+					<view class="money-name">会员</view>
+					<view class="now-money">
+						￥
+						<text>500</text>
+					</view>
+					<view class="bf-money">￥600</view>
+					<view class="money-tip" :class="{ moneyc: index == choose }">
+						<image src="../../static/img/good.png" mode=""></image>
+						专属折扣
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="box-buttom">
+			<view class="price-left">
+				<text class="entrepreneurship">
+					开通前请阅读
+					<text>《会员服务协议》</text>
+				</text>
+			</view>
+			<view class="price-right" @click="submit">马上开通</view>
+		</view>
+		<uni-popup ref="popupPay" type="bottom">
+			<view class="popup-box">
+				<view class="popup-pay">
+					<view class="paybox-top flex">
+						<view class="type">选择支付方式</view>
+						<view class="image" @click="close"><image src="https://zhibo.liuniu946.com/img/x.png" mode="aspectFill"></image></view>
+					</view>
+					<!-- #ifndef APP-PLUS -->
+					<view class="paybox-main flex">
+						<view class="zftype flex">
+							<image src="https://zhibo.liuniu946.com/img/weixin.png" mode="aspectFill"></image>
+							<view class="zf">微信支付</view>
+						</view>
+						<label class="radio1" @click="changePayType(1)"><radio style="transform:scale(0.7)" value="" :checked="payType == 1" color="#FE4141"></radio></label>
+					</view>
+					<!-- #endif -->
+					<!-- #ifdef APP-PLUS -->
+					<view class="paybox-main flex">
+						<view class="zftype flex">
+							<view class="icon iconfont iconzhifubao"></view>
+							<view class="zf">支付宝支付</view>
+						</view>
+						<label class="radio1" @click="changePayType(3)"><radio style="transform:scale(0.7)" value="" :checked="payType == 3" color="#FE4141"></radio></label>
+					</view>
+					<!-- #endif -->
+					<view class="paybox-main flex">
+						<view class="zftype flex">
+							<image src="https://zhibo.liuniu946.com/img/yue.png" mode="aspectFill"></image>
+							<view class="zf">余额支付</view>
+						</view>
+						<label class="radio" @click="changePayType(2)">
+							<radio style="transform:scale(0.7)" class="rad" value="" :checked="payType == 2" color="#FE4141"></radio>
+						</label>
+					</view>
+				</view>
+				<view class="buttom flex">
+					<view class="heji">
+						合计：
+						<text>
+							￥
+							<text class="money">{{ money }}</text>
+						</text>
+					</view>
+					<view class="zhifu" @click="readyPay()">立即支付</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex';
+import { becomeVip, getVip, setUserRed, claseauto } from '@/api/user.js';
+import { getUserInfo } from '@/api/user.js';
+import { timeComputed } from '@/utils/rocessor.js';
+// // #ifdef H5
+// import weixinObj from '@/plugin/jweixin-module/index.js';
+// // #endif
+
+export default {
+	computed: {
+		...mapState(['weichatObj']),
+		...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
+	},
+	onLoad(option) {
+		this.state = option.state;
+		this.getVip();
+		this.checkedAuto = +this.userInfo.red_packet == 0 ? false : true;
+		if (this.userInfo.pay_valid_time != null) {
+			let TimeObj = timeComputed(this.userInfo.pay_valid_time * 1000);
+			this.type = TimeObj.type == 0 ? true : false;
+			this.day = TimeObj.day;
+		}
+	},
+	data() {
+		return {
+			checkedZdLoding: false, //自动拼团是否加载中
+			checkedAutoZd: 1, //开启关闭自动拼团
+			timeEnd: true, //判断会员是否超时
+			viplist: [
+				{
+					pic: '../../static/img/yjjl.png',
+					title: '佣金奖励',
+					tip: '更多佣金奖励'
+				},
+				{
+					pic: '../../static/img/zszk.png',
+					title: '专属折扣',
+					tip: '优享会员折扣'
+				},
+				{
+					pic: '../../static/img/tdjl.png',
+					title: '团队奖励',
+					tip: '更多团队奖励'
+				}
+			],
+			state: '',
+			// #ifndef APP-PLUS
+			payType: 1,
+			payName: 'weixin',
+			// #endif
+			// #ifdef APP-PLUS
+			payType: 2,
+			payName: 'yue',
+			// #endif
+			day: '', //会员的天数
+			name: '',
+			payList: [],
+			froms: '',
+			money: 0,
+			explain: '',
+			now_money: '', // 当前余额
+			payLoding: false, //判断是否支付中
+			choose: 0,
+			level_id: '',
+			checkedAuto: false, //是否开启自动领红包
+			checkedLoding: false //请求自动加载设置保存中
+		};
+	},
+	methods: {
+		...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
+		// 开启关闭自动拼团
+		autoOut(e) {
+			uni.showLoading({
+				title: '关闭中...',
+				mask: true
+			});
+			claseauto()
+				.then(e => {
+					uni.hideLoading();
+					uni.showToast({
+						title: '成功关闭！'
+					});
+				})
+				.catch(e => {
+					uni.hideLoading();
+				});
+		}, //自动拼团是否加载中
+		// 获取vip等级
+		getVip() {
+			getVip({}).then(({ data }) => {
+				data.forEach((sj, index) => {
+					sj.sq = (sj.money * 0.33).toFixed(0);
+					sj.yuan = (sj.sq * 1 + sj.money * 1).toFixed(2);
+				});
+				this.payList = data;
+				// 设置默认选中的对象
+				this.level_id = data[0].id;
+				this.money = data[0].money;
+				console.log(this.payList);
+			});
+		},
+		// 开启关闭自动加载
+		changeAuto(e) {
+			console.log(e);
+			if (this.checkedLoding) {
+				return;
+			}
+			this.checkedLoding = true;
+			setUserRed({
+				red_packet: e
+			})
+				.then(e => {
+					uni.showToast({
+						title: '设置成功！'
+					});
+					this.checkedLoding = false;
+				})
+				.catch(e => {
+					this.checkedAuto = false;
+					this.checkedLoding = false;
+				});
+		},
+		submit() {
+			if (this.money == 0) {
+				uni.showModal({
+					title: '提示',
+					content: '请选择要开通的会员'
+				});
+			} else {
+				console.log('打开支付弹窗');
+				this.$refs.popupPay.open();
+			}
+		},
+		close() {
+			this.$refs.popupPay.close();
+		},
+		changePayType(type) {
+			this.payType = type;
+			console.log('this.payType', this.payType);
+			if (this.payType == 1) {
+				this.payName = 'weixin';
+				console.log('weixin', this.payName);
+			}
+			if (this.payType == 2) {
+				this.payName = 'yue';
+				console.log('yue', this.payName);
+			}
+			if (this.payType == 3) {
+				this.payName = 'ali';
+				console.log('ali', this.payName);
+			}
+		},
+		readyPay() {
+			// this.$refs.popup.open();
+			this.pay();
+		},
+		changevip(item, index) {
+			this.level_id = item.id;
+			this.choose = index;
+			console.log(this.level_id);
+			this.money = item.money;
+		},
+		getUserInfoB() {
+			getUserInfo({})
+				.then(({ data }) => {
+					this.setUserInfo(data);
+					if (this.state == 1) {
+						uni.navigateTo({
+							url: '/pages/vip/success'
+						});
+					} else {
+						uni.navigateBack();
+					}
+				})
+				.catch(e => {
+					console.log(e);
+				});
+		},
+		pay() {
+			let obj = this;
+			console.log('点击');
+			try {
+				let obj = this;
+				obj.payLoding = true;
+				// #ifdef H5
+				// 获取当前是否为微信浏览器
+				obj.froms = uni.getStorageSync('weichatBrowser') || '';
+				// #endif
+				uni.showLoading({
+					title: '支付中',
+					mask: true
+				});
+				let data = {
+					pay_type: this.payName,
+					level_id: obj.level_id,
+					// #ifdef H5
+					from: obj.froms ? 'weixin' : 'H5', //来源
+					// #endif
+					// #ifdef MP-WEIXIN
+					from: 'routine', //来源
+					// #endif
+					// #ifdef APP-PLUS
+					from: 'app' //来源
+					// #endif
+				};
+				console.log(data, '传值');
+				becomeVip(data).then(({ data }) => {
+					console.log('fufei', data);
+					uni.hideLoading();
+					if (obj.payName == 'ali') {
+						const url = data.data;
+						console.log(url, 'url');
+						uni.requestPayment({
+							provider: 'alipay',
+							orderInfo: url,
+							success: res => {
+								console.log(res);
+								uni.showToast({
+									title: '充值成功',
+									duration: 2000
+								});
+							},
+							fail: e => {
+								console.log(e);
+							},
+							complete: () => {}
+						});
+						obj.payLoding = false;
+					}
+					if (data.status == 'PAY_ERROR') {
+						console.log(data);
+					}
+					if (data.status == 'SUCCESS') {
+						obj.$refs.popupPay.close();
+						obj.getUserInfoB();
+						// getUserInfo({})
+						// 	.then(({ data }) => {
+						// 		obj.setUserInfo(data);
+						// 		if (obj.state == 1) {
+						// 			uni.navigateTo({
+						// 				url: '/pages/vip/success'
+						// 			});
+						// 		} else {
+						// 			uni.navigateBack();
+						// 		}
+						// 	})
+						// 	.catch(e => {
+						// 		console.log(e);
+						// 	});
+					}
+					console.log('-----', data);
+					let da = data.result.jsConfig;
+					if (obj.payName == 'weixin' || obj.payName == 'routine') {
+						// let da = data.result.jsConfig;
+						console.log('--da--', da);
+						let data = {
+							// #ifdef H5
+							timestamp: da.timestamp,
+							// #endif
+							// #ifdef MP
+							timeStamp: da.timestamp,
+							// #endif
+							nonceStr: da.nonceStr,
+							package: da.package,
+							signType: da.signType,
+							paySign: da.paySign,
+							success: function(res) {
+								console.log(res);
+								obj.getUserInfoB();
+								// getUserInfo({})
+								// 	.then(({ data }) => {
+								// 		obj.setUserInfo(data);
+								// 		if (obj.state == 1) {
+								// 			uni.navigateTo({
+								// 				url: '/pages/vip/success'
+								// 			});
+								// 		} else {
+								// 			uni.navigateBack();
+								// 		}
+								// 	})
+								// 	.catch(e => {
+								// 		console.log(e);
+								// 	});
+							},
+							fail: e => {
+								console.log(e);
+							}
+						};
+						console.log('--data--', data);
+						// #ifdef MP
+						wx.requestPayment(data);
+						// #endif
+						// #ifdef H5
+						if (obj.payName == 'weixin') {
+							weichatObj.chooseWXPay(data);
+						}
+						// #endif
+					}
+
+					uni.hideLoading();
+					// #ifdef H5
+					if (data.status == 'PAY_ERROR') {
+						console.log(data);
+					}
+					if (data.status == 'SUCCESS') {
+						obj.$refs.popupPay.close();
+						obj.getUserInfoB();
+						// getUserInfo({})
+						// 	.then(({ data }) => {
+						// 		obj.setUserInfo(data);
+						// 		if (obj.state == 1) {
+						// 			uni.navigateTo({
+						// 				url: '/pages/vip/success'
+						// 			});
+						// 		} else {
+						// 			uni.navigateBack();
+						// 		}
+						// 	})
+						// 	.catch(e => {
+						// 		console.log(e);
+						// 	});
+					}
+					// #endif
+				});
+			} catch (e) {
+				console.log('fufiecw', e);
+				//TODO handle the exception
+			}
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+.outBottom {
+	width: 190rpx;
+	height: 69rpx;
+	background: #3a3a3b;
+	border-radius: 35rpx;
+	color: #ffffff;
+	line-height: 69rpx;
+	text-align: center;
+	font-size: 27rpx;
+	font-family: PingFang SC;
+	font-weight: 500;
+}
+.top {
+	width: 750rpx;
+	background-color: #fff;
+	padding-top: 45rpx;
+	padding-bottom: 45rpx;
+	// height: 626rpx;
+	.bg {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		width: 750rpx;
+		height: 200rpx;
+		overflow: hidden;
+		.bg-item {
+			width: 750rpx;
+			height: 145rpx;
+			background-color: #363533;
+			border-radius:0 0 25% 25%;
+			// position: absolute;
+			// bottom: 0;
+			// top: -2200rpx;
+			// left: 0;
+			// right: 0;
+			// margin:0 auto;
+		}
+	}
+	.title {
+		position: relative;
+		z-index: 10;
+		width: 100%;
+		padding-top: 20rpx;
+		text-align: center;
+		font-size: 34rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #333333;
+	}
+	.card {
+		position: relative;
+		margin: 0 auto 0;
+		z-index: 10;
+		width: 655rpx;
+		// height: 324rpx;
+		background: linear-gradient(225deg, #ffeed2 0%, #fed591 100%);
+		border-radius: 24rpx;
+		padding: 28rpx 25rpx 30rpx 36rpx;
+		.opennow {
+			width: 190rpx;
+			line-height: 69rpx;
+			background: #3A3A3B;
+			border-radius: 35rpx;
+			position: absolute;
+			top: 39rpx;
+			right: 25rpx;
+			font-size: 30rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #FFFFFF;
+			text-align: center;
+		}
+		.card-top {
+			justify-content: flex-start;
+			.avtur {
+				width: 90rpx;
+				height: 90rpx;
+				border-radius: 50%;
+				margin-right: 10rpx;
+				image {
+					background-color: #eee;
+					width: 100%;
+					height: 100%;
+					border-radius: 50%;
+				}
+			}
+			.name {
+				font-size: 30rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
+			}
+			.tip {
+				font-size: 20rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
+				opacity: 0.52;
+			}
+		}
+		.btn {
+			position: absolute;
+			top: 40rpx;
+			right: 24rpx;
+			width: 190rpx;
+			height: 69rpx;
+			background: #3a3a3b;
+			border-radius: 35rpx;
+			font-size: 30rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #ffffff;
+			line-height: 69rpx;
+			text-align: center;
+		}
+	}
+	.bottom {
+		margin-top: 40rpx;
+		.font-title {
+			font-size: 30rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #333333;
+		}
+		.font-tip {
+			font-size: 22rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #343434;
+		}
+	}
+	.turn {
+		width: 108rpx;
+		height: 51rpx;
+		background: #ffffff;
+		border-radius: 26rpx;
+		padding: 10rpx;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #333333;
+		display: flex;
+		align-items: center;
+		.yuan {
+			display: inline-block;
+			width: 35rpx;
+			height: 35rpx;
+			background: linear-gradient(112deg, #ffe5bb, #fed591);
+			border-radius: 50%;
+			margin-right: 12rpx;
+		}
+	}
+}
+.vip {
+	margin-top: 20rpx;
+	background: #ffffff;
+	padding-bottom: 54rpx;
+	.system-title {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		padding-top: 40rpx;
+		.title {
+			font-size: 32rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #1d2023;
+		}
+
+		.img {
+			width: 170rpx;
+			height: 2rpx;
+			display: block;
+		}
+	}
+	.item-box {
+		margin-top: 40rpx;
+		justify-content: center;
+		align-items: center;
+		.item {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			image {
+				width: 100rpx;
+				height: 100rpx;
+			}
+			.item-title {
+				margin-top: 14rpx;
+				font-size: 24rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
+			}
+			.item-tip {
+				margin-top: 10rpx;
+				font-size: 20rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #999999;
+			}
+		}
+	}
+	.money-box {
+		margin-top: 40rpx;
+		justify-content: center;
+		align-items: center;
+		padding: 0 47rpx 160rpx 25rpx;
+		.current {
+			border: 1rpx solid #fed591 !important;
+			background: #fff8ec !important;
+		}
+		.money {
+			margin-left: 22rpx;
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			width: 204rpx;
+			height: 296rpx;
+			background: #f5f5f5;
+			border: 1rpx solid #ffffff;
+			border-radius: 20rpx;
+			position: relative;
+			.tj {
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 90rpx;
+				height: 44rpx;
+				text-align: center;
+				line-height: 44rpx;
+				font-size: 25rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #ffffff;
+				.tj-bg {
+					width: 90rpx;
+					height: 44rpx;
+				}
+				text {
+					display: inline-block;
+					position: relative;
+					top: -56rpx;
+				}
+			}
+			.money-name {
+				margin-top: 58rpx;
+				font-size: 33rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #644931;
+			}
+			.now-money {
+				font-size: 30rpx;
+				font-family: FZCuHeiSongS-B-GB;
+				font-weight: 400;
+				color: #f7cf9c;
+				text {
+					font-size: 50rpx;
+				}
+			}
+			.bf-money {
+				font-size: 33rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				text-decoration: line-through;
+				color: #9a5a12;
+				opacity: 0.35;
+			}
+			.moneyc {
+				background: #f7cf9c !important;
+				color: #ffffff !important;
+			}
+			.money-tip {
+				margin-top: 10rpx;
+				width: 158rpx;
+				height: 45rpx;
+				background: #f5f5f5;
+				border: 1px solid #f7cf9c;
+				border-radius: 23rpx;
+				padding: 5rpx 10rpx;
+				font-size: 25rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #f7cf9c;
+				image {
+					position: relative;
+					top: 2rpx;
+					width: 23rpx;
+					height: 23rpx;
+				}
+			}
+		}
+	}
+}
+.box-buttom {
+	width: 750rpx;
+	height: 98rpx;
+
+	// position: absolute;
+	// buttom:0;
+	position: fixed;
+	bottom: 0;
+	right: 0;
+	// position: absolute;
+	// buttom:100rpx;
+	display: flex;
+	align-items: center;
+	background: #34332f;
+	.price-left {
+		display: flex;
+		.entrepreneurship {
+			font-size: 24rpx;
+			font-weight: 500;
+			color: #bbbbbb;
+			margin-left: 16rpx;
+			text {
+				font-size: 30rpx;
+				color: #ffffff;
+			}
+		}
+	}
+	.price-right {
+		position: absolute;
+		bottom: 0;
+		right: 0;
+		// position: fixed;
+		// buttom: 0;
+		// right: 0;
+		width: 280rpx;
+		height: 108rpx;
+		background: #fed591;
+		font-size: 36rpx;
+		font-weight: bold;
+		color: #000000;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+	.price-right1 {
+		position: absolute;
+		bottom: 0;
+		right: 0;
+		// position: fixed;
+		// buttom: 0;
+		// right: 0;
+		width: 280rpx;
+		height: 108rpx;
+		background: #b5b5b5;
+		font-size: 36rpx;
+		font-weight: bold;
+		color: #ffffff;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+}
+.popup-box {
+	width: 100%;
+	height: 450rpx;
+	background: #ffffff;
+}
+.popup-pay {
+	position: relative;
+	justify-content: space-between;
+	padding: 0rpx 25rpx 32rpx 25rpx;
+	.paybox-top {
+		padding-top: 38rpx;
+		width: 100%;
+		.type {
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #333333;
+		}
+		.image {
+			padding-right: 24rpx;
+			padding-bottom: 10rpx;
+			image {
+				width: 16rpx;
+				height: 16rpx;
+			}
+		}
+	}
+	.paybox-main {
+		width: 100%;
+		margin-top: 54rpx;
+		.zftype {
+			padding-left: 5rpx;
+			image {
+				width: 38rpx;
+				height: 40rpx;
+			}
+			.zf {
+				padding-left: 18rpx;
+				font-size: 28rpx;
+				font-family: PingFang SC;
+				font-weight: 400;
+				color: #3f454b;
+			}
+		}
+	}
+}
+.buttom {
+	width: 100%;
+	height: 113rpx;
+	padding-top: 20rpx;
+	align-items: center;
+	.heji {
+		height: 100%;
+		width: 50%;
+		padding-left: 23rpx;
+		padding-top: 20rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: #3f454b;
+		text {
+			font-size: 24rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #ff0000;
+			.money {
+				font-size: 36rpx;
+			}
+		}
+	}
+	.zhifu {
+		width: 50%;
+		height: 92rpx;
+		background: linear-gradient(180deg, #fd4646, #ff3535);
+		text-align: center;
+		line-height: 92rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+	}
+}
+.ling-box {
+	position: relative;
+	z-index: 10;
+	width: 654rpx;
+	height: auto;
+	background: #fff8ec;
+	border: 1px solid #fed591;
+	border-radius: 24rpx;
+	margin: 20rpx auto 0;
+	padding: 20rpx 24rpx 15rpx 42rpx;
+	.ling-title {
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #644931;
+	}
+	.ling-tip {
+		font-size: 22rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #644931;
+		line-height: 24px;
+		opacity: 0.67;
+	}
+}
+</style>
+