@extends('layouts.admin')

@section('title', 'Edit Mall')

@section('content')
<!-- Page Header -->
<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h1 class="h3 mb-1 text-gray-800 font-weight-bold">Edit Mall</h1>
        <p class="text-muted mb-0">Update mall information and details</p>
    </div>
    <div>
        <a href="{{ route('admin.malls.show', $mall) }}" class="btn btn-outline-primary me-2">
            <i class="bi bi-eye me-1"></i>
            View Mall
        </a>
        <a href="{{ route('admin.malls.index') }}" class="btn btn-outline-secondary">
            <i class="bi bi-arrow-left me-1"></i>
            Back to List
        </a>
    </div>
</div>

<!-- Edit Mall Form -->
<div class="row">
    <div class="col-lg-8">
        <div class="card border-0 shadow-sm">
            <div class="card-header bg-white border-0 py-3">
                <h5 class="card-title mb-0 fw-bold">Basic Mall Information</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('admin.malls.update', $mall) }}" method="POST" enctype="multipart/form-data" id="mall-form">
                    @csrf
                    @method('PUT')

                    <div class="row g-3">
                        <!-- Mall Name -->
                        <div class="col-md-6">
                            <label for="name" class="form-label">Mall Name <span class="text-danger">*</span></label>
                            <input type="text" class="form-control @error('name') is-invalid @enderror" 
                                   id="name" name="name" value="{{ old('name', $mall->name) }}" required>
                            @error('name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Description -->
                        <div class="col-12">
                            <label for="description" class="form-label">Description <span class="text-danger">*</span></label>
                            <textarea class="form-control @error('description') is-invalid @enderror" 
                                      id="description" name="description" rows="4" required>{{ old('description', $mall->description) }}</textarea>
                            @error('description')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Address -->
                        <div class="col-12">
                            <label for="address" class="form-label">Address <span class="text-danger">*</span></label>
                            <textarea class="form-control @error('address') is-invalid @enderror" 
                                      id="address" name="address" rows="2" required>{{ old('address', $mall->address) }}</textarea>
                            @error('address')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Phone and Email -->
                        <div class="col-md-6">
                            <label for="phone" class="form-label">Phone Number <span class="text-danger">*</span></label>
                            <input type="tel" class="form-control @error('phone') is-invalid @enderror" 
                                   id="phone" name="phone" value="{{ old('phone', $mall->phone) }}" required>
                            @error('phone')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-6">
                            <label for="email" class="form-label">Email Address <span class="text-danger">*</span></label>
                            <input type="email" class="form-control @error('email') is-invalid @enderror" 
                                   id="email" name="email" value="{{ old('email', $mall->email) }}" required>
                            @error('email')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Website -->
                        <div class="col-md-6">
                            <label for="website" class="form-label">Website</label>
                            <input type="url" class="form-control @error('website') is-invalid @enderror" 
                                   id="website" name="website" value="{{ old('website', $mall->website) }}" 
                                   placeholder="https://example.com">
                            @error('website')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Current Images Display -->
                        <div class="col-12">
                            <div class="row">
                                @if($mall->logo)
                                    <div class="col-md-6">
                                        <label class="form-label">Current Logo</label>
                                        <div class="border rounded p-2 text-center">
                                            <img src="{{ Storage::url($mall->logo) }}" alt="Mall Logo" class="img-thumbnail" style="max-height: 100px;">
                                        </div>
                                    </div>
                                @endif
                                @if($mall->cover_image)
                                    <div class="col-md-6">
                                        <label class="form-label">Current Cover Image</label>
                                        <div class="border rounded p-2 text-center">
                                            <img src="{{ Storage::url($mall->cover_image) }}" alt="Mall Cover" class="img-thumbnail" style="max-height: 100px;">
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </div>

                        <!-- Mall Logo -->
                        <div class="col-md-6">
                            <label for="logo" class="form-label">Mall Logo</label>
                            <input type="file" class="form-control @error('logo') is-invalid @enderror" 
                                   id="logo" name="logo" accept="image/*">
                            <div class="form-text">Upload new mall logo (JPG, PNG, max 2MB) - Leave empty to keep current logo</div>
                            @error('logo')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Cover Image -->
                        <div class="col-md-6">
                            <label for="cover_image" class="form-label">Cover Image</label>
                            <input type="file" class="form-control @error('cover_image') is-invalid @enderror" 
                                   id="cover_image" name="cover_image" accept="image/*">
                            <div class="form-text">Upload new cover image (JPG, PNG, max 5MB) - Leave empty to keep current image</div>
                            @error('cover_image')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Mall Owner -->
                        <div class="col-md-6">
                            <label for="user_id" class="form-label">Mall Owner <span class="text-danger">*</span></label>
                            <select class="form-select @error('user_id') is-invalid @enderror" id="user_id" name="user_id" required>
                                <option value="">Select Owner</option>
                                @if(isset($users))
                                    @foreach($users as $user)
                                        <option value="{{ $user->id }}" {{ old('user_id', $mall->user_id) == $user->id ? 'selected' : '' }}>
                                            {{ $user->name }} ({{ $user->email }}) - {{ ucfirst($user->role ?? 'User') }}
                                        </option>
                                    @endforeach
                                @endif
                            </select>
                            @error('user_id')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            @if(!isset($users))
                                <div class="form-text text-warning">
                                    <i class="bi bi-exclamation-triangle"></i> User data not available. Please contact administrator.
                                </div>
                            @endif
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="col-lg-4">
        <!-- Mall Details Card -->
        <div class="card border-0 shadow-sm mb-4">
            <div class="card-header bg-white border-0 py-3">
                <h5 class="card-title mb-0 fw-bold">Mall Details</h5>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <!-- Mall Type -->
                    <div class="col-12">
                        <label for="mall_type" class="form-label">Mall Type</label>
                        <select class="form-select @error('mall_type') is-invalid @enderror" id="mall_type" name="mall_type" form="mall-form">
                            <option value="community" {{ old('mall_type', $mall->mallDetail->mall_type ?? 'community') == 'community' ? 'selected' : '' }}>Community Mall</option>
                            <option value="regional" {{ old('mall_type', $mall->mallDetail->mall_type ?? '') == 'regional' ? 'selected' : '' }}>Regional Mall</option>
                            <option value="super_regional" {{ old('mall_type', $mall->mallDetail->mall_type ?? '') == 'super_regional' ? 'selected' : '' }}>Super Regional Mall</option>
                            <option value="lifestyle" {{ old('mall_type', $mall->mallDetail->mall_type ?? '') == 'lifestyle' ? 'selected' : '' }}>Lifestyle Center</option>
                            <option value="outlet" {{ old('mall_type', $mall->mallDetail->mall_type ?? '') == 'outlet' ? 'selected' : '' }}>Outlet Mall</option>
                            <option value="strip" {{ old('mall_type', $mall->mallDetail->mall_type ?? '') == 'strip' ? 'selected' : '' }}>Strip Mall</option>
                        </select>
                        @error('mall_type')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Mall Category -->
                    <div class="col-12">
                        <label for="mall_category" class="form-label">Mall Category</label>
                        <select class="form-select @error('mall_category') is-invalid @enderror" id="mall_category" name="mall_category" form="mall-form">
                            <option value="indoor" {{ old('mall_category', $mall->mallDetail->mall_category ?? 'indoor') == 'indoor' ? 'selected' : '' }}>Indoor Mall</option>
                            <option value="outdoor" {{ old('mall_category', $mall->mallDetail->mall_category ?? '') == 'outdoor' ? 'selected' : '' }}>Outdoor Mall</option>
                            <option value="mixed" {{ old('mall_category', $mall->mallDetail->mall_category ?? '') == 'mixed' ? 'selected' : '' }}>Mixed (Indoor/Outdoor)</option>
                        </select>
                        @error('mall_category')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Total Floors -->
                    <div class="col-md-6">
                        <label for="total_floors" class="form-label">Total Floors</label>
                        <input type="number" class="form-control @error('total_floors') is-invalid @enderror" 
                               id="total_floors" name="total_floors" value="{{ old('total_floors', $mall->mallDetail->total_floors ?? 1) }}" 
                               min="1" max="20" form="mall-form">
                        @error('total_floors')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Total Stores -->
                    <div class="col-md-6">
                        <label for="total_stores" class="form-label">Total Stores</label>
                        <input type="number" class="form-control @error('total_stores') is-invalid @enderror" 
                               id="total_stores" name="total_stores" value="{{ old('total_stores', $mall->mallDetail->total_stores ?? 0) }}" 
                               min="0" form="mall-form">
                        @error('total_stores')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Opening and Closing Times -->
                    <div class="col-md-6">
                        <label for="opening_time" class="form-label">Opening Time</label>
                        <input type="time" class="form-control @error('opening_time') is-invalid @enderror" 
                               id="opening_time" name="opening_time" value="{{ old('opening_time', $mall->mallDetail->opening_time ?? '09:00') }}" form="mall-form">
                        @error('opening_time')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="closing_time" class="form-label">Closing Time</label>
                        <input type="time" class="form-control @error('closing_time') is-invalid @enderror" 
                               id="closing_time" name="closing_time" value="{{ old('closing_time', $mall->mallDetail->closing_time ?? '22:00') }}" form="mall-form">
                        @error('closing_time')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>
        </div>

        <!-- Mall Manager Card -->
        <div class="card border-0 shadow-sm">
            <div class="card-header bg-white border-0 py-3">
                <h5 class="card-title mb-0 fw-bold">Mall Manager (Optional)</h5>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <!-- Manager Name -->
                    <div class="col-12">
                        <label for="mall_manager_name" class="form-label">Manager Name</label>
                        <input type="text" class="form-control @error('mall_manager_name') is-invalid @enderror" 
                               id="mall_manager_name" name="mall_manager_name" value="{{ old('mall_manager_name', $mall->mallDetail->mall_manager_name ?? '') }}" form="mall-form">
                        @error('mall_manager_name')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Manager Phone -->
                    <div class="col-12">
                        <label for="mall_manager_phone" class="form-label">Manager Phone</label>
                        <input type="tel" class="form-control @error('mall_manager_phone') is-invalid @enderror" 
                               id="mall_manager_phone" name="mall_manager_phone" value="{{ old('mall_manager_phone', $mall->mallDetail->mall_manager_phone ?? '') }}" form="mall-form">
                        @error('mall_manager_phone')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <!-- Manager Email -->
                    <div class="col-12">
                        <label for="mall_manager_email" class="form-label">Manager Email</label>
                        <input type="email" class="form-control @error('mall_manager_email') is-invalid @enderror" 
                               id="mall_manager_email" name="mall_manager_email" value="{{ old('mall_manager_email', $mall->mallDetail->mall_manager_email ?? '') }}" form="mall-form">
                        @error('mall_manager_email')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Form Buttons -->
<div class="row mt-4">
    <div class="col-12">
        <div class="d-flex justify-content-between">
            <div>
                <!-- Delete Button -->
                <button type="button" class="btn btn-outline-danger" data-bs-toggle="modal" data-bs-target="#deleteModal">
                    <i class="bi bi-trash me-1"></i>
                    Delete Mall
                </button>
            </div>
            <div class="d-flex gap-2">
                <a href="{{ route('admin.malls.show', $mall) }}" class="btn btn-outline-secondary">
                    <i class="bi bi-x-circle me-1"></i>
                    Cancel
                </a>
                <button type="submit" class="btn btn-primary" form="mall-form">
                    <i class="bi bi-check-circle me-1"></i>
                    Update Mall
                </button>
            </div>
        </div>
    </div>
</div>

<!-- Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Confirm Delete</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to delete <strong>{{ $mall->name }}</strong>?</p>
                <p class="text-danger mb-0">
                    <i class="bi bi-exclamation-triangle"></i>
                    This action cannot be undone and will permanently remove all associated data including stores and events.
                </p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                <form action="{{ route('admin.malls.destroy', $mall) }}" method="POST" class="d-inline">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Delete Mall</button>
                </form>
            </div>
        </div>
    </div>
</div>

@endsection