@extends('layout.app')

@section('title', $title)
@section('description', $description)

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-12">
            <div class="breadcrumb-main customer-member justify-content-sm-between">
                <div class="d-flex flex-wrap justify-content-center breadcrumb-main__wrapper">
                    <div class="d-flex align-items-center customer-member__title justify-content-center me-sm-25">
                        <h4 class="text-capitalize fw-500 breadcrumb-title">Customer Details</h4>
                        <span class="sub-title ms-sm-25 ps-sm-25">Home</span>
                    </div>

                  
                </div>
                <div class="action-btn">
                    <a href="{{route('customer.list')}}" class="btn px-15 btn-primary">
                        <i class="las la-plus fs-16"></i> Back To Customer
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- customer Data Table -->
    <div class="row">
        <div class="col-lg-12">
            <div class="customerDatatable global-shadow border-light-0 p-30 bg-white radius-xl w-100 mb-30">
            <div class="container mt-5">
                <div class="card shadow-lg p-4">
                    <h2 class="text-center mb-4">Customer Details</h2>
                    <div class="row">
                        <div class="col-md-4 text-center">
                            <img src="{{asset('assets/img/author-nav.jpg')}}" alt="Customer Photo" class="img-fluid rounded-circle">
                        </div>
                        <div class="col-md-8">
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item"><strong>Channel Name:</strong> {{$customer->channel_name}}</li>
                                <li class="list-group-item"><strong>Channel Description:</strong> {{$customer->description}}</li>
                                <!-- <li class="list-group-item"><strong>Phone:</strong> +123 456 7890</li>
                                <li class="list-group-item"><strong>Address:</strong> 123 Main Street, City, Country</li>
                                <li class="list-group-item"><strong>Joined Date:</strong> January 1, 2022</li> -->
                            </ul>
                        </div>
                    </div>
                </div>

                <div class="card shadow-lg p-4 mt-4">
                    <h3 class="text-center mb-4">Order List</h3>
                    <table class="table table-bordered">
                        <thead class="table-dark">
                            <tr>
                                <th>Order ID</th>
                                <th>Product Name</th>
                                <th>Date</th>
                                <th>Amount</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($orders as $order)
                            <tr>
                                <td>{{$order->id}}</td>
                                <td>{{$order->product?->product_name??""}}</td>
                                <td>{{$order->created_at}}</td>
                                <td>${{$order->amount}}</td>
                            </tr>
                            @endforeach
                            @if($orders->isEmpty())
                            <tr>
                                <td colspan="4"><p class="text-center text-muted mt-3">No orders found.</p></td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
            </div>
        </div>
    </div>

    <!-- Pagination -->
   
@endsection