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

@section('modal-header-left')

<h4 class="modal-title">
	<span>19060 - Dados do Cliente</span>
</h4>

@overwrite

@section('modal-header-right')	
	
	<button ng-click="vm.ConferenciaPDV.fecharDadosCliente();" type="button" class="btn btn-default btn-fechar-modal btn-voltar" data-hotkey="esc">
        <span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 180px);">
	
	<div class="row">
		
		<div class="panel panel-primary" style="margin-bottom: 5px !important; margin-top: 3px;"> 
			<div class="panel-heading collapsed" style="cursor: pointer !important;" tabindex="1" data-hotkey="alt+1" 
				id="containerCliente1" data-toggle="collapse" data-target="#dadosCliente1" aria-expanded="true" aria-controls="dadosCliente1" ng-click="vm.changePainel('dadosCliente1');"> 				
				<h3 class="panel-title" tabindex="0">Grupo do Cliente <sub>(Alt+1)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					ng-class="{'fa-chevron-circle-down': !vm.DADOS_CLIENTE1,
								'fa-chevron-circle-up': vm.DADOS_CLIENTE1}" aria-hidden="true">
					</i></h3>
			</div> 
			<div class="panel-body collapse" id="dadosCliente1" aria-expanded="true" style="height: 30px;">		
			
				<div class="table-ec" style="border-radius: 8px 6px 6px 8px;">
					<table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
						<thead>
							<tr>	
								<th></th>
								<th>Cliente</th>
								<th>Nome Fantasia</th>
								<th colspan="3">CPF/CNPJ</th>
								<th colspan="2">Endereço</th>
								<th colspan="2">Contato</th>
							</tr>
						</thead>
	
						<tbody>
	
							<tr ng-repeat-start="cliente in vm.ConferenciaPDV.GRUPO_CLIENTES track by $index" class="@{{ 'tipo_linha_'+($index % 2) }}">								
								<td rowspan="2" style="width: 30px;">
									<button 
										type="button"
										class="btn btn-sm btn-warning"
										ttitle="Alterar o cliente do Pré-pedido"
										ng-disabled="(!vm.ConferenciaPDV.INCLUINDO && !vm.ConferenciaPDV.ALTERANDO) || cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID" 
										ng-model="cliente.PRE_PEDIDO" 
										ng-true-value="'1'" 
										ng-false-value="'0'" 
										ng-click="vm.ConferenciaPDV.mudarCliente(cliente)">

										<span class="ng-binding glyphicon glyphicon-refresh"></span>

									</button>
								</td>
								<td rowspan="2" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_ID_DESC }} - @{{ cliente.CLIENTE_NOME }}
									</span>
								</td>
								<td rowspan="2" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_NOMEFANTASIA }}
									</span>
								</td>
								<td colspan="3" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_CPF_CNPJ }}
									</span>
								</td>
								<td colspan="2" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_ENDERECO }} - @{{ cliente.CLIENTE_BAIRRO_CEP }}
									</span>
								</td>
								<td colspan="3" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_CONTATO }}
									</span>
								</td>								
							</tr>
							
							<tr ng-repeat-end=""  class="@{{ 'tipo_linha_'+($index % 2) }}">
								<td colspan="2" style="width: 150px;" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										<b>IE:</b> @{{ cliente.CLIENTE_IE }} &nbsp;&nbsp;&nbsp;<span ng-show="cliente.SUFRAMA != ''"><b>SUFRAMA:</b> @{{ cliente.CLIENTE_SUFRAMA }}</span>
									</span>
								</td>								
								<td colspan="3" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										@{{ cliente.CLIENTE_CIDADE_UF }}
									</span>
								</td>
								<td colspan="2" ng-class="{'cliente_select': cliente.CLIENTE_ID == vm.ConsultaCliente.item.dados.ID}">
									<span>
										<b>ANIVERSÁRIO:</b> &nbsp;@{{ cliente.CLIENTE_ANIVERSARIO }}
									</span>
								</td>
							</tr>
	
						</tbody>
					</table>
				</div>
			</div>
		</div>

		<div class="panel panel-primary" style="margin-bottom: 5px !important; margin-top: 10px;"> 
			<div class="panel-heading collapsed" style="cursor: pointer !important;" tabindex="1" data-hotkey="alt+2" 
				id="containerCliente2" data-toggle="collapse" data-target="#dadosCliente2" aria-expanded="true" aria-controls="dadosCliente2" ng-click="vm.changePainel('dadosCliente2');"> 				
				<h3 class="panel-title" tabindex="0">Descontos <sub>(Alt+2)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					ng-class="{'fa-chevron-circle-down': !vm.DADOS_CLIENTE2,
								'fa-chevron-circle-up': vm.DADOS_CLIENTE2}" aria-hidden="true">
					</i></h3> 
			</div> 
			<div class="panel-body collapse" id="dadosCliente2" aria-expanded="true" style="height: 30px;">				
				<table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
					<div class="tabela_parcelas_cliente_info" id="tabela_desconto_cliente_info"></div>
				</table>
			</div>
		</div>

		<div class="panel panel-primary" style="margin-bottom: 5px !important; margin-top: 10px;"> 
			<div class="panel-heading collapsed" style="cursor: pointer !important;" tabindex="1" data-hotkey="alt+3" 
				id="containerCliente3" data-toggle="collapse" data-target="#dadosCliente3" aria-expanded="true" aria-controls="dadosCliente3" ng-click="vm.changePainel('dadosCliente3');"> 				
				<h3 class="panel-title" tabindex="0">Histórico de Vendas <sub>(Alt+3)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					ng-class="{'fa-chevron-circle-down': !vm.DADOS_CLIENTE3,
								'fa-chevron-circle-up': vm.DADOS_CLIENTE3}" aria-hidden="true">
					</i>
					<button class="btn btn-success" type="button"
						ng-click="vm.ConferenciaPDV.ngWinPopUp('/_12500/',0,{width: 1000, height: 700},967)"> Metas 
						<span class="glyphicon glyphicon-new-window"></span>
					</button>
				</h3>
			</div> 
			<div class="panel-body collapse" id="dadosCliente3" aria-expanded="true" style="height: 30px;">							
				<div class="tabela_vendas_cliente_info" id="tabela_vendas_cliente_info"></div>				
			</div>
		</div>

		<div class="panel panel-primary" style="margin-bottom: 5px !important; margin-top: 10px;"> 
			<div class="panel-heading collapsed" style="cursor: pointer !important;" tabindex="1" data-hotkey="alt+4" 
				id="containerCliente4" data-toggle="collapse" data-target="#dadosCliente4" aria-expanded="true" aria-controls="dadosCliente4" ng-click="vm.changePainel('dadosCliente4');"> 				
				<h3 class="panel-title" tabindex="0">Parcelas em aberto <sub>(Alt+4)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					ng-class="{'fa-chevron-circle-down': !vm.DADOS_CLIENTE4,
								'fa-chevron-circle-up': vm.DADOS_CLIENTE4}" aria-hidden="true">
					</i></h3> 
			</div> 
			<div class="panel-body collapse" id="dadosCliente4" aria-expanded="true" style="height: 30px;">				
				<div class="tabela_parcelas_cliente_info" id="tabela_parcelas_cliente_info"></div>				
			</div>
		</div>

		<div class="panel panel-primary" style="margin-bottom: 5px !important; margin-top: 10px;"> 
			<div class="panel-heading collapsed" style="cursor: pointer !important;" tabindex="1" data-hotkey="alt+5" 
				id="containerCliente5" data-toggle="collapse" data-target="#dadosCliente5" aria-expanded="true" aria-controls="dadosCliente5" ng-click="vm.changePainel('dadosCliente5');"> 				
				<h3 class="panel-title" tabindex="0">Cheques em aberto <sub>(Alt+5)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					ng-class="{'fa-chevron-circle-down': !vm.DADOS_CLIENTE5,
								'fa-chevron-circle-up': vm.DADOS_CLIENTE5}" aria-hidden="true">
					</i></h3> 
			</div> 
			<div class="panel-body collapse" id="dadosCliente5" aria-expanded="true" style="height: 30px;">				
				<div class="tabela_cheques_cliente_info" id="tabela_cheques_cliente_info"></div>
			</div>
		</div>
						
	</div>
	
</div>

@overwrite