@extends('adminlte::page')

@section('title', 'Modificar marca')

@section('content_header')
    <h1>Dashboard</h1>
@endsection

@section('content')
    <div class="card card-primary">
        <div class="card-header">
            <h3 class="card-title">Agregar marca</h3>
        </div>

        <form autocomplete="off" action="{{ Route('brandModified') }}" method="POST" id="form-brand"
            enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="idBrand" value="{{ $brand->id }}">
            <div class="card-body">
                <div class="form-group">
                    <label for="name">Nombre de la marca:</label>
                    <input type="text" class="form-control @error('name') is-invalid @enderror" id="name"
                        name="name" placeholder="Ingresa el nombre" value="{{ old('name') ?? $brand->display_name }}" minlength="3"
                        maxlength="25" pattern="^\S.*" required>
                    <span id="error-name" class="text-danger"></span>
                    @if ($errors->has('name'))
                        <span class="text-danger">{{ $errors->first('name') }}</span>
                    @endif
                </div>

                <div class="form-group">
                    <label for="abbr">Abreviatura de la marca:</label>
                    <input type="text" class="form-control @error('abbr') is-invalid @enderror" id="abbr"
                        name="abbr" placeholder="Ingresa la abreviatura" value="{{ old('abbr') ?? $brand->abbreviation }}"
                        minlength="1" maxlength="5" pattern="^\S.*" required>
                    <div class="form-text" id="basic-addon4">
                        <small>(Esto se necesita para generar el sku de un proximo producto de esa marca)</small>
                    </div>
                    <span id="error-abbr" class="text-danger"></span>
                    @if ($errors->has('abbr'))
                        <span class="text-danger">{{ $errors->first('abbr') }}</span>
                    @endif
                </div>

                <div class="form-group">
                    <label for="slug">Etiqueta:</label>
                    <input readonly type="text" class="form-control @error('slug') is-invalid @enderror" id="slug"
                        name="slug" placeholder="Ingresa el nombre" value="{{ old('slug') ?? $brand->slug }}" minlength="5"
                        maxlength="25" pattern="^\S.*" required>
                    <span id="error-slug" class="text-danger"></span>
                    @if ($errors->has('slug'))
                        <span class="text-danger">{{ $errors->first('slug') }}</span>
                    @endif
                </div>

                <div class="form-group">
                    <label for="image" class="form-label">Imagen de la marca:</label>
                    <input type="file" class="form-control" id="image" name="image" accept="image/*"
                        @if (!$brand->image_logo) required @endif>
                    <small>Si ya tiene la marca imagen se dejara la anterior si no agregas una nueva.</small>
                    <small>Tipo de archivo: Imagen |Extensiones permitidas: jpeg, png, jpg | max: 2MB</small>
                    <small><span class="text-bold">Nota: </span>Debe ser de tamaño pequeño y si se puede en blanco y en negro, de lo contrario marca la siguiente casilla</small>
                    <span id="error-image" class="text-danger"></span>
                    @if ($errors->has('image'))
                        <span class="text-danger">{{ $errors->first('image') }}</span>
                    @endif
                </div>
                <div class="form-group">
                    <input type="checkbox" name="grayscale" id="grayscale">
                    <label for="grayscale">Convertir imagen en blanco y negro</label>
                </div>

                <div class="card-footer">
                    <input type="submit" class="btn btn-warning" id="submitBrand" value="Modificar">
                </div>
        </form>
    </div>
@endsection

@section('js')
    @vite('resources/js/brands/validationsBrands.js')
@endsection