@extends('layouts.master')
@section('title') Edit Outlet @endsection

@section('content')
    <div class="row">
        <div class="col-12">
            <form action="{{ route('outlet.update', $outlet->id) }}" method="POST">
                @csrf
                @method('PUT')

                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title">
                            <i class="fas fa-edit me-2"></i>Edit Outlet - {{ $outlet->outlet_name }}
                        </h4>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            {{-- Tenant Selection --}}
                            <div class="col-md-6 mb-3">
                                <div class="form-floating">
                                    <select class="form-select @error('tenant_id') is-invalid @enderror" id="tenant_id" name="tenant_id" required>
                                        <option value="">Select Tenant</option>
                                        @foreach($tenants as $tenant)
                                            <option value="{{ $tenant->id }}"
                                                {{ old('tenant_id', $outlet->tenant_id) == $tenant->id ? 'selected' : '' }}>
                                                {{ $tenant->tenant_name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    <label for="tenant_id"><i class="fas fa-building me-1"></i>Tenant *</label>
                                    @error('tenant_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            {{-- Food Court ID --}}
                            <div class="col-md-6 mb-3">
                                <div class="form-floating">
                                    <input type="text" class="form-control @error('food_court_id') is-invalid @enderror"
                                        id="food_court_id" name="food_court_id"
                                        value="{{ old('food_court_id', $outlet->food_court_id) }}"
                                        placeholder="Enter food court ID">
                                    <label for="food_court_id"><i class="fas fa-id-card me-1"></i>Food Court ID</label>
                                    @error('food_court_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            {{-- Outlet Name --}}
                            <div class="col-md-6 mb-3">
                                <div class="form-floating">
                                    <input type="text" class="form-control @error('outlet_name') is-invalid @enderror"
                                        id="outlet_name" name="outlet_name"
                                        value="{{ old('outlet_name', $outlet->outlet_name) }}"
                                        placeholder="Enter outlet name" required>
                                    <label for="outlet_name"><i class="fas fa-utensils me-1"></i>Outlet Name *</label>
                                    @error('outlet_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            {{-- Shop Count --}}
                            <div class="col-md-6 mb-3">
                                <div class="form-floating">
                                    <input type="number" class="form-control @error('shop_count') is-invalid @enderror"
                                        id="shop_count" name="shop_count"
                                        value="{{ old('shop_count', $outlet->shop_count) }}"
                                        placeholder="Enter shop count" min="0">
                                    <label for="shop_count"><i class="fas fa-store me-1"></i>Shop Count</label>
                                    @error('shop_count')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            {{-- Contact Information --}}
                            <div class="col-md-4 mb-3">
                                <div class="form-floating">
                                    <input type="text" class="form-control @error('outlet_contact_name') is-invalid @enderror"
                                        id="outlet_contact_name" name="outlet_contact_name"
                                        value="{{ old('outlet_contact_name', $outlet->outlet_contact_name) }}"
                                        placeholder="Enter contact name" required>
                                    <label for="outlet_contact_name"><i class="fas fa-user me-1"></i>Contact Name *</label>
                                    @error('outlet_contact_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <div class="form-floating">
                                    <input type="tel" class="form-control @error('outlet_contact_phone') is-invalid @enderror"
                                        id="outlet_contact_phone" name="outlet_contact_phone"
                                        value="{{ old('outlet_contact_phone', $outlet->outlet_contact_phone) }}"
                                        placeholder="Enter phone number" pattern="[0-9]{10}" maxlength="10" required>
                                    <label for="outlet_contact_phone"><i class="fas fa-phone me-1"></i>Contact Phone *</label>
                                    @error('outlet_contact_phone')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <div class="form-floating">
                                    <input type="email" class="form-control @error('outlet_contact_email') is-invalid @enderror"
                                        id="outlet_contact_email" name="outlet_contact_email"
                                        value="{{ old('outlet_contact_email', $outlet->outlet_contact_email) }}"
                                        placeholder="Enter email address" required>
                                    <label for="outlet_contact_email"><i class="fas fa-envelope me-1"></i>Contact Email *</label>
                                    @error('outlet_contact_email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            {{-- Status --}}
                            <div class="col-md-6 mb-3">
                                <div class="form-floating">
                                    <select class="form-select" id="status" name="status">
                                        <option value="active" {{ old('status', $outlet->status) == 'active' ? 'selected' : '' }}>Active</option>
                                        <option value="inactive" {{ old('status', $outlet->status) == 'inactive' ? 'selected' : '' }}>Inactive</option>
                                    </select>
                                    <label for="status"><i class="fas fa-status me-1"></i>Status</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer">
                        <div class="d-flex justify-content-between">
                            <a href="{{ route('outlet.index') }}" class="btn btn-secondary">
                                <i class="fas fa-arrow-left me-1"></i>Back to List
                            </a>
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save me-1"></i>Update Outlet
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('scripts')
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function() {
            // Real-time validation
            $('#outlet_contact_name').on('blur', function() {
                const value = $(this).val().trim();
                if (value.length < 3 || !/^[A-Za-z\s]+$/.test(value)) {
                    $(this).addClass('is-invalid');
                } else {
                    $(this).removeClass('is-invalid');
                }
            });

            $('#outlet_contact_phone').on('blur', function() {
                const value = $(this).val().trim();
                if (!/^\d{10}$/.test(value)) {
                    $(this).addClass('is-invalid');
                } else {
                    $(this).removeClass('is-invalid');
                }
            });

            $('#outlet_contact_email').on('blur', function() {
                const value = $(this).val().trim();
                const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
                if (!emailRegex.test(value)) {
                    $(this).addClass('is-invalid');
                } else {
                    $(this).removeClass('is-invalid');
                }
            });
        });
    </script>
@endsection