@extends('layouts.horizontal', ['title' => 'Invoice', 'topbarTitle' => 'View Invoice', 'nonav' => true])
@section('css')
<style>
    .custom-padding{
        padding:0.35rem 0.2rem !important;
    }
</style>
@endsection

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body" >
                <!-- Invoice Logo-->
                <div class="d-flex align-items-start justify-content-between mb-4">
                    <div>
                        <div class="overflow-hidden position-relative d-flex align-items-center justify-content-start px-2" style="height: 72px;">
                            <img id="logo" style="height: 72px;" src="{{ asset('images').'/business/'.$business->business_logo }}" alt="{{ $business->business_name }}">
                        </div>     
                        <div class="mt-2">                            
                            <h6 class="fs-14 mb-0 lh-base font-monospace">{!! $business->business_address  !!} </h6>
                            <h6 class="fs-14 mb-2 font-monospace">Phone:  {{ $business->business_phone1  }} </h6>
                        </div>   
                         <div style="text-align: left;" class="mt-3">
                            <h6 class="fs-14 fw-bolder mb-0 font-monospace">{{$franchise->franchise_name}}</h6>
                            <h6 class="fs-14 mb-0 font-monospace">NTN {{$franchise->franchise_ntn ?? ''}}</h6>
                            @if (!empty($franchise->franchise_email))
                            <h6 class="fs-14 mb-0 font-monospace">{{$franchise->franchise_email}}</h6>
                            @endif
                            @if (!empty($franchise->franchise_office_phone))
                            <h6 class="fs-14 mb-0 font-monospace">{{$franchise->franchise_office_phone}}</h6>
                            @endif
                            <abbr class="fs-14 mb-2 font-monospace">{{$franchise->franchise_address ?? '' }}</abbr>
                         </div>                
                    </div>
                    <div class="text-end">                       
                            <span class="badge bg-danger-subtle text-danger px-1 fs-20 mb-3  font-monospace">invoice_status</span>
                            <h3 class=" m-0 fw-bolder fs-20 font-monospace">Invoice: #{{ $order_detail->invoice_number }}</h3>
                            <div style="text-align: left;" class="mt-3">
                                <h6 style="font-size:14px !important;" class="m-0 fs-20 font-monospace">Order: #{{ $order[0]['franchise_order_id'] }}</h6>
                                <h6 style="font-size:14px !important;" class="m-0 fs-20 font-monospace">Invoice Date: {{$order[0]['formatted_invoice_date']}}</h6>                        
                                <h6 style="font-size:14px !important;" class="m-0 fs-20 font-monospace">Due Date: {{$order[0]['due_date']}}</h6>                        
                                <h6 style="font-size:14px !important;" class="m-0 fs-20 font-monospace">Agent: {{$order_detail->created_by}}</h6>
                            </div>
                    </div>
                </div>

                <div class="mt-4">
                    <div class="table">
                        <table class="table text-left align-middle mb-0 font-monospace table-sm fs-12" style="overflow-x: hidden;">
                            <thead>
                                <tr class="bg-light bg-opacity-50">
                                    <th class="text-start border-0" scope="col" >#</th>
                                    <th class="hidden-xs d-print-none text-start border-0" scope="col" >Brand</th>
                                    <th class="text-start border-0" scope="col" >Item</th>
                                    <th class="hidden-xs d-print-none text-start border-0" scope="col" >Batch</th>
                                    <th class="hidden-xs d-print-none text-start border-0" scope="col" >Sold by</th>
                                    
                                    <th class="text-end border-0" scope="col" >Unit Price</th>
                                    <th class="text-end border-0" scope="col">Qty.</th>
                                    <th class="text-end border-0" scope="col"  >Total Price</th>
                                    <th class="text-end border-0" scope="col">Total Disc</th>
                                    <th class="hidden-xs d-print-none text-end border-0" >Disc(%)</th>
                                    <th class="text-end border-0" scope="col" >Total Price</th>
                                    <th class="text-end border-0" scope="col" >Tax Rate</th>
                                    <th class="hidden-xs d-print-none text-end border-0">Tax Value</th>
                                    <th class="text-end border-0" scope="col">Value Inclusive of Tax</th>
                                </tr>
                            </thead>
                            <tbody>
                                                        </tbody>
                            <tfoot>
                                <tr class="bg-light bg-opacity-50">
                                    <th class="text-start border-0" scope="col" ></th>
                                    <th class="hidden-xs d-print-none text-start border-0" scope="col" ></th>
                                    <th class="text-start border-0" scope="col" ></th>
                                    <th class="hidden-xs d-print-none text-start border-0"></th>
                                    <th class="hidden-xs d-print-none text-start border-0" scope="col" ></th>
                                    
                                    <th class="text-end border-0" scope="col"></th>
                                    <th class="text-end border-0" scope="col">{{number_format($total_qty,2)}}</th>
                                    <th class="text-end border-0" scope="col">{{number_format($subtotal,2)}}</th>
                                    <th class="text-end border-0" scope="col">{{number_format($totalproduct_discount,2)}}</th>
                                    <th class="hidden-xs d-print-none text-end border-0"></th>
                                    <th class="text-end border-0" scope="col">{{number_format($total_price_bf_tax,2)}}</th>
                                    <th class="text-end border-0" scope="col"></th>
                                    <th class="hidden-xs d-print-none text-end border-0">{{number_format($total_tax,2)}}</th>
                                    <th class="text-end border-0" scope="col">{{number_format($total_price_with_tax,2)}}</th>
                               </tr>
                            </tfoot>
                        </table>                   
                    </div>
                    <div>
                        <table class="table table-nowrap align-middle mb-0 ms-auto font-monospace" style="width:335px">
                            <tbody>         
                                <tr>
                                    <td class="fw-bolder custom-padding">SubTotal</td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($subtotal,2)}}</td>
                                </tr>
                                <tr>
                                    <td class="fw-bolder custom-padding">Product Discount</td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($totalproduct_discount,2)}}</td>
                      
                                </tr>
                                @if (isset($order[0]['invoice_discount']) && $order[0]['invoice_discount'] > 0)
                                    <tr>
                                        <td class="fw-bolder custom-padding">Invoice Discount</td>
                                        <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($order[0]['invoice_discount'] ?? 0 ,2)}}</td>
                                   </tr>
                                @endif
                                @if (isset($order[0]['invoice_other_charges']) && $order[0]['invoice_other_charges'] > 0)
                                <tr>
                                    <td class="fw-bolder custom-padding">Other Charges</td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($order[0]['invoice_other_charges'] ?? 0 ,2)}}</td>
                      
                                </tr>
                                @endif
                                <tr>
                                    <td class="fw-bolder custom-padding">Amount Exclusive of Taxes</td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format( ((($order[0]['invoice_other_charges'] ?? 0)+$total_price_bf_tax) - ($order[0]['invoice_discount'] ?? 0) ) ,2)}}</td>
                                </tr>
                                <tr>
                                    <td class="fw-bolder custom-padding">Amount of Product Sales Tax </td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($total_tax ,2)}}</td>
                                </tr>
                                <tr style="border-bottom: 2px dashed #000 !important; ">
                                    <td class="fw-bolder custom-padding">Amount of Sales Taxes {{number_format($order[0]['invoice_sales_tax_perc'] ?? 0 ,2)}}% </td>
                                    <td class="text-end fw-bolder custom-padding">{{config('constants.CURRENCY')}} {{number_format($order[0]['invoice_sales_tax'] ?? 0 ,2)}}</td>
                                </tr>

                                 <tr  class="border-top border-top-dashed fs-16">
                                    <td class="fw-bold custom-padding">Amount Inclusive of Taxes</td>
                                    <td class="fw-bold text-end custom-padding">{{config('constants.CURRENCY')}} {{number_format($order[0]['invoice_total_receivable'] ?? 0 ,2)}}</td>
                                </tr>
                            </tbody>
                        </table>
                        <!--end table-->
                    </div>
                </div>

                <div class="card-body">
                    @if($business->invoice_terms == 'Yes')
                    <div class="bg-body p-2 rounded-2 mt-4 mb-4  font-monospace">
                        <p class="mb-0"><span class="fs-12 fw-bold text-uppercase">Terms : </span>
                        {!!  $business->payment_terms !!}
                        </p>
                    </div>
                    @endif

                <div class="d-print-none mb-5">
                    <div class="d-flex justify-content-center gap-2">
                        @if (isset($order[0]['franchise_order_id']) && $order[0]['franchise_order_id'] > 0 && $order[0]['order_status'] =='Invoiced') 
                        <button class="btn btn-danger" id="cancelInvoiceBtn" onclick="cancelFranchiseOrderInvoice({{ $order[0]['franchise_order_id'] }})" ><iconify-icon icon="solar:trash-bin-trash-bold-duotone"></iconify-icon> Cancel Invoice</button>
                        @endif
                        <a href="javascript:window.print()" class="btn btn-primary"><i class="ti ti-printer me-1"></i> Print</a>
                    </div>
                </div>

                <!-- end link -->
                
            </div>
        </div>
    </div>
</div>

@endsection

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

});    
function cancelFranchiseOrderInvoice(id){
        Swal.fire({
            title: 'Are you sure?',
            text: 'Do you really want to cancel this invoice?',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Yes, Cancel Invoice',
            cancelButtonText: 'No, Close',
            customClass: {
                confirmButton: "btn btn-danger me-2",
                cancelButton: "btn btn-warning"
            },
            buttonsStyling: false,
        }).then((result) => {
            if (result.isConfirmed) {
                sendCancelRequest(id); // no need to pass result.value
            }
        });
    }

    function sendCancelRequest(id) {
        $.ajax({
            url: "{{ route('franchise.cancel_order_invoice') }}",
            type: "POST",
            headers: { "X-CSRF-TOKEN": "{{ csrf_token() }}" },
            data: {
                id_franchise_orders: id
            },
            success: function(response) {
                if (response.success) {
                    toastr.success(response.message);
                    setTimeout(() => {
                        window.location.href = response.franchise_orders_route;                             
                    }, 1000);
                } else {
                    toastr.error(response.message || 'Unable to cancel invoice.');
                }
            },
            error: function() {
                toastr.error('An error occurred while cancelling the invoice.');
            }
        });
    }
</script>
@endsection