@extends('front.master')

@section('title','Files')

@section('content')



<div class="container-fluid">

    <div class="row">
        <main class="container" style="margin-top: 50px; margin-bottom: 50px;">

        @if(Session::has('flash_message_success'))                    
            <div class="alert alert-success alert-block">
                <button type="button" class="close" data-dismiss="alert">×</button> 
                <strong>{!! session('flash_message_success') !!}</strong>
            </div>
        @endif
        @if(Session::has('flash_message_danger'))                    
            <div class="alert alert-danger alert-block">
                <button type="button" class="close" data-dismiss="alert">×</button> 
                <strong>{!! session('flash_message_danger') !!}</strong>
            </div>
        @endif
        @if ($errors->any())
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif  
    </div>

    <div class="row" style="margin-bottom: 300px;">
        <div class="panel-body" style= "width: 100% !important; overflow-x: scroll;">
            <table class="table table-stripped" id="myTable" style="width: nowrap; margin: 0 auto; max-width: -moz-fit-content; max-width: fit-content; white-space: nowrap;">
                <thead>
                    <tr class="text-white" style="background-color: #3366ff;">
                        <th>S/N</th>
                        <th>File Number</th>
                        <th>Bill Lading</th>
                        <th>Form M</th>
                        <th>Allocation Date</th>
                        <th>Commodity</th>
                        <th>Job Type</th>
                        <th>20FT</th>
                        <th>40FT</th>
                        <th>Other Size</th>
                        <th>Assigned Staff</th>
                        <th>Shipping Line</th>
                        <th>Terminal</th>
                        <th style="width: 40%; fit-content: center;">Action</th>
                    </tr>
                </thead>
                <tbody>
                                        @foreach($files as $file)
                        <tr>
                            <td>{{$n++}}</td>
                            <td>{{ $file->file_number }}</td>
                            <td>{{ $file->bill_of_lading }}</td>
                            <td>{{ $file->mf }}</td>
                            <td>{{ $file->date_allocated }}</td>
                            <td>{{ $file->commodity }}</td>
                            <td class="text-success">
                                <strong>
                                    @if($file->job_type == 1)
                                        Fast-Track
                                    @endif
                                    @if($file->job_type == 0)
                                        Customs Examination
                                    @endif
                                </strong>
                            </td>
                            <td>{{ $file->twenty_ft }}</td>
                            <td>{{ $file->fourty_ft }}</td>
                            <td>{{ $file->other_size }}</td>
                            <td>{{ $file->staff_assigned }}</td>
                            <td>{{ $file->shipping_line }}</td>
                            <td>{{ $file->terminal }}</td>
                            <td style="width: 40%">

                                <a type="button" class="btn btn-success text-white" data-toggle="modal" data-target="#myModal{{$file->id}}" data-idUpdate="'$file->id'">Re-Open File</a>

                                <a href="{{url('/createReport', $file->id)}}"><button class="btn btn-default" style="background-color: gray; color: white;">File Report</button></a>

                                <a href="{{url('/printInvoice', $file->id)}}"><button class="btn btn-primary">Generate Bafica Invoice</button></a>
                            </td>

                            <!-- Modal -->

                                            <div id="myModal{{$file->id}}" class="modal fade" role="dialog">
                                                <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button type="button" class="close" data-dismiss="modal" style="float: right;">&times;</button>
                                                            <div class="container text-center">
                                                                <h4 class="modal-title text-danger">RE-OPEN {{ $file->file_number }}</h4>
                                                            </div>
                                                        </div>
                                                        <div class="modal-body">
                                                            <form class="form-horizontal" method="POST" action="{{route('fileStatus')}}" enctype="multipart/form-data">

                                                                {!! csrf_field() !!}

                                                                <div class="col-md-12">
                                                                    <input type="hidden" class="form-control" name="id" id="id" value="{{$file->id}}">
                                                                    <div class="form-group">
                                                                        <div class="row">
                                                                            <div class="col-md-10 text-center">
                                                                                <input class="form-check-input" name="file_status" id="file_status" type="checkbox" value="0">
                                                                                <div>
                                                                                    <label class="form-check-label" for="open" style="margin-left: 130px;">
                                                                                        Re-Open this File
                                                                                    </label>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                        
                                                                    </div>

                                                                    <div class="form-group">

                                                                        <button type="submit" class="btn btn-primary">Submit</button>

                                                                    </div> 
                                                                </div>

                                                                                                        
                                                            </form>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- endmodal -->
                        </tr>
                    @endforeach
                </tbody>
            </table>
    </div>
        
    </div>

</div>

@endsection