登录
This commit is contained in:
zoujiandong
parent
7af87512eb
commit
7003f55dec
@ -9,7 +9,7 @@
|
||||
v-if="!isPhoneLogin"
|
||||
>
|
||||
<up-input
|
||||
v-model="model.name"
|
||||
v-model="phone"
|
||||
placeholder="请输入肝胆相照专家版手机号"
|
||||
></up-input>
|
||||
</up-form-item>
|
||||
@ -57,7 +57,7 @@
|
||||
</template>
|
||||
</up-form-item> -->
|
||||
<up-form-item label="验证码" prop="userInfo.name" borderBottom>
|
||||
<up-input v-model="model.name" placeholder="请输入验证码"></up-input>
|
||||
<up-input v-model="code" placeholder="请输入验证码"></up-input>
|
||||
<template #right>
|
||||
<view class="wrap">
|
||||
<up-toast ref="uToastRef"></up-toast>
|
||||
@ -83,6 +83,7 @@
|
||||
|
||||
<view class="row" v-if="!isPhoneLogin">
|
||||
<up-button
|
||||
@click="phoneLogin"
|
||||
:customStyle="customStyle"
|
||||
class="custom-style"
|
||||
type="success"
|
||||
@ -110,11 +111,16 @@
|
||||
<view class="right" @click="goRegister"> 注册 </view>
|
||||
</view>
|
||||
<view class="row" style="margin-top:10rpx">
|
||||
<up-radio-group v-model="checked">
|
||||
<radio-group @click="radioChange">
|
||||
<label class="radio"><radio value="1" :checked="checked" color="rgb(41, 121, 255)" />
|
||||
我已阅读并同意<a class="agree">《用户协议》</a>
|
||||
</label>
|
||||
</radio-group>
|
||||
<!-- <up-radio-group v-model="checked">
|
||||
<up-radio
|
||||
label="我已阅读并同意<a>《用户协议》</a>"
|
||||
></up-radio>
|
||||
</up-radio-group>
|
||||
</up-radio-group> -->
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="tip">操作说明</view>
|
||||
@ -145,9 +151,8 @@ import { ref, reactive } from "vue";
|
||||
import { onShow } from "@dcloudio/uni-app";
|
||||
import api from "@/api/api";
|
||||
import auth from "@/utils/auth";
|
||||
const model = reactive({
|
||||
name: "",
|
||||
});
|
||||
const code = ref('');
|
||||
const phone = ref(null);
|
||||
const isPwdPic = ref(false);
|
||||
const isPhoneLogin = ref(true);
|
||||
const customStyle = reactive({
|
||||
@ -165,6 +170,9 @@ const tips = ref("");
|
||||
const seconds = ref(10);
|
||||
const uCodeRef = ref(null);
|
||||
const checked = ref(false);
|
||||
const radioChange = (e) => {
|
||||
checked.value =!checked.value;
|
||||
};
|
||||
const getPhoneNumber = (e) => {
|
||||
if (e.detail.errMsg === "getPhoneNumber:ok") {
|
||||
console.log(e.target.code)
|
||||
@ -185,6 +193,32 @@ const getPhoneNumber = (e) => {
|
||||
});
|
||||
}
|
||||
};
|
||||
const phoneLogin = () => {
|
||||
if (!isPhoneNum(phone.value)) return;
|
||||
if (!code.value){
|
||||
uni.showToast({
|
||||
title: "请输入验证码",
|
||||
icon: "none",
|
||||
});
|
||||
return false
|
||||
};
|
||||
auth().then((res) => {
|
||||
api.mobileLogin({
|
||||
code: code.value,
|
||||
phone: phone.value,
|
||||
wx_code: res,
|
||||
})
|
||||
.then((data) => {
|
||||
const { envVersion } = uni.getAccountInfoSync().miniProgram;
|
||||
if (envVersion == "release") {
|
||||
uni.setStorageSync("AUTH_TOKEN", data.token);
|
||||
} else {
|
||||
uni.setStorageSync("DEV_AUTH_TOKEN", data.token);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const isPhoneNum = (phonenum) => {
|
||||
let reg = /^1[3456789]\d{9}$/;
|
||||
if (!reg.test(phonenum)) {
|
||||
@ -209,22 +243,31 @@ const goRegister = () => {
|
||||
});
|
||||
};
|
||||
const getCode = () => {
|
||||
if (!isPhoneNum(phone.value)) return;
|
||||
if (uCodeRef.value.canGetCode) {
|
||||
// 模拟向后端请求验证码
|
||||
uni.showLoading({
|
||||
title: "正在获取验证码",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
// 这里此提示会被start()方法中的提示覆盖
|
||||
uni.$u.toast("验证码已发送");
|
||||
// 通知验证码组件内部开始倒计时
|
||||
uCodeRef.value.start();
|
||||
}, 2000);
|
||||
getSms();
|
||||
// setTimeout(() => {
|
||||
// uni.hideLoading();
|
||||
// // 这里此提示会被start()方法中的提示覆盖
|
||||
// uni.$u.toast("验证码已发送");
|
||||
// // 通知验证码组件内部开始倒计时
|
||||
// uCodeRef.value.start();
|
||||
// }, 2000);
|
||||
} else {
|
||||
uni.$u.toast("倒计时结束后再发送");
|
||||
}
|
||||
};
|
||||
const getSms=()=>{
|
||||
api.getCode({phone: phone.value}).then(res=>{
|
||||
uni.hideLoading();
|
||||
uni.$u.toast("验证码已发送");
|
||||
uCodeRef.value.start();
|
||||
})
|
||||
}
|
||||
const end = () => {
|
||||
customCode.opacity = 1;
|
||||
};
|
||||
@ -235,6 +278,18 @@ const start = () => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.radio{
|
||||
display: inline-flex;
|
||||
font-size: 28rpx;
|
||||
radio{
|
||||
transform:scale(0.8) translateY(-2px);
|
||||
|
||||
}
|
||||
.agree {
|
||||
background: none;
|
||||
color:#3cc7c0;
|
||||
}
|
||||
}
|
||||
.logincontent {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<view class="logincontent">
|
||||
<up-form labelPosition="left" :model="model" ref="form" labelWidth="115rpx">
|
||||
<web-view :src="src"></web-view>
|
||||
<!-- <up-form labelPosition="left" :model="model" ref="form" labelWidth="115rpx">
|
||||
<up-form-item
|
||||
label="手机号"
|
||||
prop="userInfo.name"
|
||||
@ -55,30 +56,32 @@
|
||||
</view>
|
||||
<view class="desc">
|
||||
若您有任何疑问或需要我们协助，请与您的小助手联系或直接微信联系<text class="red">igandan1000</text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive } from "vue";
|
||||
import { onShow } from "@dcloudio/uni-app";
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
const src = ref("https://wx.igandan.com/hcp/toRegister");
|
||||
const model = reactive({
|
||||
name: "",
|
||||
});
|
||||
|
||||
const isPwdPic = ref(false);
|
||||
const isPhoneLogin = ref(true);
|
||||
const customStyle = reactive({
|
||||
height: '90rpx',
|
||||
fontSize:'36rpx'
|
||||
height: "90rpx",
|
||||
fontSize: "36rpx",
|
||||
});
|
||||
const customCode = reactive({
|
||||
color: '#3ec7c0',
|
||||
height: '64rpx',
|
||||
fontSize:'28rpx',
|
||||
borderColor:'#e2e2e2',
|
||||
opcity:'1'
|
||||
color: "#3ec7c0",
|
||||
height: "64rpx",
|
||||
fontSize: "28rpx",
|
||||
borderColor: "#e2e2e2",
|
||||
opcity: "1",
|
||||
});
|
||||
const tips = ref('');
|
||||
const tips = ref("");
|
||||
const seconds = ref(10);
|
||||
const uCodeRef = ref(null);
|
||||
const isPhoneNum = (phonenum) => {
|
||||
@ -93,39 +96,38 @@ const isPhoneNum = (phonenum) => {
|
||||
return true;
|
||||
}
|
||||
};
|
||||
const validate=()=>{
|
||||
if(!(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/.test(pwd))){
|
||||
const validate = () => {
|
||||
if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/.test(pwd)) {
|
||||
uni.showToast({
|
||||
title: "密码应为6-16位数字或字母组合",
|
||||
icon: "none",
|
||||
})
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
const codeChange = (text) => {
|
||||
tips.value = text;
|
||||
};
|
||||
const goApply = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/apply/apply',
|
||||
url: "/pages/apply/apply",
|
||||
});
|
||||
};
|
||||
const getCode = () => {
|
||||
if (uCodeRef.value.canGetCode) {
|
||||
// 模拟向后端请求验证码
|
||||
uni.showLoading({
|
||||
title: '正在获取验证码',
|
||||
title: "正在获取验证码",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
// 这里此提示会被start()方法中的提示覆盖
|
||||
uni.$u.toast('验证码已发送');
|
||||
uni.$u.toast("验证码已发送");
|
||||
// 通知验证码组件内部开始倒计时
|
||||
uCodeRef.value.start();
|
||||
}, 2000);
|
||||
} else {
|
||||
uni.$u.toast('倒计时结束后再发送');
|
||||
uni.$u.toast("倒计时结束后再发送");
|
||||
}
|
||||
};
|
||||
const end = () => {
|
||||
@ -135,8 +137,14 @@ const end = () => {
|
||||
const start = () => {
|
||||
customCode.opacity = 0.5;
|
||||
};
|
||||
|
||||
|
||||
onLoad(() => {
|
||||
const { envVersion } = uni.getAccountInfoSync().miniProgram;
|
||||
if (envVersion == "release") {
|
||||
src.value = "https://wx.igandan.com/hcp/toRegister";
|
||||
} else {
|
||||
src.value = "https://dev-wx.igandan.com/hcp/toRegister";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -144,15 +152,15 @@ const start = () => {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: #fff;
|
||||
.pwdbox ::v-deep .u-form-item:nth-child(2) .u-form-item__body__left{
|
||||
width:180rpx!important;
|
||||
.pwdbox ::v-deep .u-form-item:nth-child(2) .u-form-item__body__left {
|
||||
width: 180rpx !important;
|
||||
}
|
||||
.smsbox ::v-deep .u-form-item:first-child .u-form-item__body__left{
|
||||
width:180rpx!important;
|
||||
.smsbox ::v-deep .u-form-item:first-child .u-form-item__body__left {
|
||||
width: 180rpx !important;
|
||||
}
|
||||
::v-deep .u-form-item__body__left__content__label{
|
||||
::v-deep .u-form-item__body__left__content__label {
|
||||
font-size: 34rpx;
|
||||
color:#000;
|
||||
color: #000;
|
||||
}
|
||||
.title {
|
||||
padding: 124rpx 0 64rpx 30rpx;
|
||||
@ -180,31 +188,31 @@ const start = () => {
|
||||
color: #666;
|
||||
text-align: right;
|
||||
}
|
||||
::v-deep .u-button--large .u-button__text{
|
||||
font-size:36rpx!important;
|
||||
::v-deep .u-button--large .u-button__text {
|
||||
font-size: 36rpx !important;
|
||||
}
|
||||
.tip{
|
||||
.tip {
|
||||
color: rgb(51, 51, 51);
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
::v-deep .wrap{
|
||||
::v-deep .wrap {
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
border:none;
|
||||
border: none;
|
||||
}
|
||||
// ::v-deep .custom-code .codetext,::v-deep .custom-code .u-button{
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-content: center;
|
||||
// color:#3ec7c0!important;
|
||||
// height:64rpx!important;
|
||||
// font-size: 28rpx!important;
|
||||
// border:none!important;
|
||||
// ::v-deep .custom-code .codetext,::v-deep .custom-code .u-button{
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-content: center;
|
||||
// color:#3ec7c0!important;
|
||||
// height:64rpx!important;
|
||||
// font-size: 28rpx!important;
|
||||
// border:none!important;
|
||||
|
||||
// }
|
||||
// }
|
||||
|
||||
.line{
|
||||
.line {
|
||||
padding: 0 30rpx;
|
||||
margin-top: 10rpx;
|
||||
color: rgb(153, 153, 153);
|
||||
@ -213,13 +221,13 @@ const start = () => {
|
||||
display: flex;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.desc{
|
||||
.desc {
|
||||
padding: 0 30rpx;
|
||||
color: rgb(153, 153, 153);
|
||||
line-height: 44rpx;
|
||||
font-size: 26rpx;
|
||||
letter-spacing: 2rpx;
|
||||
.red{
|
||||
.red {
|
||||
color: rgb(255, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user