@extends('layouts.dashboard')

@section('content')

@php
    // The same form serves first-create and resubmit-after-reject/expire.
    // `$existingEvent` is only set in resubmit mode; pre-fill helpers below
    // safely fall back to empty strings via the null-coalescing chain.
    $isResubmit       = $isResubmit ?? false;
    $existing         = $existingEvent ?? null;
    $existingServices = $existingServices ?? collect();
    $formAction       = $isResubmit ? url('/rm/resubmit-event') : url('/rm/store-event');
    $submitLabel      = $isResubmit ? 'Edit and Resend Confirmation' : 'Create Event';
    // Resubmit edits take priority over the original RM-request defaults
    // (RM may have been told to change category/location during chat).
    $defaultType      = $isResubmit ? ($existing->type ?? '') : (optional($rmDetails->categoryDetails)->type === 'corporate' ? 'professional' : (optional($rmDetails->categoryDetails)->type ?? ''));
    $defaultCategory  = $isResubmit ? ($existing->category ?? '') : $rmDetails->category;
    $defaultStateId   = $isResubmit ? ($existing->state_id ?? '') : $rmDetails->state_id;
    $defaultCityId    = $isResubmit ? ($existing->cities_id ?? '') : $rmDetails->city_id;
@endphp

<div class="content-wrapper" style="min-height: 241px;">
    <div class="content-header">
        <div class="container-fluid">
            @if(Session::has('msg'))
                <p class="alert {{ Session::get('alert-class', 'alert-info') }}">{{ Session::get('msg') }}</p>
            @endif
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">{{ $title }}</h1>
                </div>
                <div class="col-sm-6">
                    <a href="{{ url('/rm/rm-request-details/' . $rmDetails->uuid) }}" class="btn btn-secondary float-right">
                        <i class="fa fa-arrow-left"></i> Back to RM Details
                    </a>
                </div>
            </div>
        </div>
    </div>

    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">

                    {{-- Client Info Card (read-only) --}}
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title">Client Information</h3>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-4">
                                    <strong>Name:</strong> {{ $rmDetails->clientDetails->name ?? 'N/A' }}
                                </div>
                                <div class="col-md-4">
                                    <strong>Contact:</strong> {{ $rmDetails->clientDetails->phone ?? 'N/A' }}
                                </div>
                                <div class="col-md-4">
                                    <strong>Email:</strong> {{ $rmDetails->clientDetails->email_id ?? 'N/A' }}
                                </div>
                            </div>
                            @if($rmDetails->budget)
                            <div class="row mt-2">
                                <div class="col-md-4">
                                    <strong>RM Budget:</strong> {{ $rmDetails->budget }}
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>

                    {{-- Create Event Form --}}
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title">Event Details</h3>
                        </div>
                        <form id="createEventForm" action="{{ $formAction }}" method="POST">
                            {{ csrf_field() }}
                            <input type="hidden" name="rm_request_uuid" value="{{ $rmDetails->uuid }}">
                            <input type="hidden" name="client_id" value="{{ $rmDetails->client_id }}">

                            <div class="card-body">
                                <div class="row">
                                    {{-- Event Type --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="type">Event Type <span style="color:red;">*</span></label>
                                            <select name="type" id="type" class="form-control" required>
                                                <option value="">Select Type</option>
                                                <option value="personal" {{ ($defaultType === 'personal') ? 'selected' : '' }}>Personal</option>
                                                <option value="professional" {{ ($defaultType === 'professional') ? 'selected' : '' }}>Professional</option>
                                            </select>
                                        </div>
                                    </div>

                                    {{-- Category --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="category">Category <span style="color:red;">*</span></label>
                                            <select name="category" id="category" class="form-control" required>
                                                <option value="">Select Category</option>
                                                @foreach($categories as $cat)
                                                    <option value="{{ $cat->id }}" data-type="{{ $cat->type }}"
                                                        {{ ($defaultCategory == $cat->id) ? 'selected' : '' }}>
                                                        {{ $cat->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    {{-- Event Name --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="event_name">Event Name <span style="color:red;">*</span></label>
                                            <input type="text" name="event_name" id="event_name" class="form-control" required minlength="3" maxlength="100" placeholder="Enter event name (3-100 chars)" value="{{ old('event_name', $existing->event_name ?? '') }}">
                                        </div>
                                    </div>

                                    {{-- Number of Guests --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="guest_count">Number of Guests <span style="color:red;">*</span></label>
                                            <input type="number" name="guest_count" id="guest_count" class="form-control" required min="1" max="9999" step="1" inputmode="numeric" placeholder="1 to 9,999" value="{{ old('guest_count', $existing->guest_count ?? '') }}">
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    {{-- Event Date --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="event_date">Event Date <span style="color:red;">*</span></label>
                                            {{-- type="text" (not "date") so Flatpickr can fully own the
                                                 UX. Flatpickr's altInput mode (see createEvent.js) shows
                                                 DD-MM-YYYY to the user while this hidden real input still
                                                 submits YYYY-MM-DD to Laravel — best of both worlds. --}}
                                            <input type="text" name="event_date" id="event_date" class="form-control" required
                                                placeholder="DD-MM-YYYY"
                                                value="{{ old('event_date', $existing->event_date ?? '') }}">
                                        </div>
                                    </div>

                                    {{-- Event Time --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="event_start_time">Event Time <span style="color:red;">*</span></label>
                                            {{-- Trim to HH:MM. MySQL TIME columns return "HH:MM:SS"; passing
                                                 that into a type="time" input with step=60 leaves some browsers
                                                 in an invalid state where element.value reads empty and
                                                 jQuery Validate's `required` false-fires. --}}
                                            @php
                                                $rawTime  = old('event_start_time', $existing->event_start_time ?? '');
                                                $timeInit = $rawTime ? substr($rawTime, 0, 5) : '';
                                            @endphp
                                            {{-- Deliberately NOT setting step=60. Chrome's picker treats
                                                 step as strict for keyboard entry and rejects mid-typing
                                                 states, leaving .value=""; the spinner + picker still work
                                                 fine without it and default to 1-minute increments anyway. --}}
                                            <input type="time" name="event_start_time" id="event_start_time" class="form-control" required value="{{ $timeInit }}">
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    {{-- Country (locked to default country — disabled select cannot submit, hidden input carries the value) --}}
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="country_id">Country <span style="color:red;">*</span></label>
                                            <select id="country_id" class="form-control" disabled>
                                                <option value="{{ $defaultCountry->id }}" selected>{{ $defaultCountry->name }}</option>
                                            </select>
                                            <input type="hidden" name="country_id" value="{{ $defaultCountry->id }}">
                                        </div>
                                    </div>

                                    {{-- State --}}
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="state_id">State <span style="color:red;">*</span></label>
                                            <select name="state_id" id="state_id" class="form-control" required>
                                                <option value="">Select State</option>
                                                @foreach($states as $state)
                                                    <option value="{{ $state->id }}"
                                                        {{ ($defaultStateId == $state->id) ? 'selected' : '' }}>
                                                        {{ $state->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    {{-- City --}}
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="cities_id">City <span style="color:red;">*</span></label>
                                            <select name="cities_id" id="cities_id" class="form-control" required>
                                                <option value="">Select City</option>
                                                @foreach($cities as $city)
                                                    <option value="{{ $city->id }}"
                                                        {{ ($defaultCityId == $city->id) ? 'selected' : '' }}>
                                                        {{ $city->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                {{-- Description --}}
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label for="description">Description <span style="color:red;">*</span></label>
                                            <textarea name="description" id="description" class="form-control" rows="3" required minlength="10" maxlength="500" placeholder="Enter event description (10-500 chars)">{{ old('description', $existing->description ?? '') }}</textarea>
                                        </div>
                                    </div>
                                </div>

                                {{-- Services Section --}}
                                <hr>
                                <h4>Services</h4>
                                <div id="servicesContainer">
                                    @php
                                        $serviceRows = $isResubmit && $existingServices->count()
                                            ? $existingServices->values()
                                            : collect([(object) ['service_id' => '', 'amount' => 0]]);
                                    @endphp
                                    @foreach($serviceRows as $idx => $row)
                                        <div class="row service-row mb-2">
                                            <div class="col-md-5">
                                                <div class="form-group">
                                                    <label>Service <span style="color:red;">*</span></label>
                                                    <select name="services[{{ $idx }}][id]" class="form-control service-select" required>
                                                        <option value="">Select Service</option>
                                                        @foreach($services as $service)
                                                            <option value="{{ $service->uuid }}" {{ ($row->service_id == $service->uuid) ? 'selected' : '' }}>{{ $service->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label>Budget <span style="color:red;">*</span></label>
                                                    <input type="number" name="services[{{ $idx }}][budget]" class="form-control" required min="0" max="999999" step="1" inputmode="numeric" value="{{ (int)($row->amount ?? 0) }}" placeholder="0 to 999,999">
                                                </div>
                                            </div>
                                            <div class="col-md-3 d-flex align-items-end">
                                                <div class="form-group">
                                                    <button type="button" class="btn btn-danger btn-sm remove-service" style="{{ $loop->first ? 'display:none;' : '' }}">
                                                        <i class="fa fa-trash"></i> Remove
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>

                                <button type="button" id="addServiceBtn" class="btn btn-sm btn-success mb-3">
                                    <i class="fa fa-plus"></i> Add Service
                                </button>
                            </div>

                            <div class="card-footer">
                                <button type="button" class="btn btn-primary" onclick="submitCreateEvent()">{{ $submitLabel }}</button>
                                <a href="{{ url('/rm/rm-request-details/' . $rmDetails->uuid) }}" class="btn btn-default">Cancel</a>
                            </div>
                        </form>
                    </div>

                </div>
            </div>
        </div>
    </section>
</div>

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

{{-- Pass services data to JS for dynamic row creation --}}
<script>
    var servicesOptions = @json($services);
    var categoriesData = @json($categories);
</script>

@endsection