@extends('layouts.dashboard.dashboard')

@section('content')
    @component('card-component',['title'=>ucfirst(trans('main.tattoos'))])
        <form class="row" action="{{route('dashboard.tattoo.update',$tattoo)}}" method="POST" enctype="multipart/form-data">@csrf @method('PUT')
            <div class="col-md-9 row">
                <div class="col-md-12 form-group">
                    <label for="name">@lang('main.name')</label>
                    <input type="text" class="form-control" required minlength="3" value="{{old('name',$tattoo->name)}}" name="name" id="name" aria-describedby="helpId" placeholder="name">
                    <x-errors.validation-error name="name"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="description">@lang('main.description')</label>
                    <textarea type="text" class="form-control" required minlength="3" value="" name="description" id="description" aria-describedby="helpId" placeholder="description">{{old('description',$tattoo->description)}}</textarea>
                    <x-errors.validation-error name="description"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="image">@lang('main.image')</label>
                    <input type="file" onchange="readURL(this,'preview')" class="form-control" accept="image/*" name="image" id="image"/>
                    <x-errors.validation-error name="image"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="images">@lang('main.images')</label>
                    <input type="file" multiple class="form-control" accept="image/*" name="images[]" id="images"/>
                    <x-errors.validation-error name="image"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="price">@lang('main.price')</label>
                    <input type="number" min="0"  class="form-control"  value="{{old('price',$tattoo->price)}}" name="price" id="price"/>
                    <x-errors.validation-error name="price"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="currency">@lang('main.currency')</label>
                    <input type="text" min="0"  class="form-control"  value="{{old('currency',$tattoo->currency)}}" name="currency" id="currency"/>
                    <x-errors.validation-error name="currency"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="type">@lang('main.type')</label>
                    <select class="form-control" name="type" id="type">
                        <option {{$tattoo->type==="1"?' selected ':''}} value="1">Slider</option>
                        <option {{$tattoo->type==="2"?' selected ':''}} value="2">News</option>
                        <option {{$tattoo->type==="3"?' selected ':''}} value="3">Recommended</option>
                    </select>
                    <x-errors.validation-error name="type"/>
                </div>
                <div class="col-md-12 form-group">
                    <label for="category_id">@lang('main.category')</label>
                    <select class="form-control" name="category_id" id="category_id">
                        @foreach (\App\Category::latest()->get() as $category)
                            <option {{$tattoo->category_id===$category->id?' selected ':''}} value="{{$category->id}}">{{$category->name}}</option>
                        @endforeach
                    </select>
                    <x-errors.validation-error name="category_id"/>
                </div>
            </div>
            <div class="col-md-3 row">
                <h4>Image</h4>
                <div class="border p-2 img-thumbnail col-md-12 mb-2">
                    <img src="{{$tattoo->imagePath}}" id="preview" class="w-100" style="max-height: 200px"/>
                </div>
                <h4>Images</h4>
            @foreach ($tattoo->images as $image)
                <div class="border p-2 img-thumbnail col-md-12 mb-2">
                    <img src="{{url($image)}}" id="preview" class="w-100" style="max-height: 200px"/>
                </div>
            @endforeach
            </div>
            <div class="col-md-12">
                <button type="submit" class="btn btn-warning">@lang('main.update')</button>
            </div>
        </form>

    @endcomponent
@stop
@push('js')
    <script src="{{asset('js/imgScript.js')}}"></script>
@endpush