Fixed datepickers

app/views/reports/purchases_per_month.html.erb

@@ -42,7 +42,7 @@
                       <div class="col-md-3 col-sm-4">
                         <div class="search-label uppercase"> Del </div>
                         <div class="col-md-6">
-                          <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
+                          <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
                             <!-- <input id="start" type='text' class="form-control" value="< %= l(Date.today.beginning_of_month, format: '%d/%m/%Y') %>" /> -->
                             <%= text_field_tag "start_date", l(Date.today.beginning_of_month, format: '%d/%m/%Y'), class: "form-control" %>
                             <span class="input-group-addon">
@@ -54,7 +54,7 @@
                       <div class="col-md-3 col-sm-4">
                         <div class="search-label uppercase"> Al </div>
                         <div class="col-md-6">
-                          <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
+                          <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
                             <!-- <input id="end" type='text' class="form-control" value="<%= l(Date.today.end_of_month, format: '%d/%m/%Y') %>" /> -->
                             <%= text_field_tag "end_date", l(Date.today.end_of_month, format: '%d/%m/%Y'), class: "form-control" %>
                             <span class="input-group-addon">
@@ -207,3 +207,21 @@
   </div>
   <!-- END CONTENT -->
 </div>
+<script>
+  $(document).on("page:change", function() {
+    App.init();
+     $('#start_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+
+    $('#end_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+  });
+</script>

app/views/reports/utilities_report.html.erb

@@ -39,7 +39,7 @@
                       <div class="col-md-3 col-sm-4">
                         <div class="search-label uppercase"> Del </div>
                         <div class="col-md-6">
-                          <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
+                          <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
                             <%= text_field_tag "start_date", l(Date.today.beginning_of_month, format: '%d/%m/%Y'), class: "form-control" %>
                             <span class="input-group-addon">
                               <span class="glyphicon glyphicon-calendar"></span>
@@ -50,7 +50,7 @@
                       <div class="col-md-3 col-sm-4">
                         <div class="search-label uppercase"> Al </div>
                         <div class="col-md-6">
-                          <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
+                          <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
                             <%= text_field_tag "end_date", l(Date.today.end_of_month, format: '%d/%m/%Y'), class: "form-control" %>
                             <span class="input-group-addon">
                               <span class="glyphicon glyphicon-calendar"></span>
@@ -169,6 +169,23 @@
   <!-- END CONTENT -->
 </div>
 <script>
+  $(document).on("page:change", function() {
+    App.init();
+     $('#start_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+
+    $('#end_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+  });
+
   function getSubCategories(value) {
     $('#_subcategory').html('');
     $('#_subcategory').select2("destroy").select2({

app/views/sales/sales_per_month_report.html.erb

@@ -38,8 +38,8 @@
                     <div class="col-md-3 col-sm-4">
                       <div class="search-label uppercase"> Del </div>
                       <div class="col-md-6">
-                        <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
-                          <input id="start" type='text' class="form-control" value="<%= l(Date.today.beginning_of_month, format: '%d/%m/%Y') %>" />
+                        <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
+                          <input id="start_date" type='text' class="form-control" value="<%= l(Date.today.beginning_of_month, format: '%d/%m/%Y') %>" />
                           <span class="input-group-addon">
                             <span class="glyphicon glyphicon-calendar"></span>
                           </span>
@@ -49,8 +49,8 @@
                     <div class="col-md-3 col-sm-4">
                       <div class="search-label uppercase"> Al </div>
                       <div class="col-md-6">
-                        <div class="input-group input-medium date date-picker" data-date-format="dd/mm/yyyy">
-                          <input id="end" type='text' class="form-control" value="<%= l(Date.today.end_of_month, format: '%d/%m/%Y') %>" />
+                        <div class="input-group input-medium date" data-date-format="dd/mm/yyyy">
+                          <input id="end_date" type='text' class="form-control" value="<%= l(Date.today.end_of_month, format: '%d/%m/%Y') %>" />
                           <span class="input-group-addon">
                             <span class="glyphicon glyphicon-calendar"></span>
                           </span>
@@ -209,19 +209,34 @@
 </div>
 <!-- END CONTAINER -->
 <script type="text/javascript">
+  $(document).on("page:change", function() {
+    App.init();
+     $('#start_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+
+    $('#end_date').datetimepicker({
+      icons: {
+        date: "fa fa-calendar"
+      },
+      format: "DD/MM/YYYY"
+    });
+  });
+
   var rows_selected = [];
 
   //buscar ventas por periodo de tiempo
   function findSalesByPeriod() {
     var pointsale = $('#pointsale').val();
-    var start = moment($("#start").val(), "DD-MM-YYYY").format('YYYY-MM-DD');
-    var end = moment($("#end").val(), "DD-MM-YYYY").format('YYYY-MM-DD');
+    var start = moment($("#start_date").val(), "DD-MM-YYYY").format('YYYY-MM-DD');
+    var end = moment($("#end_date").val(), "DD-MM-YYYY").format('YYYY-MM-DD');
     var category = $("#category option:selected").val();
     var subcategory = $("#_subcategory option:selected").val();
-    // var start = moment($("#start").val(), "DD-MM-YYYY").startOf('Day').format('YYYY-MM-DD H:mm:ss');
-    // var end = moment($("#end").val(), "DD-MM-YYYY").endOf('Day').format('YYYY-MM-DD H:mm:ss');
 
-    if ($("#start").val() && $("#end").val()) {
+    if ($("#start_date").val() && $("#end_date").val()) {
       App.blockUI({
         target: $("#sales_content"),
         animate: true
@@ -240,8 +255,8 @@
         dataType: 'script',
         success: function(data) {
           App.unblockUI($("#sales_content"));
-          $('#start_date_display').html(moment($("#start").val(), "DD-MM-YYYY").format('DD/MM/YYYY'));
-          $('#end_date_display').html(moment($("#end").val(), "DD-MM-YYYY").format('DD/MM/YYYY'));
+          $('#start_date_display').html(moment($("#start_date").val(), "DD-MM-YYYY").format('DD/MM/YYYY'));
+          $('#end_date_display').html(moment($("#end_date").val(), "DD-MM-YYYY").format('DD/MM/YYYY'));
           $('#pointsale_display').html(pointsale ? $('#pointsale').find("option:selected").text() : 'TODOS los puntos de venta');
           $('#note_info').removeClass('hidden');
         },