baiyuApp/pages/auth/bindMobile.vue

<template>
	<view>
		 <view class="content">
			<image class="backImg" @tap="goBack()" src="../../static/images/icon_close.png"></image>
			 <view class="pageTop">
					<view class="head x-c"> 绑定手机号</view>
					<view class="loginBox">
							 <view class="login-item">
								 <view class="input-account">
									 <input  v-model="userName" placeholder="请输入手机号" type="number" />
								 </view>
								 <view class="line"></view>
							 </view> 
							 
							 <view class="login-item">
								 <view class="input-pwd">
									 <input  v-model="password" placeholder="请输入密码" type="password" />
								 </view>
								 <view class="line"></view>
							 </view> 
							
							 <view class="btns">
								 <view class="login-btn" @click="bindAccount">立即绑定</view>
							 </view>
					</view>
			</view>
		
		 </view>
	</view>
	
</template>

<script>
	
import { login,loginByWeChat,loginByApple,setPhone,setIPhoneNumber } from '@/api/user'
export default {
	data() {
		return {
			userName:"",
			password:"",
		    registrationID:"",
			unionid:"",
			userPhone:"",
			loginType:0,
			isApp:false,
			isAgreePrivacy:false,
			isIos:false,
			from: '',
			source:'',
			appleKey:""
		}
	},
	onLoad(option) {
		// #ifdef APP-PLUS
		this.isIos = plus.os.name == "iOS"
		this.isApp=true;
		this.source = plus.runtime.channel || 'app'
		if(this.isIos){
			this.source="iOS";
		}
		// #endif  
		
		this.from= option.from || ''
		let that=this;
		uni.$on('getRegistrationID', function(data) {
			that.registrationID=data;
		}); 
		this.appleKey=option.appleKey;
		
	},
	onShow() {

    },
	onUnload() {
		uni.$off('getRegistrationID');
    },
    mounted() {
       
    },
    methods: {
       bindAccount(){
			if (this.$isEmpty(this.userName)) {
				uni.showToast({
					title: "请输入手机号",
					icon: 'none',
				});
				return;
			}
			if (this.$isEmpty(this.password)) {
				uni.showToast({
					title: "请输入密码",
					icon: 'none',
				});
				return;
			}
			uni.showLoading({
				title:"处理中..."
			});
			this.setPhoneNumberAct(3,this.unionid);
	   },
	   
	   setPhoneNumberAct(type,unionId){
	   	  let params={
	   			  phone:this.userName,
				  password:this.password,
				  appleKey:this.appleKey,
	   			  unionId:unionId,
				  source:this.source,
				  simExist:0
	   	  };
	   	  setIPhoneNumber(params).then(res => {
			    console.log("setIPhoneNumber res:",res);
	   	  		uni.hideLoading();
	   	  		if(res.code==200){
	   	  			   uni.setStorageSync('AppToken',res.token);
	   	  			   uni.setStorageSync('userInfo',JSON.stringify(res.user));
	   				   uni.$emit('refreshIM');
	   				   this.goPage()
	   	  		}
	   	  		else{
	   	  			uni.showToast({title: res.msg,icon: 'none'});
	   	  		}
	   	  	},
	   	  	rej => {}
	   	  );
	    },
	   	
	   setPhoneAct(type,phone,unionId){
	   	  let params={
			  phone:phone,
			  unionId:unionId,
			  source:this.source,
		  };
		  if(type==3) {
				params={
				   phone:phone,
				   unionId:unionId,
				   appleKey: this.appleKey,
				   source:this.source
				};
		  }
	   	  setPhone(params).then(res => {
	   	  		uni.hideLoading();
	   	  		if(res.code==200){
	   	  			   uni.setStorageSync('AppToken',res.token);
	   	  			   uni.setStorageSync('userInfo',JSON.stringify(res.user));
	   	  			   uni.closeAuthView();
					   uni.$emit('refreshIM');
					   this.goPage()
	   	  		}
	   	  		else{
	   	  			uni.showToast({title: res.msg,icon: 'none'});
					uni.closeAuthView();
	   	  		}
	   	  	},
	   	  	rej => {}
	   	  );
	    },
	
	   getRegistrationID(){
		   this.registrationID=uni.getStorageSync("registrationID");
		    if(this.registrationID==null || this.registrationID==""){
		    	uni.getPushClientId({success: res => {
		    			uni.setStorageSync("registrationID",res.cid);
						this.registrationID = res.cid
		    		}
		    	});
		    }
	   },
	   goBack(){
		   uni.$emit('showHealthButler');
		    // this.$navBack();
			uni.redirectTo({
				url: "/pages/auth/loginIndex"
			});
	   },
	   goPage() {
	   		    let pages = getCurrentPages();
	   		    let url = pages[ pages.length - 1];
	   			let openUrl = uni.getStorageSync("openUrl");
	   			if(openUrl) {
	   				uni.navigateTo({
	   					url: openUrl,
	   					success: function(res) {
	   					    uni.removeStorageSync("openUrl")
	   					}
	   				})
	   			} 
				else {
	   				uni.reLaunch({
	   					// url: '../course/index',
	   					url: '/pages_im/pages/conversation/conversationList/index',
	   					animationType: 'none',
	   					animationDuration: 2000
	   				});
	   				return;
	   				if(pages.length == 1) {
	   					uni.reLaunch({
	   						// url: '../course/index',
							url: '/pages_im/pages/conversation/conversationList/index',
	   						//url: '../course/video/living-app',
	   						animationType: 'none',
	   						animationDuration: 2000
	   					});
	   				} else {
	   					//this.$navBack();
	   				}
	   			}
	   			this.$updateMsgDot()
	   			this.$setSource()
	   }
	       
	 
	}
	
}
</script>

<style scoped lang="scss">
	
 page{
 	background-color: #ffffff;
 }
 .other-login-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 80rpx;
	background: rgba(229, 138, 0, 0.08);
	border-radius: 40rpx;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #FF5C03;
 	border: 2rpx solid #FF5C03;
	margin-top: 30rpx;
	&::after {
		border: none;
	}
 }
 .content{
 	 display: flex;
 	 flex-direction: column;
 	 align-items: center;
 	 height: calc(100vh);
 	 width: 100%;
	 position: relative;
	 background: #ffffff;
	 // justify-content: space-between;
	 //padding-top: calc(100% - 32vh);
 }
 .backImg{
	 position: absolute;
	 left:30rpx;
	 top:40px;
	 height: 30rpx;
	 width: 30rpx;
 }
 
 .pageTop{
	 display: flex;
	 flex-direction: column;
	 width: 100%;
	 margin-top: 150px;
 }
 
 .content .head{
 	text-align: center;
 	width: 100%;
	height: 100rpx;
	// background:url(/static/image/login/top_bg.png) no-repeat 0 center;
	background-size: cover;
    box-sizing: border-box;
	font-size: 36rpx;
	font-weight: bold;
	color: #666;
 }


.title{
 	color: #141414;
 	margin:50upx 0upx 30upx 0rpx;
 	font-size: 38rpx;
	font-weight: 500;
 }
 .desc{
 	color: #686866;
 	padding:0 0 30rpx 0rpx;
 	font-size: 28rpx;
 }
 
 .loginBox{
 	padding:0 10px 30rpx;
	width: calc(100%) ;
	background: #FDFDFD;
	z-index: 10;
	position: relative;
	.login-item p{
		text-align: left;
	}
	.line{
		 height: 0.5rpx;
		 background-color: #efefef;
		 margin-top: 10rpx;
	}
	
	.input-account{
		margin-top: 20rpx;
		margin-bottom: 0rpx;
		border-radius:40rpx;
		border:solid 0rpx #efefef;
		height: 80rpx;	
		width: 100%;
		background:url(/static/account.png) no-repeat 0 center;
		background-size: 30rpx 30rpx;
		background-position: 30rpx;
	}
	.input-pwd{
		margin-top: 40rpx;
		margin-bottom: 20rpx;
		border-radius:40rpx;
		border:solid 0rpx #efefef;
		height: 80rpx;	
		width: 100%;
		background:url(/static/password.png) no-repeat 0 center;
		background-size: 30rpx 30rpx;
		background-position: 30rpx;
	}
	input{
		margin-left: 80rpx;
		height: 80rpx;
		line-height: 80rpx
	}
	.reg-box {
		 padding-bottom:20rpx;
		 margin:0 10px;
		 .reg-btn{
		 	 font-size:16px ;
		 	 color: #FF5C03;
		 }
	}
 }

 .btns{
 	margin: 60rpx 0rpx;
 }
 
 .login-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 80rpx;
	background: linear-gradient(to right, #FF5C03 0%, #FF5C03 100%);
	background: -moz-linear-gradient(to right, #FF5C03 0%, #FF5C03 100%);
	box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
	border-radius: 40rpx;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(255, 255, 255, 1);
 }
 
  
  
</style>