@extends('admin.layouts.app')

@section('title', __('admin/ticket-statuses.create_title'))

@section('content')
<div class="container-fluid px-4">
    <x-admin.page-header
        :title="__('admin/ticket-statuses.create_title')"
        icon="fas fa-list-check"
        :buttons="[
            ['label' => __('admin/ticket-statuses.buttons_cancel'), 'route' => route('admin.ticket-statuses.index'), 'icon' => 'fas fa-arrow-left', 'color' => 'secondary'],
        ]"
    />

    <x-admin.alert />

    <x-admin.card>
        <form id="ticketStatusForm" action="{{ route('admin.ticket-statuses.store') }}" method="POST">
            @csrf

            <div class="row">
                <div class="col-md-6">
                    <!-- Name Field -->
                    <x-translation-tabbed-group
                        :label="__('admin/ticket-statuses.fields_name')"
                        field="name"
                        fieldName="name"
                        target="name"
                        name="name"
                        value=""
                        :required="true"
                        :placeholder="__('admin/ticket-statuses.placeholders_name')" />

                    <!-- Color Field -->
                    <div class="mb-3">
                        <label for="create_color" class="form-label">
                            {{ __('admin/ticket-statuses.fields_color') }}
                            <span class="text-danger">*</span>
                        </label>
                        <input type="color" class="form-control form-control-color" id="create_color"
                               name="color" value="#6c757d" required>
                               @error('color') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="form-text">{{ __('admin/ticket-statuses.help_texts_color') }}</div>
                    </div>

                    <!-- Scope Field -->
                    <div class="mb-3">
                        <label for="create_scope" class="form-label">
                            {{ __('admin/ticket-statuses.fields_scope') }}
                            <span class="text-danger">*</span>
                        </label>
                        <select class="form-select" id="create_scope" name="scope" required>
                            <option value="">{{ __('admin/common.select_option') }}</option>
                            <option value="pending">{{ __('admin/ticket-statuses.scope_options_pending') }}</option>
                            <option value="open">{{ __('admin/ticket-statuses.scope_options_open') }}</option>
                            <option value="closed">{{ __('admin/ticket-statuses.scope_options_closed') }}</option>
                        </select>
                        @error('scope') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="form-text">{{ __('admin/ticket-statuses.help_texts_scope') }}</div>
                    </div>

                    <!-- Sort Order Field -->
                    <div class="mb-3">
                        <label for="create_sort_order" class="form-label">
                            {{ __('admin/ticket-statuses.fields_sort_order') }}
                            <span class="text-danger">*</span>
                        </label>
                        <input type="number" class="form-control" id="create_sort_order"
                               name="sort_order" value="0" min="0" required>
                               @error('sort_order') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="form-text">{{ __('admin/ticket-statuses.help_texts_sort_order') }}</div>
                    </div>
                </div>

                <div class="col-md-6">
                    <!-- Checkboxes -->
                    <div class="mb-3">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="create_is_closed"
                                   name="is_closed" value="1">
                            <label class="form-check-label" for="create_is_closed">
                                {{ __('admin/ticket-statuses.fields_is_closed') }}
                            </label>
                            <div class="form-text">{{ __('admin/ticket-statuses.help_texts_is_closed') }}</div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="create_is_default"
                                   name="is_default" value="1">
                            <label class="form-check-label" for="create_is_default">
                                {{ __('admin/ticket-statuses.fields_is_default') }}
                            </label>
                            <div class="form-text">{{ __('admin/ticket-statuses.help_texts_is_default') }}</div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="create_status"
                                   name="status" value="1" checked>
                            <label class="form-check-label" for="create_status">
                                {{ __('admin/ticket-statuses.fields_status') }}
                            </label>
                        </div>
                    </div>
                </div>
            </div>

        <x-slot:footer>
            <x-admin.form-actions :cancel-url="route('admin.ticket-statuses.index')" form-id="ticketStatusForm" />
        </x-slot:footer>
        </form>
    </x-admin.card>
</div>
@endsection

@push('scripts')
<script>
    // Route bilgilerini JavaScript'e aktar
    window.routes = {
        ticketStatuses: {
            store: '{{ route("admin.ticket-statuses.store") }}'
        }
    };

    // Çevirileri JavaScript'e aktar
    window.translations = {
        validation: {
            required: '{{ __("validation.required") }}',
            email: '{{ __("validation.email") }}',
            max: '{{ __("validation.max_string") }}'
        },
        messages: {
            success: '{{ __("admin/ticket-statuses.messages_created") }}',
            error: '{{ __("admin/ticket-statuses.messages_create_error") }}'
        }
    };
</script>
@vite('resources/js/admin/ticket-statuses/create.js')
@endpush