@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
{{-- section content --}}
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    @php
        $isRsysvsReport =
            ($dmenu ?? '') == 'rsysvs' || ($url_menu ?? '') == 'rsysvs' || request()->segment(1) == 'rsysvs';

        $firstResult = $table_result && count($table_result) > 0 ? $table_result[0] : null;
        $requesterUsername = $firstResult->HID_requester_username ?? null;
        $ppicUsername = $firstResult->HID_ppic_username ?? null;
        $requesterName = $firstResult->Requisitioner ?? null;
        $ppicName = $firstResult->HID_ppic_name ?? null;
        $requesterTtdBase64 = null;
        $ppicTtdBase64 = null;

        $signatureUsernames = array_values(array_filter([$requesterUsername, $ppicUsername]));
        $signatureUsers = collect();

        if ($isRsysvsReport && !empty($signatureUsernames)) {
            $signatureUsers = DB::table('users as u')
                ->leftJoin('users_karyawan as uk', function ($join) {
                    $join->on('uk.user_id', '=', 'u.id')->where('uk.isactive', '=', '1');
                })
                ->whereIn('u.username', $signatureUsernames)
                ->select('u.username', 'u.firstname', 'u.lastname', 'uk.ttd')
                ->get()
                ->keyBy('username');
        }

        $resolveSignature = function ($username) use ($signatureUsers) {
            $signatureUser = $username ? $signatureUsers->get($username) : null;

            if (!$signatureUser || empty($signatureUser->ttd)) {
                return null;
            }

            $signaturePath = storage_path('app/' . ltrim($signatureUser->ttd, '/'));
            if (!file_exists($signaturePath)) {
                return null;
            }

            $mime = mime_content_type($signaturePath) ?: 'image/png';
            return 'data:' . $mime . ';base64,' . base64_encode(file_get_contents($signaturePath));
        };

        if ($isRsysvsReport) {
            $requesterTtdBase64 = $resolveSignature($requesterUsername);
            $ppicTtdBase64 = $resolveSignature($ppicUsername);
        }
    @endphp
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card">
                        <div class="card-header">
                            <h5 class="mb-0">Result {{ $title_menu }}</h5>
                        </div>
                        <hr class="horizontal dark mt-0">
                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                <div class="nav-wrapper row">
                                    <div class="col">
                                        {{-- button back --}}
                                        <button class="btn btn-secondary mb-0" onclick="history.back()"><i
                                                class="fas fa-circle-left me-1"> </i><span
                                                class="font-weight-bold">Kembali</button>
                                        @php
                                            $userRoles = array_map('trim', (array) ($users_rules ?? []));
                                            $canSync =
                                                in_array('ppic', $userRoles, true) ||
                                                in_array('admins', $userRoles, true);
                                            $showSyncButton =
                                                (($dmenu ?? '') == 'rsysvs' ||
                                                    ($url_menu ?? '') == 'rsysvs' ||
                                                    request()->segment(1) == 'rsysvs') &&
                                                $canSync;
                                        @endphp
                                        {{-- Dropdown Sinkronisasi untuk report rsysvs --}}
                                        @if ($showSyncButton)
                                            <div class="dropdown d-inline-block" id="syncDropdownWrapper">
                                                <button class="btn btn-secondary dropdown-toggle" type="button"
                                                    id="dropdownSinkronisasi" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <i class="fas fa-sync me-1 text-lg text-info"> </i>
                                                    <span class="font-weight-bold">Sinkronisasi</span>
                                                </button>
                                                <ul class="dropdown-menu" aria-labelledby="dropdownSinkronisasi">
                                                    <li><a class="dropdown-item" href="javascript:void(0);"
                                                            onclick="findPr()">
                                                            <i class="fas fa-search me-2"></i>Cari PR
                                                        </a></li>
                                                    <li>
                                                        <hr class="dropdown-divider">
                                                    </li>
                                                    <li><a class="dropdown-item" href="javascript:void(0);"
                                                            onclick="syncPr()">
                                                            <i class="fas fa-download me-2"></i>Sync PO
                                                        </a></li>
                                                    <li><a class="dropdown-item" href="javascript:void(0);"
                                                            onclick="syncGr()">
                                                            <i class="fas fa-download me-2"></i>Sync GR
                                                        </a></li>
                                                    <li>
                                                        <hr class="dropdown-divider">
                                                    </li>
                                                    <li><a class="dropdown-item" href="javascript:void(0);"
                                                            onclick="syncAll()">
                                                            <i class="fas fa-sync me-2"></i>Sync Semua
                                                        </a></li>
                                                </ul>
                                            </div>
                                        @endif
                                    </div>
                                    <div class="col-md-3 md-auto justify-content-end row">
                                        <div class="col">
                                            {{-- set value filter --}}
                                                                                        @foreach ($filter as $key => $value)
                                                <input type="hidden" name="f{{ $key }}"
                                                    value="{{ $value }}" />
                                                @php
                                                    if (
                                                        preg_replace('/\s+/', '', strtolower(@$table_class->alias)) ==
                                                        preg_replace('/\s+/', '', strtolower($key))
                                                    ) {
                                                        $check_filter = $value == '%' ? '' : $value;
                                                    }
                                                @endphp
                                            @endforeach
                                        </div>
                                        <div class="col">
                                            {{-- display label alias on class filter --}}
                                            Filter {{ @$table_class->alias }} :
                                            <select class="form-select" id="{{ @$table_class->field }}"
                                                style="width: 150px;">
                                                @if (@$table_class->query != '')
                                                    @if ($check_filter != '')
                                                        @php
                                                            $data_query = DB::select(@$table_class->query);
                                                        @endphp
                                                        @foreach ($data_query as $q)
                                                            <br />
<b>Warning</b>:  Undefined variable $q in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>144</b><br />
                                                            @if ($check_filter == $sAsArray[0])
                                                                <option value="{{ $sAsArray[0] }}">
                                                                    {{ $sAsArray[0] }} - {{ $sAsArray[1] }}
                                                                </option>
                                                            @endif
                                                        @endforeach
                                                    @else
                                                        <option value="" selected>% - All</option>
                                                        @php
                                                            $data_query = DB::select(@$table_class->query);
                                                        @endphp
                                                        @foreach ($data_query as $q)
                                                            <br />
<b>Warning</b>:  Undefined variable $q in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>157</b><br />
                                                            <option value="{{ $sAsArray[0] }}">
                                                                {{ $sAsArray[0] }} - {{ $sAsArray[1] }}
                                                            </option>
                                                        @endforeach
                                                    @endif
                                                @endif
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row px-4 py-2">
                            <div class="table-responsive">
                                <table class="table display" id="list_{{ $dmenu }}">
                                    {{-- check result data --}}
                                    @if ($table_result)
                                        <thead class="thead-light" style="background-color: #00b7bd4f;">
                                            <tr>
                                                <th>No</th>
                                                {{-- set table header --}}
                                                @foreach ($table_result as $result)
                                                    @php
                                                        $sAsArray = array_keys((array) $result);
                                                        $i = 0;
                                                    @endphp
                                                @endforeach
                                                @foreach ($sAsArray as $header)
                                                    @if (substr($header, 0, 4) == 'HID_')
                                                        @continue
                                                    @endif
                                                    @if (substr($header, 0, 3) == 'IMG')
                                                        <th>{{ substr($header, 4) }}</th>
                                                    @elseif (substr($header, 0, 3) == 'CDT')
                                                        <th>{{ substr($header, 6) . '-' . substr($header, 3, 2) }}</th>
                                                    @elseif (substr($header, 0, 3) == 'CST')
                                                        <th>{{ substr($header, 4) }}</th>
                                                    @else
                                                        <th>{{ $header }}</th>
                                                    @endif
                                                    @php
                                                        $i++;
                                                    @endphp
                                                @endforeach
                                            </tr>
                                        </thead>
                                        <tbody>
                                            {{-- retrieve table result --}}
                                            @foreach ($table_result as $detail)
                                                <tr
                                                    {{ @$detail->isactive == '0' || @$detail->ISACTIVE == '0' ? 'class=not style=background-color:#ffe9ed;' : '' }}>
                                                    <td>{{ $loop->iteration }}</td>
                                                    @foreach ($table_result as $result)
                                                        @php
                                                            $field = array_keys((array) $result);
                                                            $i = 0;
                                                        @endphp
                                                    @endforeach
                                                    @foreach ($field as $header)
                                                        @if (substr($header, 0, 4) == 'HID_')
                                                            @continue
                                                        @endif
                                                        @php
                                                            $string = $header;
                                                            $img_id = '';
                                                            $characters =
                                                                'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
                                                            for ($i = 0; $i < 10; $i++) {
                                                                $img_id .=
                                                                    $characters[mt_rand(0, strlen($characters) - 1)];
                                                            }
                                                        @endphp
                                                        @if (substr($string, 0, 3) == 'IMG')
                                                            <td class="text-sm font-weight-normal">
                                                                <span class="my-2 text-xs">
                                                                    <img src="{{ asset('/storage' . '/' . $detail->$string) }}"
                                                                        alt="image" style="height: 40px;"
                                                                        data-bs-toggle="modal"
                                                                        data-bs-target="#{{ $img_id }}">
                                                                </span>
                                                                <span
                                                                    style="display: none;">{{ asset('/storage' . '/' . $detail->$string) }}
                                                                </span>
                                                                <!-- Modal -->
                                                                <div class="modal fade" id="{{ $img_id }}"
                                                                    tabindex="-1" role="dialog"
                                                                    aria-labelledby="imageModalLabel" aria-hidden="true">
                                                                    <div class="modal-dialog modal-dialog-centered"
                                                                        role="document">
                                                                        <div class="modal-content">
                                                                            <div class="modal-header">
                                                                                <h5 class="modal-title"
                                                                                    id="imageModalLabel">
                                                                                    Preview Image
                                                                                </h5>
                                                                                <button type="button" class="btn-close"
                                                                                    data-bs-dismiss="modal"
                                                                                    aria-label="Close">
                                                                                    <span aria-hidden="true">&times;</span>
                                                                                </button>
                                                                            </div>
                                                                            <div class="modal-body">
                                                                                <img src="{{ asset('/storage' . '/' . $detail->$string) }}"
                                                                                    id="preview" alt="image"
                                                                                    class="w-100 border-radius-lg shadow-sm">
                                                                            </div>
                                                                            <div class="modal-footer">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </td>
                                                        @elseif (substr($string, 0, 3) == 'CDT')
                                                            <td class="text-sm font-weight-normal {{ $detail->$string }}">
                                                                {{ $detail->$string }}
                                                            </td>
                                                            <script>
                                                                var inputDate = new Date('{{ $detail->$string }}');
                                                                var currentDate = new Date();
                                                                var futureDate = new Date(currentDate.setDate(currentDate.getDate() + parseInt('{{ substr($string, 3, 2) }}')));

                                                                if (inputDate <= futureDate) {
                                                                    $('.{{ $detail->$string }}').parents('tr').addClass('exp');
                                                                    $('.{{ $detail->$string }}').parents('tr').css('background-color', '#ffe768');
                                                                }
                                                            </script>
                                                        @elseif (substr($string, 0, 3) == 'CST')
                                                            <td class="text-sm font-weight-normal {{ $detail->$string }}">
                                                                {{ $detail->$string }}
                                                            </td>
                                                            <script>
                                                                if ('{{ $detail->$string }}' == 'FALSE') {
                                                                    $('.FALSE').parents('tr').addClass('stock');
                                                                    $('.FALSE').parents('tr').css('background-color', '#f93c3c');
                                                                    $('.FALSE').parents('tr').css('color', '#000');
                                                                }
                                                            </script>
                                                        @else
                                                            <td class="text-sm font-weight-normal">
                                                                {{ $detail->$string }}</td>
                                                        @endif
                                                        @php
                                                            $i++;
                                                        @endphp
                                                    @endforeach
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    @endif
                                </table>
                            </div>
                        </div>
                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                @if ($table_result)
                                    <div class="nav-wrapper" id="noted"><code>Note : <i aria-hidden="true"
                                                style="color: #ffc2cd;" class="fas fa-circle"></i> Data not active</code>
                                    </div>
                                @else
                                    <div class="nav-wrapper"><code> Data not found!</code></div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- check flag js on dmenu --}}
    @if ($jsmenu == '1')
        @if (view()->exists("js.{$dmenu}"))
            @push('addjs')
                {{-- file js in folder (resources/views/js) --}}
                @include('js.' . $dmenu);
            @endpush
        @else
            @push('addjs')
                <script>
                    Swal.fire({
                        title: 'JS Not Found!!', text: 'Please Create File JS', icon: 'error',
                        confirmButtonColor: '#028284'
                    });
                </script>
            @endpush
        @endif
    @endif
@endsection
@push('js')
    <script>
        let columnAbjad = '';
        const isRsysvsReport = @json($isRsysvsReport);
        const requesterSignature = @json($requesterTtdBase64);
        const requesterName = @json($requesterName);
        const ppicSignature = @json($ppicTtdBase64);
        const ppicName = @json($ppicName);

        function createInlineCell(doc, ref, value) {
            const ns = 'http://schemas.openxmlformats.org/spreadsheetml/2006/main';
            const c = doc.createElementNS(ns, 'c');
            c.setAttribute('r', ref);
            c.setAttribute('t', 'inlineStr');

            const is = doc.createElementNS(ns, 'is');
            const t = doc.createElementNS(ns, 't');
            t.textContent = value;
            is.appendChild(t);
            c.appendChild(is);
            return c;
        }

        function appendExcelSignature(sheet) {
            const ns = 'http://schemas.openxmlformats.org/spreadsheetml/2006/main';
            const sheetData = sheet.getElementsByTagName('sheetData')[0];
            const rows = sheetData.getElementsByTagName('row');
            const lastRow = rows.length ? rows[rows.length - 1] : null;
            const startRow = lastRow ? (parseInt(lastRow.getAttribute('r'), 10) + 2) : 3;

            // Header row: Requisitioner | PPIC
            const headerRow = sheet.createElementNS(ns, 'row');
            headerRow.setAttribute('r', startRow);
            headerRow.appendChild(createInlineCell(sheet, 'A' + startRow, 'Requisitioner'));
            headerRow.appendChild(createInlineCell(sheet, 'C' + startRow, 'PPIC'));
            sheetData.appendChild(headerRow);

            // Signature placeholder row
            const signRow = sheet.createElementNS(ns, 'row');
            signRow.setAttribute('r', startRow + 1);
            signRow.appendChild(createInlineCell(sheet, 'A' + (startRow + 1), '[TTD]'));
            signRow.appendChild(createInlineCell(sheet, 'C' + (startRow + 1), '[TTD]'));
            sheetData.appendChild(signRow);

            // Name row
            const nameRow = sheet.createElementNS(ns, 'row');
            nameRow.setAttribute('r', startRow + 2);
            nameRow.appendChild(createInlineCell(sheet, 'A' + (startRow + 2), requesterName || '-'));
            nameRow.appendChild(createInlineCell(sheet, 'C' + (startRow + 2), ppicName || '-'));
            sheetData.appendChild(nameRow);
        }

        $(document).ready(function() {
            let table = $('#list_{{ $dmenu }}').DataTable();
            let indexStatus = 0;
            let numColumns = $('#list_{{ $dmenu }}').DataTable().columns().count();
            let columnNames = '';
            let filter = '{{ @$table_class->alias }}'.toLowerCase();
            for (let index = 0; index < numColumns; index++) {
                columnNames = $('#list_{{ $dmenu }}').DataTable().columns(index).header()[0].textContent;
                filtercolom = columnNames.toLowerCase();
                if (columnNames == 'Status' || columnNames == 'status' || columnNames == 'STATUS') {
                    columnAbjad = String.fromCharCode(65 + index);
                }
                if (filtercolom == filter) {
                    indexStatus = index;
                }
            }
            //redraw table where filter
            $('#{{ @$table_class->field }}').change(function() {
                table.column(indexStatus).search($(this).val()).draw();
            })
            //check note
            if ($('*').hasClass('exp')) {
                $('#noted').html(`<code>Note :( <i aria-hidden="true" style="color: #ffc2cd;"
                class="fas fa-circle"></i> Data not active ), ( <i aria-hidden="true"
                style="color: #ffe768;" class="fas fa-circle"></i> Data Expired )</code>`)
            }
            if ($('*').hasClass('stock')) {
                $('#noted').html(`<code>Note :( <i aria-hidden="true" style="color: #ffc2cd;"
                class="fas fa-circle"></i> Data not active ), ( <i aria-hidden="true"
                style="color: #f93c3c;" class="fas fa-circle"></i> Stock < Min Stock )</code>`)
            }
            if ($('*').hasClass('exp') && $('*').hasClass('stock')) {
                $('#noted').html(`<code>Note :( <i aria-hidden="true" style="color: #ffc2cd;"
                class="fas fa-circle"></i> Data not active ), ( <i aria-hidden="true"
                style="color: #ffe768;" class="fas fa-circle"></i> Data Expired ), ( <i aria-hidden="true"
                style="color: #f93c3c;" class="fas fa-circle"></i> Stock < Min Stock )</code>`)
            }
        });
        //set table into datatables
        $('#list_{{ $dmenu }}').DataTable({
            "language": {
                "search": "Cari :",
                "lengthMenu": "Tampilkan _MENU_ baris",
                "zeroRecords": "Maaf - Data tidak ada",
                "info": "Data _START_ - _END_ dari _TOTAL_",
                "infoEmpty": "Tidak ada data",
                "infoFiltered": "(pencarian dari _MAX_ data)"
            },
            responsive: true,
            dom: 'Bfrtip',
            buttons: [{
                    extend: 'excelHtml5',
                    text: '<i class="fas fa-file-excel me-1 text-lg text-success"> </i><span class="font-weight-bold"> Excel',
                    autoFilter: true,
                    sheetName: 'Exported data',
                    // title: 'Nama File Excel',
                    customize: function(xlsx) {
                        var sheet = xlsx.xl.worksheets['sheet1.xml'];
                        // Loop over the cells in column
                        sheet.querySelectorAll('row c[r^="' + columnAbjad + '"]').forEach((row) => {
                            // Get the value
                            let cell = row.querySelector('is t');
                            if (cell && cell.textContent === 'Not Active') {
                                row.setAttribute('s', '10'); //red background
                            }
                        });

                        if (isRsysvsReport) {
                            try {
                                appendExcelSignature(sheet);
                            } catch (error) {
                                console.error('Gagal menambahkan signature ke Excel:', error);
                            }
                        }
                    },
                    exportOptions: {
                        columns: ':visible:not(:last-child)'
                    },
                },
                {
                    extend: 'pdfHtml5',
                    text: '<i class="fas fa-file-pdf me-1 text-lg text-danger"> </i><span class="font-weight-bold"> PDF',
                    orientation: 'landscape',
                    pageSize: 'A4',
                    customize: function(doc) {
                        if (isRsysvsReport) {
                            doc.content.push({
                                text: '\n'
                            });
                            // Two-column signature table
                            doc.content.push({
                                columns: [{
                                        width: '45%',
                                        stack: [{
                                                text: 'Requisitioner',
                                                bold: true,
                                                alignment: 'center',
                                                margin: [0, 0, 0, 8]
                                            },
                                            requesterSignature ? {
                                                image: requesterSignature,
                                                width: 120,
                                                alignment: 'center',
                                                margin: [0, 8, 0, 8]
                                            } : {
                                                text: '',
                                                alignment: 'center',
                                                margin: [0, 40, 0, 8]
                                            },
                                            {
                                                text: requesterName || '-',
                                                alignment: 'center',
                                                fontSize: 10
                                            }
                                        ],
                                        margin: [0, 0, 10, 0]
                                    },
                                    {
                                        width: '45%',
                                        stack: [{
                                                text: 'PPIC',
                                                bold: true,
                                                alignment: 'center',
                                                margin: [0, 0, 0, 8]
                                            },
                                            ppicSignature ? {
                                                image: ppicSignature,
                                                width: 120,
                                                alignment: 'center',
                                                margin: [0, 8, 0, 8]
                                            } : {
                                                text: '',
                                                alignment: 'center',
                                                margin: [0, 40, 0, 8]
                                            },
                                            {
                                                text: ppicName || '-',
                                                alignment: 'center',
                                                fontSize: 10
                                            }
                                        ],
                                        margin: [10, 0, 0, 0]
                                    }
                                ],
                                columnGap: 20
                            });
                        }
                    },
                    exportOptions: {
                        columns: ':visible:not(:last-child)'
                    },
                },
                {
                    extend: 'print',
                    text: '<i class="fas fa-print me-1 text-lg text-info"> </i><span class="font-weight-bold"> Print',
                    orientation: 'landscape',
                    pageSize: 'A4',
                    customize: function(win) {
                        if (!isRsysvsReport) {
                            return;
                        }

                        const body = win.document.body;
                        const wrapper = win.document.createElement('div');
                        wrapper.style.marginTop = '28px';
                        wrapper.style.display = 'flex';
                        wrapper.style.justifyContent = 'space-around';
                        wrapper.style.gap = '40px';

                        // Requisitioner column
                        const requesterCol = win.document.createElement('div');
                        requesterCol.style.flex = '1';
                        requesterCol.style.textAlign = 'center';
                        const requesterLabel = win.document.createElement('div');
                        requesterLabel.style.fontWeight = '700';
                        requesterLabel.style.marginBottom = '8px';
                        requesterLabel.textContent = 'Requisitioner';
                        requesterCol.appendChild(requesterLabel);
                        if (requesterSignature) {
                            const requesterImg = win.document.createElement('img');
                            requesterImg.src = requesterSignature;
                            requesterImg.style.maxWidth = '140px';
                            requesterImg.style.maxHeight = '100px';
                            requesterImg.style.objectFit = 'contain';
                            requesterImg.style.display = 'block';
                            requesterImg.style.margin = '8px auto';
                            requesterCol.appendChild(requesterImg);
                        } else {
                            const spacer = win.document.createElement('div');
                            spacer.style.height = '80px';
                            spacer.style.margin = '8px auto';
                            spacer.style.borderBottom = '1px solid #000';
                            requesterCol.appendChild(spacer);
                        }
                        const requesterNameDiv = win.document.createElement('div');
                        requesterNameDiv.textContent = requesterName || '-';
                        requesterNameDiv.style.fontSize = '12px';
                        requesterNameDiv.style.marginTop = '4px';
                        requesterCol.appendChild(requesterNameDiv);
                        wrapper.appendChild(requesterCol);

                        // PPIC column
                        const ppicCol = win.document.createElement('div');
                        ppicCol.style.flex = '1';
                        ppicCol.style.textAlign = 'center';
                        const ppicLabel = win.document.createElement('div');
                        ppicLabel.style.fontWeight = '700';
                        ppicLabel.style.marginBottom = '8px';
                        ppicLabel.textContent = 'PPIC';
                        ppicCol.appendChild(ppicLabel);
                        if (ppicSignature) {
                            const ppicImg = win.document.createElement('img');
                            ppicImg.src = ppicSignature;
                            ppicImg.style.maxWidth = '140px';
                            ppicImg.style.maxHeight = '100px';
                            ppicImg.style.objectFit = 'contain';
                            ppicImg.style.display = 'block';
                            ppicImg.style.margin = '8px auto';
                            ppicCol.appendChild(ppicImg);
                        } else {
                            const spacer = win.document.createElement('div');
                            spacer.style.height = '80px';
                            spacer.style.margin = '8px auto';
                            spacer.style.borderBottom = '1px solid #000';
                            ppicCol.appendChild(spacer);
                        }
                        const ppicNameDiv = win.document.createElement('div');
                        ppicNameDiv.textContent = ppicName || '-';
                        ppicNameDiv.style.fontSize = '12px';
                        ppicNameDiv.style.marginTop = '4px';
                        ppicCol.appendChild(ppicNameDiv);
                        wrapper.appendChild(ppicCol);

                        body.appendChild(wrapper);
                    },
                    exportOptions: {
                        columns: ':visible:not(:last-child)'
                    },
                },
            ]
        });
        //set color button datatables
        $('.dt-button').addClass('btn btn-secondary');
        $('.dt-button').removeClass('dt-button');
        //check authorize button datatables
        <br />
<b>Warning</b>:  Undefined variable $authorize in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>642</b><br />
<br />
<b>Warning</b>:  Attempt to read property "excel" on null in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>642</b><br />
        <br />
<b>Warning</b>:  Undefined variable $authorize in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>643</b><br />
<br />
<b>Warning</b>:  Attempt to read property "pdf" on null in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>643</b><br />
        <br />
<b>Warning</b>:  Undefined variable $authorize in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>644</b><br />
<br />
<b>Warning</b>:  Attempt to read property "print" on null in <b>/opt/lampp/htdocs/msjprapr/resources/views/report/auto/result.blade.php</b> on line <b>644</b><br />

        // pindahkan dropdown sinkronisasi tepat di sebelah tombol print
        if ($('#syncDropdownWrapper').length && $('.dt-buttons').length) {
            if ($('.dt-buttons .buttons-print').length) {
                $('#syncDropdownWrapper').insertAfter('.dt-buttons .buttons-print');
            } else {
                $('#syncDropdownWrapper').appendTo('.dt-buttons');
            }
            $('#syncDropdownWrapper').addClass('ms-1').removeClass('d-none');
        }

        function buildSyncTableHtml(message, details) {
            if (!details || details.length === 0) {
                return '<p>' + message + '</p>';
            }

            let html = '<p class="mb-3">' + message + '</p>';
            html += '<div class="table-responsive" style="max-height: 350px; overflow-y: auto;">';
            html += '<table class="table table-bordered table-sm text-sm text-start mb-0">';
            html += '<thead style="position: sticky; top: 0; background: #fff; z-index: 1;">';
            html += '<tr>';
            html += '<th class="text-center" style="width: 10%;">No</th>';
            html += '<th style="width: 25%;">No Pra PR</th><th style="width: 25%;">Nomor Order/Aset</th>';
            html += '<th style="width: 40%;">Catatan</th>';
            html += '</tr>';
            html += '</thead>';
            html += '<tbody>';
            
            details.forEach((item, index) => {
                html += '<tr>';
                html += '<td class="text-center">' + (index + 1) + '</td>';
                html += '<td><strong>' + (item.no_prapr || '-') + '</strong></td>';
                html += '<td>' + (item.no_order || '-') + '</td>';
                html += '<td>' + (item.catatan || '-') + '</td>';
                html += '</tr>';
            });
            
            html += '</tbody></table></div>';
            return html;
        }

        function findPr() {
            Swal.fire({
                title: 'Cari Nomor PR?',
                text: 'Mencari Nomor PR dari SAP berdasarkan data Pra PR (Data yang dicari hanya yang berstatus "Approve")',
                icon: 'question',
                showCancelButton: true,
                confirmButtonText: 'Ya, Cari PR',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        type: 'POST',
                        url: '{{ route('find.pr') }}',
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        success: function(response) {
                            if (response.success) {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                }).then(() => {
                                    location.reload();
                                });
                            } else {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                });
                            }
                        },
                        error: function(xhr) {
                            Swal.fire({
                                title: 'Error', text: 'Request gagal: ' + (xhr.responseJSON?.message || xhr
                                    .statusText), icon: 'error',
                                confirmButtonColor: '#028284'
                            });
                        }
                    });
                }
            });
        }

        /**
         * Sync PO dari SAP API ke database lokal
         */
        function syncPr() {
            Swal.fire({
                title: 'Sinkronisasi PO?',
                text: 'Data yang disinkron adalah data yang sudah berstatus "Approve"',
                icon: 'question',
                showCancelButton: true,
                confirmButtonText: 'Ya, Sync PR',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        type: 'POST',
                        url: '{{ route('sync.pr') }}',
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        success: function(response) {
                            if (response.success) {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                }).then(() => {
                                    location.reload();
                                });
                            } else {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                });
                            }
                        },
                        error: function(xhr) {
                            const msg = xhr.responseJSON?.message || xhr.statusText ||
                                'Terjadi kesalahan server (HTTP ' + xhr.status + ')';
                            Swal.fire({
                                title: 'Error Sync PO', text: msg, icon: 'error',
                                confirmButtonColor: '#028284'
                            });
                        }
                    });
                }
            });
        }

        /**
         * Sync GR dari SAP API ke database lokal
         */
        function syncGr() {
            Swal.fire({
                title: 'Sinkronisasi GR?',
                text: 'Data yang disinkron adalah data yang sudah berstatus "Approve"',
                icon: 'question',
                showCancelButton: true,
                confirmButtonText: 'Ya, Sync GR',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        type: 'POST',
                        url: '{{ route('sync.gr') }}',
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        success: function(response) {
                            if (response.success) {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                }).then(() => {
                                    location.reload();
                                });
                            } else {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    html: buildSyncTableHtml(response.message, response.details),
                                    icon: 'success', width: '700px',
                                    confirmButtonColor: '#028284'
                                });
                            }
                        },
                        error: function(xhr) {
                            const msg = xhr.responseJSON?.message || xhr.statusText ||
                                'Terjadi kesalahan server (HTTP ' + xhr.status + ')';
                            Swal.fire({
                                title: 'Error Sync GR', text: msg, icon: 'error',
                                confirmButtonColor: '#028284'
                            });
                        }
                    });
                }
            });
        }

        /**
         * Sync PO & GR dari SAP API ke database lokal (sync semua)
         */
        function syncAll() {
            Swal.fire({
                title: 'Sinkronisasi Semua?',
                text: 'Data yang disinkron adalah data yang sudah berstatus "Approve"',
                icon: 'question',
                showCancelButton: true,
                confirmButtonText: 'Ya, Sync Semua',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    // Show loading
                    Swal.fire({
                        title: 'Sedang sinkronisasi...',
                        text: 'Mohon tunggu, proses sedang berjalan.',
                        icon: 'info',
                        didOpen: () => {
                            Swal.showLoading()
                        },
                        allowOutsideClick: false,
                        allowEscapeKey: false
                    });

                    // Sync PR dulu
                    // Step 1: Find PR dulu
                    $.ajax({
                        type: 'POST',
                        url: '{{ route('find.pr') }}',
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        success: function(response0) {
                            // Step 2: Lalu sync PO
                            $.ajax({
                                type: 'POST',
                                url: '{{ route('sync.pr') }}',
                                headers: {
                                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                },
                                success: function(response1) {
                                    // Step 3: Lalu sync GR
                                    $.ajax({
                                        type: 'POST',
                                        url: '{{ route('sync.gr') }}',
                                        headers: {
                                            'X-CSRF-TOKEN': $(
                                                'meta[name="csrf-token"]').attr(
                                                'content')
                                        },
                                        success: function(response2) {
                                            let allDetails = [];
                                            if (response0.details) {
                                                response0.details.forEach(d => allDetails.push({no_prapr: d.no_prapr, catatan: 'Cari PR: ' + d.catatan}));
                                            }
                                            if (response1.details) {
                                                response1.details.forEach(d => allDetails.push({no_prapr: d.no_prapr, catatan: 'Sync PO: ' + d.catatan}));
                                            }
                                            if (response2.details) {
                                                response2.details.forEach(d => allDetails.push({no_prapr: d.no_prapr, catatan: 'Sync GR: ' + d.catatan}));
                                            }

                                            let combinedMsg = '<div class="text-start"><p><b>Cari Nomor PR:</b> ' + (response0.success ? '✓' : '✗') + ' ' + response0.message + '</p>' +
                                                '<p><b>Sync PO:</b> ' + (response1.success ? '✓' : '✗') + ' ' + response1.message + '</p>' +
                                                '<p><b>Sync GR:</b> ' + (response2.success ? '✓' : '✗') + ' ' + response2.message + '</p></div>';

                                            if (response0.success && response1.success && response2.success) {
                                                Swal.fire({
                                                    title: 'Berhasil!',
                                                    html: buildSyncTableHtml(combinedMsg, allDetails),
                                                    icon: 'success', width: '700px',
                                                    confirmButtonColor: '#028284'
                                                }).then(() => {
                                                    location.reload();
                                                });
                                            } else {
                                                Swal.fire({
                                                    title: 'Berhasil!',
                                                    html: buildSyncTableHtml(combinedMsg, allDetails),
                                                    icon: 'success', width: '700px',
                                                    confirmButtonColor: '#028284'
                                                }).then(() => {
                                                    location.reload();
                                                });
                                            }
                                        },
                                        error: function(xhr) {
                                            const msg = xhr.responseJSON
                                                ?.message || xhr.statusText ||
                                                'Terjadi kesalahan server (HTTP ' +
                                                xhr.status + ')';
                                            Swal.fire({
                                                title: 'Error Sync GR', text: msg, icon: 'error',
                                                confirmButtonColor: '#028284'
                                            });
                                        }
                                    });
                                },
                                error: function(xhr) {
                                    const msg = xhr.responseJSON?.message || xhr
                                        .statusText || 'Terjadi kesalahan server (HTTP ' +
                                        xhr.status + ')';
                                    Swal.fire({
                                        title: 'Error Sync PO', text: msg, icon: 'error',
                                        confirmButtonColor: '#028284'
                                    });
                                }
                            });
                        },
                        error: function(xhr) {
                            const msg = xhr.responseJSON?.message || xhr.statusText ||
                                'Terjadi kesalahan server (HTTP ' + xhr.status + ')';
                            Swal.fire({
                                title: 'Error Cari Nomor PR', text: msg, icon: 'error',
                                confirmButtonColor: '#028284'
                            });
                        }
                    });
                }
            });
        }

        //function delete
        function deleteData(name, msg) {
            pesan = confirm('Apakah Anda Yakin ' + msg + ' Data ' + name + ' ini ?');
            if (pesan) return true
            else return false
        }
    </script>
@endpush