2024-08-07 14:53:53 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<view class="normal-login-container">
|
|
|
|
|
|
<view class="logo-content align-center justify-center flex">
|
|
|
|
|
|
<view class="logo-img"></view>
|
|
|
|
|
|
<view class="title">作业管控智慧平台</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="login-form-content">
|
|
|
|
|
|
<view class="login-form">
|
|
|
|
|
|
<view class="login-form-tab">
|
|
|
|
|
|
<view class="login-tab" :class="{'active':selectTab==1}" @click="selectTab=1">密码登录</view>
|
|
|
|
|
|
<view class="login-tab" :class="{'active':selectTab==2}" @click="selectTab=2">验证码登录</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="login-box" v-if="selectTab==1">
|
|
|
|
|
|
<u-form :model="loginForm" ref="uForm" :rules="rules">
|
|
|
|
|
|
<u-form-item label="" prop="phone">
|
|
|
|
|
|
<u--input class="login-input" placeholder="请输入您的手机号" border="surround" prefixIcon="account"
|
|
|
|
|
|
v-model="loginForm.phone" save="false">
|
|
|
|
|
|
</u--input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-form-item label="" prop="pd">
|
|
|
|
|
|
<u-input class="login-input" :type="isOpen?'text':'password'" placeholder="请输入密码"
|
|
|
|
|
|
prefixIcon="lock" v-model="loginForm.pd" save="false" autocomplete="new-password">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<image @click="isOpen=!isOpen"
|
|
|
|
|
|
style="width: 40rpx;height: 40rpx;margin-right: 10rpx; z-index: 1;"
|
|
|
|
|
|
:src="isOpen?'../static/images/design_ic_visibility.png':'../static/images/design_ic_visibility_off.png'">
|
|
|
|
|
|
</image>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u-input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<view style="text-align: right;color: #00367a;float: right;font-size: 30rpx;" @click="restPas">
|
|
|
|
|
|
忘记密码</view>
|
|
|
|
|
|
<u-button class="loginBtn" style="margin-top: 70rpx;" @click="submit"
|
|
|
|
|
|
color="#00367a">登录</u-button>
|
|
|
|
|
|
</u-form>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="login-box" v-show="selectTab==2">
|
|
|
|
|
|
<u--form :model="loginForm0" ref="uForm0" :rules="rules0">
|
|
|
|
|
|
<u-form-item label="" prop="phone">
|
|
|
|
|
|
<u--input class="login-input" placeholder="请输入您的手机号" border="surround" prefixIcon="account"
|
|
|
|
|
|
v-model="loginForm0.phone"></u--input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-form-item label="" prop="code">
|
|
|
|
|
|
<!-- 注意：由于兼容性差异，如果需要使用前后插槽，nvue下需使用u--input，非nvue下需使用u-input -->
|
|
|
|
|
|
<!-- #ifndef APP-NVUE -->
|
|
|
|
|
|
<u-input prefixIcon="email" class="login-input" placeholder="验证码" border="surround"
|
|
|
|
|
|
v-model="loginForm0.code">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<u-code ref="uCode" @change="codeChange" seconds="60" changeText="X秒重新获取"></u-code>
|
|
|
|
|
|
<u-button @tap="getCode(2)" :text="tips" type="success" size="normal"
|
|
|
|
|
|
style="margin: -6px 10px" color="#00367a"></u-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u-input>
|
|
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifdef APP-NVUE -->
|
|
|
|
|
|
<u--input prefixIcon="email" class="login-input" placeholder="验证码" border="surround"
|
|
|
|
|
|
v-model="loginForm0.code">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<u-code ref="uCode" @change="codeChange" seconds="60" changeText="X秒重新获取"></u-code>
|
|
|
|
|
|
<u-button @tap="getCode(2)" :text="tips" type="success" size="mini"
|
|
|
|
|
|
color="#00367a"></u-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u--input>
|
|
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<u-button class="loginBtn" style="margin-top: 30rpx;" @click="submit0"
|
|
|
|
|
|
color="#00367a">登录</u-button>
|
|
|
|
|
|
</u--form>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view>
|
|
|
|
|
|
<!-- 普通弹窗 -->
|
|
|
|
|
|
<uni-popup ref="popup" background-color="#fff" @change="change">
|
|
|
|
|
|
<view class="popup-content">
|
|
|
|
|
|
<u--form :model="restForm" ref="uForm3" :rules="rules3" labelWidth="60">
|
|
|
|
|
|
<u-form-item label="手机号" prop="phone">
|
|
|
|
|
|
<u--input class="login-input" placeholder="请输入您的手机号" border="surround" prefixIcon="account"
|
|
|
|
|
|
v-model="restForm.phone" save="false"></u--input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-form-item label="新密码" prop="password">
|
|
|
|
|
|
<u-input class="login-input" :type="isOpen2?'text':'password'" placeholder="请输入密码"
|
|
|
|
|
|
prefixIcon="lock" v-model="restForm.password" save="false" autocomplete="new-password">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<image @click="isOpen2=!isOpen2"
|
|
|
|
|
|
style="width: 40rpx;height: 40rpx;margin-right: 10rpx; z-index: 999;"
|
|
|
|
|
|
:src="isOpen2?'../static/images/design_ic_visibility.png':'../static/images/design_ic_visibility_off.png'">
|
|
|
|
|
|
</image>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u-input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-form-item label="新密码" prop="passwordA">
|
|
|
|
|
|
<u-input class="login-input" :type="isOpen3?'text':'password'" placeholder="请再次输入密码"
|
|
|
|
|
|
prefixIcon="lock" v-model="restForm.passwordA" save="false" autocomplete="new-password">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<image @click="isOpen3=!isOpen3"
|
|
|
|
|
|
style="width: 40rpx;height: 40rpx;margin-right: 10rpx; z-index: 999;"
|
|
|
|
|
|
:src="isOpen3?'../static/images/design_ic_visibility.png':'../static/images/design_ic_visibility_off.png'">
|
|
|
|
|
|
</image>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u-input>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-form-item label="验证码" prop="code">
|
|
|
|
|
|
<!-- 注意：由于兼容性差异，如果需要使用前后插槽，nvue下需使用u--input，非nvue下需使用u-input -->
|
|
|
|
|
|
<!-- #ifndef APP-NVUE -->
|
|
|
|
|
|
<u-input prefixIcon="email" class="login-input" placeholder="验证码" border="surround"
|
|
|
|
|
|
v-model="restForm.code">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<u-code ref="uCode" @change="codeChange" seconds="60" changeText="X秒重新获取"></u-code>
|
|
|
|
|
|
<u-button @tap="getCode(3)" :text="tips" type="success" size="normal"
|
|
|
|
|
|
style="margin: -6px 10px" color="#00367a"></u-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u-input>
|
|
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifdef APP-NVUE -->
|
|
|
|
|
|
<u--input prefixIcon="email" class="login-input" placeholder="验证码" border="surround"
|
|
|
|
|
|
v-model="restForm.code">
|
|
|
|
|
|
<template slot="suffix">
|
|
|
|
|
|
<u-code ref="uCode" @change="codeChange" seconds="60" changeText="X秒重新获取"></u-code>
|
|
|
|
|
|
<u-button @tap="getCode(3)" :text="tips" type="success" size="mini"
|
|
|
|
|
|
color="#00367a"></u-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</u--input>
|
|
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
<u-button class="loginBtn" style="margin-top: 70rpx;" @click="submit3"
|
|
|
|
|
|
color="#00367a">确认</u-button>
|
|
|
|
|
|
</u--form>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</uni-popup>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<u-toast ref="uToast"></u-toast>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import {
|
|
|
|
|
|
sendCodeByPhone,
|
|
|
|
|
|
forgetPwdByApp
|
|
|
|
|
|
} from "@/api/index.js"
|
|
|
|
|
|
import {getDeleteUser} from "@/utils/auth.js"
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
|
data() {
|
|
|
|
|
|
const equalToPassword = (rule, value, callback) => {
|
|
|
|
|
|
if (this.restForm.password !== value) {
|
|
|
|
|
|
callback(new Error("两次输入的密码不一致"));
|
|
|
|
|
|
} else {
|
|
|
|
|
|
callback();
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
|
|
|
|
|
// 密码校验 长度不能小于8位且不能大于16位字符,必须包含大写字母、小写字母、数字和特殊符号
|
|
|
|
|
|
var ISPWD =
|
|
|
|
|
|
/^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*,\._\+(){}])[0-9a-zA-Z!@#$%^&*,\\._\+(){}]{8,16}$/;
|
|
|
|
|
|
// 密码校验
|
|
|
|
|
|
const validatePassword = (rule, value, callback) => {
|
|
|
|
|
|
if (!ISPWD.test(this.restForm.password)) {
|
|
|
|
|
|
callback(new Error("用户密码必须包含大写字母、小写字母、数字和特殊符号"));
|
|
|
|
|
|
} else {
|
|
|
|
|
|
callback();
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
|
|
|
// globalConfig: getApp().globalData.config,
|
|
|
|
|
|
selectTab: 1,
|
|
|
|
|
|
loginForm: {
|
|
|
|
|
|
phone: 15856165378,
|
|
|
|
|
|
pd: 'YNsbd@123456',//YNsbd@123456
|
|
|
|
|
|
},
|
|
|
|
|
|
loginForm0: {
|
|
|
|
|
|
phone: this.$store.state.user.phone,
|
|
|
|
|
|
code: ""
|
|
|
|
|
|
},
|
|
|
|
|
|
restForm: {
|
|
|
|
|
|
phone: "",
|
|
|
|
|
|
password: "",
|
|
|
|
|
|
passwordA: "",
|
|
|
|
|
|
code: ""
|
|
|
|
|
|
},
|
|
|
|
|
|
rules: {
|
|
|
|
|
|
phone: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入手机号',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}],
|
|
|
|
|
|
pd: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入密码',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}]
|
|
|
|
|
|
},
|
|
|
|
|
|
rules0: {
|
|
|
|
|
|
phone: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入手机号',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}],
|
|
|
|
|
|
code: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入验证码',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}],
|
|
|
|
|
|
},
|
|
|
|
|
|
rules3: {
|
|
|
|
|
|
phone: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入手机号',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}],
|
|
|
|
|
|
|
|
|
|
|
|
code: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请输入验证码',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
}],
|
|
|
|
|
|
password: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
message: "请输入您的密码"
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
min: 8,
|
|
|
|
|
|
max: 16,
|
|
|
|
|
|
message: '用户密码长度必须介于 8 和 16 之间',
|
|
|
|
|
|
trigger: 'blur'
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
validator: validatePassword,
|
|
|
|
|
|
trigger: 'blur'
|
|
|
|
|
|
}
|
|
|
|
|
|
],
|
|
|
|
|
|
passwordA: [{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: '请再次输入新密码',
|
|
|
|
|
|
trigger: ['blur', 'change']
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
validator: equalToPassword,
|
|
|
|
|
|
trigger: "blur"
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
},
|
|
|
|
|
|
tips: '',
|
|
|
|
|
|
type: 'center',
|
|
|
|
|
|
isOpen: false,
|
|
|
|
|
|
isOpen2: false,
|
|
|
|
|
|
isOpen3: false,
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
|
|
|
|
|
|
change(e) {
|
|
|
|
|
|
console.log('当前模式：' + e.type + ',状态：' + e.show);
|
|
|
|
|
|
},
|
|
|
|
|
|
restPas() {
|
|
|
|
|
|
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
|
|
|
|
|
this.$refs.popup.open(this.type)
|
|
|
|
|
|
},
|
|
|
|
|
|
// // 登录方法
|
|
|
|
|
|
// async handleLogin() {
|
|
|
|
|
|
// if (this.loginForm.username === "") {
|
|
|
|
|
|
// this.$modal.msgError("请输入您的账号")
|
|
|
|
|
|
// } else if (this.loginForm.password === "") {
|
|
|
|
|
|
// this.$modal.msgError("请输入您的密码")
|
|
|
|
|
|
// } else if (this.loginForm.code === "") {
|
|
|
|
|
|
// this.$modal.msgError("请输入验证码")
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
// this.$modal.loading("登录中，请耐心等待...")
|
|
|
|
|
|
// this.pwdLogin()
|
|
|
|
|
|
// }
|
|
|
|
|
|
// },
|
|
|
|
|
|
// // 密码登录
|
|
|
|
|
|
// async pwdLogin() {
|
|
|
|
|
|
// this.$store.dispatch('Login', this.loginForm).then(() => {
|
|
|
|
|
|
// this.$modal.closeLoading()
|
|
|
|
|
|
// this.loginSuccess()
|
|
|
|
|
|
// }).catch(() => {})
|
|
|
|
|
|
// },
|
|
|
|
|
|
// // 登录成功后，处理函数
|
|
|
|
|
|
// loginSuccess(result) {
|
|
|
|
|
|
// // 设置用户信息
|
|
|
|
|
|
// this.$store.dispatch('GetInfo').then(res => {
|
|
|
|
|
|
// this.$tab.reLaunch('/pages/index')
|
|
|
|
|
|
// })
|
|
|
|
|
|
// },
|
|
|
|
|
|
codeChange(text) {
|
|
|
|
|
|
this.tips = text;
|
|
|
|
|
|
},
|
|
|
|
|
|
getCode(type) {
|
|
|
|
|
|
if ((type == 2 && this.loginForm0.phone == '') || (type == 3 && this.restForm.phone == '')) {
|
|
|
|
|
|
uni.$u.toast('请输入手机号');
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
if (this.$refs.uCode.canGetCode) {
|
|
|
|
|
|
// 模拟向后端请求验证码
|
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
|
title: '正在获取验证码'
|
|
|
|
|
|
})
|
|
|
|
|
|
let params = {
|
|
|
|
|
|
type: type
|
|
|
|
|
|
}
|
|
|
|
|
|
if (type == 2) {
|
|
|
|
|
|
params.phone = this.loginForm0.phone
|
|
|
|
|
|
} else {
|
|
|
|
|
|
params.phone = this.restForm.phone
|
|
|
|
|
|
}
|
|
|
|
|
|
sendCodeByPhone(params).then(response => {
|
|
|
|
|
|
uni.hideLoading();
|
|
|
|
|
|
if (response.code == 200) {
|
|
|
|
|
|
// 这里此提示会被this.start()方法中的提示覆盖
|
|
|
|
|
|
uni.$u.toast('验证码已发送');
|
|
|
|
|
|
// 通知验证码组件内部开始倒计时
|
|
|
|
|
|
this.$refs.uCode.start();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.$u.toast('验证码发送失败');
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.$u.toast('倒计时结束后再发送');
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
submit() {
|
|
|
|
|
|
var user=getDeleteUser()||[]
|
|
|
|
|
|
if(user.includes(this.loginForm.phone)){
|
|
|
|
|
|
uni.$u.toast("该账号已注销")
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$refs.uForm.validate().then(res => {
|
|
|
|
|
|
// uni.$u.toast('校验通过')
|
|
|
|
|
|
this.$store.dispatch('Login', this.loginForm).then((res) => {
|
|
|
|
|
|
console.log(res)
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.isLogin = true
|
|
|
|
|
|
uni.reLaunch({
|
|
|
|
|
|
url: "/pages/gzt/index"
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.$u.toast(res.msg)
|
|
|
|
|
|
this.isLogin = false
|
|
|
|
|
|
}
|
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
uni.$u.toast("登录失败")
|
|
|
|
|
|
this.$store.dispatch('LogOut').then(() => {
|
|
|
|
|
|
console.log(err)
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: err,
|
|
|
|
|
|
icon: "none"
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
}).catch(errors => {
|
|
|
|
|
|
// uni.$u.toast('校验失败')
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
submit0() {
|
|
|
|
|
|
var user=getDeleteUser()||[]
|
|
|
|
|
|
if(user.includes(this.loginForm.phone)){
|
|
|
|
|
|
uni.$u.toast("该账号已注销")
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
// console.log(this.loginForm0)
|
|
|
|
|
|
this.$refs.uForm0.validate().then(res => {
|
|
|
|
|
|
this.$store.dispatch('LoginCode', this.loginForm0).then((res) => {
|
|
|
|
|
|
console.log(res)
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.isLogin = true
|
|
|
|
|
|
uni.switchTab({
|
|
|
|
|
|
url: "/pages/gzt/index"
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.$u.toast(res.msg)
|
|
|
|
|
|
this.isLogin = false
|
|
|
|
|
|
}
|
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
uni.$u.toast("登录失败")
|
|
|
|
|
|
this.$store.dispatch('LogOut').then(() => {
|
|
|
|
|
|
console.log(err)
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: err,
|
|
|
|
|
|
icon: "none"
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
}).catch(errors => {
|
|
|
|
|
|
// uni.$u.toast('校验失败')
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
submit3() {
|
|
|
|
|
|
let _this = this
|
|
|
|
|
|
this.$refs.uForm3.validate().then(res => {
|
|
|
|
|
|
let form = {
|
|
|
|
|
|
phone: this.restForm.phone,
|
|
|
|
|
|
pd: this.restForm.password,
|
|
|
|
|
|
code: this.restForm.code,
|
|
|
|
|
|
type: 3
|
|
|
|
|
|
}
|
|
|
|
|
|
forgetPwdByApp(form).then(res => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.closePwd()
|
|
|
|
|
|
this.$refs.uToast.show({
|
|
|
|
|
|
type: 'success',
|
|
|
|
|
|
message: "密码修改成功",
|
|
|
|
|
|
})
|
|
|
|
|
|
// setTimeout(_this.logout(), 50000);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.$u.toast(res.msg)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
}).catch(errors => {
|
|
|
|
|
|
// uni.$u.toast('校验失败')
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
closePwd() {
|
|
|
|
|
|
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
|
|
|
|
|
this.$refs.popup.close("center")
|
|
|
|
|
|
},
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
|
page {
|
|
|
|
|
|
background-color: #ffffff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.popup-content {
|
|
|
|
|
|
@include flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
padding: 15px;
|
|
|
|
|
|
height: 750rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
max-width: 600rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.normal-login-container {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100vh;
|
|
|
|
|
|
background: linear-gradient(to bottom, #00367a 70%, #fff 30%);
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.logo-content {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
padding-top: 20%;
|
|
|
|
|
|
padding-bottom: 20%;
|
|
|
|
|
|
letter-spacing: 8rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
padding-top: 50rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.logo-img {
|
|
|
|
|
|
background-image: url("../static/images/logo.png");
|
|
|
|
|
|
width: 150rpx;
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
background-size: 100%;
|
|
|
|
|
|
margin: auto;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.login-form-content {
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
border-top-left-radius: 100rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.login-form {
|
|
|
|
|
|
padding: 60rpx 60rpx 20rpx 60rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.login-form-tab {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: rgb(150, 150, 150);
|
|
|
|
|
|
|
|
|
|
|
|
.login-tab {
|
|
|
|
|
|
width: 200rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.active {
|
|
|
|
|
|
color: #00367a;
|
|
|
|
|
|
padding-bottom: 10rpx;
|
|
|
|
|
|
border-bottom: 5rpx solid #00367a;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.login-box {
|
|
|
|
|
|
width: 85%;
|
|
|
|
|
|
margin: 30rpx auto;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2024-08-07 16:43:03 +08:00
|
|
|
|
</style>
|
