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

@section('modal-start')
    <form class="form-inline" ng-submit="vm.Sobra.confirmar()">
@overwrite

@section('modal-header-left')

	<h4 class="modal-title">
		Lançamento
	</h4>

@overwrite

@section('modal-header-right')
    <button ng-if="(vm.Sobra.STATUS != undefined)" type="submit" class="btn btn-success" data-hotkey="f10" data-loading-text="Confirmando...">
        <span class="glyphicon glyphicon-ok"></span> 
        Confirmar
    </button>
    
    <button ng-if="(vm.Sobra.STATUS != undefined)" ng-click="vm.Sobra.cancelar()" type="button" class="btn btn-danger" data-confirm="yes" data-hotkey="f2">
        <span class="glyphicon glyphicon-ban-circle"></span> Cancelar
    </button>

    <button ng-if="!(vm.Sobra.STATUS != undefined)" ng-click="vm.Sobra.alterar()" type="button" class="btn btn-primary" data-hotkey="f9">
        <span class="glyphicon glyphicon-edit"></span> Alterar
    </button>

    <button ng-if="!(vm.Sobra.STATUS != undefined)" ng-click="vm.Sobra.excluir()" type="button" class="btn btn-danger" data-hotkey="f12">
        <span class="glyphicon glyphicon-trash"></span> Excluir
    </button>

    <button ng-if="!vm.Sobra.INCLUINDO" data-consulta-historico data-tabela="TBSOBRA" data-tabela-id="@{{ vm.Sobra.SELECTED.ID }}" type="button" class="btn gerar-historico" data-hotkey="alt+h">
        <span class="glyphicon glyphicon-time"></span> {{ Lang::get('master.historico') }}
    </button>

    <button ng-if="!(vm.Sobra.STATUS != undefined)" 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-sobra .modal-body {    
            height: calc(100vh - 120px);
        }
    </style>
    

        <div class="form-group">
            <label>Id</label>
            <input 
                type="text" 
                class="form-control text-center input-menor" 
                form-validate="true" 
                ng-model="vm.Sobra.SELECTED.ID" 
                disabled/>
        </div>
    
    <!--<div class="panel-filter">-->
        <div class="inline consulta-estabelecimento"></div>
        <div class="form-group">
            <label>Remessa:</label>
            <input 
                type="number" 
                min="0" 
                step="1" 
                form-validate="true" 
                class="form-control input-menor"
                required
                ng-model="vm.Sobra.SELECTED.REMESSA_ID"
                ng-disabled="!(vm.Sobra.STATUS != undefined)"
                ng-required="vm.REG_DEF_SEM_TALAO == '0'"/>
        </div>

        <div class="form-group">
            <label>Data</label>
            <input 
                type="date" 
                class="form-control input-datetime" 
                form-validate="true" 
                style="width: 150px !important;"
                ng-model="vm.Sobra.SELECTED.DATA_DATE" 
                ng-disabled="!(vm.Sobra.STATUS != undefined)"
                required/>
        </div>
        
        <style>
            .consulta-gp input[type="search"] {
                width: 200px !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 
                type="number" 
                min="@{{vm.Sobra.SELECTED.QUANTIDADE_SOBRA == 0 ? 1 : 0}}" 
                step="1" 
                form-validate="true" 
                class="form-control input-menor text-right input-qtd" 
                ng-required="!(vm.Sobra.SELECTED.QUANTIDADE_SOBRA > 0)"
                ng-model="vm.Sobra.SELECTED.QUANTIDADE"
                ng-disabled="!(vm.Sobra.STATUS != undefined)"/>
        </div>        

        <div class="form-group">
            <label>Justificativa</label>
            <input 
                type="text" 
                class="form-control input-maior"  
                form-validate="true" 
                ng-model="vm.Sobra.SELECTED.JUSTIFICATIVA"
                ng-disabled="!(vm.Sobra.STATUS != undefined)"
                >
        </div>
    <!--</div>-->    
    
    <fieldset ng-if="vm.Sobra.SELECTED.ID > 0">
        <legend>Aproveitamento de Sobras</legend>
        
        <style>
            .t-status:before{margin-top: 3px !important;}
            .t-status.sobra-0:before {background-color: red;  }
            .t-status.sobra-1:before {background-color: green;}
            .t-status.sobra-2:before {background-color: gray; }
        </style>
        
        <div class="table-ec" style="height: initial;max-height: 200px;">
            <table class="table table-striped table-bordered table-hover table-condensed">
                <thead>
                    <tr>
                        <th class="text-center" ttitle="Status<br/>Vermelho: Em Aberto | Verde: Pago | Cinza: Encerrado"></th>
                        <th>Id</th>
                        <th ttitle="Endereçamento">Ender.</th>
                        <th>Qtd.</th>
                        <th>Saldo</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="sobra in vm.Sobra.SELECTED.SOBRAS">
                        <td class="t-status sobra-@{{ sobra.STATUS }}"></td>
                        <td>@{{ sobra.ID }}</td>
                        <td>@{{ sobra.ENDERECAMENTO }}</td>
                        <td>@{{ sobra.QUANTIDADE | number : 0 }}</td>
                        <td>@{{ sobra.SALDO | number : 0 }}</td>
                    </tr>
                </tbody>
            </table>
        </div>        
    </fieldset>
</div>

@overwrite

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