@extends('admin.layouts.app')
@section('title', 'Orders Detail')
@section('content')
    <div class="container-full">
        <div class="content-header">
            <div class="d-flex align-items-center">
                <div class="mr-auto">
                    <h3 class="page-title">Order Detail</h3>
                    <div class="d-inline-block align-items-center">
                        <nav>
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item">
                                    <a href="#"><i class="mdi mdi-home-outline">Order Management</i></a>
                                </li>
                                <li class="breadcrumb-item active" aria-current="page">Order Detail</li>
                            </ol>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
        <section class="content">
            <div class="box">
                <div class="box-body">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="d-flex justify-content-between">
                                <h4 class="box-title">Order Info</h4>
                            </div>
                            <div class="table-responsive">
                                <table class="table product-table">
                                    <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Product</th>
                                            <th>Price</th>

                                            @hasrole('admin')
                                                <th>Seller</th>
                                            @endhasrole
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($data->getRelevantProducts() as $items)
                                            <tr>
                                                <td>{{ $items->id }}</td>
                                                <td class="product-image">
                                                    <div class="row">
                                                        <div class="col-3">
                                                            <img src="{{ asset($items->product->image) }}" class="img-fluid"
                                                                alt="">
                                                        </div>
                                                        <div class="col-5">
                                                            {{ $items->product->name }}
                                                            <div class="variation-detail">
                                                                @foreach (json_decode($items->variation) as $key => $value)
                                                                    <p>{{ $value->name }} - ${{ $value->price }} *
                                                                        {{ $value->qty }}</p>
                                                                    ${{ $items->price }}
                                                                @endforeach
                                                            </div>
                                                        </div>

                                                </td>
                                                <td>${{ $items->price }}
                                                    @php
                                                        $sales_vendor = DB::table('sale_vendors')
                                                            ->where('order_id', $items->order_id)
                                                            ->where('product_id', $items->product_id)
                                                            ->first();

                                                    @endphp
                                                    <div class="earning">

                                                        <p>Product Price: ${{ $items->price }}</p>
                                                        <p>Harvest Commission: - ${{ $sales_vendor->admin_commission }}
                                                            ({{ $items->product->user->package->marketplace_commission }}%)
                                                        </p>
                                                        <p>Earning: ${{ $sales_vendor->seller_commission }}</p>
                                                    </div>
                                                </td>


                                                @hasrole('admin')
                                                    <td>
                                                        <div class="d-flex" style="gap: 10px;">
                                                            @if ($items->product->user->image != null)
                                                                <img src="{{ asset($items->product->user->image) }}"
                                                                    alt="{{ $items->product->user->name }}"
                                                                    style="border-radius: 50px;height: 40px;">
                                                            @else
                                                                <img src="{{ asset('front/images/no-user.png') }}"
                                                                    alt="{{ $items->product->user->name }}"
                                                                    style="border-radius: 50px;height: 40px;">
                                                            @endif
                                                            <span>{{ $items->product->user->name }} <br>
                                                                {{ $items->product->user->email }}</span>
                                                        </div>
                                                    </td>
                                                @endhasrole
                                            </tr>
                                        @endforeach

                                        @hasanyrole('admin')
                                            <tr>
                                                <td>&nbsp;</td>
                                                <td>&nbsp;</td>

                                                <td class="total-price text-right"><b>Shipping Amount:</b></td>
                                                <td class="total-price">
                                                    <b>{{ $data->shipping == 0 ? 'Free' : '$' . $data->shipping }}</b></td>
                                            </tr>
                                            <tr>

                                                <td>&nbsp;</td>
                                                <td>&nbsp;</td>

                                                <td class="total-price text-right"><b>Sales Tax:</b></td>
                                                <td class="total-price"><b>{{ $data->tax }}%</b></td>
                                            </tr>



                                            <tr>
                                                <td>&nbsp;</td>
                                                <td>&nbsp;</td>

                                                <td class="total-price text-right"><b>Total Price:</b></td>
                                                <td class="total-price"><b>${{ $data->amount }}</b></td>
                                            </tr>
                                        @endhasanyrole
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box">
                <div class="box-body">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <h4 class="box-title">Shipping Address</h4>
                            <div class="table-responsive">
                                <table class="table shipping-table">
                                    <tbody>
                                        <tr>
                                            <td>Name</td>
                                            <td>{{ $data->name }}</td>
                                        </tr>
                                        <tr>
                                            <td>Email</td>
                                            <td>{{ $data->email }}</td>
                                        </tr>
                                        <tr>
                                            <td>Phone</td>
                                            <td>{{ $data->phone }}</td>
                                        </tr>
                                        <tr>
                                            <td>Address</td>
                                            <td>{{ $data->address }}</td>
                                        </tr>
                                        @if ($data->address_1 != null)
                                            <tr>
                                                <td>Address 1</td>
                                                <td>{{ $data->address_1 }}</td>
                                            </tr>
                                        @endif
                                        <tr>
                                            <td>Country</td>
                                            <td>{{ $data->country }}</td>
                                        </tr>
                                        <tr>
                                            <td>City</td>
                                            <td>{{ $data->city }}</td>
                                        </tr>
                                        <tr>
                                            <td>State</td>
                                            <td>{{ $data->state }}</td>
                                        </tr>
                                        <tr>
                                            <td>Zip</td>
                                            <td>{{ $data->zip }}</td>
                                        </tr>
                                        @if ($data->notes != null)
                                            <tr>
                                                <td>Notes</td>
                                                <td>{{ $data->notes }}</td>
                                            </tr>
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box">
                <div class="box-body">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <h4 class="box-title">Payment Details</h4>
                            <div class="table-responsive">
                                <table class="table shipping-table">
                                    <tbody>
                                        <tr>
                                            <td>Method</td>
                                            <td>{{ ucwords($data->payment_method) }}</td>
                                        </tr>
                                        <tr>
                                            <td>Transaction ID</td>
                                            <td>{{ $data->transaction_id }}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection

@push('css')
    <style>
        td.product-image img {
            width: 70px;
            height: 70px;
            object-fit: cover;
            margin-right: 10px
        }

        .total-price {
            position: relative;
        }

        .change-status {
            background: #014ca9;
            color: white;
        }

        .change-status:hover {
            color: white;
        }

        .success-status {
            background-color: #28a745;
            color: white;
        }

        .earning p {
            color: #7a7373;
            margin-top: 1rem;
            line-height: 0.5rem;
            font-style: italic;
        }

        .success-status:hover {
            color: white;
        }
    </style>
@endpush

@push('js')
@endpush