Merge branch 'master' of http://git.liuniu946.com/cmy/NFT

api/user.js

@@ -1,4 +1,5 @@
 import request from '@/utils/request'
+import { upFilse} from '@/utils/request';
 
 // 订单统计信息
 export function orderData(data) {
@@ -101,4 +102,10 @@ export function delcollect(data) {
 	});
 }
 
-
+export function uploads(data){
+	return upFilse({
+		url:'/api/upload/image',
+		method:'post',
+		data
+	});
+}

components/uni-popup/uni-popup-dialog.vue

@@ -0,0 +1,243 @@
+<template>
+	<view class="uni-popup-dialog">
+		<view class="uni-dialog-title">
+			<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{title}}</text>
+		</view>
+		<view class="uni-dialog-content">
+			<text class="uni-dialog-content-text" v-if="mode === 'base'">{{content}}</text>
+			<input v-else class="uni-dialog-input" v-model="val" type="text" :placeholder="placeholder" :focus="focus" >
+		</view>
+		<view class="uni-dialog-button-group">
+			<view class="uni-dialog-button" @click="close">
+				<text class="uni-dialog-button-text">取消</text>
+			</view>
+			<view class="uni-dialog-button uni-border-left" @click="onOk">
+				<text class="uni-dialog-button-text uni-button-color">确定</text>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	/**
+	 * PopUp 弹出层-对话框样式
+	 * @description 弹出层-对话框样式
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} value input 模式下的默认值
+	 * @property {String} placeholder input 模式下输入提示
+	 * @property {String} type = [success|warning|info|error] 主题样式
+	 *  @value success 成功
+	 * 	@value warning 提示
+	 * 	@value info 消息
+	 * 	@value error 错误
+	 * @property {String} mode = [base|input] 模式、
+	 * 	@value base 基础对话框
+	 * 	@value input 可输入对话框
+	 * @property {String} content 对话框内容
+	 * @property {Boolean} beforeClose 是否拦截取消事件
+	 * @event {Function} confirm 点击确认按钮触发
+	 * @event {Function} close 点击取消按钮触发
+	 */
+
+	export default {
+		name: "uniPopupDialog",
+		props: {
+			value: {
+				type: [String, Number],
+				default: ''
+			},
+			placeholder: {
+				type: [String, Number],
+				default: '请输入内容'
+			},
+			/**
+			 * 对话框主题 success/warning/info/error	  默认 success
+			 */
+			type: {
+				type: String,
+				default: 'error'
+			},
+			/**
+			 * 对话框模式 base/input
+			 */
+			mode: {
+				type: String,
+				default: 'base'
+			},
+			/**
+			 * 对话框标题
+			 */
+			title: {
+				type: String,
+				default: '提示'
+			},
+			/**
+			 * 对话框内容
+			 */
+			content: {
+				type: String,
+				default: ''
+			},
+			/**
+			 * 拦截取消事件 ，如果拦截取消事件，必须监听close事件，执行 done()
+			 */
+			beforeClose: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+				dialogType: 'error',
+				focus: false,
+				val: ""
+			}
+		},
+		inject: ['popup'],
+		watch: {
+			type(val) {
+				this.dialogType = val
+			},
+			mode(val) {
+				if (val === 'input') {
+					this.dialogType = 'info'
+				}
+			},
+			value(val) {
+				this.val = val
+			}
+		},
+		created() {
+			// 对话框遮罩不可点击
+			this.popup.mkclick = false
+			if (this.mode === 'input') {
+				this.dialogType = 'info'
+				this.val = this.value
+			} else {
+				this.dialogType = this.type
+			}
+		},
+		mounted() {
+			this.focus = true
+		},
+		methods: {
+			/**
+			 * 点击确认按钮
+			 */
+			onOk() {
+				this.$emit('confirm', () => {
+					this.popup.close()
+					if (this.mode === 'input') this.val = this.value
+				}, this.mode === 'input' ? this.val : '')
+			},
+			/**
+			 * 点击取消按钮
+			 */
+			close() {
+				if (this.beforeClose) {
+					this.$emit('close', () => {
+						this.popup.close()
+					})
+					return
+				}
+				this.popup.close()
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.uni-popup-dialog {
+		width: 300px;
+		border-radius: 15px;
+		background-color: #fff;
+	}
+
+	.uni-dialog-title {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+		padding-top: 15px;
+		padding-bottom: 5px;
+	}
+
+	.uni-dialog-title-text {
+		font-size: 16px;
+		font-weight: 500;
+	}
+
+	.uni-dialog-content {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		padding: 5px 15px 15px 15px;
+	}
+
+	.uni-dialog-content-text {
+		font-size: 14px;
+		color: #6e6e6e;
+	}
+
+	.uni-dialog-button-group {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		border-top-color: #f5f5f5;
+		border-top-style: solid;
+		border-top-width: 1px;
+	}
+
+	.uni-dialog-button {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 45px;
+	}
+
+	.uni-border-left {
+		border-left-color: #f0f0f0;
+		border-left-style: solid;
+		border-left-width: 1px;
+	}
+
+	.uni-dialog-button-text {
+		font-size: 14px;
+	}
+
+	.uni-button-color {
+		color: $uni-color-primary;
+	}
+
+	.uni-dialog-input {
+		flex: 1;
+		font-size: 14px;
+	}
+
+	.uni-popup__success {
+		color: $uni-color-success;
+	}
+
+	.uni-popup__warn {
+		color: $uni-color-warning;
+	}
+
+	.uni-popup__error {
+		color: $uni-color-error;
+	}
+
+	.uni-popup__info {
+		color: #909399;
+	}
+</style>

components/uni-popup/uni-popup-message.vue

@@ -0,0 +1,116 @@
+<template>
+	<view class="uni-popup-message" :class="'uni-popup__'+[type]">
+		<text class="uni-popup-message-text" :class="'uni-popup__'+[type]+'-text'">{{message}}</text>
+	</view>
+</template>
+
+<script>
+	
+	/**
+	 * PopUp 弹出层-消息提示
+	 * @description 弹出层-消息提示
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [success|warning|info|error] 主题样式
+	 *  @value success 成功
+	 * 	@value warning 提示
+	 * 	@value info 消息
+	 * 	@value error 错误
+	 * @property {String} message 消息提示文字
+	 * @property {String} duration 显示时间，设置为 0 则不会自动关闭
+	 */
+	
+	export default {
+		name: 'UniPopupMessage',
+		props: {
+			/**
+			 * 主题 success/warning/info/error	  默认 success
+			 */
+			type: {
+				type: String,
+				default: 'success'
+			},
+			/**
+			 * 消息文字
+			 */
+			message: {
+				type: String,
+				default: ''
+			},
+			/**
+			 * 显示时间，设置为 0 则不会自动关闭
+			 */
+			duration: {
+				type: Number,
+				default: 3000
+			}
+		},
+		inject: ['popup'],
+		data() {
+			return {}
+		},
+		created() {
+			this.popup.childrenMsg = this
+		},
+		methods: {
+			open() {
+				if (this.duration === 0) return
+				clearTimeout(this.popuptimer)
+				this.popuptimer = setTimeout(() => {
+					this.popup.close()
+				}, this.duration)
+			},
+			close() {
+				clearTimeout(this.popuptimer)
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.uni-popup-message {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		background-color: #e1f3d8;
+		padding: 10px 15px;
+		border-color: #eee;
+		border-style: solid;
+		border-width: 1px;
+	}
+	.uni-popup-message-text {
+		font-size: 14px;
+		padding: 0;
+	}
+
+	.uni-popup__success {
+		background-color: #e1f3d8;
+	}
+
+	.uni-popup__success-text {
+		color: #67C23A;
+	}
+
+	.uni-popup__warn {
+		background-color: #faecd8;
+	}
+
+	.uni-popup__warn-text {
+		color: #E6A23C;
+	}
+
+	.uni-popup__error {
+		background-color: #fde2e2;
+	}
+
+	.uni-popup__error-text {
+		color: #F56C6C;
+	}
+
+	.uni-popup__info {
+		background-color: #F2F6FC;
+	}
+
+	.uni-popup__info-text {
+		color: #909399;
+	}
+</style>

components/uni-popup/uni-popup-ori.vue

@@ -0,0 +1,263 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear">
+		<uni-transition :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<slot />
+			</view>
+		</uni-transition>
+	</view>
+</template>
+
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件，为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * @property {Boolean} animation = [ture|false] 是否开启动画
+	 * @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
+	 * @event {Function} change 打开关闭弹窗触发，e={show: false}
+	 */
+
+	export default {
+		name: 'UniPopup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			}
+		},
+		watch: {
+			type: {
+				handler: function(newVal) {
+					switch (this.type) {
+						case 'top':
+							this.ani = ['slide-top']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+							}
+							break
+						case 'bottom':
+							this.ani = ['slide-bottom']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+								'bottom': 0
+							}
+							break
+						case 'center':
+							this.ani = ['zoom-out', 'fade']
+							this.transClass = {
+								'position': 'fixed',
+								/* #ifndef APP-NVUE */
+								'display': 'flex',
+								'flexDirection': 'column',
+								/* #endif */
+								'bottom': 0,
+								'left': 0,
+								'right': 0,
+								'top': 0,
+								'justifyContent': 'center',
+								'alignItems': 'center'
+							}
+
+							break
+					}
+				},
+				immediate: true
+			}
+		},
+		created() {
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+		},
+		methods: {
+			clear(e) {
+				// TODO nvue 取消冒泡
+				e.stopPropagation()
+			},
+			open() {
+				this.showPopup = true
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.showTrans = true
+					}, 50);
+				})
+				this.$emit('change', {
+					show: true
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.$emit('change', {
+							show: false
+						})
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.maskClick) return
+				this.close()
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.uni-popup {
+		position: fixed;
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: $uni-bg-color-mask;
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		top: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(-500px);
+	}
+
+	.bottom {
+		bottom: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(500px);
+	}
+
+	.center {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex-direction: column;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		top: 0;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+	}
+
+	.content-ani {
+		// transition: transform 0.3s;
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+</style>

components/uni-popup/uni-popup-share.vue

@@ -0,0 +1,282 @@
+<template>
+	<view>
+		<uni-popup-ori ref="showshare" type="bottom">
+			<view class="uni-share">
+				<text class="uni-share-title">分享到</text>
+				<view class="uni-share-content">
+					<view v-for="(item, index) in bottomData" :key="index" class="uni-share-content-box" @click="shareTo(item.name)">
+						<view class="uni-share-content-image"><image :src="item.icon" class="content-image" mode="widthFix" /></view>
+						<text class="uni-share-content-text">{{ item.text }}</text>
+					</view>
+				</view>
+				<text class="uni-share-btn" @click="cancel()">取消分享</text>
+			</view>
+		</uni-popup-ori>
+		<uni-popup-ori ref="showPast" type="center" class="popupPast">
+			<view class="backPop">
+				<view class="popPast">
+					<view class="popTitle">口令已复制</view>
+					<view class="popContent">
+						<view>{{ describe }}</view>
+					</view>
+					<view class="popBtn" @click="goWhere(1)" v-if="popType == 'wx'">
+						<!-- <image src="../../static/spend/wxin.png" mode="widthFix"></image> -->
+						<view>去微信粘贴给好友</view>
+					</view>
+					<view class="popBtn" @click="goWhere(2)" v-if="popType == 'timeline'">
+						<!-- <image src="../../static/spend/wechat.png" mode="widthFix"></image> -->
+						<view>粘贴到朋友圈</view>
+					</view>
+				</view>
+				<icon type="cancel" size="26" color="white" style="margin-top: 40rpx;" @click="cancelPo" />
+			</view>
+		</uni-popup-ori>
+	</view>
+</template>
+
+<script>
+import uniPopupOri from '@/components/uni-popup/uni-popup-ori.vue';
+import { mapState, mapMutations } from 'vuex';
+import { getActionPage } from '@/utils/loginUtils.js';
+export default {
+	name: 'SharePopup',
+	components: {
+		uniPopupOri
+	},
+	props: ['opt', 'type','option'],
+	data() {
+		return {
+			describe: '',
+			shareoption: '',
+			bottomData: [
+				{
+					text: '微信',
+					icon: '../../static/spend/wxin.png',
+					name: 'wx'
+				},
+				{
+					text: '朋友圈',
+					icon: '../../static/spend/wechat.png',
+					name: 'timeline'
+				}
+			],
+			popType: '',
+			uid: ''
+		};
+	},
+	computed: {
+		...mapState(['userInfo', 'baseURL'])
+	},
+	mounted() {},
+	methods: {
+		loadData() {
+			try {
+				let prePage = getActionPage();
+				var path = prePage.route;
+				this.uid = this.userInfo.uid;
+				//获取object转化成
+				var parm = '';
+				var i = 0;
+				var option = this.option; //其他页面传值
+				console.log(option,'option')
+				if(this.type == 4){
+					parm = parm + '?' + 'promo_code=' + option;
+				}else{
+					for (let item in option) {
+						//拼接参数
+						if (i == 0) {
+							parm = '?' + item + '=' + option[item];
+						} else {
+							parm = parm + '&' + item + '=' + option[item];
+						}
+						i++;
+					}
+				}
+				if(this.type == 4){
+					var url = 'pages/index/index' + parm;
+				}else{
+					var url = path + parm;
+				}
+				console.log(path,'path')
+				console.log(parm,'parm')
+				//用后台加密
+				//第一个参数是判断是不是我们的链接
+				//第二个参数是访问地址
+				//第三个参数是，类型，type:0商品,type=1拼团,type=2邀请注册,type=3邀请好友参团,type=4邀请好友助力
+				//第四个参数是share的id
+				console.log(option,'option')
+				if(this.type == 4){
+					this.describe = this.baseURL + '@' + url + '@' + this.type + '@' + this.uid + '@复制这段话进入美美赚,自动打开页面';
+				}else{
+					this.describe = this.baseURL + '@' + url + '@' + this.type + '@' + this.uid + '@复制这段话进入美美赚,自动打开页面';
+				}
+				console.log(this.describe);
+				let obj = this;
+				// #ifndef H5
+				uni.setClipboardData({
+					data: this.describe,
+					  success: function () {
+					        uni.hideToast();
+					    }
+				});
+				// #endif
+			} catch (e) {
+				console.log(e);
+				//TODO handle the exception
+			}
+		},
+		goWhere(type) {
+			this.$api.msg('复制成功');
+		},
+		cancelPo() {
+			this.$nextTick(() => {
+				this.$refs['showPast'].close();
+			});
+		},
+		shareTo(name) {
+			this.popType = name;
+			this.$nextTick(() => {
+				this.$refs.showPast.open();
+				this.$refs['showshare'].close();
+			});
+		},
+		cancel() {
+			this.$nextTick(() => {
+				this.$refs['showshare'].close();
+			});
+		},
+		open() {
+			this.$nextTick(() => {
+				this.$refs['showshare'].open();
+			});
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.backPop {
+	padding: 0rpx 25rpx;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+}
+.popupPast {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	text-align: center;
+}
+.popPast {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	padding: 40rpx 30rpx;
+	width: 90%;
+	background-color: white;
+	border-radius: 18rpx;
+	align-items: center;
+	.popTitle {
+		color: #2f2f2f;
+		font-size: 32rpx;
+		font-weight: bold;
+		margin-bottom: 40rpx;
+	}
+	.popContent {
+		background-color: #f4f4f4;
+		padding: 30rpx 24rpx;
+		border-radius: 16rpx;
+		view {
+			font-size: 24rpx;
+			color: #939393;
+		}
+		margin-bottom: 40rpx;
+	}
+	.popBtn {
+		display: flex;
+		align-items: center;
+		padding: 20rpx 40rpx;
+		background-color: #04be02;
+		border-radius: 60rpx;
+		image {
+			width: 36rpx;
+		}
+		view {
+			color: white;
+			font-size: 36rpx;
+			margin-left: 10rpx;
+		}
+	}
+}
+/* 底部分享 */
+.uni-share {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	flex-direction: column;
+	/* #endif */
+	background-color: #fff;
+}
+
+.uni-share-title {
+	line-height: 60rpx;
+	font-size: 24rpx;
+	padding: 15rpx 0;
+	text-align: center;
+}
+
+.uni-share-content {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;
+	padding: 15px;
+}
+
+.uni-share-content-box {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: column;
+	align-items: center;
+	width: 200rpx;
+}
+
+.uni-share-content-image {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	width: 60rpx;
+	height: 60rpx;
+	overflow: hidden;
+	border-radius: 10rpx;
+}
+
+.content-image {
+	width: 60rpx;
+	height: 60rpx;
+}
+
+.uni-share-content-text {
+	font-size: 26rpx;
+	color: #333;
+	padding-top: 5px;
+	padding-bottom: 10px;
+}
+
+.uni-share-btn {
+	height: 90rpx;
+	line-height: 90rpx;
+	font-size: 14px;
+	border-top-color: #f5f5f5;
+	border-top-width: 1px;
+	border-top-style: solid;
+	text-align: center;
+	color: #666;
+}
+</style>

components/uni-popup/uni-popup.vue

@@ -0,0 +1,263 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear">
+		<uni-transition :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<slot />
+			</view>
+		</uni-transition>
+	</view>
+</template>
+
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件，为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * @property {Boolean} animation = [ture|false] 是否开启动画
+	 * @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
+	 * @event {Function} change 打开关闭弹窗触发，e={show: false}
+	 */
+
+	export default {
+		name: 'UniPopup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			}
+		},
+		watch: {
+			type: {
+				handler: function(newVal) {
+					switch (this.type) {
+						case 'top':
+							this.ani = ['slide-top']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+							}
+							break
+						case 'bottom':
+							this.ani = ['slide-bottom']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+								'bottom': 0
+							}
+							break
+						case 'center':
+							this.ani = ['zoom-out', 'fade']
+							this.transClass = {
+								'position': 'fixed',
+								/* #ifndef APP-NVUE */
+								'display': 'flex',
+								'flexDirection': 'column',
+								/* #endif */
+								'bottom': 0,
+								'left': 0,
+								'right': 0,
+								'top': 0,
+								'justifyContent': 'center',
+								'alignItems': 'center'
+							}
+
+							break
+					}
+				},
+				immediate: true
+			}
+		},
+		created() {
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+		},
+		methods: {
+			clear(e) {
+				// TODO nvue 取消冒泡
+				e.stopPropagation()
+			},
+			open() {
+				this.showPopup = true
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.showTrans = true
+					}, 50);
+				})
+				this.$emit('change', {
+					show: true
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.$emit('change', {
+							show: false
+						})
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.maskClick) return
+				this.close()
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.uni-popup {
+		position: fixed;
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: $uni-bg-color-mask;
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		top: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(-500px);
+	}
+
+	.bottom {
+		bottom: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(500px);
+	}
+
+	.center {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex-direction: column;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		top: 0;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+	}
+
+	.content-ani {
+		// transition: transform 0.3s;
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+</style>

components/uni-transition/uni-transition.vue

@@ -0,0 +1,279 @@
+<template>
+	<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
+	 @click="change">
+		 <slot></slot>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const animation = uni.requireNativePlugin('animation');
+	// #endif
+	/**
+	 * Transition 过渡动画
+	 * @description 简单过渡动画组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=985
+	 * @property {Boolean} show = [false|true] 控制组件显示或隐藏
+     * @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
+     *  @value fade 渐隐渐出过渡
+     *  @value slide-top 由上至下过渡
+     *  @value slide-right 由右至左过渡
+     *  @value slide-bottom 由下至上过渡
+     *  @value slide-left 由左至右过渡
+     *  @value zoom-in 由小到大过渡
+     *  @value zoom-out 由大到小过渡
+	 * @property {Number} duration 过渡动画持续时间
+	 * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
+	 */
+	export default {
+		name: 'uniTransition',
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			modeClass: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			duration: {
+				type: Number,
+				default: 300
+			},
+			styles: {
+				type: Object,
+				default () {
+					return {}
+				}
+			}
+		},
+		data() {
+			return {
+				isShow: false,
+				transform: '',
+				ani: { in: '',
+					active: ''
+				}
+			};
+		},
+		watch: {
+			show: {
+				handler(newVal) {
+					if (newVal) {
+						this.open()
+					} else {
+						this.close()
+					}
+				},
+				immediate: true
+			}
+		},
+		computed: {
+			stylesObject() {
+				let styles = {
+					...this.styles,
+					'transition-duration': this.duration / 1000 + 's'
+				}
+				let transfrom = ''
+				for (let i in styles) {
+					let line = this.toLine(i)
+					transfrom += line + ':' + styles[i] + ';'
+				}
+				return transfrom
+			}
+		},
+		created() {
+			// this.timer = null
+			// this.nextTick = (time = 50) => new Promise(resolve => {
+			// 	clearTimeout(this.timer)
+			// 	this.timer = setTimeout(resolve, time)
+			// 	return this.timer
+			// });
+		},
+		methods: {
+			change() {
+				this.$emit('click', {
+					detail: this.isShow
+				})
+			},
+			open() {
+				clearTimeout(this.timer)
+				this.isShow = true
+				this.transform = ''
+				this.ani.in = ''
+				for (let i in this.getTranfrom(false)) {
+					if (i === 'opacity') {
+						this.ani.in = 'fade-in'
+					} else {
+						this.transform += `${this.getTranfrom(false)[i]} `
+					}
+				}
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this._animation(true)
+					}, 50)
+				})
+
+			},
+			close(type) {
+				clearTimeout(this.timer)
+				this._animation(false)
+			},
+			_animation(type) {
+				let styles = this.getTranfrom(type)
+				// #ifdef APP-NVUE
+				if(!this.$refs['ani']) return
+				animation.transition(this.$refs['ani'].ref, {
+					styles,
+					duration: this.duration, //ms
+					timingFunction: 'ease',
+					needLayout: false,
+					delay: 0 //ms
+				}, () => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+				})
+				// #endif
+				// #ifndef APP-NVUE
+				this.transform = ''
+				for (let i in styles) {
+					if (i === 'opacity') {
+						this.ani.in = `fade-${type?'out':'in'}`
+					} else {
+						this.transform += `${styles[i]} `
+					}
+				}
+				this.timer = setTimeout(() => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+
+				}, this.duration)
+				// #endif
+
+			},
+			getTranfrom(type) {
+				let styles = {
+					transform: ''
+				}
+				this.modeClass.forEach((mode) => {
+					switch (mode) {
+						case 'fade':
+							styles.opacity = type ? 1 : 0
+							break;
+						case 'slide-top':
+							styles.transform += `translateY(${type?'0':'-100%'}) `
+							break;
+						case 'slide-right':
+							styles.transform += `translateX(${type?'0':'100%'}) `
+							break;
+						case 'slide-bottom':
+							styles.transform += `translateY(${type?'0':'100%'}) `
+							break;
+						case 'slide-left':
+							styles.transform += `translateX(${type?'0':'-100%'}) `
+							break;
+						case 'zoom-in':
+							styles.transform += `scale(${type?1:0.8}) `
+							break;
+						case 'zoom-out':
+							styles.transform += `scale(${type?1:1.2}) `
+							break;
+					}
+				})
+				return styles
+			},
+			_modeClassArr(type) {
+				let mode = this.modeClass
+				if (typeof(mode) !== "string") {
+					let modestr = ''
+					mode.forEach((item) => {
+						modestr += (item + '-' + type + ',')
+					})
+					return modestr.substr(0, modestr.length - 1)
+				} else {
+					return mode + '-' + type
+				}
+			},
+			// getEl(el) {
+			// 	console.log(el || el.ref || null);
+			// 	return el || el.ref || null
+			// },
+			toLine(name) {
+				return name.replace(/([A-Z])/g, "-$1").toLowerCase();
+			}
+		}
+	}
+</script>
+
+<style>
+	.uni-transition {
+		transition-timing-function: ease;
+		transition-duration: 0.3s;
+		transition-property: transform, opacity;
+	}
+
+	.fade-in {
+		opacity: 0;
+	}
+
+	.fade-active {
+		opacity: 1;
+	}
+
+	.slide-top-in {
+		/* transition-property: transform, opacity; */
+		transform: translateY(-100%);
+	}
+
+	.slide-top-active {
+		transform: translateY(0);
+		/* opacity: 1; */
+	}
+
+	.slide-right-in {
+		transform: translateX(100%);
+	}
+
+	.slide-right-active {
+		transform: translateX(0);
+	}
+
+	.slide-bottom-in {
+		transform: translateY(100%);
+	}
+
+	.slide-bottom-active {
+		transform: translateY(0);
+	}
+
+	.slide-left-in {
+		transform: translateX(-100%);
+	}
+
+	.slide-left-active {
+		transform: translateX(0);
+		opacity: 1;
+	}
+
+	.zoom-in-in {
+		transform: scale(0.8);
+	}
+
+	.zoom-out-active {
+		transform: scale(1);
+	}
+
+	.zoom-out-in {
+		transform: scale(1.2);
+	}
+</style>

pages.json

@@ -77,6 +77,12 @@
 				}
 			}
 		},
+		{
+			"path": "pages/money/payment",
+			"style": {
+				"navigationBarTitleText": "支付密码"
+			}
+		},
 		{
 			"path": "pages/public/forget",
 			"style": {
@@ -100,12 +106,33 @@
 				"navigationBarTitleText": "收货地址"
 			}
 		},
+		{
+			"path": "pages/assets/myPing",
+			"style": {
+				"navigationBarTitleText": "我的拼购"
+			}
+		},
+		{
+			"path": "pages/assets/teamDetails",
+			"style": {
+				"navigationBarTitleText": "我的组队详情"
+			}
+		},
 		{
 			"path": "pages/set/addressManage",
 			"style": {
 				"navigationBarTitleText": ""
 			}
 		},
+		{
+			"path": "pages/user/extension",
+			"style": {
+				"navigationBarTitleText": "我的推广",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
 		{
 			"path": "pages/set/phone",
 			"style": {

pages/assets/myPing.vue

@@ -0,0 +1,258 @@
+<template>
+	<view class="center">
+		<view class="bg"></view>
+		<view class="zong flex">
+			<view class="info">
+				<view class="info-num">{{happy || '0.00' }}</view>
+				<view class="info-font">福气值</view>
+			</view>
+			<view class="info">
+				<view class="info-num">{{luck || '0.00' }}</view>
+				<view class="info-font">幸运值</view>
+			</view>
+			<view class="info">
+				<view class="info-num">{{honor || '0.00' }}</view>
+				<view class="info-font">荣誉值</view>
+			</view>
+		</view>
+		<view class="money flex">
+			<view class="money-box">
+				<view class="money-num">{{usdt || '0.00' }}</view>
+				<view class="money-font">昨日USDT分红池</view>
+			</view>
+			<view class="money-box" >
+				<view class="money-num" style="text-align: right;">{{fil || '0.00' }}</view>
+				<view class="money-font">昨日FIL分红池</view>
+			</view>
+		</view>
+		<view class="join">
+			<view class="xian"></view>
+			<view class="join-font">参与记录</view>
+		</view>
+		<scroll-view scroll-y="true" @scrolltolower="loadData">
+			<view v-for="(item,index) in list" :key="index" class="box" @click="nav(item)">
+				<view class="title">
+					<view class="log"><image src="" mode=""></image></view>
+					<view class="name">{{item.name}}</view>
+					<view class="lun">{{item.lun}}</view>
+					<view class="more">详情</view>
+				</view>
+				<view class="main">
+					<view class="main-info">
+						<view class="main-left">参与份数</view>
+						<view class="main-right">{{item.fen}}人份</view>
+					</view>
+					<view class="main-info">
+						<view class="main-left">参与金额</view>
+						<view class="main-right">{{item.money}}USDT</view>
+					</view>
+					<view class="main-info">
+						<view class="main-left">参与时间</view>
+						<view class="main-right">{{item.time}}</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			happy: '0.00',
+			luck: '0.00',
+			honor: '0.00',
+			usdt: '0.00',
+			fil: '0.00',
+			list: [
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+			],
+			loadtype: '',
+			page: 1,
+			limit: 10,
+		}
+	},
+	methods:{
+		nav(e) {
+			uni.navigateTo({
+				url: '/pages/assets/teamDetails'
+			})
+		},
+	}
+}
+</script>
+
+<style lang="scss">
+.center,page {
+	height: 100%;
+	background: #F7FBFE;
+}
+.bg {
+	width: 750rpx;
+	height: 248rpx;
+	background: #000000;
+	border-bottom-left-radius: 150rpx;
+	border-bottom-right-radius: 150rpx;
+}
+.zong {
+	width: 690rpx;
+	height: 181rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	margin: -150rpx auto 0;
+	justify-content: space-between;
+	padding: 0rpx 36rpx;
+	.info {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		.info-num {
+			font-size: 50rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.info-font {
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #6D7C88;
+		}
+	}
+}
+.money {
+	width: 690rpx;
+	height: 143rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	margin: 10rpx auto 0;
+	justify-content: space-between;
+	padding: 0rpx 36rpx;
+	.money-box {
+		display: flex;
+		flex-direction: column;
+		.money-num {
+			font-size: 40rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.money-font {
+			font-size: 24rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #6D7C88;
+		}
+	}
+}
+.join {
+	margin-top: 44rpx;
+	padding-left: 30rpx;
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
+	.xian {
+		width: 6rpx;
+		height: 30rpx;
+		background: #0F253A;
+		border-radius: 4rpx;
+	}
+	.join-font {
+		padding-left: 16rpx;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #0F253A;
+	}
+}
+.box:first-child {
+	margin-top: 34rpx;
+}
+.box {
+	margin: 20rpx auto 0;
+	width: 690rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	padding: 26rpx 36rpx 30rpx 30rpx;
+	position: relative;
+	.title {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		.log {
+			width: 48rpx;
+			height: 46rpx;
+			background: #00BCD4;
+			image{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.name {
+			padding-left: 12rpx;
+			font-size: 34rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.lun {
+			padding-left: 10rpx;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6D7C88;
+		}
+		.more {
+			padding-left: 158rpx;
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #44969D;
+		}
+	}
+	.main {
+		margin-top: 26rpx;
+		.main-info{
+			padding-top: 16rpx;
+			display: flex;
+			justify-content: space-between;
+			.main-left {
+				font-size: 26rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #6D7C88;
+			}
+			.main-right {
+				font-size: 26rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #0F253A;
+			}
+		}
+	}
+}
+</style>

pages/assets/teamDetails.vue

@@ -0,0 +1,131 @@
+<template>
+	<view class="center">
+		<view class="box">
+			<view class="title">
+				<view class="log"><image src="" mode=""></image></view>
+				<view class="name">FilsCoin矿机拼购</view>
+				<view class="lun">36轮</view>
+				<view class="more">已开奖</view>
+			</view>
+			<view class="main">
+				<view class="main-info rule">每轮限购1组，每组限购1份</view>
+				<view class="main-info time">
+					开奖时间：
+					<text>2021-07-21 08:00:00</text>
+				</view>
+				<view class="main-info new">该轮预约1份，拼中1份，退回0份</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="allTitle">
+				<view class="title-left">第1组 预约份数/总份数：11/11</view>
+				<view class="title-right">未中奖</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			data: ''
+		};
+	}
+};
+</script>
+
+<style lang="scss">
+.center,
+page {
+	height: 100%;
+	background: #f7fbfe;
+}
+.box {
+	margin: 30rpx auto 0;
+	width: 690rpx;
+	background: #ffffff;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	padding: 26rpx 36rpx 30rpx 30rpx;
+	.title {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		.log {
+			width: 48rpx;
+			height: 46rpx;
+			background: #00bcd4;
+			image {
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.name {
+			padding-left: 12rpx;
+			font-size: 34rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0f253a;
+		}
+		.lun {
+			padding-left: 10rpx;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6d7c88;
+		}
+		.more {
+			padding-left: 140rpx;
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #44969d;
+		}
+	}
+	.main {
+		margin-top: 26rpx;
+		.main-info {
+			padding-top: 16rpx;
+		}
+		.rule {
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #0f253a;
+		}
+		.time {
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6d7c88;
+			text {
+				color: #0f253a;
+			}
+		}
+		.new {
+			font-size: 24rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #ff4c4c;
+		}
+	}
+}
+.allTitle {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	.title-left {
+		font-size: 34rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #0F253A;
+	}
+	.title-right {
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #6D7C88;
+	}
+}
+</style>

pages/money/payment.vue

@@ -0,0 +1,190 @@
+<template>
+	<view class="container">
+		<view class="list-box">
+			<view class="flex_item list-title">
+				<view class="tip"></view>
+				<view class="title">支付密码</view>
+			</view>
+			<view class="list-cell flex_item">
+				<view class="cell-name">新密码</view>
+				<input type="password" v-model="password" placeholder="请输入不小于6位数的密码" />
+			</view>
+			<view class="list-cell flex_item">
+				<view class="cell-name">重复密码</view>
+				<input type="password" v-model="password2" placeholder="请重复输入密码" />
+			</view>
+			<view class="list-cell flex_item">
+				<view class="cell-name nameCode">验证码</view>
+				<view class="code-box flex">
+					<input type="number" v-model="code" placeholder="请输入验证码" />
+					<view class="code" @click="verification">{{ countDown == 0 ? '验证码' : countDown }}</view>
+				</view>
+			</view>
+		</view>
+		<view class="submit" @click="updatalogin">确认</view>
+	</view>
+</template>
+<script>
+import { updatalogin } from '@/api/set.js';
+import { verify } from '@/api/login.js';
+export default {
+	data() {
+		return {
+			phone: '', //用户
+			code: '', //验证码
+			password2:'',
+			password:'',
+			time: '', //保存倒计时对象
+			countDown: 0 //倒计时
+		};
+	},
+	onLoad(option){
+		let userInfo = uni.getStorageSync('userInfo') || '';
+		this.phone = userInfo.account
+	},
+	onShow() {
+		
+	},
+	watch: {
+		// 监听倒计时
+		countDown(i) {
+			if (i == 0) {
+				clearInterval(this.time);
+			}
+		}
+	},
+	//下拉刷新
+	onPullDownRefresh() {
+		this.loadData();
+	},
+	methods: {
+		updatalogin() {
+			let obj = this;
+			if (obj.password == '') {
+				obj.$api.msg('请输入新密码');
+				return;
+			}
+			if (obj.password2 == '') {
+				obj.$api.msg('请再次输入密码');
+				return;
+			}
+			if (obj.password2 != obj.password) {
+				obj.$api.msg('两次密码不正确');
+				return;
+			}
+			if (obj.code == '') {
+				obj.$api.msg('请输入验证码');
+				return;
+			}
+			updatalogin({
+				account: obj.phone, //账号
+				password:obj.password,
+				password2:obj.password2,
+				type:2,
+				captcha: obj.code
+			}).then(function(e) {
+				obj.$api.msg(e.msg);
+				uni.switchTab({
+					url: '/pages/user/user'
+				})
+			}).catch((e) => {
+				console.log(e);
+			});
+		},
+		//发送验证码
+		verification() {
+			let obj = this;
+			if (this.phone == '') {
+				this.$api.msg('请输入电话号码');
+				return;
+			}
+			if (this.phone.length < 11) {
+				this.$api.msg('请输入正确的手机号');
+				return;
+			}
+			// 判断是否在倒计时
+			if (obj.countDown > 0) {
+				return false;
+			} else {
+				obj.countDown = 60;
+				obj.time = setInterval(() => {
+					obj.countDown--;
+				}, 1000);
+				//调用验证码接口
+				verify({
+					phone: obj.phone,
+					type: 'login'
+				})
+					.then(({ data }) => {})
+					.catch(err => {
+						console.log(err);
+					});
+			}
+		},
+	}
+};
+</script>
+
+<style lang="scss">
+page {
+	min-height: 100%;
+	background-color: #ffffff;
+	.container {
+		width: 100%;
+		padding: 27rpx 31rpx;
+		
+	}
+}
+.list-box{
+	.list-title{
+		font-size: 30rpx;
+		font-weight: 500;
+		color: #333333;
+		margin-bottom: 61rpx;
+		.tip{
+			width: 2rpx;
+			height: 30rpx;
+			background: #4C5D97;
+			margin-right:17rpx ;
+		}
+	}
+	.list-cell{
+		margin-bottom: 70rpx;
+		.cell-name{
+			width: 30%;
+			font-size: 26rpx;
+			font-weight: 500;
+			color: #333333;
+		}
+		.nameCode{
+			width: 42% !important;
+		}
+		.code-box{
+			width: 100% !important;
+			input{
+				width: 50%;
+			}
+			.code{
+				font-size: 26rpx;
+				font-weight: 500;
+				color: #44969D;;
+			}
+		}
+		input{
+			width: 60%;
+			text-align: left;
+			font-size: 26rpx;
+			font-weight: 500;
+		}
+	}
+}
+	.submit {
+		background: linear-gradient(90deg, #60BAB0, #60BAB0, #45969B);
+		margin-top: 20rpx;
+		color: #FFFFFF;
+		text-align: center;
+		padding: 20rpx 0rpx;
+		border-radius: 50rpx;
+		margin-top: 60rpx;
+	}
+</style>

pages/public/forget.vue

@@ -1,35 +1,41 @@
 <template>
 	<view class="container">
-		<view class="container_text">
-			<image class="banner-img" src="/static/img/img01.png" mode=" scaleToFill"></image>
-		</view>
-		<view class="loginTitle"><text>手机号登录</text></view>
+		<view class="logo-img"></view>
+		<view class="logo">LOGO</view>
 		<view class="login_text">
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img03.png"></image></view>
-				<view class="login_name"><input class="uni-input" v-model="phone" focus placeholder="请输入手机号" /></view>
+			<view class="login_input flex_item">
+				<view class="login_img"><image class="phone" src="/static/img/img25.png"></image></view>
+				<view class="login_name"><input class="uni-input" type="number" v-model="phone" focus placeholder="请输入手机号码" /></view>
+			</view>
+			<view class="login_input flex_item">
+				<view class="login_img"><image src="/static/img/img26.png"></image></view>
+				<view class="login_name"><input class="uni-input" type="password" v-model="password" focus placeholder=" 请输入新的不少于6位的密码" /></view>
+			</view>
+			<view class="login_input flex_item">
+				<view class="login_img"><image src="/static/img/img26.png"></image></view>
+				<view class="login_name"><input class="uni-input" type="password" v-model="password2" focus placeholder="请重复输入新密码" /></view>
 			</view>
 			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img06.png"></image></view>
+				<view class="login_img"><image class="codeimg" src="/static/img/img27.png"></image></view>
 				<view class="login_name flex">
-					<input class="uni-input width" v-model="code" focus placeholder="请输入验证码" />
-					<view class="code" @click="verification">{{ countDown == 0 ? '验证码' : countDown }}</view>
+					<input class="uni-input width" v-model="code" type="number" focus placeholder="请输入验证码" />
+					<view class="code" @click="verification">{{ countDown == 0 ? '发送验证码' : countDown }}</view>
 				</view>
 			</view>
-			<view>
-				<button type="green" @click="register" class="uni-button uni-button-green">登录</button>
-			</view>
 		</view>
+		<view class="login" @click="updatalogin">确认修改</view>
 	</view>
 </template>
 <script>
-import { mapMutations } from 'vuex';
-import { verify, loginMobile, getUserInfo } from '@/api/login.js';
+import { updatalogin } from '@/api/set.js';
+import { verify } from '@/api/login.js';
 export default {
 	data() {
 		return {
 			phone: '', //用户
 			code: '', //验证码
+			password2:'',
+			password:'',
 			time: '', //保存倒计时对象
 			countDown: 0 //倒计时
 		};
@@ -44,36 +50,42 @@ export default {
 		}
 	},
 	methods: {
-		...mapMutations('user', ['setUserInfo', 'login']),
-		// 手机登录
-		register() {
+		updatalogin() {
 			let obj = this;
 			if (obj.phone == '') {
-				obj.$api.msg('请输入电话号码');
+				obj.$api.msg('请输入手机号码');
 				return;
 			}
-			if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(this.phone)) {
+			if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(obj.phone)) {
 				obj.$api.msg('请输入正确的手机号');
 				return;
 			}
+			if (obj.password == '') {
+				obj.$api.msg('请输入密码');
+				return;
+			}
+			if (obj.password2 == '') {
+				obj.$api.msg('请再次输入密码');
+				return;
+			}
+			if (obj.password2 != obj.password) {
+				obj.$api.msg('两次密码不正确');
+				return;
+			}
 			if (obj.code == '') {
 				obj.$api.msg('请输入验证码');
 				return;
 			}
-
-			loginMobile({
-				phone: obj.phone, //账号
+			updatalogin({
+				account: obj.phone, //账号
+				password:obj.password,
+				password2:obj.password2,
+				type:1,
 				captcha: obj.code
 			}).then(function(e) {
-				uni.setStorageSync('token', e.data.token);
-				getUserInfo({}).then(e => {
-					obj.login();
-					// 保存返回用户数据
-					obj.setUserInfo(e.data);
-					//成功跳转首页
-					uni.switchTab({
-						url: '/pages/index/index'
-					});
+				obj.$api.msg(e.msg);
+				uni.navigateTo({
+					url: '/pages/public/login'
 				});
 			}).catch((e) => {
 				console.log(e);
@@ -109,61 +121,68 @@ export default {
 					});
 			}
 		},
-		login() {
-			//返回登录
-			uni.navigateTo({
-				url: '/pages/public/login'
-			});
-		}
 	}
 };
 </script>
 
 <style lang="scss">
 page {
-	height: 100%;
-}
-.container {
-	width: 100%;
-	height: 100%;
-	background-size: 100%;
-}
-.container_text {
-	width: 100%;
-	height: 500rpx;
-	top: 0rpx;
-	.banner-img {
-		width: 100%;
-		height: 100%;
+		min-height: 100%;
+		background-color: #ffffff;
+		.container {
+			width: 100%;
+			padding: 60rpx 70rpx;
+		}
+	}
+	.logo-img{
+		width: 161rpx;
+		height: 161rpx;
+		margin: auto;
+		margin-bottom: 15rpx !important;
+		background: #44969D;
+		box-shadow: 0px 12px 13px 0px rgba(68, 150, 157, 0.47);
+		border-radius: 50%;
+		image{
+			width: 161rpx;
+			height: 161rpx;	
+			border-radius: 50%;
+		}
+	}
+	.logo{
+		font-size: 36rpx;
+		font-weight: 400;
+		color: #44969D;
+		text-align: center;
+	}
+	.phone{
+		height: 43rpx !important;
+		width: 27rpx !important;
+	}
+	.codeimg{
+		height: 39rpx !important;
+		width: 31rpx !important;
 	}
-}
 .login_text {
-	margin: auto 30rpx;
-	position: relative;
-	padding: 100rpx 102rpx;
-	background-color: #ffffff;
-	margin-top: -180rpx;
 	border-radius: 20rpx;
+	margin-top: 80rpx;
 	.login_input {
-		border-bottom: 1px solid #f0f0f0;
-		margin-bottom: 65rpx;
+		// border-bottom: 1px solid #C5CEE0;
+		margin-bottom:35rpx;
+		padding-bottom: 60rpx;
 		.login_img image {
 			height: 35rpx;
-			width: 29rpx;
+			width: 31rpx;
 			margin-right: 20rpx;
 		}
 		.uni-input {
 			text-align: left;
-			width: 470rpx;
-			font-size: 28rpx !important;
+			width: 400rpx;
+			font-size:32rpx !important;
 		}
 		.login_name {
 			color: #333333;
-			.width {
-				width: 325rpx !important;
-			}
 			.code {
-				color: #5dbc7c;
+				color: #60BAB0;
 				font-size: 23rpx;
 				border-left: 1px solid #eeeeee;
 				width: 150rpx;
@@ -172,29 +191,15 @@ page {
 			}
 		}
 	}
-	.uni-button-green {
-		color: #ffffff;
-		background-color: #5dbc7c;
-		margin: 40rpx 10rpx;
-		border-radius: 50rpx;
-	}
-	.uni-button {
-		height: 85rpx;
-		line-height: 85rpx;
-	}
-}
-.loginTitle {
-	position: absolute;
-	top: 250rpx;
-	width: 100%;
-	text-align: center;
-	color: white;
-	font-size: 40rpx;
 }
 
-uni-button {
-	height: 80rpx !important;
-	line-height: 80rpx !important;
+.login{
+	background: linear-gradient(90deg, #60BAB0, #60BAB0, #45969B);
+	margin-top: 96rpx;
+	color: #FFFFFF;
+	text-align: center;
+	padding: 26rpx 0rpx;
+	border-radius: 20rpx;
 }
 
 </style>

pages/public/login.vue

@@ -1,386 +1,169 @@
 <template>
 	<view class="container">
-		<view class="container_text">
-			<image class="banner-img" src="/static/img/img01.png" mode="scaleToFill"></image>
+		<view class="loginTitle">WelcomeLALA</view>
+		<view class="loginText">请使用您的账号登录</view>
+		<view class="login-box">
+			<view class="username">账号</view>
+			<input class="input-box" type="number" v-model="phone" placeholder="请输入账号" />
 		</view>
-		<view class="loginTitle"><text>登录</text></view>
-		<view class="login_text">
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img03.png"></image></view>
-				<view class="login_name"><input class="uni-input" v-model="username" focus placeholder="请输入手机号" /></view>
-			</view>
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img04.png"></image></view>
-				<view class="login_name"><input class="uni-input" type="password" v-model="passward" focus placeholder="请输入密码" /></view>
-			</view>
-			<view><button type="green" class="uni-button uni-button-green" @click="toLogin">登录</button></view>
-			<view><button type="green" class="uni-button uni-button-green uni-button-green-plain" plain="true" hover-class="none" @click="register">注册</button></view>
-			<navigator url="./forget"><view class="forget">忘记密码</view></navigator>
-			<view class="flex other">
-				<view class="fenge"></view>
-				<view class="qita">其他方式登录</view>
-				<view class="fenge"></view>
-			</view>
-			<!-- #ifndef APP-PLUS -->
-					<view class="weixin" @click="wecahtLogin"><image src="/static/img/img05.png"></image></view>
-					<view class="weixin_text" @click="wecahtLogin">微信登录</view>
-					<!-- #endif -->
-					<!-- #ifdef APP-PLUS -->
-					<block v-if="!is_ios">
-						<view class="weixin" @click="wecahtLogin"><image src="/static/img/img05.png" mode="scaleToFill"></image></view>
-						<view class="weixin_text" @click="wecahtLogin">微信登录</view>
-					</block>
-					<block v-else>
-						<view class="ios_login flex" @click="wecahtLogin('weixin')">
-							<text class="iconfont iconweixin"></text>
-							<text class="weixin_text">微信登录</text>
-						</view>
-						<view v-if='is_apple_login' class="ios_login flex" @click="wecahtLogin('apple')">
-							<image class="loginIcon" src="/static/icon/appleIcon.png" mode=" scaleToFill"></image>
-							<text class="weixin_text">通过Apple登录</text>
-						</view>
-					</block>
-					<!-- #endif -->
-				</view>
-			</view>
+		<view class="login-box">
+			<view class="username">密码</view>
+			<input class="input-box" type="password" v-model="password" placeholder="请输入密码" />
+		</view>
+
+		<view class="forget flex">
+			
+			<text @click="navTo('/pages/public/forget')">忘记密码</text>
+		</view>
+		<view class="login" @click="toLogin">登录</view>
+		<view class="login-tip">
+			还没有账号？
+			<text class="register" @click="navTo('/pages/public/register')">立即注册</text>
+		</view>
+	</view>
 </template>
 
 <script>
 import { mapMutations } from 'vuex';
-import { login} from '@/api/login.js';
-import { getUserInfo} from '@/api/user.js';
-// #ifdef APP-PLUS
-// applelogin接口需要开发编写，基础项目中可能没有
-import { applelogin } from '@/api/set.js';
-// loginWx接口需要开发编写，基础项目中可能没有
-import { loginWx } from '@/api/login.js';
-// #endif
-// #ifdef H5
-import { loginWinxin } from '@/utils/wxAuthorized';
-// #endif
+import { login } from '@/api/login.js';
+import { getUserInfo } from '@/api/user.js';
 export default {
 	data() {
 		return {
-			username: '',
-			passward: '',
-			// #ifdef APP-PLUS
-			is_ios: false ,//判断是否为ios手机
-			is_apple_login:false,//是否有ios授权登录功能
-			// #endif
+			phone: '',
+			password: '',
 		};
 	},
-	onLoad() {
-		let obj = this;
-		// #ifdef APP-PLUS
-		let system = uni.getStorageSync('platform');
-		// 判断是否为ios
-		if (system == 'ios') {
-			obj.is_ios = true;
-		}
-		uni.getSystemInfo({
-			success(e) {
-				if(+e.system.split('.')[0]>=13){
-					obj.is_apple_login=true;
-				}
-			}
-		})
-		// #endif
-	},
+	onLoad() {},
+	
 	methods: {
 		...mapMutations('user', ['setUserInfo', 'login']),
-		// 微信登录
-		wecahtLogin(type) {
-			let obj = this;
-			// #ifdef H5
-			let weichatBrowser = uni.getStorageSync('weichatBrowser');
-			if (weichatBrowser) {
-				loginWinxin();
-			}
-			// #endif
-			// #ifdef APP-PLUS
-			uni.login({
-				provider: type,
-				success(e) {
-					uni.getUserInfo({
-						provider: type,
-						success(es) {
-							if(type==='weixin'){
-								loginWx(es.userInfo)
-									.then(e => {
-										uni.setStorageSync('token', e.data.token);
-										getUserInfo({}).then(e => {
-											obj.login();
-											// 保存返回用户数据
-											obj.setUserInfo(e.data);
-											//成功跳转首页
-											uni.switchTab({
-												url: '/pages/index/index'
-											});
-										});
-									})
-									.catch(e => {
-										console.log(e);
-										uni.showModal({
-											content: JSON.stringify(e),
-											success() {},
-											fail() {}
-										});
-									});
-							}
-							if(type==='apple'){
-								console.log(es.userInfo);
-								applelogin({
-									account: es.userInfo.openId,
-								})
-									.then(function(e) {
-										console.log(e,'token')
-										uni.setStorageSync('token', e.data.token);
-										getUserInfo({}).then(e => {
-											obj.login();
-											// 保存返回用户数据
-											obj.setUserInfo(e.data);
-											//成功跳转首页
-											uni.switchTab({
-												url: '/pages/index/index'
-											});
-										});
-										
-									})
-									.catch(function(e) {
-										console.log(e);
-									});
-							}
-							
-						},
-						fail(es) {
-							uni.showModal({
-								content: JSON.stringify(es),
-								success() {
-									// obj.login();
-									// // 保存返回用户数据
-									// obj.setUserInfo(e.data);
-									// //成功跳转首页
-									// uni.switchTab({
-									// 	url: '/pages/index/index'
-									// });
-								}
-							});
-						}
-					});
-				},
-				fail(e) {
-					uni.showModal({
-						title: '提示',
-						content: JSON.stringify(e),
-						showCancel: false
-					});
-				}
-			});
-			// #endif
-		},
 		//登录
 		async toLogin() {
+			uni.showLoading({
+				title:'正在登陆中'
+			});
 			let obj = this;
 			obj.logining = true;
-			if (obj.username == '') {
+			if (obj.phone == '') {
 				obj.$api.msg('请输入手机号');
 				return;
 			}
-			if (obj.passward == '') {
+			if (obj.password == '') {
 				obj.$api.msg('请输入密码');
 				return;
 			}
 			login({
-				account: obj.username,
-				password: obj.passward
+				account: obj.phone,
+				password: obj.password
 			})
 				.then(function(e) {
+					if (obj.rememberPsw) {
+						uni.setStorageSync('HCuname', obj.phone);
+						uni.setStorageSync('HCpassw', obj.password);
+					} else {
+						uni.removeStorageSync('HCuname');
+						uni.removeStorageSync('HCpassw');
+						obj.phone = '';
+						obj.password = '';
+					}
 					uni.setStorageSync('token', e.data.token);
-					obj.$store.commit('hasLogin', true);
 					getUserInfo({}).then(e => {
 						obj.login();
 						// 保存返回用户数据
 						obj.setUserInfo(e.data);
-						let ur = uni.getStorageSync('present')|| '/pages/index/index';
-						//成功跳转首页
+
 						uni.switchTab({
-							url: ur,
-							fail(e) {
-								uni.navigateTo({
-									url: ur,
-									fail(e) {
-										uni.navigateTo({
-											url: '/pages/index/index',
-										});
-									}
-								});
-							}
+							url: '/pages/index/index'
 						});
 					});
+					uni.hideLoading();
 				})
 				.catch(function(e) {
 					console.log(e);
 				});
 		},
-		//跳转注册页
-		register() {
+		navTo(url) {
 			uni.navigateTo({
-				url: `/pages/public/register`
+				url
 			});
 		},
 		// 后退
 		navBack() {
 			uni.navigateBack();
-		}
+		},
+		
 	}
 };
 </script>
 
 <style lang="scss">
-	/* #ifdef APP-PLUS */
-	
-	.ios_login {
-		width: 260rpx;
-		border-radius: 12rpx;
-		justify-content: center;
-		border: 1px solid #212121;
-		margin: 24rpx auto;
-		padding: 10rpx;
-		background-color: #212121;
-		color: #ffffff;
-		.loginIcon {
-			width: 50rpx;
-			height: 50rpx;
-		}
-		.weixin_text {
-			line-height: 1;
-			margin-left: 20rpx;
-			color: #ffffff !important;
-		}
-	}
-	
-	/* #endif */
-	.ios_login {
-		width: 350rpx;
-		border-radius: 12rpx;
-		justify-content: center;
-		border: 1px solid #212121;
-		margin: 24rpx auto;
-		padding: 15rpx;
-		background-color: #212121;
-		color: #ffffff;
-		font-size: 32rpx;
-		.loginIcon {
-			font-size: 35rpx;
-			width: 35rpx;
-			height: 35rpx;
-		}
-		.weixin_text {
-			line-height: 1;
-			margin-left: 20rpx;
-			color: #ffffff !important;
-		}
-	}
-	
 page {
-	height: 100%;
-}
-.container {
-	width: 100%;
-	height: 100%;
-	background-size: 100%;
-}
-.container_text {
-	width: 100%;
-	height: 500rpx;
-	top: 0rpx;
-	.banner-img {
-		width: 100%;
-		height: 100%;
-	}
-}
-.login_text {
-	margin: auto 30rpx;
-	position: relative;
-	padding: 100rpx 102rpx;
+	min-height: 100%;
 	background-color: #ffffff;
-	margin-top: -180rpx;
-	border-radius: 20rpx;
-	.login_input {
-		border-bottom: 1px solid #f0f0f0;
-		margin-bottom: 65rpx;
-		.login_img image {
-			height: 35rpx;
-			width: 29rpx;
-			margin-right: 20rpx;
-		}
-		.uni-input {
-			text-align: left;
-			width: 470rpx;
-			font-size: 28rpx !important;
-		}
-		.login_name {
-			color: #333333;
-		}
-	}
-
-	.other {
-		margin-top: 60rpx;
-		.fenge {
-			width: 30%;
-			height: 2rpx;
-			background-color: #eeeeee;
-		}
-		.qita {
-			font-size: 28rpx;
-			color: #999999;
-		}
-	}
-	.weixin {
-		width: 75rpx;
-		height: 75rpx;
-		margin: 25rpx auto;
-	}
-	.weixin image {
-		width: 100%;
-		height: 100%;
-	}
-	.weixin_text {
-		text-align: center;
-		font-size: 28rpx;
-		color: #999999;
-	}
-	.forget {
-		font-size: 28rpx;
+	.container {
 		width: 100%;
-		text-align: right;
-		color: #999999;
-	}
-
-	.uni-button-green {
-		color: #ffffff;
-		background-color: #5dbc7c;
-		margin: 40rpx 10rpx;
-		border-radius: 50rpx;
+		padding: 30% 60rpx;
 	}
-	.uni-button-green-plain {
-		border: 1px solid #5dbc7c;
-		margin: 40rpx 10rpx;
-		border-radius: 50rpx;
-		color: #5dbc7c;
-		background-color: #ffffff;
+}
+.loginTitle {
+	font-weight: bold;
+	color: #333333;
+	font-size: 58rpx;
+	padding-bottom: 34rpx;
+}
+.loginText {
+	font-weight: 500;
+	color: #333333;
+	font-size: 34rpx;
+	padding-bottom: 34rpx;
+}
+.login-box {
+	padding-top: 90rpx;
+	.username {
+		padding-bottom: 30rpx;
+		font-weight: 500;
+		color: #333333;
+		font-size: 32rpx;
 	}
-	.uni-button {
-		height: 85rpx;
-		line-height: 85rpx;
+}
+.forget {
+	justify-content: flex-end;
+	text-align: right;
+	margin: 70rpx 0rpx;
+	font-weight: 500;
+	color: #333333;
+	font-size: 28rpx;
+	.mui-checkbox{
+		font-weight: 500;
+		color: #333333;
+		font-size: 35rpx;
 	}
 }
-.loginTitle {
-	position: absolute;
-	top: 250rpx;
-	width: 100%;
+.login {
+	background: linear-gradient(90deg, #60BAB0, #60BAB0, #45969B);
+	margin-top: 20rpx;
+	color: #ffffff;
 	text-align: center;
-	color: white;
-	font-size: 40rpx;
+	padding: 26rpx 0rpx;
+	border-radius: 50rpx;
 }
+.login-tip {
+	padding: 60rpx 0rpx;
+	text-align: center;
+	font-weight: 500;
+	color: #333333;
+	font-size: 28rpx;
+	.register {
+		color: #5771df;
+	}
+}
+// /* input 样式 */
+// .input-placeholder {
+// 	color: #ffffff;
+// }
+
+// .placeholder {
+// 	color: #ffffff;
+// }
 </style>

pages/public/register.vue

@@ -1,281 +1,204 @@
 <template>
 	<view class="container">
-		<view class="container_text" >
-			<image class="banner-img" src="/static/img/img01.png" mode="scaleToFill"></image>
+		<view class="loginTitle">欢迎注册LALA</view>
+		<view class="loginText">请认真填写个人信息</view>
+		<view class="login-box">
+			<view class="username">账号</view>
+			<input class="input-box" type="number" v-model="phone" placeholder="请输入手机号" />
 		</view>
-		<view class="loginTitle"><text>注册</text></view>
-		<view class="login_text">
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img03.png"></image></view>
-				<view class="login_name"><input class="uni-input" v-model="phone" focus placeholder="请输入手机号" /></view>
+		<view class="login-box">
+			<view class="username">验证码</view>
+			<view class="flex">
+				<input class="input-box" type="number" v-model="code" placeholder="请输入验证码" />
+				<view class="code" @click="verification">{{ countDown == 0 ? '获取验证码' : countDown }}</view>
 			</view>
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img04.png"></image></view>
-				<view class="login_name"><input class="uni-input" type="password" v-model="password" focus placeholder="请输入密码" /></view>
-			</view>
-			<view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img04.png"></image></view>
-				<view class="login_name"><input class="uni-input" type="password" v-model="repassword" focus placeholder="请重复输入密码" /></view>
-			</view>
-			<view class="login_input flex" style="display: none;">
-				<view class="login_img"><image src="/static/icon/img07.png"></image></view>
-				<view class="login_name"><input class="uni-input" type="text" v-model="invitation" focus placeholder="请输入邀请码" /></view>
-			</view>
-			<!-- <view class="login_input flex">
-				<view class="login_img"><image src="/static/icon/img06.png"></image></view>
-				<view class="login_name flex">
-					<input class="uni-input width" v-model="code" focus placeholder="请输入验证码" />
-					<view class="code" @click="verification">{{ countDown == 0 ? '验证码' : countDown }}</view>
-				</view>
-			</view> -->
-			<view><button type="green" @click="register" class="uni-button uni-button-green">注册账号</button></view>
-			<view><button class="uni-button uni-button-green uni-button-green-plain" type="green" plain="true" hover-class="none" @click="login">返回登录</button></view>
 		</view>
+		<view class="login-box">
+			<view class="username">登录密码</view>
+			<input class="input-box" type="password" v-model="loginPass"  placeholder="请输入登录密码" />
+		</view>
+		<view class="login-box">
+			<view class="username">支付密码</view>
+			<input class="input-box" type="password" v-model="payPass" placeholder="请输入支付密码" />
+		</view>
+		<view class="login-box">
+			<view class="username">邀请码</view>
+			<input class="input-box" type="password" v-model="invitation"  placeholder="请输入邀请码" />
+		</view>
+		<view class="login" @click="register">注册</view>
 	</view>
 </template>
+
 <script>
-import { register, verify } from '@/api/login.js';
-export default {
-	data() {
-		return {
-			phone: '', //用户
-			password: '', //密码
-			repassword: '',
-			invitation: '', //邀请码
-			code: '', //验证码
-			time: '', //保存倒计时对象
-			countDown: 0 ,//倒计时
-		};
-	},
-	onLoad() {
-		// 获取扫码邀请人id
-		this.invitation = uni.getStorageSync('spread')||'';
-	},
-	watch: {
-		// 监听倒计时
-		countDown(i) {
-			if (i == 0) {
-				clearInterval(this.time);
-			}
-		}
-	},
-	methods: {
-		// 注册
-		register() {
-			let obj = this;
-			if (obj.phone == '') {
-				obj.$api.msg('请输入电话号码');
-				return;
-			}
-			if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(this.phone)) {
-				obj.$api.msg('请输入正确的手机号');
-				return;
-			}
-			if (obj.password == '') {
-				obj.$api.msg('请输入密码');
-				return;
-			}
-			if (obj.repassword == '') {
-				obj.$api.msg('请再次输入密码');
-				return;
-			}
-			if (obj.repassword != obj.password) {
-				obj.$api.msg('两次密码不正确');
-				return;
-			}
-			// if ((obj.invitation = '')) {
-			// 	obj.$api.msg('请输入邀请码');
-			// 	return;
-			// }
-			// if (obj.code == '') {
-			// 	obj.$api.msg('请输入验证码');
-			// 	return;
-			// }
-			register({
-				account: obj.phone, //账号
-				// captcha: obj.code, //验证码
-				password: obj.password ,//密码
-				spread:this.invitation//上级推广人
-			}).then(function(e) {
-				uni.showToast({
-					title:'注册成功',
-					duration:2000,
-					position:'top'
-				});
-				setTimeout(function () {
-					uni.navigateTo({
-						url: '/pages/public/login'
-					});
-				},1000)
-				
-			});
-			//调用注册接口，成功跳转登录页
+	import { register, verify } from '@/api/login.js';
+	export default {
+		data() {
+			return {
+				phone: '', //用户
+				loginPass: '', //密码
+				payPass: '',
+				invitation: '', //邀请码
+				code: '', //验证码
+				time: '', //保存倒计时对象
+				countDown: 0, //倒计时
+			};
 		},
-		//发送验证码
-		verification() {
-			let obj = this;
-			if (this.phone == '') {
-				this.$api.msg('请输入电话号码');
-				return;
-			}
-			if (this.phone.length < 11) {
-				this.$api.msg('请输入正确的手机号');
-				return;
-			}
-			// 判断是否在倒计时
-			if (obj.countDown > 0) {
-				return false;
-			} else {
-				obj.countDown = 60;
-				obj.time = setInterval(() => {
-					obj.countDown--;
-				}, 1000);
-				//调用验证码接口
-				verify({
-					phone: obj.phone,
-					type: 'register'
-				})
-					.then(({ data }) => {})
-					.catch(err => {
-						console.log(err);
-					});
+		onLoad() {
+			// 获取扫码邀请人id
+			this.invitation = uni.getStorageSync('spread') || '';
+		},
+		watch: {
+			// 监听倒计时
+			countDown(i) {
+				if (i == 0) {
+					clearInterval(this.time);
+				}
 			}
 		},
-		login() {
-			//返回登录
-			uni.navigateTo({
-				url: '/pages/public/login'
-			});
+		methods: {
+			// 注册
+			register() {
+				let obj = this;
+				if (obj.phone == '') {
+					obj.$api.msg('请输入电话号码');
+					return;
+				}
+				if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(obj.phone)) {
+					obj.$api.msg('请输入正确的手机号');
+					return;
+				}
+				if (obj.loginPass == '') {
+					obj.$api.msg('请输入登录密码');
+					return;
+				}
+				if (obj.payPass == '') {
+					obj.$api.msg('请输入支付密码');
+					return;
+				}
+				if (obj.code == '') {
+					obj.$api.msg('请输入验证码');
+					return;
+				}
+				if (obj.invitation == '') {
+					obj.$api.msg('请输入邀请码');
+					return;
+				}
+				register({
+					phone: obj.phone, //账号
+					captcha: obj.code, //验证码
+					password:obj.loginPass,
+					trade_password:obj.payPass,
+					invite_code:obj.invitation
+				}).then(function(e) {
+					uni.showToast({
+						title: '注册成功',
+						duration: 2000,
+						position: 'top',
+						icon: 'none'
+					});
+					setTimeout(function() {
+						uni.navigateTo({
+							url: '/pages/public/login'
+						});
+					}, 1000)
+
+				});
+				//调用注册接口，成功跳转登录页
+			},
+			//发送验证码
+			verification() {
+				let obj = this;
+				if (this.phone == '') {
+					this.$api.msg('请输入电话号码');
+					return;
+				}
+				if (this.phone.length < 11) {
+					this.$api.msg('请输入正确的手机号');
+					return;
+				}
+				// 判断是否在倒计时
+				if (obj.countDown > 0) {
+					return false;
+				} else {
+					obj.countDown = 60;
+					obj.time = setInterval(() => {
+						obj.countDown--;
+					}, 1000);
+					//调用验证码接口
+					verify({
+							phone: obj.phone,
+							type: 'register'
+						})
+						.then(({
+							data
+						}) => {})
+						.catch(err => {
+							console.log(err);
+						});
+				}
+			},
 		}
-	}
-};
+	};
 </script>
 
 <style lang="scss">
-page {
-	height: 100%;
-}
-.container {
-	width: 100%;
-	height: 100%;
-	background-size: 100%;
-}
-.container_text {
-	width: 100%;
-	height: 500rpx;
-	top: 0rpx;
-	.banner-img {
-		width: 100%;
-		height: 100%;
-	}
-}
-.login_text {
-	margin: auto 30rpx;
-	position: relative;
-	padding: 100rpx 102rpx;
-	background-color: #ffffff;
-	margin-top: -180rpx;
-	border-radius: 20rpx;
-	.login_input {
-		border-bottom: 1px solid #f0f0f0;
-		margin-bottom: 65rpx;
-		.login_img image {
-			height: 35rpx;
-			width: 29rpx;
-			margin-right: 20rpx;
-		}
-		.uni-input {
-			text-align: left;
-			width: 470rpx;
-			font-size: 28rpx !important;
-		}
-		.login_name {
-			color: #333333;
-		}
-	}
+	page {
+		min-height: 100%;
+		background-color: #ffffff;
 
-	.other {
-		margin-top: 60rpx;
-		.fenge {
-			width: 30%;
-			height: 2rpx;
-			background-color: #eeeeee;
-		}
-		.qita {
-			font-size: 28rpx;
-			color: #999999;
+		.container {
+			width: 100%;
+			padding: 10% 60rpx 0rpx 60rpx;
 		}
 	}
-	.weixin {
-		width: 75rpx;
-		height: 75rpx;
-		margin: 25rpx auto;
-	}
-	.weixin image {
-		width: 100%;
-		height: 100%;
-	}
-	.weixin_text {
-		text-align: center;
-		font-size: 28rpx;
-		color: #999999;
+
+	.loginTitle {
+		font-weight: bold;
+		color: #333333;
+		font-size: 58rpx;
+		padding-bottom: 25rpx;
 	}
-	.forget {
-		font-size: 28rpx;
-		width: 100%;
-		text-align: right;
-		color: #999999;
+
+	.loginText {
+		font-weight: 500;
+		color: #333333;
+		font-size: 34rpx;
 	}
 
-	.uni-button-green {
-		color: #ffffff;
-		background-color: #5dbc7c;
-		margin: 40rpx 10rpx;
-		border-radius: 50rpx;
+	.login-box {
+		padding-top: 70rpx;
+		.username {
+			padding-bottom: 25rpx;
+			font-weight: 500;
+			color: #333333;
+			font-size: 32rpx;
+		}
 	}
-	.uni-button-green-plain {
-		border: 1px solid #5dbc7c;
-		margin: 40rpx 10rpx;
+
+	.login {
+		background: linear-gradient(90deg, #60BAB0, #60BAB0, #45969B);
+		margin-top: 20rpx;
+		color: #FFFFFF;
+		text-align: center;
+		padding: 26rpx 0rpx;
 		border-radius: 50rpx;
-		color: #5dbc7c;
-		background-color: #ffffff;
+		margin-top: 60rpx;
 	}
-	.uni-button {
-		height: 85rpx;
-		line-height: 85rpx;
+    .code{
+		background: linear-gradient(90deg, #60BAB0, #60BAB0, #45969B);
+		color: #FFFFFF;
+		border-radius: 10rpx;
+		font-weight: 500;
+		color: #FFFFFF;
+		font-size: 26rpx;
+		padding: 12rpx 19rpx;
 	}
-}
-.loginTitle {
-	position: absolute;
-	top: 250rpx;
-	width: 100%;
-	text-align: center;
-	color: white;
-	font-size: 40rpx;
-}
-
-.forget {
-	width: 100rpx;
-	font-size: 24rpx;
-	color: #ffffff;
-	margin: 0px auto;
-	border-bottom: 1px solid #ffffff;
-}
-.width {
-	width: 325rpx !important;
-}
-.code {
-	color: #5dbc7c;
-	font-size: 23rpx;
-	border-left: 1px solid #eeeeee;
-	width: 150rpx;
-	flex-shrink: 0;
-	text-align: center;
-}
-uni-button {
-	height: 80rpx !important;
-	line-height: 80rpx !important;
-}
+	// /* input 样式 */
+	// .input-placeholder {
+	// 	color: #ffffff;
+	// }
 
+	// .placeholder {
+	// 	color: #ffffff;
+	// }
 </style>
-

pages/set/userinfo.vue

@@ -1,35 +1,56 @@
 <template>
 	<view class="content">
-		<view class="row b-b">
+		<view class="row1">
+			<text class="tit">头像</text>
+			<view class="background-img" @click.stop="imgsub"><image class="background-img" v-model="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill"></image></view>
+		</view>
+		<view class="row">
 			<text class="tit">昵称</text>
-			<input class="input" type="text" v-model="name" placeholder="修改昵称" placeholder-class="placeholder" />
+			<input class="input" type="text" v-model="userInfo.nickname" placeholder-class="placeholder" />
+		</view>
+		<view class="row">
+			<text class="tit">ID</text>
+			<input class="input" type="text"  disabled="true" v-model="student" placeholder-class="placeholder" />
+		</view>
+		<view class="row">
+			<text class="tit">账户</text>
+			<input class="input" type="text"  disabled="true" v-model="userInfo.phone" placeholder-class="placeholder" />
 		</view>
-		<button class="add-btn" @click="confirm">提交</button>
+		<view class="add-btn" @click="confirm">提交</view>
+		<view class="out" @click="toLogout">退出登录</view>
 	</view>
 </template>
 
 <script>
-import { mapState } from 'vuex';
-import { userEdit } from '@/api/set.js';
-export default {
-	data() {
-		return {
-			name: ''
-		};
-	},
+import { mapState,mapMutations } from 'vuex';
+import { uploads } from '@/api/user.js';
+import {userEdit,logout} from '@/api/set.js';
 
-	computed: {
-		...mapState('user', ['userInfo'])
+export default{
+	data(){
+		return{
+			student:''
+		}
 	},
-	onShow(option) {
-		this.name = this.userInfo.nickname + '';
+	onLoad() {
+		console.log(this.userInfo)
+	},
+	computed: {
+		...mapState('user',['userInfo'])
 	},
 	methods: {
-		switchChange(e) {
-			this.addressData.default = e.value;
+		...mapMutations('user',['logout']),
+		imgsub() {
+			console.log('上传头像')
+			uploads({
+				filename: ''
+			}).then(data => {
+				console.log("data",data);
+				this.userInfo.avatar = data[0].url;
+			})
 		},
 		confirm() {
-			userEdit({ nickname: this.name, avatar: this.userInfo.avatar })
+			userEdit({ avatar: this.userInfo.avatar })
 				.then(e => {
 					this.$api.msg('修改成功');
 					setTimeout(()=> {
@@ -42,52 +63,92 @@ export default {
 				.catch(e => {
 					console.log(e);
 				});
-		}
+		},
+		toLogout(){
+			let obj = this;
+			uni.showModal({
+			    content: '确定要退出登录么',
+			    success: (e)=>{
+			    	if(e.confirm){
+						logout({}).then((e) => {
+							uni.navigateBack();
+						}).catch((e) => {
+							console.log(e);
+						})
+			    		obj.logout();
+			    	}
+			    }
+			});
+		},
 	}
-};
+}
 </script>
 
 <style lang="scss">
-page {
-	background: $page-color-base;
-	padding-top: 16upx;
-}
-
-.row {
-	display: flex;
-	align-items: center;
-	position: relative;
-	padding: 0 30upx;
-	height: 110upx;
-	background: #fff;
-
-	.tit {
-		flex-shrink: 0;
-		width: 120upx;
-		font-size: 30upx;
-		color: $font-color-dark;
+	.row1 {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		position: relative;
+		padding: 0 30upx;
+		height: 110upx;
+		background: #fff;
+		margin-bottom: 20upx;
+		.tit {
+			flex-shrink: 0;
+			width: 120upx;
+			font-size: $font-lg;
+			color: $font-color-dark;
+		}
+		
+		.background-img {
+			width: 80rpx;
+			height: 80rpx;
+			border-radius: 50%;
+			background: #f2f2f2;
+		}
 	}
-	.input {
-		flex: 1;
-		font-size: 30upx;
-		color: $font-color-dark;
+	.row {
+		display: flex;
+		align-items: center;
+		padding: 0 30upx;
+		height: 110upx;
+		background: #fff;
+	
+		.tit {
+			flex-shrink: 0;
+			width: 120upx;
+			font-size: $font-lg;
+			color: $font-color-dark;
+		}
+		.input {
+			flex: 1;
+			text-align: right;
+			font-size: $font-base;
+			color: $color-gray;
+		}
 	}
-	.iconlocation {
-		font-size: 36upx;
-		color: $font-color-light;
+	.add-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin: 158rpx auto 30rpx;
+		width: 560rpx;
+		height: 80rpx;
+		background: linear-gradient(90deg, #58BAB0, #60BAB0, #45969B);
+		border-radius: 40px;
+		color: #FFFFFF;
+	}
+	.out {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin: 0 auto 30rpx;
+		width: 560rpx;
+		height: 80rpx;
+		border: 1px solid #58BAB0;
+		background: #FFFFFF;
+		border-radius: 40px;
+		color: #58BAB0;
 	}
-}
-.add-btn {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 690upx;
-	height: 80upx;
-	margin: 60upx auto;
-	font-size: $font-lg;
-	color: #fff;
-	background-color: $base-color;
-	border-radius: 10upx;
-	// box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
-}
 </style>

pages/user/extension.vue

@@ -0,0 +1,315 @@
+<template>
+	<view class="content">
+		<view class="content-money">
+			<view class="money-box">
+				<view class="goback-box" @click="toBack">
+					<image class="goback" src="../../static/img/fanhui.png" mode=""></image>
+				</view>
+				<view class="header">我的推广</view>
+				<image class="tuiguang_bg" src="../../static/img/share-bg.png"></image>
+				<!--  <view class="money_img"><image :src="list.avatar || img"></image></view> -->
+				<view class="money-frame">
+					<!-- <view class="money_name">我的推广</view> -->
+					<view class="money_num">
+						{{ all || '0' }}
+						<text class="money_ren">人</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
+			<!-- 空白页 -->
+			<empty v-if="orderList.length === 0"></empty>
+
+			<!-- 订单列表 -->
+			<view v-for="(item, index) in orderList" :key="index" class="order-item flex">
+				<view class="title-box flex_item">
+					<view class="title-avatar"><image :src="item.avatar"></image></view>
+					<view class="list_tpl">
+						<view class="title">
+							<text>{{ item.nickname }}</text>
+						</view>
+						<view class="time">
+							<text>{{ item.time }}</text>
+						</view>
+					</view>
+				</view>
+			</view>
+			<uni-load-more :status="loadingType"></uni-load-more>
+		</scroll-view>
+	</view>
+</template>
+<script>
+import { mapState, mapMutations } from 'vuex';
+import uniLoadMore from '@/uview-ui/components/u-loading-page/u-loading-page.vue';
+import empty from '@/uview-ui/components/u-empty/u-empty.vue';
+export default {
+	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) * 470) - 44;
+					// console.log(this.maxheight);
+				}
+			)
+			.exec();
+	},
+	data() {
+		return {
+			// 头部图高度
+			maxheight: '',
+			orderList: [
+				{
+					nickname:'lan',
+					time:'2021-9-9'
+				}
+			],
+			all: '',
+			loadingType:'',
+			page: 1,
+			limit: 10,
+		};
+	},
+	onLoad(options) {},
+	onShow() {
+		
+	},
+	methods: {
+		// 页面跳转
+		navto(e) {
+			uni.navigateTo({
+				url: e
+			});
+		},
+		// 点击返回 我的页面
+		toBack() {
+			uni.switchTab({
+				url: '/pages/user/user'
+			});
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+page {
+	background: #ffffff;
+	height: 100%;
+}
+.content-money {
+	padding-bottom: 30rpx;
+	background: $page-color-base;
+	.buttom-box {
+		position: relative;
+		background-color: #ffffff;
+		text-align: center;
+		margin: 0 30rpx;
+		padding: 30rpx 0;
+		border-radius: $border-radius-sm;
+		margin-top: -80rpx;
+		.buttom {
+			font-size: $font-lg;
+			flex-grow: 1;
+			.money {
+				font-weight: bold;
+				font-size: 32rpx;
+				color: #ff0000;
+			}
+		}
+		.text {
+			color: #666666;
+		}
+		.interval {
+			width: 2rpx;
+			height: 60rpx;
+			background-color: #eeeeee;
+		}
+		.icon {
+			height: 50rpx;
+			width: 48rpx;
+			margin: 0 auto;
+			.icon-img {
+				width: 100%;
+				height: 100%;
+			}
+		}
+	}
+}
+.money-box {
+	// background: $base-color;
+	height: 424rpx;
+	color: #ffffff;
+	text-align: center;
+	font-size: 35rpx;
+	position: relative;
+	// padding-top: 60rpx;
+	.header {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100%;
+		height: 80rpx;
+		font-size: 32rpx;
+		font-weight: 700;
+		z-index: 99;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+	.goback-box {
+		position: absolute;
+		left: 18rpx;
+		top: 0;
+		height: 80rpx;
+		display: flex;
+		align-items: center;
+	}
+	.goback {
+		z-index: 100;
+		width: 34rpx;
+		height: 34rpx;
+	}
+	.tuiguang_bg {
+		width: 100%;
+		height: 424rpx;
+		position: relative;
+	}
+	.money_img {
+		width: 100%;
+		height: 120rpx;
+		text-align: center;
+		padding-top: 50rpx;
+		padding-bottom: 135rpx;
+		image {
+			width: 120rpx;
+			height: 120rpx;
+			border: 4rpx solid #fd5f6f;
+			border-radius: 50%;
+		}
+	}
+	.money-frame {
+		position: absolute;
+		top: 0;
+		width: 100%;
+		padding-top: 120rpx;
+		// left: 30rpx;
+		// height: 460rpx;
+		// display: flex;
+		// align-items: flex-start;
+		// flex-direction: column;
+		// justify-content: center;
+	}
+	.money_name {
+		width: 100%;
+		text-align: center;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+	}
+	.money_num {
+		font-size: 72rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+		.money_ren {
+			font-size: 36rpx;
+		}
+	}
+}
+
+.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: $font-color-dark;
+		position: relative;
+		&.current {
+			color: #ff0000;
+			&:after {
+				content: '';
+				position: absolute;
+				left: 50%;
+				bottom: 0;
+				transform: translateX(-50%);
+				width: 44px;
+				height: 0;
+				border-bottom: 2px solid #ff0000;
+			}
+		}
+	}
+}
+// 列表
+
+
+	.order-item {
+		padding: 20rpx 30rpx;
+		line-height: 1.5;
+		.title-box {
+			width: 100%;
+			.title-avatar {
+				width: 100rpx;
+				height: 100rpx;
+				margin-right: 25rpx;
+				background: #03A9F4;
+				border-radius: 100%;
+				image {
+					width: 100%;
+					height: 100%;
+					border-radius: 100%;
+				}
+			}
+			.list_tpl {
+				width: 85%;
+				.title {
+					font-size: $font-lg;
+					color: $font-color-base;
+					overflow: hidden; //超出的文本隐藏
+					text-overflow: ellipsis; //溢出用省略号显示
+					white-space: nowrap;
+				}
+				.time {
+					font-size: $font-base;
+					color: $font-color-light;
+				}
+			}
+		}
+		.money {
+			color: #db1935;
+			font-size: $font-lg;
+		}
+	}
+
+.list-scroll-content {
+	height: 100%;
+}
+.content {
+	height: 100%;
+	.empty-content {
+		background-color: #ffffff;
+	}
+}
+</style>

pages/user/user.vue

@@ -1,43 +1,99 @@
 <template>
 	<view class="container">
 		<view class="top">
-			<view class="bg">
-				<image class="imgBg" src="../../static/img/user-bg.png" mode=""></image>
-			</view> 
+			<view class="bg"><image class="imgBg" src="../../static/img/user-bg.png" mode=""></image></view>
+			<view class="user">
+				<view class="avtor"><image class="portrait" :src="userInfo.avatar || '/static/img/missing-face.png'"></image></view>
+				<view class="name">{{ userInfo.nickname || '游客' }}</view>
+			</view>
 		</view>
-		<uni-list>
-			<uni-list-item title="我的钱包" @click="navTo('/pages/money/wallet')" thumb="/static/icon/img11.png"></uni-list-item>
-			<uni-list-item title="我的卡卷" @click="navTo('/pages/user/coupon')" thumb="/static/icon/img12.png"></uni-list-item>
-			<uni-list-item title="我的收藏" @click="navTo('/pages/user/favorites')" thumb="/static/icon/img02.png"></uni-list-item>
-			<uni-list-item title="商户入驻" @click="navTo('/pages/set/address')" thumb="/static/icon/img05.png"></uni-list-item>
-			<uni-list-item title="邀请好友" @click="navTo('/pages/user/shareQrCode')" thumb="/static/icon/img10.png"></uni-list-item>
-			<uni-list-item title="关于我们" @click="navTo('/pages/shareQrCode/index')" thumb="/static/icon/img09.png"></uni-list-item>
-		</uni-list>
+		<view class="main">
+			<view class="title">我的工具</view>
+			<view class="tt">
+				<view class="tt-box" @click="nav('/pages/assets/myPing')">
+					<image src="../../static/img/pinggou.png" class="tt-icon1" mode=""></image>
+					<view class="tt-txt">我的拼购</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="nav('/pages/user/extension')">
+					<image src="../../static/img/myTeam.png" class="tt-icon2" mode=""></image>
+					<view class="tt-txt">我的团队</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="nav('/pages/user/shareQrCode')">
+					<image src="../../static/img/share.png" class="tt-icon3" mode=""></image>
+					<view class="tt-txt">团队邀请</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="nav('/pages/money/payment')">
+					<image src="../../static/img/zfpwd.png" class="tt-icon4" mode=""></image>
+					<view class="tt-txt">支付密码</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="nav('/pages/public/forget')">
+					<image src="../../static/img/pwd.png" class="tt-icon1" mode=""></image>
+					<view class="tt-txt">登录密码</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="server()">
+					<image src="../../static/img/kefu.png" class="tt-icon1" mode=""></image>
+					<view class="tt-txt">联系客服</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+				<view class="tt-box" @click="nav('/pages/set/userinfo')">
+					<image src="../../static/img/set.png" class="tt-icon5" mode=""></image>
+					<view class="tt-txt">设置</view>
+					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
+				</view>
+			</view>
+		</view>
+		<!-- 申请退款弹窗 -->
+		<uni-popup ref="popup" type="center">
+			<view class="popup">
+				<view class="popup-dox">
+					<image class="popup-logo" src="../../static/img/lianxi.png"></image>
+					<view class="pop-title">已为您定制专属客服</view>
+					<image class="popup-text" src=""></image>
+					<view class="pop-tip flex"><view class="weixin"><image src="../../static/img/weixin.png" mode=""></image></view><view>长按识别咨询客服</view></view>
+				</view>
+			</view>
+			<view class="close_icon" @click="close"><image src="../../static/img/Close.png"></image></view>
+		</uni-popup>
 	</view>
 </template>
 <script>
 import { mapState, mapMutations } from 'vuex';
 import uniList from '@/components/uni-list/uni-list.vue';
 import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
-import { orderData, userinfo } from '@/api/user.js';
+import { orderData, getUserInfo } from '@/api/user.js';
 import { saveUrl, interceptor } from '@/utils/loginUtils.js';
-let startY = 0,
-	moveY = 0,
-	pageAtTop = true;
+import uniPopup from '@/components/uni-popup/uni-popup.vue';
 export default {
 	components: {
 		uniList,
-		uniListItem
+		uniListItem,
+		uniPopup
 	},
 	data() {
-		return {
-			
-		};
+		return {};
 	},
 	onShow() {
-		// 判断是否已经登录
+		//判断是否已经登录
 		if (this.hasLogin) {
 			this.loadBaseData();
+		}else{
+			uni.showModal({
+				title: '登录',
+				content: '您未登录，是否马上登陆?',
+				success: e => {
+					if (e.confirm) {
+						interceptor();
+					}
+				},
+				fail: e => {
+					console.log(e);
+				}
+			});
 		}
 	},
 	computed: {
@@ -45,20 +101,221 @@ export default {
 	},
 	methods: {
 		...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
-		
+		loadBaseData() {
+			getUserInfo({}).then(({
+				data
+			}) => {
+				this.setUserInfo(data);
+			});
+		},
+		server(){
+			this.$refs.popup.open();
+		},
+		close(){
+			this.$refs.popup.close();
+		},
+		nav(url) {
+			// 判断是否已经登录
+			// if (this.hasLogin) {
+				console.log(url)
+				uni.navigateTo({
+					url: url,
+					fail() {
+						uni.switchTab({
+							url:url
+						})
+					}
+				})
+			// }else {
+			// 	uni.showModal({
+			// 		title: '登录',
+			// 		content: '您未登录，是否马上登陆?',
+			// 		success: e => {
+			// 			if (e.confirm) {
+			// 				interceptor();
+			// 			}
+			// 		},
+			// 		fail: e => {
+			// 			console.log(e);
+			// 		}
+			// 	});
+			// }
+
+		}
 	}
 };
 </script>
 <style lang="scss">
 page {
 	height: 100%;
+	background: #ffffff;
 }
 .container {
 	height: 100%;
-	background-color: $page-color-base;
+	background: #ffffff;
 }
 .top {
 	width: 100%;
-	height: 319px;
+	height: 320rpx;
+	position: relative;
+	.bg {
+		position: absolute;
+		width: 100%;
+		height: 320rpx;
+		left: 0;
+		top: 0;
+		right: 0;
+		image {
+			width: 100%;
+			height: 100%;
+		}
+	}
+	.user {
+		position: relative;
+		padding-top: 98rpx;
+		padding-left: 34rpx;
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		z-index: 10;
+		.avtor {
+			width: 102rpx;
+			height: 102rpx;
+			border-radius: 50%;
+			.portrait {
+				width: 100%;
+				height: 100%;
+				border-radius: 50%;
+			}
+		}
+		.name {
+			margin-left: 30rpx;
+			font-size: 36rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #ffffff;
+		}
+	}
+}
+.main {
+	position: relative;
+	z-index: 11;
+	width: 100%;
+	height: 100%;
+	background: #ffffff;
+	margin-top: -70rpx;
+	border-top-left-radius: 60rpx;
+	border-top-right-radius: 60rpx;
+	.title {
+		padding-top: 65rpx;
+		padding-left: 36rpx;
+		font-size: 36rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #333333;
+	}
+	.tt {
+		margin: 0 auto;
+		width: 750rpx;
+		padding: 40rpx 70rpx;
+		border-radius: 10rpx;
+		background-color: #ffffff;
+
+		.tt-box {
+			height: 100rpx;
+			display: flex;
+			align-items: center;
+			border-bottom: 1px solid #f0f0f0;
+			.tt-icon1 {
+				width: 42rpx;
+				height: 42rpx;
+			}
+			.tt-icon2 {
+				width: 49rpx;
+				height: 38rpx;
+			}
+			.tt-icon3 {
+				width: 46rpx;
+				height: 40rpx;
+			}
+			.tt-icon4 {
+				width: 40rpx;
+				height: 42rpx;
+			}
+			.tt-icon5 {
+				width: 44rpx;
+				height: 40rpx;
+			}
+
+			.tt-txt {
+				margin-left: 36rpx;
+				font-size: 32rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
+				flex: 1;
+			}
+
+			.next-icon {
+				width: 16rpx;
+				height: 25rpx;
+			}
+		}
+
+		.border-b {
+			border-bottom: 1px solid #f1f1f1;
+		}
+	}
+}
+.popup {
+	width: 640rpx;
+	background-color: #FFFFFF;
+	border-radius: 15rpx;
+	text-align: center;
+	.popup-dox{
+		position: relative;
+		top: -60rpx;
+		.popup-logo {
+			width: 460rpx;
+			height: 132rpx;
+		}
+		.pop-title{
+			font-size: 40rpx;
+			font-weight: bold;
+			color: #333333;
+			padding: 25rpx 0rpx;
+			margin-bottom: 50rpx;
+		}
+		.popup-text{
+			width: 400rpx;
+			height: 400rpx;
+			margin-bottom: 50rpx;
+		}
+		.pop-tip{
+			font-size: 30rpx;
+			font-weight: 500;
+			color: #333333;
+			justify-content: center;
+			
+			.weixin {
+				width: 48rpx;
+				height: 40rpx;
+				margin-right: 14rpx;
+				image{
+					width: 48rpx;
+					height: 40rpx;
+				}
+			}
+		}
+	}
+}
+.close_icon {
+	width: 60rpx;
+	height: 60rpx;
+	margin: 88rpx auto 0;
+	image {
+		width: 100%;
+		height: 100%;
+	}
 }
 </style>