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

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

    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <div class="nav-wrapper d-flex gap-2">
                <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>
                <button class="btn btn-primary mb-0" id="btn-save-feedback" type="button"><i
                        class="fas fa-floppy-disk me-1"></i><span class="font-weight-bold">Simpan Perubahan</span></button>
            </div>
        </div>
    </div>

    <div class="container-fluid py-4">
        <form method="POST" action="{{ URL::to($url_menu . '/' . $idencrypt) }}" id="form-feedcs-edit" enctype="multipart/form-data">
            @csrf
            @method('PUT')
            <input type="hidden" name="mode" value="update_feedback_status">
            <input type="hidden" name="id_ps" value="{{ $header->id_ps }}">

            <div class="card mb-4">
                <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="{{ $header->id_ps }}" disabled>
                        </div>
                        <div class="col-md-6">
                            <label class="form-control-label">Tanggal PS</label>
                            <input class="form-control bg-light"
                                value="{{ $header->ps_date ? \Carbon\Carbon::parse($header->ps_date)->format('d/m/Y') : '-' }}"
                                disabled>
                        </div>
                    </div>
                    <div class="row mt-2">
                        <div class="col-md-6">
                            <label class="form-control-label">Customer</label>
                            <input class="form-control bg-light" value="{{ $header->customer ?? '-' }}" disabled>
                        </div>
                        <div class="col-md-6">
                            <label class="form-control-label">Salesman</label>
                            <input class="form-control bg-light" value="{{ $header->salesman ?? '-' }}" disabled>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-header pb-0">
                    <h6 class="mb-0 text-uppercase text-sm font-weight-bold">Edit Feedback Material</h6>
                </div>
                <div class="card-body p-0">
                    <hr class="horizontal dark mt-0 mx-3">
                    <div class="table-responsive px-3 pb-3">
                        <table class="table table-sm table-bordered mb-0">
                            <thead style="background-color: #00b7bd4f;">
                                <tr>
                                    <th class="text-center" style="width:40px;">#</th>
                                    <th class="text-center" style="width:60px;">Pilih</th>
                                    <th>PP/PET</th>
                                    <th class="text-center">Gsm</th>
                                    <th>Color</th>
                                    <th class="text-center">Qty</th>
                                    <th>Feedback</th>
                                    <th style="min-width:140px;">Status</th>
                                    <th style="min-width:180px;">Attachment</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($items as $i => $item)
                                    <tr>
                                        <td class="text-center text-sm">{{ $i + 1 }}</td>
                                        <td class="text-center text-sm">
                                            <input type="hidden" name="item_detail_id[]" value="{{ $item->detail_id }}">
                                            <div class="form-check d-flex justify-content-center mb-0">
                                                <input class="form-check-input item-select" type="checkbox"
                                                    name="selected_detail_ids[]" value="{{ $item->detail_id }}" checked>
                                            </div>
                                        </td>
                                        <td class="text-sm">{{ $item->material_code ?? '-' }}</td>
                                        <td class="text-center text-sm">{{ $item->gsm ?? '-' }}</td>
                                        <td class="text-sm">{{ $item->color ?? '-' }}</td>
                                        <td class="text-center text-sm">{{ $item->qty_sales ?? '-' }}
                                            {{ strtoupper($item->sales_unit ?? '') }}</td>
                                        <td>
                                            <textarea class="form-control form-control-sm inp-feedback" name="item_feedback[]" rows="2"
                                                style="min-width:220px; max-height:90px; overflow-y:auto; resize:vertical;">{{ old('item_feedback.' . $i, $item->feedback_customer ?? '') }}</textarea>
                                        </td>
                                        <td>
                                            <select name="item_status_feedback[]" class="form-select form-select-sm">
                                                <option value="1" {{ (string) ($item->status_feedback ?? '') === '1' ? 'selected' : '' }}>Accepted</option>
                                                <option value="0" {{ (string) ($item->status_feedback ?? '') === '0' ? 'selected' : '' }}>Not Accepted</option>
                                            </select>
                                        </td>
                                        <td>
                                            @if (!empty($item->attachment_feedback))
                                                <a href="{{ Storage::url($item->attachment_feedback) }}" target="_blank"
                                                    class="text-primary d-block mb-1 text-xs">
                                                    <i class="fas fa-paperclip me-1"></i>Lihat Lampiran
                                                </a>
                                            @endif
                                            <input type="file" name="attachment_{{ $item->detail_id }}"
                                                class="form-control form-control-sm mt-1" accept=".pdf,.jpg,.jpeg,.png">
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="9" class="text-center py-3 text-secondary">Tidak ada material.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </form>
    </div>

    @push('js')
        <script>
            $(document).ready(function () {
                $('#btn-save-feedback').on('click', function () {
                    var btn = $(this);
                    var checked = $('.item-select:checked');

                    if (checked.length === 0) {
                        Swal.fire('Peringatan', 'Pilih minimal 1 material untuk update feedback.', 'warning');
                        return;
                    }

                    var invalid = false;
                    checked.each(function () {
                        var feedbackInput = $(this).closest('tr').find('.inp-feedback');
                        if (!String(feedbackInput.val() || '').trim()) {
                            invalid = true;
                            feedbackInput.addClass('is-invalid');
                        } else {
                            feedbackInput.removeClass('is-invalid');
                        }
                    });

                    if (invalid) {
                        Swal.fire('Peringatan', 'Feedback wajib diisi untuk material yang dipilih.', 'warning');
                        return;
                    }

                    Swal.fire({
                        title: 'Simpan perubahan feedback?',
                        icon: 'question',
                        showCancelButton: true,
                        confirmButtonText: 'Ya, Simpan',
                        cancelButtonText: 'Batal'
                    }).then(function (result) {
                        if (result.isConfirmed) {
                            btn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin me-1"></i> Menyimpan...');
                            $('#form-feedcs-edit').submit();
                        }
                    });
                });
            });
        </script>
    @endpush

@endsection