New Login form

This commit is contained in:
Min Zeya Phyo
2017-06-26 21:56:13 +06:30
parent 1f6a0eb1f6
commit b607154037
12 changed files with 154 additions and 19 deletions

View File

@@ -1,7 +1,7 @@
<!--
<div class="row">
<div class="col-md-4 col-sm-6 col-md-offset-4 col-sm-offset-3">
<%= simple_form_for(@login_form, url: login_path, method: "POST") do |f| %>
<%= simple_form_for(@login_form, url: login_path, method: "POST") do |f| %>
<div class="card">
<h4 class="card-title text-center" style="margin:10px">Login</h4>
<div class="content" style="margin:10px">
@@ -22,4 +22,40 @@
<% end %>
</div>
</div> -->
<div class="row">
<div class="col-md-12 col-lg-12">
<div class="card-deck">
<% @employees.each do |employee| %>
<div data-formid="#form_<%= employee.emp_id %>" class="empBtn card card-inverse card-primary mb-3 text-center" style="width: 15rem;height:15rem;">
<form id="form_<%=employee.emp_id%>" action="<%= emp_login_path(employee.emp_id) %>" method="PATCH"></form>
<div class="card-block">
<h4 class="card-title">
<%= employee.name %>
</h4>
<div class="card-content">
(<%= employee.emp_id%>)
</div>
<div class="card-footer">
<small><%= employee.role %></small>
</div>
</div>
</div>
<% end %>
</div>
</div>
</div>
<script type="text/javascript">
$(document).on('turbolinks:load', function() {
$(".empBtn").click(function(event){
event.preventDefault();
console.log($(this).data("formid"));
var item = $(this).data("formid");
$(item).submit();
});
});
</script>

View File

@@ -0,0 +1,68 @@
<style>
.pin_pad {
width:10rem;
height:10rem;
text-align: center;
vertical-align: middle;
line-height: 10rem;
margin:2px;
margin-top:4px;
margin-bottom:4px;
font-size:3rem;
}
</style>
<div class="row">
<div class="col-md-4 col-sm-6 col-md-offset-4 col-sm-offset-3">
<%= simple_form_for(@login_form, url: emp_login_update_path, method: "PATCH") do |f| %>
<div class="card">
<div class="content" style="margin:10px">
<div class="form-group">
<%= f.input :emp_id,as: :hidden, label: "Access PIN", required: false, class: "form-control" %>
<%= f.input :password, label: "Access PIN", required: false, class: "form-control" %>
</div>
</div>
<div class="content" style="margin:10px; margin-top:0px; text-align:center">
<button class="pin_pad" data-value="1">1</button>
<button class="pin_pad" data-value="2">2</button>
<button class="pin_pad" data-value="3">3</button>
<button class="pin_pad" data-value="4">4</button>
<button class="pin_pad" data-value="5">5</button>
<button class="pin_pad" data-value="6">6</button>
<button class="pin_pad" data-value="7">7</button>
<button class="pin_pad" data-value="8">8</button>
<button class="pin_pad" data-value="9">9</button>
<button class="pin_pad" data-value="CLR">CLR</button>
<button class="pin_pad" data-value="8">0</button>
<button class="pin_pad btn-warning" data-value="ENT">ENT</button>
</div>
<div class="footer text-center" style="margin:10px">
</div>
</div>
<% end %>
</div>
</div>
<script type="text/javascript">
$(document).on('turbolinks:load', function() {
$(".pin_pad").click(function(event){
event.preventDefault();
console.log($(this).data("value"));
var value = $(this).data("value");
if (value == "CLR") {
$("#login_form_password").val("");
} else if(value == "ENT") {
$("#new_login_form").submit();
} else {
var old_value = $("#login_form_password").val();
$("#login_form_password").val(old_value + value);
}
});
});
</script>