Files
sx-fc/app/views/layouts/login_dashboard.html.erb
2019-05-30 12:00:29 +06:30

271 lines
12 KiB
Plaintext
Executable File
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<title>SmartSales : Restaurant</title>
<%= csrf_meta_tags %>
<!-- Favicon-->
<link rel="icon" href="favicon.ico" type="image/x-icon">
<!-- 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/icon?family=Material+Icons" rel="stylesheet" type="text/css"> -->
<%= 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://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' %>
</head>
<body class="login_dashboard">
<!-- Page Loader -->
<div class="page-loader-wrapper">
<div class="loader">
<div class="preloader">
<div class="spinner-layer pl-red">
<div class="circle-clipper left">
<div class="circle"></div>
</div>
<div class="circle-clipper right">
<div class="circle"></div>
</div>
</div>
</div>
<p>Please wait...</p>
</div>
</div>
<% flash.each do |type, message| %>
<%
if type == "notice"
color = "alert-success"
elsif type == "error"
color = "alert-danger"
elsif type == "warning"
color = "alert-warning"
else
color = "bg-black"
end %>
<p id="noti" class="hidden noti" data-placement-from="top" data-message="<%=message%>" data-placement-align="center"
data-animate-enter="" data-animate-exit="" data-color-name="<%=color%>" >
</p>
<% end %>
<!-- #END# Page Loader -->
<div class="container">
<div class="row">
<div class="col-lg-12_ col-md-12 col-sm-12 col-xs-12 text-center">
<img src="/image/SX-logo.png" width="150px" height="150px">
<p>
<small>Version - 1.0.1</small>
</p>
</div>
</div>
<div class="row">
<div class="col-lg-12_ col-md-12 col-sm-12 col-xs-12 text-center">
<div class="current-shop-name">
<span><%= shop_detail.name %></span>
</div>
</div>
</div>
<div class="row bg-white box">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 p-t-20 p-l-10 p-r-10 p-b-50 bg-white">
<div class="row justify-content-center form-group">
<input type="text" class="form-control col-4" id="emp_id" placeholder="Employee ID">
</div>
<br>
<div class="card padding-10">
<div class="card-content card-btn">
<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 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>
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 p-t-20 p-l-10 p-r-10 p-b-50 bg-white">
<ul class="nav nav-tabs" role="tablist">
<% @roles.each do |role| %>
<%if role != "administrator" %>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#<%=role%>" role="tab"><b><%=role%></b></a>
</li>
<% end %>
<% end %>
</ul>
<div class="tab-content" style="max-height:650px; overflow:auto">
<% @roles.each do |role| %>
<%if role != "administrator" %>
<div class="tab-pane" id="<%=role%>" role="tabpanel" style="max-height:; overflow:auto">
<% @employees.each do |employee| %>
<%if employee.role == role %>
<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3 empBtn mbl-btn-usrgp" data-formid="#form_<%= employee.emp_id %>" style="float: left;">
<form id="form_<%= employee.emp_id %>" action="<%= emp_login_path(employee.emp_id) %>" method="PATCH">
</form>
<%if employee.image_path.present? %>
<div class="login_dashboard p-card">
<%= image_tag employee.image_path, :class => "style_image" %>
<div class="p-name"><b><%= employee.name%></b>
</div>
</div>
<% else %>
<div class="login_dashboard p-card">
<i class="material-icons style_icon">person</i>
<div class="p-name"><b><%= employee.name%></b>
</div>
</div>
<% end %>
</div>
<% end %>
<% end %>
</div>
<% end %>
<% end %>
</div>
</div>
<!-- <div class="col-xs-12 col-sm-12 col-md-2 col-lg-2"> </div> -->
</div>
</div>
</body>
</html>
<script>
$(document).ready(function () {
// for Notificaiotn message
var placementFrom = $("#noti").attr('data-placement-from');
var placementAlign = $("#noti").attr('data-placement-align');
var animateEnter = $("#noti").attr('data-animate-enter');
var animateExit = $("#noti").attr('data-animate-exit');
var colorName = $("#noti").attr('data-color-name');
var text = $("#noti").attr('data-message');
if (text != null || colorName != null){
showNotification(colorName, text, placementFrom, placementAlign, animateEnter, animateExit);
}
$(".empBtn").click(function (event) {
event.preventDefault();
var item = $(this).data("formid");
$(item).submit();
});
$('ul.nav.nav-tabs li a').click(function() {
var bb = $('.nav-item').children()[0];
$(bb).removeClass('active_tab');
$(this).parent().addClass('active_tab').siblings().removeClass('active_tab');
});
$("#emp_id").focus();
$(".pin_pad").click(function (event) {
event.preventDefault();
var value = $(this).data("value");
if (value == "CLR") {
$("#emp_id").val("");
} else if (value == "BAC") {
window.location.href = "/"
} else {
var old_value = $("#emp_id").val();
$("#emp_id").val(old_value + value);
}
if((old_value + value).length == 3){
if($.isNumeric(old_value + value)){
if((old_value + value).length === 3){
window.location.href = '/auth/'+(old_value + value);
}else{
alert("Please Enter Numeric Number");
}
}
}
});
$('#emp_id').keyup(function(e) {
e.preventDefault();
var txtVal = this.value;
if(txtVal!=''){
if ($.isNumeric(txtVal)) {
if( txtVal.length === 3 ) {
window.location.href = '/auth/'+txtVal;
}
}else{
alert("Please Enter Numeric Number");
}
}
});
var aa = $('.nav-item').children().attr('href').replace('#','');
$('#'+aa).addClass('active');
var bb = $('.nav-item').children()[0];
$(bb).parent().addClass('active_tab').siblings().removeClass('active_tab');
});
function showNotification(colorName, text, placementFrom, placementAlign, animateEnter, animateExit) {
if (colorName === null || colorName === '') { colorName = 'bg-black'; }
if (animateEnter === null || animateEnter === '') { animateEnter = 'animated fadeInDown'; }
if (animateExit === null || animateExit === '') { animateExit = 'animated fadeOutUp'; }
var allowDismiss = true;
$.notify({
message: text
},
{
type: colorName,
allow_dismiss: allowDismiss,
newest_on_top: true,
timer: 1000,
placement: {
from: placementFrom,
align: placementAlign
},
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
</script>