You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
398 lines
9.1 KiB
398 lines
9.1 KiB
<template>
|
|
<view class="normal-login-container">
|
|
<view class="logo-content">
|
|
<!-- <image style="width: 100rpx;height: 100rpx;" src="" mode="widthFix">
|
|
</image> -->
|
|
<view class="imgs_bg">
|
|
<image src="../../static/images/logo.png" mode="aspectFill" style="width: 100%; height: 100%;"></image>
|
|
</view>
|
|
<text class="title">佰安出行</text>
|
|
</view>
|
|
<view class="login-form-content">
|
|
<uni-forms :modelValue="loginForm" ref="loginform" :rules="rules" validate-trigger="blur">
|
|
<uni-forms-item name="phone">
|
|
<view class="input-item flex align-center">
|
|
<view class="icon iconfont icon-user"></view>
|
|
<input v-model="loginForm.phone" class="input" type="number" placeholder="请输入手机号码"
|
|
maxlength="11" />
|
|
</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item name="password">
|
|
<view class="input-item flex align-center" v-if="toggle_type">
|
|
<view class="icon iconfont icon-password"></view>
|
|
<input v-model="loginForm.password" class="input" placeholder="请输入验证码" maxlength="20" />
|
|
<view :class="iscode == false? 'getCode': 'getCode dis_code' " @click="handleCode">
|
|
{{getCodes}}
|
|
</view>
|
|
</view>
|
|
<view class="input-item flex align-center" v-else>
|
|
<view class="icon iconfont icon-password"></view>
|
|
<input v-model="loginForm.password" class="input" placeholder="请输入密码" maxlength="20" />
|
|
<!-- <view :class="iscode == false? 'getCode': 'getCode dis_code' " @click="handleCode">
|
|
{{getCodes}}
|
|
</view> -->
|
|
</view>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
<text class="toggle_login" @click="toggle_login">{{toggle_title}}</text>
|
|
<view class="action-btn">
|
|
<button @click="loging_btn" class="login-btn cu-btn block bg-blue lg round">登录</button>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="xieyi text-center">
|
|
<text class="text-grey1" style="font-size: 12px;">登录即代表同意</text>
|
|
<text @click="handleUserAgrement" class="text-blue" style="font-size: 12px;">《用户协议》</text>
|
|
<text @click="handlePrivacy" class="text-blue" style="font-size: 12px;">《隐私协议》</text>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
baseUrl,
|
|
apiPath
|
|
} from '@/sheep/config';
|
|
import sheep from '@/sheep';
|
|
import {
|
|
ref
|
|
} from 'vue'
|
|
// import loginApi from '@/sheep/api/login/login';
|
|
const loginForm = ref({
|
|
phone: '',
|
|
password: ''
|
|
})
|
|
const getCodes = ref('获取验证码')
|
|
const toggle_type = ref(true)
|
|
const toggle_title = ref('切换手机密码登录')
|
|
const iscode = ref(false)
|
|
const rules = {
|
|
phone: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入',
|
|
}]
|
|
},
|
|
password: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入',
|
|
}]
|
|
}
|
|
}
|
|
const loginform = ref(null)
|
|
|
|
function handleUserAgrement() {}
|
|
|
|
function handlePrivacy() {}
|
|
|
|
// function handleLogin() {
|
|
// uni.navigateTo({
|
|
// url: '/pages/index/authentication'
|
|
// });
|
|
// }
|
|
//
|
|
function loging_btn() {
|
|
|
|
loginform.value.validate().then(res => {
|
|
if (toggle_type.value) {
|
|
handleLogin()
|
|
} else {
|
|
handlelogin_pass()
|
|
}
|
|
}).catch(err => {})
|
|
|
|
}
|
|
//
|
|
function handleLogin() {
|
|
uni.request({
|
|
url: `${baseUrl + apiPath}/member/auth/sms-login`,
|
|
method: 'POST',
|
|
data: {
|
|
"mobile": loginForm.value.phone,
|
|
"code": loginForm.value.password,
|
|
"socialType": '',
|
|
"socialCode": "1024",
|
|
"socialState": "9b2ffbc1-7425-4155-9894-9d5c08541d62",
|
|
"socialCodeValid": true
|
|
},
|
|
header: {
|
|
'tenant-id': 1 //自定义请求头信息
|
|
},
|
|
success: (res) => {
|
|
// console.log(res,'res')
|
|
if (res.data.code == 0) {
|
|
uni.showToast({
|
|
icon: 'success',
|
|
title: '登录成功'
|
|
})
|
|
uni.setStorageSync('token', res.data.data.accessToken);
|
|
uni.setStorageSync('refresh-token', res.data.data.refreshToken);
|
|
uni.setStorageSync('userId', res.data.data.userId);
|
|
// uni.switchTab({
|
|
// url: '/pages/subpackages/mapnvue'
|
|
// });
|
|
handle_isaauth(res.data.data.accessToken)
|
|
// uni.navigateTo({
|
|
// url: '/pages/index/authentication'
|
|
// });
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.msg,
|
|
icon: 'error'
|
|
})
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
console.log(error, 'error')
|
|
}
|
|
});
|
|
}
|
|
|
|
function handlelogin_pass() {
|
|
uni.request({
|
|
url: `${baseUrl + apiPath}/member/auth/login`,
|
|
method: 'POST',
|
|
data: {
|
|
"mobile": loginForm.value.phone,
|
|
"password": loginForm.value.password,
|
|
"socialType": '',
|
|
"socialCode": "1024",
|
|
"socialState": "9b2ffbc1-7425-4155-9894-9d5c08541d62",
|
|
"socialCodeValid": true
|
|
},
|
|
header: {
|
|
'tenant-id': 1 //自定义请求头信息
|
|
},
|
|
success: (res) => {
|
|
// console.log(res,'res')
|
|
if (res.data.code == 0) {
|
|
uni.showToast({
|
|
icon: 'success',
|
|
title: '登录成功'
|
|
})
|
|
uni.setStorageSync('token', res.data.data.accessToken);
|
|
uni.setStorageSync('refresh-token', res.data.data.refreshToken);
|
|
uni.setStorageSync('userId', res.data.data.userId);
|
|
// uni.switchTab({
|
|
// url: '/pages/subpackages/mapnvue'
|
|
// });
|
|
handle_isaauth(res.data.data.accessToken)
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.msg,
|
|
icon: 'error'
|
|
})
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
console.log(error, 'error')
|
|
}
|
|
});
|
|
}
|
|
|
|
function handleCode() {
|
|
// console.log(loginForm.value.username,'loginform')
|
|
if (iscode.value == false && loginForm.value.phone != '') {
|
|
uni.request({
|
|
url: `${baseUrl + apiPath}/member/auth/send-sms-code`, //仅为示例，并非真实接口地址。
|
|
method: 'POST',
|
|
data: {
|
|
"mobile": loginForm.value.phone,
|
|
"scene": 1
|
|
},
|
|
|
|
header: {
|
|
'tenant-id': 1 //自定义请求头信息
|
|
},
|
|
success: (res) => {
|
|
// console.log(res, 'res')
|
|
if (res.data.code == 0) {
|
|
iscode.value = true
|
|
let num = 10
|
|
const timer = setInterval(() => {
|
|
num--
|
|
getCodes.value = num + 's'
|
|
if (num == 0) {
|
|
clearInterval(timer)
|
|
getCodes.value = '获取验证码'
|
|
iscode.value = false
|
|
}
|
|
}, 1000)
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'error',
|
|
title: '获取失败'
|
|
})
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
// 切换密码登录
|
|
function toggle_login() {
|
|
toggle_type.value = !toggle_type.value
|
|
if (toggle_type.value) {
|
|
toggle_title.value = '切换密码登录'
|
|
} else {
|
|
toggle_title.value = '切换手机验证码登录'
|
|
}
|
|
}
|
|
|
|
// 判断是否认证
|
|
function handle_isaauth(data) {
|
|
uni.request({
|
|
url: `${baseUrl + apiPath}/member/user/get-ext`,
|
|
method: 'GET',
|
|
header: {
|
|
'tenant-id': 1,
|
|
'Authorization': data
|
|
},
|
|
success: (res) => {
|
|
// console.log(res, 'res')
|
|
if (res.data.code == 0) {
|
|
uni.setStorageSync('avatar', res.data.data.avatar)
|
|
if (res.data.data.realNameAuthFlag == 1) {
|
|
uni.switchTab({
|
|
url: '/pages/subpackages/mapnvue'
|
|
});
|
|
} else if (res.data.data.realNameAuthFlag == 2) {
|
|
uni.showModal({
|
|
title: '账号未审核',
|
|
content: '您的账号当前处于待审核状态,请联系客服,审核后重试',
|
|
success: (res) => {
|
|
uni.redirectTo({
|
|
url: '/pages/subpackages/login'
|
|
})
|
|
}
|
|
});
|
|
uni.removeStorageSync('token')
|
|
} else {
|
|
uni.navigateTo({
|
|
url: '/pages/index/authentication'
|
|
});
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'error',
|
|
title: res.data.msg
|
|
})
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
console.log(error, 'error')
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
page {
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
.getCode {
|
|
font-size: 12px;
|
|
width: 300rpx;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
text-align: center;
|
|
background: #2caeff;
|
|
// border-top-right-radius: 45rpx;
|
|
// border-bottom-right-radius: 45rpx;
|
|
border-radius: 20px;
|
|
color: #fff;
|
|
}
|
|
|
|
.dis_code {
|
|
background: #ccc !important;
|
|
}
|
|
|
|
.normal-login-container {
|
|
width: 100%;
|
|
// background: #f6f6f6;
|
|
background-image: linear-gradient(#e6eafa,#c3cbfa);
|
|
height: 100vh;
|
|
|
|
.logo-content {
|
|
width: 100%;
|
|
font-size: 12px;
|
|
// text-align: center;
|
|
padding-top: 15%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
// image {
|
|
// border-radius: 4px;
|
|
// }
|
|
.imgs_bg {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
// background: #b5b5b5;
|
|
}
|
|
|
|
.title {
|
|
margin-top: 15rpx;
|
|
}
|
|
}
|
|
|
|
.login-form-content {
|
|
text-align: center;
|
|
margin: 20px auto;
|
|
margin-top: 15%;
|
|
width: 80%;
|
|
|
|
.input-item {
|
|
margin: 5px auto;
|
|
background-color: #fff;
|
|
height: 90rpx;
|
|
border-radius: 20px;
|
|
|
|
.icon {
|
|
font-size: 38rpx;
|
|
margin-left: 10px;
|
|
color: #999;
|
|
}
|
|
|
|
.input {
|
|
width: 100%;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
text-align: left;
|
|
padding-left: 15px;
|
|
}
|
|
|
|
}
|
|
|
|
.login-btn {
|
|
margin-top: 15px;
|
|
height: 45px;
|
|
}
|
|
|
|
.xieyi {
|
|
color: #333;
|
|
margin-top: 20px;
|
|
|
|
>text {
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.easyinput {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.login-code-img {
|
|
height: 45px;
|
|
}
|
|
|
|
.toggle_login {
|
|
font-size: 12px;
|
|
color: #2caeff;
|
|
text-decoration: underline;
|
|
}
|
|
</style> |