@extends('reclamo')
@section('title', 'Gestión de reclamos COMERCIAL')
@section('icon', 'fa fa fa-user')


@section('contenido_general')

    <!-------------------MODAL AGREGAR RECLAMO -------------------------->
    <div class="col-lg-12 col-sm-12">
        <div class="modal fade bs-example-modal-lg" role="dialog" aria-labelledby="modalAgregarReclamo"
            id="modalAgregarReclamo">
            <div class="modal-dialog modal-lg" role="document" style="width: 95%">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title centrar" id="TitleReclamo">Nuevo Reclamo</h4>
                        <input type="hidden" id="codReclamo">
                    </div>
                    <div class="modal-body">
                        <div class="row" style="padding-right: 50px;padding-left: 50px;">
                            <input type="hidden" value="{{ csrf_token() }}" id="token">

                            <div class="col-md-3" style="color:#008000">
                                <div class="form-group row">
                                    <label for="cboCliente" class="control-label col-md-2 input-sm">Cliente:</label>
                                    <div class="col-md-10">


                                        <select class='form-control input-sm' id='cboCliente' name="cboCliente"
                                            style="width:100%">
                                            <option value="-1">Seleccione Cliente</option>
                                        </select>


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

                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">
                                    <label for="cboContrato" class="control-label col-md-4 input-sm ">Contrato:</label>
                                    <div class="col-md-8">


                                        <select class='form-control input-sm' id='cboContrato' name="cboContrato"></select>


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

                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">
                                    <label for="cboPrioridad" class="control-label col-md-4 input-sm ">Prioridad:</label>
                                    <div class="col-md-8">

                                        <select class='form-control input-sm' id='cboPrioridad'
                                            name="cboPrioridad"></select>


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

                            <div class="col-md-3" style="color:#008000">
                                <div class="form-group row">
                                    <label for="cboModalidad" class="control-label col-md-3 input-sm ">Modalidad:</label>
                                    <div class="col-md-9">

                                        <select class='form-control input-sm' id='cboModalidad'
                                            name="cboModalidad"></select>

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

                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">
                                    <label for="txtHO"
                                        class="control-label col-md-2 col-md-offset-2 input-sm">H.O:</label>
                                    <div class="col-md-8">
                                        <input type='text' class="form-control input-sm" id="txtHO" name="txtHO" />
                                    </div>
                                </div>
                            </div>


                            <div class="col-md-3" style="color:#008000">
                                <div class="form-group row">
                                    <label for="txtContacto" class="control-label col-md-3 input-sm">Contacto:</label>
                                    <div class="col-sm-9">

                                        <input type="text" class='form-control input-sm' id='txtContacto'
                                            name="txtContacto">

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

                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">
                                    <label for="txtCelular" class="control-label col-md-4 input-sm ">Celular:</label>
                                    <div class="col-md-8">

                                        <input type="text" class='form-control input-sm' id='txtCelular'
                                            name="txtCelular">

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




                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">
                                    <label for="txtCelular2" class="control-label col-md-4 input-sm ">Celular2:</label>
                                    <div class="col-md-8">

                                        <input type="text" class='form-control input-sm' id='txtCelular2'
                                            name="txtCelular2">

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

                            <div class="col-md-3" style="color:#008000">
                                <div class="form-group row">
                                    <label for="txtCorreo" class="control-label col-md-3 input-sm ">Correo:</label>
                                    <div class="col-sm-9">

                                        <input type="text" class='form-control input-sm' id='txtCorreo'
                                            name="txtCorreo">

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


                            <div class="col-md-2" style="color:#008000">
                                <div class="form-group row">


                                    <label for="txtHO" class="control-label col-md-2 col-md-offset-2 input-sm"></label>

                                    <div class="col-md-2">
                                        <button class="btn btn-md btn-success" id='btnSolicitudAtencion'
                                            value="Descargar Solicitud" name="btnSolicitudAtencion">
                                            <span aria-hidden="true"><img id="descargaArchivo" src="descarga.png"
                                                    height="20" width="20">Solicitud</span>
                                        </button>
                                    </div>


                                </div>
                            </div>



                            <div class="col-md-12">
                                <br>
                                <br>

                            </div>

                            <!--INICIO NUEVA OPCION DE FECHA INSPECCION-->
                            <div class="col-md-12">
                                <!--<div class="alert alert-danger" role="alert" id="alerta-asignar-costo">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    Es necesario asignar costo a las observaciones.
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    </div>-->

                                <div class="col-md-2">

                                    <div style="display: none">
                                        <div class="form-group row">
                                            <label for="txtFechaRegistro"
                                                class="control-label col-md-offset-1 input-sm">Inspección:</label>
                                            <div>
                                                <div class='input-group date' id='dtptxtFechaRegistro'>


                                                    <input type='date' class="form-control input-sm"
                                                        id="txtFechaInspeccion" name="txtFechaRegistro" />
                                                    <span class="input-group-addon">
                                                        <span class="glyphicon glyphicon-calendar"></span>
                                                    </span>


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

                                    <div style="color:#008000">
                                        <div class="form-group row">
                                            <label for="txtFechaRegistro" class="control-label input-sm">Fecha
                                                Reclamo:</label>
                                            <div>
                                                <div class='input-group date' id='dtptxtFechaRegistro'>


                                                    <input type='date' class="form-control input-sm"
                                                        id="txtFechaRegistro" name="txtFechaRegistro"
                                                        max="2025-03-15" />
                                                    <span class="input-group-addon">
                                                        <span class="glyphicon glyphicon-calendar"></span>
                                                    </span>


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

                                    <div style="color:#008000">
                                        <div class="form-group row">
                                            <label for="txtFechaRegistro" class="control-label input-sm">Fecha
                                                Coordinación:</label>
                                            <div>
                                                <div class='input-group date' id='dtptxtFechaRegistro'>


                                                    <input type='date' class="form-control input-sm"
                                                        id="txtFechaCoordinacion" name="txtFechaRegistro"
                                                        max="2025-03-15" />
                                                    <span class="input-group-addon">
                                                        <span class="glyphicon glyphicon-calendar"></span>
                                                    </span>


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

                                </div>


                                <div class="col-md-8" id="divTablaAgregarObservacion">
                                    <table class="table table-hover table-responsive compact table-striped"
                                        id="tblAgregarFechaInspeccion">
                                        <thead>
                                            <tr>
                                                <th class="centrarRight" style="color:#008000">Fecha Inspección</th>
                                                <th class="centrarRight" style="color:#008000">Fijar Reunión</th>
                                                <th class="centrarRight" style="color:#3e9efe"> Se realizó</th>
                                                <th class="centrarRight" style="color:#3e9efe">¿Quién realizo la
                                                    inspección?</th>
                                                <th class="centrarRight"><span
                                                        class='add-fechaInspeccion glyphicon glyphicon-plus'></span>
                                                </th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>


                                <div class="col-md-2">
                                    <div style="color:#3e9efe">
                                        <div class="form-group row">
                                            <label for="txtFechaInforme"
                                                class="control-label cold-md-offset-1 input-sm">&nbsp;&nbsp;Fecha
                                                Informe:</label>
                                            <div>
                                                <div class='input-group date' id='dtptxtFechaRegistro'>


                                                    <input type='date' class="form-control input-sm"
                                                        id="txtFechaInforme" name="txtFechaInforme" readonly />
                                                    <span class="input-group-addon" readonly>
                                                        <span class="glyphicon glyphicon-calendar" readonly></span>
                                                    </span>




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

                                    <div class="form-group row">
                                        <div>
                                            <input type="hidden" id="txtAutogenerado">
                                            <label for="cboHojaConformidad" class="control-label input-sm ">Hoja de
                                                Conformidad:</label>
                                        </div>

                                        <div>
                                            <button class="btn guardar-archivo-conformidad">
                                                <span aria-hidden="true"><img id="imagenArchivo" src="pdfVacio.png"
                                                        height="40" width="40" /></span>
                                            </button>

                                            <button id="botonDescarga">
                                                <span aria-hidden="true"><img id="descargaArchivo" src="descarga.png"
                                                        height="20" width="20" /></span>
                                            </button>

                                            <!--if (in_array(session('cod_cargo'), [28, 49, 33, 61, 22, 1, 65,70]))-->
                                            <!--<input name="file" id="fileDetalleReclamo" type="file">-->

                                        </div>
                                    </div>

                                </div>


                            </div>
                            <!--FIN NUEVA OPCION DE FECHA INSPECCION-->
                            <!-- CUADRO QUE ENCIERRA ETIQUETAS PROYECTO, UBICACION, TIPO DE CASA ETC-->


                            <div class="col-md-12" style="margin-top: -25px;">
                                <label for="txt" class="control-label col-sm-2 input-sm"></label>
                                <table class="table" style="border: 1px solid #DDDDDD;" id="tablaInformacion">
                                    <tr>
                                        <td>
                                            <div class="col-md-12">
                                                <div class='form-group' style="margin-left: 15px;">
                                                    <label for="txtProyecto" class="control-label col-md-1 input-sm"><span
                                                            class="obligatorio"></span>Proyecto:</label>
                                                    <div class="col-md-3">
                                                        <label id='txtProyecto_' class="input-sm"></label>
                                                    </div>
                                                    <label for="txtUbicacion"
                                                        class="control-label col-md-1 input-sm"><span
                                                            class="obligatorio"></span>Ubicación:</label>
                                                    <div class="col-md-3">
                                                        <label id='txtUbicacion_' class="input-sm"></label>
                                                    </div>
                                                    <label for="txtTipoCasa" class="control-label col-md-2 input-sm"><span
                                                            class="obligatorio"></span>Tipo de Casa:</label>
                                                    <div class="col-md-2">
                                                        <label id='txtTipoCasa_' class="input-sm"></label>
                                                    </div>
                                                    <label for="txtFechaEntrega"
                                                        class="control-label col-sm-1 input-sm"><span
                                                            class="obligatorio"></span>Fecha Entegra:</label>
                                                    <div class="col-sm-3">
                                                        <label id='txtFechaEntrega_' class="input-sm"></label>
                                                    </div>
                                                    <label for="txtEstado" class="control-label col-md-1 input-sm"><span
                                                            class="obligatorio"></span>Estado:</label>
                                                    <div class="col-md-3">
                                                        <span class="label label-info" id='txtEstado'></span>
                                                    </div>
                                                    <label for="txtPresupuesto"
                                                        class="control-label col-sm-1 input-sm"><span
                                                            class="obligatorio"></span>Presupuesto:</label>
                                                    <div class="col-sm-3">
                                                        <label id='txtPresupuesto_' class="input-sm"></label>
                                                        <label id='txtPresupuesto_2' class="input-sm" hidden></label>
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>



                    <div class="row" style="padding-right: 50px;padding-left: 50px;">
                        <div class="alert alert-danger" role="alert" id="alerta-asignar-costo">
                            Es necesario asignar costo a las observaciones.
                        </div>
                        <div class="col-md-12" id="divTablaAgregarObservacion">
                            <table class="table table-hover table-responsive compact table-striped"
                                id="tblAgregarObservacion">
                                <thead>
                                    <tr>
                                        <th style="color:#008000">Categoría</th>
                                        <th style="color:#008000">Tipo Solicitud</th>
                                        <th style="color:#008000">Detalle Solicitud</th>
                                        <th style="color:#3e9efe">Ocasionado por</th>
                                        <th style="color:#3e9efe">Categoría del material</th>
                                        <th style="color:#3e9efe">Informe de inspección</th>
                                        <th style="color:#3e9efe">¿Quién realizó el trabajo?</th>
                                        <th style="color:#3e9efe" class="centrar">Fecha Inicio de Trabajo</th>
                                        <th style="color:#3e9efe" class="centrar">Fecha Fin de Trabajo</th>
                                        <th style="color:#3e9efe" class="centrar">Archivo Adjunto</th>
                                        <th style="color:#008000" class="centrar">Estado</th>
                                        <th class="centrar"><span class='add-observacion glyphicon glyphicon-plus'></span>
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>


                    <div class="row" style="padding-right: 100px;padding-left: 100px;">
                        <div class="col-md-12">
                            <div class="form-group row">
                                <label for="txtComentario" class="control-label col-md-1 input-sm">Comentario:</label>
                                <div class="col-md-11">
                                    <textarea id="txtComentario" class="form-control" rows="3"></textarea>
                                </div>
                            </div>
                        </div>

                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-md btn-success nuevo" id="btnGuardar">Guardar</button>
                    </div>

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




    <!--Guardar archivo reclamo-->
    <div class="modal fade bs-example-modal-md" role="dialog" aria-labelledby="modalArchivoConformidad"
        id="modalArchivoConformidad">
        <div class="modal-dialog modal-md" role="document" style="width: 70%">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title centrar" id="TitleCerrarReclamo2"></h4>
                    <label type="hidden" id="codReclamo3"></label>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-10 col-md-offset-1">

                            <!-- Solo permiso operaciones (Asistente de obra, Ingeniero de campo, Ingeniero Operaciones)-->
                            <div class="form-group row">
                                <input type="hidden" id="txtAutogenerado">
                                <label for="cboHojaConformidad" class="control-label col-md-2 input-sm ">Hoja de
                                    Conformidad:</label>

                                <div class="col-md-9">

                                    <input name="file" id="fileHojaConformidad" type="file">
                                    <!--disabled="disabled">-->

                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-md btn-success btn-guardar-reclamo-conformidad">Guardar</button>
                </div>
            </div>
        </div>
    </div>




    <!-----------Modal Cerrar Reclamo------------>
    <!-- Ventana emergente para cerrar reclamo-->
    <!--Hacer el cambio solicitado aqui-->

    <div class="modal fade bs-example-modal-md" role="dialog" aria-labelledby="modalCerrar" id="modalCerrar">
        <div class="modal-dialog modal-md" role="document" style="width: 70%">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title centrar" id="TitleCerrarReclamo"></h4>
                    <label type="hidden" id="codReclamo3"></label>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-10 col-md-offset-1">

                            <!-- Solo permiso GAC (Gestor Atencion al cliente)-->
                            <!-- Agregar menu "Cierre Reclamo"-->
                            <!--Agregar sub menus - Lista de los cargos habiliatados-->
                            <div class="form-group row">
                                <label for="cboModalidad" class="control-label col-md-2 input-sm ">Fecha de
                                    cierre:</label>
                                <div class="col-md-9">

                                    <input type="date" id="txtFechaCierre" class="form-control input-sm"
                                        max="2025-03-15">


                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="cboModalidad" class="control-label col-md-2 input-sm ">Comentario
                                    adicional:</label>
                                <div class="col-md-9">

                                    <textarea class="form-control" id="txtComentario_cierre" name="txtComentario_delete"
                                        placeholder="Ingresar comentarios" style="height: 90px"></textarea>


                                </div>
                            </div>

                            <!--Limitar el tamaño del archivo _
                                                                                                                                                                                                                                                                                                                                                                                                        Crear un archivo con el tamaño limite superior e inferior
                                                                                                                                                                                                                                                                                                                                                                                                        Inferior: pasa , Superior debe salir mensaje-->
                            <!-- Solo permiso operaciones (Asistente de obra, Ingeniero de campo, Ingeniero Operaciones)-->
                            <!--ultimo<div class="form-group row">
                                                                                                                                                                                                                                                                                                            <input type="hidden" id="txtAutogenerado">
                                                                                                                                                                                                                                                                                                            <label for="cboHojaConformidad" class="control-label col-md-2 input-sm ">Hoja de
                                                                                                                                                                                                                                                                                                                Conformidad:</label>

                                                                                                                                                                                                                                                                                                            <div class="col-md-9">
                                                                                                                                                                                                                                                                                                                <!--if (in_array(session('cod_cargo'), [28, 49, 33, 61, 22, 1, 65,70]))-->
                            <!--ultimo<input name="file1" id="fileDetalleReclamo" type="file">
                                                                                                                                                                                                                                                                                                                <!--else-->
                            <!--ultimo<input name="file" id="fileDetalleReclamo" type="file" disabled="disabled"> endif-->
                            <!--ultimo</div>

                                                                                                                                                                                                                                                                                                        <!--ultimo</div>-->
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-md btn-success btn-cerrar-reclamo">Guardar</button>
                </div>
            </div>
        </div>
    </div>



    <!--Guardar archivo categoria-->
    <div class="modal fade bs-example-modal-md" role="dialog" aria-labelledby="modalArchivo" id="modalArchivo">
        <div class="modal-dialog modal-md" role="document" style="width: 70%">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title centrar" id="TitleCerrarReclamo3"></h4>
                    <label type="hidden" id="codReclamo3"></label>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-10 col-md-offset-1">

                            <!-- Solo permiso operaciones (Asistente de obra, Ingeniero de campo, Ingeniero Operaciones)-->
                            <div class="form-group row">
                                <input type="hidden" id="txtAutogenerado">
                                <label for="cboHojaConformidad" class="control-label col-md-2 input-sm ">Hoja de
                                    Categoria 3:</label>

                                <div class="col-md-9">

                                    <input name="file" id="fileHojaConformidad" type="file" disabled="disabled">

                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-md btn-success btn-guardar-detalle-reclamo">Guardar</button>
                </div>
            </div>
        </div>
    </div>










    <!-----------Modal PARA GUARDAR ARCHIVOS------------>
    <!-- Ventana emergente para cerrar reclamo-->
    <!--Hacer el cambio solicitado aqui-->
@endsection