Files
myapp-full/myapp/ns_login/templates/register.html
2020-08-20 20:11:57 +03:00

91 lines
2.4 KiB
HTML

{% extends "skeleton.html" %}
{% block content %}
<div class="row">
<div class="col-md-6 ml-md-auto mr-md-auto">
<h3>Регистрация</h3>
<hr />
<div class="row mt-3" v-if="error">
<div class="col text-danger" v-html="error.message"></div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<i class="input-group-text"><i class="fa fa-user"></i></i>
</div>
<input class="form-control" placeholder="Логин" type="text" id="username" v-model="username">
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<i class="input-group-text"><i class="fa fa-lock"></i></i>
</div>
<input class="form-control" placeholder="Пароль" type="password" id="password" v-model="password">
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<i class="input-group-text"><i class="fa fa-lock"></i></i>
</div>
<input class="form-control" placeholder="Повтор пароля" type="password" id="repeat" v-model="repeat">
</div>
</div>
<div class="btn btn-outline-success float-right" v-on:click="register">Зарегистрироваться</div>
<a class="btn btn-outline-secondary" href="/login">Вход</a>
</div> <!-- div class="col-md-6 ml-md-auto mr-md-auto" -->
</div> <!-- div class="row" -->
{% endblock %}
{% block script %}
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
username: '',
password: '',
repeat: '',
error: null
},
methods: {
register: function() {
let vm = this;
if (vm.password!=vm.repeat) {
vm.error = 'Пароли не совпадают';
return;
}
axios.post(
'/api',
{
"jsonrpc": "2.0",
"method": "login.register",
"params": {
"username": vm.username,
"password": vm.password
},
"id": 1
}
).then(
function(response) {
if ('result' in response.data) {
window.location.href = '/login';
} else if ('error' in response.data) {
vm.error = response.data['error'];
}
}
);
}
}
})
</script>
{% endblock %}