{{-- resources/views/pages/expert-categories/create.blade.php --}}
@extends('layouts.app')

@section('css')
    <!-- Font Awesome for icons -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css"
        rel="stylesheet" />
@endsection

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
@endsection

@push('pageTitle')
    {{ isset($expertCategory) ? __('labels.edit_category') : __('labels.create_category') }}
@endpush

@section('content')
    @include('components.common.page-header', [
        'pageTitle' => isset($expertCategory) ? __('labels.edit_category') : __('labels.create_category'),
        'actionButton' => [
            'url' => route('expert-categories.index'),
            'text' => __('labels.back_to_categories'),
        ],
    ])

    @include('components.common.flush-message')
    @include('components.common.validation-errors')

    <form
        action="{{ isset($expertCategory) ? route('expert-categories.update', $expertCategory) : route('expert-categories.store') }}"
        method="POST" id="categoryForm">
        @csrf
        @if (isset($expertCategory))
            @method('PUT')
        @endif

        <div class="row">
            <div class="col-xl-8">
                <div class="card">
                    <div class="card-header">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-info-circle me-2"></i>
                            {{ __('labels.basic_information') }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <input type="hidden" name="id" value="{{ $expertCategory->id ?? '' }}" />

                        {{-- Category Name --}}
                        <div class="mb-3 row">
                            <label for="name" class="col-md-2 col-form-label">
                                {{ __('labels.category_name') }} <span class="text-danger">*</span>
                            </label>
                            <div class="col-md-10">
                                <input class="form-control @error('name') is-invalid @enderror" type="text"
                                    name="name" value="{{ old('name', $expertCategory->name ?? '') }}"
                                    placeholder="{{ __('labels.enter_category_name') }}" required>
                                @error('name')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        {{-- Slug --}}
                        <div class="mb-3 row">
                            <label for="slug" class="col-md-2 col-form-label">{{ __('labels.slug') }}</label>
                            <div class="col-md-10">
                                <div class="input-group">
                                    <span class="input-group-text">{{ url('/expert-categories/') }}/</span>
                                    <input class="form-control @error('slug') is-invalid @enderror" type="text"
                                        name="slug" value="{{ old('slug', $expertCategory->slug ?? '') }}"
                                        placeholder="optional-url-slug">
                                </div>
                                <small class="text-muted">{{ __('labels.leave_empty_for_auto') }}</small>
                                @error('slug')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        {{-- Description --}}
                        <div class="mb-3 row">
                            <label for="description" class="col-md-2 col-form-label">{{ __('labels.description') }}</label>
                            <div class="col-md-10">
                                <textarea class="form-control @error('description') is-invalid @enderror" name="description" rows="4">{{ old('description', $expertCategory->description ?? '') }}</textarea>
                                @error('description')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-3 row">
                            <label class="col-md-2 col-form-label">{{ __('labels.appearance') }}</label>
                            <div class="col-md-10">
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        @include('components.form.pick-color', [
                                            'name' => 'color',
                                            'selectedValue' => $expertCategory->color ?? null,
                                            'required' => false,
                                        ])
                                    </div>
                                    <div class="col-md-6">
                                        @include('components.form.select-icons', [
                                            'name' => 'icon',
                                            'selectedValue' => $expertCategory->icon ?? null,
                                            'required' => false,
                                        ])
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-xl-4">
                <div class="card">
                    <div class="card-header">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-cogs me-2"></i>
                            {{ __('labels.settings') }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-3">
                            <label class="form-label">{{ __('labels.status') }}</label>
                            <div class="form-check form-switch">
                                <input type="checkbox" class="form-check-input" name="is_active" id="category-status"
                                    {{ isset($readonly) && $readonly ? 'disabled' : '' }} value="1"
                                    @checked(old('is_active', $expertCategory->is_active ?? true))>
                                <label class="form-check-label" for="category-status">
                                    {{ __('labels.active') }}
                                </label>
                            </div>
                            @error('is_active')
                                <div class="invalid-feedback d-block">{{ $message }}</div>
                            @enderror
                            {{-- <small class="form-text text-muted">{{ __('labels.status_help_text') }}</small> --}}
                        </div>

                        <div class="mb-3">
                            <label for="sort_order" class="form-label">{{ __('labels.display_order') }}</label>
                            <input class="form-control @error('sort_order') is-invalid @enderror" type="number"
                                name="sort_order" id="sort_order"
                                value="{{ old('sort_order', $expertCategory->sort_order ?? ($orderNumber ?? '1')) }}"
                                min="0" step="1">
                            @error('sort_order')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        @if (isset($expertCategory) && isset($readonly) && $readonly)
                            <div class="mb-3">
                                <label class="form-label">{{ __('labels.statistics') }}</label>
                                <div class="card bg-light">
                                    <div class="card-body py-2">
                                        <div class="row text-center">
                                            <div class="col-6 border-end">
                                                <h6 class="mb-0 text-primary">{{ $expertCategory->threads_count ?? 0 }}
                                                </h6>
                                                <small class="text-muted">{{ __('labels.threads') }}</small>
                                            </div>
                                            <div class="col-6">
                                                <h6 class="mb-0 text-success">
                                                    {{ $expertCategory->active_threads_count ?? 0 }}</h6>
                                                <small class="text-muted">{{ __('labels.active') }}</small>
                                            </div>
                                        </div>
                                        @if ($expertCategory->created_at)
                                            <hr class="my-2">
                                            <div class="text-center">
                                                <small class="text-muted">
                                                    <i class="far fa-calendar me-1"></i>
                                                    {{ __('labels.created') }}:
                                                    {{ $expertCategory->created_at->format('d.m.Y') }}
                                                </small>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
            @if (isset($expertCategory) && $expertCategory->created_at)
                <div class="card mt-3">
                    <div class="card-header">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-history me-2"></i>
                            {{ __('labels.audit_trail') }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">{{ __('labels.created') }}:</span>
                            <span>{{ $expertCategory->created_at->format('d.m.Y H:i') }}</span>
                        </div>
                        @if ($expertCategory->createdBy)
                            <div class="d-flex justify-content-between mb-2">
                                <span class="text-muted">{{ __('labels.created_by') }}:</span>
                                <span>{{ $expertCategory->createdBy->name ?? 'N/A' }}</span>
                            </div>
                        @endif
                        @if ($expertCategory->updated_at && $expertCategory->updated_at != $expertCategory->created_at)
                            <div class="d-flex justify-content-between">
                                <span class="text-muted">{{ __('labels.last_updated') }}:</span>
                                <span>{{ $expertCategory->updated_at->format('d.m.Y H:i') }}</span>
                            </div>
                        @endif
                    </div>
                </div>
            @endif
        </div>
        </div>
        @if (!isset($readonly) || (isset($readonly) && !$readonly))
            <div class="d-grid gap-2 d-md-flex justify-content-md-end mt-3">
                <button type="submit" class="btn btn-primary">
                    <i class="fas fa-save me-1"></i>
                    {{ isset($expertCategory) ? __('labels.update') : __('labels.save') }}
                </button>
                <a href="{{ route('expert-categories.index') }}" class="btn btn-secondary">
                    <i class="fas fa-times me-1"></i> {{ __('labels.cancel') }}
                </a>
            </div>
        @endif
    </form>
@endsection