{{--Vista creada por Victor Moncada
Fecha 11/09/17
--}}
@extends('layouts/master')
@section('content')
    <script type="text/javascript">
        function  prueba() {
            $('#reloj').timepicker();
        };
    </script>
    <div class="col-lg-12 col-md-12">
        <br>
        <form>
            <div class="panel panel-primary" style="width:100%;">
                <div class="panel-heading">
                    <strong>
                        <h3 class="panel-title">
                            <div align="center">
                                <b>
                                    <span class="glyphicon glyphicon-book"></span>
                                    Liquidar Guías por Lote (Entregados)
                                </b>
                            </div>
                        </h3>
                    </strong>
                </div>
                <div class="panel-body">
                    <div id="page-selection-bottom" style="text-align: center;"></div>
                    <div class="row" style="margin-top: 2%">
                        <div class="col-sm-12">
                            <div class="panel panel-info">
                                <div class="panel-heading center">
                                    <div class="panel-title" style="font-weight: bold">
                                        Total:
                                    </div>
                                </div>
                                <div class="panel-body table-responsive">
                                    <table id="myTable" class="table table-hover tablesorter" >
                                        <tr class="bg-primary">
                                            <td class="bg-primary" ><center><b>Guías</span></b></td>
                                            <td class="bg-primary"><center><b>Receptor</span></b></td>
                                            <td class="bg-primary" ><center><b>Hora</span></b></td>
                                            <td class="bg-primary" ><center><b>Oservaciones</span></b></td>
                                            <td class="bg-primary" ><center><b>Fecha Liquidar</span></b></td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <center>

                                                </center>
                                            </td>
                                            <td>
                                                <center>

                                                </center>
                                            </td>
                                            <td>
                                                <center>
                                                    <div class="col-lg-4 col-md-4 col-md-offset-4">
                                                    <div class="input-group bootstrap-timepicker timepicker">
                                                        <input id="reloj" type="text" class="form-control input-small" placeholder="Ingrese Hora" onclick="prueba()">
                                                        <span class="input-group-addon"><i class="glyphicon glyphicon-time" data-toggle="tooltip" data-placement="left" title="Seleccione la hora" onclick="prueba()"></i></span>
                                                    </div>
                                                    </div>
                                                </center>
                                            </td>
                                            <td>
                                                <center>

                                                </center>
                                            </td>
                                            <td>
                                                <center>

                                                </center>
                                            </td>
                                        </tr>
                                    </table>
                                    <br>
                                    {{--Titulo desactivado--}}
                                        <li class="list-group-item disabled" style="margin-bottom:15px;text-align:center;"><b>Estatus</b></li>

                                    <div class="col-lg-6 col-md-6 col-md-4 col-md-offset-3">
                                            <div style="margin-bottom: 15px" class='input-group date col-xs-12 col-md-12 col-sm-12'>
                                                {{--Estilo del Icono de boostrap--}}
                                                <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-list" data-toggle="tooltip" data-placement="top" title='Seleccione un Estatus'></i></span>
                                                <select class="form-control" name="estatus" id="proceso" required data-placement="bottom">
                                                    <option value='0'  disabled selected>Seleccione Estatus</option>
                                                    <option value='1'> ENTREGADO AL DESTINO (E) </option>
                                                    <option value='2'> ENTREGA INCOMPLETA (EI)</option>
                                                {{--Nota: El valor de los option values deben ser modificados con los valores preestablecidos por la base de datos--}}
                                                </select>
                                            </div>
                                    </div>
                            </div>
                        </div>
                    </div>
                    {{--Boton--}}
                    <div style="margin-bottom:8px; text-align:center;">
                        <button type="submit" class="btn btn-primary" id="load"
                                data-loading-text="<i class='glyphicon glyphicon-refresh spinning '></i> Procesando.."
                                data-style="expand-right">Aceptar
                        </button>
                    </div>
                </div>
                <br>
                <div class="panel-footer"><span class="glyphicon glyphicon-info-sign color"></span> <b>Nota:</b> Al
                    posicionar el mouse sobre los iconos del formulario, podra ver una breve descripci&oacute;n del campo
                </div>
            </div>
        </form>
    </div>
@endsection