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

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => $title ?? 'Report Rollback Stock Opname'])

    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <div class="row gx-4 align-items-center">
                <div class="col-lg">
                    <button class="btn btn-secondary mb-0" onclick="window.location='{{ route('trsso.index') }}'">
                        <i class="fas fa-circle-left me-1"></i>
                        <span class="font-weight-bold">Kembali</span>
                    </button>
                </div>

                <div class="col-lg text-end">
                    <div class="dropdown d-inline-block me-2">
                        <button class="btn btn-success dropdown-toggle mb-0" type="button" id="dropdownExportExcel"
                            data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="fas fa-file-excel me-1"></i>
                            <span class="font-weight-bold">Export Excel</span>
                        </button>

                        <ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="dropdownExportExcel">
                            <li>
                                <a class="dropdown-item"
                                    href="{{ route('trsso.rollback-excel-tipe', ['session_id' => $session->so_session_id, 'tipe_material_id' => 'VIRGIN']) }}">
                                    Tipe: Virgin
                                </a>
                            </li>
                            <li>
                                <a class="dropdown-item"
                                    href="{{ route('trsso.rollback-excel-tipe', ['session_id' => $session->so_session_id, 'tipe_material_id' => 'RECYCLE']) }}">
                                    Tipe: Recycle
                                </a>
                            </li>
                            <li>
                                <a class="dropdown-item"
                                    href="{{ route('trsso.rollback-excel-tipe', ['session_id' => $session->so_session_id, 'tipe_material_id' => 'SORTIR']) }}">
                                    Tipe: Sortir
                                </a>
                            </li>
                            <li>
                                <a class="dropdown-item"
                                    href="{{ route('trsso.rollback-excel-tipe', ['session_id' => $session->so_session_id, 'tipe_material_id' => 'SSP']) }}">
                                    Tipe: SSP
                                </a>
                            </li>
                        </ul>
                    </div>

                    {{-- <a href="{{ route('trsso.rollback-excel', ['session_id' => $session->so_session_id]) }}"
                        class="btn btn-outline-success mb-0">
                        <i class="fas fa-file-excel me-1"></i>
                        Export Semua
                    </a> --}}

                    <span class="text-sm text-muted ms-2">
                        Session: {{ $session->so_session_id }}
                    </span>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid py-4">

        {{-- Header Info --}}
        <div class="row mb-4">
            <div class="col-12">
                <div class="card shadow-sm">
                    <div class="card-header pb-0">
                        <div class="d-flex justify-content-between">
                            <h6 class="mb-0">Report Rollback Stock Opname - {{ $session->so_session_id }}</h6>

                            <span
                                class="badge
                                @if ($session->status == 'OPEN') bg-info
                                @elseif($session->status == 'IN_PROGRESS') bg-warning
                                @else bg-success @endif">
                                {{ $session->status }}
                            </span>
                        </div>
                    </div>

                    <div class="card-body">
                        <div class="row text-sm">
                            <div class="col-md-6">
                                <strong>Periode SO:</strong>
                                {{ \Carbon\Carbon::parse($session->periode_start)->format('d/m/Y') }}
                                -
                                {{ \Carbon\Carbon::parse($session->periode_end)->format('d/m/Y') }}
                                <br>
                                <strong>Waktu Create SO:</strong>
                                {{ \Carbon\Carbon::parse($boundaries['so_created_at'])->format('d/m/Y H:i') }}
                            </div>

                            <div class="col-md-6 text-end">
                                <strong>PIC:</strong>
                                {{ trim($session->pic_name) ?: $session->pic_username }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- Summary Cards --}}
        {{-- <div class="row mb-4">
            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Beginning Balance</p>
                        <h5 class="font-weight-bolder">{{ number_format($beginning_balance->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">IN Bulan Sebelumnya</p>
                        <h5 class="font-weight-bolder text-success">{{ number_format($prev_month_in->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">OUT Bulan Sebelumnya</p>
                        <h5 class="font-weight-bolder text-danger">{{ number_format($prev_month_out->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Stock per Akhir Bulan</p>
                        <h5 class="font-weight-bolder">{{ number_format($stock_per_end_prev_month->count()) }}</h5>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mb-4">
            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">IN Selama Periode SO</p>
                        <h5 class="font-weight-bolder text-success">{{ number_format($so_period_in->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">OUT Selama Periode SO</p>
                        <h5 class="font-weight-bolder text-danger">{{ number_format($so_period_out->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Stock per Waktu SO</p>
                        <h5 class="font-weight-bolder">{{ number_format($stock_per_so_time->count()) }}</h5>
                    </div>
                </div>
            </div>

            <div class="col-xl-3 col-sm-6 mb-4">
                <div class="card">
                    <div class="card-body p-3">
                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Hasil Stock Opname</p>
                        <h5 class="font-weight-bolder text-info">{{ number_format($per_so->count()) }}</h5>
                    </div>
                </div>
            </div>
        </div> --}}

        {{-- Tabel Wide Sama Seperti Excel --}}
        <div class="card shadow-sm">
            <div class="card-header pb-0">
                <h6 class="mb-0">Rollback Stock Opname</h6>
            </div>

            <div class="card-body">
                <div class="table-responsive rollback-table-wrapper">
                    <table class="table table-bordered table-sm align-middle mb-0" id="rollback-wide-table">
                        <thead>
                            <tr class="text-center">
                                <th rowspan="2" class="sticky-col sticky-col-1 bg-light">KATEGORI ITEM</th>
                                <th rowspan="2" class="sticky-col sticky-col-2 bg-light">KODE ITEM</th>
                                <th rowspan="2" class="sticky-col sticky-col-3 bg-light">BAG</th>
                                <th rowspan="2" class="sticky-col sticky-col-4 bg-light">WARNA</th>

                                <th style="background-color:#FFC000;">
                                    BEGINNING BALANCE<br>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_start'])->format('d-m-Y') }}
                                </th>

                                <th style="background-color:#92D050; text-transform:none !important;">
                                    IN<br>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_start'])->format('d-m-Y') }}
                                    <span style="text-transform:none !important;">s.d.</span>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_end'])->format('d-m-Y') }}
                                </th>

                                <th style="background-color:#FF6B6B; text-transform:none !important;">
                                    OUT<br>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_start'])->format('d-m-Y') }}
                                    <span style="text-transform:none !important;">s.d.</span>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_end'])->format('d-m-Y') }}
                                </th>

                                {{-- <th style="background-color:#00B7BD;">
                                    STOK SAAT INI<br>
                                    REAL TIME
                                </th> --}}

                                <th style="background-color:#9DC3E6;">
                                    STOCK PER<br>
                                    {{ \Carbon\Carbon::parse($boundaries['previous_month_end'])->format('d-m-Y') }}
                                </th>

                                <th style="background-color:#92D050; text-transform:none !important;">
                                    IN<br>
                                    {{ \Carbon\Carbon::parse($boundaries['current_month_start'])->format('d-m-Y') }}
                                    <span style="text-transform:none !important;">s.d.</span>
                                    {{ \Carbon\Carbon::parse($boundaries['so_created_at'])->format('d-m-Y H:i') }}
                                </th>

                                <th style="background-color:#FF6B6B; text-transform:none !important;">
                                    OUT<br>
                                    {{ \Carbon\Carbon::parse($boundaries['current_month_start'])->format('d-m-Y') }}
                                    <span style="text-transform:none !important;">s.d.</span>
                                    {{ \Carbon\Carbon::parse($boundaries['so_created_at'])->format('d-m-Y H:i') }}
                                </th>

                                <th style="background-color:#D9E1F2;">
                                    STOCK PER<br>
                                    {{ \Carbon\Carbon::parse($boundaries['so_created_at'])->format('d-m-Y H:i') }}
                                </th>

                                <th style="background-color:#00B7BD;">
                                    HASIL STOCK OPNAME<br>
                                    {{ \Carbon\Carbon::parse($boundaries['so_created_at'])->format('d-m-Y') }}
                                </th>

                                <th style="background-color:#D9D9D9;">
                                    (HASIL SO) - (STOCK PER)
                                </th>
                            </tr>

                            <tr class="text-center">
                                <th style="background-color:#FFC000;">BERAT</th>
                                <th style="background-color:#92D050;">BERAT</th>
                                <th style="background-color:#FF6B6B;">BERAT</th>
                                {{-- <th style="background-color:#00B7BD;">BERAT</th> --}}
                                <th style="background-color:#9DC3E6;">BERAT</th>
                                <th style="background-color:#92D050;">BERAT</th>
                                <th style="background-color:#FF6B6B;">BERAT</th>
                                <th style="background-color:#D9E1F2;">BERAT</th>
                                <th style="background-color:#00B7BD;">BERAT</th>
                                <th style="background-color:#D9D9D9;">SELISIH</th>
                            </tr>
                        </thead>

                        <tbody>
                            @forelse ($rollback_wide_rows as $row)
                                @php
                                    $beginning = (float) ($row['beginning_berat'] ?? 0);
                                    $prevIn = (float) ($row['prev_in_berat'] ?? 0);
                                    $prevOut = (float) ($row['prev_out_berat'] ?? 0);
                                    // $currentReal = (float) ($row['current_real_berat'] ?? 0);
                                    $stockPrev = (float) ($row['stock_prev_berat'] ?? 0);
                                    $soIn = (float) ($row['so_in_berat'] ?? 0);
                                    $soOut = (float) ($row['so_out_berat'] ?? 0);
                                    $stockSo = (float) ($row['stock_so_berat'] ?? 0);
                                    $hasilSo = (float) ($row['hasil_so_berat'] ?? 0);
                                    $selisih = (float) ($row['selisih_berat'] ?? 0);
                                @endphp

                                <tr>
                                    <td class="sticky-col sticky-col-1 bg-white">
                                        {{ $row['kategori_material'] ?? '' }}
                                    </td>
                                    <td class="sticky-col sticky-col-2 bg-white">
                                        {{ $row['sku_code'] ?? '' }}
                                    </td>
                                    <td class="sticky-col sticky-col-3 bg-white">
                                        {{ $row['bag'] ?? '' }}
                                    </td>
                                    <td class="sticky-col sticky-col-4 bg-white">
                                        {{ $row['warna'] ?? '' }}
                                    </td>

                                    <td class="text-end">{{ number_format($beginning, 2) }}</td>
                                    <td class="text-end">{{ number_format($prevIn, 2) }}</td>
                                    <td class="text-end">{{ number_format($prevOut, 2) }}</td>
                                    {{-- <td class="text-end">{{ number_format($currentReal, 2) }}</td> --}}
                                    <td class="text-end">{{ number_format($stockPrev, 2) }}</td>
                                    <td class="text-end">{{ number_format($soIn, 2) }}</td>
                                    <td class="text-end">{{ number_format($soOut, 2) }}</td>
                                    <td class="text-end">{{ number_format($stockSo, 2) }}</td>
                                    <td class="text-end">{{ number_format($hasilSo, 2) }}</td>

                                    <td
                                        class="text-end {{ abs($selisih) > 0.00001 ? 'text-danger font-weight-bold' : '' }}">
                                        {{ number_format($selisih, 2) }}
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="13" class="text-center text-muted">
                                        Data tidak ditemukan
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

    </div>

    @push('css')
        <style>
            .rollback-table-wrapper {
                max-height: 75vh;
                overflow: auto;
            }

            #rollback-wide-table {
                white-space: nowrap;
                font-size: 11px;
            }

            #rollback-wide-table th,
            #rollback-wide-table td {
                padding: 6px 8px;
                vertical-align: middle;
                border: 1px solid #999 !important;
            }

            #rollback-wide-table thead th {
                position: sticky;
                top: 0;
                z-index: 10;
                text-align: center;
                font-weight: 700;
                text-transform: none !important;
            }

            #rollback-wide-table thead tr:nth-child(2) th {
                top: 47px;
                z-index: 10;
                text-transform: none !important;
            }

            .sticky-col {
                position: sticky;
                z-index: 7;
            }

            .sticky-col-1 {
                left: 0;
                min-width: 160px;
            }

            .sticky-col-2 {
                left: 160px;
                min-width: 140px;
            }

            .sticky-col-3 {
                left: 300px;
                min-width: 230px;
            }

            .sticky-col-4 {
                left: 530px;
                min-width: 150px;
            }

            thead .sticky-col {
                z-index: 12 !important;
            }
        </style>
    @endpush

    @push('js')
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                @if (session('success'))
                    Swal.fire({
                        icon: 'success',
                        title: 'Berhasil',
                        text: '{{ session('success') }}',
                        confirmButtonColor: '#028284'
                    });
                @endif

                @if ($errors->any())
                    Swal.fire({
                        icon: 'error',
                        title: 'Error',
                        text: '{{ $errors->first() }}',
                        confirmButtonColor: '#028284'
                    });
                @endif

                $('#rollback-wide-table').DataTable({
                    pageLength: 25,
                    lengthMenu: [10, 25, 50, 100],
                    scrollX: true,
                    scrollCollapse: true,
                    responsive: false,
                    autoWidth: false,
                    ordering: true,
                    searching: true,
                    info: true,
                    language: {
                        search: "Cari:",
                        lengthMenu: "Tampilkan _MENU_ data",
                        info: "Menampilkan _START_ sampai _END_ dari _TOTAL_ data",
                        infoEmpty: "Tidak ada data",
                        zeroRecords: "Data tidak ditemukan",
                        paginate: {
                            first: "Awal",
                            last: "Akhir",
                            next: "›",
                            previous: "‹"
                        }
                    }
                });
            });
        </script>
    @endpush
@endsection