@extends('back_office.layouts.app')

@section('content')
    <div>
        <div class="container-fluid">
            <div class="p-4 bg-white row">
                <h5>Edit Carpet Wash Order</h5>
                <form class="form-horizontal" action="{{ route('carpet-wash-orders.update', $order->id) }}" method="POST">
                    @csrf

                    <div class="row">
                        <!-- Service Provider -->
                        <div class="col-4">
                            <label>Service Provider</label>
                            <input type="text" value="{{ $order->serviceProvider->title }}" class="form-control" disabled />
                        </div>
                        <!-- Order ID -->
                        <div class="col-4">
                            <label>Order ID</label>
                            <input type="text" value="{{ $order->id }}" class="form-control" disabled />
                        </div>

                        <!-- User -->
                        <div class="col-4">
                            <label>Customer</label>
                            <input type="text" value="{{ $order->customer->name }}" class="form-control" disabled />
                        </div>



                        <!-- Carpet Dimensions -->
                        <div class="col-4">
                            <label>Carpet Width (m)</label>
                            <input type="text" value="{{ $order->carpet_width }}" class="form-control" disabled />
                        </div>

                        <div class="col-4">
                            <label>Carpet Height (m)</label>
                            <input type="text" value="{{ $order->carpet_height }}" class="form-control" disabled />
                        </div>

                        <div class="col-4">
                            <label>Quantity</label>
                            <input type="text" value="{{ $order->qty }}" class="form-control" disabled />
                        </div>

                        <!-- Price Details -->
                        <div class="col-4">
                            <label>Price per Sq Meter</label>
                            <input type="text" value="{{ number_format($order->price_per_sq_meter, 2) }}"
                                class="form-control" disabled />
                        </div>

                        <div class="col-4">
                            <label>Total Price</label>
                            <input type="text" value="{{ number_format($order->total_price, 2) }}" class="form-control"
                                disabled />
                        </div>

                        <!-- User Address -->
                        <div class="col-4">
                            <label>User Address</label>
                            <input type="text" value="{{ optional($order->customerAddress)->map_address ?? '' }}"
                                class="form-control" disabled />
                        </div>
                        {{--
                        <!-- Area -->
                        <div class="col-4">
                            <label>Area</label>
                            <input type="text" value="{{ $order->area }}" class="form-control" disabled />
                        </div> --}}

                        <!-- Special Instructions -->
                        <div class="col-4">
                            <label>Special Instructions</label>
                            <textarea class="form-control" disabled>{{ $order->special_instructions }}</textarea>
                        </div>

                        <!-- Order Status (Editable) -->
                        <div class="col-8">
                            <label>Order Status</label>
                            <select name="order_status" class="form-control">
                                <option value="pending" {{ $order->status == 'pending' ? 'selected' : '' }}>Pending
                                </option>
                                <option value="collected" {{ $order->status == 'collected' ? 'selected' : '' }}>Collected
                                </option>
                                <option value="processing" {{ $order->status == 'processing' ? 'selected' : '' }}>
                                    Processing</option>
                                <option value="completed" {{ $order->status == 'completed' ? 'selected' : '' }}>
                                    Completed</option>
                                <option value="cancelled" {{ $order->status == 'cancelled' ? 'selected' : '' }}>
                                    Cancelled</option>
                            </select>
                            @error('order_status')
                                <p class="error-validation">{{ $message }}</p>
                            @enderror
                        </div>

                        <!-- Carpet Order Image -->
                        @if ($order->carpet_image)
                            <div class="col-4">
                                <label>Carpet Image</label>
                                <a href="{{ asset('storage/' . $order->carpet_image) }}" target="_blank">
                                    <img src="{{ asset('storage/' . $order->carpet_image) }}" width="100"
                                        alt="Uploaded Image">
                                </a>
                            </div>
                        @endif

                        <!-- Submit Button -->
                        <div class="col-md-12 mt-4">
                            <div class="form-group text-right">
                                <button type="submit" class="btn btn-info">Update Order</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection