登录和绑定手机

api/login.js

@@ -50,7 +50,7 @@ export function getCodeImg() {
 // 获取验证码
 export function loginApp(data) {
   return request({
-    'url': '/rescue/loginApp',
+    'url': '/rescue/loginQx',
     headers: {
       isToken: false
     },

pages.json

@@ -144,6 +144,13 @@
 			{
 				"navigationBarTitleText" : ""
 			}
+		},
+		{
+			"path" : "pages/login/bindPhoe",
+			"style" : 
+			{
+				"navigationBarTitleText" : ""
+			}
 		}
 	],
 	"globalStyle": {

pages/login/bindPhoe.vue

@@ -0,0 +1,217 @@
+<template>
+	<view class="container">
+		<view class="title">绑定手机号</view>
+		<view class="phone formItem">
+			<image style="width: 28rpx;height: 28rpx;" src="../../static/icons/order-icon2.png" mode="aspectFit">
+			</image>
+			<input v-model="phone" placeholder="请输入手机号" class="formItemInput" type="text" />
+		</view>
+		<view class="validaCode formItem">
+			<uni-icons type="locked"></uni-icons>
+			<input v-model="validaCode" class="formItemInput" placeholder="请输入验证码" type="text" />
+			<view :class="{ 'disabled': isButtonDisabled }" class="validaCodeBtn" @click="sendVerificationCode">{{buttonText}}</view>
+		</view>
+
+		<view class="submit" @click="bindPhone">
+			绑定
+		</view>
+	</view>
+</template>
+
+<script>
+	import { setToken } from '../../utils/auth';
+import request from '../../utils/request';
+	export default {
+		data() {
+			return {
+				phone: '15254781016',
+				validaCode: '',
+				countdownTime: 60,
+				isButtonDisabled: false,
+			}
+		},
+		computed: {
+			buttonText() {
+				if (this.isButtonDisabled) {
+					return `${this.countdownTime}s 后重新发送`;
+				} else {
+					return "获取验证码";
+				}
+			},
+		},
+		methods: {
+			sendVerificationCode() {
+				if (this.isButtonDisabled) {
+					return
+				}
+				let reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/;
+				if (!reg.test(this.phone)) {
+					uni.showToast({
+						icon: 'none',
+						title: '请输入正确的11位手机号'
+					})
+					this.phone = '';
+					return false;
+				}
+				if (this.isButtonDisabled) {
+					return; // 如果按钮已禁用，则直接返回
+				}
+				const data = {
+					phone: this.phone,
+				}
+				request({
+					url: '/rescue/sendSmsQx',
+					method: 'get',
+					params: data,
+					headers: {
+						isToken: false,
+					},
+					header: {
+						Authorization: 'Bearer ' + uni.getStorageSync('validaCodeToken')
+					}
+				}).then((res) => {
+					console.log('验证码', res);
+					if (res.code == 200) {
+						uni.showToast({
+							title: '验证码已发送 请注意查收',
+							icon: 'none'
+						})
+					} else {
+						uni.showToast({
+							title: '网络不佳请稍后再试',
+							icon: 'none'
+						})
+					}
+				})
+				this.disableButton(); // 禁用按钮
+				this.startCountdown(); // 启动倒计时
+			},
+			disableButton() {
+				this.isButtonDisabled = true;
+			},
+			enableButton() {
+				this.isButtonDisabled = false;
+			},
+			startCountdown() {
+				let countdown = setInterval(() => {
+					this.countdownTime--;
+					if (this.countdownTime === 0) {
+						clearInterval(countdown);
+						this.enableButton(); // 启用按钮
+					}
+				}, 1000);
+			},
+			bindPhone() {
+				let reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/;
+				if (!reg.test(this.phone)) {
+					uni.showToast({
+						icon: 'none',
+						title: '请输入正确的11位手机号'
+					})
+					this.phone = '';
+					return false;
+				}
+				if (!this.validaCode) {
+					uni.showToast({
+						icon: 'none',
+						title: '请输入验证码'
+					})
+					return false;
+				}
+				
+				request({
+					url: '/rescue/updateUserQx',
+					method: 'post',
+					data: {
+						phone: this.phone,
+						code: this.validaCode
+					},
+					headers: {
+						isToken: false,
+					},
+					header: {
+						Authorization: 'Bearer ' + uni.getStorageSync('validaCodeToken')
+					}
+				}).then(res => {
+					console.log('updateUserQx: ',res);
+					if (res.code == 200) {
+						setToken(uni.getStorageSync('validaCodeToken'))
+						uni.reLaunch({
+						  url: '/pages/home/home'
+						})
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+	.container {
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		row-gap: 40rpx;
+		background-color: #F5F5F5;
+
+		.title {
+			font-size: 40rpx;
+			font-weight: bold;
+			margin-bottom: 20rpx;
+		}
+
+		.formItem {
+			box-sizing: border-box;
+			width: 680rpx;
+			height: 100rpx;
+			border-radius: 50rpx;
+			background-color: #fff;
+			padding: 0 30rpx;
+
+			display: flex;
+			align-items: center;
+			column-gap: 16rpx;
+
+			.formItemInput {
+				flex: 1;
+				width: 0;
+			}
+
+			.validaCodeBtn {
+				background-color: #1890ff;
+				color: #fff;
+				height: 60rpx;
+				border-radius: 30rpx;
+				padding: 0 30rpx;
+				font-size: 28rpx;
+
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				
+				&.disabled {
+					background-color: #1890ff99;
+				}
+			}
+		}
+
+		.submit {
+			height: 100rpx;
+			border-radius: 50rpx;
+			width: 600rpx;
+			background-color: #1890ff;
+			color: #fff;
+
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+	}
+</style>

pages/login/login.vue

@@ -1,226 +1,449 @@
 <template>
-  <view class="content">
+	<view class="content">
-    <view class="top">
+		<view class="top">
-      <view class="inputs" >
+			<view class="touxiang">
-        <input type="text" v-model="userName" placeholder="请输入用户名">
+				<image src="../../static/xinlogo.png" mode=""></image>
-      </view>
+			</view>
-      <view class="inputs">
+			<view class="inputs">
-        <input type="password"  v-model="wrod" placeholder="请输入密码">
+				<input type="text" v-model="userName" placeholder="请输入用户名">
-      </view>
+			</view>
-    </view>
+			<view class="inputs">
-
+				<input type="password" v-model="wrod" placeholder="请输入密码">
-    <view class="dl" @click="getlogin()">
+			</view>
-      <text>登 录</text>
+			<view class="wjworb" @click="goforgot()">
-    </view>
+				<view class="">忘记密码</view>
-  </view>
+			</view>
+		</view>
+		<view class="dl" @click="getlogin()">
+			<text>登 录</text>
+		</view>
+		<!-- 	<view class="hging">
+			<text>没有账号？</text>
+			<text style="color: #0078FF;" @click="goregister()">立即注册</text>
+		</view> -->
+		<view class="dbottom">
+			<view class="quanzi" v-if="qindex == false " @click="qindex =! qindex"></view>
+			<view class="lanquanzi" v-if="qindex == true" @click="qindex =! qindex">
+				<uni-icons type="checkmarkempty" color="#ffffff" size="14"></uni-icons>
+			</view>
+			<text>请仔细阅读</text>
+			<text class="lan">《用户协议》</text>
+			<text>和</text>
+			<text class="lan">《隐私政策》</text>
+		</view>
+	</view>
 </template>
 
 <script>
-import request from '../../utils/request';
+	import request from '../../utils/request';
-import {setToken, setTenantId} from '../../utils/auth.js'
+	import {
-import {
+		loginApp
-  getTenantIdByWebsite
+	} from '@/api/login.js';
-} from '@/api/login.js'
+	import {
-export default{
+		setToken,
-  data(){
+		setTenantId
-    return{
+	} from '@/utils/auth.js'
-      phoneNumber: "",
+	import {
-      isButtonDisabled: false,
+		login,
-      countdownTime: 60,
+		getInfo,
-      qh:[
+		getTenantIdByWebsite
-        {text:'密码登录'},
+	} from '@/api/login.js'
-        {text:'验证码登录'}
+	export default {
-      ],
+		data() {
-      userName:'',
+			return {
-      yzm:'',
+				phoneNumber: "",
-      wrod:'',
+				baseUrl: this.$baseUrl,
-      activeid:0,
+				isButtonDisabled: false,
-      tenantCode: 'lanan'
+				countdownTime: 60,
-    }
+				qindex: false,
-  },
+				sfindex: 'user',
-  created() {
+				userName: '',
-    // getTenantIdByWebsite(this.tenantCode).then(res => {
+				yzm: '',
-    //   const tenantId = res.data;
+				wrod: '',
-    //   if (tenantId && tenantId >= 0) {
+				activeid: 0,
-    //     setTenantId(tenantId)
+				tenantCode: 'lanan'
-    //   }
+			}
-    // })
+		},
-  },
+		computed: {
-  computed: {
+			groupChange(n) {
-    buttonText() {
+				console.log('groupChange', n);
-      if (this.isButtonDisabled) {
+			},
-        return `${this.countdownTime}s 后重新发送`;
+			radioChange(n) {
-      } else {
+				console.log('radioChange', n);
-        return "获取验证码";
+			},
-      }
+			buttonText() {
-    },
+				if (this.isButtonDisabled) {
-  },
+					return `${this.countdownTime}s 后重新发送`;
-  methods:{
+				} else {
-    //登录请求
+					return "获取验证码";
-    getlogin(){
+				}
-      if(this.userName == ''){
+			},
-        uni.showToast({
+		},
-          title:'输入框不能为空！',
+		mounted() {},
-          icon:'none'
+		methods: {
-        })
-        return
-      }
 
-      let data ={
+			setidentity(text) {
-        username:this.userName,
+				this.sfindex = text
-        password:this.wrod,
-        type:0
-      }
-      console.log('密码请求',data);
-      request({
-        url: '/rescue/loginQx',
-        method: 'post',
-        data: data
-      }).then((res)=>{
-        console.log('密码请求',res);
-        if(res.code == 200){
-          setToken(res.data.accessToken)
 
-          uni.reLaunch({
+			},
-            url: '/pages/index/index'
+			//登录请求
-          })
+			getlogin() {
-        }
+				if (this.qindex != true) {
-      })
+					uni.showToast({
-    },
+						icon: "none",
-  }
+						title: "请阅读并勾选用户协议",
-}
+						duration: 2000
+					})
+					return;
+				}
+				if (this.userName == '') {
+					uni.showToast({
+						title: '输入框不能为空！',
+						icon: 'none'
+					})
+					return
+				}
 
+				uni.setStorageSync('identity', this.sfindex);
+
+				const loginFun = () => {
+					const data = {
+						username: this.userName,
+						password: this.wrod,
+						type: 0
+					}
+					loginApp(data).then(res => {
+						if (res.data.needMobile === "1") {
+							uni.navigateTo({
+								url: '/pages/login/bindPhoe'
+							})
+							uni.setStorageSync('validaCodeToken', res.data.accessToken)
+						} else {
+							setToken(res.data.accessToken)
+							uni.reLaunch({
+								url: '/pages/home/home'
+							})
+						}
+					})
+				}
+
+				getTenantIdByWebsite(this.tenantCode).then(res => {
+					if (res.code === 200 && res.data && res.data.length > 0) {
+						uni.showActionSheet({
+							itemList: res.data.map(m => m.name),
+							success: ({
+								tapIndex
+							}) => {
+								setTenantId(res.data[tapIndex].id)
+								loginFun()
+							}
+						})
+					} else {
+						setTenantId('')
+						loginFun()
+					}
+				})
+			},
+			getxz(index) {
+				this.activeid = index
+			},
+			goregister() {
+				uni.navigateTo({
+					url: '/pages/login/register'
+				})
+			},
+			goforgot() {
+				uni.navigateTo({
+					url: '/pages/login/forgot'
+				})
+			},
+			goselect() {
+				console.log('执行去救援', this.sfindex);
+				// pages/rescue/trafficPolice
+				if (this.sfindex == 'police') {
+					uni.reLaunch({
+						url: '/pages/rescue/trafficPolice'
+					})
+				} else {
+					uni.reLaunch({
+						url: '/pages/rescue/rescue'
+					})
+				}
+
+			},
+			// 验证码方法
+			sendVerificationCode() {
+				let reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/;
+				if (!reg.test(this.userName)) {
+					uni.showToast({
+						icon: 'none',
+						title: '请输入正确的11位手机号'
+					})
+					this.userName = '';
+					return false;
+				}
+				if (this.isButtonDisabled) {
+					return; // 如果按钮已禁用，则直接返回
+				}
+				const data = {
+					phone: this.userName,
+				}
+				request({
+					url: '/loginSmsCode',
+					method: 'post',
+					params: data
+				}).then((res) => {
+					console.log('验证码', res);
+					if (res.code == 200) {
+						uni.showToast({
+							title: '验证码已发送 请注意查收',
+							icon: 'none'
+						})
+					} else {
+						uni.showToast({
+							title: '网络不佳请稍后再试',
+							icon: 'none'
+						})
+					}
+				})
+
+
+				this.disableButton(); // 禁用按钮
+				this.startCountdown(); // 启动倒计时
+
+			},
+			disableButton() {
+				this.isButtonDisabled = true;
+			},
+			enableButton() {
+				this.isButtonDisabled = false;
+			},
+			startCountdown() {
+				let countdown = setInterval(() => {
+					this.countdownTime--;
+					if (this.countdownTime === 0) {
+						clearInterval(countdown);
+						this.enableButton(); // 启用按钮
+					}
+				}, 1000);
+			},
+		}
+	}
 </script>
 
 <style scoped lang="scss">
-.jsq{
+	.jsq {
-  border: none !important;
+		border: none !important;
-  font-size: 14px;
+		font-size: 14px;
-  font-weight: 400;
+		font-weight: 400;
-  color: #0078FF;
+		color: #0078FF;
-}
+	}
-button {
-  border: none !important;
-  background: none !important;
-  margin: 0px;
-  display: block;
-}
-button:focus {
-  color: #0078FF;
-  outline: none;
-  box-shadow: none;
-}
-.content{
-  box-sizing: border-box;
-}
-.top{
-  box-sizing: border-box;
-  padding: 0px 27px;
-  padding-top: 100px;
-  // background-color:lightseagreen;
-  //background-image: url('../../static/loginbj.png');
-  background-size: cover;
-  background-position: center;
-  width: 100%;
-  // height: 385px;
-}
-.touxiang{
-  width: 88px;
-  height: 88px;
-  border-radius: 10px;
-  background: #D7D7D7;
-  margin: 0 auto;
-  margin-bottom: 40px;
-  overflow: hidden;
-  image{
-    width: 100%;
-    height: 100%;
-  }
-}
-.twotap{
-  width: 100%;
-  display: flex;
-  align-items: center;
-  view{
-    font-size: 15px;
-    font-family: Microsoft YaHei;
-    font-weight: 400;
-    color: #666666;
-    margin-right: 38.5px;
-  }
-}
-.blck{
-  color: #333333 !important;
-  font-weight: bold !important;
-}
-.inputs{
-  box-sizing: border-box;
-  padding: 16px 0px;
-  display: flex;
-  align-items: center;
-  border-bottom: 2px solid #E8E8E8 ;
-  margin-top: 20px;
-}
-.wjworb{
-  margin-top: 5px;
-  width: 100%;
-  display: flex;
-  font-size: 12px;
-  color: #0078FF;
-  justify-content: flex-end;
-  align-items: center;
 
-}
+	button {
-.dl{
+		border: none !important;
-  width: 90%;
+		background: none !important;
-  height: 44px;
+		margin: 0px;
-  background: linear-gradient(-46deg, #0853C4 0%, #4282D8 80%);
+		display: block;
-  border-radius: 5px;
+	}
-  margin: 0 auto;
+
-  font-size: 16px;
+	button:focus {
-  color: #FFFFFF;
+		color: #0078FF;
-  display: flex;
+		outline: none;
-  justify-content: center;
+		box-shadow: none;
-  align-items: center;
+	}
-  margin-top: 22px;
+
-}
+	.content {
-.hging{
+		box-sizing: border-box;
-  width: 100%;
+	}
-  text-align: center;
+
-  font-size: 14px;
+	.top {
-  font-weight: 400;
+		box-sizing: border-box;
-  color: #636363;
+		padding: 0px 27px;
-  margin-top: 20px;
+		padding-top: 100px;
-}
+		background-image: url('../../static/loginbj.png');
-.wx{
+		// background-color:lightseagreen;
-  width: 38px;
+		// background-image: url('../../static/loginbj.png');
-  height: 38px;
+		background-size: cover;
-  overflow: hidden;
+		background-position: center;
-  box-sizing: border-box;
+		width: 100%;
-  margin: 0px auto;
+		// height: 385px;
-  margin-top: 20px;
+	}
-  image{
+
-    width: 100%;
+	.touxiang {
-    height: 100%;
+		width: 88px;
-  }
+		height: 88px;
-}
+		border-radius: 10px;
-.hui{
+		background: #D7D7D7;
-  font-size: 10px;
+		margin: 0 auto;
-  width: 100%;
+		margin-bottom: 40px;
-  text-align: center;
+		overflow: hidden;
-  font-weight: 400;
+
-  color: #666666;
+		image {
-}
+			width: 100%;
-.dbottom{
+			height: 100%;
-  width: 100%;
+		}
-  text-align: center;
+	}
-  font-size: 12px;
+
-  color: #333333;
+	.twotap {
-  margin-top: 40px;
+		width: 100%;
-  position: fixed;
+		display: flex;
-  bottom: 25px;
+		align-items: center;
-}
+
-.lan{
+		view {
-  color: #0078FF;
+			font-size: 15px;
-}
+			font-family: Microsoft YaHei;
-</style>
+			font-weight: 400;
+			color: #666666;
+			margin-right: 38.5px;
+		}
+	}
+
+	.blck {
+		color: #333333 !important;
+		font-weight: bold !important;
+	}
+
+	.inputs {
+		box-sizing: border-box;
+		padding: 16px 0px;
+		display: flex;
+		align-items: center;
+		border-bottom: 2px solid #E8E8E8;
+		margin-top: 20px;
+	}
+
+	.wjworb {
+		margin-top: 5px;
+		width: 100%;
+		display: flex;
+		font-size: 12px;
+		color: #0078FF;
+		justify-content: flex-end;
+		align-items: center;
+
+	}
+
+	.dl {
+		width: 90%;
+		height: 44px;
+		background: linear-gradient(-46deg, #0853C4 0%, #4282D8 80%);
+		border-radius: 5px;
+		margin: 0 auto;
+		font-size: 16px;
+		color: #FFFFFF;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		margin-top: 22px;
+	}
+
+	.hging {
+		width: 100%;
+		text-align: center;
+		font-size: 14px;
+		font-weight: 400;
+		color: #636363;
+		margin-top: 20px;
+	}
+
+	.wx {
+		width: 38px;
+		height: 38px;
+		overflow: hidden;
+		box-sizing: border-box;
+		margin: 0px auto;
+		margin-top: 20px;
+
+		image {
+			width: 100%;
+			height: 100%;
+		}
+	}
+
+	.hui {
+		font-size: 10px;
+		width: 100%;
+		text-align: center;
+		font-weight: 400;
+		color: #666666;
+	}
+
+	.dbottom {
+		width: 100%;
+		text-align: center;
+		font-size: 12px;
+		color: #333333;
+		margin-top: 40px;
+		position: fixed;
+		bottom: 25px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.quanzi {
+		width: 14px;
+		height: 14px;
+		border: 1px solid #666666;
+		border-radius: 50%;
+		margin-right: 10px;
+	}
+
+	.lanquanzi {
+		width: 14px;
+		height: 14px;
+		border: 1px solid #0078FF;
+		border-radius: 50%;
+		margin-right: 10px;
+		background: #0078FF;
+		color: white;
+	}
+
+	.lan {
+		color: #0078FF;
+	}
+
+	.jiuzhong {
+		width: 90%;
+		margin: 10px auto;
+		display: flex;
+		align-items: center;
+	}
+
+	.dist {
+		display: flex;
+		align-items: center;
+		margin: 0px 10px;
+	}
+
+	.d-zi {
+		font-size: 14px;
+	}
+
+	.d-qian {
+		width: 14px;
+		height: 14px;
+		margin-right: 5px;
+		overflow: hidden;
+		border-radius: 50%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border: 1px solid #666666;
+		color: white;
+	}
+
+	.d-qian-lan {
+		width: 14px;
+		height: 14px;
+		margin-right: 5px;
+		overflow: hidden;
+		border-radius: 50%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		background: #0078FF;
+		border: 1px solid #0078FF;
+		color: white;
+	}
+</style>