@extends('admin/layouts/default')

{{-- Page title --}}
@section('title')
    Returntostores List
    @parent
@stop

{{-- Page content --}}
@section('content')
    <section class="content-header">

        <ol class="breadcrumb">
            <li>
                <a href="{{ route('dashboard') }}">
                    <i class="livicon" data-name="home" data-size="16" data-color="#000"></i>
                    Dashboard
                </a>
            </li>
            <li>Returntostores</li>
            <li class="active">Returntostores</li>
        </ol>
    </section>

    <section class="content paddingleft_right15">
        <div class="row">
            <div class="panel panel-primary">
                <div class="panel-heading clearfix">
                    <h4 class="panel-title pull-left">
                        <i class="livicon" data-name="list-ul" data-size="16" data-loop="true" data-c="#fff" data-hc="white"></i>
                        Returned Item Request
                    </h4>
                </div>

                <div class="panel-body">
                    {{-- Approved Requests Tab --}}
                    <div class="tab-pane" id="approved">
                        <div style="overflow-x:auto; white-space:nowrap;">
                            <table class="table table-bordered table-striped" id="table_approved">
                                <thead>
                                <tr>
                                    <th>Request Id</th>
                                    <th>Staffid</th>
                                    <th>Firstname</th>
                                    <th>Lastname</th>
                                    <th>Email</th>
                                    <th>Description</th>
                                    <th>Expert</th>
                                    <th>Date</th>
                                    <th>Model</th>
                                    <th>Serial</th>
                                    <th>Approved By</th>
                                    <th>Status</th>
                                    <th>Print</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach ($returntostores->where('teamleader', 1) as $approved)
                                    @php
                                        $staff = DB::table('staffrequests')
                                            ->where('id', $approved->staffid)
                                            ->first();
                                    @endphp
                                    <tr>
                                        <td>{{ $approved->id }}</td>
                                        <td>{{ $approved->staffid }}</td>
                                        <td>{{ $staff->firstname ?? 'N/A' }}</td>
                                        <td>{{ $staff->lastname ?? 'N/A' }}</td>
                                        <td>{{ $staff->email ?? 'N/A' }}</td>
                                        {{-- Updated Description Cell with link to trigger modal --}}
                                        <td>
                                            <a href="#" class="view-description"
                                               data-toggle="modal"
                                               data-target="#descriptionModal"
                                               data-description="{{ $approved->description }}">
                                                View Details
                                            </a>
                                        </td>
                                        <td>{{ $approved->expert }}</td>
                                        <td>{{ $approved->date }}</td>
                                        <td>{{ $approved->model }}</td>
                                        <td>{{ $approved->serial }}</td>
                                        <td>Gashaw Adane </td>
                                        <td>
                                            <span class="text-success">
                                                <i class="fa fa-check"></i> Approved
                                            </span>
                                        </td>
                                        {{-- ADDED PRINT BUTTON/LINK HERE --}}
                                        <td>
                                            {{-- Assuming you have a route named 'returntostores.print' that takes the record ID --}}
                                            <a href="/returntostores/print/{{ $approved->id }}" target="_blank" class="btn btn-xs btn-primary">
                                                <i class="fa fa-print"></i> Print
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                </div> </div> </div> </section>

    {{-- Bootstrap Modal Structure for Description --}}
    <div class="modal fade" id="descriptionModal" tabindex="-1" role="dialog" aria-labelledby="descriptionModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h5 class="modal-title" id="descriptionModalLabel">Request Description</h5>
                </div>
                <div class="modal-body" id="modalDescriptionBody">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
@stop

{{-- Footer scripts --}}
@section('footer_scripts')
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.1/css/buttons.dataTables.min.css">

    <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.print.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.html5.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>

    <script>
        $(document).ready(function() {
            // Initialize DataTable for both tables (table_new is commented out/removed from view, but keeping init for completeness)
            $('#table_new, #table_approved').DataTable({
                dom: 'Bfrtip',
                buttons: [
                    'copy', 'csv', 'excel', 'pdf', 'print'
                ],
                paging: true,
                searching: true,
                autoWidth: false,
                scrollX: true
            });

            // Modal handler for description
            $('#table_approved').on('click', '.view-description', function(e) {
                e.preventDefault();
                // Get the description text from the data-description attribute of the clicked link
                var description = $(this).data('description');

                // Set the modal's body content
                $('#modalDescriptionBody').text(description);
            });
        });
    </script>
@stop