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

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => 'Dashboard'])
    {{-- Popup khusus role Satpam --}}
    @if (optional($roles)->idroles === 'satpam')
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                Swal.fire({
                    title: 'Lakukan Pengecekan Inventaris?',
                    html: `
                        <div class="text-center">
                            Apakah Anda ingin melakukan pengecekan inventaris sekarang?
                        </div>
                    `,
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonText: `
                        <i class="fas fa-qrcode me-1"></i>
                        Ya, Mulai Pengecekan
                    `,
                    cancelButtonText: 'Nanti',
                    confirmButtonColor: '#028284',
                    cancelButtonColor: '#6c757d',
                    reverseButtons: true,
                    allowOutsideClick: false
                }).then(function(result) {
                    if (result.isConfirmed) {
                        window.location.href = @json(url('/trspen/add'));
                    }
                });
            });
        </script>
    @endif
    <div class="container-fluid py-4">
        <div class="row mt-4">
            <!-- Problematic Items Card for This Month -->
            <div class="col-md-4 mb-4">
                @if (in_array($roles->idroles, ['admins', 'kesker']))
                    <a href="{{ url('/trspen') }}" class="text-decoration-none" target="_blank">
                @endif
                <div class="card shadow-lg">
                    <div class="card-body text-center p-4">
                        <i class="ni ni-image text-danger" style="font-size: 60px;"></i>
                        <h5 class="font-weight-bolder mt-3">Temuan Inventaris {{ $bulanSekarang }}</h5>
                        <p class="font-weight-bold" style="font-size: 2.5rem; letter-spacing: 2px; color: #dc3545;">
                            {{ $invMasalahData }}</p>
                    </div>
                </div>
                @if (in_array($roles->idroles, ['admins', 'kesker']))
                    </a>
                @endif
            </div>

            <!-- Expired Items Card -->

            <div class="col-md-4 mb-4">
                @if (in_array($roles->idroles, ['admins', 'kesker']))
                    <a href="{{ url('/rptexp') }}" class="text-decoration-none" target="_blank">
                @endif
                <div class="card shadow-lg">
                    <div class="card-body text-center p-4">
                        <i class="ni ni-album-2 text-danger" style="font-size: 60px;"></i>
                        <h5 class="font-weight-bolder mt-3">Inventaris Expired</h5>
                        <p class="font-weight-bold" style="font-size: 2.5rem; letter-spacing: 2px; color: #dc3545;">
                            {{ $expiredItemsCount }}
                        </p>

                    </div>
                </div>
                @if (in_array($roles->idroles, ['admins', 'kesker']))
                    </a>
                @endif
            </div>

            <!-- Total Inventories Card -->
            <div class="col-md-4 mb-4">
                <div class="card shadow-lg">
                    <div class="card-body text-center p-4">
                        <i class="ni ni-box-2 text-success" style="font-size: 60px;"></i>
                        <h5 class="font-weight-bolder mt-3">Total Inventaris MSJ</h5>
                        <p class="font-weight-bold" style="font-size: 2.5rem; letter-spacing: 2px; color: #28a745;">
                            {{ $totalItems }}</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="row mt-4">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header pb-0 pt-3 bg-transparent">
                        <h4 class="text-capitalize">Inventaris Bermasalah (3 Bulan Terakhir)</h4>
                    </div>
                    <div class="card-body p-3">
                        <div class="table-responsive">
                            <table class="table display" id="list_{{ $dmenu }}">
                                <thead class="thead-light" style="background-color: #00b7bd4f;">
                                    <tr>
                                        <th>No</th>
                                        <th>Kode Inventaris</th>
                                        <th>Nomor</th>
                                        <th>Lokasi</th>
                                        <th>Tanggal Pengecekan</th>
                                        <th>Aspek</th>
                                        <th>Foto</th>
                                        <th>Exp Master</th>
                                        <th>Exp Pengecekan</th>
                                        <th>Keterangan</th>
                                        <th>Checker</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                        $no = 1;
                                    @endphp
                                    @foreach ($problematicItems as $data)
                                        <tr>
                                            <td>{{ $no++ }}</td>
                                            <td class="text-sm font-weight-bold text-dark">
                                                {{ $data->id_mst_inventaris }}
                                            </td>
                                            <td>{{ $data->nomor }}</td>
                                            <td>{{ $data->area }} ({{ $data->gedung }})</td>
                                            <td>{{ $data->tgl_pengecekan }}</td>
                                            <td>{{ $data->deskripsi }}</td>
                                            <td class="text-sm">
                                                @if (!empty($data->foto) && $data->foto != 'noimage.png')
                                                    <span class="my-2 text-xs">
                                                        <img src="{{ file_exists(public_path('storage/' . $data->foto . 'tumb.png')) ? asset('/storage/' . $data->foto . 'tumb.png') : asset('storage/' . $data->foto) }}"
                                                            alt="image" style="height: 35px; cursor: pointer;"
                                                            data-bs-toggle="modal"
                                                            data-bs-target="#imageModalDash{{ $loop->index }}">
                                                    </span>
                                                    <!-- Modal -->
                                                    <div class="modal fade" id="imageModalDash{{ $loop->index }}"
                                                        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/' . $data->foto) }}"
                                                                        alt="image"
                                                                        class="w-100 border-radius-lg shadow-sm">
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                @else
                                                    <span class="text-xs text-muted">-</span>
                                                @endif
                                            </td>
                                            <td>{{ isset($data->exp) ? \Carbon\Carbon::parse($data->exp)->format('Y-m-d') : '-' }}
                                            </td>
                                            <td>{{ isset($data->exp_dicek) ? substr($data->exp_dicek, 0, 10) : '-' }}</td>
                                            <td>{{ $data->keterangan }}</td>
                                            <td>{{ $data->id_pengecek }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row mt-4">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header pb-0 pt-3 bg-transparent">
                        <h4 class="text-capitalize">Inventaris Expired</h4>
                    </div>
                    <div class="card-body p-3">
                        <div class="table-responsive">
                            <table class="table display" id="myTable">
                                <thead class="thead-light" style="background-color: #00b7bd4f;">
                                    <tr>
                                        <th>No</th>
                                        <th>Kode Inventaris</th>
                                        <th>Nomor</th>
                                        <th>Ukuran</th>
                                        <th>Gedung</th>
                                        <th>Area</th>
                                        <th>Tanggal Exp</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                        $no = 1;
                                    @endphp
                                    @foreach ($expiredItems as $exp)
                                        @php
                                            // Menghitung selisih antara tanggal expired dan tanggal hari ini
                                            $expiredDate = \Carbon\Carbon::parse($exp->exp);
                                            $now = \Carbon\Carbon::now();
                                            $differenceInDays = $expiredDate->diffInDays($now);
                                        @endphp
                                        <tr
                                            @if ($differenceInDays <= 30 && $expiredDate > $now) style="background-color: #f4e59e;" @elseif ($expiredDate <= $now) style="background-color: #ffc2cd;" @endif>

                                            <td>{{ $no++ }}</td>
                                            <td class="text-sm font-weight-bold text-dark">
                                                {{ $exp->kode }}
                                            </td>
                                            <td>{{ $exp->nomor }}</td>
                                            <td>{{ $exp->ukuran_name }}</td>
                                            <td>{{ $exp->gedung }}</td>
                                            <td>{{ $exp->area }}</td>
                                            <td>{{ $exp->exp }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="row px-4 py-2">
                        <div class="col-lg">
                            <div class="nav-wrapper" id="noted"><code>Note : ( <i aria-hidden="true"
                                        style="color: #f4e59e;" class="fas fa-circle"></i> Date Expired <= 30 Day ), ( <i
                                        aria-hidden="true" style="color: #ffc2cd;" class="fas fa-circle"></i> Inventaris
                                        Expired )</code>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
    <script>
        $('#myTable').DataTable({
            "language": {
                "search": "Cari :",
                "lengthMenu": "Tampilkan _MENU_ baris",
                "zeroRecords": "Maaf - Data tidak ada",
                "info": "Halaman _PAGE_ dari _PAGES_",
                "infoEmpty": "Tidak ada data",
                "infoFiltered": "(pencarian dari _MAX_ data)"
            },
            responsive: true,
        });

        //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
        });
        //set color button datatables
        $('.dt-button').addClass('btn btn-secondary');
        $('.dt-button').removeClass('dt-button');
    </script>
@endpush