@extends('front.master')

@section('title','Files')

@section('content')

<style>
    .collapsible {
        background-color: #777;
        color: white;
        cursor: pointer;
        padding: 18px;
        width: 100px;
        border: none;
        text-align: left;
        outline: none;
        font-size: 15px;
    }
    .active, .collapsible: hover {
        background-color: #555;
    }
    .content {
        padding: 0.18px;
        display: none;
        overflow: hidden;
        background-color: #f1f1f1;
    }
</style>


<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

                

            <button type="button" class="collapsible btn btn-primary text-center" style="float: right; width: 100%;"><strong> CREATE NEW FILE</strong></button>
            @if(Auth::user()-> role == 1)
            <div class="content">
                <br>
                <div class="col-md-12">
                    <div class="row">
                        <div class="panel-body col-12">
                            <form class="form-horizontal" method="POST" action="{{route('createFile')}}" enctype="multipart/form-data">

                                {!! csrf_field() !!}
                                <div class="col-md-12">
                                    <div class="row">

                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('file_number')? 'has-error': '')}}">
                                                
                                                <label for="file_number">File Number:</label>
                                                <input type="text" class="form-control" name="file_number" id="file_number" value="" placeholder="File Number" required="file_number">

                                                <span class="text-danger">{{$errors->first('file_number')}}</span>
                            
                                            </div>
                                            
                                        </div>

                                        <div class="col-md-4">

                                            <div class="form-group{{($errors->has('invoice_number')? 'has-error': '')}}">
                                                
                                                <label for="invoice_number">Invoice Number:</label>
                                                <input type="text" class="form-control" name="invoice_number" id="invoice_number" value="" placeholder="Invoice Number" required="invoice_number">

                                                <span class="text-danger">{{$errors->first('invoice_number')}}</span>
                            
                                            </div>
                                        </div>

                                        <div class="col-md-4">
                                
                                            <div class="form-group{{($errors->has('bill_of_lading')? 'has-error': '')}}">
                                                
                                                <label for="bill_of_lading">B/L:</label>
                                                <input type="text" class="form-control" name="bill_of_lading" id="bill_of_lading" placeholder="Bill Lading Number" required="bill_of_lading">

                                                <span class="text-danger">{{$errors->first('bill_of_lading')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('mf')? 'has-error': '')}}">
                                    
                                                <label for="mf">MF:</label>
                                                <input type="text" class="form-control" name="mf" id="mf" placeholder="Form M">

                                                <span class="text-danger">{{$errors->first('mf')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label for="term">Consignee Name:</label>
                                                <div class="">
                                                    <select class="form-control" name="cosignee_id" id="consignee_id">
                                                        <option value="">Select Consignee</option>

                                                            @foreach($users as $Key =>$s)
                                                            <option value="{{ $s->id }}">{{ $s->consignee_name }}</option>
                                                            @endforeach
                                                    </select>
                                                </div>      
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('date_allocated')? 'has-error': '')}}">
                                    
                                                <label for="date_allocated">Date Allocated:</label>
                                                <input type="date" class="form-control" name="date_allocated" id="date_allocated" placeholder="date_allocated">

                                                <span class="text-danger">{{$errors->first('date_allocated')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('commodity')? 'has-error': '')}}">
                                    
                                                <label for="commodity">Commodity:</label>
                                                <input type="text" class="form-control" name="commodity" id="commodity" placeholder="Commodity">

                                                <span class="text-danger">{{$errors->first('commodity')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('twenty_ft')? 'has-error': '')}}">
                                    
                                                <label for="twenty_ft">Twenty FT:</label>
                                                <input type="text" class="form-control" name="twenty_ft" id="twenty_ft" placeholder="No of Containers">

                                                <span class="text-danger">{{$errors->first('twenty_ft')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('fourty_ft')? 'has-error': '')}}">
                                    
                                                <label for="fourty_ft">Fourty FT:</label>
                                                <input type="text" class="form-control" name="fourty_ft" id="fourty_ft" placeholder="No of Containers">

                                                <span class="text-danger">{{$errors->first('fourty_ft')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('other_size')? 'has-error': '')}}">
                                    
                                                <label for="other_size">Other Size:</label>
                                                <input type="text" class="form-control" name="other_size" id="other_size" placeholder="Other Size">

                                                <span class="text-danger">{{$errors->first('other_size')}}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label for="job_type">Type of Job:</label>
                                                <div class="">
                                                    <select class="form-control" name="job_type" id="job_type">
                                                        <option value="">Select Job Type</option>
                                                        <option value="0">Customs Examination</option>
                                                        <option value="1">Fast-Track</option>
                                                    </select>
                                                </div>      
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('staff_assigned')? 'has-error': '')}}">
                                    
                                                <label for="staff_assigned">Staff Assigned:</label>
                                                <input type="text" class="form-control" name="staff_assigned" id="staff_assigned" placeholder="Staff Assigned">

                                                <span class="text-danger">{{$errors->first('staff_assigned')}}</span>
                            
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('shipping_line')? 'has-error': '')}}">
                                    
                                                <label for="shipping_line">Shipping Line:</label>
                                                <input type="text" class="form-control" name="shipping_line" id="shipping_line" placeholder="Shipping Line">
                                                <span class="text-danger">{{$errors->first('shipping_line')}}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group{{($errors->has('terminal')? 'has-error': '')}}">
                                    
                                                <label for="terminal">Terminal:</label>
                                                <input type="text" class="form-control" name="terminal" id="terminal" placeholder="Terminal">

                                                <span class="text-danger">{{$errors->first('terminal')}}</span>
                            
                                            </div>
                                        </div>

                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group float-right" style="margin-right: 5%;">

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

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


                            </form>
                            
                        </div>
                        
                    </div>
                    
                </div>
            </div>
            
        </main>
    </div>

    <div class="row" style="margin-bottom: 300px;">
        <div class="panel-body card" 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-info text-white" data-toggle="modal" data-target="#myModal{{$file->id}}" data-idUpdate="'$file->id'">Edit</a>

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

                                @if($file->job_type == 1)
                                <a href="{{url('/fastTrack', $file->id)}}"><button class="btn btn-success">Include Fast-Track</button></a>
                                @endif

                                <a href="{{url('/demmurage', $file->id)}}"><button class="btn btn-primary">Add Demmurage</button></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('/invoiceatt', $file->id)}}"><button class="btn btn-warning" style="background-color: #993366; color: white;">Upload Supporting Documents</button></a>

                                <a href="{{url('/createInvoice', $file->id)}}"><button class="btn btn-info">Add All Invoices</button></a>
                                <a href="{{url('/containerReport', $file->id)}}"><button class="btn btn-warning">Create Container Report</button></a>
                                <a href="{{url('/printInvoice', $file->id)}}"><button class="btn btn-primary">Generate Bafica Invoice</button></a>
 -->



                                <div class="dropdown">
                                    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Action</button>
                                    <ul class="dropdown-menu">
                                        <li>
                                            <a type="button" data-toggle="modal" data-target="#myModal{{$file->id}}" data-idUpdate="'$file->id'"><button class="btn btn-info">Edit</button></a>
                                        </li>
                                        <li>
                                            <a data-toggle="modal" data-target="#myModal{{$file->bill_of_lading}}" data-idUpdate="'$file->id'"><button class="btn btn-danger">Close File</button></a>
                                        </li>
                                         @if($file->job_type == 1)
                                        <li>
                                            <a href="{{url('/fastTrack', $file->id)}}"><button class="btn btn-success">Add Fast-Track</button></a>
                                        </li>
                                        @endif
                                        <li>
                                            <a href="{{url('/demmurage', $file->id)}}"><button class="btn btn-primary">Add Demmurage</button></a>
                                        </li>
                                        <li>
                                            <a href="{{url('/createReport', $file->id)}}"><button class="btn btn-default" style="background-color: gray; color: white;">File Report</button></a>
                                        </li>
                                        <li>
                                            <a href="{{url('/invoiceatt', $file->id)}}"><button class="btn" style="background-color: #993366; color: white;">Upload Docs</button></a>
                                        </li>
                                        <li>
                                            <a href="{{url('/createInvoice', $file->id)}}"><button class="btn btn-info">Add Invoices</button></a>
                                        </li>
                                        <li>
                                            <a href="{{url('/containerReport', $file->id)}}"><button class="btn btn-warning">Container Report</button></a>
                                        </li>
                                        <li>
                                            <a href="{{url('/printInvoice', $file->id)}}"><button class="btn btn-primary">Bafica Invoice</button></a>
                                        </li>
                                    </ul>
                                    
                                </div>
                            </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">Edit File ({{$file->bill_of_lading}})</h4>
                                            </div>
                                        </div>
                                        <div class="modal-body">
                                            <form class="form-horizontal" method="POST" action="{{route('updateFile')}}" 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">
                                                        <label for="term">Consignee Name:</label>
                                                        <div class="">
                                                            <select class="form-control" name="cosignee_id" id="consignee_id">
                                                                <option value="">Select Consignee</option>

                                                                    @foreach($users as $Key =>$s)
                                                                    <option value="{{ $s->cosignee_id }}">{{ $s->consignee_name }}</option>
                                                                    @endforeach
                                                            </select>
                                                        </div>      
                                                    </div>
                                                    
                                                    <div class="form-group{{($errors->has('file_number')? 'has-error': '')}}">
                                                        <label>File Number:</label>
                                                        <input type="text" class="form-control" name="file_number" id="file_number" placeholder="File Number" value="{{$file->file_number}}">

                                                        <span class="text-danger">{{$errors->first('file_number')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('invoice_number')? 'has-error': '')}}">
                            
                                                        <label for="invoice_number">Invoice Number:</label>
                                                        <input type="text" class="form-control" name="invoice_number" id="invoice_number" value="{{$file->invoice_number}}" placeholder="Invoice Number" required="">

                                                        <span class="text-danger">{{$errors->first('invoice_number')}}</span>
                                    
                                                    </div>

                                                    <div class="form-group{{($errors->has('bill_of_lading')? 'has-error': '')}}">
                                                        <label>Bill Lading:</label>
                                                        <input type="text" class="form-control" name="bill_of_lading" id="bill_of_lading" placeholder="Bill Lading" value="{{$file->bill_of_lading}}">

                                                        <span class="text-danger">{{$errors->first('bill_of_lading')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('mf')? 'has-error': '')}}">
                                                        <label>Form M:</label>
                                                        <input type="text" class="form-control" name="mf" id="mf" placeholder="MF" value="{{$file->mf}}">

                                                        <span class="text-danger">{{$errors->first('mf')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('date_allocated')? 'has-error': '')}}">
                                                        <label>File Date:</label>
                                                        <input type="date" class="form-control" name="date_allocated" id="date_allocated" placeholder="File Date" value="{{$file->date_allocated}}">

                                                        <span class="text-danger">{{$errors->first('date_allocated')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('commodity')? 'has-error': '')}}">
                                                        <label>Commodity:</label>
                                                        <input type="text" class="form-control" name="commodity" id="commodity" placeholder="Commodity" value="{{$file->commodity}}">

                                                        <span class="text-danger">{{$errors->first('commodity')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('twenty_ft')? 'has-error': '')}}">
                                                        <label>20FT:</label>
                                                        <input type="text" class="form-control" name="twenty_ft" id="twenty_ft" placeholder="Number of Unit" value="{{$file->twenty_ft}}">

                                                        <span class="text-danger">{{$errors->first('twenty_ft')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('fourty_ft')? 'has-error': '')}}">
                                                        <label>40FT:</label>
                                                        <input type="text" class="form-control" name="fourty_ft" id="fourty_ft" placeholder="Number of Unit" value="{{$file->fourty_ft}}">

                                                        <span class="text-danger">{{$errors->first('fourty_ft')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('other_size')? 'has-error': '')}}">
                                                        <label>Other Size:</label>
                                                        <input type="text" class="form-control" name="other_size" id="other_size" placeholder="Other Size" value="{{$file->other_size}}">

                                                        <span class="text-danger">{{$errors->first('other_size')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('job_type')? 'has-error': '')}}">
                                                        <label for="job_type">Type of Job:</label>
                                                        <div class="">
                                                            <select class="form-control" name="job_type" id="job_type">
                                                                <option value="">Select Job Type</option>
                                                                <option value="0">Customs Examination</option>
                                                                <option value="1">Fast-Track</option>
                                                            </select>

                                                            <span class="text-danger">{{$errors->first('job_type')}}</span> 
                                                        </div>      
                                                    </div>

                                                    <div class="form-group{{($errors->has('staff_assigned')? 'has-error': '')}}">
                                                        <label>Staff:</label>
                                                        <input type="text" class="form-control" name="staff_assigned" id="staff_assigned" placeholder="Staff" value="{{$file->staff_assigned}}">

                                                        <span class="text-danger">{{$errors->first('staff_assigned')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('shipping_line')? 'has-error': '')}}">
                                                        <label>Shipping Line:</label>
                                                        <input type="text" class="form-control" name="shipping_line" id="shipping_line" placeholder="Shipping Line" value="{{$file->shipping_line}}">

                                                        <span class="text-danger">{{$errors->first('shipping_line')}}</span>           
                                                    </div>

                                                    <div class="form-group{{($errors->has('terminal')? 'has-error': '')}}">
                                                        <label>Terminal:</label>
                                                        <input type="text" class="form-control" name="terminal" id="terminal" placeholder="Shipping Line" value="{{$file->terminal}}">
                                                        <span class="text-danger">{{$errors->first('terminal')}}</span>           
                                                    </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>
                            <!-- End Modal -->

                            <!-- Modal -->

                                            <div id="myModal{{$file->bill_of_lading}}" 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">CLOSE {{ $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="1">
                                                                                <div>
                                                                                    <label class="form-check-label" for="close" style="margin-left: 90px;">
                                                                                        Close 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>
        @endif
    </div>
        
    </div>

</div>

<script>
    var coll = document.getElementsByClassName("collapsible");
    var i;
    for (i = 0; i < coll.length; i++) {
        coll[i].addEventListener("click",
            function() {
                this.classList.toggle("active");
                var content = this.nextElementSibling;
                if (content.style.display === "block") {
                    content.style.display = "none";
                } else {
                    content.style.display = "block";
                }
            });
    }
</script>

@endsection