@extends('layouts.app')

@section('title', 'Invoice')

@section('content')

<div class="container-fluid">

    {{-- =========================================================
        PAGE HEADER
    ========================================================== --}}

    <div class="row">
        <div class="col-lg-12">

            <div class="card card-block card-stretch card-height">

                <div class="card-body">

                    <div class="d-flex justify-content-between align-items-start flex-wrap">

                        <div>
                            <h3 class="mb-2">
                                Invoice
                            </h3>

                            <p class="mb-0 text-muted">
                                Stationery Distribution Order
                            </p>
                        </div>

                        <div class="text-right">

                            <h4 class="mb-1">
                                {{ $invoice->invoice_number }}
                            </h4>

                            <small class="text-muted">
                                Generated:
                                {{ \Carbon\Carbon::parse($invoice->generated_at)->format('d M Y, h:i A') }}
                            </small>

                        </div>

                    </div>

                </div>

            </div>

        </div>
    </div>


    {{-- =========================================================
        INVOICE
    ========================================================== --}}

    <div class="row">

        <div class="col-lg-12">

            <div class="card card-block card-stretch card-height">

                <div class="card-body">

                    {{-- =================================================
                        BUSINESS HEADER
                    ================================================== --}}

                    <div class="row mb-4">

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

                            <h2 class="mb-1">
                                Z&T Stationery
                            </h2>

                            <p class="mb-0 text-muted">
                                Stationery Distribution System
                            </p>

                        </div>


                        <div class="col-md-6 text-md-right mt-3 mt-md-0">

                            <h5 class="mb-1">
                                INVOICE
                            </h5>

                            <p class="mb-1">
                                <strong>Invoice No:</strong>
                                {{ $invoice->invoice_number }}
                            </p>

                            <p class="mb-0">
                                <strong>Date:</strong>
                                {{ \Carbon\Carbon::parse($invoice->generated_at)->format('d M Y') }}
                            </p>

                        </div>

                    </div>


                    <hr>


                    {{-- =================================================
                        CUSTOMER + ORDER INFORMATION
                    ================================================== --}}

                    <div class="row mt-4 mb-4">

                        {{-- CUSTOMER --}}

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

                            <h5 class="mb-3">
                                Customer Information
                            </h5>

                            <p class="mb-1">

                                <strong>Name:</strong>

                                {{ $invoice->order->customer->customer_name ?? 'N/A' }}

                            </p>


                            <p class="mb-1">

                                <strong>Shop:</strong>

                                {{ $invoice->order->customer->shop_name ?? 'N/A' }}

                            </p>


                            <p class="mb-1">

                                <strong>Phone:</strong>

                                {{ $invoice->order->customer->customer_phonenum ?? 'N/A' }}

                            </p>


                            <p class="mb-0">

                                <strong>Area:</strong>

                                @if($invoice->order->customer->area)

                                    {{ $invoice->order->customer->area->area_name ?? 'N/A' }}

                                @else

                                    N/A

                                @endif

                            </p>

                        </div>


                        {{-- ORDER INFORMATION --}}

                        <div class="col-md-6 mt-4 mt-md-0">

                            <h5 class="mb-3">
                                Order Information
                            </h5>


                            <p class="mb-1">

                                <strong>Order No:</strong>

                                {{ $invoice->order->serial_number }}

                            </p>


                            <p class="mb-1">

                                <strong>Status:</strong>

                                {{ $invoice->order->status->status_name ?? 'N/A' }}

                            </p>


                            <p class="mb-1">

                                <strong>Taken By:</strong>

                                {{ $invoice->order->takenBy->user_name ?? 'N/A' }}

                            </p>


                            <p class="mb-0">

                                <strong>Order Date:</strong>

                                {{ $invoice->order->taken_at
                                    ? \Carbon\Carbon::parse($invoice->order->taken_at)->format('d M Y')
                                    : 'N/A'
                                }}

                            </p>

                        </div>

                    </div>


                    {{-- =================================================
                        ORDER ITEMS
                    ================================================== --}}

                    <div class="table-responsive">

                        <table class="table table-bordered">

                            <thead>

                                <tr>

                                    <th width="50">
                                        #
                                    </th>

                                    <th>
                                        Item Name
                                    </th>

                                    <th>
                                        Item Code
                                    </th>

                                    <th class="text-center">
                                        Quantity
                                    </th>

                                    <th class="text-right">
                                        Unit Price
                                    </th>

                                    <th class="text-right">
                                        Subtotal
                                    </th>

                                </tr>

                            </thead>


                            <tbody>

                                @forelse($items as $index => $item)

                                    <tr>

                                        <td>
                                            {{ $index + 1 }}
                                        </td>


                                        <td>
                                            {{ $item->item_name }}
                                        </td>


                                        <td>
                                            {{ $item->item_code ?? 'N/A' }}
                                        </td>


                                        <td class="text-center">
                                            {{ $item->quantity }}
                                        </td>


                                        <td class="text-right">

                                            Rs.
                                            {{ number_format((float) $item->sale_price, 2) }}

                                        </td>


                                        <td class="text-right">

                                            Rs.
                                            {{ number_format((float) $item->subtotal, 2) }}

                                        </td>

                                    </tr>

                                @empty

                                    <tr>

                                        <td colspan="6" class="text-center">

                                            No items found.

                                        </td>

                                    </tr>

                                @endforelse

                            </tbody>

                        </table>

                    </div>


                    {{-- =================================================
                        TOTAL
                    ================================================== --}}

                    <div class="row mt-4">

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

                            @if($invoice->order->instructions ?? false)

                                <h5>
                                    Instructions
                                </h5>

                                <p class="text-muted">

                                    {{ $invoice->order->instructions }}

                                </p>

                            @endif

                        </div>


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

                            <table class="table table-borderless">

                                <tr>

                                    <td class="text-right">
                                        <strong>Total Amount:</strong>
                                    </td>

                                    <td class="text-right">

                                        <strong>
                                            Rs.
                                            {{ number_format((float) $invoice->order->total_amount, 2) }}
                                        </strong>

                                    </td>

                                </tr>


                                <tr>

                                    <td class="text-right">

                                        <strong>
                                            Grand Total:
                                        </strong>

                                    </td>

                                    <td class="text-right">

                                        <h4 class="text-primary mb-0">

                                            Rs.
                                            {{ number_format((float) $invoice->order->total_amount, 2) }}

                                        </h4>

                                    </td>

                                </tr>

                            </table>

                        </div>

                    </div>


                    <hr>


                    {{-- =================================================
                        ACTION BUTTONS
                    ================================================== --}}

                    <div class="d-flex justify-content-end flex-wrap mt-4">

                        <a
                            href="{{ route('orders.list') }}"
                            class="btn btn-secondary mr-2 mb-2"
                        >

                            <i class="las la-arrow-left mr-1"></i>

                            Back to Orders

                        </a>


                        <button
                            type="button"
                            onclick="window.print()"
                            class="btn btn-primary mb-2"
                        >

                            <i class="las la-print mr-1"></i>

                            Print Invoice

                        </button>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>


{{-- =========================================================
    PRINT CSS
========================================================== --}}

<style>

@media print {

    body * {
        visibility: hidden;
    }

    .card,
    .card * {
        visibility: visible;
    }

    .card {
        box-shadow: none !important;
        border: none !important;
    }

    .btn,
    a {
        display: none !important;
    }

    @page {
        margin: 15mm;
    }

}

</style>

@endsection