@extends('master')

@section('titulo')
    {{ Lang::get('ppcp/_22250.titulo') }}
@endsection

@section('estilo')
    <link rel="stylesheet" href="{{ elixir('assets/css/22250.css') }}" />
@endsection

@section('conteudo')
<style>
    #main {
        margin-top: -45px;
    }
</style>
<div 
    ng-controller="Ctrl as vm" 
    ng-cloak style="max-width: 900px;position:relative"
    ng-init="vm.Sobra.STATUS = 'INCLUIR'">
    
    <input type="hidden" ng-init="vm.GP_ID = '{{ $gp_id }}'" />    

    <div class="btn btn-warning" style="float: right;" ng-click="vm.gcOperador.autenticar({OPERACAO_ID : 16,VALOR_EXT : [1,3]},vm.Operador)">
        <div ng-if="!(vm.Operador.OPERADOR_ID > 0)">
            <span class="fa fa-sign-in"></span>    
            Autenticar Operador
        </div>
        <div ng-if="(vm.Operador.OPERADOR_ID > 0)">
            <span class="fa fa-sign-out"></span>    
            @{{ vm.Operador.OPERADOR_NOME }}
        </div>
    </div>    
    <button 
        class="btn btn-xs btn-warning" 
        style="top: 38px;right: 0;position: absolute;" 
        ng-disabled="!(vm.Sobra.DADOS.length > 1)"
        ng-click="vm.Sobra.etiqueta()">
    <span class="glyphicon glyphicon-print"></span>
        Imprimir Etiquetas
    </button>
    
    <form class="form-inline">
        <div class="form-group">
            <label>Código de Barras do Talão:</label>
            <input 
                id="model-codigo-barras"
                type="password" 
                placeholder="Importar dados do talão..." 
                autocomplete="nope"
                ng-init="vm.Sobra.MODEL_CODIGO_BARRAS = '043970005603'" 
                ng-model="vm.Sobra.MODEL_CODIGO_BARRAS" 
                ng-keydown="($event.key == 'Enter' && vm.Sobra.MODEL_CODIGO_BARRAS != '' && vm.Sobra.MODEL_CODIGO_BARRAS > 0) && vm.Sobra.consultarTalaoDados(vm.Sobra.MODEL_CODIGO_BARRAS); ($event.key == 'Enter' && vm.Sobra.MODEL_CODIGO_BARRAS != '' && vm.Sobra.MODEL_CODIGO_BARRAS > 0) && (vm.Sobra.MODEL_CODIGO_BARRAS = '')"
                />
        </div>
    </form>
    
    <div class="panel-filter">
        <form ng-submit="vm.Sobra.confirmar()">
            <div class="consulta-estabelecimento"></div>

            <style>
                .consulta-gp input[type="search"] {
                    width: 200px !important;
                }
                .consulta-defeito input[type="search"] {
                    width: 310px !important;
                }
                .consulta-produto input[type="search"] {
                    width: 340px !important;
                }
            </style>
            <div class="inline consulta-gp" ></div>
            <div class="inline consulta-produto"></div>
            <div class="inline consulta-modelo-tamanho"></div>

            <div class="form-group">
                <label>Qtd.:</label>
                <input id="model-quantidade" type="number" min="1" step="1" form-validate="true" class="form-control input-menor text-right input-qtd" ng-model="vm.Sobra.SELECTED.QUANTIDADE" required />
            </div>        

            <div class="form-group">
                <label>Remessa:</label>
                <input 
                    type="number" 
                    min="0" 
                    step="1" 
                    form-validate="true" 
                    class="form-control input-menor" 
                    ng-model="vm.Sobra.SELECTED.REMESSA_ID"
                    ng-required="vm.REG_DEF_SEM_TALAO == '0'"
                    />
            </div>
            <div class="form-group">
                <label>Data Hora</label>
                <input type="datetime-local" class="form-control input-datetime" form-validate="true" ng-model="vm.Sobra.SELECTED.DATAHORA_DATE" style="width: 165px !important;" required>
            </div>

            <div class="form-group">
                <label ttitle="1: Diurno | 2: Noturno">Turno:</label>
                <input type="number" maxlength="1" step="1" max="2" form-validate="true" class="form-control" style="width: 46px" ng-model="vm.Sobra.SELECTED.TURNO" required />
            </div>    
            
            
            <button type="submit" class="btn btn btn-success" style="padding-top: 2px;margin-top: 18px;">
                <span class="glyphicon glyphicon-ok"></span>
                Gravar
            </button>
        </form>
    </div>
    

    <div class="table-ec table-incluir" style="height: calc(100% - 235px);min-height: 100px;">
        <table class="table table-striped table-hover table-bordered table-condensed table-no-break">
            <thead>
                <tr>
                    <th                    >Id       </th>
                    <th                    >Gp       </th>
                    <th                    >Rem.     </th>
                    <th                    >Produto  </th>
                    <th class="text-center">Tam.     </th>
                    <th class="text-right" >Qtd.     </th>
                    <th class="text-center">Endereç.</th>
                    <th class="text-center">Data/Hora</th>
                    <th class="text-center">Tur      </th>
                    <th></th>                  
                </tr>
            </thead>
            <tbody>
                <tr 
                    ng-repeat="sobra in vm.Sobra.DADOS">
                    <td>@{{ sobra.ID }}</td>
                    <td title="Id: @{{ sobra.GP_ID }}">@{{ sobra.GP_DESCRICAO }}</td>
                    <td>@{{ sobra.REMESSA_ID }}</td>
                    <td title="Id: @{{ sobra.PRODUTO_ID | lpad:[6,0] }}">@{{ sobra.PRODUTO_DESCRICAO }}</td>
                    <td class="text-center">@{{ sobra.TAMANHO_DESCRICAO }}</td>
                    <td class="text-right">@{{ sobra.QUANTIDADE | number : 0 }}</td>
                    <td class="text-center">@{{ sobra.ENDERECAMENTO }}</td>
                    <td class="text-center">@{{ sobra.DATAHORA_DATE | date : 'dd/MM/yy HH:mm' }}</td>
                    <td class="text-center">@{{ sobra.TURNO }}</td>
                    <td style="padding: 0;">
                        <button 
                            type="button" 
                            class="btn btn-danger btn-xs" 
                            style="margin-top: 2px;padding: 4px 10px;margin-left: 2px;" 
                            ng-click="vm.Sobra.excluir(sobra)"
                            ng-disabled="vm.Sobra.SELECTED == sobra">
                            <span class="glyphicon glyphicon-trash"></span>
                        </button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>       
    
</div>
@endsection

@section('script')

    <script src="{{ elixir('assets/js/direct-print.js') }}"></script>
    <script src="{{ elixir('assets/js/_22250.js') }}"></script>
@append