demo/pythonweb/www/templates/signin.html

70 lines
2.7 KiB
HTML

<!DOCTYPE html>
<html class="uk-height-1-1">
<head>
<meta charset="utf-8" />
<title>登录 - Awesome Python Webapp</title>
<link rel="stylesheet" href="/static/css/uikit.min.css">
<link rel="stylesheet" href="/static/css/uikit.gradient.min.css">
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/sha1.min.js"></script>
<script src="/static/js/uikit.min.js"></script>
<script src="/static/js/vue.min.js"></script>
<script src="/static/js/awesome.js"></script>
<script>
$(function() {
var vmAuth = new Vue({
el: '#vm',
data: {
email: '',
passwd: ''
},
methods: {
submit: function(event) {
event.preventDefault();
var
$form = $('#vm'),
email = this.email.trim().toLowerCase(),
data = {
email: email,
passwd: this.passwd==='' ? '' : CryptoJS.SHA1(email + ':' + this.passwd).toString()
};
$form.postJSON('/api/authenticate', data, function(err, result) {
if (! err) {
location.assign('/');
}
});
}
}
});
});
</script>
</head>
<body class="uk-height-1-1">
<div class="uk-vertical-align uk-text-center uk-height-1-1">
<div class="uk-vertical-align-middle" style="width: 320px">
<p><a href="/" class="uk-icon-button"><i class="uk-icon-html5"></i></a> <a href="/">Awesome Python Webapp</a></p>
<form id="vm" v-on="submit: submit" class="uk-panel uk-panel-box uk-form">
<div class="uk-alert uk-alert-danger uk-hidden"></div>
<div class="uk-form-row">
<div class="uk-form-icon uk-width-1-1">
<i class="uk-icon-envelope-o"></i>
<input v-model="email" name="email" type="text" placeholder="电子邮件" maxlength="50" class="uk-width-1-1 uk-form-large">
</div>
</div>
<div class="uk-form-row">
<div class="uk-form-icon uk-width-1-1">
<i class="uk-icon-lock"></i>
<input v-model="passwd" name="passwd" type="password" placeholder="口令" maxlength="50" class="uk-width-1-1 uk-form-large">
</div>
</div>
<div class="uk-form-row">
<button type="submit" class="uk-width-1-1 uk-button uk-button-primary uk-button-large"><i class="uk-icon-sign-in"></i> 登录</button>
</div>
</form>
</div>
</div>
</body>
</html>