update login To show dashboard screen with available features based on user type

This commit is contained in:
Aung Myo
2017-07-24 17:42:34 +06:30
parent 8db4a8cc05
commit a7cbea5dbb
7 changed files with 158 additions and 156 deletions

View File

@@ -24,8 +24,8 @@
</div>
</div> -->
<div class="row">
<div class="col-md-12 col-lg-12">
<div class="card-deck">
<div class="col-md-8 col-lg-8">
<div class="card-columns">
<% @employees.each do |employee| %>
@@ -43,11 +43,111 @@
</div>
</div>
</div>
<% end %>
<% end %>
</div>
</div>
<div class="col-md-4 col-lg-4" >
<div class="card" style="max-height:550px; overflow:auto;padding: 15px">
<!-- <p><strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p> -->
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#admin">Administrator <span class="glyphicon glyphicon-plus"></span></a>
</h4>
</div>
<div id="admin" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="">
<li class="">All Accept</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#manager">Manager <span class="glyphicon glyphicon-plus"></span></a>
</h4>
</div>
<div id="manager" class="panel-collapse collapse">
<div class="panel-body">
<ul class="">
<li class="">All Accept except Membership and Payment Settings</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#supervisor">Supervisor <span class="glyphicon glyphicon-plus"></span></a>
</h4>
</div>
<div id="supervisor" class="panel-collapse collapse">
<div class="panel-body">
<ul class="">
<li class="">Void</li>
<li class="">FOC</li>
<li class="">Edit</li>
<li class="">Credit </li>
<li class="">and Payment </li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#cashier">Cashier <span class="glyphicon glyphicon-plus"></span></a>
</h4>
</div>
<div id="cashier" class="panel-collapse collapse">
<div class="panel-body">
<ul class="">
<li class="">Orgami Panel except Edit and Void</li>
<li class="">Sale and Order </li>
<li class="">and Queue in CRM</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#accountant">Accountant <span class="glyphicon glyphicon-plus"></span></a>
</h4>
</div>
<div id="accountant" class="panel-collapse collapse">
<div class="panel-body">
<ul class="">
<li class="">Daily Sale Report</li>
<li class="">Sale Item Report</li>
<li class="">Receipt No Report</li>
<li class="">ShiftSale Report</li>
</ul>
</div>
</div>
</div>
</div> <!-- end accordion id -->
</div>
</div> <!-- end col-md-4 -->
</div>
<style type="text/css">
.panel-body {
padding: 5px !important;
}
.card-columns {
column-count: 5;
}
.panel-title .glyphicon {
float: right;
}
</style>
<script type="text/javascript">
$(document).on('turbolinks:load', function() {
$(".empBtn").click(function(event){
@@ -57,5 +157,24 @@ $(document).on('turbolinks:load', function() {
$(item).submit();
});
// Add minus icon for collapse element which is open by default
$(".collapse.in").each(function(){
$(this).siblings(".panel-heading").find(".glyphicon").addClass("glyphicon-minus").removeClass("glyphicon-plus");
});
// Toggle plus minus icon on show hide of collapse element
$(".collapse").on('show.bs.collapse', function(){
$(this).parent().find(".glyphicon").removeClass("glyphicon-plus").addClass("glyphicon-minus");
}).on('hide.bs.collapse', function(){
$(this).parent().find(".glyphicon").removeClass("glyphicon-minus").addClass("glyphicon-plus");
});
});
</script>