@extends('frontend.layout.applayout')
@section('title', 'Profile')
<style>
    .bx-show-alt.bx-hide:before {
        content: "\ec0d";
    }

    .text-green,
    p a {
        color: var(--green);
    }

    p a:hover {
        color: #000;
        text-decoration: underline;
    }

    hr {
        background: #787878;
    }

    .table thead.bg-dark tr th {
        color: #fff;
    }

    .table tbody tr td {
        padding: 10px 5px;
        font-size: 14px;
    }

    .table tbody tr td h6 {
        font-size: 15px;
    }
</style>
@section('main-content')
    <div class="container">
        <div class="row">
            <div class="col-lg-4">
                @include('components.customer-profile')
            </div>
            <div id="orderlist" class="col-lg-6">
                <h3 class="mb-0">My Orders</h3>
                <hr>
                <div class="table-responsive-xxl border-0">
                    <!-- Table -->
                    <table class="table mb-0 text-nowrap table-centered">
                        <!-- Table Head -->
                        <thead class="bg-dark text-white">
                            <tr class="bg-dark">
                                {{-- <th>&nbsp;</th> --}}
                                <th>Order ID</th>
                                <th>Company name</th>
                                <th>Order Date</th>
                                <th>Contact Person name</th>
                                <th>Total Items</th>
                                <th>Total</th>
                                <th class="text-center">Status</th>
                                <th class="text-center">Actions</th>
                            </tr>
                        </thead>
                        <tbody class="bg-white">
                            @foreach ($customer->orders as $order)
                                <tr>
                                    <td>{{ $order->id }}</td>
                                    <td>{{ $order->company_name }}</td>
                                    <td>{{ $order->created_at->format('d-m-Y') }}</td>
                                    <td>{{ $order->customer_name }}</td>
                                    <td>{{ $order->total_product }}</td>
                                    <td>${{ number_format($order->grand_total ?? 0, 2) }}</td>
                                    <td class="text-center">
                                        @switch($order->status)
                                            @case('pending')
                                                <span class="bg-warning py-1 px-2 rounded">{{ $order->status }}</span>
                                            @break

                                            @case('Invoice Created')
                                                <span class="bg-info py-1 px-2 rounded">{{ $order->status }}</span>
                                            @break

                                            @case('Shipped')
                                                <span class="bg-info py-1 px-2 rounded">{{ $order->status }}</span>
                                            @break

                                            @case('cancelled')
                                                <span class="bg-danger py-1 px-2 rounded">{{ $order->status }}</span>
                                            @break

                                            @default
                                        @endswitch
                                    </td>
                                    <td class="text-center">
                                        <a href="{{ route('customer.order.details', $order->id) }}">
                                            <i class='bx bx-receipt'></i>
                                        </a>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection