@section ('questions')


    <div class="modal fade" id="modal_custom_professional" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<form id="customProForm" name="customForm" method="post" novalidate>
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" ng-click="services.reinitializeModal()" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
					<h4 class="modal-title" id="myModalLabel">Complete los datos de su negocio</h4>
					<div>
                        <div id="warningCustom" class="alert alert-danger alert-dismissible" role="alert"
                             style="display: none">
                            <a href="javascript:void(0)" class="close"
                               onclick="$('#warningCustom').fadeOut('fast')"
                               title="close">×</a>
                               <span> Debe Completar algun campo </span>
                        </div>
                        <div id="successCustom" class="alert alert-success alert-dismissible" role="alert" style="display: none">
                        	 <a href="javascript:void(0)" class="close" onclick="$('#successCustom').fadeOut('fast')"
                               title="close">×</a>                       
                            <strong>Se ha guardado exitosamente!</strong> 
                         </div>
                         <div id="errorCustom" class="alert alert-danger alert-dismissible" role="alert"
                             style="display: none">
                            <a href="javascript:void(0)" class="close"
                               onclick="$('#errorCustom').fadeOut('fast')"
                               title="close">×</a>
                               <strong>Error</strong><span> Ocurrio un error al guardar los campos </span>
                        </div>
                      </div>
				
				</div>
				<div class="modal-body">
					<section>
						<form role="form">
							<div class="process margin-side">
													
								<ul class="nav nav-pills" role="tablist">								
									<li>
										<a href="#pill-custom-service-1" ng-click="services.tab_pills('pill-custom-service-1')" role="tab" data-toggle="tab" title="Step 1"><i class="fa fa-dot-circle-o pr-5"></i> Informaci&oacute;n</a>
									</li>
									<li>
										<a href="#pill-custom-service-2" ng-click="services.tab_pills('pill-custom-service-2')" role="tab" data-toggle="tab" title="Step 1"><i class="fa fa-dot-circle-o pr-5"></i> Datos de inter&eacute;s</a>
									</li>
									<li>
										<a href="#pill-custom-service-3" ng-click="services.tab_pills('pill-custom-service-3')" role="tab" data-toggle="tab" title="Step 1"><i class="fa fa-dot-circle-o pr-5"></i> Datos extra</a>
									</li>
									
								</ul>
								<!-- Tab panes -->
								<div class="tab-content clear-style" >
									<div class="tab-pane active" id="pill-custom-service-1">
										<div class="row">
											<div class="col-md-12">
												<label class="control-label">Nombre de negocio</label>
												<input type="text" class="form-control" name="nombre_negocio" ng-model="services.custom.nombre_negocio" placeholder="Nombre del negocio">
											</div>							
										</div>
										<br>
										<div class="row">
											<div class="col-md-12">
												<div class="form-group has-feedback">
													<label class="control-label">¿ Qu&eacute; hace tu servicio ?</label>
													<textarea class="form-control" rows="6" ng-model="services.custom.descripcion_detallada" name="descripcion_detallada" placeholder="Descripci&oacute;n detallada"></textarea>
													<i class="fa fa-pencil form-control-feedback"></i>
												</div>
											</div>
										</div>
										<div class="row">

										</div>
					
										<div class="row">
											<a href="#" ng-click="services.tab_pills('pill-custom-service-2')" class="btn btn-default-transparent" style="float:right">Siguiente <i class="fa fa-chevron-right pl-10"></i></a>
										</div>
										
									</div>
									<div class="tab-pane" id="pill-custom-service-2">
										<div class="row">
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<label class="control-label">Año fundado</label>
													<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-model="services.custom.fecha_fundado" name="fecha_fundado" class="form-control" placeholder="Introducir Año">
													
												</div>
											</div>

											<div class="col-md-6">
												<div class="form-group has-feedback">
													<label class="control-label">N° Empleados</label>
													<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-model="services.custom.numero_empleados" name="numero_empleados" placeholder="Ej: 5 empleados" class="form-control">
													
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<label> Disponibilidad de Viaje</label>
												<div style="height: 40px; margin-bottom: 5px;">
			                                      
			                                        <label class="switch">
			                                            <input type="checkbox" ng-model="services.custom.viaje_preferencia"  >
			                                            <div class="slider round" ></div>
			                                        </label>
		                                        	
		                                    	</div>
	                                    	</div>
	                                    	<div class="col-md-6">
												<div class="form-group has-feedback">
													<label class="control-label">Distancia m&aacute;xima a viajar</label>
													<input type="text" class="form-control" ng-model="services.custom.distancia_viaje" name="services.custom.distancia_viaje"  placeholder="Ej: 80 Km" ng-disabled="!services.custom.viaje_preferencia">
												{{-- 	ng-disabled="services.custom.viaje_preferencia --}}
													
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<label class="control-label">Website negocio</label>
													<input type="text" class="form-control"  ng-model="services.custom.website_negocio" name="services.custom.website_negocio" placeholder="Ej: wwww.minegocio.com">
													
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<label class="control-label">Precio</label>
													<input type="text" class="form-control" ng-model="services.custom.rango_precio" name="services.custom.rango_precio" placeholder="$100 - 500 ">
													
												</div>
											</div>

											
											
										</div>

									

										<div class="row">
											<a href="#" ng-click="services.tab_pills('pill-custom-service-1')"  class="btn btn-default-transparent" style="float:left"><i class="fa fa-chevron-left pl-10"></i> Anterior </a>
											<a href="#" ng-click="services.tab_pills('pill-custom-service-3')"  class="btn btn-default-transparent" style="float:right">Siguiente <i class="fa fa-chevron-right pl-10"></i></a>
										</div>
									</div>
									<div class="tab-pane" id="pill-custom-service-3">
										<div class="row">
											<div class="col-md-12">
											
												<div class="form-group has-feedback">
													<label class="control-label">Ubicaci&oacute;n de su negocio</label>
													
													<input class="form-control" ng-model="services.custom.ubicacion" name="services.custom.ubicacion" placeholder="Introduzca una ubicaci&oacute;n"/>
													<i class="fa fa-pencil form-control-feedback"></i>
													
												</div>
											
											</div>
										</div>

										<div class="row">
											<div class="col-md-12">
												<div class="form-group has-feedback">
													<label class="control-label"> ¿Qu&eacute; beneficios trae tu negocio?</label>
													<textarea class="form-control" rows="6"  ng-model="services.custom.beneficios_detallado" name="services.custom.beneficios_detallado" placeholder="Beneficios detallados"></textarea>
													<i class="fa fa-pencil form-control-feedback"></i>
												</div>
											</div>
										</div>

										<div class="row">
											<a href="#" ng-click="services.tab_pills('pill-custom-service-2')"  class="btn btn-default-transparent" style="float:left"><i class="fa fa-chevron-left pl-10"></i> Anterior </a>
											
										</div>
										
									</div>
								</div>
								<!-- tabs end -->
							</div>	
						</form>
					</section>
					
				</div>
				<div class="modal-footer" >
				
					<button type="button" class="btn btn-sm btn-default" ng-click="services.sendCustomService($event,customProForm)" ng-cloak ng-show="services.step==3" >Guardar</button>
				</div>
			</div>
		  </form>
		</div>
	</div>


@stop