@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@push('css')
<style>
    .status-badge-pending {
        background: #fbb140;
        color: #fff;
        padding: 2px 10px;
        border-radius: 12px;
        font-size: .75rem;
        font-weight: 700;
    }

    .status-badge-approve {
        background: #2dce89;
        color: #fff;
        padding: 2px 10px;
        border-radius: 12px;
        font-size: .75rem;
        font-weight: 700;
    }

    .status-badge-rejected {
        background: #f5365c;
        color: #fff;
        padding: 2px 10px;
        border-radius: 12px;
        font-size: .75rem;
        font-weight: 700;
    }

    .doc-link {
        font-size: .85rem;
    }
</style>
@endpush

@section('content')
@include('layouts.navbars.auth.topnav', ['title' => 'Detail Feedback Customer'])

<div class="card shadow-lg mx-4">
    <div class="card-body p-3">
        <div class="nav-wrapper d-flex gap-2 flex-wrap">
            <a href="{{ url($url_menu) }}" class="btn btn-secondary mb-0">
                <i class="fas fa-circle-left me-1"></i><span class="font-weight-bold">Kembali</span>
            </a>
            @if ($authorize->edit == '1' && isset($feedback))
                <a href="{{ url($url_menu . '/edit/' . $feedback->id) }}" class="btn btn-warning mb-0">
                    <i class="fas fa-edit me-1"></i><span class="font-weight-bold">Edit</span>
                </a>
            @endif
            @if ($authorize->delete == '1' && isset($feedback))
                <button type="button" class="btn btn-danger mb-0 btn-delete" data-id="{{ $feedback->id }}">
                    <i class="fas fa-trash me-1"></i><span class="font-weight-bold">Hapus</span>
                </button>
            @endif
        </div>
    </div>
</div>

<div class="container-fluid py-4">
    {{-- Header Info --}}
    <div class="card mb-4">
        <div class="card-header pb-0">
            <h6 class="mb-0 font-weight-bold text-uppercase text-sm">
                <i class="fas fa-info-circle me-2 text-primary"></i>
                Informasi Feedback
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <label class="form-control-label">ID PS</label>
                    <input class="form-control bg-light" value="{{ $feedback->id_ps ?? '-' }}" disabled>
                </div>
                <div class="col-md-6">
                    <label class="form-control-label">ID Sample</label>
                    <input class="form-control bg-light" value="{{ $feedback->id_sample ?? '-' }}" disabled>
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-6">
                    <label class="form-control-label">Nama Salesman</label>
                    <input class="form-control bg-light" value="{{ $feedback->nama_salesman ?? '-' }}" disabled>
                </div>
                <div class="col-md-6">
                    <label class="form-control-label">Status Feedback</label>
                    <input class="form-control bg-light" value="{{ \Illuminate\Support\Str::ucfirst($feedback->feedback_customer ?? 'pending') }}" disabled>
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-6">
                    <label class="form-control-label">Tanggal Dibuat</label>
                    <input class="form-control bg-light" value="{{ \Carbon\Carbon::parse($feedback->created_at)->format('d/m/Y H:i') }}" disabled>
                </div>
                <div class="col-md-6">
                    <label class="form-control-label">Dibuat Oleh</label>
                    <input class="form-control bg-light" value="{{ $feedback->user_create ?? '-' }}" disabled>
                </div>
            </div>
        </div>
    </div>

    {{-- Note Feedback --}}
    <div class="card mb-4">
        <div class="card-header pb-0">
            <h6 class="mb-0 font-weight-bold text-uppercase text-sm">
                <i class="fas fa-sticky-note me-2 text-info"></i>
                Catatan Feedback
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-12">
                    <textarea class="form-control bg-light" rows="4" disabled>{{ $feedback->note_feedback ?? 'Tidak ada catatan' }}</textarea>
                </div>
            </div>
        </div>
    </div>

    {{-- Document Attachment --}}
    <div class="card mb-4">
        <div class="card-header pb-0">
            <h6 class="mb-0 font-weight-bold text-uppercase text-sm">
                <i class="fas fa-paperclip me-2 text-success"></i>
                Dokumen Pendukung
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-12">
                    @if (!empty($feedback->path_document))
                        <a href="{{ url('storage/uploads/feedback_docs/' . $feedback->path_document) }}" target="_blank" class="doc-link text-primary">
                            <i class="fas fa-file-alt me-1"></i>Lihat Dokumen: {{ $feedback->path_document }}
                        </a>
                    @else
                        <span class="text-sm text-secondary">Tidak ada dokumen pendukung</span>
                    @endif
                </div>
            </div>
        </div>
    </div>

    {{-- System Info --}}
    <div class="card">
        <div class="card-header pb-0">
            <h6 class="mb-0 font-weight-bold text-uppercase text-sm">
                <i class="fas fa-cog me-2 text-secondary"></i>
                Informasi Sistem
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <label class="form-control-label">Terakhir Diperbarui</label>
                    <input class="form-control bg-light" value="{{ $feedback->updated_at ? \Carbon\Carbon::parse($feedback->updated_at)->format('d/m/Y H:i') : '-' }}" disabled>
                </div>
                <div class="col-md-6">
                    <label class="form-control-label">Diperbarui Oleh</label>
                    <input class="form-control bg-light" value="{{ $feedback->user_update ?? '-' }}" disabled>
                </div>
            </div>
        </div>
    </div>
</div>

@push('js')
<script>
$(document).ready(function () {
    // Show flash message if any
    @if (Session::has('message'))
        @php
            $msg = addslashes((string) Session::get('message'));
            $cls = Session::get('class', 'info');
            $icon = $cls === 'success' ? 'success' : ($cls === 'danger' || $cls === 'error' ? 'error' : 'info');
        @endphp
        Swal.fire({
            icon: '{{ $icon }}',
            title: '{{ $cls === "success" ? "Berhasil!" : "Info" }}',
            text: '{{ $msg }}'
        });
    @endif

    // Delete confirmation
    $(document).on('click', '.btn-delete', function () {
        var id = $(this).data('id');
        var urlMenu = '{{ $url_menu }}';

        Swal.fire({
            title: 'Konfirmasi Hapus?',
            text: "Data feedback customer ini akan dihapus permanen. Tindakan ini tidak dapat dibatalkan!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d32f2f',
            cancelButtonColor: '#00b7bd',
            confirmButtonText: 'Ya, Hapus!',
            cancelButtonText: 'Batal'
        }).then(function (result) {
            if (result.isConfirmed) {
                $.ajax({
                    url: urlMenu + '/delete/' + id,
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}',
                        id: id
                    },
                    dataType: 'json',
                    success: function (res) {
                        Swal.fire({
                            title: 'Berhasil!',
                            text: res.message || 'Data berhasil dihapus.',
                            icon: 'success',
                            timer: 2000,
                            showConfirmButton: false
                        }).then(function () {
                            window.location.href = urlMenu;
                        });
                    },
                    error: function (xhr) {
                        Swal.fire({
                            title: 'Gagal!',
                            text: 'Terjadi kesalahan saat menghapus data.',
                            icon: 'error'
                        });
                    }
                });
            }
        });
    });
});
</script>
@endpush

@endsection