284 lines
6.8 KiB
Vue
284 lines
6.8 KiB
Vue
<template>
|
|
<view class="main_div max_page">
|
|
<view class="bg_div">
|
|
<image src="/static/images/login/bg.png" class="bg_img"></image>
|
|
<view class="profile_div">
|
|
<image src="/static/images/login/profile.png" class="profile"></image>
|
|
</view>
|
|
<view class="title_logo">
|
|
<image src="/static/images/login/logo_text.png" class="log_img"></image>
|
|
<view class="fl1"></view>
|
|
</view>
|
|
<view class="title_text_div">
|
|
<view class="title_text font_pf">
|
|
欢迎登录
|
|
</view>
|
|
<image src="/static/images/login/clap.png" class="title_text_img"></image>
|
|
</view>
|
|
<view class="title_text_tip font_pf">
|
|
登录账号即可查看更多精彩咨询
|
|
</view>
|
|
</view>
|
|
<view class="account_password_div">
|
|
<view class="title1 font_pf">
|
|
账号
|
|
</view>
|
|
<uv-input class="account_input" v-model="account" :maxlength="30" placeholder="请输入账号"></uv-input>
|
|
<view class="title2 font_pf">
|
|
密码
|
|
</view>
|
|
<uv-input class="account_input" v-model="password" :maxlength="20" placeholder="请输入密码"
|
|
:type="show_password ? 'text' : 'password'" :password-icon="true">
|
|
<template v-slot:suffix>
|
|
<view class="show_password" @click="show_password=!show_password">
|
|
<image v-if="show_password" class="img_100" src="@/static/images/login/show.png"></image>
|
|
<image v-else class="img_100" src="@/static/images/login/no_show.png"></image>
|
|
</view>
|
|
</template>
|
|
</uv-input>
|
|
</view>
|
|
<view class="fl1"></view>
|
|
<view class="bottom_login_div">
|
|
<view class="" @click="login_fun">
|
|
<uv-button class="bottom_login_button" type="primary" :throttleTime="500"
|
|
:disabled="login_button_status">登录</uv-button>
|
|
</view>
|
|
<view class="ysxy_div">
|
|
<uv-checkbox-group v-model="read_text_state">
|
|
<uv-checkbox></uv-checkbox>
|
|
</uv-checkbox-group>
|
|
<view class="ysxy_tip font_pf">
|
|
已阅读并同意
|
|
<!-- #ifdef APP -->
|
|
<span class="ysxy_term" @click="common.navigateTo('/pages/login/ysxy')">《服务条款》</span>
|
|
<!-- #endif -->
|
|
<!-- #ifndef APP -->
|
|
<span class="ysxy_term" @click="common.navigateTo('/pages/login/ysxy')">《服务条款》</span>
|
|
<!-- #endif -->
|
|
与
|
|
<span class="ysxy_term">《隐私权政策》</span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
// import { v4 as uuid4 } from 'uuid'
|
|
import {onBackPress} from '@dcloudio/uni-app'
|
|
import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
|
|
import common from '@/common/common'
|
|
import { useAccountLoginApp, queryCurrentUser } from '@/api/login.js'
|
|
import { encryptByAES } from '@/api/encryptAndDecryptData.js'
|
|
|
|
const show_password = ref<Boolean>(false)
|
|
const account = ref<string>('')
|
|
const password = ref<string>('')
|
|
const read_text_state = ref<Array<unknown>>([])
|
|
const back_state = ref(true)
|
|
// 登录按钮状态
|
|
const login_button_status = computed<boolean>(() => !read_text_state.value.length)
|
|
|
|
// 登录方法
|
|
const login_fun = () : void => {
|
|
// 验证
|
|
if (login_button_status.value) return common.msg('请阅读并同意《隐私政策》')
|
|
if (account.value === '') return common.msg('账号不能为空')
|
|
if (password.value === '') return common.msg('密码不能为空')
|
|
try {
|
|
common.loading('登录中')
|
|
const secretKey = 'EtBzqj+ln5tSTof1SDhpTg==';
|
|
const cipherText = encryptByAES(password.value, secretKey);
|
|
useAccountLoginApp({ loginName: account.value, password: cipherText }).then(async () => {
|
|
common.hideLoading()
|
|
common.msg('登录成功')
|
|
// 登陆成功，缓存账号密码
|
|
common.setValue('loginAccountData', {
|
|
account: account.value,
|
|
password: password.value
|
|
});
|
|
// setTimeout(() => {
|
|
// this.$common.reLaunch('/pages/homepage/index');
|
|
// }, this.GLOBAL_TIMER_SUBMIT_DELAY_TIME);
|
|
const pages = getCurrentPages()
|
|
console.log(pages.length, 'length');
|
|
if (pages.length >= 2) { // 页面栈只有一页，没有返回页，那就返回首页
|
|
console.log('返回登录的上一页');
|
|
back_state.value = false
|
|
common.navigateBack() // 返回登录的上一页
|
|
} else {
|
|
common.switchTab('/pages/index/index')
|
|
}
|
|
}).catch(res => {
|
|
console.log(res);
|
|
common.hideLoading()
|
|
if (res.rtnCode === "0002") {
|
|
common.msg('账号或密码错误，如忘记密码，请去统一身份认证平台修改。')
|
|
}else if (res.rtnCode !== "0005") {
|
|
common.msg('登录出错，请稍后再试')
|
|
}
|
|
})
|
|
} catch (e) {
|
|
common.hideLoading()
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
let loginAccountData = common.getValue('loginAccountData');
|
|
if (loginAccountData) {
|
|
account.value = loginAccountData.account;
|
|
password.value = loginAccountData.password;
|
|
}
|
|
back_state.value = true
|
|
|
|
})
|
|
// 跳进了登录页，禁止返回操作
|
|
onBackPress(() => back_state.value)
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bottom_login_div {
|
|
padding: 0 58rpx;
|
|
margin-bottom: 93rpx;
|
|
|
|
.ysxy_div {
|
|
margin-top: 27rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.ysxy_tip {
|
|
font-size: 23rpx;
|
|
color: #999999;
|
|
|
|
.ysxy_term {
|
|
color: #0066FF;
|
|
}
|
|
}
|
|
|
|
:deep(.uv-checkbox-group) {
|
|
flex: 0;
|
|
}
|
|
}
|
|
|
|
.bottom_login_button {
|
|
border: none;
|
|
border-radius: 16rpx;
|
|
background-color: #0066FF;
|
|
color: #FFFFFF;
|
|
overflow: hidden;
|
|
:deep(.uv-button) {
|
|
height: 100rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.account_password_div {
|
|
padding: 0 58rpx;
|
|
z-index: 50;
|
|
|
|
.title1 {
|
|
font-size: 28rpx;
|
|
font-weight: 600;
|
|
height: 40rpx;
|
|
margin-top: 8rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.title2 {
|
|
font-size: 28rpx;
|
|
font-weight: 600;
|
|
height: 40rpx;
|
|
margin-top: 54rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.account_input {
|
|
height: 100rpx;
|
|
background-color: #F4F8FF;
|
|
border: none;
|
|
border-radius: 16rpx;
|
|
|
|
::v-deep .u-input__content__field-wrapper__field {
|
|
font-size: 26rpx !important;
|
|
}
|
|
|
|
.show_password {
|
|
margin-right: 6rpx;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.bg_div {
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
padding: 0 50rpx;
|
|
height: 496rpx;
|
|
// border: 1px solid red;
|
|
|
|
.bg_img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
z-index: -1;
|
|
}
|
|
|
|
.profile_div {
|
|
position: absolute;
|
|
bottom: -96rpx;
|
|
right: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
z-index: 10;
|
|
|
|
.profile {
|
|
width: 328rpx;
|
|
height: 424rpx;
|
|
}
|
|
}
|
|
|
|
.title_logo {
|
|
display: flex;
|
|
margin-top: 120rpx;
|
|
|
|
.log_img {
|
|
width: 380rpx;
|
|
height: 70rpx;
|
|
}
|
|
}
|
|
|
|
.title_text_div {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 84rpx;
|
|
|
|
.title_text {
|
|
font-weight: 700;
|
|
font-size: 46rpx;
|
|
}
|
|
|
|
.title_text_img {
|
|
width: 48rpx;
|
|
height: 62rpx;
|
|
}
|
|
}
|
|
|
|
.title_text_tip {
|
|
margin-top: 10rpx;
|
|
font-size: 26rpx;
|
|
color: #999999;
|
|
}
|
|
}
|
|
|
|
.main_div {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
</style> |