@extends('layouts.admin')
@section('content')
<style>
    .table-transaction>tbody>tr:nth-of-type(odd) {
        --bs-table-accent-bg: #0eca1b !important;
    }
</style>
<div class="main-content-inner">
    <div class="main-content-wrap">
        <div class="flex items-center flex-wrap justify-between gap20 mb-27">
            <h3>Order Details</h3>
            <ul class="breadcrumbs flex items-center flex-wrap justify-start gap10">
                <li>
                    <a href="{{ route('admin.index') }}">
                        <div class="text-tiny">Dashboard</div>
                    </a>
                </li>
                <li>
                    <i class="icon-chevron-right"></i>
                </li>
                <li>
                    <div class="text-tiny">Order Details</div>
                </li>
            </ul>
        </div>

        <div class="wg-box">
            <div class="flex items-center justify-between gap10 flex-wrap">
                <div class="wg-filter flex-grow">
                    <h5>Detail Order</h5>
                </div>
                <a class="tf-button style-1 w208" href="{{ route('admin.orders') }}">Back</a>
            </div>
            <div class="table-responsive">
                @if (Session::has('status'))
                    <p class="alert alert-success">{{ Session::get('status') }}</p>
                @endif
                <table class="table table-striped table-bordered">
                    <tr>
                        <th>Order No</th>
                        <td>{{ $order->id }}</td>
                        <th>No HP</th>
                        <td>{{ $order->phone }}</td>
                        <th>Zip Code</th>
                        <td>{{ $order->zip }}</td>
                    </tr>
                    <tr>
                        <th>Tanggal Order</th>
                        <td>{{ $order->created_at }}</td>
                        <th>Tanggal Pengiriman</th>
                        <td>{{ $order->delivered_date }}</td>
                        <th>Tanggal Pembatalan</th>
                        <td>{{ $order->canceled_date }}</td>
                    </tr>
                    <tr>
                        <th>Status Order </th>
                        <td colspan="5">
                            @if($order->status == 'delivered')
                                <span class="badge bg-success">Dikirim</span>
                            @elseif($order->status == 'canceled')
                                <span class="badge bg-danger">Dibatalkan</span>
                            @else
                                <span class="badge bg-warning">Dipesan</span>
                            @endif
                        </td>
                    </tr>

                </table>
            </div>

        </div>

        <div class="wg-box">
            <div class="flex items-center justify-between gap10 flex-wrap">
                <div class="wg-filter flex-grow">
                    <h5>Barang yang Dipesan</h5>
                </div>
            </div>
            <div class="table-responsive">
                <table class="table table-striped table-bordered">
                    <thead>
                        <tr>
                            <th class="text-center">Produk</th>
                            <th class="text-center">Nama</th>
                            <th class="text-center">Harga</th>
                            <th class="text-center">Quantity</th>
                            <th class="text-center">SKU</th>
                            <th class="text-center">Kategori</th>
                            <th class="text-center">Brand</th>
                            <th class="text-center">Return Status</th>
                            <th class="text-center">Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($orderItems as $item)
                        <tr>

                            <td class="text-center">
                                <div class="image">
                                    <img src="{{ asset('storage/products/') }}/{{ $item->product->image }}" alt="{{ $item->product->name }}" class="image">
                                </div>
                            </td>
                            <td class="text-center">{{ $item->product->name }}</td>
                            <td class="text-center">Rp. {{ number_format((float) preg_replace('/[^\d.]/', '', $item->price), 0, ',', '.') }}</td>
                            <td class="text-center">{{ $item->quantity }}</td>
                            <td class="text-center">{{ $item->product->SKU }}</td>
                            <td class="text-center">{{ $item->product->category->name }}</td>
                            <td class="text-center">{{ $item->product->brand->name }}</td>
                            <td class="text-center">{{ $item->rstatus == 0 ? "No" : "Yes" }}</td>
                            <td class="text-center">
                                <div class="list-icon-function view-icon">
                                    <div class="item eye">
                                        <i class="icon-eye"></i>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <div class="divider"></div>
            <div class="flex items-center justify-between flex-wrap gap10 wgp-pagination">
                {{ $orderItems->links('pagination::bootstrap-5') }}
            </div>
        </div>

        <div class="wg-box mt-5">
            <h5>Alamat Pengiriman</h5>
            <div class="my-account__address-item col-md-6">
                <div class="my-account__address-item__detail">
                    <p>{{ $order->name }}</p>
                    <p>{{ $order->address }}</p>
                    <p>{{ $order->locality }}</p>
                    <p>{{ $order->city }}, {{ $order->country }}</p>
                    <p>{{ $order->landmark }}</p>
                    <p>{{ $order->zip }}</p>
                    <br>
                    <p>NO Handphone : {{ $order->phone }}</p>
                </div>
            </div>
        </div>


                            <div class="wg-box mt-5">
            <h5>Transaksi</h5>
            <table class="table table-striped table-bordered table-transaction">
                <tbody>
                    <tr>
                        <th>Subtotal</th>
                        <td>Rp. {{ number_format($order->subtotal, 0, ',', '.') }}</td>

                        <th>Tax</th>
                        <td>Rp. {{ number_format($order->tax, 0, ',', '.') }}</td>

                        <th>Discount</th>
                        <td>Rp. {{ number_format($order->discount, 0, ',', '.') }}</td>

                    </tr>
                    <tr>
                        <th>Total</th>
                        <td>Rp. {{ number_format((float) preg_replace('/[^\d.]/', '', $order->total), 0, ',', '.') }}</td>

                        <th>Jenis Pembayaran</th>
                        <td>{{ $transaction?->mode ?? '-' }}</td>
                        <th>Status</th>
                        <td>
                            @if ($transaction->status == 'approved')
                                <span class="badge bg-success">Approved</span>
                            @elseif ($transaction->status == 'declined')
                                <span class="badge bg-danger">Declined</span>
                            @elseif ($transaction->status == 'refunded')
                                <span class="badge bg-secondary">Refunded</span>
                            @else
                                <span class="badge bg-warning">Pending</span>
                            @endif
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

        <div class="wg-box mt-5">
            <h5>Perbarui Status Pesanan</h5>
            <form action="{{ route('admin.order.status.update') }}" method="POST">
                @csrf
                @method('PUT')
                <input type="hidden" name="order_id" value="{{ $order->id }}"/>
                <div class="row">
                    <div class="col-md-3">
                        <div class="select">
                            <select id="order_status" name="order_status">
                                <option value="ordered" {{ $order->status == 'ordered' ? "selected" : "" }}>Dipesan</option>
                                <option value="delivered" {{ $order->status == 'delivered' ? "selected" : "" }}>Dikirim</option>
                                <option value="canceled" {{ $order->status == 'canceled' ? "selected" : "" }}>Dibatalkan</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <button type="submit" class="btn btn-primary tf-button w208">Update Status</button>
                    </div>
                </div>
            </form>
        </div>

    </div>
</div>
@endsection