@extends('layouts.app')
@section('content')
	<div class="container" id="app" v-cloak>
		<div class="row">
			<div class="col-12">
				{!! Form::model($inventario, ['route'=>['inventarios.updateRegistro',$inventario->id],'method'=>'PUT']) !!}
				<div class="form-row">
					<div class="form-group col-3">
						{!! Form::label('linea_in_id', 'Linea', ['class' => 'form-control-labe']) !!}
						<select class="form-control form-control-plaintext" name="linea_in_id" v-model="linea_id" readonly>
							<option v-for="item in listLineas" :value="item.value" v-if="item.value == linea_id">@{{ item.label }}</option>
						</select>
						<small class="text-danger">{{ $errors->first('linea_in_id') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('buque_in_id', 'Buque', ['class' => 'form-control-label']) !!}
						<select class="form-control form-control-plaintext" name="buque_in_id" v-model="buque_id" readonly>
							<option v-for="item in listBuques" :value="item.value" v-if="item.value == buque_id">@{{ item.label }}</option>
						</select>
						<small class="text-danger">{{ $errors->first('buque_in_id') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('viaje_in_id', 'Viaje', ['class' => 'form-control-label']) !!}
						<select class="form-control form-control-plaintext" name="viaje_in_id" v-model="viaje_id" readonly>
							<option v-for="item in listViaje" :value="item.value" v-if="item.value == viaje_id">@{{ item.label }}</option>
						</select>
						<small class="text-danger">{{ $errors->first('viaje_in_id') }}</small>
					</div>
				</div>
				<div class="form-row">
					<div class="form-group col-2">
						{!! Form::label('acta_id', 'Acta', ['class'=>'form-control-label']) !!}
						{!! Form::text('acta_id', null, ['class'=>'form-control']) !!}
						<small class="text-danger">{{ $errors->first('acta_id') }}</small>
					</div>
					<div class="form-group col-2">
						{!! Form::label('eir_in', 'EIR', ['class'=>'form-control-label']) !!}
						{!! Form::number('eir_in', null, ['class'=>'form-control form-control-plaintext','readonly']) !!}
						<small class="text-danger">{{ $errors->first('eir_in') }}</small>
					</div>
					<div class="form-group col-2">
						{!! Form::label('frd', 'Fecha/Despacho', ['class'=>'form-control-label']) !!}
						{!! Form::date('frd', \Illuminate\Support\Carbon::now(), ['class' => 'form-control form-control-plaintext','readonly']) !!}
						<small class="text-danger">{{ $errors->first('frd') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('contenedor', 'Contenedor', ['class'=>'form-control-label']) !!}
						{!! Form::text('contenedor', $inventario->contenedor->numero, ['class'=>'form-control form-control-plaintext','readonly']) !!}
						<small class="text-danger">{{ $errors->first('contenedor') }}</small>
					</div>
				</div>
				<div class="form-row">
					<div class="form-group col-2">
						{!! Form::label('patio_id', 'Patio', ['class'=>'form-control-label']) !!}
						{!! Form::select('patio_id', \App\Patio::pluck('nombre','id'),null, ['class' => 'form-control','placeholder'=>'Seleccionar Patio']) !!}
						<small class="text-danger">{{ $errors->first('patio_id') }}</small>
					</div>
					<div class="form-group col-2">
						<div class="form-group">
							{!! Form::label('estatus_in', 'Estatus', ['class'=>'form-control-label']) !!}
							{!! Form::text('estatus_in', $inventario->estatus_in, ['class' => 'form-control form-control-plaintext','readonly']) !!}
							<small class="text-danger">{{ $errors->first('estatus_in') }}</small>
						</div>
					</div>
					<div class="form-group col-2">
						<div class="form-group">
							{!! Form::label('condicion_in', 'Condicion', ['class'=>'form-control-label']) !!}
							{!! Form::text('condicion_in', $inventario->condicion_in, ['class' => 'form-control form-control-plaintext','readonly']) !!}
							<small class="text-danger">{{ $errors->first('condicion_in') }}</small>
						</div>
					</div>
					<div class="form-group col-6">
						{!! Form::label('consignatario_id', 'Consignatario', ['class'=>'form-control-label']) !!}
						{!! Form::select('consignatario_id', \App\Consignatario::pluck('nombre','id'),null, ['class'=>'form-control']) !!}
						<small class="text-danger">{{ $errors->first('consignatario_id') }}</small>
					</div>
				</div>
				<div class="form-row">
					<div class="form-group col-3">
						{!! Form::label('observaciones', 'Observaciones', ['class'=>'form-control-label']) !!}
						{!! Form::textarea('observaciones', null, ['class' => 'form-control', 'placeholder' => 'Observaciones', 'rows' => 4, 'cols' => 50]) !!}
						<small class="text-danger">{{ $errors->first('observaciones') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('bl', 'Bill Of Landing', ['class'=>'form-control-label']) !!}
						{!! Form::text('bl', null, ['class' => 'form-control', 'placeholder' => 'Observaciones']) !!}
						<small class="text-danger">{{ $errors->first('bl') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('precintos_in', 'Precintos', ['class'=>'form-control-label']) !!}
						{!! Form::text('precintos_in', null, ['class' => 'form-control', 'placeholder' => 'Precintos']) !!}
						<small class="text-danger">{{ $errors->first('bl') }}</small>
					</div>
					<div class="form-group col-3">
						{!! Form::label('booking_id', 'Booking/Asignación', ['class'=>'form-control-label']) !!}
						{!! Form::text('booking_id', null, ['class' => 'form-control form-control-plaintext', 'placeholder' => 'Booking','readonly']) !!}
						<small class="text-danger">{{ $errors->first('booking_id') }}</small>
					</div>
				</div>
				{!! Form::submit('Actualizar', ['class'=>'btn btn-primary']) !!}
				<a class="btn btn-warning" href="{{ url('inventarios') }}">Cancelar</a>
				{!! Form::close() !!}
			</div>
		</div>
	</div>
@endsection

@section('js')
	<script type="text/javascript">
	var app = new Vue({
		el: '#app',

		data: {
			linea_id: '{{ $inventario->linea_in_id }}',
			listLineas: [
				{ 'value': 0, 'label': 'Seleccion' }
			],
			buque_id: '{{ $inventario->buque_in_id }}',
			listBuques: [
				{ 'value': 0, 'label': 'Seleccion' }
			],
			viaje_id: '{{ $inventario->viaje_in_id }}',
			listViaje: [
				{ 'value': 0, 'label': 'Seleccion' }
			]
		},

		created(){
			if(this.linea_id > 0){
				axios.get('/listLineas')
				.then(response => {
					this.listLineas = response.data;
				})
				.catch(function(error) {
					console.log(error)
				});
			}

			if(this.linea_id > 0){
				axios.get('/' + this.linea_id + '/filterBuques')
				.then(response => {
					this.listBuques = response.data;
				})
				.catch(function(error) {
					console.log(error)
				});
			}

			if(this.buque_id > 0){
				axios.get('/' + this.buque_id +'/filterViajes')
				.then(response => {
					this.listViaje = response.data
				})
				.catch(function(error) {
					console.log(error)
				})
			}
		},

		watch: {
			linea_id: function(){
				if(this.linea_id > 0){
					axios.get('/' + this.linea_id + '/filterBuques')
					.then(response => {
						console.log(response.data)
						this.listBuques = response.data;
					})
					.catch(function(error) {
						console.log(error)
					})
				}
			},
			buque_id: function(){
				if(this.buque_id > 0){
					axios.get('/' + this.buque_id +'/filterViajes')
					.then(response => {
						this.listViaje = response.data
					})
					.catch(function(error) {
						console.log(error)
					})
				}
			}
		},

	})
	</script>
@endsection