<?php $__env->startSection('content'); ?>
    <style>
        .accordion-button:not(.collapsed) {
            background-color: white;
        }

        .accordion-button::after {
            display: none !important;
        }
    </style>
    <div class="container">
        <h3><strong><?php echo e($form->title); ?></strong></h3>
        <?php if($canCreate): ?>
            <?php if (isset($component)) { $__componentOriginald411d1792bd6cc877d687758b753742c = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginald411d1792bd6cc877d687758b753742c = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.primary-button','data' => ['id' => 'addSection','class' => 'mb-4']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? (array) $attributes->getIterator() : [])); ?>
<?php $component->withName('primary-button'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag && $constructor = (new ReflectionClass(Illuminate\View\AnonymousComponent::class))->getConstructor()): ?>
<?php $attributes = $attributes->except(collect($constructor->getParameters())->map->getName()->all()); ?>
<?php endif; ?>
<?php $component->withAttributes(['id' => 'addSection','class' => 'mb-4']); ?>Tambah
                Section <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginald411d1792bd6cc877d687758b753742c)): ?>
<?php $attributes = $__attributesOriginald411d1792bd6cc877d687758b753742c; ?>
<?php unset($__attributesOriginald411d1792bd6cc877d687758b753742c); ?>
<?php endif; ?>
<?php if (isset($__componentOriginald411d1792bd6cc877d687758b753742c)): ?>
<?php $component = $__componentOriginald411d1792bd6cc877d687758b753742c; ?>
<?php unset($__componentOriginald411d1792bd6cc877d687758b753742c); ?>
<?php endif; ?>
        <?php endif; ?>
        <div class="accordion" id="accordionExample">
            <?php $__currentLoopData = $form->sections; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $sect): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <div class="accordion-item shadow-sm mb-2">
                    <h2 class="accordion-header border border-b">
                        <div class="d-flex justify-content-between align-items-center w-100 pe-4">
                            <button class="accordion-button " type="button" data-bs-toggle="collapse"
                                data-bs-target="#id<?php echo e($loop->iteration); ?>" aria-expanded="true"
                                aria-controls="id<?php echo e($loop->iteration); ?>">
                                <h5 class="mb-0"><strong><?php echo e($sect->name); ?></strong></h5>
                            </button>

                            <div class="ms-2 d-flex gap-2">
                                <button class="btn-sm btn btn-warning editSection" data-id="<?php echo e($sect->id); ?>"
                                    data-name="<?php echo e($sect->name); ?>"><i class="fa fa-pencil"></i></button>
                                <button data-form-info="section" data-id="<?php echo e($sect->id); ?>"
                                    class="delete btn-sm btn btn-danger "><i class="fa fa-trash"></i></button>
                            </div>
                        </div>
                    </h2>
                    <div id="id<?php echo e($loop->iteration); ?>" class="border-t accordion-collapse collapse ">
                        <div class="accordion-body">
                            <table class="table table-striped">
                                <thead>
                                    <tr>
                                        <th style="width: 50px">No</th>
                                        <th>Inspection Item</th>
                                        <th>Status</th>
                                        <th style="width: 200px">Aksi</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <?php $__currentLoopData = $sect->items; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        
                                        <tr>
                                            <td class="border-e"><?php echo e($index + 1); ?></td>
                                            <td class="border-e"><?php echo e($item->name); ?></td>
                                            <td class="border-e"><?php echo e($item->status->pluck("name")->join(" | ")); ?></td>
                                            <td>
                                                <?php if(PermissionHelper::hasPermission('checklist-items')->update): ?>
                                                    <button data-id="<?php echo e($item->id); ?>" data-name="<?php echo e($item->name); ?>"
                                                        data-section_id="<?php echo e($sect->id); ?>" data-status="<?php echo e($item->status->pluck("id")); ?>"
                                                        class="editItems btn-sm btn btn-warning"><i class="fa fa-pencil"></i></button>
                                                <?php endif; ?>
                                                <?php if(PermissionHelper::hasPermission('checklist-items')->delete): ?>
                                                    <button data-form-info="item" data-id="<?php echo e($item->id); ?>"
                                                        class="delete btn-sm btn btn-danger"><i class="fa fa-trash"></i></button>
                                                <?php endif; ?>
                                            </td>
                                        </tr>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    <tr>
                                        <td colspan="4">
                                            <button class="addItems btn btn-primary w-100"
                                                data-section_id="<?php echo e($sect->id); ?>">Tambah item</button>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </div>
    </div>

    
    <div class="modal fade" id="modalForm" tabindex="-1" aria-labelledby="modalTambahRoleLabel" aria-hidden="true">
        <div class="modal-dialog ">
            <form id="form" method="post" action="<?php echo e(route('checklist-sections.store')); ?>">
                <?php echo csrf_field(); ?>
                <?php echo method_field('POST'); ?>
                <input type="hidden" name="form_id" value="<?php echo e($form->id); ?>">
                <input type="hidden" name="form_section_id">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Tambah Section</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Tutup"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3">
                            <label for="name" class="form-label">Nama Section</label>
                            <input type="text" name="name" id="name" required class="form-control"
                                placeholder="Masukkan nama section">
                        </div>
                        <div id="section_status"></div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light" data-bs-dismiss="modal">Tutup</button>
                        <button type="submit" class="btn btn-primary">Simpan</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <template id="status_template">
        <div class="mb-3">
            <label for="status" class="form-label">Pilih Status Jawaban</label>
            <div class="d-flex flex-wrap gap-3">
                <?php $__currentLoopData = $status; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="checkbox" id="status_<?php echo e($item->id); ?>" name="status[]"
                            value="<?php echo e($item->id); ?>">
                        <label class="form-check-label" for="status_<?php echo e($item->id); ?>">
                            <?php echo e($item->name); ?>

                        </label>
                    </div>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
        </div>
    </template>
<?php $__env->stopSection(); ?>


<?php $__env->startPush('extraJS'); ?>
    <script>
        $(document).ready(function () {

            // handle add and edit modal section
        const routeSection = "<?php echo e(route('checklist-sections.store')); ?>";
const routeItem = "<?php echo e(route('checklist-items.store')); ?>";

$("#addSection").click(function () {
    $("#modalForm").modal("show");
    $("#modalForm").find(".modal-title").text("Tambah Section");
    $("#modalForm").find("form").attr("action", routeSection);
    $("#modalForm").find("[name='_method']").attr("value", "POST");
    $("#modalForm").find("[name='name']").val("");
    $("#modalForm").find("[name='name']").attr("placeholder", "Masukkan nama section");
    $("#modalForm").find("label").text("Nama section");
    $("#modalForm").find("#section_status").html("");
});

$(".editSection").click(function () {
    const id = $(this).data("id");
    const name = $(this).data("name");
    const updateRoute = routeSection+`/${id}`; // route update
    $("#modalForm").find(".modal-title").text("Ubah Section");
    $("#modalForm").find("[name='name']").val(name);
    $("#modalForm").find("form").attr("action", updateRoute);
    $("#modalForm").find("[name='_method']").attr("value", "PUT");
    $("#modalForm").find("[name='name']").attr("placeholder", "Masukkan nama section");
    $("#modalForm").find("label").text("Nama section");
    $("#modalForm").find("#section_status").html("");
    $("#modalForm").modal("show");
});

// handle add and edit modal items
$(".addItems").click(function () {
    $("#modalForm").modal("show");
    const section_id = $(this).data("section_id");
    $("#modalForm").find("[name='form_section_id']").val(section_id);
    $("#modalForm").find(".modal-title").text("Tambah Item");
    $("#modalForm").find("form").attr("action", routeItem);
    $("#modalForm").find("[name='_method']").attr("value", "POST");
    $("#modalForm").find("[name='name']").val("");
    $("#modalForm").find("[name='name']").attr("placeholder", "Masukkan nama item");
    $("#modalForm").find("label").text("Nama item");
    $("#modalForm").find("#section_status").html($("#status_template").html());
});

$(".editItems").click(function () {
    const id = $(this).data("id");
    const name = $(this).data("name");
    const statusId = $(this).data("status");
    const section_id = $(this).data("section_id");
    const updateRoute = routeItem+`/${id}`; // route update
    $("#modalForm").find(".modal-title").text("Ubah Item");
    $("#modalForm").find("[name='name']").val(name);
    $("#modalForm").find("[name='form_section_id']").val(section_id);
    $("#modalForm").find("form").attr("action", updateRoute);
    $("#modalForm").find("[name='_method']").attr("value", "PUT");
    $("#modalForm").find("[name='name']").attr("placeholder", "Masukkan nama item");
    $("#modalForm").find("label").text("Nama item");

    let status = $("#status_template").html();
    statusId.forEach(s => {
        status = status.replace(`id="status_${s}"`, `id="status_${s}" checked`);
    });
    $("#modalForm").find("#section_status").html(status);
    $("#modalForm").modal("show");
});






            $("#form").submit(function (e) {
                e.preventDefault();
                const form = $(this)
                const url = $(this).attr("action")
                const method = $(this).find("[name='_method']").val() || form.attr("method");
                $.ajax({
                    url: url,
                    type: method,
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: form.serialize(),
                    success: function (response) {
                        $('#modalForm').modal('hide');
                        Swal.fire({
                            icon: 'success',
                            title: 'Berhasil!',
                            text: response.message,
                            timer: 2000,
                            showConfirmButton: false
                        }).then(() => {
                            $('.loading').show();
                            $('body').css('overflow', 'hidden');
                            window.location.reload();
                        });

                    },
                    error: function (xhr) {
                        // let message = xhr.responseJSON?.message ||
                        //     'Terjadi kesalahan saat update.';
                        // Swal.fire({
                        //     icon: 'error',
                        //     title: 'Gagal Update',
                        //     text: message
                        // });
                        handleValidationErrors(xhr, form);
                    }
                });
            })




            // Delete
            $(document).on("click", ".delete", function () {
                var id = $(this).data("id");
                var formInfo = $(this).data("form-info");
               const url = formInfo == "section"
    ? "<?php echo e(route('checklist-sections.index')); ?>/" + id
    : "<?php echo e(route('checklist-items.index')); ?>/" + id;

                Swal.fire({
                    title: 'Apakah kamu yakin?',
                    text: "Data akan dihapus secara permanen!",
                    icon: 'warning',
                    showCancelButton: true,
                    cancelButtonColor: '#3085d6',
                    confirmButtonColor: '#d33',
                    confirmButtonText: 'Ya, hapus!',
                    cancelButtonText: 'Batal'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: url,
                            type: 'DELETE',
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            },
                            success: function (res) {
                                Swal.fire({
                                    title: 'Terhapus!',
                                    text: res.message,
                                    icon: 'success',
                                    confirmButtonText: 'OK'
                                }).then((result) => {
                                    if (result.isConfirmed) {
                                        window.location.reload();
                                    }
                                });


                            },
                            error: function (xhr) {
                                Swal.fire('Gagal!', 'Data gagal dihapus.', 'error');
                            }
                        });
                    }
                });
            });

        })
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('template.master', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/pmme2286/public_html/docu/vendor1/resources/views/checklist/detail.blade.php ENDPATH**/ ?>