@extends('layouts/base_view')

@section('title')
{!! $variables['header_routes'] !!}
@endsection

@section('content')
<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">{!! $variables['judul'] !!}</h3>
                        <div class="float-right">
                            <a href="{{ route('numbering_formats.index') }}" class="btn btn-warning btn-sm button-cek-permission" data-permission="numbering_formats.index">
                                <i class="fas fa-list"></i> Daftar
                            </a>
                            <a href="{{ route('numbering_formats.edit', $data->id) }}" class="btn btn-warning btn-sm button-cek-permission" data-permission="numbering_formats.edit">
                                <i class="fas fa-edit"></i> Ubah
                            </a>
                            <button id="resetCounter" class="btn btn-warning btn-sm" data-format-id="{{ $data->id }}">
                                <i class="fas fa-redo"></i> Reset Counter
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <!-- Single Card with All Information -->
                            <div class="col-12">
                                <div class="card card-outline card-warning">
                                    <div class="card-body">
                                        <div class="row">
                                            <!-- Store -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Store</label>
                                                    <div class="mt-1">{{ $data->store->name ?? 'Unknown' }} ({{ $data->store->code ?? 'N/A' }})</div>
                                                </div>
                                            </div>

                                            <!-- Document Type -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Tipe Dokumen</label>
                                                    <div class="mt-1">
                                                        <span class="badge {{ $data->document_type_badge ?? 'badge-info' }}">{{ $data->document_type }}</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Format Pattern -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Pola Format</label>
                                                    <div class="mt-1">
                                                        <span class="badge badge-info">{{ $data->format_pattern }}</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Current Counter -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Counter Saat Ini</label>
                                                    <div class="mt-1">
                                                        <span class="badge badge-info">{{ $data->current_number }}</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Next Number -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Nomor Berikutnya</label>
                                                    <div class="mt-1">
                                                        <strong id="nextNumberPreview">{{ $data->getNextNumberPreview() }}</strong>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Prefix -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Prefix</label>
                                                    <div class="mt-1">{{ $data->prefix ?: '-' }}</div>
                                                </div>
                                            </div>

                                            <!-- Suffix -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Suffix</label>
                                                    <div class="mt-1">{{ $data->suffix ?: '-' }}</div>
                                                </div>
                                            </div>

                                            <!-- Separator -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Separator</label>
                                                    <div class="mt-1">
                                                        <span class="badge badge-info">{{ $data->separator ?: 'None' }}</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Number Length -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Panjang Nomor</label>
                                                    <div class="mt-1">
                                                        <span class="badge badge-info">{{ $data->number_length }} digit</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Reset Period -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Periode Reset</label>
                                                    <div class="mt-1">
                                                        {{ $data->reset_period }}
                                                        @if(method_exists($data, 'needsReset') && $data->needsReset())
                                                        <span class="badge badge-secondary ml-1">Perlu Reset</span>
                                                        @endif
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Status -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Status</label>
                                                    <div class="mt-1">
                                                        <span class="badge {{ $data->status_badge ?? 'badge-info' }}">{{ $data->status }}</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Last Reset -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Reset Terakhir</label>
                                                    <div class="mt-1">{{ $data->last_reset_date ? $data->last_reset_date->format('d M Y') : 'Belum Pernah' }}</div>
                                                </div>
                                            </div>

                                            <!-- Created By -->
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Dibuat Oleh</label>
                                                    <div class="mt-1">
                                                        <small class="text-muted">
                                                            {{ $data->creator->fullname ?? $data->creator->fullname ?? 'System' }}<br>
                                                            {{ $data->created_at->format('d M Y, H:i') }}
                                                        </small>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- Updated By -->
                                            @if($data->modificator)
                                            <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                                                <div class="form-group">
                                                    <label class="font-weight-bold">Diubah Oleh</label>
                                                    <div class="mt-1">
                                                        <small class="text-muted">
                                                            {{ $data->modificator->fullname ?? $data->modificator->fullname }}<br>
                                                            {{ $data->updated_at->format('d M Y, H:i') }}
                                                        </small>
                                                    </div>
                                                </div>
                                            </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Test Generation -->
                        <div class="row">
                            <div class="col-12">
                                <div class="card card-outline card-warning">
                                    <div class="card-header">
                                        <h5 class="mb-0">Tes Pembuatan Nomor</h5>
                                    </div>
                                    <div class="card-body">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <button id="generateTestNumber" class="btn btn-success">
                                                    Buat Nomor Berikutnya
                                                </button>
                                                <p class="text-muted text-sm mt-2">
                                                    Ini akan menambah counter dan membuat nomor yang sebenarnya.
                                                </p>
                                            </div>
                                            <div class="col-md-6">
                                                <div id="testResult" class="alert alert-success" style="display: none;">
                                                    <strong>Nomor yang Dibuat:</strong> <span id="generatedNumber"></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<script>
    $(document).ready(function() {
        // Generate test number
        $('#generateTestNumber').on('click', function() {
            if (!confirm('Ini akan menambah counter yang sebenarnya. Apakah Anda yakin?')) {
                return;
            }

            $.get("{{ route('numbering_formats.generate') }}", {
                    store_id: {
                        {
                            $data->store_id
                        }
                    },
                    document_type: '{{ $data->document_type }}'
                })
                .done(function(response) {
                    $('#generatedNumber').text(response.number);
                    $('#testResult').show();

                    // Update next number preview
                    location.reload(); // Simple way to refresh the data
                })
                .fail(function(xhr) {
                    alert('Error membuat nomor: ' + (xhr.responseJSON?.error || 'Error tidak diketahui'));
                });
        });

        // Reset counter
        $('#resetCounter').on('click', function() {
            if (!confirm('Ini akan mereset counter ke 0. Apakah Anda yakin?')) {
                return;
            }

            var formatId = $(this).data('format-id');

            $.ajax({
                url: "{{ route('numbering_formats.reset', ':id') }}".replace(':id', formatId),
                type: 'POST',
                data: {
                    _token: "{{ csrf_token() }}"
                },
                success: function(response) {
                    if (response.success) {
                        alert('Counter berhasil direset');
                        $('#nextNumberPreview').text(response.new_preview);
                        location.reload(); // Refresh to show updated data
                    } else {
                        alert('Error: ' + response.message);
                    }
                },
                error: function(xhr) {
                    alert('Error mereset counter: ' + (xhr.responseJSON?.message || 'Error tidak diketahui'));
                }
            });
        });
    });
</script>

<form action="" id="delete-form" method="post">
    @method('delete')
    @csrf
</form>
@endsection