@extends('helper.include.view.modal', ['id' => 'modal-composicao-embarque','class_size'=>'modal-lg'])

@section('modal-start')
    <form class="form-inline">
@overwrite

@section('modal-header-left')

	<h4 class="modal-title">
		Simulação do Roteiro de Composição de Embarque
	</h4>

@overwrite

@section('modal-header-right')
    <button type="button" class="btn btn-default btn-fechar-modal btn-voltar" data-dismiss="modal" data-hotkey="esc">
      <span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>
@overwrite

@section('modal-body')
<div>
    <style>
        #modal-composicao .modal-body {    
            height: calc(100vh - 65px);
        }
    </style>
    
    <div style="width:100%">
        
        <fieldset id="roteiro" style="margin-bottom: 0;">
            
            <div class="table-group">
                <!--<input type="text" ng-model="vm.Pedidos.MODEL_COMPOSICAO_FILTRO" placeholder="Filtragem rápida..." style="width: 100%;height: 23px;margin-bottom: 5px;"/>-->
                <div class="table-ec" style="height: calc(100vh - 213px/*194px*/);max-height: fit-content;">
                    <table class="table table-hover table-striped table-bordered table-condensed">
                        <thead>
                            <tr>
                                <th>Linha</th>
                                <th>Cor</th>
                                <th class="text-center">Tam.</th>
                                <th class="text-right">Qtd.</th>
                                
                            </tr>
                        </thead>
                        <tbody ng-init="vm.Pedidos.MODEL_COMPOSICAO_ORDER_BY = ['-TAMANHO_DESCRICAO','COR_DESCRICAO']">
                            <tr 
                                tabindex="0"
                                style="background: rgb(212, 212, 212);" 
                                ng-repeat-start="comp in vm.Pedidos.COMPOSICAO_EMBARQUE.COMPOSICOES" 
                                ng-keydown="$event.key == ' ' && (comp.CHK = comp.CHK == true ? false : true); $event.key == ' ' && $event.preventDefault();"
                                ng-if="comp.FILTERED.length > 0">

                                <td class="normal-case">Seq. @{{ comp.SEQUENCIA | lpad: [2,0] }}</td>
                                <td colspan="2">@{{ comp.CUBAGEM_PRODUTO_ID || 0 | lpad : [5,0] }} - @{{ comp.CUBAGEM_PRODUTO_DESCRICAO }}</td>
                                <td class="text-right">@{{ comp.QUANTIDADE | number : 0 | lpad : [3,0] }}</td>
                            </tr>
                            
                            <tr 
                                ng-repeat="item in comp.FILTERED = (comp.ITENS | find: { model: vm.Pedidos.MODEL_COMPOSICAO_FILTRO, fields : 'all' })">
       
                                <td>@{{ item.LINHA_ID | lpad:[3,0] }} - @{{ item.LINHA_DESCRICAO }}</td>
                                <td>@{{ item.COR_ID | lpad : [4,0] }} - @{{ item.COR_DESCRICAO }}</td>
                                <td class="text-center">@{{ item.TAMANHO_DESCRICAO }}</td>
                                <td class="text-right">@{{ item.QUANTIDADE | number : 0 | lpad : [3,0] }}</td>
                            </tr>                            
                            
                            <tr ng-repeat-end ng-if="false"></tr>
                        </tbody>
                    </table>
                </div>
            </div>      
        </fieldset>
        
    </div>
    
</div>

@overwrite

@section('modal-end')
    </form>
@overwrite