@extends('layouts.admin')

@section('content')
<div class="card">
    <div class="card-header">
        <h4>Update Product</h4>
    </div>
    <div class="card-body">
        <form method="POST" action="{{url('update-product/'.$product->id)}}" enctype="multipart/form-data">
            @csrf
            @method('PUT')
            <div class="row">
                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="category_id">Category</label>
                        <select class="form-select border border-dark p-2" name="category_id" id="category_id">
                            <option value="">Select a Category</option>
                            @foreach($categories as $category)
                                <option value="{{ $category->id }}" {{ $product->category_id == $category->id ? 'selected' : '' }}>
                                    {{ $category->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="brand_id">Brand</label>
                        <select class="form-select border border-dark p-2" name="brand_id" id="brand_id">
                            <option value="">Select a Brand</option>
                            @foreach($brands as $brand)
                                <option value="{{ $brand->id }}" {{ $product->brand_id == $brand->id ? 'selected' : '' }}>
                                    {{ $brand->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <!-- Product Images below the Category and Brand Select Inputs -->
                <div class="col-md-12 mb-3">
                    <label for="image">Product Images</label>
                    <div class="row">
                        @foreach ($product->images as $image)
                            <div class="col-md-3 mb-3">
                                <img style="width:150px;" src="{{ asset('storage/images/'.$image->image) }}" class="img-thumbnail mb-2" alt="Image Not Found">
                            </div>
                        @endforeach
                    </div>
                    <input type="file" name="image[]" class="form-control border border-dark p-2" multiple>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="name">Product Name</label>
                        <input type="text" class="form-control border border-dark p-2" name="name" value="{{ $product->name }}">
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="product_code">Product Code</label>
                        <input type="text" class="form-control border border-dark p-2" name="product_code" value="{{ $product->product_code }}">
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="sku">SKU</label>
                        <input type="text" class="form-control border border-dark p-2" name="sku" value="{{ $product->sku }}">
                    </div>
                </div>

                <!-- In Stock Checkbox (0 for out of stock, 1 for in stock) -->
                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="in_stock">In Stock</label>
        <!-- Hidden input to send 0 when the checkbox is not checked -->
              <input type="hidden" name="in_stock" value="0">

        <!-- Checkbox input, sending 1 when checked -->
          <input type="checkbox" class="border border-dark p-2" name="in_stock" value="1" {{ $product->in_stock == "1" ? "checked" : "" }}>
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="original_price">Regular Price</label>
                        <input type="number" class="form-control border border-dark p-2" name="old_price" value="{{ $product->old_price }}">
                    </div>
                </div>

                 <div class="col-md-6">
                    <div class="mb-3">
                        <label for="original_price">Sale Price</label>
                        <input type="number" class="form-control border border-dark p-2" name="price" value="{{ $product->price }}">
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="mb-3">
                        <label for="description">Description</label>
                        <textarea name="description" rows="3" class="form-control border border-dark p-2">{{ $product->description }}</textarea>
                    </div>
                </div>

                <div class="col-md-12">
                    <button type="submit" class="btn btn-primary">Update Product</button>
                </div>
            </div>
        </form>
    </div>
</div>
@endsection