@extends('layouts.app')

@section('titulo','Editar Punto de Venta')

@section('contenido')

<div class="max-w-xl mx-auto">


<h1 class="text-2xl font-bold mb-6 text-slate-800">
    Editar Punto de Venta
</h1>



<form method="POST"
      action="{{ route('puntos_venta.update',$puntoVenta) }}"
      class="bg-white rounded-2xl border border-slate-200 shadow-sm p-6 space-y-4">


@csrf
@method('PUT')



<div>

<label class="text-sm font-medium text-slate-700">
Local
</label>


<select name="local_id"
        id="local_id"
        class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1"
        required>


@foreach($locales as $local)

<option value="{{ $local->id }}"
{{ $puntoVenta->local_id==$local->id?'selected':'' }}>

{{ $local->nombre }}

</option>

@endforeach


</select>

</div>




<div>

<label class="text-sm font-medium text-slate-700">
Almacén
</label>


<select name="almacen_id"
        id="almacen_id"
        class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1"
        required>


@foreach($almacenes as $almacen)

<option value="{{ $almacen->id }}"
data-local="{{ $almacen->local_id }}"
{{ $puntoVenta->almacen_id==$almacen->id?'selected':'' }}>


{{ $almacen->nombre }}


</option>


@endforeach


</select>

</div>




<div>

<label class="text-sm font-medium text-slate-700">
Código
</label>

<input type="text"
name="codigo"
value="{{ old('codigo',$puntoVenta->codigo) }}"
class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1"
required>

</div>




<div>

<label class="text-sm font-medium">
Nombre
</label>

<input type="text"
name="nombre"
value="{{ old('nombre',$puntoVenta->nombre) }}"
class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1"
required>

</div>




<div>

<label class="text-sm font-medium">
Impresora
</label>

<input type="text"
name="impresora"
value="{{ old('impresora',$puntoVenta->impresora) }}"
class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1">

</div>




<div>

<label class="text-sm font-medium">
Estado
</label>


<select name="estado"
class="w-full rounded-xl border border-slate-300 px-3 py-2 mt-1">


<option value="1"
{{ $puntoVenta->estado?'selected':'' }}>
Activo
</option>


<option value="0"
{{ !$puntoVenta->estado?'selected':'' }}>
Inactivo
</option>


</select>

</div>



<div class="flex gap-3 pt-4">


<a href="{{route('puntos_venta.index')}}"
class="flex-1 text-center bg-slate-100 py-3 rounded-xl">

Cancelar

</a>



<button
class="flex-1 bg-brand-600 text-white py-3 rounded-xl font-bold">

Actualizar

</button>


</div>



</form>


</div>



<script>

document.getElementById('local_id').addEventListener('change',function(){

let local=this.value;


document.querySelectorAll('#almacen_id option')
.forEach(option=>{


if(option.value=="") return;


option.style.display =
(option.dataset.local==local)
?'block'
:'none';


});


});


</script>


@endsection