@extends('layouts.admin')

@section('title', 'Purchase Order Invoice')

@section('styles')
    <link rel="stylesheet" type="text/css" href="{{asset('assets/css/date-picker.css')}}">
@endsection

@section('breadcrumb-title', 'Invoice')

@section('breadcrumb-item')
    <li class="breadcrumb-item">Purchase Orders</li>
    <li class="breadcrumb-item active">Invoice</li>
@endsection

@section('content')
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-body">
                        <div class="invoice print-card">
                            <div>
                                <div>
                                    <div class="row">
                                        <div class="col-sm-6">
                                            <div class="media">
                                                <div class="media-left"><img class="media-object img-60" src="{{asset('assets/images/logo.png')}}" alt=""></div>
                                                <div class="media-body m-l-20">
                                                    <h4 class="media-heading">{{ config('app.name') }}</h4>
                                                    <p>info@brightvisionhealth.com<br><span class="digits"></span></p>
                                                </div>
                                            </div>
                                            <!-- End Info-->
                                        </div>
                                        <div class="col-sm-6">
                                            <div class="text-md-right">
                                                <h3>Invoice #<span class="digits counter">{{ $purchase_order->id }}</span></h3>
                                                <p>Issued:<span class="digits">{{ $purchase_order->date }}</span></p>
                                            </div>
                                            <!-- End Title-->
                                        </div>
                                    </div>
                                </div>
                                <hr>
                                <div>
                                    <div class="table-responsive invoice-table" id="table">
                                        <table class="table table-bordered table-striped">
                                            <thead>
                                                <tr>
                                                <td class="item">
                                                    <h6 class="p-2 mb-0">Item Description</h6>
                                                </td>
                                                <td class="Hours">
                                                    <h6 class="p-2 mb-0">Quantity</h6>
                                                </td>
                                                <td class="Rate">
                                                    <h6 class="p-2 mb-0">Unit Price</h6>
                                                </td>
                                                <td class="subtotal">
                                                    <h6 class="p-2 mb-0">Sub-total</h6>
                                                </td>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @php
                                                $groupedProducts = [];
                                                foreach ($purchase_order->products as $product) {
                                                    $name = $product->name;
                                                    if (!isset($groupedProducts[$name])) {
                                                        $groupedProducts[$name] = [
                                                            'description' => $product->description,
                                                            'quantity' => 0,
                                                            'unit_price' => $product->pivot->unit_price,
                                                            'sub_total' => 0
                                                        ];
                                                    }
                                                    $groupedProducts[$name]['quantity'] += $product->pivot->quantity;
                                                    $groupedProducts[$name]['sub_total'] += $product->pivot->quantity * $product->pivot->unit_price;
                                                }
                                            @endphp

                                            @foreach($groupedProducts as $name => $details)
                                            <tr>
                                                <td>
                                                    <label>{{ $name }}</label>
                                                    <p class="m-0">{{ $details['description'] }}</p>
                                                </td>
                                                <td>
                                                    <p class="digits">{{ $details['quantity'] }}</p>
                                                </td>
                                                <td>
                                                    <p class="digits">{{ $details['unit_price'] }}</p>
                                                </td>
                                                <td>
                                                    <p class="digits">{{ $details['sub_total'] }}</p>
                                                </td>
                                            </tr>
                                            @endforeach
                                            <tr>
                                                <td class="text-right" colspan="3"><strong>Total Amount</strong></td>
                                                <td><strong>{{ $purchase_order->total }}</strong></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right" colspan="3"><strong>Paid Amount</strong></td>
                                                <td><strong>{{ $purchase_order->paid_amount }}</strong></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right" colspan="3"><strong>Balance</strong></td>
                                                <td><strong>{{ $purchase_order->balance }}</strong></td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <!-- End Table-->
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div>
                                                <p class="legal"><strong>Thank you for your business!</strong>  Payment is expected within 31 days; please process this invoice within that time.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- End InvoiceBot-->
                            </div>
                            <!-- End Invoice-->
                            <!-- End Invoice Holder-->
                        </div>
                        <div class="col-sm-12 text-center mt-3">
                            <button class="btn btn btn-primary mr-2 print-stock" type="button">Print</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-header">
                        <h5>Make Payment</h5>
                    </div>
                    <div class="card-body">
                        <form class="needs-validation" method="POST" action="{{ route('admin.purchase_orders.pay', ['purchase_order' => $purchase_order->id]) }}">
                            @csrf
                            <div class="form-row">
                                <div class="col-md-4 mb-3">
                                    <label class="hide-tmp" for="method">Payment Method</label>
                                    <select class="form-control {{ $errors->has('method') ? ' is-invalid' : '' }} digits" id="method" name="method">
                                        <option value="">Select Payment Method</option>
                                        @foreach(_payment_methods() as $key => $method)
                                            <option value="{{ $key }}"  {{ old('method') == $key ? 'selected' : '' }}>
                                                {{ $method }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @include('includes.partials.error', ['field' => 'method'])
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label class="hide-tmp" for="amount">Amount</label>
                                    <input class="form-control {{ $errors->has('amount') ? ' is-invalid' : '' }}"
                                           value="{{ old('amount', $purchase_order->total) }}"
                                           name="amount" id="amount" type="text" placeholder="Amount">
                                    @include('includes.partials.error', ['field' => 'amount'])
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label class="hide-tmp" for="date">Date</label>
                                    <input class="datepicker-here form-control {{ $errors->has('date') ? ' is-invalid' : '' }}"
                                           value="{{ old('date', date('Y-m-d')) }}"
                                           type="text" data-language="en" id="date" name="date" placeholder="Date" autocomplete="off">
                                    @include('includes.partials.error', ['field' => 'date'])
                                </div>
                            </div>
                            <br>
                            <button class="btn btn-primary pull-right" type="submit">Pay</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script src="{{asset('assets/js/counter/jquery.waypoints.min.js')}}"></script>
    <script src="{{asset('assets/js/counter/jquery.counterup.min.js')}}"></script>
    <script src="{{asset('assets/js/counter/counter-custom.js')}}"></script>
    <script>
         $(document).on('click', '.print-stock', function() {
            let printContents = document.querySelector('.print-card').innerHTML;
            let originalContents = document.body.innerHTML;
            document.body.innerHTML = printContents;
            window.print();
            document.body.innerHTML = originalContents;
            location.reload();
        });
    </script>
    <script src="{{asset('assets/js/datepicker/date-picker/datepicker.js')}}"></script>
    <script src="{{asset('assets/js/datepicker/date-picker/datepicker.en.js')}}"></script>
    <script src="{{asset('js/datepicker.custom.js')}}"></script>
@endsection