@extends('layouts.app')

@section('content')
<section class="section">
        <div class="section-header">
            <h3 class="page__heading">Orden de trabajo {{$ot->numOT}}</h3>
        </div>
        <div class="section-body">           
            <div class="row">
                <div class="col-lg-12">
                    <H4>Misceláneas Asignadas</H4>
        <br>
                <div class="table-responsive">
                    <table class="table">
                        <thead>
                            <tr>
                                <th scope="col">ATA CODE</th>
                                <th scope="col">Misc.</th>
                                <th scope="col">Descripción</th>
                                <th scope="col">Acciones</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($misc as $item)
                            <tr>
                            <td></td>
                            <td>{{$item->nombre}}</td>
                            <td>{{$item->descripcion}}</td>
                            <td>
                            <a href="#" onClick="funcIniciarMisc('{{$item->id}}', '{{$item->nombre}}', '{{$item->descripcion}}')"><button class="btn btn-primary m-1">Comenzar a Trabajar</button></a>
                            <a href="#" onClick="funcEditarMisc('{{$item->id}}', '{{$item->nombre}}', '{{$item->descripcion}}')"><button class="btn btn-warning m-1">Editar</button></a>   
                            <a href="#" onClick="funcFinalizarMisc('{{$item->id}}', '{{$item->nombre}}', '{{$item->descripcion}}')"><button class="btn btn-danger m-1">Finalizar</button></a>  
                            </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                </div>
            </div>
        </div>
    </section>


     <!--FINALIZAR MISCELANEA-->
<div id="finzalizarMiscelanea" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">

            <div class="modal-header">
                <h5 class="modal-title">¿Desea Finalizar la Miscelánea?</h5>
                <button type="button" aria-label="Close" class="close outline-none" data-dismiss="modal">×</button>
            </div>

            <div class="container m-2">
              
            <form action="{{ route('/finalizar_ot', $ot->id) }}" method="post">
                        @csrf
                        <div class="row align-items-center">
                        <div class="col-md-6">
                                <div class="form-group">
                                <input type="checkbox" id="statusot" name="status"/>
                                <label>Sí</label>
                                </div>
                            </div>

                            <div class="col-md-4">
                            <button type="submit" class="btn btn-primary">Actualizar Status</button> 
                            </div>
                        </div>    
                </form>                            
            </div>
        </div>
    </div>
</div>



    <!--COMENZAR A TRABAJAR MISCELANEA-->
<div id="iniciarMiscelanea" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">

            <div class="modal-header">
                <h5 class="modal-title">¿Confirma el comienzo de trabajo en la Miscelánea?</h5>
                <button type="button" aria-label="Close" class="close outline-none" data-dismiss="modal">×</button>
            </div>

            <div class="container m-2">
              
            <form action="{{ route('/iniciar_ot', $ot->id) }}" method="post">
                        @csrf
                        <div class="row align-items-center">
                        <div class="col-md-6">
                                <div class="form-group">
                                <input type="checkbox" id="statusot" name="status"/>
                                <label>Sí</label>
                                </div>
                            </div>

                            <div class="col-md-4">
                            <button type="submit" class="btn btn-primary">Actualizar Status</button> 
                            </div>
                        </div>    
                </form>                            
            </div>
        </div>
    </div>
</div>


    <!--Modal Editar Miscelanea-->
<div id="editarMiscelanea" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">

            <div class="modal-header">
                <h5 class="modal-title">ATA CODE</h5>
                <button type="button" aria-label="Close" class="close outline-none" data-dismiss="modal">×</button>
            </div>

            <div class="container m-2">
                @if ($errors->any())                                                
                            <div class="alert alert-dark alert-dismissible fade show" role="alert">
                            <strong>¡Revise los campos!</strong>                        
                                @foreach ($errors->all() as $error)                                    
                                    <span class="badge badge-danger">{{ $error }}</span>
                                @endforeach                        
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                            </div>
                @endif

                
              
                <form action="/edit_misc" method="post">
                        @csrf
                        <div class="row align-items-center">
                        <div class="col-md-4">
                                <div class="form-group">
                                   <label>Acción Correctiva</label>
                                   <input type="text" name="acorrectiva" class="form-control">
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="form-group">
                                   <label>Hrs. Lab. Misc.</label>
                                   <input type="text" name="hrslabmisc" class="form-control">
                                </div>
                            </div>                           
                        </div>   
                        
                        <div class="row">
                        <div class="col-md-4">
                                <div class="form-group">
                                   <label>Discrepancias</label>
                                   <input type="text" name="hrslabmisc" class="form-control">
                                </div>
                            </div> 

                            <div class="col-md-4">
                                <div class="form-group">
                                   <label>Hrs. Lab. Disc.</label>
                                   <input type="text" name="hrslabmisc" class="form-control">
                                </div>
                            </div> 

                        <div class="col-md-4">
                            <button type="submit" class="btn btn-primary">Actualizar</button> 
                            </div>
                        </div>
                        </div>
                </form>  
                          
            </div>
        </div>
    </div>
</div>

    <script>

function funcIniciarMisc(id, nombre, descripcion){
    jQuery("#iniciarMiscelanea").modal('show');
 }

 function funcEditarMisc(id, nombre, descripcion){
    jQuery("#editarMiscelanea").modal('show');
 }

 function funcFinalizarMisc(id, nombre, descripcion){
    jQuery("#finzalizarMiscelanea").modal('show');
 }

 document.getElementById("statusot").required = true;
</script>
@endsection