@extends('master')
@section('title')
    Invoice Report
@endsection
@section('content')
    <div class="container-fluid pt-4 px-4" style="">

        <div class="row g-2 bg-light">
            <div class="col-lg-11">
                <div class="bg-light rounded px-2 pt-2" style="padding-bottom:0px;">
                    <form action="{{ route('InvoiceReport.index') }}" method="GET">
                        <div class="row">
                            <div class="col-lg-3">
                                <label for="exampleInputEmail1" class="form-label">Agent:</label>
                                <select name="agent_id" class="form-control select2-show-search" style="width:100%"
                                    data-placeholder="Choose one">
                                    <option value="">Select Agent</option>
                                    @foreach ($agent as $item)
                                        <option {{ $agent_id == $item->agent_id ? 'selected' : '' }}
                                            value="{{ $item->agent_id }}">{{ $item->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-lg-3">
                                <label for="exampleInputEmail1" class="form-label">Form:</label>
                                <input type="date" class="form-control" name="form_date" value="{{ $form_date }}"
                                    placeholder="Enter Service">

                            </div>

                            <div class="col-lg-3">
                                <label for="exampleInputEmail1" class="form-label">To:</label>
                                <input type="date" class="form-control" name="todate" value="{{ $todate }}"
                                    placeholder="Enter Service">
                            </div>
                            <div class="col-lg-3">
                                <label for="exampleInputEmail1" class="form-label d-block"></label>
                                <button type="submit" class="btn btn-primary mt-4">Load</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="col-lg-1">
                <div class="bg-light rounded px-2 pt-2" style="padding-bottom:0px;">
                    <form action="">
                        <div class="d-flex gap-2 align-items-center">

                            <select name="origin" class="form-control d-none select2-show-search" style="width:100%"
                                data-placeholder="Choose one">
                                <option value="">Select Origin</option>


                            </select>

                            <input type="hidden" class="form-control" name="service" placeholder="Enter Service">


                            <input type="hidden" class="form-control" name="service" placeholder="Enter Service">

                            <button type="submit" class="btn btn-secondary"><i class="fa fa-print"></i></button>

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

        <div class="row g-4">

            @if (Session::has('success'))
                <div class="col-lg-5">
                    <div class="alert alert-success" role="alert">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                        <i class="fa fa-check-circle-o mr-2" aria-hidden="true"></i> {{ Session::get('success') }}
                    </div>
                </div>
            @elseif (Session::has('danger'))
                <div class="col-lg-5">
                    <div class="alert alert-danger" role="alert">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                        <i class="fa fa-check-circle-o mr-2" aria-hidden="true"></i> {{ Session::get('danger') }}
                    </div>
                </div>
            @endif

            <div class="col-12">
                <form action="{{ route('InvoiceReport.store') }}" method="POST">
                    @csrf

                    <input type="hidden" name="agent_id" value="{{ $agent_id }}" />
                    <input type="hidden" name="fromdate" value="2" />
                    <input type="hidden" name="todate" value="3" />
                    <div class="bg-light rounded h-100  pl-0">


                        <div class="d-flex justify-content-between align-items-center mb-4">
                            <h6></h6>

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

                        </div>

                        <div class="table-responsive" style="min-height: 75vh;">
                            <table id="example" class="table table-bordered" style="width:100%;">
                                <thead>
                                    <tr>
                                        <th><input type="checkbox" class="selectall" /></th>
                                        <th>Track No</th>
                                        <th>Origin</th>
                                        <th>Destination</th>
                                        <th>Shiper</th>
                                        <th>Consignee</th>
                                        <th>Weight(KG)</th>
                                        <th>Charge</th>
                                        <th>Collect</th>
                                        <th>Charge Amount</th>

                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($booking as $data)
                                        <tr>
                                            <td style="text-align: center; vertical-align: top;"><input type="checkbox"
                                                    class="select_id" value="{{ $data->booking_no }}"
                                                    name="booking_no[]" />
                                            </td>
                                            <td>{{ $data->booking_no }}</td>
                                            <td>{{ $data->origins->name ?? '' }}</td>
                                            <td>{{ $data->destinations->name ?? '' }}</td>
                                            <td>{{ $data->shipper }}</td>
                                            <td>{{ $data->consignee }}</td>
                                            <td>{{ $data->weights->weight ?? '' }}</td>
                                            <td>{{ $data->charge }}</td>
                                            <input type="hidden" name="charge[]" value="{{ $data->charge }}">
                                            <td>{{ $data->collect_amount }}</td>
                                            <input type="hidden" name="collect_amount[]"
                                                value="{{ $data->collect_amount }}">
                                            <td><input type="text" class="form-control" name="charge_amount[]"
                                                    placeholder="Charge Amount">
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="7" style="text-align:right;">Total : &nbsp;</td>
                                        <td> &nbsp;&nbsp; {{ $total_charge }}</td>
                                        <td> &nbsp;&nbsp; {{ $total_collect }}</td>
                                        <td></td>

                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </form>
            </div>
        </div>


    </div>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script>
        // $(document).ready(function() {
        //     new DataTable('#example', {
        //         fixedHeader: false,
        //     });
        // });
    </script>
    <script>
        $(document).ready(function() {




            $(".selectall").click(function() {

                var checked = this.checked;
                if (checked == true) {
                    $('.select_id').prop('checked', true);

                } else {
                    $('.select_id').prop('checked', false);

                }
            });
        });
    </script>
@endsection