@php
use App\Enums\Deals\StageType;
use App\Enums\Tasks\RelatedToType;
use App\Enums\Tasks\Status;
@endphp
<x-Dashboard.Layout.Layout title="Edit Referral Setting">

    <div class="container">
        <div class="row justify-content-center">
            <div class="col-12 col-md-12">
                <div class="card border-0">
                    <div class="card-header">
                        <h6 class="text-lg font-weight-semibold mb-0">Edit Referral Setting</h6>
                    </div>
                    <form class="card-body" method="POST" action="{{ route('referralsettings.update',$referralsetting->id) }}">
                        @csrf
                        @method('PUT')
                        @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                        @endif

                        <div class="row mt-3">

                            <div class="col-md-6">
                                <x-forms.labels.basic>
                                    Select Product type
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" name="product_type" required onchange="toggleCategorySelect(this.value)">
                                    <option value="">Select Product type</option>
                                    <option value="product" @if(basename($referralsetting->product_type)=='App\\Models\\Product') selected @endif>Product</option>
                                    <option value="track" @if(basename($referralsetting->product_type)=='App\\Models\\TrackLevel') selected @endif>Track</option>
                                </x-forms.select.basic>
                            </div>
                            <div class="col-md-6" id="product-category" style="@if(basename($referralsetting->product_type)=='App\\Models\\Product') display: block; @else display: none; @endif">
                                <x-forms.labels.basic>
                                    Product Category
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" name="product_category_id" onchange="loadCategoryProducts(this.value)">
                                    <option value="">Select Product Category</option>
                                    @foreach ($getAcademyProductCategories as $getAcademyProductCategory)
                                    <option value="{{$getAcademyProductCategory?->id}}" @if($referralsetting?->product?->productType?->id == $getAcademyProductCategory?->id) selected @endif>
                                        {{$getAcademyProductCategory->name_en}}
                                    </option>
                                    @endforeach

                                    <!-- Add your product categories here -->
                                </x-forms.select.basic>
                            </div>


                            <div class="col-md-6" id="track-category" style="@if(basename($referralsetting->product_type)=='App\\Models\\TrackLevel') display: block; @else display: none; @endif">
                                <x-forms.labels.basic>
                                    Track Category
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" name="product_track_category_id" onchange="loadTrackCategoryProducts(this.value)">
                                    <option value="">Select Track Category</option>
                                    <!-- Add your track categories here -->
                                    @foreach ($getAcademytrackProductCategories as $getAcademytrackProductCategory)
                                    <option value="{{$getAcademytrackProductCategory->id}}" @if($referralsetting->product_category_id == $getAcademytrackProductCategory->id) selected @endif>
                                        {{$getAcademytrackProductCategory->name_en}}
                                    </option>
                                    @endforeach
                                </x-forms.select.basic>
                            </div>


                        </div>


                        <!-- Products in Selected Category -->


                        <!-- Products in Selected Category -->

                        <div class="row mt-3" id="product-category-products" style="@if(basename($referralsetting->product_type)=='App\\Models\\Product') display: block; @else display: none; @endif">
                            <div class="col-md-6">
                                <x-forms.labels.basic>
                                    Products
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" name="product_id" id="categoryProductsSelect">
                                    <option value="">Select Product</option>
                                    @if(basename($referralsetting->product_type)=='App\\Models\\Product')
                                    <option value="{{$referralsetting->product->id}}" selected>
                                        {{$referralsetting->product->name_en}}
                                    </option>
                                    @endif
                                    <!-- Populated via JS -->
                                </x-forms.select.basic>
                            </div>
                        </div>



                        <div class="row mt-3">
                            <!-- Products in Selected track -->
                            <div class="col-md-6" id="track-category-products" style="@if(basename($referralsetting->product_type)=='App\\Models\\TrackLevel') display: block; @else display: none; @endif">
                                <x-forms.labels.basic>
                                    Tracks
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" id="categorytracksSelect" name="track_id">
                                    <option value="">Select Track</option>
                                    @if(basename($referralsetting->product_type)=='App\\Models\\TrackLevel')
                                    <option value="{{ $referralsetting->track->id }}" selected>
                                        {{ $referralsetting->track->name_en }}
                                    </option>
                                    @endif
                                    <!-- Populated via JS -->
                                </x-forms.select.basic>
                            </div>
                        </div>



                        <div class="row mt-3">
                            <div class="col-md-6">
                                <x-forms.labels.basic>
                                    Select Discount type
                                </x-forms.labels.basic>
                                <x-forms.select.basic class="select2" name="discount_type" required>
                                    <option value="">Select Discount type</option>
                                    <option value="percentage" @if($referralsetting->discount_type=='percentage') selected @endif>Percentage</option>
                                    <option value="fixed" @if($referralsetting->discount_type=='fixed') selected @endif>Fixed</option>
                                </x-forms.select.basic>
                            </div>


                            <div class="col-md-6">
                                <x-forms.input-label.basic
                                    name="discount"
                                    required value="{{ old('discount',$referralsetting->discount) }}"
                                    type="number"
                                    min="1">
                                    Discount
                                </x-forms.input-label.basic>
                            </div>

                            <div class="col-md-6">
                                <x-forms.input-label.basic
                                    name="expire_day"
                                    required value="{{ old('expire_day',$referralsetting->expire_day) }}"
                                    type="number"
                                    min="1">
                                    Expire Day
                                </x-forms.input-label.basic>
                            </div>




                            <div class="row mt-3">
                                <div class="col-12 pt-4 text-end">
                                    <x-forms.buttons.primary class="float-end">
                                        Submit
                                    </x-forms.buttons.primary>
                                </div>
                            </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script>
        const accountsSelect = document.getElementById('accountsSelect');
        const contactsSelect = document.getElementById('contactsSelect');

        // Get old values from the server
        const oldAccountId = "{{ old('account_id', $queryParams['account_id'] ?? null) }}";
        const oldContactId = "{{ old('contact_id') }}";

        async function getAccountContacts(accountId, selectedContactId = null) {
            const url = `{{ route('api.v1.contacts.list') }}?account_id=${accountId}`;

            try {
                const res = await fetch(url);
                const data = await res.json();

                contactsSelect.innerHTML = '';

                const defaultOption = document.createElement('option');
                defaultOption.value = '';
                defaultOption.textContent = 'Select contact';
                defaultOption.disabled = true;
                contactsSelect.appendChild(defaultOption);

                Object.entries(data).forEach(([id, name]) => {
                    const option = document.createElement('option');
                    option.value = id;
                    option.textContent = name;
                    if (selectedContactId && selectedContactId == id) {
                        option.selected = true;
                        defaultOption.selected = false;
                    }
                    contactsSelect.appendChild(option);
                });
            } catch (error) {
                console.error('Failed to fetch contacts:', error);
            }
        }

        // On change of account dropdown
        accountsSelect.addEventListener('change', (e) => {
            const accountId = e.target.value;
            if (accountId) {
                getAccountContacts(accountId);
            }
        });

        // On page load: load contacts if old account_id exists
        document.addEventListener('DOMContentLoaded', () => {
            if (oldAccountId) {
                getAccountContacts(oldAccountId, oldContactId);
            }
        });
    </script>
    @push('script')
    <script src="{{asset('assets/js/dashboard/product/product.js')}}"></script>
    @endpush
</x-Dashboard.Layout.Layout>