update login dashoborad

This commit is contained in:
Aung Myo
2017-11-08 11:09:53 +06:30
parent bfadacd950
commit 482d0559eb

View File

@@ -10,29 +10,29 @@
<!-- Favicon--> <!-- Favicon-->
<link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="icon" href="favicon.ico" type="image/x-icon">
<!-- Google Fonts --> <!-- Google Fonts -->
<!-- <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,cyrillic-ext" rel="stylesheet" type="text/css"> <!-- <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,cyrillic-ext" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" type="text/css"> --> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" type="text/css"> -->
<!-- Bootstrap Core Css --> <!-- Bootstrap Core Css -->
<!-- <link href="plugins/bootstrap/css/bootstrap.css" rel="stylesheet"> --> <!-- <link href="plugins/bootstrap/css/bootstrap.css" rel="stylesheet"> -->
<!-- Waves Effect Css --> <!-- Waves Effect Css -->
<!-- <link href="plugins/node-waves/waves.css" rel="stylesheet" /> --> <!-- <link href="plugins/node-waves/waves.css" rel="stylesheet" /> -->
<!-- Animation Css --> <!-- Animation Css -->
<!-- <link href="plugins/animate-css/animate.css" rel="stylesheet" /> --> <!-- <link href="plugins/animate-css/animate.css" rel="stylesheet" /> -->
<!-- Morris Chart Css--> <!-- Morris Chart Css-->
<!-- <link href="plugins/morrisjs/morris.css" rel="stylesheet" /> --> <!-- <link href="plugins/morrisjs/morris.css" rel="stylesheet" /> -->
<!-- Custom Css --> <!-- Custom Css -->
<!-- <link href="css/style.css" rel="stylesheet"> --> <!-- <link href="css/style.css" rel="stylesheet"> -->
<!-- AdminBSB Themes. You can choose a theme from css/themes instead of get all themes -->
<!-- <link href="css/themes/all-themes.css" rel="stylesheet" /> -->
<%= stylesheet_link_tag 'login', media: 'all', 'data-turbolinks-track': 'reload' %>
<!-- AdminBSB Themes. You can choose a theme from css/themes instead of get all themes -->
<!-- <link href="css/themes/all-themes.css" rel="stylesheet" /> -->
<%= stylesheet_link_tag 'login', media: 'all', 'data-turbolinks-track': 'reload' %>
<!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script> --> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script> -->
<%= javascript_include_tag 'login', 'data-turbolinks-track': 'reload' %> <%= javascript_include_tag 'login', 'data-turbolinks-track': 'reload' %>
@@ -81,91 +81,113 @@
</div> </div>
<%= 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 padding-10"> <div class="card padding-10">
<div class="card-header"> <div class="card-header m-l-">
<div class="form-group"> <div class="row clearfix">
<%= f.input :emp_id, as: :hidden, required: false, class: "form-control" %> <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
<%= f.input :emp_id, as: :hidden, required: false, class: "form-control" %>
<%= f.input :password, label: "Access PIN", required: false, class: "form-control" %> <%= f.input :password, label: "Access PIN", required: false, class: "form-control" %>
</div>
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-10">
<br>
<span class="input-group-addon enter m-t-25 m-l--25" data-value="ENT" style="cursor: pointer;padding:0.1rem !important;">
<i class="material-icons">send</i>
</span>
</div>
</div>
</div> </div>
<div class="card-content">
<div class='col-md-12'>
<div class='row bottom'>
<div class="pin_pad " data-value="1">1</div>
<div class="pin_pad left" data-value="2">2</div>
<div class="pin_pad left" data-value="3">3</div>
</div>
<div class='row bottom'>
<div class="pin_pad" data-value="4">4</div>
<div class="pin_pad left" data-value="5">5</div>
<div class="pin_pad left" data-value="6">6</div>
</div>
<div class='row bottom'>
<div class="pin_pad" data-value="7">7</div>
<div class="pin_pad left" data-value="8">8</div>
<div class="pin_pad left" data-value="9">9</div>
</div>
<div class='row bottom'>
<div class="pin_pad bg-grey" data-value="CLR">CLR</div>
<div class="pin_pad left" data-value="0">0</div>
<div class="pin_pad left bg-indigo" data-value="ENT">ENT</div>
</div>
</div>
</div>
<% end %>
</div>
<script type="text/javascript">
$(document).ready(function () {
$("#login_form_password").focus();
$(".pin_pad").click(function (event) { <div class="card-content">
event.preventDefault(); <div class='col-md-12'>
var value = $(this).data("value"); <div class='row bottom'>
<div class="pin_pad " data-value="1">1</div>
<div class="pin_pad left" data-value="2">2</div>
<div class="pin_pad left" data-value="3">3</div>
</div>
<div class='row bottom'>
<div class="pin_pad" data-value="4">4</div>
<div class="pin_pad left" data-value="5">5</div>
<div class="pin_pad left" data-value="6">6</div>
</div>
<div class='row bottom'>
<div class="pin_pad" data-value="7">7</div>
<div class="pin_pad left" data-value="8">8</div>
<div class="pin_pad left" data-value="9">9</div>
</div>
<div class='row bottom'>
<!-- <div class="pin_pad bg-grey" data-value="CLR">CLR</div>
<div class="pin_pad left" data-value="0">0</div>
<div class="pin_pad left bg-indigo" data-value="ENT">ENT</div> -->
<div class="pin_pad bg-blue-grey" data-value="BAC">BACK</div>
<div class="pin_pad left" data-value="0">0</div>
<div class="pin_pad bg-grey left" data-value="CLR">CLR</div>
</div>
</div>
</div>
<% end %>
</div>
<script type="text/javascript">
$(document).ready(function () {
$("#login_form_password").focus();
if (value == "CLR") { $(".pin_pad").click(function (event) {
$("#login_form_password").val(""); event.preventDefault();
} else if (value == "ENT") { var value = $(this).data("value");
$("#new_login_form").submit();
} else { if (value == "CLR") {
var old_value = $("#login_form_password").val(); $("#login_form_password").val("");
$("#login_form_password").val(old_value + value); } else if (value == "ENT") {
} $("#new_login_form").submit();
}); } else if (value == "BAC") {
}); window.location.href = "/"
function showNotification(colorName, text, placementFrom, placementAlign, animateEnter, animateExit) { } else {
if (colorName === null || colorName === '') { colorName = 'bg-black'; } var old_value = $("#login_form_password").val();
if (animateEnter === null || animateEnter === '') { animateEnter = 'animated fadeInDown'; } $("#login_form_password").val(old_value + value);
if (animateExit === null || animateExit === '') { animateExit = 'animated fadeOutUp'; } }
var allowDismiss = true; });
$.notify({ $(".enter").click(function (event) {
message: text event.preventDefault();
}, var value = $(this).data("value");
{
type: colorName, if (value == "ENT") {
allow_dismiss: allowDismiss, $("#new_login_form").submit();
newest_on_top: true, }
timer: 1000, });
placement: { });
from: placementFrom, function showNotification(colorName, text, placementFrom, placementAlign, animateEnter, animateExit) {
align: placementAlign if (colorName === null || colorName === '') { colorName = 'bg-black'; }
}, if (animateEnter === null || animateEnter === '') { animateEnter = 'animated fadeInDown'; }
animate: { if (animateExit === null || animateExit === '') { animateExit = 'animated fadeOutUp'; }
enter: animateEnter, var allowDismiss = true;
exit: animateExit $.notify({
}, message: text
template: '<div data-notify="container" class="bootstrap-notify-container alert alert-dismissible {0} ' + (allowDismiss ? "p-r-30" : "") + '" role="alert">' + },
'<button type="button" aria-hidden="true" class="close float-right m-l-20 m-t--5" data-notify="dismiss">×</button>' + {
'<span data-notify="icon"></span> ' + type: colorName,
'<span data-notify="title">{1}</span> ' + allow_dismiss: allowDismiss,
'<span data-notify="message">{2}</span>' + newest_on_top: true,
'<div class="progress" data-notify="progressbar">' + timer: 1000,
'<div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' + placement: {
'</div>' + from: placementFrom,
'<a href="{3}" target="{4}" data-notify="url"></a>' + align: placementAlign
'</div>' },
}); animate: {
} enter: animateEnter,
exit: animateExit
},
template: '<div data-notify="container" class="bootstrap-notify-container alert alert-dismissible {0} ' + (allowDismiss ? "p-r-30" : "") + '" role="alert">' +
'<button type="button" aria-hidden="true" class="close float-right m-l-20 m-t--5" data-notify="dismiss">×</button>' +
'<span data-notify="icon"></span> ' +
'<span data-notify="title">{1}</span> ' +
'<span data-notify="message">{2}</span>' +
'<div class="progress" data-notify="progressbar">' +
'<div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' +
'</div>' +
'<a href="{3}" target="{4}" data-notify="url"></a>' +
'</div>'
});
}
//end Notificaiotn message //end Notificaiotn message
</script> </script>
</body> </body>