@extends('layouts.shop-control-layout')

@section('title', 'Додати новий товар')

@section('content')
    <div class="create-product__page">
        <div class="create-product__header">
            <h1 class="create-product__title">
                Додати новий товар
            </h1>
        </div>
        <form class="create-product__form" action="{{ route('products.store') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="create-form__row">
                <div class="form__group">
                    <label for="name">Назва</label>
                    <input type="text" id="name" name="name" value="{{ old('name') }}" required>
                </div>
                <div class="form__group">
                    <label for="price">Ціна</label>
                    <input type="text" id="price" name="price" value="{{ old('price') }}" required>
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="category_id">Категорія</label>
                    <select id="category_id" name="category_id" required>
                        @foreach ($categories as $category)
                            <option value="{{ $category->category_id }}">
                                {{ $category->category_name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="form__group">
                    <label for="category_id">Підкатегорія</label>
                    <input type="text" name="subcategory" id="subcategory">
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="category_id">Матеріал</label>
                    <input type="text" name="filler" id="filler">
                </div>
                <div class="form__group">
                    <label for="category_id">Наповнювач</label>
                    <input type="text" name="material" id="material">
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="category_id">Колір (текст)</label>
                    <input type="text" name="color_text" id="color_text">
                </div>
                <div class="form__group">
                    <label for="category_id">Колір</label>
                    <input type="color" name="color_hash" id="color_hash">
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="category_id">Розмір</label>
                    <input type="text" name="size" id="size">
                </div>

                <div class="form__group">
                    <label for="quantity_in_stock">Кількість в наявності</label>
                    <input type="number" id="quantity_in_stock" name="quantity_in_stock"
                        value="{{ old('quantity_in_stock') }}" required>
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="description">Опис</label>
                    <textarea id="description" name="description">{{ old('description') }}</textarea>
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="availability_status">Статус</label>
                    <div class="status__block">
                        <input type="checkbox" id="availability_status" name="availability_status">
                        <label for="availability_status">В наявності</label>
                    </div>
                </div>
            </div>
            <div class="create-form__row">
                <div class="form__group">
                    <label for="productPhotos">Зображення</label>
                    <input type="file" id="productPhotos" name="productPhotos[]" multiple>
                </div>
            </div>
            <button type="submit" class="save-product">Зберегти</button>
        </form>
    </div>
@endsection