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

@section('modal-start')
    <form class="form-inline" ng-submit="vm.RegistroTransacaoEstoqueItens.TIPO_ADD < 3 ? vm.RegistroTransacaoEstoqueItens.gravar() : vm.RegistroTransacaoEstoqueItens.confirmItensSelected()">
@overwrite

@section('modal-header-left')

<h4 class="modal-title">
	<!-- @{{vm.RegistroTransacaoEstoque.SELECTED.DESCRICAO}} -->
	<span ng-if="!vm.RegistroTransacaoEstoqueItens.ALTERANDO">{{ Lang::get('estoque/_15270.titulo2-exibir') }}</span>
	<span ng-if="vm.RegistroTransacaoEstoqueItens.INCLUINDO">{{ Lang::get('estoque/_15270.titulo2-incluir') }}</span>
	<span ng-if="vm.RegistroTransacaoEstoqueItens.ALTERANDO == true && vm.RegistroTransacaoEstoqueItens.INCLUINDO == false">{{ Lang::get('estoque/_15270.titulo2-alterar') }}</span>
</h4>

@overwrite

@section('modal-header-right')

	<button ng-if="vm.RegistroTransacaoEstoqueItens.ALTERANDO && vm.RegistroTransacaoEstoqueItens.TIPO_ADD < 3 && vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true" type="submit" class="btn btn-primary" data-hotkey="f1">
        <span class="glyphicon glyphicon-ok"></span> Adicionar
    </button>
	
	<button ng-if="vm.RegistroTransacaoEstoqueItens.ALTERANDO && vm.RegistroTransacaoEstoqueItens.TIPO_ADD < 3 && vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == false" type="button" class="btn btn-success" data-hotkey="f1" ng-click="vm.RegistroTransacaoEstoqueItens.validarEAN();">
        <span class="glyphicon glyphicon-ok"></span> Validar
    </button>
	
	<button ng-if="vm.RegistroTransacaoEstoqueItens.ALTERANDO && vm.RegistroTransacaoEstoqueItens.TIPO_ADD == 3" type="submit" class="btn btn-success" data-hotkey="f1">
        <span class="glyphicon glyphicon-ok"></span> Confirmar
    </button>
	
	<button ng-if="vm.RegistroTransacaoEstoqueItens.ALTERANDO" ng-click="vm.RegistroTransacaoEstoqueItens.cancelar()" type="button" class="btn btn-default btn-cancelar" data-hotkey="esc">
        <span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>
	
	<button ng-disabled="{{ userMenu($menu)->ALTERAR }} == 0 || (vm.RegistroTransacaoEstoqueItens.TIPO_ADD == 2 && vm.RegistroTransacaoEstoque.ALTERANDO == false)" ng-if="!vm.RegistroTransacaoEstoqueItens.ALTERANDO" ng-click="vm.RegistroTransacaoEstoqueItens.alterar()" type="button" class="btn btn-primary" data-hotkey="f9">
        <span class="glyphicon glyphicon-edit"></span> Alterar
    </button>   
	
	<button ng-disabled="{{ userMenu($menu)->EXCLUIR }} == 0 || (vm.RegistroTransacaoEstoqueItens.TIPO_ADD == 2 && vm.RegistroTransacaoEstoque.ALTERANDO == false)" ng-if="!vm.RegistroTransacaoEstoqueItens.ALTERANDO" ng-click="vm.RegistroTransacaoEstoqueItens.excluir()" type="button" class="btn btn-danger" data-hotkey="f12">
        <span class="glyphicon glyphicon-trash"></span> Excluir
    </button>
	
	<button ng-if="!vm.RegistroTransacaoEstoqueItens.ALTERANDO" type="button" class="btn btn-default btn-fechar-modal btn-voltar" ng-click="vm.RegistroTransacaoEstoqueItens.fecharModal()" data-hotkey="esc">
		<span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 220px);">
<!-- height: calc(100vh - 617px); -->
	<div class="form-group" ng-show="vm.RegistroTransacaoEstoqueItens.HABILITA_EAN == true">
		<label style="text-align: left !important;">Código EAN:</label>
		<div class="input-group left-icon">
			<input
				type="text"
				style="width: 415px;"
				class="form-control text-right enterOnCodigoEAN"
				ng-model="vm.RegistroTransacaoEstoqueItens.SELECTED.EAN"
				only-digits2
				maxlength="13"
				ng-disabled="vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO">
			
			<div class="input-group-addon" style="padding: 9px !important;"><span class="fa fa-barcode"></span></div>
		</div>
	</div>

	<div style="display: -webkit-inline-box; width: 500px;" class="consulta-produto-item" ng-show="vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true"></div>

	<div class="form-group" ng-show="vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true" style="margin-top: 12px;">
		<label>Quantidade:</label>
		<div class="input-group right-icon">
			<input
				ng-number-format="5"
				type="text"
				required
				style="width: 150px;"
				class="form-control text-right"
				ng-model="vm.RegistroTransacaoEstoqueItens.SELECTED.QUANTIDADE"
				ng-readonly="!vm.RegistroTransacaoEstoqueItens.ALTERANDO"
				ng-disabled="vm.RegistroTransacaoEstoqueItens.SELECTED.GRADE_CODIGO != '0' && vm.RegistroTransacaoEstoqueItens.SELECTED.GRADE_CODIGO != null">
			<div class="input-group-addon" style="padding: 9px !important;"><span class="" ng-bind="vm.RegistroTransacaoEstoqueItens.SELECTED.PRODUTO_UNIDADEMEDIDA"></span></div>
		</div>
	</div>

	<fieldset ng-show="vm.RegistroTransacaoEstoqueItens.SELECTED.GRADE_CODIGO != '0' && vm.RegistroTransacaoEstoqueItens.SELECTED.GRADE_CODIGO != null && vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true" style="margin-top: 10px !important;">
		<legend>Quantidade por Tamanho</legend>					
		<div class="form-group" style="display: contents; width: 60% !important; padding-left: 15px; padding-bottom: 15px; border-radius: 9px; border-width: 1px 1px 1px 1px; border-color: rgb(221, 221, 221); border-style: solid; margin-top: -9px;">
			<div class="form-group" style="width: calc(100% - 125px);" id="test">
				<div class="input-group tamanhos" ng-repeat="item in vm.RegistroTransacaoEstoqueItens.SELECTED.TAMANHOS_SALDO track by $index" style="margin-right: 10px; margin-bottom: 5px; margin-top: 2px; margin-left: 5px;">
					<div class="input-group-addon registroTransacaoTamanhoAddon" ng-class="item.ALTERAR == '1' ? 'green999box' : 'gray999box'" style="padding: 9px; width: 47px;">
						<span>@{{item.TAMANHO_DESCRICAO}}</span>
					</div>

						<input
							ng-if="vm.RegistroTransacaoEstoqueItens.SELECTED.PODE_FRACIONAR == 'N' || vm.RegistroTransacaoEstoqueItens.SELECTED.PODE_FRACIONAR == '' || vm.RegistroTransacaoEstoqueItens.SELECTED.PODE_FRACIONAR == undefined"
							ng-number-format="0"
							type="text"
							style="width: 120px !important;"
							class="form-control text-right"
							ng-model="item.QUANTIDADE"
							ng-change="vm.RegistroTransacaoEstoqueItens.changeQuantidadeTotalTamanho();"
							ng-readonly="!vm.RegistroTransacaoEstoqueItens.ALTERANDO"
							ng-disabled="!vm.RegistroTransacaoEstoqueItens.ALTERANDO || item.ALTERAR == '0'"
							min="0">

						<input
							ng-if="vm.RegistroTransacaoEstoqueItens.SELECTED.PODE_FRACIONAR == 'S'"
							ng-number-format="5"
							type="text"
							style="width: 120px !important;"
							class="form-control text-right"
							ng-model="item.QUANTIDADE"
							ng-change="vm.RegistroTransacaoEstoqueItens.changeQuantidadeTotalTamanho();"
							ng-readonly="!vm.RegistroTransacaoEstoqueItens.ALTERANDO"
							ng-disabled="!vm.RegistroTransacaoEstoqueItens.ALTERANDO || item.ALTERAR == '0'"
							min="0">
				</div>
			</div>
		</div>
	</fieldset>

	<div style="display: inline-flex; width: 100%;">
		<div style="display: block; width: calc(100% - 500px);" ng-show="vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true">
			<label style="width: calc(100%); text-align: center; background-color: #337ab7;
				color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> Saldo Disponível do Produto </label>
			<div class="table-ec table-scroll" style="height: calc(230px);">
				<table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
					<thead>
						<tr>
							<th field="ESTABELECIMENTO_ID">Estabelecimento</th>
							<th field="LOCALIZACAO_ID">Localização</th>
							<th class="text-right" field="SALDO">Físico</th>
							<th class="text-right" field="SALDO_ALOCADO">Alocado</th>
							<th class="text-right" field="EMPENHADO">Empenhado</th>
							<th class="text-right" field="SALDO_DISPONIVEL">Disponível</th>
							<th class="text-right" field="SALDO_OC">Comprado</th>
						</tr>
					</thead>
					<tbody>
						<tr ng-repeat="item in vm.RegistroTransacaoEstoqueItens.SELECTED.LISTA_SALDOS"
							style="@{{item.DESTACADO == 1 ? 'background-color: yellow; font-weight: bolder;' : ''}}"
							ng-click="vm.RegistroTransacaoEstoqueItens.setEstoqueTamanhosProduto(item);"
							ng-class="{'selected' : (vm.RegistroTransacaoEstoqueItens.TABELA_ESTOQUE_SELECTED.SELECTED == item)}">

							<td>
								<span>
									@{{ item.ESTABELECIMENTO_ID }} - @{{ item.ESTABELECIMENTO_NOMEFANTASIA }}
								</span>
							</td>
							<td>
								<span>
									@{{ item.LOCALIZACAO_ID }} - @{{ item.LOCALIZACAO_DESCRICAO }}
								</span>
							</td>
							<td class="text-right">
								<span>
									@{{ item.SALDO }}
								</span>
							</td>						
							<td class="text-right">
								<span>
									@{{ item.SALDO_ALOCADO }}
								</span>
							</td>						
							<td class="text-right">
								<span>
									@{{ item.EMPENHADO }}
								</span>
							</td>						
							<td class="text-right">
								<span>
									@{{ item.SALDO_DISPONIVEL }}
								</span>
							</td>						
							<td class="text-right">
								<span>
									@{{ item.SALDO_OC }}
								</span>
							</td>						
						</tr>
					</tbody>
				</table>
			</div>
		</div>

		<div style="display: block; width: calc(100% - 1090px); margin-left: 20px;" ng-show="vm.RegistroTransacaoEstoqueItens.SELECTED.CONSULTADO == true">
			<label style="width: calc(100%); text-align: center; background-color: #337ab7;
				color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> Saldo por Grade </label>
			<div class="table-ec table-scroll" style="height: calc(230px);">
				<table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
					<thead>
						<tr>
							<th field="TAMANHO_DESCRICAO">Tam.</th>
							<th class="text-right" field="SALDO">Físico</th>
							<th class="text-right" field="SALDO_ALOCADO">Alocado</th>
							<th class="text-right" field="SALDO_DISPONIVEL">Disponível</th>
						</tr>
					</thead>
					<tbody>
						<tr ng-repeat="item in vm.RegistroTransacaoEstoqueItens.TABELA_ESTOQUE_PRODUTO">													
							<td>
								<span>
									@{{ item.TAMANHO_DESCRICAO }}
								</span>
							</td>						
							<td class="text-right">
								<span>
									@{{ item.SALDO }} @{{ item.UM }}
								</span>
							</td>
							<td class="text-right">
								<span>
									@{{ item.SALDO_ALOCADO }} @{{ item.UM }}
								</span>
							</td>															
							<td class="text-right">
								<span>
									@{{ item.SALDO_DISPONIVEL }} @{{ item.UM }}
								</span>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
</form>

@overwrite