From dac2812848d28637f17a2285ac6859e40055a03c Mon Sep 17 00:00:00 2001
From: Gowtham M <gowtham.m@venbainfotech.com>
Date: Thu, 7 Nov 2024 12:09:19 +0530
Subject: [PATCH] GWM : navigation menu

---
 app/Views/factoryDieselMachineDetails.php | 835 +++++++++++++---------
 1 file changed, 494 insertions(+), 341 deletions(-)

diff --git a/app/Views/factoryDieselMachineDetails.php b/app/Views/factoryDieselMachineDetails.php
index d1041e2d..46d456c9 100644
--- a/app/Views/factoryDieselMachineDetails.php
+++ b/app/Views/factoryDieselMachineDetails.php
@@ -1,183 +1,228 @@
-
-
 <?php
 $datefordropdown = format_date($datefordropdown, 0, 'M-Y');
 ?>
 <style type="text/css">
-    .num {
-        text-align: right;
-    }
+.num {
+    text-align: right;
+}
 
 
 
-    .fht-table,
-    .fht-table thead,
-    .fht-table tfoot,
-    .fht-table tbody,
-    .fht-table tr,
-    .fht-table th,
-    .fht-table td {
-        margin: 0;
-    }
+.fht-table,
+.fht-table thead,
+.fht-table tfoot,
+.fht-table tbody,
+.fht-table tr,
+.fht-table th,
+.fht-table td {
+    margin: 0;
+}
 
-    .fht-table td {
-        text-align: center;
-    }
+.fht-table td {
+    text-align: center;
+}
 
-    .fht-table td:hover {
-        background-color: #41a1c8;
-        color: #ffffff;
-    }
-
-    .fht-table {
-        border: 0 none;
-        height: auto;
-        width: auto;
-        border-collapse: collapse;
-        border-spacing: 0;
-        /*table-layout: fixed;  Algoritmo de distribucion fijo */
-        white-space:nowrap;  
-    }
-
-    .fht-table th,
-    .fht-table td {
-        overflow: hidden;
-    }
-
-    .fht-table-wrapper,
-    .fht-table-wrapper .fht-thead,
-    .fht-table-wrapper .fht-tfoot,
-    .fht-table-wrapper .fht-fixed-column .fht-tbody,
-    .fht-table-wrapper .fht-fixed-body .fht-tbody,
-    .fht-table-wrapper .fht-tbody {
-        overflow: hidden;
-        position: relative;
-    }
-
-    .fht-table-wrapper .fht-fixed-body .fht-tbody,
-    .fht-table-wrapper .fht-tbody {
-        overflow: auto;
-    }
-
-    .fht-table-wrapper .fht-table .fht-cell {
-        overflow: hidden;
-        height: 1px;
-    }
-
-    .fht-table-wrapper .fht-fixed-column,
-    .fht-table-wrapper .fht-fixed-body {
-        top: 0;
-        left: 0;
-        position: absolute;
-    }
-
-    .fht-table-wrapper .fht-fixed-column {
-        z-index: 1;
-    }
-
-    .fht-fixed-body .fht-thead table {
-        margin-right: 20px;
-        border: 0 none;
-    }
-
-    /*For Examples*/
-
-    .ContenedorTabla {
-        height: 500px;
-        margin: 0 auto;
-        overflow: auto;
-        width: auto;
-        position: relative;
-    }
-
-    .header,
-    .main {
-        display: inline-block;
-        height: auto;
-        width: 100%;
-    }
-
-    .titulosHeader {
-        border-bottom: 1px solid #e8bb25;
-        height: auto;
-        margin-bottom: 10px;
-        padding-bottom: 8px;
-        padding-top: 8px;
-        width: 100%;
-    }
-
-
-    .celda_encabezado_general {
-        background-color: #00a65a;
-        border: 1px solid #ccc;
-        color: #ffffff;
-        font-weight: bold;
-        padding: 2px 4px;
-        text-align: center;
-    }
-
-    ._Separador {
-        background-color: #fff;
-        height: 12px;
-        border-left: 1px solid #ccc;
-        border-right: 1px solid #ccc;
-        width: 7px;
-    }
-
-    ._Separador div {
-        width: 4px;
-    }
-
-    .celda_normal {
-        border: 1px solid #ccc;
-        padding: 2px 4px;
-    }
-
-    /*style excel*/
-    .excel_cell {
-        border: 1px solid #CCC;
-        color: #222;
-        text-align: center;
-        font-size: 13px;
-        font-weight: normal;
-        padding: 4px;
-        white-space: pre-line;
-        empty-cells: show;
-    }
-
-    ._cell_header {
-        background-color: #EEE;
-    }
-
-    ._cell_Default {
-        background-color: #FFF;
-        text-align: left;
-    }
-
-    .excel_cell div {
-        width: 30px;
-        height: 20px;
-    }
-
-    .modal {
-        padding-right: 30% ! important;
-    }
-
-
-#dieselMachineTable th:nth-child(1),
-#dieselMachineTable td:nth-child(1)
-{
-    position: sticky;
-    left: 0;
-    background-color: #00a65a; 
-    z-index: 2;
-    border-right: 2px solid #ddd; 
+.fht-table td:hover {
+    background-color: #41a1c8;
     color: #ffffff;
 }
 
+.fht-table {
+    border: 0 none;
+    height: auto;
+    width: auto;
+    border-collapse: collapse;
+    border-spacing: 0;
+    /*table-layout: fixed;  Algoritmo de distribucion fijo */
+    white-space: nowrap;
+}
+
+.fht-table th,
+.fht-table td {
+    overflow: hidden;
+}
+
+.fht-table-wrapper,
+.fht-table-wrapper .fht-thead,
+.fht-table-wrapper .fht-tfoot,
+.fht-table-wrapper .fht-fixed-column .fht-tbody,
+.fht-table-wrapper .fht-fixed-body .fht-tbody,
+.fht-table-wrapper .fht-tbody {
+    overflow: hidden;
+    position: relative;
+}
+
+.fht-table-wrapper .fht-fixed-body .fht-tbody,
+.fht-table-wrapper .fht-tbody {
+    overflow: auto;
+}
+
+.fht-table-wrapper .fht-table .fht-cell {
+    overflow: hidden;
+    height: 1px;
+}
+
+.fht-table-wrapper .fht-fixed-column,
+.fht-table-wrapper .fht-fixed-body {
+    top: 0;
+    left: 0;
+    position: absolute;
+}
+
+.fht-table-wrapper .fht-fixed-column {
+    z-index: 1;
+}
+
+.fht-fixed-body .fht-thead table {
+    margin-right: 20px;
+    border: 0 none;
+}
+
+/*For Examples*/
+
+.ContenedorTabla {
+    height: 500px;
+    margin: 0 auto;
+    overflow: auto;
+    width: auto;
+    position: relative;
+}
+
+.header,
+.main {
+    display: inline-block;
+    height: auto;
+    width: 100%;
+}
+
+.titulosHeader {
+    border-bottom: 1px solid #e8bb25;
+    height: auto;
+    margin-bottom: 10px;
+    padding-bottom: 8px;
+    padding-top: 8px;
+    width: 100%;
+}
+
+
+.celda_encabezado_general {
+    background-color: #00a65a;
+    border: 1px solid #ccc;
+    color: #ffffff;
+    font-weight: bold;
+    padding: 2px 4px;
+    text-align: center;
+}
+
+._Separador {
+    background-color: #fff;
+    height: 12px;
+    border-left: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+    width: 7px;
+}
+
+._Separador div {
+    width: 4px;
+}
+
+.celda_normal {
+    border: 1px solid #ccc;
+    padding: 2px 4px;
+}
+
+/*style excel*/
+.excel_cell {
+    border: 1px solid #CCC;
+    color: #222;
+    text-align: center;
+    font-size: 13px;
+    font-weight: normal;
+    padding: 4px;
+    white-space: pre-line;
+    empty-cells: show;
+}
+
+._cell_header {
+    background-color: #EEE;
+}
+
+._cell_Default {
+    background-color: #FFF;
+    text-align: left;
+}
+
+.excel_cell div {
+    width: 30px;
+    height: 20px;
+}
+
+
+
+
+#dieselMachineTable th:nth-child(1),
+#dieselMachineTable td:nth-child(1) {
+    position: sticky;
+    left: 0;
+    background-color: #00a65a;
+    z-index: 2;
+    border-right: 2px solid #ddd;
+    color: #ffffff;
+}
 </style>
 
 
+
+
+<div class="modal fade" id="bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h4 class="modal-title" id="myLargeModalLabel">Navigation Options</h4>
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+            </div>
+            <div class="modal-body">
+                <div class="row">
+                    <!-- Machine Dropdown -->
+                    <div class="col-md-6">
+                        <div class="form-group">
+                            <label for="machineDropdown">Select Machine</label>
+                            <select id="machineDropdown" class="form-control">
+                                <option value="">Select Machine</option>
+                                <?php foreach ($machineName as $name): ?>
+                                    <option value="<?= $name; ?>"><?= $name; ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </div>
+                    </div>
+
+                    <!-- Date Dropdown -->
+                    <div class="col-md-6">
+                        <div class="form-group">
+                            <label for="dateDropdown">Select Date</label>
+                            <select id="dateDropdown" class="form-control">
+                                <option value="01-11-2024">01-11-2024</option>
+                                <option value="02-11-2024">02-11-2024</option>
+                                <option value="10-11-2024">10-11-2024</option>
+                                <option value="15-11-2024">15-11-2024</option>
+                                <option value="25-11-2024">25-11-2024</option>
+                                <option value="30-11-2024">30-11-2024</option>
+                            </select>
+                        </div>
+                    </div>
+                </div>
+                <button class="btn btn-primary float-right" onclick="navigateToMachine()">Navigate</button>
+            </div>
+        </div><!-- /.modal-content -->
+    </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->
+
+
+
+
+
+
+
 <div class="content-page">
     <div class="content">
         <!-- Start Content-->
@@ -187,11 +232,11 @@ $datefordropdown = format_date($datefordropdown, 0, 'M-Y');
                 <div class="row">
                     <div class="col-6">
                         <div class="page-title-box page-title-box-alt">
-                        <div class="page-title-right">
+                            <div class="page-title-right">
                                 <ol class="breadcrumb m-0">
                                     <li class="breadcrumb-item"><a href="javascript: void(0);">Stocks</a></li>
                                     <li class="breadcrumb-item active">
-                                    <h4 class="page-title">Diesel - Factory Vehicle Details</h4>
+                                        <h4 class="page-title">Diesel - Factory Vehicle Details</h4>
                                     </li>
                                 </ol>
                             </div>
@@ -208,28 +253,55 @@ $datefordropdown = format_date($datefordropdown, 0, 'M-Y');
                 <div class="row">
                     <div class="col-12">
                         <div class="card">
+
+
                             <div class="card-body">
-                               
-                               
+
+
                             <form action="<?= base_url('factoryVehicleDieselDetails'); ?>" method="post">
                                 <div class="row">
-                                
+
                                     <div class="col-3">
-                                    <?php $today = date('M-Y'); ?>
-                                    <input type="text" name="month" id="month" value="<?php echo $datefordropdown; ?>" class="form-control" data-provide="datepicker" data-date-format="M-yyyy" data-date-min-view-mode="1">
+                                        <?php $today = date('M-Y'); ?>
+                                        <input type="text" name="month" id="month"
+                                            value="<?php echo $datefordropdown; ?>" class="form-control"
+                                            data-provide="datepicker" data-date-format="M-yyyy"
+                                            data-date-min-view-mode="1">
 
                                     </div>
                                     <div class="col-3">
-                                        <input type="submit" value="Change Month" class="btn btn-success" style="margin-top:0px;">
+                                        <input type="submit" value="Change Month" class="btn btn-success"
+                                            style="margin-top:0px;">
                                     </div>
+                                    <div class="col-6">
+                                        <div class="dropdown float-right">
+                                            <a href="#" class="dropdown-toggle arrow-none" data-toggle="dropdown"
+                                                aria-expanded="false">
+                                                <i class="mdi mdi-dots-vertical m-0 text-muted h3"></i>
+                                            </a>
+                                            <div class="dropdown-menu dropdown-menu-right">
+                                                <a class="dropdown-item" data-toggle="modal" data-target="#bs-example-modal-lg">Navigation</a>
+                                                <a class="dropdown-item" href="#">Export</a>
+                                            </div>
+                                        </div> 
+                                    </div> 
+
                                 </div>
                             </form>
 
+
+
+
                                
 
-                            <!-- Add table-responsive for horizontal scroll -->
-                            <div class="table-responsive">
-                                <?php
+
+
+
+
+
+                                <!-- Add table-responsive for horizontal scroll -->
+                                <div class="table-responsive">
+                                    <?php
                                     $columns = array_keys($dieselConsumptionDetails[0]);
 
                                     function formatHeader($key) 
@@ -241,72 +313,93 @@ $datefordropdown = format_date($datefordropdown, 0, 'M-Y');
                                     }
                                 ?>
 
-                                
-                                <table id="dieselMachineTable" class="fht-table  table-striped" style="font-size: small;">
 
-                                <thead>
-                                    <tr>
-                                        <th class="celda_encabezado_general" style="padding: 10px;"></th>
-                                        <th class="celda_encabezado_general" colspan="4" style="padding: 10px;">Total Diesel</th>
-                                        <?php foreach ($machineName as $name): ?>
-                                            <th class="celda_encabezado_general" colspan="6" style="padding: 10px;"><?= $name; ?></th>
-                                        <?php endforeach; ?>
-                                    </tr>
-                                </thead>
+                                    <table id="dieselMachineTable" class="fht-table  table-striped"
+                                        style="font-size: small;">
 
-                                <thead>
-                                    <tr>
-                                        <?php foreach ($columns as $column): ?>
-                                            <th class="celda_encabezado_general" style="padding: 10px;" id="<?= $column ?>"><?= formatHeader($column) ?></th>
-                                        <?php endforeach; ?>
-                                    </tr>
-                                </thead>
+                                        <thead>
+                                            <tr>
+                                                <th class="celda_encabezado_general" style="padding: 10px;"></th>
+                                                <th class="celda_encabezado_general" colspan="4" style="padding: 10px;">
+                                                    Total Diesel</th>
+                                                <?php foreach ($machineName as $name): ?>
+                                                <th class="celda_encabezado_general" colspan="6" data-id="<?= $name; ?>"
+                                                    style="padding: 10px;"><?= $name; ?></th>
+                                                <?php endforeach; ?>
+                                            </tr>
+                                        </thead>
+
+                                        <thead>
+                                            <tr>
+                                                <?php foreach ($columns as $column): ?>
+                                                <th class="celda_encabezado_general" style="padding: 10px;"
+                                                    id="<?= $column ?>"><?= formatHeader($column) ?></th>
+                                                <?php endforeach; ?>
+                                            </tr>
+                                        </thead>
+
+                                        <tbody>
+                                            <?php   foreach ($dieselConsumptionDetails as $key => $row):  ?>
+                                            <tr id="<?php echo $key + 1; ?>">
+                                                <?php  foreach ($columns as $index => $column): ?>
 
-                                <tbody>
-                                    <?php   foreach ($dieselConsumptionDetails as $key => $row):  ?>
-                                        <tr id="<?php echo $key + 1; ?>">
-                                            <?php  foreach ($columns as $index => $column): ?>
-                                                
                                                 <?php if($index == 0) : ?>
-                                                <td class="celda_normal" style="padding: 5px;" ><?php echo DateTime::createFromFormat('Y-m-d', $row[$column])->format('d-m-Y'); ?></td>
+                                                <td class="celda_normal" style="padding: 5px;">
+                                                    <?php echo DateTime::createFromFormat('Y-m-d', $row[$column])->format('d-m-Y'); ?>
+                                                </td>
                                                 <?php elseif(formatHeader($column) == 'Opening Reading'): ?>
-                                                <td class="celda_normal" <?= ($key == 0) ? 'contenteditable="true"' : ''; ?>  style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal"
+                                                    <?= ($key == 0) ? 'contenteditable="true"' : ''; ?>
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Closing Reading'): ?>
-                                                <td class="celda_normal"  contenteditable="true" onkeyup="calculateRunningHrs(this.parentNode.id,this.textContent);" style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" contenteditable="true"
+                                                    onkeyup="calculateRunningHrs(this.parentNode.id,this.textContent);"
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Filling Diesel'): ?>
-                                                <td class="celda_normal"  contenteditable="true" onkeyup="calculateTotalFillingDiesel(this.parentNode.id,this.textContent);" style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" contenteditable="true"
+                                                    onkeyup="calculateTotalFillingDiesel(this.parentNode.id,this.textContent);"
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Consumption'): ?>
-                                                <td class="celda_normal"  contenteditable="true" onkeyup="calculateMileage(this.parentNode.id,this.textContent);" style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" contenteditable="true"
+                                                    onkeyup="calculateMileage(this.parentNode.id,this.textContent);"
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Running Hours'): ?>
-                                                <td class="celda_normal"   style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" style="padding: 5px;">
+                                                    <?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Mileage'): ?>
-                                                <td class="celda_normal"   style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" style="padding: 5px;">
+                                                    <?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Opening Stock'): ?>
-                                                <td class="celda_normal"  <?= ($key == 0) ? 'contenteditable="true"' : ''; ?> style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal"
+                                                    <?= ($key == 0) ? 'contenteditable="true"' : ''; ?>
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php elseif(formatHeader($column) == 'Purchase Diesel'): ?>
-                                                <td class="celda_normal" contenteditable="true" onkeyup="calculateBalanceStock(this.parentNode.id,this.textContent);" style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" contenteditable="true"
+                                                    onkeyup="calculateBalanceStock(this.parentNode.id,this.textContent);"
+                                                    style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php else : ?>
-                                                <td class="celda_normal"   style="padding: 5px;"><?= $row[$column] ?? 'N/A' ?></td>
+                                                <td class="celda_normal" style="padding: 5px;">
+                                                    <?= $row[$column] ?? 'N/A' ?></td>
                                                 <?php endif; ?>
 
+                                                <?php endforeach; ?>
+                                            </tr>
                                             <?php endforeach; ?>
-                                        </tr>
-                                    <?php endforeach; ?>
-                                </tbody>
+                                        </tbody>
 
-                                </table>
+                                    </table>
 
 
-                            </div><!-- End table-responsive -->
+                                </div><!-- End table-responsive -->
 
-                            <div class="row">
-                                <div class="col-md-12 text-right">
-                                    <input type="button" class="btn btn-success" id="save" value="save">
+                                <div class="row">
+                                    <div class="col-md-12 text-right">
+                                        <input type="button" class="btn btn-success" id="save" value="save">
+                                    </div>
                                 </div>
-                            </div>
 
                             </div>
-                           
+
                         </div> <!-- End card-body -->
                     </div> <!-- End card -->
                 </div> <!-- End col -->
@@ -324,172 +417,232 @@ $datefordropdown = format_date($datefordropdown, 0, 'M-Y');
 
 
 <script type="text/javascript">
-   
+$(document).ready(function() {
+    $('#save').click(function() {
 
-    $(document).ready(function() 
-    {
-        $('#save').click(function() {
+        // Get headers from the second <thead> as keys
+        var headers = [];
+        $("#dieselMachineTable thead:nth-child(2) th").each(function() {
+            headers.push($(this).attr("id"));
+        });
 
-            // Get headers from the second <thead> as keys
-            var headers = [];
-            $("#dieselMachineTable thead:nth-child(2) th").each(function() {
-                headers.push($(this).attr("id"));
+        // Convert table to JSON using custom headers as keys
+        var tableData = [];
+        $("#dieselMachineTable tbody tr").each(function() {
+            var rowData = {};
+            $(this).find("td").each(function(index) {
+                var key = headers[index] || `column_${index}`;
+                rowData[key] = $(this).text().trim();
             });
+            tableData.push(rowData);
+        });
 
-            // Convert table to JSON using custom headers as keys
-            var tableData = [];
-            $("#dieselMachineTable tbody tr").each(function() {
-                var rowData = {};
-                $(this).find("td").each(function(index) {
-                    var key = headers[index] || `column_${index}`;
-                    rowData[key] = $(this).text().trim();
-                });
-                tableData.push(rowData);
-            });
+        var jsonData = JSON.stringify(tableData);
 
-            var jsonData = JSON.stringify(tableData);
-            
-            
-            $('#loader').show();
-            $.ajax({
-                data: {
-                    dieselMachineTableData: jsonData,
-                },
-                type: "POST",
-                url: "<?php echo base_url() ?>/addOrEditfactoryVehicleDieselDetails",
 
-                success: function(data) {
-                    if (data) {
-                        
-                        $('#loader').hide();
-                        alert(data);
-                        
-                    }
+        $('#loader').show();
+        $.ajax({
+            data: {
+                dieselMachineTableData: jsonData,
+            },
+            type: "POST",
+            url: "<?php echo base_url() ?>/addOrEditfactoryVehicleDieselDetails",
+
+            success: function(data) {
+                if (data) {
+
+                    $('#loader').hide();
+                    alert(data);
 
                 }
-            });
-            
-        
-        });    
+
+            }
+        });
+
+
     });
-
-
+});
 </script>
 
 <script>
+function openingReading(parentId, textContent) {
 
-    function openingReading(parentId , textContent) {
-        
-      
-       
-    }
 
-   
-    function calculateRunningHrs(parentId , textContent){
-        
-        var tr = $('#' + parentId); 
-        var currentTd = $(event.target);
-        var tdIndex = currentTd.index();
 
-        // runningHrs calculation
-        closingReading = currentTd.text(); 
-        openingReading = tr.find('td:eq(' + (tdIndex - 1) + ')').text();
-        runningHrs = closingReading - openingReading;
-        if(runningHrs != NaN && runningHrs != Infinity)
+}
+
+
+function calculateRunningHrs(parentId, textContent) {
+
+    var tr = $('#' + parentId);
+    var currentTd = $(event.target);
+    var tdIndex = currentTd.index();
+
+    // runningHrs calculation
+    closingReading = currentTd.text();
+    openingReading = tr.find('td:eq(' + (tdIndex - 1) + ')').text();
+    runningHrs = closingReading - openingReading;
+    if (runningHrs != NaN && runningHrs != Infinity)
         tr.find('td:eq(' + (tdIndex + 3) + ')').text(runningHrs.toFixed(2));
 
-        // mileage calculation
-        consumption = tr.find('td:eq(' + (tdIndex + 2) + ')').text(); 
-        runningHrs = runningHrs.toFixed(2);
-        mileage = consumption / runningHrs;
-        if(mileage != NaN && mileage != Infinity)
+    // mileage calculation
+    consumption = tr.find('td:eq(' + (tdIndex + 2) + ')').text();
+    runningHrs = runningHrs.toFixed(2);
+    mileage = consumption / runningHrs;
+    if (mileage != NaN && mileage != Infinity)
         tr.find('td:eq(' + (tdIndex + 4) + ')').text(mileage.toFixed(2));
 
-        //next opening reading
-        nextTrIndex = parseInt(parentId, 10) + 1 
-        var nexttr = $('#' + nextTrIndex); 
-        nexttr.find('td:eq(' + (tdIndex - 1) + ')').text(textContent);
+    //next opening reading
+    nextTrIndex = parseInt(parentId, 10) + 1
+    var nexttr = $('#' + nextTrIndex);
+    nexttr.find('td:eq(' + (tdIndex - 1) + ')').text(textContent);
 
-        
 
-    }
 
-    function calculateMileage(parentId , textContent) {
-        
-        var tr = $('#' + parentId); 
-        var currentTd = $(event.target);
-        var tdIndex = currentTd.index();
+}
 
-        // mileage calculation
-        consumption = currentTd.text(); 
-        runningHrs = tr.find('td:eq(' + (tdIndex + 1) + ')').text();
-        result = consumption / runningHrs;
-        if(result != NaN && result != Infinity)
+function calculateMileage(parentId, textContent) {
+
+    var tr = $('#' + parentId);
+    var currentTd = $(event.target);
+    var tdIndex = currentTd.index();
+
+    // mileage calculation
+    consumption = currentTd.text();
+    runningHrs = tr.find('td:eq(' + (tdIndex + 1) + ')').text();
+    result = consumption / runningHrs;
+    if (result != NaN && result != Infinity)
         tr.find('td:eq(' + (tdIndex + 2) + ')').text(result.toFixed(2));
-       
-    }
+
+}
 
 
-    function calculateTotalFillingDiesel(parentId , textContent) {
+function calculateTotalFillingDiesel(parentId, textContent) {
 
-        var tr = $('#' + parentId);
-        totalFillingDiesel = 0;
-       
-        tr.children('td').each(function(index, td) {
-           
-            var value = parseFloat($(td).text()) || 0;
-           
-            // var headerText = $('table thead th').eq(index).text();
-            var headerText = $('table thead tr:eq(1) th').eq(index).text();
-            
-            if(headerText == 'Filling Diesel'){
-                totalFillingDiesel += value;
-            }
+    var tr = $('#' + parentId);
+    totalFillingDiesel = 0;
 
-        });
+    tr.children('td').each(function(index, td) {
 
-        tr.find('td:eq(' + (3) + ')').text(totalFillingDiesel.toFixed(2));
+        var value = parseFloat($(td).text()) || 0;
 
-        // Balance Stock calculation
-        openingStock  = tr.find('td:eq(' + (1) + ')').text();
-        purchaseDiesel = tr.find('td:eq(' + (2) + ')').text();
-        fillingDiesel   = tr.find('td:eq(' + (3) + ')').text();
+        // var headerText = $('table thead th').eq(index).text();
+        var headerText = $('table thead tr:eq(1) th').eq(index).text();
 
-        balanceStock = (parseFloat(openingStock) + parseFloat(purchaseDiesel)) - parseFloat(fillingDiesel);
-        if(balanceStock != NaN && balanceStock != Infinity)
+        if (headerText == 'Filling Diesel') {
+            totalFillingDiesel += value;
+        }
+
+    });
+
+    tr.find('td:eq(' + (3) + ')').text(totalFillingDiesel.toFixed(2));
+
+    // Balance Stock calculation
+    openingStock = tr.find('td:eq(' + (1) + ')').text();
+    purchaseDiesel = tr.find('td:eq(' + (2) + ')').text();
+    fillingDiesel = tr.find('td:eq(' + (3) + ')').text();
+
+    balanceStock = (parseFloat(openingStock) + parseFloat(purchaseDiesel)) - parseFloat(fillingDiesel);
+    if (balanceStock != NaN && balanceStock != Infinity)
         tr.find('td:eq(' + (4) + ')').text(balanceStock.toFixed(2));
 
-        //next opening stock
-        nextTrIndex = parseInt(parentId, 10) + 1 
-        var nexttr = $('#' + nextTrIndex); 
-        nexttr.find('td:eq(' + (1) + ')').text(balanceStock.toFixed(2));
-    }
+    //next opening stock
+    nextTrIndex = parseInt(parentId, 10) + 1
+    var nexttr = $('#' + nextTrIndex);
+    nexttr.find('td:eq(' + (1) + ')').text(balanceStock.toFixed(2));
+}
 
-    function calculateBalanceStock(parentId , textContent) {
+function calculateBalanceStock(parentId, textContent) {
 
-        var tr = $('#' + parentId); 
-        var currentTd = $(event.target);
-        var tdIndex = currentTd.index();
+    var tr = $('#' + parentId);
+    var currentTd = $(event.target);
+    var tdIndex = currentTd.index();
 
-        // Balance Stock calculation
-        openingStock  = tr.find('td:eq(' + (tdIndex - 1) + ')').text();
-        purchaseDiesel = currentTd.text(); 
-        fillingDiesel   = tr.find('td:eq(' + (tdIndex + 1) + ')').text();
+    // Balance Stock calculation
+    openingStock = tr.find('td:eq(' + (tdIndex - 1) + ')').text();
+    purchaseDiesel = currentTd.text();
+    fillingDiesel = tr.find('td:eq(' + (tdIndex + 1) + ')').text();
 
-        balanceStock = (parseFloat(openingStock) + parseFloat(purchaseDiesel)) - parseFloat(fillingDiesel);
-        if(balanceStock != NaN && balanceStock != Infinity)
+    balanceStock = (parseFloat(openingStock) + parseFloat(purchaseDiesel)) - parseFloat(fillingDiesel);
+    if (balanceStock != NaN && balanceStock != Infinity)
         tr.find('td:eq(' + (tdIndex + 2) + ')').text(balanceStock.toFixed(2));
 
-        //next opening stock
-        nextTrIndex = parseInt(parentId, 10) + 1 
-        var nexttr = $('#' + nextTrIndex); 
-        nexttr.find('td:eq(' + (1) + ')').text(balanceStock.toFixed(2));
+    //next opening stock
+    nextTrIndex = parseInt(parentId, 10) + 1
+    var nexttr = $('#' + nextTrIndex);
+    nexttr.find('td:eq(' + (1) + ')').text(balanceStock.toFixed(2));
 
+}
+
+
+function navigateToMachine() {
+    $('.close').click();
+    const machineDropdown = document.getElementById('machineDropdown');
+    const dateDropdown = document.getElementById('dateDropdown');
+    const selectedMachine = machineDropdown.value;
+    const selectedDate = dateDropdown.value;
+
+    const table = document.getElementById('dieselMachineTable');
+    const headerCells = table.querySelectorAll('thead tr:nth-child(1) th');
+    const rows = table.querySelectorAll('tbody tr');
+
+    let targetColumnIndex = -1;
+    headerCells.forEach((header, index) => {
+        if (header.getAttribute('data-id') === selectedMachine) {
+            targetColumnIndex = index;
+        }
+    });
+
+    if (targetColumnIndex === -1) {
+        console.log("Machine column not found.");
+        return;
     }
 
 
 
+    let targetRow = null;
+    rows.forEach(row => {
+        const dateCell = row.querySelector('td:first-child');
+        if (dateCell && dateCell.textContent.trim() === selectedDate) {
+            targetRow = row;
+        }
+    });
+
+    if (!targetRow) {
+        console.log("Date row not found.");
+        return;
+    }
+
    
 
-</script>
+    targetColumnIndex = targetColumnIndex - 2;
+    targetColumnIndex = targetColumnIndex * 6;
+    targetColumnIndex = targetColumnIndex + 5;
 
+    targetRow.cells[targetColumnIndex].scrollIntoView({
+        behavior: 'smooth',
+        inline: 'center',
+        block: 'center'
+    });
+
+    const highlightDuration = 10000;
+    for (let i = targetColumnIndex; i < targetColumnIndex + 6; i++) {
+        const cell = targetRow.cells[i];
+        if (cell) {
+
+            // Scroll the table to ensure the highlighted cell is visible
+            // table.scrollTop = targetRow.offsetTop - table.clientHeight / 2; // Adjust vertical scroll
+            // table.scrollLeft = cell.offsetLeft - table.clientWidth / 2; // Adjust horizontal scroll
+
+            cell.style.transition = "background-color 0.5s";
+            cell.style.backgroundColor = "#df9675";
+
+            setTimeout(() => {
+                cell.style.backgroundColor = "";
+            }, highlightDuration);
+        }
+    }
+
+
+}
+</script>
\ No newline at end of file