@extends('Admin.layout')



@section('content')

{{-- PAGE HEADER --}}
<div class="d-flex justify-content-between align-items-center mb-3">

    <div>
        <h5 class="mb-1">Project Details</h5>
        <small class="text-muted">
            Project ID: {{ $project->project_id }}
        </small>
    </div>

    <div class="d-flex gap-2">

        <button type="button"
                class="btn btn-dark"
                onclick="window.print()">
            <i class="fa fa-print me-1"></i>
            Print
        </button>

        <a href="{{ route('project.invoice.download', $project->project_id) }}"
   class="btn btn-danger">
    <i class="fa fa-file-pdf me-1"></i>
    Download Invoice
</a>

    </div>

</div>


{{-- PROJECT DETAILS --}}
<div class="card mb-3">

    <div class="card-header">
        <strong>Project Information</strong>
    </div>

    <div class="card-body">

        <div class="row">

            <div class="col-md-4 mb-3">
                <small class="text-muted d-block">
                    Project ID
                </small>

                <strong>
                    {{ $project->project_id }}
                </strong>
            </div>


            <div class="col-md-4 mb-3">
                <small class="text-muted d-block">
                    Project Name
                </small>

                <strong>
                    {{ $project->project_name ?? '-' }}
                </strong>
            </div>


            <div class="col-md-4 mb-3">
                <small class="text-muted d-block">
                    Client Phone
                </small>

                <strong>
                    {{ $project->phone_number ?? '-' }}
                </strong>
            </div>


            <div class="col-md-4 mb-3">
                <small class="text-muted d-block">
                    Client Email
                </small>

                <strong>
                    {{ $project->email ?? '-' }}
                </strong>
            </div>

        </div>

    </div>

</div>


{{-- FINANCIAL SUMMARY --}}
<div class="row mb-3">

    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-body">
                <small class="text-muted">
                    Project Amount
                </small>

                <h4 class="mb-0 mt-2">
                    ₹{{ number_format((float) ($project->amount ?? 0), 2) }}
                </h4>
            </div>
        </div>
    </div>


    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-body">
                <small class="text-muted">
                    Total Received
                </small>

                <h4 class="mb-0 mt-2">
                    ₹{{ number_format((float) $totalReceived, 2) }}
                </h4>
            </div>
        </div>
    </div>


    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-body">
                <small class="text-muted">
                    Balance
                </small>

                <h4 class="mb-0 mt-2">
                    ₹{{ number_format((float) $balance, 2) }}
                </h4>
            </div>
        </div>
    </div>

</div>


{{-- PAYMENT HISTORY --}}
<div class="card mb-3">

    <div class="card-header d-flex justify-content-between align-items-center">

        <strong>
            Payment History
        </strong>

        <span>
            Total:
            <strong>
                ₹{{ number_format((float) $totalReceived, 2) }}
            </strong>
        </span>

    </div>


    <div class="table-responsive">

        <table class="table table-hover mb-0">

            <thead>

                <tr>
                    <th>#</th>
                    <th>Date</th>
                    <th>Amount</th>
                    <th>Remark</th>
                </tr>

            </thead>


            <tbody>

                @forelse($payments as $index => $payment)

                    <tr>

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

                        <td>
                            {{ $payment->received_date
                                ? \Carbon\Carbon::parse($payment->received_date)->format('d-m-Y')
                                : '-' }}
                        </td>

                        <td>
                            ₹{{ number_format((float) $payment->amount, 2) }}
                        </td>

                        <td>
                            {{ $payment->remark ?? '-' }}
                        </td>

                    </tr>

                @empty

                    <tr>
                        <td colspan="4"
                            class="text-center text-muted py-4">
                            No payment history found.
                        </td>
                    </tr>

                @endforelse

            </tbody>

        </table>

    </div>

</div>


{{-- INVOICE --}}
<div class="card" id="invoice">

    <div class="card-body p-4">

        <div class="row mb-4">

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

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

                <p class="text-muted mb-0">
                    Project Invoice
                </p>

            </div>


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

                <strong>
                    Invoice No:
                </strong>

                <span>
                    INV-{{ $project->project_id }}
                </span>

                <br>

                <strong>
                    Date:
                </strong>

                <span>
                    {{ now()->format('d-m-Y') }}
                </span>

            </div>

        </div>


        <hr>


        {{-- CLIENT --}}
        <div class="row mb-4">

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

                <h6 class="text-muted">
                    BILL TO
                </h6>

                <h5>
                    Client
                </h5>

                <p class="mb-1">
                    {{ $project->project_name ?? '-' }}
                </p>

                <p class="mb-1">
                    {{ $project->phone_number ?? '-' }}
                </p>

                <p class="mb-0">
                    {{ $project->email ?? '-' }}
                </p>

            </div>


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

                <h6 class="text-muted">
                    PROJECT
                </h6>

                <p class="mb-1">
                    <strong>ID:</strong>
                    {{ $project->project_id }}
                </p>

                <p class="mb-0">
                    <strong>Name:</strong>
                    {{ $project->project_name ?? '-' }}
                </p>

            </div>

        </div>


        {{-- INVOICE TABLE --}}
        <div class="table-responsive">

            <table class="table table-bordered">

                <thead>

                    <tr>
                        <th>Description</th>
                        <th class="text-end">
                            Amount
                        </th>
                    </tr>

                </thead>


                <tbody>

                    <tr>

                        <td>
                            {{ $project->project_name ?? 'Project' }}
                        </td>

                        <td class="text-end">
                            ₹{{ number_format((float) ($project->amount ?? 0), 2) }}
                        </td>

                    </tr>

                </tbody>


                <tfoot>

                    <tr>

                        <th class="text-end">
                            Project Amount
                        </th>

                        <th class="text-end">
                            ₹{{ number_format((float) ($project->amount ?? 0), 2) }}
                        </th>

                    </tr>


                    <tr>

                        <th class="text-end">
                            Amount Received
                        </th>

                        <th class="text-end">
                            ₹{{ number_format((float) $totalReceived, 2) }}
                        </th>

                    </tr>


                    <tr>

                        <th class="text-end">
                            Balance Due
                        </th>

                        <th class="text-end">
                            ₹{{ number_format((float) $balance, 2) }}
                        </th>

                    </tr>

                </tfoot>

            </table>

        </div>


        {{-- PAYMENT STATUS --}}
        <div class="mt-4">

            @if($balance <= 0)

                <span class="badge bg-success px-3 py-2">
                    PAID
                </span>

            @else

                <span class="badge bg-warning text-dark px-3 py-2">
                    PAYMENT PENDING
                </span>

            @endif

        </div>


        <div class="text-center mt-5">

            <p class="mb-1">
                Thank you for your business.
            </p>

            <small class="text-muted">
                This is a computer generated invoice.
            </small>

        </div>

    </div>

</div>


{{-- ACTION BUTTONS --}}
<div class="d-flex justify-content-end gap-2 mt-3">

    <button type="button"
            class="btn btn-dark"
            onclick="window.print()">

        <i class="fa fa-print me-1"></i>
        Print

    </button>


    <a href="{{ route('project.invoice.download', $project->project_id) }}"
   class="btn btn-danger">

    <i class="fa fa-file-pdf me-1"></i>
    Download PDF

</a>


   <a
    href="{{ route('project.invoice.whatsapp', $project->project_id) }}"
    class="btn btn-success"
>
    WhatsApp
</a>


    <a href="#"
       class="btn btn-primary">

        <i class="fa fa-envelope me-1"></i>
        Email

    </a>

</div>


{{-- PRINT STYLE --}}



@endsection