@extends('company-admin-dashboard')

@section('title', $data['title'])
@section('dashboard-content')
    <div class="page-content" style="padding: 25px calc(24px / 2) 60px calc(24px / 2); background-color: #f7f7f9;">
        <div class="container-fluid">
            <style>
                #showitemnewamount tbody td:nth-child(n+4) {
                    text-align: right;
                }

                #billadjustmentdatetable tbody td:nth-child(n+4) {
                    text-align: right;
                }

                .card {
                    border-radius: 8px;
                    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
                    margin-bottom: 20px;
                }

                .card-header {
                    background-color: #fff;
                    border-bottom: 1px solid #eee;
                    padding: 15px 20px;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                }

                .card-body {
                    padding: 20px;
                }

                .btn-reset {
                    background-color: #f8f9fa;
                    border: 1px solid #ddd;
                    padding: 5px 10px;
                    border-radius: 4px;
                    cursor: pointer;
                }
                .datetimepicker-input{
                    border-top-right-radius: 0px !important;
                    border-bottom-right-radius: 0px !important;
                }
                .input-group-text{
                    border: 1px solid #ced4da;
                    border-top-right-radius: 5px !important;
                    border-bottom-right-radius: 5px !important;
                    border-top-left-radius: 0px !important;
                    border-bottom-left-radius: 0px !important;
                }

                
            </style>

            <!-- Bill Adjustment Card -->
            @if (in_array('list', $data['billAdjustmentPermissions']))
                <div class="card" id="billadjustmentcard">
                    <div class="card-header">
                        <div class="d-flex align-items-center">
                            <img class="favicon-logo" src="{{ getCompanyFavicon() }}"  alt="Company Logo"  width="40px">&nbsp;
                            <h5 class="mb-0"><b>Bill Adjustment</b></h5>
                        </div>
                        <button id="resetButton" class="btn-custom">Reset</button>
                    </div>
                    <div class="card-body">
                        <div class="mb-3">
                            <label for="billadjustment_date">Date<font color="red"> *</font></label>
                            <div class="d-flex align-items-center">
                                <div class="form-group" style="border-radius: .25rem; width: 25%; margin-right: 15px;">
                                    <div class="input-group date" id="billadjustment_date_container"
                                        data-target-input="nearest">
                                        <input type="text" class="form-control datetimepicker-input"
                                            placeholder="Select Date" data-target="#billadjustment_date_container"
                                            data-date-format="dd-mm-yyyy" data-date-autoclose="true" name="billadjustment_date"
                                            id="billadjustment_date">
                                        <div class="input-group-append" data-target="#billadjustment_date_container"
                                            data-toggle="datetimepicker">
                                            <div class="input-group-text"><i class="fa fa-calendar"></i></div>
                                        </div>
                                    </div>
                                </div>
                                {{-- <button type="button" id="downloadPdfBtn" class="btn btn-primary" style="display: none;">
                                    <i class="fa fa-download"></i> Download PDF
                                </button> --}}
                                <div class="d-flex align-items-center" style="gap: 15px;">
                                    
                                  

                                    <!-- Total Amount Display -->
                                    <div id="totalAmountDisplay" style="display:none; background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 5px; padding: 0.59rem 0.85rem;">
                                        <span class="fw-bold">Total Net Amount: </span>
                                        <span class="fw-bold text-success" id="totalAmountValue">₹0.00</span>
                                    </div>

                                    <!-- Download Button -->
                                    <button type="button" id="downloadPdfBtn" class="btn btn-primary" style="display: none;">
                                        <i class="fa fa-download"></i> Download PDF
                                    </button>

                                 
                                   
                                </div>

                            </div>
                        </div>
                        
                        <!-- More Details Toggle for First Table -->
                        <div class="mb-3" id="firstTableToggle" style="display: none;">
                            <a href="#" class="text-decoration-none test-primary" id="toggleFirstTable">
                                More Details.. <i class="bx bx-chevron-down" id="firstTableIcon" style="vertical-align: middle;"></i>
                            </a>
                        </div>
                        
                        <div class="table-responsive table-nowrap custom-table" style="display: none;" id="firstTableContainer">
                            <table id="billadjustmentdatetable"
                                class="table table-striped table-bordered dataTable table-responsive"
                                style="margin-bottom: 20px !important;margin-top: 0px !important;">
                                <thead>
                                    <th>Order Id </th>
                                    <th>Item Name</th>
                                    <th>Quantity</th>
                                    <th>Qty Rate</th>
                                    <th>Salerate</th>
                                    <th>Gstper</th>
                                    <th>Gst Amount</th>
                                    <th>Discountper</th>
                                    <th>Discount Amount</th>
                                    <th>Netamount</th>
                                </thead>
                                <tbody style="font-size: 14px;">
                                    <!-- Data will be loaded here -->
                                </tbody>
                            </table>
                        </div>
                        <div class="mb-3">
                            <label for="addnewamt">Add New Amount<font color="red"> *</font></label>
                            <div class="d-flex align-items-center">
                                <input type="number" class="form-control addnewamt" style="width: 25%; margin-right: 15px;" name="addnewamt"
                                    id="addnewamt" placeholder="Add New Amount">

                                     <!-- Total New Final Amount Display -->
                                    <div id="totalNewFinalAmountDisplay" style="background: rgb(248, 249, 250);border: 1px solid rgb(222, 226, 230);border-radius: 5px;padding: .47rem .75rem;">
                                        <span class="fw-bold">Total New Final Amount: </span>
                                        <span class="fw-bold text-success" id="totalNewFinalAmountValue">₹0.00</span>
                                    </div>

                              
                            </div>
                        </div>
                        
                        <!-- More Details Toggle for Second Table -->
                        <div class="mb-3" id="secondTableToggle" style="display: none;">
                            <a href="#" class="text-decoration-none test-primary" id="toggleSecondTable">
                                More Details.. <i class="bx bx-chevron-down" id="secondTableIcon" style="vertical-align: middle;"></i>
                            </a>
                        </div>
                        
                        <div class="table-responsive table-nowrap custom-table" style="display: none;" id="secondTableContainer">
                            <table id="showitemnewamount"
                                class="table table-striped table-bordered dataTable table-responsive">
                                <thead>
                                    <th>Order Id</th>
                                    <th>Item Name</th>
                                    <th>Quantity</th>
                                    <th>Qty Rate</th>
                                    <th>Salerate</th>
                                    <th>Gstper</th>
                                    <th>Gst Amount</th>
                                    <th>Discountper</th>
                                    <th>Discount Amount</th>
                                    <th>Netamount</th>
                                </thead>
                                <tbody style="font-size: 14px;">
                                    <!-- Calculated data will be displayed here -->
                                </tbody>
                            </table>
                        </div>
                        <div class="d-flex justify-content-end mt-3">
                            <div class="w-50">
                                <div id="validationAlert" class="alert alert-danger" style="display: none; margin-bottom: 10px;">
                                    <i class="fa fa-exclamation-triangle"></i>
                                    <span id="validationMessage"></span>
                                </div>
                                <div class="text-end">
                                    <button type="button" class="btn btn-primary" id="updateOrdersBtn">
                                        <i class="fa fa-edit"></i> Update Orders
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endif
        </div>
    </div>

    <!-- Confirmation Modal -->
    <div class="modal fade" id="confirmUpdateModal" tabindex="-1" role="dialog" aria-labelledby="confirmUpdateModalLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="confirmUpdateModalLabel">Confirm Order Update</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal">
                    </button>
                </div>
                <div class="modal-body">
                    <div class="alert alert-warning mb-2">
                        <i class="fa fa-exclamation-triangle"></i>
                        <strong>Warning:</strong> Are you sure you want to update all orders?
                    </div>
                    <div class="alert mb-0 p-1">
                        <ul class="mb-0 ps-3">
                            <li>
                                <i class="fa fa-file-pdf text-danger me-1"></i>
                                This action <strong>cannot be undone</strong>. Please download the PDF for backup before proceeding.
                            </li>
                            <li class="mt-2">
                                <i class="fa fa-sync-alt text-primary me-1"></i>
                                All order items, totals, and payment details will be recalculated and updated.
                            </li>
                        </ul>
                    </div>
                    {{-- <div class="mt-2">
                        <p class="mb-1 text-danger fw-semibold">
                            <i class="fa fa-exclamation-circle me-1"></i>
                            This action cannot be undone.
                        </p>
                        <p class="mb-1 text-muted">
                            <i class="fa fa-file-download me-1"></i>
                            Please download the PDF before proceeding.
                        </p>
                        <p class="mb-0 text-muted">
                            <i class="fa fa-calculator me-1"></i>
                            Order items, totals, and payment details will be updated.
                        </p>
                    </div> --}}

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                        <i class="fa fa-times"></i> Cancel
                    </button>
                    <button type="button" class="btn btn-primary" onclick="updateOrders()" data-bs-dismiss="modal">
                        <i class="fa fa-check"></i> Confirm Update
                    </button>
                </div>
            </div>
        </div>
    </div>
@endsection('dashboard-content')

@section('custom-scripts')
    <script>
        var loadDateItemsbydate = '{{ route('lodeitemsbydate') }}';
        var downloadDatePdfsUrl = '{{ route('downloaddatepdfs') }}';
        var updateOrdersUrl = '{{ route('updateorders') }}';
        var currentDateOrders = [];
        var adjustedOrdersData = [];

        $(document).ready(function() {
            // Initialize the datepicker
            $('#billadjustment_date_container').datepicker({
                format: 'dd-mm-yyyy',
                autoclose: true,
                todayHighlight: true
            });

            // Initialize the card in a clean state
            resetCard();

            // Reset button functionality
            $('#resetButton').click(function() {
                resetCard();
            });

            // Download PDF button functionality
            $('#downloadPdfBtn').click(function() {
                let selectedDate = $('#billadjustment_date').val();
                if (selectedDate && currentDateOrders.length > 0) {
                    downloadDatePdfs(selectedDate);
                }
            });

            // Update Orders button functionality
           $('#updateOrdersBtn').on('click', function () {
                if (adjustedOrdersData.length === 0) {
                    alert('No adjusted data to update.');
                    return;
                }
                
                // Check if any item quantity becomes 0
                let hasZeroQty = adjustedOrdersData.some(item => item.new_qty === 0);
                if (hasZeroQty) {
                    $('#validationMessage').text('Cannot update: One or more items have quantity 0. Please adjust the amount.');
                    $('#validationAlert').show();
                    flasher.error('Cannot update: One or more items have quantity 0. Please adjust the amount.');
                    return;
                }
                
                $('#validationAlert').hide();
                $('#confirmUpdateModal').modal('show');
            });
            
            // Toggle functionality for first table
            $('#toggleFirstTable').on('click', function(e) {
                e.preventDefault();
                $('#firstTableContainer').toggle();
                let icon = $('#firstTableIcon');
                if ($('#firstTableContainer').is(':visible')) {
                    icon.removeClass('bx-chevron-down').addClass('bx-chevron-up');
                } else {
                    icon.removeClass('bx-chevron-up').addClass('bx-chevron-down');
                }
            });
            
            // Toggle functionality for second table
            $('#toggleSecondTable').on('click', function(e) {
                e.preventDefault();
                $('#secondTableContainer').toggle();
                let icon = $('#secondTableIcon');
                if ($('#secondTableContainer').is(':visible')) {
                    icon.removeClass('bx-chevron-down').addClass('bx-chevron-up');
                    $('#updateOrdersBtn').show();
                    // Check for zero quantities and show validation alert if needed
                    let hasZeroQty = adjustedOrdersData.some(item => item.new_qty === 0);
                    if (hasZeroQty) {
                        $('#validationAlert').show();
                    }
                } else {
                    icon.removeClass('bx-chevron-up').addClass('bx-chevron-down');
                    $('#validationAlert').hide();
                    // $('#updateOrdersBtn').hide();
                }
            });
            
            // Date change event - FIX: Use the correct 'changeDate' event
            $('#billadjustment_date_container').on('changeDate', function(e) {
                // FIX: Get the value directly from the input field after the event fires.
                let selectedDate = $('#billadjustment_date').val();
                console.log('Selected Date:', selectedDate);

                if (selectedDate) {
                    loadDateItems(selectedDate);
                } else {
                    // This handles the case where the date is cleared
                    resetCard();
                }
            });
        });

        function resetCard() {
            // Clear the datepicker value
            $('#billadjustment_date_container').datepicker('clear');
            // Clear the tables and input
            $('#billadjustmentdatetable tbody').empty();
            $('#showitemnewamount tbody').empty();
            $('#addnewamt').val('');
            // Hide download button
            $('#downloadPdfBtn').hide();
            $('#updateOrdersBtn').hide();
            $('#totalAmountDisplay').hide();
            $('#totalNewFinalAmountDisplay').hide();
            $('#firstTableContainer').hide();
            $('#secondTableContainer').hide();
            $('#firstTableToggle').hide();
            $('#secondTableToggle').hide();
            $('#validationAlert').hide();
            // Reset icons
            $('#firstTableIcon').removeClass('bx-chevron-up').addClass('bx-chevron-down');
            $('#secondTableIcon').removeClass('bx-chevron-up').addClass('bx-chevron-down');
            currentDateOrders = [];
            adjustedOrdersData = [];
        }
        function roundQty(value) {
            let intPart = Math.floor(value);
            let decimalPart = value - intPart;

            return decimalPart >= 0.5 ? intPart + 1 : intPart;
        }

        function loadDateItems(date) {
            $.ajax({
                url: loadDateItemsbydate,
                type: 'GET',
                data: {
                    date: date
                },
                success: function(response) {
                    $('#billadjustmentdatetable tbody').empty();
                    $('#showitemnewamount tbody').empty();
                    $('#addnewamt').val('');
                    let totalNetAmount = 0;
                    let totalnewfinalAmount = 0; // Ensure this is declared once
                    currentDateOrders = []; // Reset orders array

                    if (response.length > 0) {
                        // Get unique order IDs
                        let uniqueOrderIds = [...new Set(response.map(item => item.order_id))];
                        currentDateOrders = uniqueOrderIds;
                        
                        // Show download button if orders exist
                        $('#downloadPdfBtn').show();
                        $('#totalAmountDisplay').show();
                        $('#totalAmountValue').text(totalNetAmount.toFixed(2));

                        $.each(response, function(index, item) {
                            totalNetAmount += parseFloat(item.netamount);
                        });

                        // Show download button if orders exist
                        $('#downloadPdfBtn').show();
                        $('#totalAmountDisplay').show();
                        $('#firstTableContainer').hide();
                        $('#firstTableToggle').show();
                        $('#totalAmountValue').text('₹' + totalNetAmount.toFixed(2));

                        $.each(response, function(index, item) {
                            let gstAmount = (parseFloat(item.igstrate) || 0) + (parseFloat(item.cgstrate) || 0) + (parseFloat(item.sgstrate) || 0);
                            let gstPer = (parseFloat(item.igstper) || 0) + (parseFloat(item.cgstper) || 0) + (parseFloat(item.sgstper) || 0);
                            
                            $('#billadjustmentdatetable tbody').append(`
                                    <tr>
                                        <td>${item.order_id || '0'}</td>
                                        <td>${item.item_name || 'N/A'}</td>
                                        <td>${item.saleqty || '0.00'}</td>
                                        <td>${(parseFloat(item.salerate) / parseFloat(item.saleqty)).toFixed(2)}</td>
                                        <td>${item.salerate || '0.00'}</td>
                                        <td>${gstPer.toFixed(2)}%</td>
                                        <td>${gstAmount.toFixed(2)}</td>
                                        <td>${item.discountper || '0.00'}%</td>
                                        <td>${item.discountamount || '0.00'}</td>
                                        <td>${item.netamount || '0.00'}</td>
                                    </tr>
                                `);
                        });

                        $('#billadjustmentdatetable tbody').append(`
                                // <tr>
                                //     <td colspan="9" style="text-align: right;"><strong>Total Net Amount:</strong></td>
                                //     <td style="text-align: right;"><strong>${totalNetAmount.toFixed(2)}</strong></td>
                                // </tr>
                            `);

                        // Remove any existing input event handlers to prevent duplicates
                        $('#addnewamt').off('input');

                        // Add new input event handler
                        $('#addnewamt').on('input', function() {
                            let newAmount = parseFloat($(this).val()) || 0;
                            $('#showitemnewamount tbody').empty();
                            totalnewfinalAmount = 0; // Reset total for new calculation

                            if (newAmount > 0) {
                                adjustedOrdersData = [];
                                let isSecondTableVisible = $('#secondTableContainer').is(':visible');
                                
                                $.each(response, function(index, item) {
                                    let netamount = parseFloat(item.netamount) || 0;
                                    let oldSalerate = parseFloat(item.salerate) || 1;
                                    let oldQty = parseFloat(item.saleqty) || 1;
                                    let gstPer = (parseFloat(item.igstper) || 0);
                                    // let discountPer = parseFloat(item.discountper) || 0;
                                    let discountPer = 0;

                                    let per = (netamount / totalNetAmount) * 100;
                                    let itemFinalAmount = (per * newAmount) / 100;
                                    let subtotal = (itemFinalAmount * 100) / (100 + gstPer);
                                    // let newQty = Math.ceil(subtotal / (oldSalerate / oldQty));
                                    let rawQty = subtotal / (oldSalerate / oldQty);
                                    let newQty = roundQty(rawQty);
                                    
                                    let unitSalerate = oldSalerate / oldQty;
                                    let newTotalSalerate = unitSalerate * newQty;
                                    let newGstAmount = (newTotalSalerate * gstPer) / 100;
                                    // let newDiscountAmount = (newTotalSalerate * discountPer) / 100;
                                    let newDiscountAmount = 0; // Discount not considered in bill adjustment
                                    let newNetAmount = newTotalSalerate + newGstAmount - newDiscountAmount;
                                    
                                    totalnewfinalAmount += newNetAmount;

                                    adjustedOrdersData.push({
                                        order_item_id: item.id,
                                        order_id: item.order_id,
                                        new_qty: newQty,
                                        new_salerate: newTotalSalerate,
                                        new_gst_per:gstPer,
                                        new_gst_amount: newGstAmount,
                                        new_discount_amount: newDiscountAmount,
                                        new_net_amount: newNetAmount,
                                        old_Sale_rate : unitSalerate,
                                        new_discountPer : discountPer,
                                    });

                                    $('#showitemnewamount tbody').append(`
                                        <tr>
                                            <td>${item.order_id || '0'}</td>
                                            <td>${item.item_name || 'N/A'}</td>
                                            <td>${newQty}</td>
                                            <td>${(oldSalerate / oldQty).toFixed(2)}</td>
                                            <td>${newTotalSalerate.toFixed(2)}</td>
                                            <td>${gstPer.toFixed(2)}%</td>
                                            <td>${newGstAmount.toFixed(2)}</td>
                                            <td>${discountPer.toFixed(2)}%</td>
                                            <td>${newDiscountAmount.toFixed(2)}</td>
                                            <td>${newNetAmount.toFixed(2)}</td>
                                        </tr>
                                    `);
                                });

                                $('#showitemnewamount tbody').append(`
                                        // <tr>
                                        //     <td colspan="9" style="text-align: right;"><strong>Total New Final Amount:</strong></td>
                                        //     <td style="text-align: right;"><strong>${totalnewfinalAmount.toFixed(2)}</strong></td>
                                        // </tr>
                                    `);
                                $('#totalNewFinalAmountDisplay').show();
                                 $('#updateOrdersBtn').show();
                                $('#totalNewFinalAmountValue').text('₹' + totalnewfinalAmount.toFixed(2));
                                
                                // Preserve table visibility state
                                if (isSecondTableVisible) {
                                    $('#secondTableContainer').show();
                                    // $('#updateOrdersBtn').show();
                                } else {
                                    $('#secondTableContainer').hide();
                                    // $('#updateOrdersBtn').hide();
                                }
                                
                                $('#secondTableToggle').show();
                                
                                // Check for zero quantities and show validation alert if needed
                                let hasZeroQty = adjustedOrdersData.some(item => item.new_qty === 0);
                                if (hasZeroQty) {
                                    $('#validationMessage').text('Cannot update: One or more items have quantity 0. Please adjust the amount.');
                                    if (isSecondTableVisible) {
                                        $('#validationAlert').show();
                                    }
                                } else {
                                    $('#validationAlert').hide();
                                }
                            } else {
                                $('#updateOrdersBtn').hide();
                                $('#validationAlert').hide();
                            }
                        });
                    } else {
                        $('#billadjustmentdatetable tbody').append(
                            '<tr><td colspan="10" class="text-center">No items found for this date</td></tr>'
                        );
                    }
                },
                error: function(xhr) {
                    console.error(xhr.responseText);
                    alert('Failed to retrieve data.');
                }
            });
        }

        $('#profile-pic').on('click', function(e) {
            e.stopPropagation();
            $('#dropdown-menu').toggle();
        });

        function downloadDatePdfs(date) {
            if (currentDateOrders.length === 0) {
                flasher.error('No orders found for the selected date.');
                return;
            }

            $('#downloadPdfBtn').prop('disabled', true).html('<i class="fa fa-spinner fa-spin"></i> Downloading...');

            let downloadUrl = downloadDatePdfsUrl + '?date=' + date;
            
            let link = document.createElement('a');
            link.href = downloadUrl;
            link.download = 'Bills_' + date + '.pdf';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            
            setTimeout(function() {
                $('#downloadPdfBtn').prop('disabled', false).html('<i class="fa fa-download"></i> Download PDF');
            }, 1000);
        }

        function updateOrders() {
            $('#updateOrdersBtn').prop('disabled', true).html('<i class="fa fa-spinner fa-spin"></i> Updating...');
            
            $.ajax({
                url: updateOrdersUrl,
                type: 'POST',
                data: {
                    _token: '{{ csrf_token() }}',
                    adjusted_data: adjustedOrdersData
                },
                success: function(response) {
                    flasher.success('Orders updated successfully!');
                    resetCard();
                    $('#updateOrdersBtn').prop('disabled', false).html('<i class="fa fa-edit"></i> Update Orders');
                },
                error: function(xhr) {
                    console.error(xhr.responseText);
                    flasher.error('Failed to update orders.');
                    $('#updateOrdersBtn').prop('disabled', false).html('<i class="fa fa-edit"></i> Update Orders');
                }
            });
        }
    </script>
@endsection