@extends('back_office.layouts.app')

@section('content')
    <style>
        * {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }

        th,
        td {
            font-family: DejaVu Sans;
            font-size: 12px;
        }

        .panel {
            margin-bottom: 20px;
            background-color: #fff;
            border: 1px solid transparent;
            border-radius: 4px;
            -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
            box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
        }

        .panel-default {
            border-color: #ddd;
        }

        .panel-body {
            padding: 15px;
        }

        table {
            width: 100%;
            max-width: 100%;
            margin-bottom: 0px;
            border-spacing: 0;
            border-collapse: collapse;
            background-color: transparent;
        }

        thead {
            text-align: left;
            display: table-header-group;
            vertical-align: middle;
        }

        th,
        td {
            border: 1px solid #ddd;
            padding: 6px;
        }

        .well {
            min-height: 20px;
            padding: 19px;
            margin-bottom: 20px;
            background-color: #f5f5f5;
            border: 1px solid #e3e3e3;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
        }
    </style>

    <header style="font-size:12px;font-weight: normal;">
        <div style="padding: 10px">
            <b>Date: </b> {{ $invoice->created_at->formatLocalized('%A %d %B %Y') }}<br />
            @if ($invoice->transaction_code)
                <b>Invoice #</b>{{ $invoice->transaction_code }}
            @endif
            <a href="{{ route('breakdown-payments.invoice.download', ['id' => $invoice->id]) }}" style="float: right"
                class="btn btn-sm btn-info">Download Invoice</a>
        </div>
        <br />
    </header>

    <main style="font-size:12px;font-weight: normal;">
        <div style="padding: 10px">
            @if ($invoice->user)
                <h5>Customer Details:</h5>
            @endif
            <div class="panel panel-default">
                <div class="panel-body">
                    @if ($invoice->user)
                        <strong>CUSTOMER CODE:</strong> {{ $invoice->user->reference_code }}<br />
                        <strong>CUSTOMER NAME:</strong> {{ $invoice->user->name }}<br />
                        <strong>CUSTOMER Phone:</strong> {{ $invoice->user->phone }}<br />
                        <strong>CUSTOMER Email:</strong> {{ $invoice->user->email }}<br />
                    @endif


                </div>
            </div>
            <h5>Service Provider:</h5>
            <div class="panel panel-default">
                <div class="panel-body">
                    <table class="table">
                        <tr>
                            <td><strong>Name:</strong></td>
                            <td>{{ $serviceProvider->title ?? '' }}</td>
                        </tr>
                        <tr>
                            <td><strong>Description:</strong></td>
                            <td>{{ $serviceProvider->description ?? '' }}</td>
                        </tr>
                        <tr>
                            <td><strong>Address:</strong></td>
                            <td>{{ $serviceProvider->address ?? '' }}</td>
                        </tr>
                        <tr>
                            <td><strong>Service Name:</strong></td>
                            <td>{{ $service->name ?? 0 }} </td>
                        </tr>
                        <tr>
                            <td><strong>Service Base Price :</strong></td>
                            <td>{{ $service->price ?? 0 }} <small>QAR</small></td>
                        </tr>
                        <tr>
                            <td><strong>Distance Rate (Per KM) :</strong></td>
                            <td>{{ $service->distance_rate ?? 0 }} <small>QAR</small></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <div style="padding: 10px">
            <h5>Breakdown Service Details:</h5>
            <table class="table text-center table-striped">
                <thead>
                    <tr>
                        <th class="text-center">Service Order ID</th>
                        <th class="text-center">Status</th>
                        <th class="text-center">Base Price</th>
                        <th class="text-center">Distance Charge</th>
                        <th class="text-center">Total</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-center">{{ $order->id ?? '' }}</td>
                        <td class="text-center">{{ $order->status ?? '' }}</td>
                        <td class="text-center">{{ $order->base_price ?? 0 }} <small>QAR</small></td>
                        <td class="text-center">{{ $order->distance_charge ?? 0 }} <small>QAR</small></td>
                        <td class="text-center">{{ $order->total_price ?? 0 }} <small>QAR</small></td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div style="padding: 10px">
            <h5>Payment Details:</h5>
            <table class="table text-center table-striped">
                <thead>
                    <tr>
                        <th class="text-center">Payment ID</th>
                        <th class="text-center">Transaction code</th>
                        <th class="text-center">AMOUNT</th>
                        <th class="text-center">Payment Method</th>
                        {{-- <th class="text-center">Coupon</th>
                        <th class="text-center">Discount</th> --}}
                        <th class="text-center">Payment STATUS</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-center">{{ $invoice->id }}</td>
                        <td class="text-center">{{ $invoice->transaction_code ?: '---' }} </td>
                        <td class="text-center">{{ $invoice->amount }} <small>QAR</small></td>
                        <td class="text-center">{{ $invoice->paymentType->payment_type ?? '' }} </td>
                        {{-- <td class="text-center">{{ @$invoice->coupon ? $invoice->coupon->code : '---' }}</td>
                        <td class="text-center">{{ @$invoice->discount ?: '---' }}</td> --}}
                        <td class="text-center">{{ $invoice->status }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </main>
@endsection