@extends('admin.layout.master')

    @section('content')
    <style>
        select2-container--default {
            min-height: 104px !important;
    }
    .table-container {
        overflow: auto; height: 400px;
    }
    .products-datatable > tbody > tr > td.PIN { width: 70px !important; }
    .products-datatable > tbody > tr > td.BaseSKU { width: 70px !important; }
    .products-datatable > tbody > tr > td.Manufacturer { width: 70px !important; }
    .products-datatable > tbody > tr > td.Name { min-width: 260px !important; }
    .no-sort::after { display: none!important; }
    .no-sort::before { display: none!important; }

    </style>
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-6">
                    <h1 class="m-0">Product Details</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="#">Home</a></li>
                        <li class="breadcrumb-item active">Product Details</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            @foreach (['danger', 'warning', 'success', 'info'] as $msg)
            @if(Session::has('alert-' . $msg))

            <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}
                <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
            </p>
            @endif
        @endforeach

            <div class="card">
                <div class="card-body">
                    <form action="{{ route('admin.product-details') }}" id="frm_search" method="get">
                        <div class="row mb-2">

                            <div class="col-2">
                                <label for="form-label">Product Code</label>
                                <input type="text" name="productcode" id="productcode" value="{{ $productcode }}" class="form-control" placeholder="Search Product Code">
                            </div>
                            <div class="col-0.5" style="text-align: center;margin-top: 36px">
                                <b style="margin: auto;">OR</b>
                            </div>
                            <div class="col-2">
                                <label for="form-label">Order ID</label>
                                <input type="text" name="orderid" id="orderid" value="{{ $orderid }}" class="form-control" placeholder="Search Order ID">
                            </div>

                            <div class="col-2">
                                <button class="btn btn-success " type="submit" style="margin-top: 30px !important;">Search</button>
                                <a class="btn btn-warning" href="{{ route('admin.product-details') }}" style="margin-top: 30px !important;">Reset</a>
                            </div>

                        </div>
                    </form>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="card">
                        <div class="card-body">
                            <h5>Product Code Parents/Children</h5>
                            <div class="table-responsive ">
                                <table class="table table-bordered products-datatable">
                                    <thead class="thead-dark">
                                        <tr>

                                            <th>ProductCode</th>
                                            <th>Parent</th>
                                            {{--  <th>TimeCreated</th>
                                            <th>TimeModified</th>  --}}
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if(!empty($clientMap))
                                            @foreach ($clientMap as $c)
                                                <tr @if(empty($c->Parent)) style="background: #b6b6b6;" @endif>

                                                    <td>{{ $c->ProductCode }}</td>
                                                    <td>{{ $c->Parent }}</td>
                                                    {{--  <td>{{ date('n/d/Y g:i A',strtotime($c->TimeCreated)) }}</td>
                                                    <td>{{ date('n/d/Y g:i A',strtotime($c->TimeModified)) }}</td>  --}}
                                                </tr>
                                            @endforeach
                                        @else
                                            <tr>
                                                <td colspan="5" align="center">No data available in table</td>
                                            </tr>
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-body">
                            <h5>Product Details</h5>
                            <div class="table-responsive ">
                                <table class="table table-bordered products-datatable">
                                    <thead class="thead-dark">
                                        <tr>
                                            <th>PIN</th>
                                            <th>SKU</th>
                                            <th>Name</th>
                                            <th>Cost</th>
                                            <th>SalePrice</th>
                                            <th>DaysToShip</th>

                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if(!empty($clientMap))
                                            @php $pins = []; @endphp
                                            @foreach ($clientMap as $c)

                                                @if(!in_array($c->PIN,$pins))
                                                @php $pins[] = $c->PIN; @endphp
                                                <tr>
                                                    <td>{{ $c->PIN }}</td>
                                                    <td>{{ $c->SKU }}</td>
                                                    <td>{{ $c->Name }}</td>
                                                    <td>{{ $c->Cost }}</td>
                                                    <td>{{ $c->SalePrice }}</td>
                                                    <td>{{ $c->DaysToShip }}</td>
                                                </tr>
                                                @endif
                                            @endforeach
                                        @else
                                            <tr>
                                                <td colspan="6" align="center">No data available in table</td>
                                            </tr>
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-body">
                            <h5>Product Vendor Details</h5>
                            <div class="table-responsive ">
                                <table class="table table-bordered products-datatable">
                                    <thead class="thead-dark">
                                        <tr>

                                            <th>VendorCode</th>
                                            <th>MFG_SKU</th>
                                            <th>Stock</th>
                                            <th>Allocated</th>
                                            <th>Cost</th>
                                            <th>SalePrice</th>
                                            <th>Weight</th>
                                            <th>DaysToShip</th>


                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if(!empty($vendorMap))
                                            @foreach ($vendorMap as $v)

                                                <tr>

                                                    <td>{{ $v->VendorCode }}</td>
                                                    <td>{{ $v->MFG_SKU }}</td>
                                                    <td>{{ $v->Stock }}</td>
                                                    <td>{{ $v->Allocated }}</td>
                                                    <td>{{ $v->Cost }}</td>
                                                    <td>{{ $v->SalePrice }}</td>
                                                    <td>{{ $v->Weight }}</td>
                                                    <td>{{ $v->DaysToShip }}</td>

                                                </tr>
                                            @endforeach
                                        @else
                                            <tr>
                                                <td colspan="9" align="center">No data available in table</td>
                                            </tr>
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>


                </div>

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

                    <div class="card">
                        <div class="card-body">
                            <h5>Product Orders</h5>
                            <div class="table-responsive ">
                                <table class="table table-bordered order-product-code-datatable" >
                                    <thead class="thead-dark">
                                        <tr>
                                            @foreach ($columns_list_header as $c)
                                            <th class="noSearch">{{ $c }}</th>
                                            @endforeach
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div><!-- /.container-fluid -->
    </section>

    <script>

        $(function () {
            var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
            var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
            return new bootstrap.Tooltip(tooltipTriggerEl)
            })


        table = $('.order-product-code-datatable').DataTable({
                searching: true,
                processing: true,
                serverSide: true,
                order: [[0, 'desc']],
                "autoWidth" : false,
                ajax: {
                    url: "{{ route('admin.product-details') }}",
                    type: "get",
                    data: function (data) {
                        delete data.columns;
                        data.productcode = "{{ $productcode }}";
                        data.orderid = "{{ $orderid }}";
                    }
                },
                columns: [{
                            data: null,
                            render: function ( data, type, row ) {

                                return '<a href="order-receipt/'+ data.orderid +'">'+ data.orderid +'</a>';
                            },
                            orderable: false
                        },
                                                ],
                "columnDefs": [ {
                            "targets": 0,
                            "orderable": false
                            }, { targets: '_all', width:'30px' } ],


            });

        });
    </script>
    @endsection