@extends('layouts.app')

@section('page-title', 'Detail Pelanggan')
@section('page-subtitle', 'Data Master')

@section('content')
    <a href="{{ route('pelanggan.index') }}" class="back-link">
        <i data-lucide="arrow-left"></i>
        <span>Kembali ke daftar pelanggan</span>
    </a>

    <x-page-header eyebrow="{{ $pelanggan->nomor_pelanggan }}" :title="$pelanggan->nama">
        <x-slot:actions>
            <a href="{{ route('pelanggan.edit', $pelanggan) }}" class="btn btn--ghost">
                <i data-lucide="pencil"></i>
                <span>Edit Data</span>
            </a>
        </x-slot:actions>
    </x-page-header>

    <div class="panel">
        <div class="panel__head"><h3>Informasi Pelanggan</h3></div>
        <div class="panel__body">
            <div class="detail-list">
                <div>
                    <div class="detail-item__label">NIK</div>
                    <div class="detail-item__value mono">{{ $pelanggan->nik ?: '-' }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Jenis Kelamin</div>
                    <div class="detail-item__value">{{ $pelanggan->jenis_kelamin ?: '-' }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Telepon</div>
                    <div class="detail-item__value mono">{{ $pelanggan->phone ?: '-' }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Email</div>
                    <div class="detail-item__value">{{ $pelanggan->email ?: '-' }}</div>
                </div>
                <div style="grid-column: 1 / -1;">
                    <div class="detail-item__label">Alamat</div>
                    <div class="detail-item__value" style="font-weight:400;">
                        {{ $pelanggan->alamat }} &mdash; RT {{ $pelanggan->rt->nomor ?? '-' }}/RW {{ $pelanggan->rw->nomor ?? '-' }},
                        {{ $pelanggan->kelurahan->nama ?? '-' }}, {{ $pelanggan->kecamatan->nama ?? '-' }}
                    </div>
                </div>
                <div>
                    <div class="detail-item__label">Jenis Pelanggan</div>
                    <div class="detail-item__value">{{ $pelanggan->jenisPelanggan->nama ?? '-' }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Tarif Berlaku</div>
                    <div class="detail-item__value money">{{ $pelanggan->tarif ? \App\Helpers\NumberHelper::formatRupiah($pelanggan->tarif->nominal) : 'Belum ditetapkan' }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Tanggal Mulai</div>
                    <div class="detail-item__value">{{ \App\Helpers\DateHelper::formatTanggal($pelanggan->tanggal_mulai) }}</div>
                </div>
                <div>
                    <div class="detail-item__label">Status</div>
                    <div class="detail-item__value">
                        @if ($pelanggan->status === 'Aktif')
                            <x-badge variant="success">Aktif</x-badge>
                        @elseif ($pelanggan->status === 'Nonaktif')
                            <x-badge variant="neutral">Nonaktif</x-badge>
                        @else
                            <x-badge variant="warning">{{ $pelanggan->status }}</x-badge>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="panel-grid panel-grid--2">
        <div class="panel">
            <div class="panel__head"><h3>Ubah Status Pelanggan</h3></div>
            <div class="panel__body">
                <form method="POST" action="{{ route('pelanggan.change-status', $pelanggan) }}">
                    @csrf
                    <div class="form-grid form-grid--single">
                        <div class="field">
                            <label for="status_baru">Status Baru</label>
                            <select id="status_baru" name="status">
                                <option value="Aktif" @selected($pelanggan->status === 'Aktif')>Aktif</option>
                                <option value="Nonaktif" @selected($pelanggan->status === 'Nonaktif')>Nonaktif</option>
                                <option value="Pindah" @selected($pelanggan->status === 'Pindah')>Pindah</option>
                                <option value="Berhenti" @selected($pelanggan->status === 'Berhenti')>Berhenti</option>
                            </select>
                        </div>
                        <div class="field field--span-2">
                            <label for="keterangan_status">Keterangan</label>
                            <textarea id="keterangan_status" name="keterangan" rows="2" placeholder="Alasan perubahan status (opsional)"></textarea>
                        </div>
                    </div>
                    <div class="form-actions" style="border-top:none; padding-top:0;">
                        <button type="submit" class="btn btn--sm">
                            <i data-lucide="refresh-cw"></i>
                            <span>Simpan Status</span>
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <div class="panel">
            <div class="panel__head"><h3>Ubah Tarif Pelanggan</h3></div>
            <div class="panel__body">
                <form method="POST" action="{{ route('pelanggan.change-tarif', $pelanggan) }}">
                    @csrf
                    <div class="form-grid form-grid--single">
                        <div class="field field--span-2">
                            <label for="tarif_id">Tarif Baru</label>
                            <select id="tarif_id" name="tarif_id">
                                <option value="">Pilih tarif aktif</option>
                                @forelse ($availableTarifs as $tarifOption)
                                    <option value="{{ $tarifOption->id }}" @selected($pelanggan->tarif_id === $tarifOption->id)>
                                        {{ $tarifOption->kode }} &mdash; {{ \App\Helpers\NumberHelper::formatRupiah($tarifOption->nominal) }}
                                    </option>
                                @empty
                                    <option value="" disabled>Belum ada tarif aktif untuk jenis pelanggan ini</option>
                                @endforelse
                            </select>
                        </div>
                        <div class="field">
                            <label for="tanggal_mulai_tarif">Berlaku Mulai</label>
                            <input type="date" id="tanggal_mulai_tarif" name="tanggal_mulai" value="{{ now()->format('Y-m-d') }}">
                        </div>
                        <div class="field">
                            <label for="keterangan_tarif">Keterangan</label>
                            <input type="text" id="keterangan_tarif" name="keterangan" placeholder="Opsional">
                        </div>
                    </div>
                    <div class="form-actions" style="border-top:none; padding-top:0;">
                        <button type="submit" class="btn btn--sm">
                            <i data-lucide="refresh-cw"></i>
                            <span>Simpan Tarif</span>
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="panel-grid panel-grid--2">
        <div class="panel">
            <div class="panel__head"><h3>Riwayat Status</h3></div>
            <div class="table-wrap">
                <table class="data-table">
                    <thead><tr><th>Perubahan</th><th>Keterangan</th><th>Tanggal</th></tr></thead>
                    <tbody>
                        @forelse ($pelanggan->statusLogs->sortByDesc('created_at') as $log)
                            <tr>
                                <td>{{ $log->status_lama ?: '-' }} &rarr; <strong>{{ $log->status_baru }}</strong></td>
                                <td>{{ $log->keterangan ?: '-' }}</td>
                                <td class="cell-sub">{{ \App\Helpers\DateHelper::formatTanggalLengkap($log->created_at) }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="3" class="table-empty">Belum ada riwayat perubahan status.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="panel">
            <div class="panel__head"><h3>Riwayat Tarif</h3></div>
            <div class="table-wrap">
                <table class="data-table">
                    <thead><tr><th>Tarif</th><th class="col-number">Nominal</th><th>Periode</th></tr></thead>
                    <tbody>
                        @forelse ($pelanggan->tarifHistory->sortByDesc('tanggal_mulai') as $riwayat)
                            <tr>
                                <td class="mono">{{ $riwayat->tarif->kode ?? '-' }}</td>
                                <td class="col-number money">{{ $riwayat->tarif ? \App\Helpers\NumberHelper::formatRupiah($riwayat->tarif->nominal) : '-' }}</td>
                                <td class="cell-sub">
                                    {{ \App\Helpers\DateHelper::formatTanggal($riwayat->tanggal_mulai) }}
                                    &ndash;
                                    {{ $riwayat->tanggal_selesai ? \App\Helpers\DateHelper::formatTanggal($riwayat->tanggal_selesai) : 'sekarang' }}
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="3" class="table-empty">Belum ada riwayat tarif.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection