@extends('admin.layouts.master')
@section('title','Page Create')
@section('content')
    <style>
        .filter-input {
            margin-top: unset;
        }
    </style>

    <div class="m-4 mt-4">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <h2 class="mb-0">{{ isset($page) ? trans('Edit Page') : trans('Create New Page') }}</h2>
            <a href="{{ route('page.index') }}" class="btn v3">
                {{ trans('Page List') }}
            </a>
        </div>

        <form action="{{ isset($page) ? route('page.update', $page->id) : route('page.store') }}" method="POST"
            enctype="multipart/form-data">
            @csrf
            @if (isset($page))
                @method('PUT')
            @endif

            @if ($errors->any())
                <div class="alert alert-danger">
                    <strong>Please fix the following errors:</strong>
                    <ul class="mb-0 mt-2">
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif

            <div class="row">
                <!-- Left Column -->
                <div class="col-md-9">
                    <div class="card mb-4">
                        <div class="card-header"><strong>{{ trans('Page Info') }}</strong></div>
                        <div class="card-body">
                            <div class="row mb-3">
                                <div class="col-md-4">
                                    <label>{{ trans('Page Name') }}</label>
                                    <input type="text" name="title" id="title" class="form-control filter-input"
                                        value="{{ old('title', $page->title ?? '') }}" required onkeyup="generateSlug()">
                                </div>

                                <div class="col-md-8">
                                    <label>{{ trans('Title') }}</label>
                                    <input type="text" name="subtitle" class="form-control filter-input"
                                        value="{{ old('subtitle', $page->subtitle ?? '') }}">
                                </div>
                            </div>

                            <div class="mb-3">
                                <label>{{ trans('Content') }}</label>
                                <textarea name="content" id="summernote" class="form-control">
                                    {{ old('content', $page->content ?? '') }}
                                </textarea>
                            </div>


                        </div>
                    </div>

                    <!-- SEO Section -->
                    <div class="card mb-4">
                        <div class="card-header"><strong>{{ trans('SEO Information') }}</strong></div>
                        <div class="card-body">
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label>{{ trans('Meta Title') }}</label>
                                    <input type="text" name="meta_title" class="form-control filter-input"
                                        value="{{ old('meta_title', $page->meta_title ?? '') }}">
                                </div>
                                <div class="col-md-6">
                                    <label>{{ trans('Meta Keywords') }}</label>
                                    <input type="text" name="meta_keywords" class="form-control filter-input"
                                        value="{{ old('meta_keywords', $page->meta_keywords ?? '') }}">
                                </div>
                            </div>

                            <div class="mb-3">
                                <label>{{ trans('Meta Description') }}</label>
                                <textarea name="meta_description" class="form-control filter-input" rows="2">{{ old('meta_description', $page->meta_description ?? '') }}</textarea>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Right Column -->
                <div class="col-md-3">
                    <!-- Images -->
                    <div class="card mb-4">
                        <div class="card-header"><strong>{{ trans('Images') }}</strong></div>
                        <div class="card-body">
                            <div class="mb-3">
                                <label>{{ trans('Featured Image') }}</label>
                                <input type="file" name="featured_image" class="form-control filter-input">
                                @if (isset($page->featured_image))
                                    <img src="{{ asset($page->featured_image) }}" class="img-fluid mt-2">
                                @endif
                            </div>

                            <div class="mb-3">
                                <label>{{ trans('Banner Image') }}</label>
                                <input type="file" name="banner_image" class="form-control filter-input">
                                @if (isset($page->banner_image))
                                    <img src="{{ asset($page->banner_image) }}" class="img-fluid mt-2">
                                @endif
                            </div>
                        </div>
                    </div>

                    <!-- Page Settings -->
                    <div class="card mb-4">
                        <div class="card-header"><strong>{{ trans('Page Settings') }}</strong></div>
                        <div class="card-body">
                            <div class="mb-3">
                                <label>{{ trans('Status') }}</label>
                                <select name="status" class="form-control filter-input">
                                    <option value="draft"
                                        {{ old('status', $page->status ?? '') == 'draft' ? 'selected' : '' }}>
                                        {{ trans('Draft') }}
                                    </option>
                                    <option value="published"
                                        {{ old('status', $page->status ?? '') == 'published' ? 'selected' : '' }}>
                                        {{ trans('Published') }}
                                    </option>
                                    <option value="archived"
                                        {{ old('status', $page->status ?? '') == 'archived' ? 'selected' : '' }}>
                                        {{ trans('Archived') }}
                                    </option>
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>{{ trans('Extra Link') }}</label>
                                <input type="text" name="extra_link" class="form-control filter-input"
                                    value="{{ old('extra_link', $page->extra_link ?? '') }}">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="mt-3">
                <button type="submit" class="btn btn-primary">
                    {{ isset($page) ? trans('Update') : trans('Create') }}
                </button>
            </div>
        </form>
    </div>
@endsection
@section('js')
    <script>
        $(document).ready(function() {
            $('#summernote').summernote({
                height: 250,
                placeholder: 'Write your content here...',
            });
        });
    </script>
@endsection