@extends('admin.master')
@section('title') Invoice | SHOP @endsection
@section('get-shop-due-payment-invoice') active @endsection
@section('get-shop-due-payment-invoice') active @endsection
@section('styles')
@endsection


@section('main_content_section')

<div class="row min-vh-100">
    <!-- all content will be here. start -->

    <div class="row invoice p-0 m-0">
        <div class="col-md-9 p-0 m-0">
            <div class="shadow rounded m-3">

                @php
                ///To get logo...
                $softLogo = App\Models\InvoiceLogo::getSoftwareInvoiceLogo();
                @endphp
                <div class="d-md-flex justify-content-between custom-billing-invoice-header">
                    <div class="custom-invoice-logo-section">
                        <div class="d-flex align-items-center  custom-billing-invoice-logo">
                            @if(isset($softLogo) && $softLogo->logo_image != null)
                            <img src="{{ asset('backend/uploads/invoiceLogoImg/'.$softLogo->logo_image) }}" alt="logo">
                            @else
                            <img src="{{asset('backend')}}/billing_invoice_logo.png" alt="logo">
                            @endif
                        </div>
                    </div>
                    <div class="custom-issue-due-date-section">

                        <div class="d-flex align-items-center gap-2">
                            <div class="d-flex flex-column justify-content-end custom-issue-due-date-text-area gap-2">
                                <p class="">Payment Id: </p>
                                <p class="">Date: </p>
                                <p class="">Reciever: </p>
                            </div>

                            <div class="d-flex flex-column gap-2 custom-billing-invoice-header-right">
                                <input type="text" name="invoice_id"
                                    class="form-control custom-cursor-pointer custom-readonly-bg-color"
                                    value="#{{$singleShopPD->id}}" readonly>
                                <input type="text"
                                    class=" form-control custom-readonly-bg-color flatpickr-basic custom-date-picker"
                                    name="date_issue" id="date_issue" placeholder="DD-MM-YYYY"
                                    value="{{Carbon\Carbon::parse($singleShopPD->paid_date)->format('d-m-Y')}}"
                                    readonly>
                                <input type="text"
                                    class="form-control custom-readonly-bg-color flatpickr-basic custom-date-picker"
                                    value="{{Str::title(Auth::user()->name)}}" readonly>
                            </div>
                        </div>

                    </div>
                </div>

                <hr>

                <div class="row px-4">
                    <div class="col-12">
                        <div class="table-responsive">
                            <h5>Reference Invoice <span class="text-muted">(Before Payment)</span></h5>
                            <table class="table table-bordered py-3">
                                <!-- <hr class="mb-1"> -->
                                <thead>
                                    <tr>
                                        <th class="text-center" scope="col"><span>Invoice</span></th>
                                        <th class="text-center" scope="col"><span>Net Amount</span></th>
                                        <th class="text-center" scope="col"><span>Paid Amount</span></th>
                                        <th class="text-center" scope="col"><span>Due Amount</span></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr class="">
                                        <td class="text-center">
                                            <div class="row_title">
                                                <b>#{{$unpaidBillingData['id']}}</b>
                                            </div>
                                            <div class="row-actions mt-2">
                                            </div>
                                        </td>

                                        <td class="text-center">
                                            <span class="fw-bolder text-info">{{ $unpaidBillingData['net_amount'] }}tk</span>
                                        </td>
                                        <td class="text-center">
                                            <span class="fw-bolder text-success">{{ $unpaidBillingData['paid_amount'] }}tk</span>
                                        </td>
                                        <td class="text-center">
                                            <span class="fw-bolder text-danger">{{ $unpaidBillingData['due_amount'] }}tk</span>
                                        </td>
                                    </tr>
                                </tbody>

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

                <hr>

                <div class="row px-4">
                    <div class="col-12">
                        <div class="table-responsive">
                            <h5>After Payment</h5>
                            <table class="table table-bordered py-3">
                                <!-- <hr class="mb-1"> -->
                                <thead>
                                    <tr>
                                        <th scope="col" class="text-center"> Invoice </th>
                                        <th scope="col" class="text-center"> Due Amount(tk) </th>
                                        <th scope="col" class="text-center"> Paid Amount(tk) </th>
                                        <th scope="col" class="text-center"> Current Due(tk) </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td class="text-center">
                                            <b>#{{$unpaidBillingData['id']}}</b>
                                        </td>
                                        <td class="text-center">
                                            <span class="text-danger fw-bolder">{{$referenceDueAmount}}tk</span>
                                        </td>
                                        <td class="text-center">
                                            <span class="text-success fw-bolder">{{$singleShopPD->paid_amount}}tk</span>
                                        </td>
                                        <td class="text-center">
                                            <span
                                                class="text-info fw-bolder">{{$referenceDueAmount - $singleShopPD->paid_amount}}tk</span>
                                        </td>
                                    </tr>
                                </tbody>

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

                <hr>

                <div class="custom-invoice-common-padding pb-5">
                    <div class="row">
                        <div class="col-md-6">
                            <span class="custom-text-justify">

                                <p class="mb-1">
                                    @if($softLogo != null)
                                    {!! $softLogo->invoice_terms !!}
                                    @else
                                    @endif
                                </p>
                            </span>
                        </div>
                        <div class="col-md-6">
                            <div class="w-100 d-flex gap-2">
                                <div class="text-end w-50 custom-footer-right-text-block">
                                    <p>Previous Due:</p>
                                    <p>Paid Amount:</p>
                                    <p>Remaining Due:</p>
                                </div>
                                <div class="d-flex flex-column gap-2 w-50">
                                    <input type="text" name="sub_total_quantity" id="sub_total_quantity"
                                        class="form-control custom-cursor-pointer custom-readonly-bg-color"
                                        value="{{ $subTotalDueAmount > 0 ? $subTotalDueAmount : 0}}" readonly>
                                    <input type="text" name="sub_total_price" id="sub_total_price"
                                        class="form-control custom-cursor-pointer custom-readonly-bg-color"
                                        value="{{ $subTotalPaidAmount > 0 ? $subTotalPaidAmount : 0.00}}" readonly>
                                    <input type="text" name="sub_total_discount" id="sub_total_discount"
                                        class="form-control custom-cursor-pointer custom-readonly-bg-color"
                                        value="{{ $subaTotalCurrentDueAmount > 0 ? $subaTotalCurrentDueAmount : 0.00}}"
                                        readonly>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <div class="col-md-3 p-0 m-0">
            <div class="row p-3">
                <div class="col-12 mb-4">
                    <div class="">
                        <div class="card card-stats">
                            <div class="card-header custom-payment-section-header">
                                <div class="icon icon-warning d-flex">
                                    <span class="material-symbols-outlined">equalizer</span>
                                    <p class="category custom-card-header-title custom-payment-section-heading-title">
                                        <strong>Payment Status</strong>
                                    </p>
                                </div>
                            </div>
                            <div class="card-footer p-0 dashboard-card-footer text-center custom-invoice-card-status">
                                <div class="stats">
                                    <div class="row">
                                        <div class="col-12">
                                            <i class="material-symbols-outlined">check_circle</i><br>
                                            <span>Completed</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-12 mb-4">
                    <div class="">
                        <div class="card card-stats">
                            <div class="card-header custom-payment-section-header">
                                <div class="icon icon-warning d-flex">
                                    <span class="material-symbols-outlined">equalizer</span>
                                    <p class="category custom-card-header-title custom-payment-section-heading-title">
                                        <strong>Payment Options</strong>
                                    </p>
                                </div>
                            </div>
                            <div class="card-footer p-0 dashboard-card-footer">
                                <div class="stats">
                                    <div class="row">
                                        <a href="{{route('print-shop-due-payment-invoice', $singleShopPD->id)}}"
                                            class="text-white btn" target="_blank">
                                            <div class="col-12 invoice-print-button text-center py-2">
                                                <i class="material-symbols-outlined custom-bill-pay-icon">print</i>Print
                                            </div>
                                        </a>

                                        <a href="{{route('download-shop-due-payment-invoice', $singleShopPD->id)}}" class="text-white btn" target="_download">
                                            <div class="col-12 invoice-download-button text-center py-2">
                                                <i class="material-symbols-outlined custom-bill-pay-icon">visibility</i>View
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-12 mb-4">
                    <div class="">
                        <div class="card card-stats">
                            <div class="card-header custom-payment-section-header">
                                <div class="icon icon-warning d-flex">
                                    <span class="material-symbols-outlined">equalizer</span>
                                    <p class="category custom-card-header-title custom-payment-section-heading-title">
                                        <strong>Payment Notes</strong>
                                    </p>
                                </div>
                            </div>
                            <div class="card-footer p-0 dashboard-card-footer text-center custom-invoice-card-status">
                                <div class="stats">
                                    <div class="row">
                                        <div class="col-12">
                                            <p class="mb-0">{{$singleShopPD->payment_note}}</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
    </div>
    <!-- all content will be here. end -->
</div>

@endsection

@section('scripts')
<script>
</script>
@endsection