@extends('components.customer_layout')
@section('customer-content')
    <div class="container">
        <div class="card">
            <div class="card-header">
                <h2>Application Summary</h2>

            </div>
            <div class="card-body">
                <div class="row">
                    <!-- Application Summary -->
                    <div class="col-md-6">
                        <p><strong>Application ID:</strong> {{ $application->id }}</p>
                        <p><strong>Status:
                            {{ $application->status}}
                            </strong>
                            <span class="badge
                                                {{ $application->status == 'accepted' ? 'bg-success' : ($application->status == 'is_rejected_by_officer' ? 'bg-danger' : 'bg-secondary') }}">
                                {{ ucfirst($application->status) }}
                            </span>
                        </p>
                        <p><strong>Area:</strong> {{ $application->area }} sq. meters</p>
                        <p><strong>Height:</strong> {{ $application->height }} meters</p>
                        <p><strong>Cart Number:</strong> {{ $application->carta_number }}</p>
                        <p><strong>Issue Date:</strong> {{ $application->issue_date }}</p>
                    </div>
                    <!-- Customer & Service Details -->
                    <div class="col-md-6">
                        <h6>Customer & Service Details</h6>
                        <hr>
                        <p><strong>Customer
                                Name:</strong> {{ $application->customer->full_name ?? 'N/A' }}</p>
                        <p><strong>Service Name:</strong> {{ $application->service->name ?? 'N/A' }}
                        </p>
                        <p><strong>Service
                                Type:</strong> {{ $application->serviceType->name ?? 'N/A' }}</p>
                        <p><strong>Office:</strong> {{ $application->office->name ?? 'N/A' }}</p>
                    </div>
                </div>
                <hr>
                <!-- Decision Status -->
                <div>
                    <h6>Decision Status</h6>
                    <p><strong>Is Paid:</strong> {{ $application->is_paid ? 'Yes' : 'No' }}</p>
                    <p><strong>Ordered:</strong> {{ $application->is_ordered ? 'Yes' : 'No' }}</p>
                    <p><strong>Viewed by
                            Officer:</strong> {{ $application->is_view_by_officer ? 'Yes' : 'No' }}
                    </p>
                    <p><strong>Rejected by
                            Officer:</strong> {{ $application->is_rejected_by_officer ? 'Yes' : 'No' }}
                    </p>
                    <p><strong>Accepted by
                            Officer:</strong> {{ $application->is_accept_by_officer ? 'Yes' : 'No' }}
                    </p>
                    <p><strong>Approved by
                            Leader:</strong> {{ $application->is_approved_by_leader ? 'Yes' : 'No' }}
                    </p>
                    <p><strong>Rejected by
                            Leader:</strong> {{ $application->is_rejected_by_leader ? 'Yes' : 'No' }}
                    </p>
                </div>

                <!-- Location Details -->
                <hr>
                <div>
                    <h6>Location Details</h6>
                    <p><strong>City:</strong> {{ $application->city }}</p>
                    <p><strong>Subcity:</strong> {{ $application->subcity }}</p>
                    <p><strong>Woreda:</strong> {{ $application->woreda }}</p>
                </div>
            </div>

        </div>


        <hr>


        <div class="card">
            <div class="card-header">
                <h2>Document Details</h2>
            </div>
            <div class="card-body">
                <embed src="{{ asset($application->file) }}" width="100%" height="640px"
                       alt="pdf"/>
            </div>
        </div>
    </div>

    <!-- Approve Button -->
    </div>

@endsection