@extends('master')

@section('titulo')
    {{ Lang::get('vendas/_12121.titulo') }}
@endsection

@section('estilo')
    <link rel="stylesheet" href="{{ elixir('assets/css/12121.css') }}" />
@endsection

@section('conteudo')
<div ng-controller="Ctrl as vm" ng-cloak>

	<ul class="list-inline acoes">    
		<li>
			<button type="button" class="btn btn-default" 
				id="filtrar-toggle" data-toggle="collapse" 
				data-target="#filtro_main" aria-expanded="true" 
				aria-controls="filtro_main"
				ng-click="vm.VisaoCliente.tabela_height()">
				Filtro
				<span class="caret"></span>
			</button>
		</li>
	</ul>  
        
    <style>
	
        .t-status.status-0:before {
            background-color: rgb(217, 83, 79);    
        }
        
        .t-status.status-1:before {
            background-color: rgb(68, 157, 68);            
        }
		
		.table-condensed > thead > tr > th,
		.table-condensed > thead > tr > td,
		.table-condensed > tbody > tr > th,
		.table-condensed > tbody > tr > td,
		.table-condensed > tfoot > tr > th,
		.table-condensed > tfoot > tr > td {
			padding: 5px !important;
		}
        
	</style>
	<!-- style=" @{{vm.ConsultaGrupoCliente.item.selected == true ? 'height: 210px;' : ''}}" -->
	<form ng-submit="vm.VisaoCliente.consultar(1)" class="form-inline">		
		<div id="filtro_main" class="table-filter collapse in" aria-expanded="true" 
		
			style="margin-bottom: 4px; background: rgba(221,221,221,.33); padding: 2px 10px 7px; border-radius: 5px; ">
			<!--@{{vm.ConsultaGrupoCliente.item.selected == true ? 'height: 206px;' : ''}}  -->
			<div style="display: -webkit-inline-box; margin-right: 0px;" class="consulta-estab"> 		  	 </div>
			<div style="display: -webkit-inline-box; margin-right: 0px;" class="consulta-representantes"> 	 </div>
			<div style="display: -webkit-inline-box; margin-right: 0px;" class="consulta-grupo-cliente">  	 </div>
			<div style="display: -webkit-inline-box; margin-right: 0px;" ng-show="vm.ConsultaGrupoCliente.item.selected == false" class="consulta-cliente"></div>

			<div class="form-group" style="padding-top: 12px; width: fit-content; padding-right: 10px;">
				<button type="submit" class="btn btn-xs btn-primary btn-filtrar"
					data-hotkey="alt+f" id="btn-table-filter">
					<span class="glyphicon glyphicon-filter"></span> Filtrar
				</button>
			</div>	

			<!-- <br ng-show="vm.ConsultaGrupoCliente.item.selected == true"> -->
			
		</div>
	</form>

	<div style="height: calc(100vh - 205px);">
		<!-- ************************BLOCO DE DADOS CADASTRAIS DO CLIENTE**************************** -->
		
		<div class="panel panel-primary">
			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-dado-cadastral" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('1');"  
				aria-controls="collapse-dado-cadastral" role="tab" tabindex="0" data-hotkey="alt+1" id="heading-dado-cadastral">
				<h3 class="panel-title">Dados Cadastrais <sub>(Alt+1)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					   ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL1,
					   			  'fa-chevron-circle-up'  : vm.VisaoCliente.ABA_PAINEL1}" aria-hidden="true">
					</i>
				</h3> 
			</div>
		
			<div id="collapse-dado-cadastral" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-dado-cadastral" 
				style="display: @{{ vm.VisaoCliente.ABA_PAINEL1 == true ? 'flex' : 'none' }};">
				<div ng-show="vm.ConsultaGrupoCliente.item.selected == true" 
					 style="width: calc(330px);
							height: calc(1135px);
							float: left;
							padding: 0px;
							border: 1px solid #337ab7;
							border-radius: 0px 0px 5px 5px;
							background-color: #ffffff;
							margin-right: 10px;">
					<label style="width: calc(100%); margin-left: 0px; text-align: center; background-color: #337ab7;
								color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> Clientes do Grupo </label>
					<div class="tabela_clientes_grupo" id="tabela_clientes_grupo"></div>	
				</div>
				<div style="border: 1px solid #337ab7; border-radius: 5px 5px 5px 5px; padding: 5px;">					
					<div class="bloco-container">
    
						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-empresa') }}</h5>
					
						<div class="bloco">
					
							<label>{{ Lang::get($menu.'.label-conta-pai') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.DESCRICAO_EMPRESA_GRUPO"></span>
					
							<label>{{ Lang::get($menu.'.label-razao-social') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.RAZAOSOCIAL"></span>
					
							<label>{{ Lang::get($menu.'.label-nome-fantasia') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.NOMEFANTASIA"></span>

							<label>{{ Lang::get($menu.'.label-cnpj') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.CNPJ_MASKED"></span>
					
							<label>{{ Lang::get($menu.'.label-ie') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.IE"></span>
					
							<label>{{ Lang::get($menu.'.label-transportadora') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.TRANSPORTADORA_RAZAOSOCIAL"></span>
							
						</div>
					
						<div class="bloco">
							<!-- ng-if="vm.VisaoCliente.dadoCadastral.CODIGO > 0"
							ng-if="vm.VisaoCliente.dadoCadastral.CODIGO > 0" -->
							<label>{{ Lang::get($menu.'.label-dt-cliente') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.DATA_CADASTRO">(<span ng-bind="vm.VisaoCliente.dadoCadastral.TEMPO_CLIENTE"></span> Anos)</span>
					
							<label>{{ Lang::get($menu.'.label-nome-consultor') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.REPRESENTANTE_RAZAOSOCIAL"></span>
							
							<label>{{ Lang::get($menu.'.label-vendedor') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.VENDEDOR_NOME"></span>
							<label>{{ Lang::get($menu.'.label-status') }}:</label>
							<span>
								<span
									class="glyphicon icone-status"
									ng-class="{
										'Ativo'	 : 'glyphicon-ok sim',
										'Inativo': 'glyphicon-remove nao'
									}[vm.VisaoCliente.dadoCadastral.STATUS]"></span>
					
								<span ng-bind="vm.VisaoCliente.dadoCadastral.STATUS"></span>
							</span>
						</div>
					</div>

					<div class="bloco-container">

						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-endereco') }}</h5>

						<div class="bloco" style="width: 30%;">

							<label>{{ Lang::get($menu.'.label-endereco') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.ENDERECO"></span>

							<label>{{ Lang::get($menu.'.label-cidade') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.CIDADE"></span>

							<label>{{ Lang::get($menu.'.label-uf') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.UF"></span>

							<label>{{ Lang::get($menu.'.label-cep') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.CEP"></span>
						</div>

						<div class="bloco" style="width: 30%;">

							<label>{{ Lang::get($menu.'.label-numero') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.NUMERO"></span>

							<label>{{ Lang::get($menu.'.label-bairro') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.BAIRRO"></span>

							<label>{{ Lang::get($menu.'.label-complemento') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.COMPLEMENTO"></span>

							<label>{{ Lang::get($menu.'.label-geolocalizacao') }}:</label>
							<span>
								<span ng-bind="vm.VisaoCliente.dadoCadastral.mapMsg"></span>
								<div class="js-mapholder" id="mapholder"></div>
							</span>
						</div>

						<div class="bloco" style="width: 30%;">
							
							<label>{{ Lang::get($menu.'.label-bloqueia-pedido') }}:</label>
							<span class="vertical-baseline">
								<span
									class="glyphicon icone-status"
									ng-class="{
										'1': 'glyphicon-ok sim',
										'0': 'glyphicon-remove nao'
									}[vm.VisaoCliente.dadoCadastral.BLOQUEIA_PEDIDO]"></span>
					
								<span ng-bind="vm.VisaoCliente.dadoCadastral.BLOQUEIA_PEDIDO == 0 ? 'Não' : 'Sim'"></span>
							</span>
							
							<label>{{ Lang::get($menu.'.label-bloqueia-nf') }}:</label>
							<span class="vertical-baseline">
								<span
									class="glyphicon icone-status"
									ng-class="{
										'1': 'glyphicon-ok sim',
										'0': 'glyphicon-remove nao'
									}[vm.VisaoCliente.dadoCadastral.BLOQUEIA_NOTAFISCAL]"></span>
					
								<span ng-bind="vm.VisaoCliente.dadoCadastral.BLOQUEIA_NOTAFISCAL == 0 ? 'Não' : 'Sim'"></span>
							</span>
							
							<label>{{ Lang::get($menu.'.label-forma-pagamento') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.PAGAMENTO_FORMA_DESCRICAO"></span>
							
							<label>{{ Lang::get($menu.'.label-condicao-pagamento') }}:</label>
							<span 
								class="vertical-baseline"
								ng-bind="vm.VisaoCliente.dadoCadastral.PAGAMENTO_CONDICAO_DESCRICAO"></span>
					
						</div>
					</div>

					<div class="bloco-container bloco-container-contato">
						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-contato-info') }}</h5>

						<div class="bloco">

							<label>{{ Lang::get($menu.'.label-fone1-cliente') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.FONE_MASKED"></span>

							<label>{{ Lang::get($menu.'.label-fone2-cliente') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.FAX_MASKED"></span>

							<label>{{ Lang::get($menu.'.label-celular-cliente') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.CELULAR_MASKED"></span>
						</div>

						<div class="bloco">

							<label>{{ Lang::get($menu.'.label-contato') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.CONTATO"></span>
							
							<label>{{ Lang::get($menu.'.label-aniver-empresa') }}:</label>
							<span ng-bind="vm.VisaoCliente.dadoCadastral.DATA_ANIVERSARIO"></span>

							<label>{{ Lang::get($menu.'.label-email') }}:</label>
							<span style="max-width: calc(100% - 190px); text-overflow: ellipsis; overflow: hidden;"
								 ng-bind="vm.VisaoCliente.dadoCadastral.EMAIL"></span>

						</div>
					
					</div>
					
					<div class="bloco-container bloco-container-contato">
						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-contato-lista') }}</h5>
						<div class="tabela_contatos" id="tabela_contatos"></div>	
						<!-- <div class="bloco" ng-repeat="contato in vm.VisaoCliente.contato | orderBy:'ID' track by $index">
							<div style="display: grid;">
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-nome') }}:</label><span ng-bind="contato.NOME"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-setor') }}:</label><span ng-bind="contato.SETOR"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-funcao') }}:</label><span ng-bind="contato.FUNCAO"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-data-aniversario') }}:</label><span ng-bind="contato.DATA_ANIVERSARIO"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-fone1') }}:</label><span ng-bind="contato.FONE_1"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-fone2') }}:</label><span ng-bind="contato.FONE_2"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-fone3') }}:</label><span ng-bind="contato.FONE_3"></span></div>
								<div style="display: flex;"> <label style="width: 180px; text-align: end;">{{ Lang::get($menu.'.label-email') }}:</label><span ng-bind="contato.EMAIL"></span></div>
							</div>
							 <div style="display: grid;">
								<span ng-bind="contato.FONE_2"></span>
								<span ng-bind="contato.FONE_3"></span>
								<input type="text" ng-model="contato.FONE_1" ui-mask="(99) 9999-9999" disabled>
								<input type="text" ng-model="contato.FONE_2" ui-mask="(99) 9999-9999" disabled>
								<input type="text" ng-model="contato.FONE_3" ui-mask="(99) 9999-9999" disabled> 
								<span ng-bind="contato.EMAIL"></span>
							</div> 
						</div>-->
					</div>
					<div class="bloco-container">
    
						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-info-financeiras') }}</h5>

						<div class="bloco" style="display: flex; width: 30%">
							<div style="display: grid; text-align: right;">
								<label>{{ Lang::get($menu.'.label-limite-credito') }}:</label>
								<label>{{ Lang::get($menu.'.label-valor-ped-aberto') }}:</label>
								<label>{{ Lang::get($menu.'.label-valor-pre-ped-aberto') }}:</label>
								<label style="font-style: italic;">{{ Lang::get($menu.'.label-valor-ped-vencido') }}:</label>
								<label style="font-style: italic;">{{ Lang::get($menu.'.label-valor-ped-a-vencer') }}:</label>
								<label>{{ Lang::get($menu.'.label-valor-parc-aberto') }}:</label>
								<label>{{ Lang::get($menu.'.label-valor-adiantamentos') }}:</label>
								<label>{{ Lang::get($menu.'.label-limite-disponivel') }}:</label>
							</div>

							<div style="display: grid; text-align: right; width: 200px;">
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.LIMITE_CREDITO 	   | currency:'R$ ':2"></span>							
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PED_ABERTO 	   | currency:'R$ ':2"></span>							
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PRE_PED_ABERTO | currency:'R$ ':2"></span>
								<span style="font-style:  italic;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_VENCIDA   | currency:'R$ ':2"></span>							
								<span style="font-style:  italic;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_VINCENDA  | currency:'R$ ':2"></span>							
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_ABERTAS   | currency:'R$ ':2"></span>						
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_ADIANTAMENTOS  | currency:'R$ ':2"></span>							
								<span style="font-weight: bolder;" ng-bind="vm.VisaoCliente.dadoCadastral.LIMITE_DISPONIVEL    | currency:'R$ ':2"></span>								
							</div>
						</div>

						<!-- <div class="bloco">
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-limite-credito') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="vm.VisaoCliente.dadoCadastral.LIMITE_CREDITO | currency:'R$ ':2"></span>
							<br>
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-valor-ped-aberto') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PED_ABERTO | currency:'R$ ':2"></span>
							<br>
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-valor-ped-vencido') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_VENCIDA | currency:'R$ ':2"></span>
							<br>
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-valor-ped-a-vencer') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_VINCENDA | currency:'R$ ':2"></span>
							<br>
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-valor-parc-aberto') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="vm.VisaoCliente.dadoCadastral.VALOR_PARC_ABERTAS | currency:'R$ ':2"></span>
							 <br>
							<label style="width: 190px !important; white-space: nowrap;">{{ Lang::get($menu.'.label-limite-disponivel') }}:</label>
							<span style="max-width: fit-content !important; margin-left: 5px;" ng-bind="(vm.VisaoCliente.dadoCadastral.LIMITE_DISPONIVEL) | currency:'R$ ':2"></span>
						</div>
					 -->
					
					</div>

					<div class="bloco-container">
						
						<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-info-conta') }}</h5>

						<div class="bloco" style="display: flex; width: 30%;">

							<div style="display: grid; text-align: right;">
							
								<label>{{ Lang::get($menu.'.label-data-prim-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-data-ult-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-realiz-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-data-ult-visita') }}:</label>
								<label>{{ Lang::get($menu.'.label-recebeu-visita') }}:</label>

							</div>

							<div style="display: grid; text-align: left; width: 200px;">
								<span style="min-height: 14px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_PRIM_PEDIDO}}
									<a tabindex="-1" href="{{ url('') }}/_12201?PEDIDO=@{{vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO}}</a>
								</span>
								<span class="vertical-baseline" style="min-height: 14px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_ULT_PEDIDO}}
									<a tabindex="-1" href="{{ url('') }}/_12201?PEDIDO=@{{vm.VisaoCliente.dadoCadastral.ULT_PEDIDO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.ULT_PEDIDO > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.ULT_PEDIDO}}</a>
								</span>
								<span class="vertical-baseline" style="min-height: 10px;">
									<span
										class="glyphicon icone-status"
										ng-class="{
											'Sim': 'glyphicon-ok sim',
											'Não': 'glyphicon-remove nao'
										}[vm.VisaoCliente.dadoCadastral.REALIZOU_PEDIDO_30_DIAS]"></span>
	
									<span ng-bind="vm.VisaoCliente.dadoCadastral.REALIZOU_PEDIDO_30_DIAS"></span>
								</span>
								<span ng-bind="vm.VisaoCliente.dadoCadastral.FDATA_ULT_VISITA" style="min-height: 13px;"></span>
								<span class="vertical-baseline" style="min-height: 11px;">
									<span class="glyphicon icone-status"
										ng-class="{
											'Sim': 'glyphicon-ok sim',
											'Não': 'glyphicon-remove nao'
										}[vm.VisaoCliente.dadoCadastral.RECEBEU_VISITA_30_DIAS]"></span>
	
									<span ng-bind="vm.VisaoCliente.dadoCadastral.RECEBEU_VISITA_30_DIAS"></span>
								</span>
							</div>
						</div>

						
						<div class="bloco" style="display: flex; width: 30%;">

							<div style="display: grid; text-align: right;">
							
								<label>{{ Lang::get($menu.'.label-data-prim-pre-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-data-ult-pre-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-realiz-pre-pedido') }}:</label>
								<label>{{ Lang::get($menu.'.label-ult-documento') }}:</label>

							</div>

							<div style="display: grid; text-align: left; width: 200px;">
								<span style="min-height: 14px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_PRIM_PRE_PEDIDO}}
									<a tabindex="-1" href="{{ url('') }}/_19060?ID=@{{vm.VisaoCliente.dadoCadastral.PRIM_PRE_PEDIDO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.PRIM_PRE_PEDIDO > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.PRIM_PRE_PEDIDO}}</a>
								</span>
								<span class="vertical-baseline" style="min-height: 14px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_ULT_PRE_PEDIDO}}
									<a tabindex="-1" href="{{ url('') }}/_19060?ID=@{{vm.VisaoCliente.dadoCadastral.ULT_PRE_PEDIDO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.ULT_PRE_PEDIDO > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.ULT_PRE_PEDIDO}}</a>
								</span>
								<span class="vertical-baseline" style="min-height: 10px;">
									<span
										class="glyphicon icone-status"
										ng-class="{
											'Sim': 'glyphicon-ok sim',
											'Não': 'glyphicon-remove nao'
										}[vm.VisaoCliente.dadoCadastral.REALIZOU_PRE_PEDIDO_30_DIAS]"></span>
	
									<span ng-bind="vm.VisaoCliente.dadoCadastral.REALIZOU_PRE_PEDIDO_30_DIAS"></span>
								</span>
								<span class="vertical-baseline" style="min-height: 14px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_ULT_DOCUMENTO}}
									<a tabindex="-1" href="{{ url('') }}/_21150?NF_ID=@{{vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO > 0 && vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO_TIPO == 1" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.FULT_DOCUMENTO}}</a>
									<a tabindex="-1" href="{{ url('') }}/_19040?CUPOM_ID=@{{vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO > 0 && vm.VisaoCliente.dadoCadastral.ULT_DOCUMENTO_TIPO == 2" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.FULT_DOCUMENTO}}</a>
								</span>
							</div>
						</div>

						<div class="bloco" style="display: flex; width: 30%;">

							<div style="display: grid; text-align: right;">
								<label>{{ Lang::get($menu.'.label-data-prim-pedido-amostra') }}:</label>
								<label>{{ Lang::get($menu.'.label-data-ult-pedido-amostra') }}:</label>
								<label>{{ Lang::get($menu.'.label-realiz-pedido-amostra') }}:</label>
							</div>

							<div style="display: grid; text-align: left;">
								<span style="min-height: 14px; min-height: 7px; white-space: nowrap; height: 20px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_PRIM_PEDIDO_AMOSTRA}}
									<a tabindex="-1" href="{{ url('') }}/_12201?PEDIDO=@{{vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO_AMOSTRA}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO_AMOSTRA > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.PRIM_PEDIDO_AMOSTRA}}</a>
								</span>

								<span style="min-height: 14px;max-height: 10px; min-height: 10px;margin-top: -15px; height: 10px;">
									@{{vm.VisaoCliente.dadoCadastral.FDATA_ULT_PEDIDO_AMOSTRA}}
									<a tabindex="-1" href="{{ url('') }}/_12201?PEDIDO=@{{vm.VisaoCliente.dadoCadastral.ULT_PEDIDO_AMOSTRA}}" 
										ng-if="vm.VisaoCliente.dadoCadastral.ULT_PEDIDO_AMOSTRA > 0" target="_blank" rel="noopener noreferrer"> - @{{vm.VisaoCliente.dadoCadastral.ULT_PEDIDO_AMOSTRA}}</a>
								</span>
								<!-- <span class="vertical-baseline" style="min-height: 11px;" ng-bind="vm.VisaoCliente.dadoCadastral.FDATA_PRIM_PEDIDO_AMOSTRA"></span>
								<span class="vertical-baseline" style="min-height: 11px;" ng-bind="vm.VisaoCliente.dadoCadastral.FDATA_ULT_PEDIDO_AMOSTRA"></span> -->
							
								<span class="vertical-baseline" style="min-height: 9px;margin-bottom: -10px;">
									<span
										class="glyphicon icone-status"
										ng-class="{
											'Sim': 'glyphicon-ok sim',
											'Não': 'glyphicon-remove nao'
										}[vm.VisaoCliente.dadoCadastral.REALIZOU_PEDIDO_AMOSTRA_30_DIAS]"></span>
	
									<span ng-bind="vm.VisaoCliente.dadoCadastral.REALIZOU_PEDIDO_AMOSTRA_30_DIAS"></span>
								</span>
							</div>

						</div>

					</div>		
				</div>
			</div>
		</div>

		<!-- **************************************************************************************** -->

		<!-- ************************BLOCO DE RESUMOS DE VENDAS************************************** -->
		
		<div class="panel panel-primary">

			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-resumo-venda" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('2');"  
				aria-controls="collapse-resumo-venda" role="tab" tabindex="0" data-hotkey="alt+2" id="heading-resumo-venda">
				<h3 class="panel-title">{{ Lang::get($menu.'.a-resumo-venda') }} <sub>(Alt+2)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					   ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL2,
					   			  'fa-chevron-circle-up'  : vm.VisaoCliente.ABA_PAINEL2}" aria-hidden="true">
					</i>
				</h3> 
				<!-- <a 
					role="button" 
					data-toggle="collapse" 
					data-parent="#accordion" 
					href="#collapse-resumo-venda" 
					aria-controls="collapse-resumo-venda">
					
				</a> -->
			</div>
		
			<div id="collapse-resumo-venda" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-resumo-venda">
		
				<div class="panel-body">
					
					<div class="bloco-container bloco-container-resumo-venda">

						<div class="row" style="display: flex; margin-left: 0px; margin-bottom: 10px;">
							<div style="width: 50%;">
								<label style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
									Resumo por Ano
								</label>
								<div class="tabela_resumo_anual" id="tabela_resumo_anual">	</div>
							</div>
							<div style="width: 50%;">								
								<label style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
									Resumo por Mês: <select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
									ng-change="vm.VisaoCliente.consultarResumoMes();" ng-model="vm.VisaoCliente.DATA_ANO_RESUMO">
										<option value="@{{x}}" style="background-color: #337ab7; color: white;" 
										ng-repeat="x in vm.VisaoCliente.LISTA_ANOS track by $index">@{{x}}</option> </select>
									,Período por:
									<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0; text-transform: none;" 
										ng-change="vm.VisaoCliente.changePeriodoResumoMes();vm.VisaoCliente.consultarResumoMes();" ng-model="vm.VisaoCliente.DATA_ANO_TRIMESTRE_RESUMO">
										<option value="@{{xu.TRIMESTRE}}" style="background-color: #337ab7; color: white; text-transform: none;" 
										ng-repeat="xu in vm.VisaoCliente.LISTA_TRIMESTRE track by $index">@{{xu.DESCRICAO}}</option> </select>
									
								</label>
								<div class="tabela_resumo_mensal" id="tabela_resumo_mensal"></div>
							</div>
							
						</div>

						<ul id="tab" class="nav nav-tabs" role="tablist"> 
							<li role="presentation" ng-repeat="item in vm.VisaoClienteResumos.RESUMOS_VENDAS track by item.ID" 
								class="@{{vm.VisaoClienteResumos.RESUMOS_SELECTED == item.ID ? 'active' : ''}} tab-detalhamento">
								<a href="#tab@{{item.ID}}-container" id="tab@{{item.ID}}-tab" role="tab" data-toggle="tab" aria-controls="tab@{{item.ID}}-container" aria-expanded="true"
								   style="font-weight: bolder; color: rgb(51, 122, 183);">
									@{{item.TITULO}}		
								</a>
							</li>
						</ul>
					
						<div id="tab-content" class="tab-content" style="height: calc(100% - 45px);">
							
							<div role="tabpanel" ng-repeat="item in vm.VisaoClienteResumos.RESUMOS_VENDAS track by item.ID" 
								class="tab-pane @{{vm.VisaoClienteResumos.RESUMOS_SELECTED == item.ID ? 'active in' : ''}}" 
								id="tab@{{item.ID}}-container" name="" aria-labelledby="tab@{{item.ID}}-tab" style="height: 100%;">
								<div class="row" style="display: flex; margin-left: 0px;">
									<div class="bloco" style="width: @{{$first == true ? 'calc(40% - 10px);' : 'calc(60% - 10px);'}} @{{$last ? 'display: inline-flex;' : ''}}" ng-repeat="item_tabela in item.TABELAS | orderBy: 'ORDEM_GERAL' track by $index">
										<div style="@{{$last == true ? 'width: calc(65% - 10px);' : ''}}">
											
											<label ng-if="$first" style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
												Período:
												<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
													ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 2 : ''}}@{{item.GRUPO == 'FAMILIA' ? 4 : ''}}@{{item.GRUPO == 'MODELO' ? 6 : ''}},item);" ng-model="item.DATA_MES_RESUMO_ANTERIOR1">
													<option value="@{{l.MES}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="l in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{l.DESCRICAO}}</option> </select>
												a 	
												<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
														ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 2 : ''}}@{{item.GRUPO == 'FAMILIA' ? 4 : ''}}@{{item.GRUPO == 'MODELO' ? 6 : ''}},item);" ng-model="item.DATA_MES_RESUMO_ANTERIOR2">
													<option value="@{{i.MES}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="i in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{i.DESCRICAO}}</option> </select>		
												
												de 
												<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
													ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 2 : ''}}@{{item.GRUPO == 'FAMILIA' ? 4 : ''}}@{{item.GRUPO == 'MODELO' ? 6 : ''}},item);" ng-model="item.DATA_ANO_RESUMO_ANTERIOR">
													<option value="@{{o}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="o in vm.VisaoCliente.LISTA_ANOS track by $index">@{{o}}</option> </select>											
											
											</label>

											<label ng-if="$last" style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
												Período:
												<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
													ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 1 : ''}}@{{item.GRUPO == 'FAMILIA' ? 3 : ''}}@{{item.GRUPO == 'MODELO' ? 5 : ''}},item);" ng-model="item.DATA_MES_RESUMO1">
													<option value="@{{k.MES}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="k in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{k.DESCRICAO}}</option> </select>
												 a 	
												 <select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
														ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 1 : ''}}@{{item.GRUPO == 'FAMILIA' ? 3 : ''}}@{{item.GRUPO == 'MODELO' ? 5 : ''}},item);" ng-model="item.DATA_MES_RESUMO2">
													<option value="@{{v.MES}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="v in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{v.DESCRICAO}}</option> </select>		
												
												 de 
												<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
													ng-change="vm.VisaoCliente.consultarResumoPeriodo(@{{item.GRUPO == 'PERFIL' ? 1 : ''}}@{{item.GRUPO == 'FAMILIA' ? 3 : ''}}@{{item.GRUPO == 'MODELO' ? 5 : ''}},item);" ng-model="item.DATA_ANO_RESUMO">
													<option value="@{{u}}" style="background-color: #337ab7; color: white;" 
														ng-repeat="u in vm.VisaoCliente.LISTA_ANOS track by $index">@{{u}}</option> </select>
											</label>
											<div class="@{{item_tabela.componente2}}" id="@{{item_tabela.componente2}}"></div>
										</div>
										<div ng-if="$last" style="width: calc(36% - 10px); margin-left: 5px;">
											<label style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
											Comparativo
											</label>
											<div class="@{{item.COMBOIO_COMPARATIVO}}" id="@{{item.COMBOIO_COMPARATIVO}}">																					
												
											</div>
										</div>
									</div>							
								</div>
							</div>
						</div>
					
					</div>
		
				</div>
			</div>
		</div>

		<!-- **************************************************************************************** -->

		<!-- ************************BLOCO DE DETALHES DE VENDAS************************************* -->
		
		<div class="panel panel-primary">

			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-detalhe-venda" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('3');"  
				aria-controls="collapse-detalhe-venda" role="tab" tabindex="0" data-hotkey="alt+3" id="heading-detalhe-venda">
				<h3 class="panel-title">{{ Lang::get($menu.'.a-detalhe-venda') }} <sub>(Alt+3)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					   ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL2,
					   			  'fa-chevron-circle-up'  : vm.VisaoCliente.ABA_PAINEL2}" aria-hidden="true">
					</i>
				</h3> 
			</div>
		
			<div id="collapse-detalhe-venda" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-detalhe-venda">
		
				<div class="panel-body">
					
					<div class="bloco-container bloco-container-resumo-venda">

						<div class="resumo-venda-item">
							
							<div class="row" style="margin-left: 0px;">
								<div class="bloco" style="@{{item_tabela_det.NOME != 'COBRANCAS' ? 'width: 48% !important;' : 'width: 100% !important;'}}" ng-repeat="item_tabela_det in vm.VisaoClienteDetalhes.DETALHES_VENDAS track by $index">
									<label style="width: calc(100%); text-align: center; background-color: #337ab7; color: white; margin-bottom: 0px !important; border-radius: 4px; border: 1px solid white;"> 
										@{{item_tabela_det.TITULO}}, Período de
										<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
											ng-change="vm.VisaoCliente.consultarResumoDetalhes('@{{item_tabela_det.NOME}}',item_tabela_det);" ng-model="item_tabela_det.DATA_MES_RESUMO1">
											<option value="@{{h.MES}}" style="background-color: #337ab7; color: white;" 
												ng-repeat="h in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{h.DESCRICAO}}</option> </select>
									
										<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
											ng-change="vm.VisaoCliente.consultarResumoDetalhes('@{{item_tabela_det.NOME}}',item_tabela_det);" ng-model="item_tabela_det.DATA_ANO_RESUMO">
											<option value="@{{ty}}" style="background-color: #337ab7; color: white;" 
												ng-repeat="ty in vm.VisaoCliente.LISTA_ANOS track by $index">@{{ty}}</option> </select>

											a 	
											<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;text-transform: capitalize;" 
												ng-change="vm.VisaoCliente.consultarResumoDetalhes('@{{item_tabela_det.NOME}}',item_tabela_det);" ng-model="item_tabela_det.DATA_MES_RESUMO2">
											<option value="@{{f.MES}}" style="background-color: #337ab7; color: white;" 
												ng-repeat="f in vm.VisaoCliente.DATA_ARRAY_MESES track by $index">@{{f.DESCRICAO}}</option> </select>

											<select style="background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
												ng-change="vm.VisaoCliente.consultarResumoDetalhes('@{{item_tabela_det.NOME}}',item_tabela_det);" ng-model="item_tabela_det.DATA_ANO_RESUMO2">
											<option value="@{{ty}}" style="background-color: #337ab7; color: white;" 
												ng-repeat="ty in vm.VisaoCliente.LISTA_ANOS track by $index">@{{ty}}</option> </select>
											<label ng-if="item_tabela_det.ATIVOS_VISIBLE == 1 && item_tabela_det.NOME == 'PARCELAS'">, Situação: </label>	
											<select ng-if="item_tabela_det.ATIVOS_VISIBLE == 1 && item_tabela_det.NOME == 'PARCELAS'" 
												style="text-transform: none; background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
												ng-change="vm.VisaoCliente.consultarResumoDetalhes('@{{item_tabela_det.NOME}}',item_tabela_det);"
												ng-model="item_tabela_det.ATIVOS">	
												<option value="1" style="text-transform: none; background-color: #337ab7; color: white;">Em aberto</option> 
												<option value="0" style="text-transform: none; background-color: #337ab7; color: white;">Pago</option> 
												<option value=""  style="text-transform: none; background-color: #337ab7; color: white;">Todos</option> 
											</select>
											<br ng-if="item_tabela_det.ATIVOS_VISIBLE == 1 && item_tabela_det.NOME == 'PARCELAS'">
											<label ng-if="item_tabela_det.ATIVOS_VISIBLE == 1 && item_tabela_det.NOME == 'PARCELAS'"> 
												Ver Outras Parcelas: 
												<span ttitle="Ver Parcelas com Formas de Pagamento sem Controle de Limite de Crédito" 
													class="glyphicon glyphicon-info-sign" style="width: 23px; height: 21px; color: white;font-size: 11pt;"></span>
											</label>	
											<select ng-if="item_tabela_det.ATIVOS_VISIBLE == 1 && item_tabela_det.NOME == 'PARCELAS'" 
												style="text-transform: none; background-color: #337ab7; color: white; border: 0px; height: 20px; line-height: 22px; padding: 0;" 
												ng-change="vm.VisaoClienteDetalhes.reestruturarResumoParcelas(item_tabela_det.TODOS)"
												ng-model="item_tabela_det.TODOS">	
												<option value="1" style="text-transform: none; background-color: #337ab7; color: white;">Sim</option> 
												<option value="0" style="text-transform: none; background-color: #337ab7; color: white;">Não</option> 
											</select>

									</label>
									<div style="width: 100%;@{{item_tabela_det.TABELA.componente_outline == 'tabela_detalhe_nota_parcelas' ? 'overflow-y: auto;' : ''}}" class="@{{item_tabela_det.TABELA.componente_outline}}" id="@{{item_tabela_det.TABELA.componente_outline}}"></div>
								</div>							
							</div>
						
							<!-- <div class="bloco">
							</div>
					
							<div class="bloco">
							</div> -->
						</div>
					
					</div>
		
				</div>
			</div>
		</div>

		<!-- **************************************************************************************** -->

		<!-- ************************BLOCO DE PESQUISAS DE SATISFAÇÃO******************************** -->
		<div class="panel panel-primary">
			<!-- <div class="panel-heading" role="tab" id="heading-pesq-satisf"> -->
			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-pesq-satisf" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('4');" 
				aria-controls="collapse-pesq-satisf" role="tab" tabindex="0" data-hotkey="alt+4" id="heading-pesq-satisf">
				<h3 class="panel-title">{{ Lang::get($menu.'.a-pesq-satisf') }} <sub>(Alt+4)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					   ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL3,
					   			  'fa-chevron-circle-up'  : vm.VisaoCliente.ABA_PAINEL3}" aria-hidden="true">
					</i>
				</h3> 
				<!-- <a 
					role="button" 
					data-toggle="collapse" 
					data-parent="#accordion" 
					href="#collapse-pesq-satisf" 
					aria-controls="collapse-pesq-satisf">
					{{ Lang::get($menu.'.a-pesq-satisf') }}
				</a> -->
			</div>
		
			<div id="collapse-pesq-satisf" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-pesq-satisf">		
				<div class="panel-body" ng-show="vm.VisaoCliente.resumoPesqSatisf.QTD_PESQ > 0">
					
					<div class="bloco-container">

						<span style="display: flex;">
							<h5 class="bloco_dados_cadastrais">{{ Lang::get($menu.'.h5-resumo') }}</h5>
							<span class="glyphicon glyphicon-info-sign" data-toggle="popover" data-placement="top" 
								style="color: #337ab7; cursor: pointer; margin-top: 9px; margin-left: -15px;" data-content="@{{vm.legenda_relatorio}}"></span>
						</span>
						<div class="bloco">
					
							<label>{{ Lang::get($menu.'.label-qtd-pesq') }}:</label>
							<span ng-bind="vm.VisaoCliente.resumoPesqSatisf.QTD_PESQ"></span>
							
							<span style="display: flex;margin-left: 65px;">
								<label>{{ Lang::get($menu.'.label-perc-nota') }}:</label>
							
								<span style="margin-left: 5px;" ng-bind="(vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO | number:2)+' %'"></span>						
								
								<span class="vertical-baseline">
									<div style="margin-top: -4px; margin-left: 8px;"
										class="smile fa"
										ng-class="{
											'fa-frown-o pessimo': vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO <= 49.00,
											'fa-frown-o regular': vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO >= 50.00 && vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO < 74.99,
											'fa-smile-o otimo'  : vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO >= 75.00 && vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO < 89.99,
											'fa-smile-o bom'	: vm.VisaoCliente.resumoPesqSatisf.PERCENTUAL_SATISFACAO >= 90.00
										}"></div>
								</span>
							</span>
						</div>
					
					</div>
					
					<div class="bloco-container bloco-container-pesquisa">

						<div 
							class="bloco"
							ng-repeat="pesq in vm.VisaoCliente.pesqSatisf | orderBy:'ID' track by $index">
							
							<h5 class="bloco_dados_cadastrais">
								{{ Lang::get($menu.'.h5-pesquisa') }}:
								<span ng-if="pesq.ID > 0" ng-bind="' '+(pesq.ID | lpad:[8,'0'])"></span>
							</h5>
					
							<label>{{ Lang::get($menu.'.label-data-pesq') }}:</label>
							<span ng-bind="pesq.DATAHORA_INSERT"></span>
							
							<span style="display: flex;margin-left: 65px;">
								<label>{{ Lang::get($menu.'.label-perc-nota') }}:</label>
							
								<span style="margin-left: 5px;" ng-bind="(pesq.PERCENTUAL_SATISFACAO | number:2)+' %'"></span>						
								
								<span class="vertical-baseline">
									<div style="margin-top: -4px; margin-left: 8px;"
										class="smile fa"
										ng-class="{
											'fa-frown-o pessimo': pesq.PERCENTUAL_SATISFACAO <= 49.00,
											'fa-meh-o regular'  : pesq.PERCENTUAL_SATISFACAO >= 50.00 && pesq.PERCENTUAL_SATISFACAO < 74.99,
											'fa-smile-o otimo'  : pesq.PERCENTUAL_SATISFACAO >= 75.00 && pesq.PERCENTUAL_SATISFACAO < 89.99,
											'fa-smile-o bom'	: pesq.PERCENTUAL_SATISFACAO >= 90.00
										}"></div>
								</span>
							</span>
						</div>
					
						<div class="button-carregar-mais-container">
					
							<button
								type="button"
								class="btn btn-default btn-carregar-mais"
								ng-click="vm.VisaoCliente.consultarNextPesqSatisf()">
							
								{{ Lang::get($menu.'.button-carregar-mais') }}...
							</button>
						</div>
					
					</div>
		
				</div>
			</div>
		</div>
		<!-- **************************************************************************************** -->

		<!-- ************************BLOCO DE VISITAS************************************************ -->
		<div class="panel panel-primary">
			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-visita" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('5');"
				aria-controls="collapse-visita" role="tab" tabindex="0" data-hotkey="alt+5" id="heading-visita">
				<h3 class="panel-title">{{ Lang::get($menu.'.a-visitas') }} <sub>(Alt+5)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
						ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL5,
								   'fa-chevron-circle-up'  :  vm.VisaoCliente.ABA_PAINEL5}" aria-hidden="true">
					</i>
				</h3>
			</div> 
			<div id="collapse-visita" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-visita">
		
				<div class="panel-body">
					
					<div class="bloco-container bloco-container-visita">

						<div class="visita-item" ng-repeat="visita in vm.VisaoCliente.visita | orderBy:'ID':true track by $index">
					
							<h5 style="font-weight: bolder;">
								{{ Lang::get($menu.'.h5-visita') }}:
								<span ng-if="visita.ID > 0" ng-bind="' '+(visita.ID | lpad:[8,'0'])"></span>
							</h5>
							
							<div class="bloco">
					
								<label>{{ Lang::get($menu.'.label-tipo-visita') }}:</label>
								<span ng-bind="visita.TIPO_VISITA_DESCRICAO"></span>
					
								<label>Status:</label>
								<span ng-if="visita.STATUS2 == 0" title="Pendente"  class="glyphicon glyphicon-warning-sign pendente"> Pendente</span>
								<span ng-if="visita.STATUS2 == 1" title="Aprovada"  class="glyphicon glyphicon-ok valida"> Aprovada</span>
								<span ng-if="visita.STATUS2 == 2" title="Reprovada" class="glyphicon glyphicon-remove invalida"> Reprovada</span>
					
								<label>{{ Lang::get($menu.'.label-data-visita') }}:</label>
								<span ng-bind="visita.DATAHORA"></span>
					
								<label>{{ Lang::get($menu.'.label-data-ult-modif') }}:</label>
								<span ng-bind="visita.DATAHORA_UPDATE ? visita.DATAHORA_UPDATE : visita.DATAHORA"></span>
					
								<label>{{ Lang::get($menu.'.label-observacao') }}:</label>
								<span ng-bind="visita.OBSERVACAO"></span>
					
								<label>{{ Lang::get($menu.'.label-loc-valida') }}:</label>
								<span 
									class="glyphicon localizacao-valida" 
									ng-class="{
										'0': 'glyphicon-remove invalida',
										'1': 'glyphicon-ok valida'
									}[visita.LOCALIZACAO_VALIDA]"></span>
					
								<label>{{ Lang::get($menu.'.label-justif-contingencia') }}:</label>
								<span ng-bind="visita.JUSTIF_CONTINGENCIA"></span>
					
								<label>{{ Lang::get($menu.'.label-localizacao') }}:</label>
								<span>
									<button 
										type="button"
										class="btn btn-sm btn-default"
										ng-click="vm.Geolocalizacao.getLocation(visita);"
										ng-if="!visita.mapMsg && !visita.mapOk">
					
										<span class="glyphicon glyphicon-eye-open"></span>
										{{ Lang::get($menu.'.button-ver-localizacao') }}
									</button>
					
									<span ng-bind="visita.mapMsg"></span>
									<div class="js-mapholder" id="mapholder-@{{visita.ID}}"></div>
								</span>
							</div>
						</div>
					
						<div class="button-carregar-mais-container">
					
							<button
								type="button"
								class="btn btn-default btn-carregar-mais"
								ng-click="vm.VisaoCliente.consultarNextVisitas()">
							
								{{ Lang::get($menu.'.button-carregar-mais') }}...
							</button>
						</div>
					</div>
		
				</div>
			</div>
		</div>

		<!-- **************************************************************************************** -->

		<!-- ************************BLOCO DE CASOS DO CLIENTE*************************************** -->
		<div class="panel panel-primary">
			<div class="panel-heading collapsed" data-toggle="collapse" data-target="#collapse-caso" aria-expanded="true" ng-click="vm.VisaoCliente.changePainel('6');"
				aria-controls="collapse-caso" role="tab" tabindex="0" data-hotkey="alt+6" id="heading-caso" style="position: relative; z-index: 1;">
				<h3 class="panel-title">{{ Lang::get($menu.'.a-casos') }} <sub>(Alt+6)</sub>
					<i class="fa fa-chevron-circle-down" style="float: right; cursor: pointer;"
					   ng-class="{'fa-chevron-circle-down': !vm.VisaoCliente.ABA_PAINEL4,
					   			  'fa-chevron-circle-up'  :  vm.VisaoCliente.ABA_PAINEL4}" aria-hidden="true">
					</i>
				</h3> 
			</div>
			<div id="collapse-caso" class="panel-body collapse" role="tabpanel" aria-labelledby="heading-caso">
		
				<div class="panel-body panel-body-caso" ng-if="vm.VisaoCliente.aba_caso_visivel == true" style="padding: 0px; margin-top: -50px; position: relative; z-index: 0;">
					
					<div class="bloco-container bloco-container-caso">

						<iframe id="iframe-relatorio-caso" padrao="{{ linkRelatorio(fn_parametro('TBCASO_PAINEL.RELATORIO_VISAO_360')) }}?VISAO=1" src="" style="width: 100%; height: 900px; border: transparent;"></iframe>
					
					</div>
		
				</div>
			</div>
		</div>		
		<!-- **************************************************************************************** -->

	</div>
	
	
	<!--	
	<div class="tabela_principal" id="tabela_principal"></div>	
	<div class="form-group" style="margin-bottom: 4px;">
		<input 
			type="text"
			style="width: 100% !important;"
			placeholder="Filtragem rápida..."
			class="form-control input-maior" 
			required
			ng-model="vm.VisaoCliente.FILTRO_DADOS">
	</div>
	
    <div class="table-ec table-scroll" style="height: calc(100vh - 205px);">
        <table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
            <thead>
                <tr gc-order-by="vm.VisaoCliente.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.VisaoCliente.DADOS_RENDER = ( vm.VisaoCliente.DADOS | orderBy : vm.VisaoCliente.ORDER_BY | find: {model : vm.VisaoCliente.FILTRO_DADOS ,fields : 'all'})"
                    ng-Click="vm.VisaoCliente.visualizar()"
                    ng-focus="vm.VisaoCliente.SELECTED = item"
                    ng-class="{ 'selected' : vm.VisaoCliente.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>
    -->
	
    @include($menu.'.modal.VisaoCliente')
	@include($menu.'.modal.VisaoClienteItens')
	@include($menu.'.modal.VisaoClienteDetalheDocumento')
	@include($menu.'.modal.VisaoClienteDetalheCheque')	
	@include($menu.'.modal.VisaoClienteImpressao')
	
	
	@include($menu.'.modal.ConfirmItensSelected')
</div>
@endsection

@section('script')
	<script src="{{ elixir('assets/js/direct-print.js') }}"></script>
	<script src="https://maps.google.com/maps/api/js?key=AIzaSyCsJCrkMEyh2RMS6ticwbvqFYjkKq0igH8"></script>
    <script src="{{ elixir('assets/js/_12121.js') }}"></script>
@append