@extends('layouts.authUser')

@section('content')
@auth
@if (auth()->user()->role == 'Admin') 
    <h2>Senarai pesanan inventori</h2>
@else
    <h2>Inventori / Senarai pesanan inventori</h2>
@endif
@endauth

<div class="table-responsive mt-3">
    <a href="{{ route('ManageItemOrder.ItemOrderList.ExportItemOrder') }}" class="btn btn-exportExcel">
        <span class="icon-exportExcel">
            <i class="bx bx-export"></i>
        </span>
        <span class="btn-exportExcelText">Eksport ke Excel</span>
    </a>

    <div class="search">
        <input type="search" name="search" class="form-control" id="Search" placeholder="Carian...">
        <span class="icon-search">
            <i class="bx bx-search"></i>
        </span>
    </div>

    <table class="table table-striped table-bordered table-sm mt-3">
        <thead>
            <tr>
                <th style="width: 1%; text-align:center;">No.</th> 
                <th style="width: 15%">Alat radas</th>
                <th style="width: 10%">No. siri</th>
                <th style="width: 10%">No. bilik penyediaan</th>
                <th style="width: 10%">Harga seunit</th>
                <th style="width: 5%">Kuantiti terima</th>
                <th style="width: 5%">Kuantiti baki</th>
                <th style="width: 5%">Kuantiti diperlukan</th>
                <th style="width: 15%">Pembekal</th>
                <th style="width: 10%; text-align:center;">Tindakan</th>               
            </tr>   
        </thead>

        <tbody>
            @if($itemOrders->isEmpty())
                <tr>
                    <td colspan="11" class="text-center">Tiada data dalam rekod</td>
                </tr>
            @else
            @foreach($itemOrders as $index => $itemOrder)
            <tr>
                <td style="text-align:center;">{{ ($itemOrders->currentPage() - 1) * $itemOrders->perPage() + $index + 1 }}</td>
                <td class="search1">
                    <a href="#" data-bs-toggle="modal" data-bs-target="#itemOrderModal-{{ $itemOrder->id }}"> 
                        @if($itemOrder->item->item_measurement === null)
                            {{ $itemOrder->item->item_name }}
                        @else
                            {{ $itemOrder->item->item_name }} [{{ $itemOrder->item->item_measurement }}{{ $itemOrder->item->item_measurement_unit }}]
                        @endif
                    </a>
                </td>
                <td class="search2">
                    {{$itemOrder->item->item_series_num}}
                </td>
                <td class="search3">{{$itemOrder->item->itemLocation->storageRoomNo}}</td>
                <td class="search4">RM {{$itemOrder->item->item_price}}</td>
                <td>{{$itemOrder->item->item_quantity}}</td>
                <td>{{$itemOrder->item->item_currentQuantity}}</td>
                <td>{{$itemOrder->quantityNeeded}}</td>
                <td class="search5">{{$itemOrder->item->supplier->name}}</td>

                @auth
                @if (auth()->user()->role == 'Admin')
                <td>            
                    <!-- Button trigger modal -->
                    <div class="col-Tindakan">
                        <button type="button" class="btn btn-link text-danger" data-bs-toggle="modal" data-bs-target="#deleteModal-{{ $itemOrder->id }}">
                            <i class='icon-trash bx bxs-trash'></i>
                        </button>
                    </div> 
                </td>
                @elseif (auth()->user()->role == 'Pembantu makmal')
                <td>
                    <!-- Send Email Button -->
                    <form action="{{ route('sendEmailAdmin', $itemOrder->id) }}" method="POST"  class="send-email-form">
                         @csrf
                            <button 
                                type="submit" class="btn btn-custom btn-sm" id="sendEmailButton" {{ session('email_sent_' . $itemOrder->id) ? 'disabled' : '' }}>
                                    {{ session('email_sent_' . $itemOrder->id) ? 'Telah dihantar' : 'Hantar Email' }}
                            </button>
                        </form>
                @endif    
                </td>
                @endauth 
            </tr>
            
            <!-- Item Order Details Modal -->
            <div class="modal fade" id="itemOrderModal-{{ $itemOrder->id }}" tabindex="-1" aria-labelledby="itemOrderModalLabel-{{ $itemOrder->id }}" aria-hidden="true">
                <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h1 class="modal-title fs-5" id="itemOrderModalLabel-{{ $itemOrder->id }}"><b>Butiran pesanan inventori</b></h1>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <p><b>Nama alat radas:</b>
                                @if($itemOrder->item->item_measurement === null)
                                    {{ $itemOrder->item->item_name }}
                                @else
                                    {{ $itemOrder->item->item_name }} [{{ $itemOrder->item->item_measurement }}{{ $itemOrder->item->item_measurement_unit }}]
                                @endif
                            </p>
                            <p><b>No. siri:</b> {{ $itemOrder->item->item_series_num }}</p>
                            <p><b>No. bilik penyediaan:</b> {{ $itemOrder->item->itemLocation->storageRoomNo }}</p>
                            <p><b>Harga seunit:</b> RM {{ $itemOrder->item->item_price }}</p>
                            <p><b>Jumlah kuantiti:</b> {{ $itemOrder->item->item_quantity }}</p>
                            <p><b>Kuantiti terkini:</b> {{ $itemOrder->item->item_currentQuantity }}</p>
                            <p><b>Kuantiti yang diperlukan:</b> {{ $itemOrder->quantityNeeded }}</p>
                            <p><b>Pembekal:</b> {{ $itemOrder->item->supplier->name }}</p>   
                        </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Delete Confirmation Modal -->
            <div class="modal fade" id="deleteModal-{{ $itemOrder->id }}" tabindex="-1" aria-labelledby="deleteModalLabel-{{ $itemOrder->id }}" aria-hidden="true">
              <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                  <div class="modal-header">
                    <h1 class="modal-title fs-5" id="deleteModalLabel-{{ $itemOrder->id }}"><b>Kepastian Pemadaman</b></h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                  </div>
                  <div class="modal-body">
                    Anda pasti untuk memadam data pesanan inventori?
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                    <form id="delete-form-{{ $itemOrder->id }}"
                        action="{{ route('ManageItemOrder.DeleteItemOrder') }}"
                        method="POST">
                        @csrf
                        @method('DELETE')
                        <input type="hidden" name="itemOrder" value="{{ $itemOrder->id }}">
                        <button type="submit" class="btn btn-danger">Padam</button>
                    </form>
                  </div>
                </div>
              </div>
            </div>
            @endforeach
            @endif
        </tbody> 

    </table>
    <div id="custom-pagination" class="pagination d-flex flex-row-reverse"> 
        {{ $itemOrders->links() }}
    </div> 
</div>
<div id="alert-message">
    @if (session('failure'))
        <div class="alert alert-danger">
            {{ session('failure') }}
        </div>
    @endif <!--Red pop up message-->

    @if (session('success'))
        <div class="alert alert-success">
            {{ session('success') }}
        </div>
    @endif <!--Green pop up message-->
</div>

<script>
    // Hide alert message after 5 seconds if it exists
setTimeout(function() {
    const alertMessage = document.getElementById("alert-message");
    if (alertMessage) {
        alertMessage.style.display = "none";
    }
}, 5000);
</script>

<script>
    document.querySelectorAll('.send-email-form').forEach(form => {
    form.addEventListener('submit', function (event) {
        if (!confirm('Adakah anda pasti ingin menghantar email kepada Admin?')) {
            event.preventDefault();
        } else {
            // Disable the button after confirmation
            const button = form.querySelector('button[type="submit"]');
            button.disabled = true;
        }
    });
});

</script>
@endsection