@extends('adminlte::page')


@section('content')
<div class="col-12 ">
    <div class="card">
        <div class="card-header">

            <h3 class="card-title"><b>Fuel Cost </b> </h3>
        </div>
        <!-- /.card-header -->
        <div class="card-body">
            <button type="button" class="btn btn-sm btn-success" data-toggle="modal" data-target="#create-cost" style="float: left;padding: 5px 10px;">
                <i class="fa fa-plus"></i> Create
            </button>

            <table class="table datatables table-bordered table-striped">
                <thead style="text-align: center">
                    <tr>
                        <th style="width: 150px;vertical-align:middle;" rowspan="2">Date</th>
                        <th colspan="2">Total</th>
                        @foreach($brokers as $broker)
                            <th colspan="2">{{$broker['name']}}</th>
                        @endforeach
                        <th style="width: 150px;vertical-align:middle;" rowspan="2">Note</th>
                        <th style="width: 20px;vertical-align:middle;" rowspan="2"><i class="fa fa-edit"></i></th>
                    </tr>
                    <tr style="text-align: center">
                        <td>US</td>
                        <td>CAN</td>
                        @foreach($brokers as $broker)
                            <td>US</td>
                            <td>CAN</td>
                        @endforeach
                    </tr>
                </thead>
                <tbody>
                        <tr class="no-sort">
                            <td><b>Total Costs:</b></td>
                            <td class="text-right"><b>@if(isset($costs['totals']['total_usd'])) {{number_format($costs['totals']['total_usd'],2)}}  @else {{'0.00'}} @endif</b></td>
                            <td class="text-right"><b>@if(isset($costs['totals']['total_can'])) {{number_format($costs['totals']['total_can'],2)}}  @else {{'0.00'}} @endif</b></td>
                            @foreach($brokers as $broker)
                                <td class="text-right"><b>@if(isset($costs['totals'][$broker['id']]['usd'])) {{number_format($costs['totals'][$broker['id']]['usd'],2)}} @else {{'0.00'}} @endif</b></td>
                                <td class="text-right"><b>@if(isset($costs['totals'][$broker['id']]['can'])) {{number_format($costs['totals'][$broker['id']]['can'],2)}} @else {{'0.00'}} @endif</b></td>
                            @endforeach
                            <td class="text-right"></td>
                            <td class="text-right"></td>
                        </tr>
                     @foreach($costs as $cost_id => $cost)
                        @if(is_numeric($cost_id))
                            <tr>
                                <td>{{$cost['date']}}</td>
                                <td class="text-right">{{number_format($cost['total_usd'],2)}}</td>
                                <td class="text-right">{{number_format($cost['total_can'],2)}}</td>
                                @foreach($brokers as $broker)
                                    <td class="text-right">@if(isset($cost['brokers'][$broker['id']]['usd'])) {{number_format($cost['brokers'][$broker['id']]['usd'],2)}} @else {{'0.00'}} @endif</td>
                                    <td class="text-right">@if(isset($cost['brokers'][$broker['id']]['can'])) {{number_format($cost['brokers'][$broker['id']]['can'],2)}} @else {{'0.00'}} @endif</td>
                                @endforeach

                                <td>{{$cost['note']}}</td>

                                <td>
                                    <a href="/brokers-fuel-cost/{{$cost['cost_id']}}/edit" class="btn btn-warning"><i class="fa fa-edit"></i></a>
                                    <!--<form action="brokers-fuel-cost/{{$cost['cost_id']}}/destroy" method="POST">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" onclick="return confirm('Are you sure?')" class="btn btn-danger"><i class="fa fa-trash"></i></button>
                                    </form>-->
                                </td>
                            </tr>
                        @endif
                     @endforeach
                </tbody>
            </table>


        </div>
        <!-- /.card-body -->
    </div>
</div>

<div class="modal fade" id="create-cost">
    <div class="modal-dialog">
        <div class="modal-content">
            <form action="/brokers-fuel-cost" method="post" id="create-cost">
                @csrf
                <div class="modal-header">
                    <h4 class="modal-title">Add Fuel Cost</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">x</span>
                    </button>
                </div>
                <div class="modal-body">
                    @foreach($brokers as $broker)
                        <div class="row" style="margin-bottom:10px;">
                            <div class="col-lg-4">
                                <b>{{$broker['name']}}:</b>
                            </div>
                            <div class="col-lg-4">
                                <label style="float:left;">USD</label>
                                <input type="text" name="data[{{$broker['id']}}][usd]" class="form-control" style="width: 100px;float:left;margin-left:3px;" />
                            </div>
                            <div class="col-lg-4">
                                <label style="float:left;">CAN</label>
                                <input type="text" name="data[{{$broker['id']}}][can]" class="form-control" style="width: 100px;float:left;margin-left:3px;" />
                            </div>
                        </div>
                    @endforeach
                    <div class="row" style="margin-bottom:10px;">
                        <div class="col-lg-12">
                            <label style="float:left;">Note: </label>
                            <textarea name="note" id="" cols="60" rows="4"></textarea>
                        </div>
                    </div>
                    <input type="submit" class="btn btn-success" value="Save"/>
                </div>
            </form>
        </div>
    </div>
</div>

@stop
@section('css')
<link rel="stylesheet" href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<style>
.row {
    width:100% !important;
}
@media (max-width: 768px) { /* use the max to specify at each container level */
    .tdBigCell {
        width:360px;  /* adjust to desired wrapping */
        display:table;
        white-space: pre-wrap; /* css-3 */
        white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        word-wrap: break-word; /* Internet Explorer 5.5+ */
    }
}
</style>
@stop

@section('js')
<script>
    $(document).ready(function() {

        var $tr = $('.datatables tr.no-sort'); //get the reference of row with the class no-sort
        var mySpecialRow = $tr.prop('outerHTML'); //get html code of tr
        $tr.remove(); //remove row of table

        $(".datatables").DataTable({
            "fnDrawCallback": function(){
                //add the row with 'prepend' method: in the first children of TBODY
                $('.datatables tbody').prepend(mySpecialRow);

            },
            "bAutoWidth": false,
            "paging": false,
            "searching": false,
            "bInfo": false,
            "order": [
                [1, 'asc']
            ]

        });
    });
</script>

@stop