@extends('master')

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

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

@section('conteudo')
<div ng-controller="Ctrl as vm" ng-cloak>

  
    
    @include('ppcp._22170.index.panel-destaque')
    @include('ppcp._22170.index.form-filtro')

 
    
    
    <div ng-if="vm.Filtro.TAB_ACTIVE == 'PRODUZIR'">
        <br/>
        <fieldset>
            <legend>
                Indicadores de Eficiência
            </legend>
            <style>
                #table-indicador td {
                    font-size: 30px;
                    font-weight: bold;
                }
            </style>
            <table id="table-indicador" class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th class="text-right">Meta</th>
                        <th class="text-right">Qtd. Prod.</th>
                        <th class="text-right">Eficiência</th>
                        <th class="text-right">Eficácia</th>
                        <th class="text-right">Defeitos</th>
                        <th class="text-right">% Defeitos</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.QUANTIDADE_PROJETADA | number }} prs</td>
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.QUANTIDADE_PRODUZIDA | number }} prs</td>
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.EFICIENCIA | number : 2 }}%</td>
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.EFICACIA | number : 2 }}%</td>                    
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.QUANTIDADE_DEFEITO | number }}</td>
                        <td class="text-right text-lowercase">@{{ vm.Filtro.INDICADOR.PERCENTUAL_DEFEITO | number : 2 }}%</td>
                    </tr>
                </tbody>
            </table>
        </fieldset>
    </div>
    <br/>
    
    

    <ul class="nav nav-tabs">
        <li class="active">
            <a 
                ng-click="vm.Filtro.TAB_ACTIVE = 'PRODUZIR'"
                data-toggle="tab" 
                href="#tab-produzir">
                Talões a Produzir
            </a>
        </li>
        <li>
            <a 
                ng-click="vm.Filtro.TAB_ACTIVE = 'EM_ABERTO'"
                data-toggle="tab" 
                href="#tab-em-aberto">
                Talões Em Aberto
            </a>
        </li>
    </ul>    
    
    <div class="tab-content">
        @include('ppcp._22170.index.tab-produzir')
        @include('ppcp._22170.index.tab-em-aberto')
    </div>
      

    
    @include('ppcp._22170.index.modal-talao')
    @include('ppcp._22170.index.modal-talao.modal-justificativa')
    @include('ppcp._22170.index.modal-operador')
</div>
@endsection

@section('script')
    <script src="{{ elixir('assets/js/_22170.js') }}"></script>
@append