@using Oware.Util.Mvc
@model Reexpediciones.Models.Reexpediciones
@{
    ViewBag.Title = "Reexpediciones - Mercancia";
}

<style>
    .table-container::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .table-container::-webkit-scrollbar-track {
        background-color: rgba(113,112,107,0.1);
        -webkit-border-radius: 5px;
    }

    .table-container::-webkit-scrollbar-thumb:vertical {
        background-color: rgba(0,0,0,.2);
        -webkit-border-radius: 6px;
    }

        .table-container::-webkit-scrollbar-thumb:vertical:hover,
        .table-container::-webkit-scrollbar-thumb:horizontal:hover {
            background: red;
        }

    .table-container::-webkit-scrollbar-thumb:horizontal {
        background-color: rgba(0,0,0,.2);
        -webkit-border-radius: 6px;
    }


    .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
        background-color: #2c3e50 !important;
        border-color: #2c3e50 !important;
    }

    table {
        width: 100%;
    }



    .table-container {
        margin: 0 0 1rem;
        overflow: auto;
        overflow-y: auto;
        width: 100%;
    }

    .botonDano {
      background-color:seagreen;
      border: 1px solid #e74c3c;
      color: #fff;
    }
    .botones {
        margin: 3px !important;
    }
    .input-search-btn {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        padding: 0 10px;
        background: 0 0;
        border: none;
        border-radius: 0 200px 200px 0;
    }

        .input-search-btn + .form-control {
            padding-right: 50px;
        }

    .input-search .form-control {
        border-radius: 200px;
    }

    .tab-pane {
        padding-top: 30px;
    }
    .puntero {
        cursor:pointer;
    }
    #LineaTransportista::label:parent {
        display: none !important;
    }
</style>
<h2>@*RECIBO REEXPEDICIONES*@</h2>
<div class="row">
    <input id="hdnIdReferencia" value="@Model.GatePass" type="hidden" />
    <div class="container" ng-controller="reexpedicionController as vm">
        
            <div class="col-m-12">
                
                    <h2>Mercancia</h2>
                
                <script type="text/javascript">
                var refenciaGatePass = '@Model.Referencias';
                    var gatepassMercancia = '@ViewBag.GatePass';
         
                </script>
                <div id="exTab2" class="container">
                    <ul class="nav nav-tabs">
                        <li>
                            <a href="/Reexpedicion">1. Referencias</a>
                        </li>
                        <li class="active">
                            <a href="javascript:;">2. Mercancia</a>
                        </li>
                    </ul>

                    <div class="tab-content " ng-init="vm.obtieneInfoReferencia();">
                        <div class="tab-pane active" id="1">
                            <div class="row">
                                <div class="col-md-12 mercancio-bulto">
                                    <div class="col-md-5">
                                        <div class="form-group col-md-12">
                                            <label class="control-label">Referencia:</label><label class="text-danger" style="padding-left:20px;">@Model.Referencias</label>
                                        </div>
                                        <div class="form-group col-md-12">
                                            <input type="text" class="form-control LetrasNumeros" id="referenciacliente" ng-model="vm.referenciacliente" required name="referenciacliente" placeholder="Referencia Cliente">
                                        </div>
                                        <div class="form-group col-md-12">
                                            @*<input type="text" class="form-control  registro" id="cliente" name="cliente" value="@Model.Cliente" placeholder="Cliente" >*@
                                            @Html.FormGroup("", "Cliente", "vm.gatepass.Cliente.Descripcion", "text",
                                            new
                                            {
                                                //ng_change = "vm.limpiarCampo('ClienteId')",
                                                uib_typeahead = "c.Descripcion as c.DescripcionCompuesta for c in vm.buscarCatalogo($viewValue, 'clientes')",
                                                typeahead_on_select = "vm.seleccionarElemento($item, $model, $label, $event, 'ClienteId')",
                                                //typeahead_loading = "vm.clientes.cargando",
                                                typeahead_no_results = "vm.clientes.noresult",
                                                typeahead_min_length = "3",
                                                typeahead_wait_ms = "250",
                                                typeahead_select_on_blur = "true",
                                                typeahead_editable = "false",
                                                ng_readonly = "vm.controlesActivos.clientes",
                                                ng_required = "!vm.controlesActivos.clientes",
                                                autocomplete = "Off"
                                            })
                                        </div>
                                        <div class="form-group col-md-12"></div>
                                        <div class="form-group col-md-6">
                                            <input type="text" class="form-control autonumber  registro" ng--model="vm.bultosdocumentos" required id="bultosdocumentoss" name="bultosdocumentos" placeholder="Bultos Documentos">
                                        </div>
                                        <div class="form-group col-md-6">
                                            <input type="text" class="form-control autonumber  registro" ng-model="vm.bultosfisicos" id="bultosfisicoss" required name="bultosfisicos" placeholder="Bultos Físicos">
                                        </div>
                                        <div class="form-group col-md-12"></div>
                                        <div class="form-group col-md-12 " style="clear:both;">
                                            <input type="text" class="form-control LetrasNumeros" id="so" name="so" ng-model="vm.so" required placeholder="SO">
                                        </div>
                                    </div>
                                    <div class="col-md-7 datos-bulto">

                                        <div class="form-group col-md-8">
                                            <input type="text" class="form-control LetrasNumeros registro" maxlength="14" ng-model="vm.bultodetalle.idbulto"  id="txtIdBulto"
                                                   ng-keyup="$event.keyCode == 13 ? vm.buscarIDBulto(this) : null" onblur="vm.buscarIDBulto(this);" name="id-bulto" placeholder="ID Bulto">                                            
                                        </div>
                                        <div class="form-group col-md-4">
                                            <a id="btnDano" href="javascript:;" class="btn btn-default"
                                               ng-class="vm.DanadoBulto == true ? 'btn-danger' : ''"
                                               ng-click="vm.cambiarDanado();">
                                                Dañado
                                            </a>
                                            @*<div class="btn btn-default">Dañado</div>*@
                                        </div>
                                        <div class="form-group col-md-6">
                                            <div class="radio">
                                                <label class="checkbox-inline"><input type="checkbox" ng-disabled="vm.EditandoBulto&&vm.EditMultiBulto" ng-change="vm.cambioMulti()" ng-model="vm.MultiBulto" @*ng-checked="vm.MultiBulto"*@>Multibulto</label>
                                            </div>
                                        </div>
                                        <div class="form-group col-md-6  has-success has-feedback">
                                            <label class="radio-inline"><input type="radio" class="rdiobulto" value="1" ng-model="vm.TipoBulto" name="optradio">LTL</label>
                                            <label class="radio-inline"><input type="radio" class="rdiobulto" value="2" ng-model="vm.TipoBulto" name="optradio">PARCEL</label>
                                            <label class="radio-inline"><input type="radio" class="rdiobulto" value="3" ng-model="vm.TipoBulto" name="optradio">FTL</label>
                                        </div>
                                        <div class="form-group col-md-12">
                                            @Html.FormGroup("",
                                                "LineaTransportista",
                                                "vm.gatepass.LineaTransportista.Descripcion",
                                                "text",
                                                new
                                                {
                                                    required = "required",
                                                    //ng_change = "vm.limpiarCampo('LineaTransportistaId')",
                                                    uib_typeahead = "c.Descripcion as c.DescripcionCompuesta for c in vm.buscarCatalogo($viewValue, 'lineasTransportistas')",
                                                    typeahead_on_select = "vm.seleccionarElemento($item, $model, $label, $event, 'LineaTransportistaId')",
                                                    //typeahead_loading = "vm.lineas.cargando",
                                                    typeahead_no_results = "vm.lineas.noresult",
                                                    typeahead_min_length = "3",
                                                    typeahead_wait_ms = "250",
                                                    typeahead_select_on_blur = "true",
                                                    typeahead_editable = "false",
                                                    //ng_readonly = "vm.controlesActivos.clientes",
                                                    //ng_required = "!vm.controlesActivos.clientes",
                                                    autocomplete = "Off"
                                                })
                                            @*<input type="text" class="form-control  registro" id="txtLineaTransportista"  ng-model="vm.bultodetalle.linea" name="lineatransportista" placeholder="Linea Transportista" autocomplete="off">*@
                                        </div>
                                        <div class="form-group col-md-12">
                                            @Html.FormGroup("",
                                                "Servicios",
                                                "vm.gatepass.Servicios.Descripcion",
                                                "text",
                                                new
                                                {
                                                    required = "required",
                                                    //ng_change = "vm.limpiarCampo('LineaTransportistaId')",
                                                    uib_typeahead = "c.Descripcion as c.DescripcionCompuesta for c in vm.buscarServicio($viewValue, vm.gatepass.LineaTransportistaId)",
                                                    typeahead_on_select = "vm.seleccionarServicio($item, $model, $label, $event)",
                                                    //typeahead_loading = "vm.lineas.cargando",
                                                    typeahead_no_results = "vm.lineas.noresult",
                                                    typeahead_min_length = "3",
                                                    typeahead_wait_ms = "250",
                                                    typeahead_select_on_blur = "true",
                                                    typeahead_editable = "false",
                                                    ng_readonly= "vm.gatepass.LineaTransportista.Descripcion == null || vm.gatepass.LineaTransportista.Descripcion == ''",
                                                    //ng_readonly = "vm.controlesActivos.clientes",
                                                    //ng_required = "!vm.controlesActivos.clientes",
                                                    autocomplete = "Off"
                                                })
                                            @*<input type="text" class="form-control  registro autonumber" id="txtServicio" ng-model="vm.bultodetalle.servicio" name="servicio" placeholder="Servicio" autocomplete="off">*@
                                        </div>
                                        <div class="col-md-12 clearfix"></div>
                                        <div class="form-group col-md-4 clearfix">
                                            <input type="text" class="form-control registro autonumber" id="txtCartones" ng-model="vm.bultodetalle.cartones" name="cartones" placeholder="Cartones" autocomplete="off">
                                        </div>
                                        <div class="form-group col-md-8">
                                            <input type="text" class="form-control registro alfanumerico" id="txtGuia" ng-model="vm.guiadetalle" ng-keyup="$event.keyCode == 13 ? vm.agregarBultos(this) : null" name="guia/bl" @*value="@Model.Guia"*@ placeholder="Guia/BL" autocomplete="off">
                                        </div>


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

                                        </div>
                                    </div>
                                    <div class="col-md-12 pull-right text-right">Pistoleados: {{vm.bultos.length}} Bultos de la referencia</div>
                                    <div class="tab-pane active" id="1">
                                        <div class="col-md-12">
                                            <div class="table-container">
                                                <table class="table table-responsive search-table" style="overflow-x:scroll !important;">
                                                    <thead>
                                                        <tr>
                                                            <th>.</th>
                                                            <th>Bulto</th>
                                                            <th>Guia</th>
                                                            <th>Transportista</th>
                                                            <th>Cartones</th>
                                                            @*<th>Estatus</th>*@
                                                        </tr>
                                                    </thead>
                                                    <tbody class="registros-bultos">
                                                        @*<tr ng-repeat="(bultosIndex, r) in vm.bultos">*@
                                                        <tr ng-repeat="r in vm.bultos">
                                                            <td><i class='glyphicon glyphicon-pencil puntero' ng-click="vm.editarBulto($index)" title='Editar bulto'></i> <i title='Quitar bulto' ng-click="vm.remove($index)" class='glyphicon glyphicon-remove puntero'></i></td>
                                                            <td>{{r.Id}}</td>
                                                            <td>{{r.GuiaOBL}}</td>
                                                            <td>{{r.LineaTransportista}}</td>
                                                            <td>{{r.Cartones}}</td>
                                                            @*<td></td>*@
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>

                        </div>
                        <div class="tab-pane" id="2">

                        </div>

                    </div>
                </div>

            </div>
            <div class="col-md-12">
                <div class="col-md-12 col-sm-12">

                    <div class="btn btn-default pull-left botones" ng-click="vm.MostrarModalGatepass()">Re-imprimir Gatepass</div>
                    @*<div class="btn btn-default pull-left botones" ng-click="vm.TipoTeamLeader=4;vm.validarTeam();">Re-imprimir etiquetas</div>*@
                    <div class="btn btn-default pull-left botones" ng-click="vm.ImpresionEtiquetas=1;vm.TipoTeamLeader=5;vm.MostrarModalEtiquetas()">Re-imprimir etiquetas</div>
                    <div class="btn btn-default pull-right botones botonesderecho " ng-click="vm.guardarReferencia();">Guardar referencia</div>
                </div>

            </div>
        <div id="mdlReimprimirGatepass" modal="showModal" close="cancel()" class="modal fade modal-arriba" data-easein="expandIn" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">

            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        @*<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>*@
                        <h4 class="modal-title titulo-msj-registro">Reimprimir gatepass</h4>
                    </div>
                    <div class="modal-body">
                        <div class="col-md-12 clearfix">
                            <div class="checkbox">
                                <label>
                                    <input type="radio" ng-model="vm.ValorBusquedaGatepass" ng-change="vm.OcultaMuestraValor();" value="caja">
                                    Caja
                                </label>
                                <label>
                                    <input type="radio" ng-model="vm.ValorBusquedaGatepass" ng-change="vm.OcultaMuestraValor();" value="gatepass">
                                    Gatepass
                                </label><br />
                                @*<input type="radio" name="valorescajagatepass" id="rdioCaja" ng-model="vm.ValorBusquedaGatepass" value="caja" /><label style="padding-left:5px !important" for="rdioCaja">Caja</label>
                                <input type="radio" style="margin-left:20px !important;" name="valorescajagatepass" id="rdioGatepass" value="gatepass" ng-model="vm.vm.ValorBusquedaGatepass" /><label style="padding-left:5px !important" for="rdioGatepass">Gatepass</label>*@

                            </div>
                        </div>

                        <div class="form-group clearfix" style="position:static !important;">
                            <input type="text" class="form-control autonumber" maxlength="12" ng-hide="vm.ValorBusquedaGatepass=='caja'" ng-model="vm.NumeroReeinGatepass" />
                            <input type="text" class="form-control alfanumerico2" ng-hide="vm.ValorBusquedaGatepass!='caja'" ng-model="vm.NumeroReeinGatepass" />
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-default waves-effect waves-light" ng-click="vm.CerrarReimprimirGatepass()">Cancelar</button>
                        <button class="btn btn-success waves-effect waves-light" type="button" ng-click="vm.reimprimirGatepass()">Aceptar</button>
                    </div>
                </div>
            </div>
        </div>
        

        <div id="mdl-confirmacion-teamleader" modal="showModal" close="cancel()" class="modal fade modal-arriba" data-easein="expandIn" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">

            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        <h4 class="modal-title titulo-msj-registro">Aprobación Teamleader</h4>
                    </div>
                    <div class="modal-body">
                        <div class="col-md-12">
                            <h4 class="pregunta-confirmacion"></h4>
                            <div class="form-group">
                                <input type="text" class="form-control " ng-model="vm.user.usuario" value="" placeholder="usuario" />
                            </div>
                            <div class="form-group">
                                <input type="password" class="form-control  " ng-model="vm.user.password" value="" placeholder="contraseña" />
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default waves-effect waves-light btn-confirmacion-cancelar-ok" data-dismiss="modal"><i class="fa fa-ban"></i> Cancelar</button>
                        <button type="button" class="btn btn-success waves-effect waves-light btn-confirmacion-yes " ng-click="vm.loginTeamLeader();"><i class="fa fa-save"></i> Aceptar</button>

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

        <div id="mdlReimpresionEtiquetas" modal="showModal" close="cancel()" class="modal fade modal-arriba" data-easein="expandIn" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">

            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        @*<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>*@
                        <h4 class="modal-title titulo-msj-registro">Reimprimir etiquetas</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <input type="text" class="form-control LetrasNumeros" placeholder="Referencia" ng-model="vm.NumeroReeinEtiquetas" />
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control autonumber" placeholder="De" ng-model="vm.EtiquetasOrigen" />
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control autonumber" placeholder="Al" ng-model="vm.EtiquetasFinal" />
                        </div>
                        @*MALS*@
                        <div class="form-group">
                            <textarea class="form-control LetrasNumerosEsp" placeholder="Observaciones" ng-model="vm.ObservacionesReimp"></textarea>
                            @*<input type="text" class="form-control" placeholder="Observaciones" ng-model="vm.ObservacionesReimp" />*@
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-default waves-effect waves-light" ng-click="vm.CerrarReimprimirEtiquetas()">Cancelar</button>
                        <button class="btn btn-success waves-effect waves-light" type="button" ng-click="vm.reimprimirEtiquetas()">Aceptar</button>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>



@section scripts{
    <script src="~/Scripts/app/controladores/ReexpedicionController.js"></script>
    <script src="~/Scripts/app/factory/ReexpedicionFactory.js"></script>
<script src="~/Scripts/app/controladores/ModalController.js"></script>

<script src="~/Scripts/app/controladores/modalGaleriaController.js"></script>
<script src="~/Scripts/app/factory/gatepassFactory.js"></script>

    <script src="~/Scripts/select2.full.min.js"></script>
<script src="~/Scripts/ng-pattern-restrict.js"></script>
@*<script src="~/Scripts/app/controladores/modalGaleriaReexController.js"></script>*@
    <script type="text/javascript">
        $(".select2").select2({});
    </script>
}