<div class="row">
	<div class="card w-100">
		<div class="card-footer">
			<h4>
				<i class="fa fa-id-card"></i>
				Certificados por vehiculo
			</h4>
		</div>
		<div class="card-body" ng:show="spinner">
			<h4 class="text-center">
				<i class="fa fa-spin fa-spinner"></i>
				Cargando
			</h4>
		</div>
		<div class="card-body" ng:show="!spinner">
			<div class="row">
				<div class="col-xs-12 col-sm-6">
					<button class="btn btn-primary" ng:click="openModal(1)">
						<i class="fa fa-plus"></i>
						Agregar Certificado
					</button>
				</div>
				<div class="col-xs-12 col-sm-6">
					<input type="text" class="form-control" placeholder="Buscar" ng:model="search">
				</div>
			</div>
			<br>
			<div class="table-responsive table-responsive-vertical">
				<table class="table">
					<thead>
						<th class="text-center">Acciones</th>
						
						<th class="text-left">Vehiculo</th>
						<th class="text-left">Tipo Certificado</th>
						<th class="text-center">Detalle</th>
						<th class="text-center">Fecha emision</th>
						<th class="text-center">Fecha vencimiento</th>
						<th class="text-center">Documento</th>
						<th class="text-center">Estado</th>
					</thead>
					<tbody>
						<tr ng:repeat="cervehi in cervehiculo | filter: search">
							<td class="text-center">
								
								<button class="btn btn-warning" ng:click="openModal(3,cervehi)" >
									<i class="fa fa-edit"></i>
								</button>

								<button class="btn btn-danger" ng:click="delete(cervehi)" >
									<i class="fa fa-trash"></i>
								</button>

								
								<small class="text-center" ng:if="descripcion.deleted_at">Usuario eliminado</small>
							</td>
							
							<td class="text-left" ng:bind="cervehi.vehiculo.placa"></td>
							<td class="text-left" ng:bind="cervehi.tipocertificado.tipo"></td>
							<td class="text-left" ng:bind="cervehi.descripcion"></td>
							<td class="text-left" ng:bind="cervehi.fecha_emision"></td>
							<td class="text-left" ng:bind="cervehi.fecha_vencimiento"></td>

							<td class="text-center">

								<button ng:click="dowloadfile(cervehi)" ng:if="cervehi.documento">
									<i class="fa fa-download"></i>
								</button>
								
								<small class="text-center" ng:if="descripcion.deleted_at">Usuario eliminado</small>
							</td>

							<td class="text-center">
								<span class="badge badge-success" ng:show="!cervehi.estado">ACTIVO</span>
								<span class="badge badge-danger" ng:show="cervehi.estado">INACTIVO</span>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id="modal_edit" tabindex="-1" role="dialog">
	<div class="modal-dialog" role="document">
	    <div class="modal-content">
	      	<div class="modal-header">
	        	<h5 class="modal-title" ng:bind="modal.title"></h5>
	        	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
	          		<span aria-hidden="true">&times;</span>
	        	</button>
	      	</div>
	      	<div class="modal-body">
	        	<form ng:submit="save()" id="form_edit" name="form_edit">
	        		<fieldset>
						<div class="form-group">
							<label for="">Vehiculo</label>
							<select class="form-control" id="cbx_veh" ng:options="vehiculo.id as vehiculo.placa for vehiculo in vehiculos" ng:model="modal.model.id_vehiculo">
								<option value="">Seleccionar</option>
							</select>
							<small ng:show="modal.fails.id_vehiculo" ng:repeat="fail in modal.fails.id_vehiculo" ng:bind="fail" class="text-danger"></small>
						</div>

						<div class="form-group">
							<label for="">Tipo Certificado</label>
							<select class="form-control" id="cbx_cert" ng:options="tipocer.id as tipocer.tipo for tipocer in tipocert" ng:model="modal.model.id_tipocertificado">
								<option value="">Seleccionar</option>
							</select>
							<small ng:show="modal.fails.id_tipocertificado" ng:repeat="fail in modal.fails.id_tipocertificado" ng:bind="fail" class="text-danger"></small>
						</div>
						
						<div class="form-group">
	        				<label for="">Descripcion del certificado</label>	
	        				<input type="text" class="form-control"  id="idescripcion" name="descripcion" ng:model="modal.model.descripcion">
	        				<small ng:show="modal.fails.descripcion" ng:repeat="fail in modal.fails.descripcion" ng:bind="fail" class="text-danger"></small>
	        			</div>
	        			<div class="row" ng:if="!modal.edit">
							<div class="col-xs-12 col-md-5">
								<div class="form-group">
									<label for="">Fecha emisión </label>
									<input type="date" class="form-control border-success" ng:model="modal.model.fecha_emision" required>  
									<small ng:show="modal.model.fecha_emision" ng:repeat="fail in modal.model.fecha_emision" ng:bind="fail" class="text-danger"></small>
								</div>	
							</div>
							<div class="col-xs-8 col-md-1"></div>
							<div class="col-xs-12 col-md-5">
								<div class="form-group">
									<label for="">Fecha vencimiento</label>	
									<input type="date" class="form-control border-success" ng-model="modal.model.fecha_vencimiento" required>`
									<small ng:show="modal.model.fecha_vencimiento" ng:repeat="fail in modal.model.fecha_vencimiento" ng:bind="fail" class="text-danger"></small>
								</div>	
							</div>
						</div>

						
						<div class="row" ng:if="!modal.edit">
							<label for="formFile" class="form-label">Cargar documento (.pdf)</label>
							<input class="form-control" type="file" name="formFile_pf" id="formFile_pf" ng:model="modal.model.archivo" accept="application/pdf">
						</div>

						<div class="custom-control custom-checkbox mr-sm-2" ng:if="modal.edit">
					        <input type="checkbox" class="custom-control-input" id="customControlAutosizing" ng:model="modal.model.estado">
					        <label class="custom-control-label" for="customControlAutosizing">Certificado Activo</label>
					   	</div>


	        		</fieldset>
	        	</form>
		    </div>
		    <div class="modal-footer">
	        	<button type="submit" class="btn btn-info btn-block" form="form_edit" ng:disabled="modal.spinner">
	        		<any ng:show="!modal.spinner">Guardar Datos</any>
	        		<any ng:show="modal.spinner">
	        			<i class="fa fa-spin fa-spinner"></i>
	        			Guardando
	        		</any>
	        	</button>
	      	</div>
	    </div>
	</div>
</div>

<div class="modal fade" id="modal_editdisebled" tabindex="-1" role="dialog">
	<div class="modal-dialog" role="document">
	    <div class="modal-content">
	      	<div class="modal-header">
	        	<h5 class="modal-title" ng:bind="modal.title"></h5>
	        	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
	          		<span aria-hidden="true">&times;</span>
	        	</button>
	      	</div>
	      	<div class="modal-body">
	        	<form ng:submit="saveup()" id="form_editdisebled" name="form_editdisebled">
	        		<fieldset>
						<div class="form-group">
							<label for="">Vehiculo</label>
							<select class="form-control" id="cbx_veh" ng:options="vehiculo.id as vehiculo.placa for vehiculo in vehiculos" ng:model="modal.model.id_vehiculo" disabled>
								<option value="">Seleccionar</option>
							</select>
							<small ng:show="modal.fails.id_vehiculo" ng:repeat="fail in modal.fails.id_vehiculo" ng:bind="fail" class="text-danger"></small>
						</div>

						<div class="form-group">
							<label for="">Tipo Certificado</label>
							<select class="form-control" id="cbx_cert" ng:options="tipocer.id as tipocer.tipo for tipocer in tipocert" ng:model="modal.model.id_tipocertificado" disabled>
								<option value="">Seleccionar</option>
							</select>
							<small ng:show="modal.fails.id_tipocertificado" ng:repeat="fail in modal.fails.id_tipocertificado" ng:bind="fail" class="text-danger"></small>
						</div>
						
						<div class="form-group">
	        				<label for="">Descripcion del certificado</label>	
	        				<input type="text" class="form-control"  id="idescripcion" name="descripcion" ng:model="modal.model.descripcion" disabled>
	        				<small ng:show="modal.fails.descripcion" ng:repeat="fail in modal.fails.descripcion" ng:bind="fail" class="text-danger"></small>
	        			</div>
	        			
						<div class="custom-control custom-checkbox mr-sm-2" >
					        <input type="checkbox" class="custom-control-input" id="customControlAutosizing" ng:model="modal.model.estado">
					        <label class="custom-control-label" for="customControlAutosizing">Certificado Activo</label>
					   	</div>


	        		</fieldset>
	        	</form>
		    </div>
		    <div class="modal-footer">
	        	<button type="submit" class="btn btn-info btn-block" form="form_editdisebled" ng:disabled="modal.spinner">
	        		<any ng:show="!modal.spinner">Guardar Datos</any>
	        		<any ng:show="modal.spinner">
	        			<i class="fa fa-spin fa-spinner"></i>
	        			Guardando
	        		</any>
	        	</button>
	      	</div>
	    </div>
	</div>
</div>