update admin bsb crm layou

app/assets/javascripts/CRM.js

@@ -10,13 +10,18 @@
 // Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
 // about supported directives.
 //
+
+
+
 //= require jquery
 //= require tether
-//= require bootstrap
+//= require bootstrap/js/popper.min
+//= require bootstrap/js/bootstrap-material-design.min
 //= require jquery_ujs
 //= require turbolinks
-//= require cable
+//= require jquery-slimscroll/jquery.slimscroll.js
-//= require jquery-ui
+//= require node-waves/waves.js
-//= require bootstrap-datepicker
+//= require sweetalert/sweetalert.min.js
-//= require bootstrap/modal
+//= require BSBMaterial/admin.js
-
+//= require BSBMaterial/demo.js
+//= require custom.js

app/assets/javascripts/application.js

@@ -34,54 +34,10 @@
 //= require BSBMaterial/admin.js
 //= require BSBMaterial/pages/index.js
 //= require BSBMaterial/demo.js
-
+//= require custom.js
-
-$(document).on('turbolinks:load', function() {
-    
-    $('.datetimepicker').bootstrapMaterialDatePicker({
-        format: 'DD-MM YYYY - HH:mm',
-        clearButton: true,
-        weekStart: 1
-    });
-
-    $('.datepicker').bootstrapMaterialDatePicker({
-        format: 'DD-MM-YYYY',
-        clearButton: true,
-        weekStart: 1,
-        time: false
-    });
-
-    $('.timepicker').bootstrapMaterialDatePicker({
-        format: 'HH:mm',
-        clearButton: true,
-        date: false
-    });
-   
-});
 
 $(function(){
 
-  $('body').bootstrapMaterialDesign();
-  var height = ($(window).height() - ($('.legal').outerHeight() + $('.user-info').outerHeight() + $('.navbar').innerHeight()));
-
-  $('#custom-slimscroll').slimScroll({
-    height: height,
-    size: '5px',
-    color: 'rgba(0,0,0,0.5)',
-    alwaysVisible: false,
-    borderRadius: '0',
-    railBorderRadius: '0'
-  });
-
-  $('#order-detail-slimscroll').slimScroll({
-    height: height-180,
-    size: '5px',
-    color: 'rgba(0,0,0,0.5)',
-    alwaysVisible: false,
-    borderRadius: '0',
-    railBorderRadius: '0'
-  });
-
   // Image Upload
   $("#simple_menu_item_image_path").fileinput({
       previewFileType: "image",
@@ -123,54 +79,6 @@ $(function(){
     }
   });
 
-  $('.delete').click(function(){
-    var method    = $(this).attr('data-method');
-    var url       = $(this).attr('data-ref');
-    var html_text = $( this ).siblings( "#delete_text" ).html();
-    swal({
-        title: "Confirmation",
-        text: html_text,
-        type: "warning",
-        showCancelButton: true,
-        confirmButtonColor: "#DD6B55",
-        html: true
-    }, function (isConfirm) {
-        if (isConfirm) {
-          $.ajax({
-            type: method,
-            url: url ,            
-            success: function(data) {
-            }
-         }); 
-        } else {
-            swal("Cancelled", "Your imaginary file is safe :)", "error");
-        }
-    });
-  });
-
-  $('.dddddddd').click(function(){
-      var currentForm = $(this).closest("form");
-      bootbox.confirm({
-        title: 'Confirmation',
-        message: $('#delete_text').html(),
-        buttons: {
-            'cancel': {
-                label: 'No',
-                className: 'btn green col-md-4 pull-left'
-            },
-            'confirm': {
-                label: 'Yes',
-                className: 'btn red col-md-4 pull-right'
-            }
-        },
-        callback: function(result) {
-            if (result) {
-                currentForm.submit();
-            }
-        }
-    });
-   });
-
 });
 
 $(document).on("focus", "[data-behaviour~='datepicker']", function(e){

app/assets/javascripts/custom.js

@@ -0,0 +1,50 @@
+
+$(function(){
+
+  $('body').bootstrapMaterialDesign();
+  var height = ($(window).height() - ($('.legal').outerHeight() + $('.user-info').outerHeight() + $('.navbar').innerHeight()));
+
+  $('#custom-slimscroll').slimScroll({
+    height: height,
+    size: '5px',
+    color: 'rgba(0,0,0,0.5)',
+    alwaysVisible: false,
+    borderRadius: '0',
+    railBorderRadius: '0'
+  });
+
+  $('#order-detail-slimscroll').slimScroll({
+    height: height-180,
+    size: '5px',
+    color: 'rgba(0,0,0,0.5)',
+    alwaysVisible: false,
+    borderRadius: '0',
+    railBorderRadius: '0'
+  });
+
+  $('.delete').click(function(){
+    var method    = $(this).attr('data-method');
+    var url       = $(this).attr('data-ref');
+    var html_text = $( this ).siblings( "#delete_text" ).html();
+    swal({
+        title: "Confirmation",
+        text: html_text,
+        type: "warning",
+        showCancelButton: true,
+        confirmButtonColor: "#DD6B55",
+        html: true
+    }, function (isConfirm) {
+        if (isConfirm) {
+          $.ajax({
+            type: method,
+            url: url ,            
+            success: function(data) {
+            }
+         }); 
+        } else {
+            swal("Cancelled", "Your imaginary file is safe :)", "error");
+        }
+    });
+  });
+
+});

app/assets/stylesheets/CRM.scss

@@ -1,15 +1,21 @@
-@import "bootstrap";
+//@import "bootstrap";
-@import "font-awesome";
+//@import "font-awesome";
-@import "theme";
+//@import "theme";
-@import "jquery-ui";
+//@import "jquery-ui";
-@import "bootstrap-datepicker3";
+//@import "bootstrap-datepicker3";
-@import "bootstrap/modal";
+//@import "bootstrap/modal";
-
+@import "tether";
-/* Show it is fixed to the top */
+@import "bootstrap/css/bootstrap-material-design.min";
-// body {
+@import "node-waves/waves";
-//   min-height: 75rem;
+@import "animate-css/animate";
-//   padding-top: 4.5rem;
+@import "sweetalert/sweetalert.css";
-// }
+@import "multi-select/css/multi-select.css";
+@import "bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker";
+@import "morrisjs/morris";
+@import "fileinput.min";
+@import "BSBMaterial/style";
+@import "BSBMaterial/themes/all-themes";
+@import "reset";
 
 .selected-item {
     color: #fff !important;
@@ -45,14 +51,7 @@
 .jconfirm-box-container{
 	margin-left:-40px !important
 }
-.card-columns {
+
-  @include media-breakpoint-only(lg) {
-    column-count: 5;
-  }
-  @include media-breakpoint-only(xl) {
-    column-count: 5;
-  }
-}
 
 #sxModal {
   display: none;
@@ -94,3 +93,4 @@
     height: 375px;
     
 }
+

app/assets/stylesheets/application.scss

@@ -185,13 +185,14 @@ section.content {
     opacity:0 !important;
     margin-right:15px;
 }
-/* End Reset Theme */
-/* *************************************************** */
 
 .hidden{
   display: none !important;
 }
 
+/* End Reset Theme */
+/* *************************************************** */
+
 /***************** Start Origami CSS *************************/
 /* Reset */
 .table {

app/assets/stylesheets/reset.css

@@ -0,0 +1,182 @@
+/* Start Reset Theme */
+.col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-auto, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-auto, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-auto {
+  padding-left: 10px;
+  padding-right: 10px;
+}
+.col-lg-1, .col-md-1, .col-sm-1,col-xl-1{
+  padding-left: 5px ;
+  padding-right: 5px ;
+}
+
+.navbar {
+  padding: 0.1rem 1rem;
+}
+
+.navbar-header {
+  padding: 0px;
+}
+
+.navbar-brand {
+  padding-top: 0rem;
+  padding-bottom: 0rem;
+}
+
+.navbar-brand-txt {
+  position: relative;
+  top: 5px;
+}
+
+.navbar-right a {
+  color: #fff;
+}
+
+.navbar-right a.dropdown-toggle {
+  position: relative;
+  top: -5px;
+}
+
+.dropdown-menu {
+  margin-top: 0px !important;
+}
+
+.switch label {
+  color: #070707 !important;
+}
+
+.ls-closed .bars:after, .ls-closed .bars:before {
+  position: absolute;
+  top: 8px;
+}
+
+section.content {
+  margin: 40px 15px 0 225px;
+}
+
+.sidebar {
+  width: 210px;
+  height: calc(100vh - 50px);
+  position: fixed;
+  top: 50px;
+  right: 250px;
+}
+
+.right-sidebar {
+  width: 240px;
+  height: calc(100vh - 50px);
+  position: fixed;
+  right: -260px;
+  top: 50px;
+}
+
+.info-box {
+  margin-bottom: 20px;
+}
+
+.card {
+  margin-bottom: 20px;
+}
+
+.card .card-header {
+    padding: 0.5rem;
+}
+
+.card .card-title{
+  margin-bottom:0.5rem;
+}
+
+.card .card-block {
+    padding: 0.5rem;
+}
+
+.btn {
+      padding: .46875rem 0.25rem;
+      color : #fff !important;
+}
+.btn-default, .bg-default{
+  color : #111 !important;
+}
+.checkbox label, label.checkbox-inline {
+  padding-left: 0;
+}
+
+.checkbox label input[type=checkbox], label.checkbox-inline input[type=checkbox] {
+  position: relative; 
+  left: 0; 
+  z-index: -1; 
+  width: 13px; 
+  height: 13px; 
+  margin: 5px 5px 0 0;
+  overflow: hidden;
+  pointer-events: none;
+  opacity: 1; 
+}
+
+
+.sidebar .menu .list .header {
+  background: #eee;
+  font-size: 12px;
+  font-weight: bold;
+  padding: 8px 16px;
+}
+
+.breadcrumb {
+  font-size:0.87rem;
+}
+
+.list-group-item{
+  padding:0.75rem 1rem;
+}
+.btn:not(.btn-link):not(.btn-circle) span {
+  position: relative;
+  top: 0px; 
+  margin-left: 0px; 
+}
+.nav {
+    padding-left: 0;
+    margin-bottom: 0;
+    list-style: none;
+}
+
+.nav > li > a {
+    position: relative;
+    display: block;
+    padding: 10px 15px;
+}
+
+.nav-tabs > li {
+    float: left;
+    margin-bottom: -1px;
+}
+
+.nav-tabs li a.active {
+  color: #000 !important; 
+   border-bottom: 2px solid #2196F3 !important;
+}
+
+.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
+    color: #555;
+    cursor: default;
+    background-color: #fff;
+    border: 1px solid #ddd;
+    border-bottom-color: transparent;
+}
+.nav-tabs > li > a {
+    margin-right: 2px;
+    line-height: 1.42857143;
+    text-decoration:none;
+}
+.nav-tabs .nav-link {
+    padding: 0.7286em .8575em;
+}
+
+.checkbox label input[type=checkbox], label.checkbox-inline input[type=checkbox] {
+    opacity:0 !important;
+    margin-right:15px;
+}
+
+.hidden{
+  display: none !important;
+}
+
+/* End Reset Theme */
+/* *************************************************** */

app/controllers/application_controller.rb

@@ -12,6 +12,7 @@ class ApplicationController < ActionController::Base
   #all token authentication must be done here
   #response format must be set to JSON
 
+  #change locallization
   def set_locale
     I18n.locale = params[:locale] || I18n.default_locale
   end

app/controllers/base_crm_controller.rb

@@ -10,6 +10,16 @@ class BaseCrmController < ActionController::Base
   	redirect_to root_path
   end
 
+  #change locallization
+  def set_locale
+    I18n.locale = params[:locale] || I18n.default_locale
+  end
+
+  # RESTful url for localize
+  def default_url_options
+    { locale: I18n.locale }
+  end
+
   def current_user
   	@current_user ||= Employee.find_by_token_session(session[:session_token]) if session[:session_token]
   end

app/controllers/crm/bookings_controller.rb

@@ -1,4 +1,4 @@
-class Crm::BookingsController < ApplicationController
+class Crm::BookingsController < BaseCrmController
 	load_and_authorize_resource
 	def update_booking
         booking = Booking.find(params[:booking_id])

app/controllers/crm/customers_controller.rb

@@ -1,4 +1,4 @@
-class Crm::CustomersController < ApplicationController #BaseCrmController
+class Crm::CustomersController < BaseCrmController
   load_and_authorize_resource except: [:create]
   before_action :set_crm_customer, only: [:show, :edit, :update, :destroy]
 

app/controllers/crm/dining_queues_controller.rb

@@ -1,4 +1,4 @@
-class Crm::DiningQueuesController < ApplicationController #BaseCrmController
+class Crm::DiningQueuesController < BaseCrmController
   load_and_authorize_resource
   before_action :set_dining_queue, only: [:show, :edit, :update, :destroy]
 

app/controllers/crm/home_controller.rb

@@ -1,4 +1,4 @@
-class Crm::HomeController < ApplicationController
+class Crm::HomeController < BaseCrmController
   def index
   	 
   	   @booking  = Booking.all

app/views/crm/customers/index.html.erb

@@ -1,15 +1,15 @@
 <div class="container-fluid">
-<div class="page-header">
+    <div class="page-header">
- <ul class="breadcrumb">
+     <ul class="breadcrumb">
-  <li class="breadcrumb-item"><a href="<%= dashboard_path %>">Home</a></li>
+      <li class="breadcrumb-item"><a href="<%= dashboard_path %>">Home</a></li>
-  <li class="breadcrumb-item active">CRM</li>
+      <li class="breadcrumb-item active">CRM</li>
- <!--  <li class="breadcrumb-item"><a href="<%= dashboard_path %>">Home</a></li> -->
+     <!--  <li class="breadcrumb-item"><a href="<%= dashboard_path %>">Home</a></li> -->
-  <span class="float-right">
+      <span class="float-right">
-    <%= link_to 'Back', dashboard_path %>
+        <%= link_to 'Back', dashboard_path %>
-  </span>
+      </span>
- </ul>
+     </ul>
+    </div>
 </div>
-
   <div class="row clearfix">
     <div class="col-lg-8 col-md-8 col-sm-8">
       <!-- <div class="main-box-body clearfix"> -->
@@ -103,7 +103,6 @@
     </div> -->
   </div>
 </div>
-
 <script type="text/javascript">
 
 $(function() {

app/views/crm/dining_queues/assign.html.erb

@@ -1,46 +1,43 @@
-<div class="page-header">
+<div class="container-fluid">
-   <ul class="breadcrumb">
+    <div class="page-header">
-    <li><a href="<%=  %>">Home</a></li>
+     <ul class="breadcrumb">
-    <li>Queue</li>
+      <li class="breadcrumb-item"><a href="<%= dashboard_path %>">Home</a></li>
-    <li>Assign Queue <%=@queue.queue_no%></li>
+       <li class="breadcrumb-item"><a href="<%= crm_dining_queues_path %>">Queue</a></li>
-   
+      <li class="breadcrumb-item active">Assign Queue <%=@queue.queue_no%></li>
-  </ul>
+      <span class="float-right">
+        <%= link_to 'Back', dashboard_path %>
+      </span>
+     </ul>
+    </div>
 </div>
-
 <div class="row">
  <!-- Column One -->
- <div class="col-lg-11 col-md-11 col-sm-11">
+ <div class="col-lg-12 col-md-12 col-sm-12">
-
+   <div id="custom-slimscroll">
-   <div class="tab-content" style="max-height:670px; overflow:auto">
+     <div class="tab-content">
-
+      <!--- Panel 1 - Table Orders -->
-    <!--- Panel 1 - Table Orders -->
+      <div class="active" id="tables" role="tabpanel">
-    <div class="active" id="tables" role="tabpanel">
+         <div class="tab-pane" id="rooms" role="tabpanel">
-       <div class="tab-pane" id="rooms" role="tabpanel">
+             <div class="card-columns" style="padding-top:10px; column-gap: 2.2rem;">
-           <div class="card-columns" style="padding-top:10px; column-gap: 2.2rem;">
+             <% @i =0 %> 
-           <% @i =0 %> 
+               <% DiningFacility.all.each do |table| %>
-             <% DiningFacility.all.each do |table| %>
+                <div class="card assign_table <%= table.status=="available" ? "green" : "red"%>" data-id="<%= table.id %>">
-              <div class="card assign_table <%= table.status=="available" ? "green" : "red"%>" data-id="<%= table.id %>">
+                 <div class="card-block">
-               <div class="card-block">
+                      <p class="hidden queue-id"><%= @queue.id  %></p> 
-                    <p class="hidden queue-id"><%= @queue.id  %></p> 
+                      <p class="hidden queue-status"><%= table.status  %></p>
-                    <p class="hidden queue-status"><%= table.status  %></p>
+                      <p style="text-align: center"><%= table.name %></p>
-                    <p style="text-align: center"><%= table.name %></p>
+                      <p style="text-align: center">Seat : <%= table.seater %></p>
-                    <p style="text-align: center">Seat : <%= table.seater %></p>
+                 </div>
                </div>
-             </div>
               
-             <% end %>
+               <% end %>
-           </div>
+             </div>
-       </div>
+         </div>
+      </div>
     </div>
+   </div>
 </div>
 </div>
-<div class="col-lg-1 col-md-1 col-sm-1">
-    <br>
-       <a href="<%= crm_dining_queues_path%>" class="btn btn-primary">
-        <i class="fa fa-arrow-left fa-lg"></i> Back
-       </a>
-    </div>
-</div>
 
 <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.2.0/jquery-confirm.min.css">
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.2.0/jquery-confirm.min.js"></script> -->

app/views/layouts/CRM.html.erb

@@ -1,34 +1,63 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
-    <meta name="description" content=""/>
-    <meta name="author" content=""/>
 
+<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">
 
-    <%= stylesheet_link_tag    'CRM', media: 'all', 'data-turbolinks-track': 'reload' %>
+    <!-- Google Fonts -->
-    <%= javascript_include_tag 'CRM', 'data-turbolinks-track': 'reload' %>
+    <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,cyrillic-ext" rel="stylesheet" type="text/css">
-    <%= stylesheet_link_tag    'jquery-confirm', media: 'all', 'data-turbolinks-track': 'reload' %>
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" type="text/css">
-    <%= javascript_include_tag 'jquery-confirm', 'data-turbolinks-track': 'reload' %>
-  </head>
 
-  <body>
+     <%= stylesheet_link_tag    'CRM', media: 'all', 'data-turbolinks-track': 'reload' %>
-    <%= render 'layouts/header_crm' %>
+     <%= javascript_include_tag 'CRM', 'data-turbolinks-track': 'reload' %>
-    <div class="container-fluid">
+</head>
-      <% flash.each do |type, message| %>
-						  <div class="alert-danger fade in">
-						    <button class="close" aria-hidden="true" data-dismiss="alert" type="button">×</button>
-
-						    <% if !flash["errors"]%>
-                 <%=message%>
-                <% end %>
-						  </div>
-			<% end %>
-      <%= yield %>
 
+<body class="theme-red">
+    <!-- Page Loader -->
+    <div class="page-loader-wrapper">
+        <div class="loader">
+            <div class="preloader">
+                <div class="spinner-layer pl-blue">
+                    <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>
-  </body>
+    <!-- #END# Page Loader -->
+    <!-- Overlay For Sidebars -->
+    <div class="overlay"></div>
+    <!-- #END# Overlay For Sidebars -->
+    <%= render 'layouts/header' %>
+    <section>      
+        <%= render 'layouts/left_sidebar' %>  
+        <%= render 'layouts/right_sidebar' %>  
+    </section>
+
+    <!-- Main Content -->
+    <section class="content"> 
+      <% flash.each do |type, message| %>
+                <div class="alert-danger fade in">
+                  <button class="close" aria-hidden="true" data-dismiss="alert" type="button">×</button>
+
+                  <% if !flash["errors"]%>
+                   <%=message%>
+                  <% end %>
+                </div>
+        <% end %>       
+        <%= yield %>     
+    </section>
+</body>
+
 </html>