@extends('master')

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

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

@section('conteudo')
<style>
    #main {
        margin-top: -55px;
    }
</style>
<div ng-controller="Ctrl as vm" style="zoom: 0.95" ng-cloak >
    
    <input type="hidden" ng-init="vm.GP_ID = '{{ $gp_id }}';" />
    
    <form class="form-inline" ng-submit="vm.Requisicao.consultarDados()">
        <div class="panel-filter">
            <div class="form-group">
                <label>Código de Barras do Talão:</label>
                <input 
                    id="input-requisitar-codigo-barras"
                    type="password" 
                    placeholder="Importar dados do talão..." 
                    autocomplete="nope"
                    form-validate="true" 
                    ng-change="vm.Requisicao.SOBRA_ETIQUETA = ''"
                    ng-model="vm.Requisicao.MODEL_CODIGO_BARRAS" 
                    />
            </div>
            <span style="top: 8px;position: relative;margin-right: 10px;">ou</span>
            
            <div class="form-group">
                <label>Remessa:</label>
                <input 
                    type="number" 
                    min="0" 
                    step="1" 
                    form-validate="true" 
                    class="form-control input-menor clearable" 
                    ng-model="vm.Requisicao.MODEL_REMESSA_ID"
                    ng-change="vm.Requisicao.SOBRA_ETIQUETA = ''"
                    ng-required="vm.Requisicao.MODEL_REMESSA_TALAO_ID > 0"
                    />
            </div>

            <div class="form-group">
                <label>Talão:</label>
                <input 
                    type="number"  
                    min="0" 
                    step="1" 
                    form-validate="true" 
                    class="form-control clearable" 
                    style="width:70px" 
                    ng-model="vm.Requisicao.MODEL_REMESSA_TALAO_ID"
                    ng-change="vm.Requisicao.SOBRA_ETIQUETA = ''"
                    ng-required="vm.Requisicao.MODEL_REMESSA_ID > 0"
                    />
            </div>            

            <button 
                type="submit" 
                class="btn btn-primary btn-xs" 
                data-hotkey="alt+f"
                >
                <span class="glyphicon glyphicon-filter"></span>Filtrar
            </button>  
        </div>
    </form>
 <!--   
    <button 
        class="btn btn-warning" 
        style="float:right" 
        ng-if="vm.Requisicao.SOBRA_ETIQUETA.length > 0 "
        ng-click="vm.Requisicao.etiqueta()"
        >
        <span class="glyphicon glyphicon-print"></span> Reimprimir Etiqueta de Sobra
    </button>
-->    
    <div>
        <div class="table-ec" style="margin-bottom: 5px;display: inline-block;width: calc(100% - 180px);" ng-if="vm.Requisicao.SKU.REMESSA_ID > 0">
            <table class="table table-striped table-hover table-condensed table-bordered">
                <thead>
                    <tr>
                        <th colspan="8" class="text-center">Dados do Sku</th>
                    </tr>
                </thead>
                <tbody>
                        <tr>
                            <td class="text-normal">Remessa/Talão:</td>
                            <td colspan="1">@{{ vm.Requisicao.SKU.REMESSA_ID }} / @{{ (vm.Requisicao.SKU.REMESSA_TALAO_ID+'').padStart(4, '0') }}</td>
                            <td class="text-normal">Medidas:</td>
                            <td class="text-normal">@{{ vm.Requisicao.SKU.INFO.LARGURA  | number: 4}} X @{{ vm.Requisicao.SKU.INFO.COMPRIMENTO  | number: 4}}</td>
                        </tr>
                        <tr>
                            <td class="text-normal">GP:</td>
                            <td colspan="3" title="Id: @{{ vm.Requisicao.SKU.GP_ID }}">@{{ vm.Requisicao.SKU.GP_DESCRICAO }}</td>
                        </tr>
                        <tr>
                            <td class="text-normal">Produto:</td>
                            <td title="Id: @{{ vm.Requisicao.SKU.PRODUTO_ID }}">@{{ vm.Requisicao.SKU.PRODUTO_DESCRICAO }}</td>
                            <td class="text-normal">Tam.:</td>
                            <td title="Grade: @{{ vm.Requisicao.SKU.GRADE_ID }} | Id: @{{ vm.Requisicao.SKU.TAMANHO }}">@{{ vm.Requisicao.SKU.TAMANHO_DESCRICAO }}</td>
                        </tr>
                </tbody>
            </table>  
        </div>

        <div style="float:right;width: 175px;" class="table-ec" style="margin-bottom: 5px" ng-if="vm.Requisicao.SKU.REMESSA_ID > 0">
            <table class="table table-striped table-hover table-condensed table-bordered">
                <thead>
                    <tr>
                        <th colspan="2" class="text-center">Quantidades</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-normal">Total:</td>
                        <td colspan="3" class="text-normal text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_TOTAL | number: 0 }} @{{ vm.Requisicao.SKU.UM }}</td>
                    </tr>
                    <tr>
                        <td class="text-normal">Produzida:</td>
                        <td colspan="3" class="text-normal text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_PRODUZIDA | number: 0 }} @{{ vm.Requisicao.SKU.UM }}</td>
                    </tr>
                    <tr>
                        <td class="text-normal">Em Aberto:</td>
                        <td colspan="3" class="text-normal text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_ABERTO | number: 0 }} @{{ vm.Requisicao.SKU.UM }}</td>
                    </tr>   
                </tbody>
            </table>  
        </div>   
    </div>
    

 
    
    <style>
        .container-consumo .indisponivel {
            background: rgb(177, 0, 0);
            color: white;
        }
    </style>
    <div class="container-consumo">
        <fieldset>
            <div class="table-ec table-consumo" style="margin-bottom: 5px;">
                <table class="table table-striped table-bordered table-hover table-low">
                    <thead>
                        <tr>
                            <th class="wid-modelo">Estoque de Matéria-prima</th>
                            <th class="wid-quantidade text-right" title="Consumo unitário">Consumo</th>
                            <th class="wid-quantidade text-right" title="Quantidade projetada de consumo com base na quantidade à programar">Projeção</th>
                            <th class="wid-quantidade text-right" title="Quantidade total em estoque">Estoque</th>
                            <th class="wid-quantidade text-right" title="Quantidade reservada para utilização em remessas jà geradas">Alocado</th>
                            <th class="wid-quantidade text-right" title="Quantidade reservada para alocação dinâmica de remessas já geradas">Empenhado</th>
                            <th class="wid-quantidade text-right" title="Estoque - Alocado - Projeção">Disponível</th>
                            <!--<th class="wid-quantidade text-right" title="Quantidade em análise para entrada no estoque">Revisão</th>-->
                        </tr>
                    </thead>                     
                    <tbody>
                        <tr
                            ng-repeat="item in vm.Requisicao.SKU.CONSUMOS">
                            <td class="wid-modelo" title="@{{ item.PRODUTO_ID }} - @{{ item.PRODUTO_DESCRICAO }}">@{{ item.PRODUTO_ID }} - @{{ item.PRODUTO_DESCRICAO }}</td>
                            <td class="text-right">@{{ item.CONSUMO || 0 | number: 4 }} @{{ item.UM }}/@{{ vm.Requisicao.SKU.UM }}</td>
                            <td class="text-right">@{{ item.CONSUMO * vm.Requisicao.MODEL_QUANTIDADE_REQUISITAR  || 0 | number: 4 }} @{{ item.UM }}</td>
                            <td class="text-right">@{{ item.ESTOQUE    || 0 | number: 4 }} @{{ item.UM }}</td>
                            <td class="text-right">@{{ item.ALOCADO    || 0 | number: 4 }} @{{ item.UM }}</td>
                            <td class="text-right">@{{ item.EMPENHADO  || 0 | number: 4 }} @{{ item.UM }}</td>                          
                            <td 
                                class="text-right" 
                                data-calc="@{{ item.DISPONIVEL = item.ESTOQUE - (item.CONSUMO * vm.Requisicao.MODEL_QUANTIDADE_REQUISITAR) - item.ALOCADO - item.EMPENHADO }}"
                                ng-class="{'indisponivel' : item.DISPONIVEL < 0}">@{{ item.DISPONIVEL || 0 | number: 4 }} @{{ item.UM }}</td>
                            <!--<td class="text-right">@{{ item.REVISAO    || 0 | number: 4 }} @{{ item.UM }}</td>-->
                        </tr>                
                    </tbody>
                </table>
            </div>
        </fieldset>
    </div>    
    
    <form ng-submit="vm.Requisicao.confirmarSku()">
        <div class="table-ec" style="margin-bottom: 5px;" ng-if="vm.Requisicao.SKU.REMESSA_ID > 0">
            <table class="table table-striped table-hover table-condensed table-bordered">
                <thead>
                    <tr>
                        <th>Critério</th>
                        <th class="text-center" ttitle="Natureza do valor<br/>+ Soma | - Subtrai"></th>
                        <th class="text-right">Qtd. (@{{ vm.Requisicao.SKU.UM }})</th>
                        <th>Obs.</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-normal">Defeitos:</td>
                        <td class="text-center">+</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_DEFEITO | number: 0 }}</td>
                        <td class="text-normal">
                            <a href
                               ng-if="vm.Requisicao.SKU.QUANTIDADE_DEFEITO > 0"
                               ng-click="vm.Requisicao.consultarDefeitos()">
                               [Consultar]
                            </a>   
                        </td>
                    </tr>
                    <tr>
                        <td class="text-normal">Tolerância:</td>
                        <td class="text-center">+</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_TOLERANCIA | number: 0 }}</td>
                        <td class="text-normal">@{{ vm.Requisicao.SKU.PERCENTUAL_TOLERANCIA | number: 2 }}% dos defeitos</td>
                    </tr>
                    <tr>
                        <td class="text-normal" title="Aproveitamento de saldo de requisição não requisitado de uma outra remessa fechada em no máximo 7 dias a partir de hoje para o mesmo Sku e GP">Aproveitamento de Req.:</td>
                        <td class="text-center">+</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_APROV | number: 0 }}</td>
                        <td class="text-normal">
                            <span ng-if="vm.Requisicao.SKU.QUANTIDADE_APROV > 0" title="Talão: @{{ vm.Requisicao.SKU.REMESSA_TALAO_ID_APROV }}">
                                Remessa: @{{ vm.Requisicao.SKU.REMESSA_ID_APROV }}
                            </span>    
                        </td>
                    </tr>
                    <tr>
                        <td class="text-normal">Talão Extra:</td>
                        <td class="text-center">-</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_EXTRA | number: 0 }}</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td class="text-normal">Qtd. Requisitada:</td>
                        <td class="text-center">-</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_REQUISITADA | number: 0 }}</td>
                        <td class="text-normal">
                            <span
                               style="color: red; font-weight: bold;" 
                               ng-if="vm.Requisicao.SKU.QUANTIDADE_REQUISITADA_PENDENTE > 0">
                               @{{ vm.Requisicao.SKU.QUANTIDADE_REQUISITADA_PENDENTE | number : 0 }} @{{ vm.Requisicao.SKU.UM | lowercase }} pendentes
                            </span>     
                            <a href
                               ng-if="vm.Requisicao.SKU.QUANTIDADE_REQUISITADA > 0 || vm.Requisicao.SKU.QUANTIDADE_SOBRA_APROVEITADA > 0  ||  vm.Requisicao.SKU.QUANTIDADE_PLACA_APROVEITADA > 0"
                               ng-click="vm.Requisicao.registrada()">
                               [Consultar]
                            </a>     
                        </td>
                    </tr>
                    <tr>
                        <td class="text-normal">Sobra Aproveitada:</td>
                        <td class="text-center">-</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_SOBRA_APROVEITADA | number: 0 }}</td>
                        <td class="text-normal"> 

                            <button ng-if="vm.Requisicao.SKU.QUANTIDADE_SOBRA_APROVEITADA > 0" ng-click="vm.Requisicao.imprimir2()" type="button" class="btn btn-sm btn-warning btn-sm2" data-hotkey="alt+i">
                                <span class="glyphicon glyphicon-print"></span> Imp. Etiq.
                            </button>

                        </td>
                    </tr>
                    <tr>
                        <td class="text-normal">Qtd. Requisitada de Placas:</td>
                        <td class="text-center">-</td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_PARES_APROVEITADA  | number: 0 }}</td>
                        <td class="text-normal">@{{ vm.Requisicao.SKU.QUANTIDADE_PLACA_APROVEITADA | number: 0 }} Placas
                            <a href
                               style="font-weight: initial;"
                               ng-if="vm.Requisicao.SKU.QUANTIDADE_PLACA_APROVEITADA > 0"
                               ng-click="vm.Requisicao.consultarPlacaAlocada()">
                               [Consultar]
                            </a> 
                        </td>
                    </tr>
                    <tr style="font-weight: bold;font-size: 14px;background: rgb(225, 245, 230);">
                        <td class="text-normal">Saldo à Requisitar:</td>
                        <td class="text-center"></td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.SALDO_PARES | number: 0 }}</td>
                        <td style="font-size: 10px;vertical-align: middle;">
                            <span ng-if="false">@{{ vm.Requisicao.SKU.HABILITA_REQ_SEM_LIMITE == 0 ? 'Usuário limitado ao saldo. [U191]' : 'Sem limite de saldo. [U191]' }}</span>
                        </td>
                    </tr>
                    <tr style="background: rgb(245, 245, 225); font-size: 14px; font-weight: bold;" ng-if="vm.Requisicao.SKU.GP_REQUISITA_SOBRA == 1">
                        <td class="text-normal">Sobra Disponível:</td>
                        <td class="text-center"></td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_SOBRA | number: 0 }}</td>
                        <td class="text-normal">
                            <a href
                               style="font-weight: initial;"
                               ng-if="vm.Requisicao.SKU.QUANTIDADE_SOBRA > 0"
                               ng-click="vm.Requisicao.consultarSobras()">
                               [Consultar]
                            </a>                            
                        </td>
                    </tr>
                    <tr style="background: rgb(245, 245, 225); font-size: 14px; font-weight: bold;" ng-if="vm.Requisicao.SKU.GP_REQUISITA_SOBRA == 1">
                        <td class="text-normal">Placas de Bojo:</td>
                        <td class="text-center"></td>
                        <td class="text-right">@{{ vm.Requisicao.SKU.QUANTIDADE_PLACAS * vm.Requisicao.SKU.QUANTIDADE_BOJO_PLACA  | number: 0 }}</td>
                        <td class="text-normal">

                            <div style="display: inline-block;">
                                <button ng-disabled="vm.Requisicao.SKU.QUANTIDADE_PLACAS <= vm.Requisicao.SKU.MIN_PLACAS" style="height: 21px;" type="button" class="btn btn-primary btn-xs btn-subtrair" ng-click="vm.Requisicao.remPlaca()">
                                    <span class="glyphicon glyphicon-minus"></span>
                                </button>

                                <button ng-disabled="vm.Requisicao.SKU.QUANTIDADE_PLACAS >= vm.Requisicao.SKU.MAX_PLACAS" style="height: 21px;" type="button" class="btn btn-primary btn-xs btn-somar"    ng-click="vm.Requisicao.addPlaca()">
                                    <span class="glyphicon glyphicon-plus"></span>
                                </button>
                            </div>

                            <span style="@{{vm.Requisicao.SKU.QUANTIDADE_PLACAS > vm.Requisicao.SKU.OLD_PLACAS ? 'color: red;' : ''}}">
                                @{{ vm.Requisicao.SKU.QUANTIDADE_PLACAS | number: 0 }} Placas
                            </span>

                            <a href
                               style="font-weight: initial;"
                               ng-click="vm.Requisicao.consultarPlacas()">
                               [Estoque: @{{vm.Requisicao.SKU.QUANTIDADE_PLACA_ESTOQUE || 0 | number: 0 }} plc]
                            </a>

                        </td>
                    </tr>
                </tbody>
                <tfoot>
                    <tr>
                        <td class="text-normal" style="border-left:0">Qtd. Requisitar:</td>
                        <td class="text-center"></td>
                        <td class="text-right" style="padding: 1px;width: 25%;">
                            <input 
                                type="number" 
                                id="input-requisitar-quantidade"
                                min="@{{( vm.Requisicao.saldoInDisponivel() == true ? 0 : 0)}}" 
                                max="@{{ ( vm.Requisicao.SKU.HABILITA_REQ_SEM_LIMITE == 1 ? 999999999 : vm.Requisicao.SKU.QUANTIDADE_SALDO) }}"
                                form-validate="true" 
                                class="text-right" 
                                style="height: 100%;width: 100%;"
                                ng-model="vm.Requisicao.MODEL_QUANTIDADE_REQUISITAR"
                                ng-disabled="vm.Requisicao.SKU.HABILITA_REQ_SEM_LIMITE == 1 ? false : (vm.Requisicao.SKU.QUANTIDADE_SALDO == 0 || vm.Requisicao.SKU.QUANTIDADE_REQUISITADA_PENDENTE > 0 || (vm.Requisicao.SKU.QUANTIDADE_ABERTO == 0 && vm.Requisicao.SKU.HABILITA_REQ_SKU_FECHADO == 0))"
                                ng-readonly="vm.Requisicao.SKU.HABILITA_REQ_SEM_LIMITE == 1 ? false : (vm.Requisicao.SKU.QUANTIDADE_SALDO == 0 || vm.Requisicao.SKU.QUANTIDADE_REQUISITADA_PENDENTE > 0 || (vm.Requisicao.SKU.QUANTIDADE_ABERTO == 0 && vm.Requisicao.SKU.HABILITA_REQ_SKU_FECHADO == 0))"
                                required 
                                />
                        </td>
                        <td style="border-right:0;padding: 5px;">
                            <button 
                                type="submit" 
                                class="btn btn-xs btn-success"
                                ng-disabled="vm.Requisicao.checConfirmar()"
                                ng-readonly="vm.Requisicao.checConfirmar()"
                                >Confirmar
                            </button>

                            <div
                                class="form-group"
                                ng-click="vm.Requisicao.marcarurgente();"
                                ng-if="vm.Requisicao.SKU.QUANTIDADE_PLACAS > 0"
                                style="width: 130px; display: inline-flex; border: 1px solid #cccccc; border-radius: 18px; margin-top: 3px; cursor: pointer; background-color: white; margin: 0; float: right;">
                                
                                <label class="conc_switch">
                                    <input type="checkbox" disabled="" class="no_selection" ng-checked="vm.Requisicao.SKU.URGENTE == 0">
                                    <span class="slider round"></span>		
                                </label>
        
                                <label style="margin-bottom: 3px; margin-top: 4px; margin-left: 4px; margin-right: 4px; cursor: pointer;" ng-if="vm.Requisicao.SKU.URGENTE == 0"> Normal</label>
                                <label style="margin-bottom: 3px; margin-top: 4px; margin-left: 4px; margin-right: 4px; cursor: pointer;" ng-if="vm.Requisicao.SKU.URGENTE == 1"> Urgente</label>
                            </div>
    
                        </td>
                    </tr>
                </tfoot>
            </table>  
        </div>
    </form>

    <div 
        class="alert alert-danger" 
        style="margin-bottom: 5px;"
        ng-if="(vm.Requisicao.SKU.QUANTIDADE_ABERTO == 0 ) && vm.Requisicao.SKU.HABILITA_REQ_SKU_FECHADO == 0">
        Usuário não possui permissão para requisitar sku fechado. [U192]
    </div>    
    
    @include('ppcp._22240.requisicao.modal-defeito')
    @include('ppcp._22240.requisicao.modal-sobra')
    @include('ppcp._22240.requisicao.modal-placa')
    @include('ppcp._22240.requisicao.modal-placa2')
    @include('ppcp._22240.requisicao.modal-requisicao-registrada')
    
</div>
@endsection

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