2024-02-03 10:57:28 +08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
<html xmlns:th="http://www.thymeleaf.org">
|
|
|
|
<head>
|
|
|
|
<base th:href="${#request.getContextPath() + '/'}">
|
2024-10-30 20:39:35 +08:00
|
|
|
<title th:text="${pageParams.systemTitle}"></title>
|
2024-02-03 10:57:28 +08:00
|
|
|
<meta charset="utf-8">
|
|
|
|
<meta name="renderer" content="webkit">
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
2024-05-27 11:06:01 +08:00
|
|
|
<link rel="icon" type="image/svg" href="assets/favicon.svg"/>
|
2024-02-03 10:57:28 +08:00
|
|
|
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
|
2025-03-07 14:00:01 +08:00
|
|
|
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css?v=4" media="all">
|
|
|
|
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css?v=4" media="all">
|
2024-02-03 10:57:28 +08:00
|
|
|
<link rel="stylesheet" href="assets/css/supersized.css?v=3">
|
2025-03-07 14:00:01 +08:00
|
|
|
<link rel="stylesheet" href="assets/layuiadmin/style/login.css?v=4" media="all">
|
2024-09-13 10:09:47 +08:00
|
|
|
<style>[v-cloak] {display: none;}</style>
|
2024-02-03 10:57:28 +08:00
|
|
|
</head>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
.nav {
|
2024-10-30 20:39:35 +08:00
|
|
|
position: fixed;
|
|
|
|
top: 0;
|
|
|
|
width: 100%;
|
2024-02-03 10:57:28 +08:00
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
2024-10-30 20:39:35 +08:00
|
|
|
align-items: center;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
.nav .logo {
|
|
|
|
padding: 15px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
.nav .logo a img {
|
2025-03-04 19:55:18 +08:00
|
|
|
height: 60px;
|
|
|
|
width: 186px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
.nav .go-page {
|
|
|
|
padding: 15px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
.nav .go-page a {
|
2024-02-03 10:57:28 +08:00
|
|
|
background-color: rgba(255, 255, 255, .4);
|
2024-10-30 20:39:35 +08:00
|
|
|
padding: 5px 15px;
|
|
|
|
border-radius: 50px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
.nav .go-page a:hover {
|
2024-02-03 10:57:28 +08:00
|
|
|
background-color: #42210B;
|
2024-10-30 20:39:35 +08:00
|
|
|
font-weight: bold;
|
2024-02-03 10:57:28 +08:00
|
|
|
color: #FFF;
|
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app {
|
|
|
|
height: 100%;
|
2024-02-03 10:57:28 +08:00
|
|
|
display: flex;
|
|
|
|
justify-content: center;
|
2024-10-30 20:39:35 +08:00
|
|
|
align-items: center;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container {
|
|
|
|
width: 300px;
|
|
|
|
padding: 15px;
|
|
|
|
background-color: #FFF;
|
|
|
|
border-radius: 10px;
|
|
|
|
box-shadow: 0 0 5px rgba(0,0,0,0.3);
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .header {
|
|
|
|
font-size: 16px;
|
|
|
|
border-left: 5px solid #fda633;
|
|
|
|
padding-left: 10px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .body {
|
|
|
|
margin-top: 15px;
|
2024-03-18 14:52:43 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .body .layui-form-item .layui-input {
|
|
|
|
padding-left: 35px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .body .layui-form-item .verify-code {
|
|
|
|
height: 38px;
|
2024-03-18 14:52:43 +08:00
|
|
|
display: flex;
|
2024-10-30 20:39:35 +08:00
|
|
|
justify-content: center;
|
|
|
|
align-items: center;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .body .layui-form-item .verify-code a {
|
|
|
|
color: #1e9fff;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .remember-username {
|
|
|
|
margin-bottom: 10px;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .footer {
|
2024-02-03 10:57:28 +08:00
|
|
|
font-size: 12px;
|
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .footer .login-type {
|
|
|
|
text-align: right;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .footer a {
|
|
|
|
color: #1e9fff;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .container .footer .other {
|
|
|
|
margin-top: 10px;
|
2024-02-03 10:57:28 +08:00
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
2024-04-10 14:47:38 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
#app .forget-password-box {
|
|
|
|
width: 300px;
|
|
|
|
padding: 15px;
|
2024-02-03 10:57:28 +08:00
|
|
|
background-color: #FFF;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
<body>
|
2024-10-30 20:39:35 +08:00
|
|
|
<div id="app">
|
|
|
|
<div class="nav">
|
|
|
|
<div class="logo">
|
|
|
|
<a th:href="${ HomeServerUrl }">
|
2025-03-07 14:00:01 +08:00
|
|
|
<img src="assets/images/headicon1.png?v=4" alt="">
|
2024-10-30 20:39:35 +08:00
|
|
|
</a>
|
2024-02-03 10:57:28 +08:00
|
|
|
</div>
|
2024-10-30 20:39:35 +08:00
|
|
|
<div class="go-page">
|
|
|
|
<a th:href="${ HomeServerUrl + 'Register.html'}">注册</a>
|
|
|
|
<a th:href="${ HomeServerUrl }">去首页</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div v-cloak>
|
|
|
|
<div class="container" v-if="isLogin">
|
|
|
|
<div class="header">用户登录</div>
|
|
|
|
<div class="body">
|
|
|
|
<form id="loginForm" :action="activeAction" method="post" @submit.prevent="submitForm">
|
2024-02-03 10:57:28 +08:00
|
|
|
<input type="hidden" name="referToken" v-model="formData.referToken"/>
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-username" for="username"></label>
|
2024-10-30 20:39:35 +08:00
|
|
|
<input type="text" v-model="formData.username" id="username" name="username" lay-verify="username" placeholder="用户名 / 手机号" class="layui-input">
|
2024-02-03 10:57:28 +08:00
|
|
|
</div>
|
2024-10-30 20:39:35 +08:00
|
|
|
<div class="layui-form-item" v-if="loginType === 'username'">
|
2024-02-03 10:57:28 +08:00
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
|
|
|
|
<input type="password" v-model="formData.password" id="password" name="password" lay-verify="password" placeholder="密码" class="layui-input">
|
|
|
|
</div>
|
2024-10-30 20:39:35 +08:00
|
|
|
<div class="layui-form-item" v-if="loginType === 'username' && pageParams.verificationCode == 'true'" >
|
2024-02-03 10:57:28 +08:00
|
|
|
<!-- 验证码 -->
|
|
|
|
<div class="layui-row">
|
|
|
|
<div class="layui-col-xs7">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="verificationCode"></label>
|
|
|
|
<input type="text" v-model="formData.verificationCode" id="verificationCode" name="verificationCode" lay-verify="verificationCode" placeholder="图形验证码" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-col-xs5">
|
|
|
|
<div style="margin-left: 10px;">
|
|
|
|
<img src="oauth/verification-code/png" class="layadmin-user-login-codeimg" @click="refreshVerificationCode($event)">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2024-10-30 20:39:35 +08:00
|
|
|
<div class="layui-form-item" v-if="loginType === 'sms'">
|
|
|
|
<div class="layui-col-xs7">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="verificationCode"></label>
|
|
|
|
<input type="text" v-model="sms.smsCode" id="smsCode" name="smsCode" placeholder="验证码" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-col-xs5 verify-code">
|
|
|
|
<a href="javascript:void(0);" v-if="!sms.isCountingDown" @click="onLoginSmsCodeClick" style="font-size: 13px;">获取验证码</a>
|
|
|
|
<a href="javascript:void(0);" style="color: #d2d2d2; font-size: 13px;" v-if="sms.isCountingDown">{{sms.countDownSeconds}}秒后重试</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="layui-form remember-username">
|
|
|
|
<input type="checkbox" v-model="formData.remember" name="remember" lay-skin="primary" title="记住账号" lay-filter="rememberFilter">
|
2024-02-03 10:57:28 +08:00
|
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
2024-10-30 20:39:35 +08:00
|
|
|
<button type="submit" class="layui-btn layui-btn-fluid login-btn" lay-submit style="background-color: #fda633;">登录</button>
|
2024-02-03 10:57:28 +08:00
|
|
|
</div>
|
|
|
|
</form>
|
2024-10-30 20:39:35 +08:00
|
|
|
</div>
|
|
|
|
<div class="footer">
|
|
|
|
<div class="login-type">
|
|
|
|
<a href="javascript:void(0);" v-if="loginType === 'sms'" @click="onLoginTypeClick('username')">账号密码登录 <i class="fa fa-angle-right"></i></a>
|
|
|
|
<a href="javascript:void(0);" v-if="loginType === 'username'" @click="onLoginTypeClick('sms')">短信登录 <i class="fa fa-angle-right"></i></a>
|
|
|
|
</div>
|
|
|
|
<div class="other">
|
|
|
|
<div>
|
|
|
|
<a href="javascript:void(0)" class="forget-username-password" @click="onForgetPasswordClick">忘记密码?</a>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
没有账号?<a th:href="${ HomeServerUrl + 'Register.html'}">立即注册</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="container" v-if="!isLogin">
|
|
|
|
<div class="header">忘记密码</div>
|
|
|
|
<div class="body">
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-username" for="username"></label>
|
|
|
|
<input type="text" v-model="forgetPassword.username" id="cpUsername" placeholder="用户名 / 手机号" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
|
|
|
|
<input type="password" v-model="forgetPassword.newPassword" id="cpNewPassword" placeholder="新密码" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
|
|
|
|
<input type="password" v-model="forgetPassword.confirmNewPassword" id="cpConfirmNewPassword" placeholder="确认新密码" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<div class="layui-col-xs7">
|
|
|
|
<label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="verificationCode"></label>
|
|
|
|
<input type="text" v-model="sms.smsCode" id="cpSmsCode" placeholder="验证码" class="layui-input">
|
|
|
|
</div>
|
|
|
|
<div class="layui-col-xs5 verify-code">
|
|
|
|
<a href="javascript:void(0);" v-if="!sms.isCountingDown" @click="onForgetPasswordSmsCodeClick" style="font-size: 13px;">获取验证码</a>
|
|
|
|
<a href="javascript:void(0);" style="color: #d2d2d2; font-size: 13px;" v-if="sms.isCountingDown">{{sms.countDownSeconds}}秒后重试</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
|
|
<button type="button" class="layui-btn layui-btn-fluid login-btn" style="background-color: #fda633;" @click="onForgetPasswordUpdateClick">修改</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="footer">
|
|
|
|
<div class="login-type" style="text-align: left;">
|
|
|
|
<a href="javascript:void(0);" @click="isLogin = true"><i class="fa fa-angle-left"></i> 去登录</a>
|
|
|
|
</div>
|
2024-02-03 10:57:28 +08:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="layui-trans layadmin-user-login-footer footer-text">
|
|
|
|
<p v-if="pageParams.copyRightYear"><span>{{'© '+ pageParams.copyRightYear +' '}}</span><a href="javascript:void(0);" v-if="pageParams.copyleft">{{pageParams.copyleft}}</a></p>
|
|
|
|
<p v-if="pageParams.officialUrl">
|
|
|
|
<span><a :href="pageParams.officialUrl" target="_blank">前往官网</a></span>
|
|
|
|
</p>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script type="text/javascript" src="assets/js/vue.min.js"></script>
|
|
|
|
<script type="text/javascript" src="assets/layuiadmin/layui/layui.js"></script>
|
|
|
|
<script type="text/javascript" th:inline="javascript">
|
|
|
|
layui.config({
|
|
|
|
base: 'assets/layuiadmin/'
|
|
|
|
}).extend({
|
|
|
|
index: 'lib/index'
|
|
|
|
}).use(['index', 'form', 'cookie', 'md5', 'dialog', 'base64', 'supersized', 'common', 'ftukey', 'restajax'], function () {
|
|
|
|
var $ = layui.$;
|
|
|
|
var form = layui.form;
|
|
|
|
var layer = layui.layer;
|
|
|
|
var cookie = layui.cookie;
|
|
|
|
var md5 = layui.md5;
|
|
|
|
var base64 = layui.base64;
|
|
|
|
var restAjax = layui.restajax;
|
|
|
|
var dialog = layui.dialog;
|
|
|
|
|
|
|
|
var pageParams = [[${pageParams}]];
|
|
|
|
new Vue({
|
|
|
|
el: '#app',
|
|
|
|
data: {
|
2024-10-30 20:39:35 +08:00
|
|
|
isLogin: true,
|
2024-02-03 10:57:28 +08:00
|
|
|
pageParams: pageParams,
|
2024-10-30 20:39:35 +08:00
|
|
|
loginType: 'username',
|
2024-04-10 14:47:38 +08:00
|
|
|
activeAction: pageParams.loginFormAction,
|
2024-02-03 10:57:28 +08:00
|
|
|
formData: {
|
|
|
|
referToken: pageParams.referToken,
|
|
|
|
verificationCode: '',
|
|
|
|
username: pageParams.loginUsername,
|
|
|
|
password: '',
|
|
|
|
remember: false
|
2024-10-30 20:39:35 +08:00
|
|
|
},
|
|
|
|
forgetPassword: {
|
|
|
|
username: '',
|
|
|
|
smsCode: '',
|
|
|
|
newPassword: '',
|
|
|
|
confirmNewPassword: '',
|
|
|
|
},
|
|
|
|
sms: {
|
|
|
|
smsCode: '',
|
|
|
|
countDownInterval: null,
|
|
|
|
countDownSeconds: 120,
|
|
|
|
isCountingDown: false,
|
|
|
|
isCountClick: false
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
2024-10-30 20:39:35 +08:00
|
|
|
// 提交表单
|
|
|
|
submitForm: function() {
|
|
|
|
var self = this;
|
|
|
|
if(!self.formData.username) {
|
|
|
|
layer.msg('用户名不能为空');
|
|
|
|
$('#username').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(self.loginType === 'username') {
|
|
|
|
if(!self.formData.password) {
|
|
|
|
layer.msg('密码不能为空');
|
|
|
|
$('#password').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(self.pageParams.verificationCode == 'true' && !self.formData.verificationCode) {
|
|
|
|
layer.msg('验证码不能为空');
|
|
|
|
$('#verificationCode').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
} else if(self.loginType === 'sms') {
|
|
|
|
if(!self.sms.smsCode) {
|
|
|
|
layer.msg('短信验证码不能为空');
|
|
|
|
$('#smsCode').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(self.loginType === 'username') {
|
|
|
|
self.activeAction = self.pageParams.loginFormAction;
|
|
|
|
}
|
|
|
|
if(self.loginType === 'sms') {
|
|
|
|
self.activeAction = self.pageParams.loginPhoneAction;
|
|
|
|
}
|
|
|
|
if(self.formData.remember) {
|
|
|
|
cookie.setCookie('rememberMe', self.formData.username, 30);
|
|
|
|
} else {
|
|
|
|
cookie.setCookie('rememberMe', '', 0);
|
|
|
|
}
|
|
|
|
layer.msg('正在登录,请稍后...', {icon: 16, shade: 0.1, time: 0});
|
|
|
|
self.formData.password = md5(md5(md5(self.formData.password)));
|
|
|
|
self.$nextTick(function() {
|
|
|
|
$('#loginForm').submit();
|
|
|
|
})
|
|
|
|
},
|
|
|
|
onForgetPasswordUpdateClick: function() {
|
|
|
|
var self = this;
|
|
|
|
if(!self.forgetPassword.username) {
|
|
|
|
layer.msg('用户名不能为空');
|
|
|
|
$('#cpUsername').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(!self.forgetPassword.newPassword) {
|
|
|
|
layer.msg('新密码不能为空');
|
|
|
|
$('#cpNewPassword').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(!self.forgetPassword.confirmNewPassword) {
|
|
|
|
layer.msg('确认新密码不能为空');
|
|
|
|
$('#cpConfirmNewPassword').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(self.forgetPassword.newPassword !== self.forgetPassword.confirmNewPassword) {
|
|
|
|
layer.msg('两次密码不一致');
|
|
|
|
$('#cpConfirmNewPassword').focus();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(!self.sms.smsCode) {
|
|
|
|
layer.msg('短信验证码不能为空');
|
|
|
|
$('#cpSmsCode').focus();
|
|
|
|
return;
|
|
|
|
}
|
2024-02-03 10:57:28 +08:00
|
|
|
var loadLayerIndex;
|
2024-10-30 20:39:35 +08:00
|
|
|
restAjax.put(restAjax.path('app/user/forget-phone-password', []), {
|
|
|
|
phone: self.forgetPassword.username,
|
|
|
|
newPassword: md5(md5(md5(self.forgetPassword.newPassword))),
|
|
|
|
verificationCode: self.sms.smsCode
|
|
|
|
}, null, function(code, data) {
|
|
|
|
layer.msg("密码修改成功,请登录");
|
|
|
|
self.loginType = 'username';
|
|
|
|
self.isLogin = true;
|
2024-02-03 10:57:28 +08:00
|
|
|
}, function(code, data) {
|
|
|
|
dialog.msg(data.msg);
|
|
|
|
}, function() {
|
|
|
|
loadLayerIndex = dialog.msg('正在提交修改信息...', {icon: 16, time: 0, shade: 0.3});
|
|
|
|
}, function() {
|
|
|
|
dialog.close(loadLayerIndex);
|
|
|
|
});
|
|
|
|
},
|
2024-10-30 20:39:35 +08:00
|
|
|
onForgetPasswordClick: function() {
|
|
|
|
this.isLogin = false;
|
|
|
|
},
|
|
|
|
onLoginClick: function() {
|
|
|
|
this.isLogin = true;
|
|
|
|
},
|
|
|
|
onLoginSmsCodeClick: function() {
|
|
|
|
this.sendSmsCode(this.formData.username)
|
|
|
|
},
|
|
|
|
onForgetPasswordSmsCodeClick: function() {
|
|
|
|
this.sendSmsCode(this.forgetPassword.username)
|
|
|
|
},
|
|
|
|
sendSmsCode: function(phone) {
|
|
|
|
if(this.sms.isCountClick) {
|
2024-02-03 10:57:28 +08:00
|
|
|
return;
|
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
if(!phone) {
|
|
|
|
layer.msg('请输入手机号');
|
2024-02-03 10:57:28 +08:00
|
|
|
return;
|
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
if(!/^1[3456789]\d{9}$/.test(phone)) {
|
|
|
|
layer.msg('手机号格式不正确');
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
var self = this;
|
|
|
|
restAjax.get('api/verify/code/send/'+ phone, {}, null, function(code, data) {
|
|
|
|
layer.msg('验证码发送成功');
|
|
|
|
self.sms.isCountingDown = true;
|
|
|
|
self.sms.countDownInterval = setInterval(function() {
|
|
|
|
self.sms.countDownSeconds -= 1;
|
|
|
|
if(self.sms.countDownSeconds <= 0) {
|
|
|
|
clearInterval(self.sms.countDownInterval);
|
|
|
|
self.sms.countDownInterval = null;
|
|
|
|
self.sms.isCountingDown = false;
|
2024-02-03 10:57:28 +08:00
|
|
|
}
|
2024-10-30 20:39:35 +08:00
|
|
|
}, 1000);
|
|
|
|
}, function(code, data) {
|
|
|
|
layer.msg(data.msg);
|
|
|
|
}, function() {
|
|
|
|
self.isCountClick = true;
|
|
|
|
}, function() {
|
|
|
|
self.isCountClick = false;
|
|
|
|
})
|
|
|
|
},
|
|
|
|
onLoginTypeClick: function(type) {
|
|
|
|
this.loginType = type;
|
|
|
|
if(type === 'username') {
|
|
|
|
this.activeAction = pageParams.loginFormAction;
|
|
|
|
} else if(type === 'sms') {
|
|
|
|
this.activeAction = pageParams.loginPhoneAction;
|
|
|
|
}
|
2024-02-03 10:57:28 +08:00
|
|
|
},
|
|
|
|
showErrorMessage: function() {
|
|
|
|
var self = this;
|
|
|
|
if(self.pageParams.errorMessage) {
|
|
|
|
layer.msg(self.pageParams.errorMessage);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
initBackground: function() {
|
|
|
|
var self = this;
|
|
|
|
var loginBackgroundImages = self.pageParams.loginBackgroundImages;
|
|
|
|
var photos = [];
|
|
|
|
if(loginBackgroundImages) {
|
|
|
|
var loginBackgroundImageArray = loginBackgroundImages.split(',');
|
|
|
|
for(var i = 0, item = loginBackgroundImageArray[i]; item = loginBackgroundImageArray[i++];) {
|
|
|
|
photos.push({
|
|
|
|
image: 'route/file/download/true/'+ item
|
|
|
|
})
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
for(var i = 1; i <= 9; i++) {
|
|
|
|
photos.push({
|
|
|
|
image: 'assets/images/backgrounds/'+ i +'.jpg'
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
$.supersized({
|
|
|
|
slide_interval : 4000, // Length between transitions
|
|
|
|
transition : 1, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
|
|
|
|
transition_speed : 1000, // Speed of transition
|
|
|
|
performance : 1, // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
|
|
|
|
// Size & Position
|
|
|
|
min_width : 0, // Min width allowed (in pixels)
|
|
|
|
min_height : 0, // Min height allowed (in pixels)
|
|
|
|
vertical_center : 1, // Vertically center background
|
|
|
|
horizontal_center : 1, // Horizontally center background
|
|
|
|
fit_always : 0, // Image will never exceed browser width or height (Ignores min. dimensions)
|
|
|
|
fit_portrait : 1, // Portrait images will not exceed browser height
|
|
|
|
fit_landscape : 0, // Landscape images will not exceed browser width
|
|
|
|
// Components
|
|
|
|
slide_links : 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank')
|
|
|
|
slides : photos
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 刷新验证码
|
|
|
|
refreshVerificationCode: function(event) {
|
|
|
|
event.target.src = event.target.src + '?t='+ new Date().getTime();
|
|
|
|
},
|
|
|
|
// 记住我
|
|
|
|
rememberMe: function() {
|
|
|
|
var self = this;
|
|
|
|
var rememberMe = cookie.getCookie('rememberMe');
|
|
|
|
if(rememberMe) {
|
2024-10-30 20:39:35 +08:00
|
|
|
self.formData.username = rememberMe;
|
2024-02-03 10:57:28 +08:00
|
|
|
self.formData.remember = true;
|
|
|
|
}
|
|
|
|
self.$nextTick(function() {
|
|
|
|
form.render();
|
|
|
|
});
|
|
|
|
},
|
2024-10-30 20:39:35 +08:00
|
|
|
|
2024-04-10 14:47:38 +08:00
|
|
|
loginTypeChange: function(type) {
|
|
|
|
this.loginType = type;
|
|
|
|
}
|
2024-02-03 10:57:28 +08:00
|
|
|
},
|
|
|
|
mounted: function() {
|
|
|
|
var self = this;
|
|
|
|
self.showErrorMessage();
|
|
|
|
self.initBackground();
|
|
|
|
self.rememberMe();
|
|
|
|
// 复选框勾选事件
|
|
|
|
form.on('checkbox(rememberFilter)', function(data) {
|
|
|
|
self.formData.remember = data.elem.checked;
|
|
|
|
});
|
|
|
|
}
|
|
|
|
})
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|