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

<!-- <style>
	#modal-CBPrevisao .modal-dialog{
    width: 1140px !important;
	margin-left: calc(50vw - 570px);

	/* margem tem que ser calculada para ser dinâmica, no caso ai (metade da largura da tela(50vw) - metade do tamanho do elemento(495px)) */
};

</style> -->

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

@section('modal-header-left')

<h4 class="modal-title">
	<span ng-if="!vm.CBPrevisao.ALTERANDO">{{ Lang::get('financeiro/_20305.titulo-exibir') }}</span>
	<span ng-if="vm.CBPrevisao.INCLUINDO">{{ Lang::get('financeiro/_20305.titulo-incluir') }}</span>
	<span ng-if="vm.CBPrevisao.ALTERANDO == true && vm.CBPrevisao.INCLUINDO == false">{{ Lang::get('financeiro/_20305.titulo-alterar') }}</span>	
</h4>

@overwrite

@section('modal-header-right')

	<button ng-if="vm.CBPrevisao.ALTERANDO" type="submit" class="btn btn-success" data-hotkey="f1">
        <span class="glyphicon glyphicon-ok"></span> Gravar
    </button>
	
	<button ng-if="vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.cancelar()" type="button" class="btn btn-danger btn-cancelar" data-hotkey="esc">
        <span class="glyphicon glyphicon-ban-circle"></span> Cancelar
	</button>
	<!-- 
	<button ng-disabled="{{ userMenu($menu)->ALTERAR }} == 0" ng-if="!vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.importar()" type="button" class="btn btn-primary" data-hotkey="f9">
        <span class="glyphicon glyphicon-new-window"></span> Importar
    </button>  -->
	
	<button ng-disabled="!{{ userMenu($menu)->INCLUIR }}" ng-if="!vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.incluirNovo()" type="button" class="btn btn-primary" data-hotkey="f7">
        <span class="glyphicon glyphicon-plus"></span> Incluir Novo Registro 
	</button> 
	
	<button ng-disabled="!{{ userMenu($menu)->INCLUIR }} || vm.CBPrevisao.SELECTED.ORIGEM == '1'" ng-if="!vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.copiar()" type="button" class="btn btn-primary" data-hotkey="f8">
        <span class="fa fa-files-o"></span> Copiar Registro
    </button>   
	
	<button ng-disabled="{{ userMenu($menu)->ALTERAR }} == 0" ng-if="!vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.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"  ng-if="!vm.CBPrevisao.ALTERANDO" ng-click="vm.CBPrevisao.excluir()" type="button" class="btn btn-danger" data-hotkey="f12">
        <span class="glyphicon glyphicon-trash"></span> Excluir
    </button>
	
	<button ng-if="!vm.CBPrevisao.ALTERANDO" style="display: none;" id="historico_main_prev" disabled="true" data-consulta-historico data-tabela="TBCAIXABANCO_PREVISAO" 
		data-tabela-id="@{{ vm.CBPrevisao.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.CBPrevisao.ALTERANDO" data-consulta-arquivos data-tabela="TBCAIXABANCO_PREVISAO" data-tabela-id="@{{ vm.CBPrevisao.SELECTED.ID }}" type="button" class="btn  btn-info" data-hotkey="alt+a">
        <span class="glyphicon glyphicon-file"></span> {{ Lang::get('master.arquivos') }}
    </button> -->
	
	<button ng-if="!vm.CBPrevisao.ALTERANDO" type="button" class="btn btn-default btn-fechar-modal btn-voltar" ng-click="vm.CBPrevisao.fecharModal()" data-hotkey="esc">
        <span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>	

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 230px);">
	<!--<span class="btn btn-xs btn-default glyphicon glyphicon-refresh"></span>-->
	<!--
	<ul id="tab" class="nav nav-tabs" role="tablist"> 
		<li role="presentation" class="active tab-detalhamento">
			<a href="#tab1-container" id="tab1-tab" data-hotkey="alt+1" role="tab" data-toggle="tab" aria-controls="tab1-container" aria-expanded="true">
				1
				
			</a>
		</li>

		<li role="presentation" class="tab-detalhamento" ng-if="!vm.CBPrevisao.ALTERANDO">
			<a href="#tab2-container" id="tab2-tab" data-hotkey="alt+2" role="tab" data-toggle="tab" aria-controls="tab2-container" aria-expanded="false">
				2
			</a>
		</li>

		<li role="presentation" class="tab-detalhamento"  ng-if="!vm.CBPrevisao.ALTERANDO">
			<a href="#tab3-container" id="tab3-tab" data-hotkey="alt+3" role="tab" data-toggle="tab" aria-controls="tab3-container" aria-expanded="false">
				3
			</a>
		</li>
	</ul>

	<div id="tab-content" class="tab-content"  style="height: calc(100% - 45px);">
		
		<div role="tabpanel" class="tab-pane active in" id="tab1-container" name="" aria-labelledby="tab1-tab" style="height: 100%; overflow:auto;">
			<div class="row">
		
			</div>
		</div>

		<div role="tabpanel" class="tab-pane" id="tab2-container" name="" aria-labelledby="tab2-tab" style="height: 100%; overflow:auto;">
			<div class="row">

			</div>
		</div>

		<div role="tabpanel" class="tab-pane" id="tab3-container" name="" aria-labelledby="tab3-tab" style="height: 100%; overflow:auto;">
			<div class="row">

			</div>
		</div>

	</div>
-->
	
    <div class="row">

		<div class="form-group">
            <label>ID:</label>
            <input type="text" class="form-control input-menor"
				ng-model="vm.CBPrevisao.SELECTED.DESC_ID"
                readonly="readonly">
        </div>

		<div style="display: -webkit-inline-box;" class="consulta-estabelecimento"> </div>
		<div style="display: -webkit-inline-box;" class="consulta-caixabanco">		</div>
		<div style="display: -webkit-inline-box;" class="consulta-empresa">			</div>
		<div style="display: -webkit-inline-box;" class="consulta-classificacao">	</div>
		<div style="display: -webkit-inline-box;" class="consulta-ccusto2c">		</div>

		<div class="form-group">
            <label>Documento:</label>
			<input 
				style="width: 163px !important;"
                type="text"
                class="form-control input-menor" 
                ng-model="vm.CBPrevisao.SELECTED.DOCUMENTO"
                ng-readonly="!vm.CBPrevisao.ALTERANDO">
		</div>
		
        <div class="form-group">
            <label>Histórico:</label>
			<input 
				style="width: 388px !important;"
                type="text" maxlength="100"
                class="form-control input-maior" 
                required
                ng-model="vm.CBPrevisao.SELECTED.HISTORICO"
                ng-readonly="!vm.CBPrevisao.ALTERANDO">
		</div>	
		
		<!-- <div tabindex="0" ng-keypress="vm.CBPrevisao.change_natureza($event);" class="form-group" ng-click="vm.CBPrevisao.change_natureza();" style="display: inline-flex; border: 1px solid #cccccc; border-radius: 18px; margin-top: 23px; cursor: pointer; background-color: white;">
			<label class="conc_switch">
				<input type="checkbox" disabled class="no_selection" ng-checked="vm.CBPrevisao.SELECTED.TIPO == 'D'">
				<span class="slider round">
					<label ng-if="vm.CBPrevisao.SELECTED.TIPO == 'C'" style="margin-left: 35px; margin-top: 4px; color: white; font-size: 14pt;">S</label>
					<label ng-if="vm.CBPrevisao.SELECTED.TIPO == 'D'" style="margin-left: 10px; margin-top: 4px; font-size: 14pt; color: white;">E</label>
				</span>		
			</label>			
			<label style="margin-top: 7px; margin-left: 9px; margin-right: 8px; cursor: pointer;"> Natureza </label>
		</div> -->

		<div class="form-group">
			<label>Tipo de Pendência:</label>
			<div class="input-group">
				<select name="repeatSelect" id="repeatSelect"
					ng-disabled="!vm.CBPrevisao.ALTERANDO || vm.CBPrevisao.SELECTED.ORIGEM == '1'" 
					ng-model="vm.CBPrevisao.SELECTED.SALDO_REUTILIZADO">
					<option value="0">Finalizar ao Usar Provisão</option>
					<option value="1">Finalizar ao Zerar o Saldo</option>
				</select>
			</div>
		</div>

		<div class="form-group">
			<div style="display: -webkit-inline-box;" class="consulta-forma-pagamento"> </div>

			<div class="form-group">
				<label>Observações:</label>
				<div class="textarea-grupo">
					<textarea 
						class="form-control normal-case" 
						rows="1"
						cols="74"
						maxlength="200"
						ng-model="vm.CBPrevisao.SELECTED.OBSERVACAO"
						ng-readonly="!vm.CBPrevisao.ALTERANDO">
					</textarea> 
				</div>
			</div>

			<div class="form-group" ng-show="vm.CBPrevisao.SELECTED.ORIGEM == '1' && vm.CBPrevisao.SELECTED.FOLHA_PAGAMENTO_ID > 0">
				<label>Folha de Pagamento: <a tabindex="-1" href="/_34060?FOLHA_ID=@{{vm.CBPrevisao.SELECTED.FOLHA_PAGAMENTO_ID}}" target="_blank" rel="noopener noreferrer"><span class="fa fa-external-link" title="34060 - Folhas de Pagamento"></span></a></label>
				<input 
					style="width: 420px !important;"
					type="text"
					class="form-control input-maior" 
					ng-model="vm.CBPrevisao.SELECTED.DESC_FOLHA_PAGAMENTO"
					ng-readonly="true">
			</div>
			
			<!-- <div class="form-group">
				<label>Observações:</label>
				<input 
					type="text" 
					maxlength="200"
					class="form-control input-maior" 
					ng-model="vm.CBPrevisao.SELECTED.OBSERVACAO"
					ng-readonly="!vm.CBPrevisao.ALTERANDO">
			</div> -->
		</div>
		<!-- <div class="form-group">
			<label>Status:</label>
			<label class="switch">
				<input 
					type="checkbox" 
					ng-checked="vm.CBPrevisao.SELECTED.STATUS == '1'"
					ng-true-value="'1'"
					ng-false-value="'0'"
					ng-disabled="!vm.CBPrevisao.ALTERANDO"
					ng-click="vm.CBPrevisao.SELECTED.STATUS = (vm.CBPrevisao.SELECTED.STATUS == '1') ? '0' : '1'">
				<div 
					class="slider"></div>
			</label>
		</div> -->
		
		<!-- <div style="display: -webkit-inline-box;" class="consulta-usuario"></div> -->
		<!-- <div class='div_arquivos'></div> -->
		
    </div>
		<!-- ng-show="(!vm.CBPrevisao.ALTERANDO || vm.CBPrevisaoItens.TIPO_ADD == 2) && vm.CBPrevisao.habilita_itens == true" -->
	<div style="margin-top: 10px;">   
		<fieldset>
			<legend>Parcelas</legend>			
			<ul class="list-inline">    
				<li ng-if="vm.CBPrevisao.ALTERANDO && vm.CBPrevisao.SELECTED.ORIGEM != '1'">
					<div class="form-group">
					
						<div class="form-group">
							<label>Data Base:</label>
							<input type="date" class="form-control datad_venc2" style="width: 155px;" ng-atalho 
								ng-readonly="!vm.CBPrevisao.ALTERANDO" ng-model="vm.CBPrevisaoItens.SELECTED_CLONE.DATA_PREVISAO">
						</div>

						<div class="form-group">
							<label ttitle="Incrementar dias a Data base">Inc. dias:</label>
							<input type="text" min="0" max="99999999" class="form-control input-menor text-right"
								ng-number-format="0" ng-model="vm.CBPrevisaoItens.SELECTED_CLONE.QUANTIA_DIAS">
						</div>

						<!-- <div class="form-group">
							<label>Recalcular o Vencimento:</label>
							<div class="input-group">
								<select ng-model="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA">									
									<option value="1">Manter a Data do Vencimento Calculada</option>
									<option value="2">Prorrogar Dia Útil</option>
									<option value="3">Antecipar Último Dia Útil</option>
								</select>
							</div>
						</div> -->
					</div>
					
					<div class="form-group">
						<label>Valor:</label>
						<div class="input-group left-icon">
							<div class="input-group-addon" style="padding: 9px !important;">R$</div>
							<input 
								type="text"
								style="width: 125px;"
								class="form-control input-medio text-right" 
								required
								ng-number-format="2"
								ng-model="vm.CBPrevisaoItens.SELECTED_CLONE.VALOR_TOTAL"
								ng-readonly="!vm.CBPrevisao.ALTERANDO">
						</div>
					</div>

					<div class="form-group">
						<label>Parcelas:</label>                
						<div style="display: flex;">
							<input type="text" ng-number-format="0" min="1" max="999" 
								class="form-control input-menor text-right faixa1" 
								style="width: 130px;" required
								ng-model="vm.CBPrevisaoItens.SELECTED_CLONE.FAIXA_INICIAL">
							<label class="periodo-a" style="margin-left: 5px; margin-right: 5px; margin-top: 5px;">a</label>
							<input type="text" ng-number-format="0" min="1" max="999" 
								class="form-control input-menor text-right faixa2" 
								style="width: 130px;" required
								ng-model="vm.CBPrevisaoItens.SELECTED_CLONE.FAIXA_FINAL">
						</div>
					</div>
					
					<div class="form-group" style="display: inline-flex;">
						<button type="button" class="btn btn-primary btn-incluir" data-hotkey="f6" 
							ng-disabled="!{{ userMenu($menu)->INCLUIR }} || !vm.CBPrevisao.ALTERANDO || vm.CBPrevisao.SELECTED.ORIGEM == '1'" 
							ng-click="vm.CBPrevisaoItens.incluirParcelas()" style="margin-top: 20px;">
							<span class="glyphicon glyphicon-plus"></span> Incluir
						</button>
						
						<div class="@{{ vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 1 ? 'icon_entrada' 	 : 
										vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 2 ? 'icon_saida'   	 : 
										vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 3 ? 'icon_antecipado' : ''}}" 
							style="margin-left: 5px;
								   margin-right: 0% !important; 
								   margin-top: 21px !important; 
								   background-color: white !important; 
								   padding-left: 1px !important; 
								   height: 32px !important; 
								   width: 32px !important;
								   cursor: pointer;"
							title="@{{ vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 1 ? 'Manter Regra de Cálculo de Data de Vencimento' 	     : 
									   vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 2 ? 'Prorrogar para o Próximo Dia Útil se Final de Semana' : 
									   vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 3 ? 'Antecipar para o Útimo Dia Útil se Final de Semana'   : ''}}"
							ng-click="vm.CBPrevisao.AlterarDataVencimento();"> 
							
							<span ng-if="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 1" style="font-weight: bold; font-size: 16pt; margin-left: 6px;"> M </span> 
							<span ng-if="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 2" style="font-weight: bold; font-size: 16pt; margin-left: 8px;"> P </span> 
							<span ng-if="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 3" style="font-weight: bold; font-size: 16pt; margin-left: 7px;"> A </span> 
						</div>
					</div>
					<!-- <div tabindex="0" ng-keypress="vm.CBPrevisao.change_natureza($event);" class="form-group" ng-click="vm.CBPrevisao.change_natureza();" 
						style="display: inline-flex; border: 1px solid #cccccc; border-radius: 18px; margin-top: 23px; cursor: pointer; background-color: white;">
						<label class="conc_switch">
							<input type="checkbox" disabled class="no_selection" ng-checked="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == 'D'">
							<span class="slider round">
								<label ng-if="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == '1'" style="margin-left: 35px; margin-top: 4px; color: white; font-size: 14pt;">M</label>
								<label ng-if="vm.CBPrevisao.SELECTED.TIPO_AJUSTE_DATA == '2'" style="margin-left: 10px; margin-top: 4px; font-size: 14pt; color: white;">E</label>
							</span>		
						</label>			
						<label style="margin-top: 7px; margin-left: 9px; margin-right: 8px; cursor: pointer;"> Natureza </label>
					</div> -->
				</li>     
			</ul>
			<div class="tabela_secundaria" id="tabela_secundaria"></div>
		</fieldset>
	</div>

	<div class="row" style="margin-top: 5px;">
		<label style="background-color: black; color: yellow; text-align: center;
			width: 100%; font-size: 20pt;border-radius: 10px;"> Valor Total: R$ @{{vm.CBPrevisao.SELECTED.VALOR_TOTAL2 | number:2 }}</label>
	</div>
	
	<!--
	<div ng-if="!vm.CBPrevisao.ALTERANDO" style="margin-top: 10px;">   
		<ul class="list-inline">    
			<li>
				<button 
					type="button" 
					class="btn btn-primary btn-incluir" 
					data-hotkey="f6"
					ng-disabled="!{{ userMenu($menu)->INCLUIR }}" 
					ng-click="vm.CBPrevisaoItens.incluir()">
					<span class="glyphicon glyphicon-plus"></span> Incluir
				</button>
			</li>                                         
		</ul>  
		
		<div class="form-group" style="margin-bottom: 4px; width: 100% !important;">
			<input 
				type="text"
				style="width: 100% !important;"
				placeholder="Filtragem rápida..."
				class="form-control input-maior" 
				required
				ng-model="vm.CBPrevisaoItens.FILTRO_DADOS">
		</div>
	
		<div class="table-ec table-scroll" style="height: calc(100vh - 400px); min-height: 200px;">
		
			<table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
				<thead>
					<tr gc-order-by="vm.CBPrevisaoItens.ORDER_BY">
						<th field="STATUS" style="width: 23px; min-width: 23px;" ttitle="Status<br/>Verde: Ativo | Vermelho: Inativo"></th>                    
						<th field="ID">ID</th>
						<th field="DESCRICAO">Descrição</th>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="item in vm.CBPrevisaoItens.DADOS_RENDER = ( vm.CBPrevisaoItens.DADOS | orderBy : vm.CBPrevisaoItens.ORDER_BY | find: {model : vm.CBPrevisaoItens.FILTRO_DADOS ,fields : 'all'})"
						ng-click="vm.CBPrevisaoItens.visualizar()"
						ng-focus="vm.CBPrevisaoItens.SELECTED = item"
						ng-class="{ 'selected' : vm.CBPrevisaoItens.SELECTED == item }"
						tabindex="0">
						<td class="t-status status-@{{ item.STATUS }}">
						</td>
						<td>
							<span>
								@{{ item.ID || 0 | lpad: [4,0] }}
							</span>
						</td>
						<td>
							<span>
								@{{ item.DESCRICAO }}
							</span>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	-->
	
</div>
</form>

@overwrite