@extends('menu/menu')
<style>
.mostrar {
  display: none;

}
@media (max-width: 768px) {
    .mostrar {
    display: block;
    
  }
}
</style>
{{-- <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js%22%3E</script> --}}
<script src="{{ asset('js/jquery-3.4.1.min.js') }}" ></script>
{{-- <link  href="{{ asset('css/a&a_style.css') }}" href="a&a_style.css" rel="stylesheet" type="text/css"> --}}



@section('content')

@if ( session('mensaje') )
    <div class="alert alert-success">{{ session('mensaje') }}</div>
@endif
 	<!-- body code goes here -->
	{{-- {{$datos_asignacion}} --}}
	  
     <div class="container-fluid">
	    <div class="container">
			<!-- BARRA DE BUSQUEDA -->
		    <h1 style="margin-top: 50px">Instalación</h1>
    <div class="mostrar" style="text-align: right">
       <a  href="javascript: history.go(-1)"><img src="img/volver.png" ></a>

    </div>
			
	<form action="{{route('filtro_tecnico')}}" method="GET">
			<div class="row reex" style="height: auto">
				
				
		
	
            	<div class="container col-12" style="margin-top: 10px">
					<h2><strong>Filtrar por</strong></h2>
				</div>
				
				<div class="container col-sm-3 form-group">
					<label for="fecha"><h2>*Fecha (obligatorio)</h2></label>
      				<input type="date"  class="form-control" id="fecha" name="fecha">
				</div>
				<div class="container col-sm-2 form-group">
					<label for="email"><h2>Comuna</h2></label>
					<select name="comuna" class="custom-select">
						<option selected disabled >seleccionar</option>
						@if (!empty($comuna_retiros))
						  @foreach ($comuna_retiros as $comuna_retiros_)
							@if ($comuna_retiros_->Cscomuna != null)    
							<option  value="{{ $comuna_retiros_->Cscomuna }}">{{ucfirst(strtolower($comuna_retiros_->Cscomuna))}}             
		           
							@endif                    
						  @endforeach
					   
						@endif
    				</select>
				</div>
				<div class="container col-sm-2 form-group">
					<label for="email"><h2>Asignación</h2></label>
					<select name="asignacion" class="custom-select">
						<option selected disabled >seleccionar</option>

							@if (!empty($asignaciones))
							  @foreach ($asignaciones as $asignaciones_)
								@if ($asignaciones_->tipo != null)    
								<option  value="{{ $asignaciones_->tipo }}">{{ucfirst(strtolower($asignaciones_->tipo))}}             
					   
								@endif                    
							  @endforeach
						   
							@endif
    				</select>
				</div>
				<div class="container col-sm-2 form-group">
					<label for="serie"><h2>Nº serie</h2></label>
					<input type="" class="form-control" id="" placeholder="Nº de Serie" name="serie">
				</div>
				<div class="container col-sm-2 form-group">
					<label for="estado"><h2>Estado</h2></label>
      				<select name="estado" class="custom-select">
						<option selected disabled >seleccionar</option>

						@if (!empty($estado_retiros))
						  @foreach ($estado_retiros as $estado_retiros)
							@if ($estado_retiros->estado_asignacion != null)
									@if($estado_retiros->estado_asignacion == "tarea_asignada")
									<option  value="{{ $estado_retiros->estado_asignacion }}">Tarea Asignada            

									@else 
								     	<option  value="{{ $estado_retiros->estado_asignacion }}">{{ucfirst(strtolower($estado_retiros->estado_asignacion))}}             

									@endif    
				   
							@endif                    
						  @endforeach
					   
						@endif
    				</select>
				</div>
				<div class="container col-sm-1 form-group"></div>	

		


				
			</div>
			<!-- FIN BARRA DE BUSQUEDA -->
			<div class="container" style="margin-top: 20px">
				<button type="buscar" class="btn btn-info float-sm-right">Buscar
				</button>
			</div>
		  </form>		
		</div>
		  
     
		  
		<!-- TABLA DE RESULTADOS DE BUSQUEDA --> 
          <div class="container reex" style="margin-top: 100px">
            <div class="conteiner row rein table-responsive-lg" style="border: 5px solid #e8f5fe">
              <table class="table table-sm table-bordered table-responsive-md table-striped table-hover">
                <!-- ENCABEZADO -->
                <thead>
                  <tr>
				  <th class="container-2"><h3>Fecha (Visita)</h3></th>
					<th class="container-2"><h3>Comuna</h3></th>
                    <th class="container-4"><h3>Dirección y Cliente</h3></th>
					<th class="container-2"><h3>Estado</h3></th>
					<th class="container-2"><h3>Serie</h3></th>
                    <th class="container-2"><h3>Asignación</h3></th>
                    <th class="container-2"><h3>Acciones</h3></th>
                  </tr>
                </thead>
                <!-- FIN ENCABEZADO -->
                
                <!-- RESULTADOS -->
                <tbody>
      
                  

              @if(!empty($datos_asignacion))
              @foreach ($datos_asignacion   as $los_datos)
              <tr>
                  
             
					<td>{{Carbon\Carbon::createFromDate($los_datos->fecha_visita)->format('d-m-Y')}}</td>
					
{{-- 
					<td>{{$los_datos->Csdireccion}} ({{$los_datos->Cscliente}} )</td>  
					
					@if($los_datos->estado_asignacion == "pendiente")
					    <td class="pendiente" >{{$los_datos->estado_asignacion}}</td>
					@elseif($los_datos->estado_asignacion == "finalizado")
						<td class="finalizado" >{{$los_datos->estado_asignacion}}</td>
					@elseif($los_datos->estado_asignacion == "rechazado")
						<td class="rechazado" >{{$los_datos->estado_asignacion}}</td>
					@else
						<td>{{$los_datos->estado_asignacion}}</td>
					@endif --}}

					<td>{{$los_datos->csComuna ?? ''}}</td>
					<td>{{$los_datos->Csdireccion}} ({{$los_datos->Cscliente}} )</td>  
				

					{{-- @if($los_datos->estado_asignacion == "pendiente") --}}
                    @if($los_datos->estado_asignacion == "tarea_asignada")
                        <td class="pendiente" style="text-transform: ">Tarea Asignada</td>
                        @elseif($los_datos->estado_asignacion == "pendiente") 
                        <td class="pendiente" style="text-transform: ">{{ucfirst($los_datos->estado_asignacion)}}</td>
                    @elseif($los_datos->estado_asignacion == "finalizado")
                        <td class="finalizado" style="text-transform: ">{{ucfirst($los_datos->estado_asignacion)}}</td>
                    @elseif($los_datos->estado_asignacion == "rechazado")
                        <td class="rechazado" style="text-transform: ">{{ucfirst($los_datos->estado_asignacion)}}</td>
                    @else
                        <td>{{$los_datos->estado_asignacion}}</td>
                    @endif
					<td style="text-transform: ">{{ucfirst($los_datos->CsSerie)}}</td>
					<td style="text-transform: ">{{ucfirst($los_datos->tipo)}}</td>
					<td>
                            <div style="text-align: center">        
                                {{-- preguntamos si el estado que viene, esta finalizado --}}
                                @if($los_datos->estado_asignacion != "finalizado")                            
                                       {{-- preguntamos si el tipo de datos es de intalacion o retiro --}}
                                    @if ($los_datos->tipo == "instalacion")
                                    <a href="{{route('go.ver_check',Crypt::encryptString($los_datos->id))}}"  role="button" title="Revisar"><img src="{{ asset('Botones/Botones/revisar_m.png') }}" alt="" style="margin: 2px 0px"/></a>
                                    <a href="{{route('go.completando_check',Crypt::encryptString($los_datos->id))}}" role="button" title="Editar"><img src="{{ asset('Botones/Botones/Editar.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                    <a role="button"  class="historial_instalacion" data-id="{{$los_datos->id}}" title="Historial"><img src="{{ asset('Botones/Botones/Historial.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                        @if($los_datos->estado_asignacion != "pendiente" and $los_datos->estado_asignacion != "tarea_asignada")
                                        <a   href="#"  class="motivo_rechazo" data-motivo="{{$los_datos->motivo_rechazado}}" role="button" title="Motivo"><img src="{{ asset('Botones/Botones/advertir.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                        @endif
                                    @elseif($los_datos->tipo == "retiro")
                                    <a role="button" title="Revisar"><img src="{{ asset('Botones/Botones/revisar_m.png') }}" alt="" style="margin: 2px 0px"/></a>
                                    <a href="{{route('go.ChecklistRetiros',Crypt::encryptString($los_datos->id))}}" role="button" title="Editar"><img src="{{ asset('Botones/Botones/Editar.png') }}"  alt="" style="margin: 2px 0px"/></a>    
                                    <a role="button"  class="historial_retiro" data-id="{{$los_datos->id}}" title="Historial"><img src="{{ asset('Botones/Botones/Historial.png') }}"  alt="" style="margin: 2px 0px"/></a>                                    
                                        @if ($los_datos->motivo_reasignado != "" || $los_datos->motivo_reasignado != null)
                                        <a   href="#" class="motivo_rechazo" data-motivo="{{$los_datos->motivo_reasignado}}" c role="button" title="Motivo"><img src="{{ asset('Botones/Botones/advertir.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                        @endif
                                        {{-- {{$los_datos->motivo_reasignado ?? "nada"}} --}}
                                        @if($los_datos->estado_asignacion != "pendiente" and $los_datos->estado_asignacion != "tarea_asignada")
                                        <a   href="#" class="motivo_rechazo" data-motivo="{{$los_datos->motivo_rechazado}}" c role="button" title="Motivo"><img src="{{ asset('Botones/Botones/advertir.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                        @endif
                                    @endif                    
                                @else                                 
                                    @if ($los_datos->tipo == "instalacion")
                                    <a href="{{route('go.ver_check',Crypt::encryptString($los_datos->id))}}"  role="button" title="Revisar"><img src="{{ asset('Botones/Botones/revisar_m.png') }}" alt="" style="margin: 2px 0px"/></a>
                                    <a role="button" class="historial_instalacion" data-id="{{$los_datos->id}}" title="Historial"><img src="{{ asset('Botones/Botones/Historial.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                    @elseif($los_datos->tipo == "retiro")
                                    <a  href="{{route('go.ver_checkretiro',Crypt::encryptString($los_datos->id))}}" role="button" title="Revisar"><img src="{{ asset('Botones/Botones/revisar_m.png') }}" alt="" style="margin: 2px 0px"/></a>
                                    <a role="button" class="historial" data-id="{{$los_datos->id}}"     title="Historial"><img src="{{ asset('Botones/Botones/Historial.png') }}"  alt="" style="margin: 2px 0px"/></a>
                                    @endif
                                @endif
                            </div>
                        </td>
               </tr>
          
             
        
              @endforeach
              @endif
                    
                </tbody>
                <!-- FIN RESULTADOS -->
                </table>

            
              </div>
      
          </div>
          <!-- FIN TABLA DE RESULTADOS DE BUSQUEDA -->
          
	  </div>
	  <!--Modal Historial-->
<div class="modal" id="modalHistorial">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title"> Historial</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>               
            <div class="modal-body">
                <table class="table table-bordered table-responsive-lg table-striped">
                    <thead>
                        <th scope="col">N° de serie</th>
                        <th scope="col">Direccion</th>
                        <th scope="col">Cliente</th>
                        <th scope="col">Fecha</th>
                        <th scope="col">Contador B/N</th>
                        <th scope="col">Contador Color</th>
                        <th scope="col">Observaciones</th>
                    </thead>
                    <tbody id="agregar_historial_retiro"></tbody>
                </table>
            </div>             
        </div>
    </div>
</div>      
<!--Modal Historial instalacion-->
<div class="modal" id="modalHistorial_instalacion">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title"> Historial</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>               
            <div class="modal-body">
                <div class="container"> 
                    <table class="table table-bordered table-responsive table-striped">
                        <thead>
                            <th scope="col">N° de atencion</th>
                            <th scope="col">N° de serie</th>
                            <th scope="col">Direccion</th>
                            <th scope="col">Cliente</th>
                            <th scope="col">Fecha</th>
                            <th scope="col">Contador B/N</th>
                            <th scope="col">Contador Color</th>
                            <th scope="col">Tipo Visita</th>
                            <th scope="col">Observaciones</th>
                            <th scope="col">Accesorios</th>
                        </thead>
                        <tbody id="agregar_historial_instalacion"></tbody>
                    </table>
                </div>
            </div>             
        </div>
    </div>
</div>

	  			<!--Modal  -->
				  <div class="modal" id="modalRechazo">
					<div class="modal-dialog">
					  <div class="modal-content">

						<!-- Modal Header -->
						<div class="modal-header">
						  <h4 class="modal-title"> Observaciones</h4>
						  <button type="button" class="close" data-dismiss="modal">&times;</button>
						</div>
               
                                <div class="modal-body">
                                        <label for="cambio"> <h3>Observaciones</h3></label>
                                        <textarea class="form-control" style="pointer-events: none"  readonly="readonly" name="motivorechazado" value="" rows="4"  id="motivo">
											
										</textarea>	
                                </div>
             
					  </div>
					</div>
				  </div> 
	  

@endsection

<script>
	$(document).ready(function(){
   
	  $('.motivo_rechazo').click(function() {
	
	//alert($(this).attr("data-motivo"));
//
		$("#motivo").text($(this).attr("data-motivo"));
			$("#modalRechazo").modal('show');
	   });
	   $('.historial_retiro').click(function(){
            id = $(this).attr("data-id");
            $.ajax({
                headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                type: 'POST',
                url: "{{ route('go.historial_check') }}",
                data: {
                'id': id
                },
                success: function(data) {
                    $("#modalHistorial").modal('show');
                    $(data).each(function(i, v) {
                    if(v.observacion == null){
                        v.observacion = "";
                    }
                    $('#agregar_historial_retiro').append(
                        '<tr>' +
                            '<td>' + v.csSerie +'</td>' +
                            '<td>'+ v.csCiudad +', '+ v.csComuna + '</td>' +
                            '<td>' + v.csCliente +'</td>' +
                            '<td>' + v.fecha_asignado + '</td>' +
                            '<td>' + v.cnContador + '</td>' +
                            '<td>' + v.cnContador_color + '</td>' +
                            '<td>' + v.observacion + '</td>' +
                        '</tr');
                })
                },
                error: function(xhr, status) {
                    alert('Disculpe, Ha ocurrido un problema, Intente mas tarde');
                }
            })
        })
        $('.historial_instalacion').click(function(){
            id = $(this).attr("data-id");
            $.ajax({
                headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                type: 'POST',
                url: "{{ route('go.historial_check_instalacion') }}",
                data: {
                'id': id
                },
                success: function(data) {
                    $('#agregar_historial_instalacion').empty();
                    $("#modalHistorial_instalacion").modal('show');
                    $('#agregar_historial_instalacion').append(data);
                },
                error: function(xhr, status) {
                    alert('Disculpe, Ha ocurrido un problema, Intente mas tarde');
                }
            })
        })
	})
	</script>