@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="d-flex justify-content-between align-items-center">
                        <h3 class="card-title">Edit Page: {{ $page->title }}</h3>
                        <div>
                            <a href="{{ route('admin.pages.show', $page) }}" class="btn btn-info">
                                <i class="fas fa-eye"></i> View Page
                            </a>
                            <a href="{{ route('admin.pages.index') }}" class="btn btn-secondary">
                                <i class="fas fa-arrow-left"></i> Back to Pages
                            </a>
                        </div>
                    </div>
                </div>

                <form method="POST" action="{{ route('admin.pages.update', $page) }}">
                    @csrf
                    @method('PUT')
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="title">Page Title <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('title') is-invalid @enderror" 
                                           id="title" name="title" value="{{ old('title', $page->title) }}" required>
                                    @error('title')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="route_name">Route Name <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('route_name') is-invalid @enderror" 
                                           id="route_name" name="route_name" value="{{ old('route_name', $page->route_name) }}" required>
                                    <small class="form-text text-muted">Laravel route name (e.g., 'admin.users.index')</small>
                                    @error('route_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="url_pattern">URL Pattern <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('url_pattern') is-invalid @enderror" 
                                           id="url_pattern" name="url_pattern" value="{{ old('url_pattern', $page->url_pattern) }}" required>
                                    <small class="form-text text-muted">URL pattern with wildcards (e.g., '/admin*', '/users/*')</small>
                                    @error('url_pattern')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="access_level">Access Level <span class="text-danger">*</span></label>
                                    <select class="form-control @error('access_level') is-invalid @enderror" id="access_level" name="access_level" required>
                                        <option value="">Select Access Level</option>
                                        <option value="public" {{ old('access_level', $page->access_level) === 'public' ? 'selected' : '' }}>Public</option>
                                        <option value="auth" {{ old('access_level', $page->access_level) === 'auth' ? 'selected' : '' }}>Authenticated Users</option>
                                        <option value="admin" {{ old('access_level', $page->access_level) === 'admin' ? 'selected' : '' }}>Administrators</option>
                                        <option value="superadmin" {{ old('access_level', $page->access_level) === 'superadmin' ? 'selected' : '' }}>Super Administrators</option>
                                    </select>
                                    @error('access_level')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="description">Description</label>
                                    <textarea class="form-control @error('description') is-invalid @enderror" 
                                              id="description" name="description" rows="3">{{ old('description', $page->description) }}</textarea>
                                    @error('description')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="allowed_roles">Allowed Roles (Optional)</label>
                                    <select class="form-control" id="allowed_roles" name="allowed_roles[]" multiple>
                                        <option value="admin" {{ in_array('admin', old('allowed_roles', $page->allowed_roles ?? [])) ? 'selected' : '' }}>Admin</option>
                                        <option value="manager" {{ in_array('manager', old('allowed_roles', $page->allowed_roles ?? [])) ? 'selected' : '' }}>Manager</option>
                                        <option value="worker" {{ in_array('worker', old('allowed_roles', $page->allowed_roles ?? [])) ? 'selected' : '' }}>Worker</option>
                                        <option value="user" {{ in_array('user', old('allowed_roles', $page->allowed_roles ?? [])) ? 'selected' : '' }}>User</option>
                                    </select>
                                    <small class="form-text text-muted">Additional role restrictions (hold Ctrl to select multiple)</small>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="redirect_url">Redirect URL (Optional)</label>
                                    <input type="url" class="form-control @error('redirect_url') is-invalid @enderror" 
                                           id="redirect_url" name="redirect_url" value="{{ old('redirect_url', $page->redirect_url) }}">
                                    <small class="form-text text-muted">Redirect unauthorized users to this URL</small>
                                    @error('redirect_url')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-check">
                                    <input type="hidden" name="is_active" value="0">
                                    <input type="checkbox" class="form-check-input" id="is_active" name="is_active" 
                                           value="1" {{ old('is_active', $page->is_active) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="is_active">
                                        Active Page
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-check">
                                    <input type="hidden" name="require_ssl" value="0">
                                    <input type="checkbox" class="form-check-input" id="require_ssl" name="require_ssl" 
                                           value="1" {{ old('require_ssl', $page->require_ssl) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="require_ssl">
                                        Require SSL
                                    </label>
                                </div>
                            </div>
                        </div>

                        <div class="row mt-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Page Information</label>
                                    <div class="text-muted">
                                        <small>
                                            <strong>Created:</strong> {{ $page->created_at->format('M j, Y g:i A') }}<br>
                                            <strong>Last Updated:</strong> {{ $page->updated_at->format('M j, Y g:i A') }}
                                        </small>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <hr>

                        <div class="alert alert-info">
                            <i class="fas fa-info-circle"></i>
                            <strong>Access Level Guide:</strong>
                            <ul class="mb-0 mt-2">
                                <li><strong>Public:</strong> Accessible to everyone, including guests</li>
                                <li><strong>Authenticated:</strong> Requires user login</li>
                                <li><strong>Admin:</strong> Requires admin or manager privileges</li>
                                <li><strong>Super Admin:</strong> Requires admin privileges only</li>
                            </ul>
                        </div>
                    </div>

                    <div class="card-footer">
                        <button type="submit" class="btn btn-primary">
                            <i class="fas fa-save"></i> Update Page
                        </button>
                        <a href="{{ route('admin.pages.show', $page) }}" class="btn btn-info">
                            View Page
                        </a>
                        <a href="{{ route('admin.pages.index') }}" class="btn btn-secondary">
                            Cancel
                        </a>
                        
                        <div class="float-right">
                            <form method="POST" action="{{ route('admin.pages.toggle-status', $page) }}" class="d-inline">
                                @csrf
                                @method('PATCH')
                                <button type="submit" class="btn btn-{{ $page->is_active ? 'warning' : 'success' }}">
                                    <i class="fas fa-{{ $page->is_active ? 'pause' : 'play' }}"></i>
                                    {{ $page->is_active ? 'Deactivate' : 'Activate' }}
                                </button>
                            </form>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection