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

            @if ($errors->any())
                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
            @endif

            <form method="post" action="{{ url('/pricelistprocess') }}" enctype="multipart/form-data">
                @csrf
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <!-- Code -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Code') }}</label>
                                    <input type="text" name="txtCode" id="txtCode" value="{{ $Code }}"
                                        readonly>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Name') }}<span class="text-danger">*</span></label>
                                    <input type="text" name="txtName" id="txtName" class="form-control"
                                        value="{{ old('txtName', '') }}" required>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ApplyFrom') }}<span class="text-danger">*</span></label>
                                    <input type="date" name="txtApplyFrom" id="txtApplyFrom" class="form-control"
                                        value="{{ old('txtApplyFrom', '') }}" required>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ApplyTo') }}<span class="text-danger">*</span></label>
                                    <input type="date" name="txtApplyTo" id="txtApplyTo" class="form-control"
                                        value="{{ old('txtApplyTo', '') }}" required>
                                    <span id="dateError" class="text-danger"></span>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Brand') }}</label>
                                    <select class="form-select" id="cmbBrand" name="cmbBrand">
                                        <option value="-1">{{ __('sitelabel.SelectBrand') }}</option>
                                        @foreach ($brand as $brand)
                                            @if ($brand->NameUr == '')
                                                <option value="{{ $brand->Id }}">{{ $brand->Name }}</option>
                                            @else
                                                <option value="{{ $brand->Id }}">
                                                    {{ $brand->Name }}-{{ $brand->NameUr }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Category') }}</label>
                                    <select class="form-select" id="cmbCategory" name="cmbCategory">
                                        <option value="-1">{{ __('sitelabel.SelectCategory') }}</option>
                                        @foreach ($category as $item)
                                            @if ($item->NameUr == '')
                                                <option value="{{ $item->Id }}">{{ $item->Name }}
                                                </option>
                                            @else
                                                <option value="{{ $item->Id }}">
                                                    {{ $item->Name }}-{{ $item->NameUr }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.SubCategory') }}</label>
                                    <select id="cmbSubCategory" name="cmbSubCategory" class="form-select">
                                        <option value="-1">{{ __('sitelabel.SelectSubCategory') }}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ChildCategory') }}</label>
                                    <select id="cmbChildCategory" name="cmbChildCategory" class="form-select">
                                        <option value="-1">{{ __('sitelabel.SelectChildCategory') }}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Description') }}</label>
                                    <textarea name="txtDescription" class="form-control" id="txtDescription">{{ old('txtName', '') }}</textarea>
                                </div>
                            </div>
                            <div class="col-lg-12">
                                <button type="button" id="loadproducts" class="btn btn-primary">
                                    {{ __('sitelabel.LoadProducts') }}
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Section 2 --}}
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.PurchasePrice') }}<span class="text-danger">*</span></label>
                                    <input type="number" id="ddlPurchasePrice" class="form-control" value="0"
                                        step="0.01">
                                </div>
                            </div>
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.SalePrice') }}<span class="text-danger">*</span></label>
                                    <input type="number" id="ddlSalePrice" class="form-control" value="0"
                                        step="0.01">
                                </div>
                            </div>
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.WholeSalePrice') }}<span class="text-danger">*</span></label>
                                    <input type="number" id="ddlWholeSalePrice" class="form-control" value="0"
                                        step="0.01">
                                </div>
                            </div>
                            <div class="col-lg-12">
                                <button type="button" id="applyprices" class="btn btn-primary">
                                    {{ __('sitelabel.Apply') }}
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Section 3 --}}
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <div class="row mt-4">
                                <div class="col-lg-12">
                                    <table class="table table-bordered table-responsive table-striped" id="productsTable">
                                        <thead style="background-color: #F26E23">
                                            <tr>
                                                <th style="color: #fff">{{ __('sitelabel.SerialNumber') }}</th>
                                                <th style="color: #fff">{{ __('sitelabel.Code') }}</th>
                                                <th style="color: #fff">{{ __('sitelabel.Product') }}</th>
                                                <th style="color: #fff">{{ __('sitelabel.PurchasePrice') }}</th>
                                                <th style="color: #fff">{{ __('sitelabel.SalePrice') }}</th>
                                                <th style="color: #fff">{{ __('sitelabel.WholeSalePrice') }}</th>
                                            </tr>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>

                            <!-- Submit -->
                            <div class="row mt-4">
                                <div class="col-lg-12">
                                    <button type="submit" class="btn btn-primary" id="savenewButton" name="save_data"
                                        value="1" disabled>
                                        {{ __('sitelabel.SaveAndNew') }}
                                    </button>
                                    <button type="submit" class="btn btn-primary" id="saveButton" name="save"
                                        disabled>
                                        {{ __('sitelabel.Save') }}
                                    </button>
                                    <button onclick="javascript:window.location='{{ url('/pricelist') }}';"
                                        type="button" class="btn btn-dark">
                                        {{ __('sitelabel.Back') }}
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('script')
    <script>
        window.onload = function() {
            @if (session()->get('locale') == 'ur')
                MakeTextBoxUrduEnabled(txtName);
            @endif

            // Attach date validation on change events
            document.getElementById('txtApplyFrom').addEventListener('change', validateDates);
            document.getElementById('txtApplyTo').addEventListener('change', validateDates);
        };

        function validateDates() {
            const startDate = document.getElementById('txtApplyFrom').value;
            const endDate = document.getElementById('txtApplyTo').value;
            const errorSpan = document.getElementById('dateError');
            const saveButton = document.querySelector('button[type="submit"]');

            // Clear any previous error messages
            if (errorSpan) {
                errorSpan.innerText = '';
            }

            if (startDate && endDate) {
                const start = new Date(startDate);
                const end = new Date(endDate);

                if (end <= start) {
                    // Display error message
                    if (errorSpan) {
                        errorSpan.innerText = "{{ __('sitelabel.ApplyToAfterApplyFrom') }}";
                    }
                    savenewButton.disabled = true;
                    saveButton.disabled = true;
                    return false;
                }
            }

            return true;
        }

        $(document).ready(function() {
            $('#cmbBrand, #cmbCategory, #cmbSubCategory, #cmbChildCategory').select2({
                theme: "bootstrap-5",
            });

            $("#cmbCategory").change(function() {
                var CategoryId = $("#cmbCategory").val();

                $('#cmbSubCategory').empty();
                $('#cmbSubCategory').append(
                    '<option value="">{{ __('sitelabel.SelectSubCategory') }}</option>');
                $.ajax({
                    type: "GET",
                    url: "{{ url('/') }}/subcategory/" + CategoryId,
                    contentType: "application/json;charset=utf-8",

                    success: function(data) {
                        $.each(data, function(key, item) {
                            for (var index = 0; index < item.length; index++) {

                                $('#cmbSubCategory').append('<option value="' + item[
                                        index].Id + '">' + item[index].Name +
                                    '</option>');
                            }
                        });

                    }
                });
            });

            $("#cmbSubCategory").change(function() {
                var SubCategoryId = $("#cmbSubCategory").val();
                $('#cmbChildCategory').empty();
                $('#cmbChildCategory').append(
                    '<option value="">{{ __('sitelabel.SelectChildCategory') }}</option>');
                $.ajax({
                    type: "GET",
                    url: "{{ url('/') }}/subcategory/" + SubCategoryId,
                    contentType: "application/json;charset=utf-8",
                    success: function(data) {
                        $.each(data, function(key, item) {
                            for (var index = 0; index < item.length; index++) {
                                $('#cmbChildCategory').append('<option value="' + item[
                                        index].Id + '">' + item[index].Name +
                                    '</option>');
                            }
                        });
                    }
                });
            });

            // Handle Apply Prices button click
            $("#applyprices").click(function() {
                // Check if products are loaded
                var rowCount = $("#productsTable tbody tr").length;
                if (rowCount === 0) {
                    alert("{{ __('sitelabel.PleaseLoadProductsFirst') }}");
                    return;
                }

                // Get the prices from section 2
                var purchasePrice = parseFloat($("#ddlPurchasePrice").val()) || 0;
                var salePrice = parseFloat($("#ddlSalePrice").val()) || 0;
                var wholeSalePrice = parseFloat($("#ddlWholeSalePrice").val()) || 0;

                // Update all rows with new prices
                $("#productsTable tbody tr").each(function() {
                    $(this).find('input[type="number"]').eq(0).val(purchasePrice);
                    $(this).find('input[type="number"]').eq(1).val(salePrice);
                    $(this).find('input[type="number"]').eq(2).val(wholeSalePrice);
                });

                // Enable save buttons after applying prices
                $("#saveButton, #savenewButton").prop('disabled', false);
            });

            // Handle Load Products button click
            $("#loadproducts").click(function() {
                // Check required fields
                var brand = $("#cmbBrand").val();
                var category = $("#cmbCategory").val();
                var subcategory = $("#cmbSubCategory").val();
                var childcategory = $("#cmbChildCategory").val();

                // If validation passes, fetch employee data
                $.ajax({
                    type: "GET",
                    url: "{{ url('/api/getProductsList') }}",
                    data: {
                        brand: brand,
                        category: category,
                        subcategory: subcategory,
                        childcategory: childcategory,
                    },
                    success: function(response) {
                        var tbody = $("#productsTable tbody");
                        tbody.empty(); // Clear previous data

                        if (response.data && response.data.length > 0) {
                            response.data.forEach(function(product, index) {
                                var row = `
                                    <tr>
                                        <td>${index + 1}</td>
                                        <td>${product.Code}</td>
                                        <td>${product.Name}<input type="hidden" name="productId[]" value="${product.Id}"></td>
                                        <td><input type="number" name="purchasePrice[]" class="form-control" value="${product.PurchasePrice}" step="0.01"></td>
                                        <td><input type="number" name="salePrice[]" class="form-control" value="${product.SalePrice}" step="0.01"></td>
                                        <td><input type="number" name="wholeSalePrice[]" class="form-control" value="${product.WholeSalePrice}" step="0.01"></td>
                                    </tr>
                                `;
                                tbody.append(row);
                            });

                            $("#saveButton, #savenewButton").prop('disabled', false);
                        } else {
                            alert("{{ __('sitelabel.NoProductsFound') }}");
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error("Error loading products:", error);
                        alert("{{ __('sitelabel.FailedToLoadProducts') }}: " + error);
                    }
                });
            });
        });
    </script>
@endsection