用户体优化V1.0.0

common/css/iconfont.scss

@@ -4,7 +4,7 @@
 	font-family: iconfont;
 	font-weight: normal;
 	font-style: normal;
-	src: url('https://at.alicdn.com/t/font_1519039_l1haqxf94re.ttf') format('truetype');
+	src: url('https://at.alicdn.com/t/font_1519039_ubxdq0lvoxd.ttf') format('truetype');
 }
 .iconfont {
 	font-family: "iconfont" !important;
@@ -13,6 +13,10 @@
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 }
+.icon-shuaxin:before {
+  content: "\e622";
+}
+
 .icon-yanjing_xianshi_o:before {
   content: "\ebcc";
 }

pages.json

@@ -1,5 +1,11 @@
 {
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		{
+			"path": "pages/user-module/register",
+			"style": {
+				"navigationBarTitleText": "注册"
+			}
+		},
 		{
 			"path": "pages/tabBar/home/home",
 			"style": {
@@ -175,11 +181,6 @@
 			"style": {
 				"navigationBarTitleText": "登录"
 			}
-		},{
-			"path": "pages/user-module/register",
-			"style": {
-				"navigationBarTitleText": "注册"
-			}
 		},{
 			"path": "pages/user-module/password",
 			"style": {

pages/user-module/bindemail.vue

@@ -31,7 +31,7 @@
 			</view>
 		</view>
 		<view class="login-form clearfix">
-			<view class="login-btn"  @click="goLogin">登录</view>
+			<view class="login-btn"  @click="goLogin">绑定</view>
 		</view>
 		<view v-if="isToast" class="model-warp" >
 			<view class="model-alert clearfix">

pages/user-module/bindwechat.vue

@@ -1,18 +1,68 @@
 <template>
 	<view class="container login">
 		<view class="login-main">
-			<image class="logo" src="../../static/login-logo@3x.png" mode=""></image>
-			<text class="logo-text">生美/医美采购服务平台</text>
+			<text class="logo-text">您的微信尚未绑定机构账号，填写以下资料进行绑定后，您能通过微信快速登录。</text>
 		</view>
-		<view class="login-input">
-			<input type="number" 
-				   v-model="invitationCode"  
-				   maxlength="6" 
-				   class="input" 
-				   placeholder="请输入邀请码"
-			/>
+		<view class="login-form clearfix">
+			<view class="login-input">
+				<input type="number" 
+					   v-model="bindLinkName"  
+					   maxlength="30" 
+					   class="input" 
+					   @blur="onBlurInput"
+					   placeholder="请输入姓名"
+				/>
+			</view>
+		</view>
+		<view class="login-form clearfix">
+			<view class="login-input">
+				<input type="number" 
+					   v-model="bindLinkPhone"  
+					   maxlength="30" 
+					   class="input" 
+					   @blur="onBlurInput"
+					   placeholder="请输入手机号"
+				/>
+			</view>
+		</view>
+		<view class="login-form clearfix">
+			<view class="login-input code">
+				<input type="number" 
+					   v-model="bindGraphiCode"  
+					   maxlength="4" 
+					   class="input" 
+					   placeholder="请输入右侧图形验证码"
+				/>
+			</view>
+			<view class="login-input img-btn">
+				<view class="vscodeimg">
+					<image src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2158189919,2752757953&fm=26&gp=0.jpg" mode=""></image>
+				</view>
+				<view class="vscod-refresh">
+					<text class="iconfont icon-shuaxin"></text>
+					<text class="ref-text">刷新</text>
+				</view>
+			</view>
+		</view>
+		<view class="login-form clearfix">
+			<view class="login-input code">
+				<input type="number" 
+					   v-model="bindPhoneCode"  
+					   maxlength="6" 
+					   class="input" 
+					   placeholder="请输入短信验证码"
+				/>
+			</view>
+			<view class="login-input btn" :class="[isDisabled === true ? 'disabled' : 'none']">
+				<button type="button"
+						@click.stop="getEmailCode" :disabled="isDisabled"
+					    class="input" 
+				>获取验证码</button>
+			</view>
+		</view>
+		<view class="login-form clearfix">
+			<view class="login-btn"  @click="goLogin">绑定</view>
 		</view>
-		<view class="login-btn"  @click="goLogin">登录</view>
 		<view v-if="isToast" class="model-warp" >
 			<view class="model-alert clearfix">
 				<view class="alert-content">
@@ -46,7 +96,11 @@
 	export default{
 		data() {
 			return{
-				invitationCode:'',  //获取用户登录的邀请码
+				bindLinkName:'',  	//用户姓名
+				bindLinkPhone:'',  	//用户手机号
+				bindGraphiCode:'',  //图形验证
+				bindPhoneCode:'',  	//手机验证码
+				isDisabled:true,	//获取验证码按钮
 				isToast:false,		//控制显示未输入邀请码提示	
 				isUserInfo:false,	//控制显示授权弹窗
 				nickName:'',		//存储用户名
@@ -64,13 +118,6 @@
 		},
 		onLoad(option) {
 			console.log(option)
-			self = this;
-			self.loginType = option.type;
-			self.id = option.id
-			if(option.listType) {
-				self.listType = option.listType;
-				self.listVal = option.listVal;
-			}
 		},
 		methods:{
 			...mapMutations(['login']),
@@ -108,80 +155,15 @@
 					}
 				})
 			},
-			//授权登录 
-			getuserinfo: function (e) {
-			    if (e.detail.userInfo) {
-					self.wxGetUserInfo()
-			    }else{
-					//用户按了拒绝按钮
-					uni.showModal({
-						content: '获取用户信息失败，请允许授权后才能继续使用小程序哦~',
-						showCancel: false,
-						confirmText: '授权',
-						success: function (res) {
-							 if (res.confirm) {
-								uni.openSetting({
-									 success: res => {
-										// console.log(res.authSetting)
-									 },
-									 fail: res => {
-										// console.log(res)
-									 }
-								})
-							 }
-						}
-					})
-			    }
-			 },
-			wxGetUserInfo(){
-				authorize.getCode('weixin').then(wechatcode =>{
-					wx.getUserInfo({
-						success: res => {
-							// console.log('useInfo:',res.userInfo)
-							self.userInfo = res.userInfo;
-							let params ={
-									code:wechatcode,
-									nickName:res.userInfo.nickName,
-									invitationCode:self.invitationCode,
-									userOrganizeID:self.userOrganizeID,
-								}
-							self.goUserLogininit(params);
-						}
-					});	
-				})
+			onBlurInput(e){//邮箱输入框失去焦点设置按钮
+				if(e.detail.value ===''){
+					this.isDisabled = true
+				}else{
+					this.isDisabled = false
+				}
 			},
-			goUserLogininit(params){
-				self.$api.lodingGet('/login/register',params, response => {
-					// console.log(response)
-					if (response.code == "1") {
-						self.isUserInfo = false;
-						self.login(self.userInfo);
-						let user_key = {code:response.code,openid:response.data.openid,userID:response.data.userID}
-						uni.setStorageSync('cookieKey','JSESSIONID='+response.data.sessionId);
-						this.$store.commit('updateStatus',user_key)
-						let url;
-						if(self.loginType) {
-							if(self.loginType=='detilType'){
-								self.$api.redirectTo(`/pages/goods/product?id=${self.id}&page=2`);
-							}else if(self.loginType=='search'){
-								self.$api.redirectTo('/pages/search/search');
-							}else if(self.loginType == 1){
-								url ='/pages/tabBar/cart/cart'
-							}else if(self.loginType == 2){
-								url ='/pages/tabBar/user/user'
-							}else {
-								url ='/pages/tabBar/home/home'
-							}
-							uni.switchTab({
-								url
-							})
-						} else if(self.listType) {
-							self.$api.navToListPage({type:self.listType,value:self.listVal,lType:'4'});
-						}
-					} else {
-						this.$util.msg(response.msg,3000);
-					}
-				})
+			getEmailCode(){
+				this.isDisabled = true
 			},
 			//关闭未填邀请码弹窗
 			hideToast(){
@@ -199,6 +181,7 @@
 	.login{
 		width: 100%;
 		height: auto;
+		border-top: 1px solid #F7F7F7;
 		.model-warp.none{
 			display: none;			
 		}
@@ -206,41 +189,101 @@
 			display: block;
 		}
 		.login-main{
-			width: 100%;
+			width: 702rpx;
+			background: rgba(225, 86, 22, 0.1);
 			display: flex;
 			flex-direction: column;
 			align-items: center;
-			height: 198rpx;
-			padding: 170rpx 0 60rpx 0;
-			.logo{
-				width: 138rpx;
-				height: 118rpx;
-				display: block;
-			}
+			height: 68rpx;
+			padding: 20rpx 24rpx;
+			margin: 24rpx 0 118rpx 0;
 			.logo-text{
-				font-size: 30rpx;
-				line-height: 44rpx;
+				font-size: 24rpx;
+				line-height: 34rpx;
 				color: $color-system;
-				font-weight: 600;
-				margin-top: 20rpx;
 			}
 		}
-		.login-input{
-			width: 654rpx;
-			height: 40rpx;
-			padding: 24rpx;
-			margin: 0 auto;
-			margin-bottom: 60rpx;
-			background: #F7F7F7;
-			border-radius: 14rpx;
-			.input{
-				width: 100%;
-				height: 100%;
+		.login-form{
+			width: 702rpx;
+			height: auto;
+			padding: 0 24rpx;
+			.login-input{
+				width: 654rpx;
+				height: 40rpx;
+				padding: 24rpx;
+				margin-bottom: 20rpx;
 				background: #F7F7F7;
-				font-size: $font-size-base;
-				line-height: 40rpx;
-				color: #333333;
 				border-radius: 14rpx;
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				&.code{
+					width: 370rpx;
+					float: left;
+					margin-right: 20rpx;
+				}
+				&.btn{
+					width: 210rpx;
+					float: left;
+					&.none{
+						background: $color-system;
+						.input{
+							color: #FFFFFF;
+							background: $color-system;
+						}
+					}
+					&.disabled{
+						.input{
+							color: #999999;
+						}
+					}
+				}
+				&.img-btn{
+					width: 250rpx;
+					height: 88rpx;
+					padding: 0;
+					float: left;
+					background: #FFFFFF;
+					display: block;
+					.vscodeimg{
+						width: 180rpx;
+						height: 88rpx;
+						float: left;
+						display: flex;
+						flex-direction: column;
+						align-items: center;
+						border-radius: 14rpx;
+						image{
+							width: 180rpx;
+							height: 88rpx;
+							border-radius: 14rpx;
+						}
+					}
+					.vscod-refresh{
+						width: 70rpx;
+						float: right;
+						display: flex;
+						flex-direction: column;
+						align-items: center;
+						.icon-shuaxin{
+							font-size: 48rpx;
+							color: #333333;
+						}
+						.ref-text{
+							font-size: 24rpx;
+							color: #333333;
+						}
+					}
+				}
+				.input{
+					width: 100%;
+					height: 100%;
+					background: #F7F7F7;
+					font-size: $font-size-base;
+					line-height: 40rpx;
+					color: #333333;
+					border-radius: 14rpx;
+				}
 			}
 		}
 		.login-btn{
@@ -253,6 +296,7 @@
 			margin: 0 auto;
 			text-align: center;
 			background: $btn-confirm;
+			margin-top: 100rpx;
 		}
 		.model-authorization{
 			width: 100%;

pages/user-module/login-accont.vue

@@ -218,16 +218,6 @@
 			passwordClick() { //密码显隐操作
 				this.isShowEye = !this.isShowEye;
 			},
-			changePasswordType(e){
-				if(this.inputType ==='password'){
-					this.inputType = 'text'
-					this.passIconType = 'icon-yanjing_xianshi_o'
-				}else{
-					this.inputType = 'password'
-					this.passIconType = 'icon-yanjing_yincang_o'
-					
-				}
-			}
 		}
 	}
 </script>

pages/user-module/password.vue

@@ -1,18 +1,98 @@
 <template>
 	<view class="container login">
 		<view class="login-main">
-			<image class="logo" src="../../static/login-logo@3x.png" mode=""></image>
-			<text class="logo-text">生美/医美采购服务平台</text>
+			<view class="line"></view>
+			<view class="nav-item"
+				  :class="{ current: tabCurrentIndex === 1 }" 
+				  @click="tabClick(1)">
+				  使用手机修改
+			</view>					
+			<view class="nav-item" 
+				  :class="{ current: tabCurrentIndex === 2 }" 
+				  @click="tabClick(2)">
+				  使用邮箱修改
+			</view>
 		</view>
-		<view class="login-input">
-			<input type="number" 
-				   v-model="invitationCode"  
-				   maxlength="6" 
-				   class="input" 
-				   placeholder="请输入邀请码"
-			/>
+		<!-- 手机修改 -->
+		<view class="content" v-if="tabCurrentIndex === 1">
+			<view class="login-form clearfix">
+				<view class="login-input">
+					<input type="number" v-model="bindLinkPhone"  maxlength="11" class="input" @blur="onBlurInput" placeholder="请输入手机号"/>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input code">
+					<input type="number" v-model="bindGraphiCode"  maxlength="4" class="input" placeholder="请输入右侧图形验证码" />
+				</view>
+				<view class="login-input img-btn">
+					<view class="vscodeimg">
+						<image src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2158189919,2752757953&fm=26&gp=0.jpg" mode=""></image>
+					</view>
+					<view class="vscod-refresh">
+						<text class="iconfont icon-shuaxin"></text>
+						<text class="ref-text">刷新</text>
+					</view>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input code">
+					<input type="number" v-model="bindPhoneCode"  maxlength="6" class="input" placeholder="请输入短信验证码"/>
+				</view>
+				<view class="login-input btn" :class="[isDisabled === true ? 'disabled' : 'none']">
+					<button type="button" @click.stop="getEmailCode" :disabled="isDisabled" class="input" >获取验证码</button>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input pwd">
+					<input v-show="isShowEye" type="text" v-model="password"  maxlength="18" class="input" placeholder="请输入新密码，必须为8-16位字母数字的组合" autocomplete="new-password"/>
+					<input v-show="!isShowEye" type="password" v-model="password"  :password="true" maxlength="18" class="input" placeholder="请输入新密码，必须为8-16位字母数字的组合" autocomplete="new-password"/>
+					<view class="iconfont" :class="isShowEye ? iconEyen : iconEyes"  @click="passwordEye"></view>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input pwd">
+					<input v-show="isShowEyes" type="text" v-model="passwordCheck"  maxlength="18" class="input" placeholder="请确认密码" autocomplete="new-password"/>
+					<input v-show="!isShowEyes" type="password" v-model="passwordCheck"  :password="true" maxlength="18" class="input" placeholder="请确认密码" autocomplete="new-password"/>
+					<view class="iconfont" :class="isShowEyes ? iconEyen : iconEyes"  @click="passwordEyes"></view>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-btn"  @click="goLogin">修改密码</view>
+			</view>
+		</view>
+		<!-- 邮箱修改 -->
+		<view class="content" v-else>
+			<view class="login-form clearfix">
+				<view class="login-input">
+					<input class="input" type="number" v-model="bindLinkPhone"  maxlength="30" @blur="onBlurInput" placeholder="请输入邮箱地址"/>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input code">
+					<input class="input" type="number" v-model="bindPhoneCode" maxlength="6"  placeholder="请输入邮箱验证码" />
+				</view>
+				<view class="login-input btn" :class="[isDisabled === true ? 'disabled' : 'none']">
+					<button class="input"  type="button" @click.stop="getEmailCode" :disabled="isDisabled">获取验证码</button>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input pwd">
+					<input v-show="isShowEye" type="text" v-model="password"  maxlength="18" class="input" placeholder="请输入新密码，必须为8-16位字母数字的组合" autocomplete="new-password"/>
+					<input v-show="!isShowEye" type="password" v-model="password"  :password="true" maxlength="18" class="input" placeholder="请输入新密码，必须为8-16位字母数字的组合" autocomplete="new-password"/>
+					<view class="iconfont" :class="isShowEye ? iconEyen : iconEyes"  @click="passwordEye"></view>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-input pwd">
+					<input v-show="isShowEyes" type="text" v-model="passwordCheck"  maxlength="18" class="input" placeholder="请确认密码" autocomplete="new-password"/>
+					<input v-show="!isShowEyes" type="password" v-model="passwordCheck"  :password="true" maxlength="18" class="input" placeholder="请确认密码" autocomplete="new-password"/>
+					<view class="iconfont" :class="isShowEyes ? iconEyen : iconEyes"  @click="passwordEyes"></view>
+				</view>
+			</view>
+			<view class="login-form clearfix">
+				<view class="login-btn"  @click="goLogin">修改密码</view>
+			</view>
 		</view>
-		<view class="login-btn"  @click="goLogin">登录</view>
 		<view v-if="isToast" class="model-warp" >
 			<view class="model-alert clearfix">
 				<view class="alert-content">
@@ -46,7 +126,17 @@
 	export default{
 		data() {
 			return{
-				invitationCode:'',  //获取用户登录的邀请码
+				tabCurrentIndex: 1,
+				mobile:'',  	//用户手机号
+				bindGraphiCode:'',  //图形验证
+				bindPhoneCode:'',  	//手机验证码
+				password:'',		//新密码
+				passwordCheck:'',   //二次校验新密码
+				isShowEye:false,	//控显
+				isShowEyes:false,	//控显
+				iconEyes:'icon-yanjing_yincang_o',
+				iconEyen:'icon-yanjing_xianshi_o',
+				isDisabled:true,	//获取验证码按钮
 				isToast:false,		//控制显示未输入邀请码提示	
 				isUserInfo:false,	//控制显示授权弹窗
 				nickName:'',		//存储用户名
@@ -64,13 +154,6 @@
 		},
 		onLoad(option) {
 			console.log(option)
-			self = this;
-			self.loginType = option.type;
-			self.id = option.id
-			if(option.listType) {
-				self.listType = option.listType;
-				self.listVal = option.listVal;
-			}
 		},
 		methods:{
 			...mapMutations(['login']),
@@ -108,80 +191,24 @@
 					}
 				})
 			},
-			//授权登录 
-			getuserinfo: function (e) {
-			    if (e.detail.userInfo) {
-					self.wxGetUserInfo()
-			    }else{
-					//用户按了拒绝按钮
-					uni.showModal({
-						content: '获取用户信息失败，请允许授权后才能继续使用小程序哦~',
-						showCancel: false,
-						confirmText: '授权',
-						success: function (res) {
-							 if (res.confirm) {
-								uni.openSetting({
-									 success: res => {
-										// console.log(res.authSetting)
-									 },
-									 fail: res => {
-										// console.log(res)
-									 }
-								})
-							 }
-						}
-					})
-			    }
-			 },
-			wxGetUserInfo(){
-				authorize.getCode('weixin').then(wechatcode =>{
-					wx.getUserInfo({
-						success: res => {
-							// console.log('useInfo:',res.userInfo)
-							self.userInfo = res.userInfo;
-							let params ={
-									code:wechatcode,
-									nickName:res.userInfo.nickName,
-									invitationCode:self.invitationCode,
-									userOrganizeID:self.userOrganizeID,
-								}
-							self.goUserLogininit(params);
-						}
-					});	
-				})
+			onBlurInput(e){//邮箱输入框失去焦点设置按钮
+				if(e.detail.value ===''){
+					this.isDisabled = true
+				}else{
+					this.isDisabled = false
+				}
 			},
-			goUserLogininit(params){
-				self.$api.lodingGet('/login/register',params, response => {
-					// console.log(response)
-					if (response.code == "1") {
-						self.isUserInfo = false;
-						self.login(self.userInfo);
-						let user_key = {code:response.code,openid:response.data.openid,userID:response.data.userID}
-						uni.setStorageSync('cookieKey','JSESSIONID='+response.data.sessionId);
-						this.$store.commit('updateStatus',user_key)
-						let url;
-						if(self.loginType) {
-							if(self.loginType=='detilType'){
-								self.$api.redirectTo(`/pages/goods/product?id=${self.id}&page=2`);
-							}else if(self.loginType=='search'){
-								self.$api.redirectTo('/pages/search/search');
-							}else if(self.loginType == 1){
-								url ='/pages/tabBar/cart/cart'
-							}else if(self.loginType == 2){
-								url ='/pages/tabBar/user/user'
-							}else {
-								url ='/pages/tabBar/home/home'
-							}
-							uni.switchTab({
-								url
-							})
-						} else if(self.listType) {
-							self.$api.navToListPage({type:self.listType,value:self.listVal,lType:'4'});
-						}
-					} else {
-						this.$util.msg(response.msg,3000);
-					}
-				})
+			getEmailCode(){
+				this.isDisabled = true
+			},
+			tabClick(index) {//tab切换
+				this.tabCurrentIndex = index;
+			},
+			passwordEye() {//密码显隐操作
+				this.isShowEye = !this.isShowEye;
+			},
+			passwordEyes() {//密码显隐操作
+				this.isShowEyes = !this.isShowEyes;
 			},
 			//关闭未填邀请码弹窗
 			hideToast(){
@@ -208,39 +235,135 @@
 		.login-main{
 			width: 100%;
 			display: flex;
-			flex-direction: column;
-			align-items: center;
-			height: 198rpx;
-			padding: 170rpx 0 60rpx 0;
-			.logo{
-				width: 138rpx;
-				height: 118rpx;
-				display: block;
+			height: 80rpx;
+			border-top: 1px solid #F7F7F7;
+			margin-bottom: 112rpx;
+			position: relative;
+			.line{
+				position: absolute;
+				top: 0;
+				left: 50%;
+				margin-left: -80rpx;
+				width: 0;
+				height: 0;
+				border-left: 80rpx solid transparent;
+				border-right: 80rpx solid transparent;
+				border-bottom: 160rpx solid #FFFFFF;
 			}
-			.logo-text{
-				font-size: 30rpx;
-				line-height: 44rpx;
-				color: $color-system;
-				font-weight: 600;
-				margin-top: 20rpx;
+			.nav-item{
+				display: flex;
+				flex: 1;
+				flex-direction: column;
+				align-items: center;
+				line-height: 80rpx;
+				color: $text-color;
+				font-size: $font-size-sm;
+				background: #F7F7F7;
+				
+				&.current{
+					color:$color-system;
+					background: #FFFFFF;
+					
+				}
 			}
 		}
-		.login-input{
-			width: 654rpx;
-			height: 40rpx;
-			padding: 24rpx;
-			margin: 0 auto;
-			margin-bottom: 60rpx;
-			background: #F7F7F7;
-			border-radius: 14rpx;
-			.input{
-				width: 100%;
-				height: 100%;
+		.login-form{
+			width: 702rpx;
+			height: auto;
+			padding: 0 24rpx;
+			.login-input{
+				width: 654rpx;
+				height: 40rpx;
+				padding: 24rpx;
+				margin-bottom: 20rpx;
 				background: #F7F7F7;
-				font-size: $font-size-base;
-				line-height: 40rpx;
-				color: #333333;
 				border-radius: 14rpx;
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				position: relative;
+				&.pwd{
+					.iconfont{
+						position: absolute;
+						right: 0;
+						top: 0;
+						font-size: 46rpx;
+						color: $color-system;
+						font-weight: bold;
+						z-index: 99;
+						width: 96rpx;
+						height: 96rpx;
+						line-height: 96rpx;
+						text-align: center;
+					}
+				}
+				&.code{
+					width: 370rpx;
+					float: left;
+					margin-right: 20rpx;
+				}
+				&.btn{
+					width: 215rpx;
+					float: left;
+					&.none{
+						background: $color-system;
+						.input{
+							color: #FFFFFF;
+							background: $color-system;
+						}
+					}
+					&.disabled{
+						.input{
+							color: #999999;
+						}
+					}
+				}
+				&.img-btn{
+					width: 250rpx;
+					height: 88rpx;
+					padding: 0;
+					float: left;
+					background: #FFFFFF;
+					display: block;
+					.vscodeimg{
+						width: 180rpx;
+						height: 88rpx;
+						float: left;
+						display: flex;
+						flex-direction: column;
+						align-items: center;
+						border-radius: 14rpx;
+						image{
+							width: 180rpx;
+							height: 88rpx;
+							border-radius: 14rpx;
+						}
+					}
+					.vscod-refresh{
+						width: 70rpx;
+						float: right;
+						display: flex;
+						flex-direction: column;
+						align-items: center;
+						.icon-shuaxin{
+							font-size: 48rpx;
+							color: #333333;
+						}
+						.ref-text{
+							font-size: 24rpx;
+							color: #333333;
+						}
+					}
+				}
+				.input{
+					width: 100%;
+					height: 100%;
+					background: #F7F7F7;
+					font-size: $font-size-base;
+					line-height: 40rpx;
+					color: #333333;
+					border-radius: 14rpx;
+				}
 			}
 		}
 		.login-btn{
@@ -253,6 +376,7 @@
 			margin: 0 auto;
 			text-align: center;
 			background: $btn-confirm;
+			margin-top: 100rpx;
 		}
 		.model-authorization{
 			width: 100%;

pages/user-module/register.vue

@@ -1,51 +1,204 @@
 <template>
-	<view class="container login">
-		<view class="login-main">
-			<image class="logo" src="../../static/login-logo@3x.png" mode=""></image>
-			<text class="logo-text">生美/医美采购服务平台</text>
+	<view class="container register">
+		<view class="register-tab">
+			<view class="nav-item" :class="{ current: tabCurrentIndex === 1 }" >
+				  账户信息<view class="line"></view>
+			</view>					
+			<view class="nav-item" :class="{ current: tabCurrentIndex === 2 }" >
+				  基本信息<view class="line"></view>
+			</view>
+			<view class="nav-item" :class="{ current: tabCurrentIndex === 3 }" >
+				  详细信息
+			</view>
 		</view>
-		<view class="login-input">
-			<input type="number" 
-				   v-model="invitationCode"  
-				   maxlength="6" 
-				   class="input" 
-				   placeholder="请输入邀请码"
-			/>
+		<view class="register-main clearfix" v-if="tabCurrentIndex === 1">
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">邮箱:</view>
+					<input class="row-input" type="text" v-model="registerEmail" placeholder="请输入您的常用邮箱" maxlength="30"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from code">
+					<view class="label">邮箱验证码:</view>
+					<input class="row-input" type="text" v-model="regEmailCode" placeholder="请输入邮箱验证码" maxlength="6"/>
+				</view>
+				<view class="register-from btn" :class="[isDisabled === true ? 'disabled' : 'none']">
+					<button class="row-input"  type="button" @click.stop="getEmailCode" :disabled="isDisabled">获取验证码</button>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">登录密码:</view>
+					<input class="row-input" type="password" v-model="password" placeholder="密码必须为8-16位字母数字组合" maxlength="20"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">确认密码:</view>
+					<input class="row-input" type="password" v-model="passwordCheck" placeholder="请确认密码" maxlength="20"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-btn"  @click="steps(2)">下一步</view>
+			</view>
 		</view>
-		<view class="login-btn"  @click="goLogin">登录</view>
-		<view v-if="isToast" class="model-warp" >
-			<view class="model-alert clearfix">
-				<view class="alert-content">
-					<view class="t-h1">{{toestText}}</view>
-					<view class="t-p">请联系客服获取{{alertText}}后再登录，联系电话{{telPhone}}</view>
+		<view class="register-main clearfix" v-if="tabCurrentIndex === 2">
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">机构名称:</view>
+					<input class="row-input" type="text" v-model="clubName" placeholder="请输入您的机构名称" maxlength="30"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">联系人:</view>
+					<input class="row-input" type="text" v-model="clubContact" placeholder="请输入联系姓名" maxlength="6"/>
 				</view>
-				<view class="alert-btn">
-					<view class="btn btn-confirm" @click="hideToast">确定</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">手机号:</view>
+					<input class="row-input" type="number" v-model="registerEmail" placeholder="请输入手机号" maxlength="11"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from imgcode">
+					<view class="label">图形验证码:</view>
+					<input class="row-input" type="text" v-model="regEmailCode" placeholder="请输入图形验证码" maxlength="6"/>
+				</view>
+				<view class="register-from img-btn">
+					<view class="vscodeimg">
+						<image src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2158189919,2752757953&fm=26&gp=0.jpg" mode=""></image>
+					</view>
+					<view class="vscod-refresh">
+						<text class="iconfont icon-shuaxin"></text>
+						<text class="ref-text">刷新</text>
+					</view>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from code">
+					<view class="label">短信验证码:</view>
+					<input class="row-input" type="text" v-model="regEmailCode" placeholder="请输入短信验证码" maxlength="6"/>
+				</view>
+				<view class="register-from btn" :class="[isDisabled === true ? 'disabled' : 'none']">
+					<button class="row-input"  type="button" @click.stop="getEmailCode" :disabled="isDisabled">获取验证码</button>
 				</view>
 			</view>
+			<view class="register-row clearfix">
+				<view class="register-btn"  @click="steps(3)">下一步</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-btn none"  @click="steps(1)">上一步</view>
+			</view>
 		</view>
-		<!-- 授权按钮 -->
-		<view class="model-warp" :class="[isUserInfo===false ? 'none':'show']">
-			<view class="model-alert">
-				<view class="alert-content">
-					<view class="t-p">采美采购商城需要获取您的微信授权才能正常提供服务</view>
+		<view class="register-main detailed clearfix" v-if="tabCurrentIndex === 3">
+			<view class="register-tips"><text class="iconfont icon-gantanhao-yuankuang">详细信息请尽量填写，有利于快速审核通过</text></view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">机构简称:</view>
+					<input class="row-input" type="text" v-model="clubContact" placeholder="请输入您的机构简称" maxlength="16"/>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from"  @click="showMulLinkageThreePicker">
+					<view class="label">机构地址:</view>
+					<text class="row-input" :class="addressData.address === '请选择机构所在地区' ? 'none' : ''">
+						{{addressData.address}}
+					</text>		
+					<text class="iconfont icon-xiayibu"></text>
+				</view>
+			</view>
+			<view class="register-row text-textarea clearfix">
+				<view class="textarea show" v-if="isShowInput">{{addressData.addressDetail ? addressData.addressDetail :'详细地址：如道路、门牌号、小区等'}}</view>
+				<textarea 	v-else
+							class="textarea" 
+							type="text" 
+							v-model="addressData.addressDetail" 
+							placeholder="详细地址：如道路、门牌号、小区等" 
+							placeholder-class="placeholder"
+							maxlength="50"
+							@input="onTextareaInput"
+							:class="isShowInput ? '':''"
+				/>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-from">
+					<view class="label">营业执照编号:</view>
+					<input class="row-input" type="text" v-model="clubContact" placeholder="请填写社会统一信用代码" maxlength="16"/>
 				</view>
-				<view class="alert-btn">
-					<view class="btn btn-cancel" @click="hideModel">取消</view>
-					<button type="primary" size="small" open-type="getUserInfo" lang="zh_CN" @getuserinfo="getuserinfo" class="btn btn-confirm">授权</button>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-picture">
+					<view class="label">营业执照:</view>
+					<view class="upload-picture">
+						<view class="upload-none" v-if="uploadBusinessImage === ''"  @click="chooseBusinessImage"><text class="iconfont icon-jiahao"></text></view>
+						<view class="upload-image" v-else>
+							<image :src="uploadBusinessImage" mode="" @click="viewBusinessImage"></image>
+							<view class="upload-del" @click="delBusinessImage">
+								<text class='iconfont icon-shanchu1'></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="register-row clearfix">
+				<view class="register-picture">
+					<view class="label">门头照:</view>
+					<view class="upload-picture">
+						<view class="upload-none" v-if="uploadMentuzImage === ''" @click="chooseMentuzImage"><text class="iconfont icon-jiahao"></text></view>
+						<view class="upload-image" v-else>
+							<image :src="uploadMentuzImage" mode=""  @click="viewMentuzImage"></image>
+							<view class="upload-del" @click="delMentuzImage">
+								<text class='iconfont icon-shanchu1'></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="register-fiexd clearfix">
+				<view class="register-agree">
+					<view class="agree-text"  @tap.stop="agreeCheck()">
+						<button class="checkbox iconfont" :class="[isCheck?'icon-gouxuan':'icon-weigouxuan']"></button> 
+						我已阅读并同意<text>《机构协议》</text><text>《用户协议》</text>及<text>《隐私权政策》</text>
+					</view>
+				</view>
+				<view class="register-row">
+					<view class="register-btn sub">提交审核</view>
+				</view>
+				<view class="register-row clearfix">
+					<view class="register-btn none"  @click="steps(2)">上一步</view>
 				</view>
 			</view>
+			<mpvue-city-picker :themeColor="themeColor"
+								ref="mpvueCityPicker" 
+							    :pickerValueDefault="cityPickerValueDefault"
+								@onCancel="onCancel" 
+								@onConfirm="onConfirm">
+			</mpvue-city-picker>
 		</view>
 	</view>
 </template>
 
 <script>
 	import { mapMutations } from 'vuex';
+	import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
 	import authorize from '@/common/config/authorize.js' 
+	import URLCONFIG from '@/common/config/config.js' 
 	var self;
 	export default{
+		components:{
+			mpvueCityPicker
+		},
 		data() {
 			return{
+				isDisabled:true,
+				tabCurrentIndex:3,	
+				isShowInput:false,
+				isCheck:false,		//是否全选
+				uploadBusinessImage:'',
+				uploadMentuzImage:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1431188283,1203112303&fm=26&gp=0.jpg',
 				invitationCode:'',  //获取用户登录的邀请码
 				isToast:false,		//控制显示未输入邀请码提示	
 				isUserInfo:false,	//控制显示授权弹窗
@@ -54,18 +207,28 @@
 				isSuccess:false,
 				toestText:'',
 				telPhone:'',
-				loginType:'',		//跳转类型
+				registerType:'',		//跳转类型
 				alertText:'',
 				listType: '',
 				listVal: '',
 				detilType:'',
-				id:''//商品ID
+				id:'',//商品ID
+				addressData:{
+					addressID:'',
+					address:'请选择机构所在地区',
+					userID: '',			//用户id ,只在新增收货地址时传
+					shouHuoRen: '',		//收货人
+					mobile:'',			//收货人手机
+					townID:'',			//区ID
+					addressDetail: '',	//地址
+					defaultFlag:0,		//是否默认收货地址(0 不是默认,1 默认)
+				},
 			}
 		},
 		onLoad(option) {
 			console.log(option)
 			self = this;
-			self.loginType = option.type;
+			self.registerType = option.type;
 			self.id = option.id
 			if(option.listType) {
 				self.listType = option.listType;
@@ -73,9 +236,9 @@
 			}
 		},
 		methods:{
-			...mapMutations(['login']),
-			goLogin() {
-				self.$api.get('/login/isEnabled',{userOrganizeID:self.userOrganizeID,invitationCode:self.invitationCode}, res => {
+			...mapMutations(['register']),
+			goregister() {
+				self.$api.get('/register/isEnabled',{userOrganizeID:self.userOrganizeID,invitationCode:self.invitationCode}, res => {
 					if (res.code == "1") {
 						//查看此微信用户是否已经授权过
 						authorize.getSetting().then(res =>{
@@ -108,95 +271,106 @@
 					}
 				})
 			},
-			//授权登录 
-			getuserinfo: function (e) {
-			    if (e.detail.userInfo) {
-					self.wxGetUserInfo()
-			    }else{
-					//用户按了拒绝按钮
-					uni.showModal({
-						content: '获取用户信息失败，请允许授权后才能继续使用小程序哦~',
-						showCancel: false,
-						confirmText: '授权',
-						success: function (res) {
-							 if (res.confirm) {
-								uni.openSetting({
-									 success: res => {
-										// console.log(res.authSetting)
-									 },
-									 fail: res => {
-										// console.log(res)
-									 }
-								})
-							 }
-						}
-					})
-			    }
-			 },
-			wxGetUserInfo(){
-				authorize.getCode('weixin').then(wechatcode =>{
-					wx.getUserInfo({
-						success: res => {
-							// console.log('useInfo:',res.userInfo)
-							self.userInfo = res.userInfo;
-							let params ={
-									code:wechatcode,
-									nickName:res.userInfo.nickName,
-									invitationCode:self.invitationCode,
-									userOrganizeID:self.userOrganizeID,
-								}
-							self.goUserLogininit(params);
-						}
-					});	
+			// 三级联动选择
+			showMulLinkageThreePicker() {
+				this.isShowInput = true
+				this.$refs.mpvueCityPicker.show()
+			},
+			onConfirm(e) {
+				// console.log('地址',e);
+				this.addressData.address = e.name;
+				this.addressData.townID = e.cityCode;	
+			},	
+			onTextareaInput(e){
+			   this.addressData.addressDetail = e.detail.value;
+			   // console.log(this.addressData.addressDetail)
+			},
+			chooseBusinessImage() {
+				let self = this;
+				uni.chooseImage({
+					count: 1, //默认1
+					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album','camera'], //从相册选择
+					success: (res) => {
+						const tempFilePaths = res.tempFilePaths;
+						const uploadTask = uni.uploadFile({
+							url : 'https://mall-b.caimei365.com/formData/MultiPictareaddData',
+							filePath: tempFilePaths[0],
+							name: 'file',
+							formData: {
+								'user': 'test'
+							},
+							success: function (data) {
+								console.log(data.data);
+								this.uploadBusinessImage = res.tempFilePaths
+							},
+							error : function(e){
+								 console.log(e);
+							}
+						})
+					},
+					
 				})
 			},
-			goUserLogininit(params){
-				self.$api.lodingGet('/login/register',params, response => {
-					// console.log(response)
-					if (response.code == "1") {
-						self.isUserInfo = false;
-						self.login(self.userInfo);
-						let user_key = {code:response.code,openid:response.data.openid,userID:response.data.userID}
-						uni.setStorageSync('cookieKey','JSESSIONID='+response.data.sessionId);
-						this.$store.commit('updateStatus',user_key)
-						let url;
-						if(self.loginType) {
-							if(self.loginType=='detilType'){
-								self.$api.redirectTo(`/pages/goods/product?id=${self.id}&page=2`);
-							}else if(self.loginType=='search'){
-								self.$api.redirectTo('/pages/search/search');
-							}else if(self.loginType == 1){
-								url ='/pages/tabBar/cart/cart'
-							}else if(self.loginType == 2){
-								url ='/pages/tabBar/user/user'
-							}else {
-								url ='/pages/tabBar/home/home'
+			chooseMentuzImage() {
+				let self = this;
+				uni.chooseImage({
+					count: 1, //默认1
+					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album','camera'], //从相册选择
+					success: (res) => {
+						const tempFilePaths = res.tempFilePaths;
+						const uploadTask = uni.uploadFile({
+							url : 'https://mall-b.caimei365.com/formData/MultiPictareaddData',
+							filePath: tempFilePaths[0],
+							name: 'file',
+							formData: {
+								'user': 'test'
+							},
+							success: function (res) {
+								console.log(res.data);
+								this.uploadMentuzImage = res.data
+							},
+							error : function(e){
+								 console.log(e);
 							}
-							uni.switchTab({
-								url
-							})
-						} else if(self.listType) {
-							self.$api.navToListPage({type:self.listType,value:self.listVal,lType:'4'});
-						}
-					} else {
-						this.$util.msg(response.msg,3000);
+						})
 					}
-				})
+				});
+			},
+			viewMentuzImage(e) {
+				let self = this
+				uni.previewImage({
+					urls: self.uploadMentuzImage,
+					current: e.currentTarget.dataset.url
+				});
+			},
+			viewBusinessImage(e) {
+				let self = this
+				uni.previewImage({
+					urls: self.uploadBusinessImage,
+					current: e.currentTarget.dataset.url
+				});
+			},
+			delBusinessImage(){
+				this.uploadBusinessImage = ''
+			},
+			delMentuzImage(){
+				this.uploadMentuzImage = ''
 			},
-			//关闭未填邀请码弹窗
-			hideToast(){
-				self.isToast = false;
+			agreeCheck() {
+				this.isCheck = !this.isCheck
 			},
-			//关闭未授权用户授权提示弹窗
-			hideModel(){
-				self.isUserInfo = false;
+			steps(index) {//tab切换
+				console.log(index)
+				this.tabCurrentIndex = index;
 			}
 		}
 	}
 </script>
 
 <style lang="scss">
-	.login{
+	.register{
 		width: 100%;
 		height: auto;
 		.model-warp.none{
@@ -205,86 +379,307 @@
 		.model-warp.show{
 			display: block;
 		}
-		.login-main{
+		.register-tab{
+			width: 570rpx;
+			height: 60rpx;
+			padding: 60rpx 90rpx;
+			border-top: 1px solid #F7F7F7;
+			position: relative;
+			.nav-item{
+				width: 142rpx;
+				background: #FFFFFF;
+				line-height: 60rpx;
+				border-radius: 30rpx;
+				text-align: center;
+				color: #999999;
+				font-size:$font-size-sb;
+				float: left;
+				margin-right: 72rpx;
+				position: relative;
+				.line{
+					height: 3rpx;
+					width: 50rpx;
+					background: #999999;
+					position: absolute;
+					right: -58rpx;
+					top: 32rpx;
+				}
+				&:last-child{
+					margin-right: 0;
+				}
+				&.current{
+					color:#FFFFFF;
+					background: $color-system;
+					
+				}
+			}
+		}
+		.register-main{
 			width: 100%;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			height: 198rpx;
-			padding: 170rpx 0 60rpx 0;
-			.logo{
-				width: 138rpx;
-				height: 118rpx;
-				display: block;
+			height: auto;
+			&.detailed{
+				padding-bottom: 300rpx;
 			}
-			.logo-text{
-				font-size: 30rpx;
+			.register-tips{
+				display: flex;
+				flex-direction: column;
+				align-items: center;
 				line-height: 44rpx;
-				color: $color-system;
-				font-weight: 600;
-				margin-top: 20rpx;
+				font-size: $font-size-sm;
+				color: #FF0000;
+				margin-bottom: 40rpx;
 			}
-		}
-		.login-input{
-			width: 654rpx;
-			height: 40rpx;
-			padding: 24rpx;
-			margin: 0 auto;
-			margin-bottom: 60rpx;
-			background: #F7F7F7;
-			border-radius: 14rpx;
-			.input{
-				width: 100%;
-				height: 100%;
+			.register-row{
+				width: 702rpx;
+				height: auto;
+				padding: 0 24rpx;
+				margin-bottom: 20rpx;
+				.register-from{
+					width: 654rpx;
+					height: 40rpx;
+					padding: 24rpx;
+					background: $sub-bg-color;
+					border-radius: 14rpx;
+					.label{
+						text-align: left;
+						font-size: $font-size-base;
+						color: $text-color;
+						line-height: 40rpx;
+						float: left;
+					}
+					.row-input{
+						width: 440rpx;
+						padding-left:10rpx;
+						font-size: $font-size-base;
+						color: $text-color;
+						line-height: 40rpx;
+						float: left;
+						&.none{
+							color: #999999;
+						}
+					}
+					&.img-btn{
+						width: 220rpx;
+						height: 88rpx;
+						padding: 0;
+						float: left;
+						background: #FFFFFF;
+						display: block;
+						.vscodeimg{
+							width: 150rpx;
+							height: 88rpx;
+							float: left;
+							display: flex;
+							flex-direction: column;
+							align-items: center;
+							border-radius: 14rpx;
+							image{
+								width: 150rpx;
+								height: 88rpx;
+								border-radius: 14rpx;
+							}
+						}
+						.vscod-refresh{
+							width: 70rpx;
+							float: right;
+							text-align: right;
+							display: flex;
+							flex-direction: column;
+							align-items: center;
+							line-height: 44rpx;
+							.icon-shuaxin{
+								font-size: 48rpx;
+								color: #333333;
+							}
+							.ref-text{
+								font-size: 24rpx;
+								color: #333333;
+							}
+						}
+					}
+					&.imgcode{
+						width: 410rpx;
+						float: left;
+						margin-right: 20rpx;
+						.row-input{
+							width: 230rpx;
+						}
+					}
+					&.code{
+						width: 410rpx;
+						float: left;
+						margin-right: 20rpx;
+						.row-input{
+							width: 230rpx;
+						}
+					}
+					&.btn{
+						width: 176rpx;
+						float: left;
+						.row-input{
+							width: 176rpx;
+							padding: 0;
+							background: #F7F7F7;
+							text-align: center;
+						}
+						&.none{
+							background: $color-system;
+							.row-input{
+								color: #FFFFFF;
+								background: $color-system;
+							}
+						}
+						&.disabled{
+							.row-input{
+								color: #999999;
+							}
+						}
+					}
+				}
+				.icon-xiayibu{
+					float: right;
+				}
+				&.text-textarea{
+					background: #FFFFFF;
+					.textarea{
+						width: 654rpx;
+						height: 180rpx;
+						background: #F7F7F7;
+						padding: 24rpx;
+						font-size: $font-size-base;
+						color: $text-color;
+						z-index: 1;
+						border-radius: 14rpx;
+					}
+					.textarea.hide{
+						opacity: 0;
+					}
+					.textarea.show{
+						color: #999999;
+					}
+				}
+			}
+			.register-picture{
+				height: 102rpx;
+				margin: 30rpx 0 0 0;
+				.label{
+					float: left;
+					font-size: $font-size-base;
+					color: $text-color;
+					line-height: 102rpx;
+					width: 120rpx;
+					text-align: right;
+				}
+				.upload-picture{
+					float: left;
+					height: 100rpx;
+					.upload-none{
+						width: 100rpx;
+						height: 100rpx;
+						text-align: center;
+						line-height: 100rpx;
+						color: #999999;
+						border: 1px solid #999999;
+						border-radius: 10rpx;
+						margin: 0 20rpx;
+						.iconfont{
+							font-size: $font-size-lg;
+						}
+					}
+					.upload-image{
+						width: 100rpx;
+						height: 100rpx;
+						border-radius: 10rpx;
+						margin: 0 20rpx;
+						position: relative;
+						image{
+							width: 100rpx;
+							height: 100rpx;
+							border-radius: 10rpx;
+						}
+						.upload-del{
+							width: 40rpx;
+							height: 40rpx;
+							position: absolute;
+							top: -20rpx;
+							right: -20rpx;
+							line-height: 40rpx;
+							text-align: center;
+							.iconfont{
+								font-size: $font-size-base;
+								color: #999999;
+							}
+						}
+					}
+				}
+			}
+			.register-input{
+				width: 654rpx;
+				height: 40rpx;
+				padding: 24rpx;
+				margin: 0 auto;
+				margin-bottom: 60rpx;
 				background: #F7F7F7;
-				font-size: $font-size-base;
-				line-height: 40rpx;
-				color: #333333;
 				border-radius: 14rpx;
-			}
-		}
-		.login-btn{
-			width: 702rpx;
-			height: 88rpx;
-			border-radius: 14rpx;
-			font-size: $font-size-base;
-			line-height: 88rpx;
-			color: #FFFFFF;
-			margin: 0 auto;
-			text-align: center;
-			background: $btn-confirm;
-		}
-		.model-authorization{
-			width: 100%;
-			height: 100%;
-			position: fixed;
-			top: 0;
-			left: 0;
-			z-index: 999;
-			.authorization{
-				width: 518rpx;
-				height: 320rpx;
-				position: absolute;
-				background: rgba(255,255,255,.7);
-				left: 0;
-				right: 0;
-				bottom: 0;
-				top: 0;
-				margin: auto;
-				.to-btn{
-					position: absolute;
-					top: 0;
-					left: 0;
-					right: 0;
-					bottom: 0;
-					margin: auto;
-					width: 70%;
-					height: 88rpx;
+				.input{
+					width: 100%;
+					height: 100%;
+					background: #F7F7F7;
 					font-size: $font-size-base;
-					line-height: 88rpx;
-					color: #FFFFFF;
-					text-align: center;
-					border-radius: 44rpx;
+					line-height: 40rpx;
+					color: #333333;
+					border-radius: 14rpx;
+				}
+			}
+			.register-fiexd{
+				width: 100%;
+				height: auto;
+				// position: fixed;
+				// bottom: 0;
+				// left: 0;
+				background: #FFFFFF;
+				.register-agree{
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					margin: 32rpx 0;
+					.agree-text{
+						.checkbox{
+							float: left;
+							margin: 4rpx 6rpx 0 0;
+							color: #999999;
+							font-size: $font-size-lg;
+							&.icon-gouxuan{
+								color: $color-system;
+							}
+						}
+						font-size: 20rpx;
+						line-height: 44rpx;
+						color: #999999;
+						text{
+							color:#0091FF;
+						}
+					}
+				}
+			}
+			.register-btn{
+				width: 702rpx;
+				height: 88rpx;
+				border-radius: 14rpx;
+				font-size: $font-size-base;
+				line-height: 88rpx;
+				color: #FFFFFF;
+				margin: 0 auto;
+				text-align: center;
+				background: $btn-confirm;
+				margin-top: 96rpx;
+				&.none{
+					background: #FFFFFF;
+					color: $text-color;
+					margin-top: 0;
+				}
+				&.sub{
+					margin-top: 0;
 				}
 			}
 		}

uni.scss

@@ -27,6 +27,7 @@ $font-size-sb:26rpx;
 $font-size-base:28rpx;
 $font-size-se:30rpx;
 $font-size-lg:32rpx;
+$font-size-big:44rpx;
 
 /* 行为相关颜色 */
 $uni-color-primary: #007aff;