@extends('master')
@section('content')
    <div class="page-wrapper">
        <div class="content">
            <div class="page-header">
                <div class="page-title">
                    <h4>{{ __('sitelabel.AddNewQuotationManagement') }}</h4>
                    <h6>{{ __('sitelabel.CreatenewQuotationManagement') }}</h6>
                </div>
            </div>

            <form method="post" action="{{ url('/quotationmanagementprocess') }}" id="quotationForm"
                enctype="multipart/form-data">
                @csrf
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.OrderDate') }} <span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="txtOrderDate"
                                        value="{{ date('Y-m-d') }}">
                                    @error('txtOrderDate')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.DueDate') }}<span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="txtDueDate">
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.BillNo') }} <span class="text-danger"></span></label>
                                    <input type="text" class="form-control" name="txtBillNo" value="{{ $billNo }}"
                                        readonly>
                                    @error('txtBillNo')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Vendor') }} <span class="text-danger">*</span></label>
                                    <select class="form-control" name="cmbVendor" id="cmbVendor">
                                        <option value="">{{ __('sitelabel.SelectVendor') }}</option>
                                        @foreach ($vendors as $vendor)
                                            <option value="{{ $vendor->Id }}">{{ $vendor->Name }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbVendor')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ApprovedBy') }} <span class="text-danger">*</span></label>
                                    <select class="form-control" name="cmbApprovedBy" id="cmbApprovedBy">
                                        <option value="">{{ __('sitelabel.SelectApprovedBy') }}</option>
                                        @foreach ($approveds as $approved)
                                            <option value="{{ $approved->Id }}">{{ $approved->FullName }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbApprovedBy')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.PaymentMode') }} <span class="text-danger">*</span></label>
                                    <select class="form-control" name="cmbPaymentMode" id="cmbPaymentMode">
                                        <option value="">{{ __('sitelabel.SelectPaymentMode') }}</option>
                                        @foreach ($payments as $payment)
                                            <option value="{{ $payment->Id }}">{{ $payment->Name }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbPaymentMode')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.FinancialYear') }} <span class="text-danger">*</span></label>
                                    <select class="form-control" name="cmbFinancialYear" id="cmbFinancialYear">
                                        <option value="">{{ __('sitelabel.SelectFinancialYear') }}</option>
                                        @foreach ($finyears as $finyear)
                                            <option value="{{ $finyear->Id }}">{{ $finyear->Title }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbFinancialYear')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.RequestBy') }} <span class="text-danger">*</span></label>
                                    <select class="form-control" name="cmbRequestBy" id="cmbRequestBy">
                                        <option value="">{{ __('sitelabel.SelectRequestBy') }}</option>
                                        @foreach ($requestbys as $requestby)
                                            <option value="{{ $requestby->Id }}">{{ $requestby->RequestByName }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbRequestBy')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.TaxTreatment') }}</label>
                                    <select class="form-control" name="cmbTaxRate" id="cmbTaxRate">
                                        <option value="">{{ __('sitelabel.SeleactTaxRate') }}</option>
                                        @foreach ($taxrate as $taxrate)
                                            <option value="{{ $taxrate->Id }}">{{ $taxrate->Name }}</option>
                                        @endforeach
                                    </select>
                                    @error('cmbTaxRate')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.QuotationStatus') }}</label>
                                    <select class="form-control" name="QuotationStatus">
                                        <option value="1">Pending</option>
                                        <option value="2">Approved</option>
                                        <option value="3">Rejected</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Attachments') }}</label>
                                    <input type="file" class="form-control" name="attachments[]" multiple>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ReferenceNo') }}</label>
                                    <input type="text" class="form-control" name="txtReferenceNo">
                                    @error('txtReferenceNo')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.JobNo') }}</label>
                                    <input type="text" class="form-control" name="txtJobNo">
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Status') }}</label>
                                    <input class="form-check-input" type="checkbox" id="chkStatus" name="chkStatus"
                                        checked>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="table-responsive">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th>{{ __('sitelabel.Product') }}</th>
                                            <th>{{ __('sitelabel.Name') }}</th>
                                            <th>{{ __('sitelabel.Price') }}</th>
                                            <th>{{ __('sitelabel.Quantity') }}</th>
                                            <th>{{ __('sitelabel.DiscountType') }}</th>
                                            <th>{{ __('sitelabel.Discount') }}</th>
                                            <th>{{ __('sitelabel.Action') }}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>
                                                <select class="form-select" name="cmbProduct" id="cmbProduct">
                                                    <option value="-1">{{ __('sitelabel.SelectProduct') }}</option>
                                                    @foreach ($products as $product)
                                                        <option value="{{ $product->Id }}"
                                                            data-sku="{{ $product->SKU }}"
                                                            data-name="{{ $product->Name }}"
                                                            data-price="{{ $product->SalePrice }}">
                                                            {{ $product->SKU }}-{{ $product->Name }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </td>
                                            <td>
                                                <input type="text" name="txtName" id="txtName"
                                                    class="form-control">
                                                <input type="hidden" name="hdProductId" id="hdProductId">
                                            </td>
                                            <td>
                                                <input type="number" class="form-control" name="txtSalePrice"
                                                    id="txtSalePrice" step="0.01" value="0">
                                            </td>
                                            <td>
                                                <input type="number" class="form-control" id="txtQty" name="txtQty"
                                                    value="0">
                                            </td>
                                            <td>
                                                <select class="form-control" id="txtDiscountType" name="txtDiscountType">
                                                    <option value="1">Flat</option>
                                                    <option value="2">Percent</option>
                                                </select>
                                            </td>
                                            <td>
                                                <input type="number" class="form-control" id="txtDiscount"
                                                    name="txtDiscount" value="0">
                                            </td>
                                            <td>
                                                <button id="btnAdd" type="button" name="btnAdd"
                                                    class="btn btn-primary">
                                                    {{ __('sitelabel.Add') }}
                                                </button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <div class="row">
                            <div class="table-responsive">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>{{ __('sitelabel.SerialNumber') }}</th>
                                            <th>{{ __('sitelabel.Product') }}</th>
                                            <th>{{ __('sitelabel.Name') }}</th>
                                            <th>{{ __('sitelabel.Qty') }}</th>
                                            <th>{{ __('sitelabel.Price') }}</th>
                                            <th>{{ __('sitelabel.SubTotal') }}</th>
                                            <th>{{ __('sitelabel.Disc') }}</th>
                                            <th>{{ __('sitelabel.Tax') }}</th>
                                            <th>{{ __('sitelabel.NetAmt') }}</th>
                                            <th>{{ __('sitelabel.Action') }}</th>
                                        </tr>
                                    </thead>
                                    <tbody id="tdOrderDetailBody">
                                        {{-- Rows Will Be Populated By Js --}}
                                    </tbody>
                                </table>

                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>&nbsp;</th>
                                            <th>
                                                <strong>{{ __('sitelabel.SubTotal') }}</strong>
                                            </th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th class="text-end">
                                                <strong>
                                                    <span id="spSubTotal">0.00</span>
                                                    <input type="hidden" class="form-control" name="hdMainSubTotal"
                                                        id="hdMainSubTotal" value="0">
                                                </strong>
                                            </th>
                                        </tr>
                                        <tr>
                                            <th>&nbsp;</th>
                                            <th>
                                                <strong>{{ __('sitelabel.Discount') }}</strong>
                                            </th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th class="text-end">
                                                <strong>
                                                    <span id="spDiscount">0.00</span>
                                                    <input type="hidden" class="form-control" name="hdMainDiscount"
                                                        id="hdMainDiscount" value="0">
                                                </strong>
                                            </th>
                                        </tr>
                                        <tr>
                                            <th>&nbsp;</th>
                                            <th>
                                                <strong>{{ __('sitelabel.Tax') }}</strong>
                                            </th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th class="text-end">
                                                <strong>
                                                    <span id="spTax">0.00</span>
                                                    <input type="hidden" class="form-control" name="hdMainSaleTax"
                                                        id="hdMainSaleTax" value="0">
                                                </strong>
                                            </th>
                                        </tr>
                                        <tr>
                                            <th>&nbsp;</th>
                                            <th>
                                                <strong>{{ __('sitelabel.NetAmount') }}</strong>
                                            </th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th>&nbsp;</th>
                                            <th class="text-end">
                                                <strong>
                                                    <span id="spTotal">0.00</span>
                                                    <input type="hidden" class="form-control" name="hdMainNetTotal"
                                                        id="hdMainNetTotal" value="0">
                                                </strong>
                                            </th>
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Note') }}</label>
                                    <textarea class="form-control" name="txtNote"></textarea>
                                </div>
                            </div>

                        </div>

                        <div class="col-lg-12">
                            <input type="hidden" name="hdnOrderItemsJson" id="hdnOrderItemsJson">
                            <button type="submit" class="btn btn-primary">{{ __('sitelabel.Save') }}</button>
                            <button type="button"
                                onclick="javascript:window.location='{{ url('/quotationmanagement') }}';"
                                class="btn btn-dark">{{ __('sitelabel.Back') }}</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('script')
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script>
        $(document).ready(function() {
            var RowId = 1;
            var gSubTotal = 0;
            var gDiscount = 0;
            var gTax = 0;
            var gNetAmount = 0;
            var gTaxRate = 0;
            var orderItems = [];

            // Initialize Select2
            $('#cmbVendor, #cmbApprovedBy, #cmbPaymentMode, #cmbFinancialYear, #cmbRequestBy, #cmbTaxRate, #cmbProduct')
                .select2({
                    theme: "bootstrap-5",
                    width: '100%'
                });

            // Tax rate change handler
            $("#cmbTaxRate").change(function() {
                var TaxRateId = $(this).val();
                if (TaxRateId != "") {
                    $.ajax({
                        type: "GET",
                        url: "/api/GetTaxRateById/" + TaxRateId,
                        contentType: "application/json;charset=utf-8",
                        success: function(data) {
                            $.each(data, function(key, item) {
                                for (var index = 0; index < item.length; index++) {
                                    gTaxRate = item[index].TaxRate;
                                }
                            });
                        },
                        error: function(error) {
                            console.error("Error fetching tax rate:", error);
                            gTaxRate = 0;
                        }
                    });
                } else {
                    gTaxRate = 0;
                }
            });

            // Product selection handler
            $("#cmbProduct").change(function() {
                var selectedOption = $(this).find("option:selected");
                if ($(this).val() != "-1") {
                    $("#hdProductId").val($(this).val());
                    $("#txtName").val(selectedOption.data('name'));
                    $("#txtSalePrice").val(selectedOption.data('price'));
                } else {
                    $("#hdProductId").val("");
                    $("#txtName").val("");
                    $("#txtSalePrice").val("0");
                }
            });

            // Add button click handler
            $("#btnAdd").click(function() {
                var productId = $("#cmbProduct").val();
                var productName = $("#txtName").val();
                var qty = parseFloat($("#txtQty").val());
                var salePrice = parseFloat($("#txtSalePrice").val());
                var discountType = $("#txtDiscountType").val();
                var discount = parseFloat($("#txtDiscount").val()) || 0;

                // Validation
                if (productId == "-1" || productId == "") {
                    alert("Please select a product");
                    return;
                }

                // Add this right after your existing discount validation in the "#btnAdd" click handler
                if (discountType == "1") { // Flat discount
                    if (discount > subTotal) {
                        alert("Flat discount cannot be greater than subtotal (Price × Quantity)");
                        $("#txtDiscount").focus();
                        return;
                    }
                } else { // Percentage discount
                    if (discount < 0 || discount > 100) {
                        alert("Percentage discount must be between 0 and 100");
                        $("#txtDiscount").focus();
                        return;
                    }
                }

                if (isNaN(qty) || qty <= 0) {
                    alert("Please enter valid quantity");
                    $("#txtQty").focus();
                    return;
                }

                if (isNaN(salePrice) || salePrice <= 0) {
                    alert("Please enter valid price");
                    $("#txtSalePrice").focus();
                    return;
                }

                // Calculate amounts
                var subTotal = salePrice * qty;
                var discountAmount = 0;

                if (discountType == "1") { // Flat discount
                    discountAmount = discount;
                } else { // Percentage discount
                    discountAmount = (subTotal * discount) / 100;
                }



                // Calculate tax
                var taxAmount = 0;
                if (gTaxRate > 0) {
                    taxAmount = ((subTotal - discountAmount) * gTaxRate) / 100;
                }

                // Calculate net amount
                var netAmount = subTotal - discountAmount + taxAmount;

                // Update totals
                gSubTotal += subTotal;
                gDiscount += discountAmount;
                gTax += taxAmount;
                gNetAmount = gSubTotal - gDiscount + gTax;

                // Update display
                updateTotals();

                // Add to order items
                var item = {
                    productId: productId,
                    productName: productName,
                    quantity: qty,
                    price: salePrice,
                    subTotal: subTotal,
                    discountType: discountType,
                    discountValue: discount,
                    discountAmount: discountAmount,
                    taxRate: gTaxRate,
                    taxAmount: taxAmount,
                    netAmount: netAmount
                };

                orderItems.push(item);

                // Add row to table
                var html = `
                    <tr id="tr${RowId}">
                        <td>${RowId}</td>
                        <td>${$("#cmbProduct option:selected").text()}</td>
                        <td>${productName}</td>
                        <td>${qty}</td>
                        <td>${formatNumber(salePrice)}</td>
                        <td>${formatNumber(subTotal)}</td>
                        <td>${formatNumber(discountAmount)}</td>
                        <td>${formatNumber(taxAmount)}</td>
                        <td>${formatNumber(netAmount)}</td>
                        <td>
                            <a href="javascript:void(0);" class="delete-btn" data-row-id="${RowId}" data-index="${orderItems.length - 1}">
                                <img src="/admin/assets/img/icons/delete-2.svg" alt="img">
                            </a>
                        </td>
                    </tr>
                `;

                $('#tdOrderDetailBody').append(html);

                // Store items in hidden input
                $('#hdnOrderItemsJson').val(JSON.stringify(orderItems));

                // Clear product form
                $("#cmbProduct").val("-1").trigger('change');
                $("#txtName").val("");
                $("#txtSalePrice").val("0");
                $("#txtQty").val("0");
                $("#txtDiscount").val("0");

                // Increment row counter
                RowId++;
            });

            // Delete button handler (using event delegation)
            $(document).on('click', '.delete-btn', function() {
                var rowId = $(this).data('row-id');
                var index = $(this).data('index');

                // Remove from orderItems array
                if (index >= 0 && index < orderItems.length) {
                    var item = orderItems[index];

                    // Update totals
                    gSubTotal -= item.subTotal;
                    gDiscount -= item.discountAmount;
                    gTax -= item.taxAmount;
                    gNetAmount = gSubTotal - gDiscount + gTax;

                    // Remove from array
                    orderItems.splice(index, 1);

                    // Update display
                    updateTotals();

                    // Update hidden input
                    $('#hdnOrderItemsJson').val(JSON.stringify(orderItems));
                }

                // Remove row from table
                $("#tr" + rowId).remove();
            });

            // Form submission validation
            $("#quotationForm").submit(function(e) {
                // Validate order items
                if (orderItems.length === 0) {
                    e.preventDefault();
                    alert("Please add at least one product to the quotation.");
                    return false;
                }

                // Ensure the JSON is updated
                $('#hdnOrderItemsJson').val(JSON.stringify(orderItems));
                return true;
            });

            // Helper function to update totals display
            function updateTotals() {
                $("#spSubTotal").text(formatNumber(gSubTotal));
                $("#hdMainSubTotal").val(gSubTotal);
                $("#spDiscount").text(formatNumber(gDiscount));
                $("#hdMainDiscount").val(gDiscount);
                $("#spTax").text(formatNumber(gTax));
                $("#hdMainSaleTax").val(gTax);
                $("#spTotal").text(formatNumber(gNetAmount));
                $("#hdMainNetTotal").val(gNetAmount);
            }

            // Format number for display
            function formatNumber(num) {
                return parseFloat(num).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');
            }
        });
    </script>
@endsection