<%@include file="/jsp/common/taglibs.jsp"%>
<script type="text/javascript" language="javascript" src="${contextPath}/js/dda/carga/transaccion/modalesTransacciones.js"></script>
<script src="${contextPath}/js/common/alerts/dist/sweetalert.min.js"></script>
<link rel="stylesheet" type="text/css" href="${contextPath}/js/common/alerts/dist/sweetalert.css">

<style type="text/css">
.mymodal-xl {
    width: 90%;
   max-width:1200px;
  }

.myborder {
	border: 1px solid #dddddd;
}
</style>
 <style>
	.nopadding {
	   padding: 0 !important;
	   margin: 0 !important;
	}
	
	  .search-table-outter { overflow-x: scroll; }
	  
	  table.feesT { border-collapse: collapse; }
 	
	  table.feesT input{
		      border:0px solid #000; 
		      margin:0; 
		      background:transparent;
		      width:100%;
		      text-align: center;		      
	  }
	  
	  .encabezados{
	  	  text-align: center;
	  }
	  
	  .encabezadoTabla{
	  	color: #FFF;
    	background: #CB2C25;
    	font-size: 1.1em;
    	font-weight: 400;    	    	
    	width : 90px ;
	  }
	  
	  .labelEtiqueta {
		  background-color: #CB2C25;
		  color: white;		  
		  padding: 4px;
		  text-transform: uppercase;
		  font-family: Verdana, Arial, Helvetica, sans-serif;
		  font-size: xx-small;
	  }
	  
	  .filSpan3{
	     rowspan:3;
	  }	  		  		
	  
	  .readInput{
		background-color:#DCDCDC;    	
	  }
	  
	  .tdPrecio{
		 min-width : 60px !important;    	
	  }
	  
	  .tdEditable{
		 min-width : 60px;		     	
	  }	
	  
	  .angular-with-newlines {
         white-space: pre-wrap;
      }	
 </style>

    
<div class="modal bs-example-modal-lg" id="modalCargarArchivo">
	<div class="modal-dialog modal-lg">
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">        
        <h4 class="modal-title">Subir Archivo</h4>
      </div>
      <div class="modal-body">
			<div id="esperaDiv" align="center" ></div>                
	        <s:form id="idFormCargaAlgo" class="form-horizontal col-md-10" action="#">
				<fieldset>
					<div class="form-group">
						<label for="inputEmail3" class="col-md-2  control-label">Selecccione archivo: </label>
						<div class="col-md-4">
							<div id="cargaTransaccionesDiv">Upload</div>
						</div>
					</div>
				</fieldset>
			</s:form>                
      </div>
      <div class="modal-footer">
        	<button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
			<button type="button" class="btn btn-primary" ng-click="cargarDatos()">Aceptar</button>
      </div>
    </div>

  </div>
</div>


<div class="modal" id="modalConfirmacion" role="dialog">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Confirmaci&oacute;n</h4>
				<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
			</div>
			<div class="modal-body">
				<p>{{mensajeConfirmacion}}</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-success" ng-click="abrirModalCarga()">Aceptar</button>
				<button type="button" class="btn btn-default" data-bs-dismiss="modal">Cancelar</button>
			</div>
		</div>
	</div>
</div>


<div class="modal" id="modalReporteEstudioPais" >
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
				<h4 class="modal-title text-center"> Vista previa de la carga de transacciones para {{fmaFront(mesCarga)}}</h4>
			</div>
			<div class="modal-body">
				<table class="table ">
				 	<thead>
				 		<tr>
			    			<th class="text-center myborder" ng-repeat="nt in infoHeadVistaPrevia">
			    				{{nt}}
			    			</th>
			    		</tr>
				 	</thead>
				  	<tbody>
				  		<tr ng-repeat="row in vistaPrevia track by $index" ng-click='recive($index, row)' ng-show='esPapa(row.AATIPO) || estaEnSeMuestran(row.AATIPO)' ng-style="{{row.AAAESTILO}}">                                                                        		                        		                      		                  		
		                        <td ng-if="$index != 0 && $index != 1" ng-repeat="(key, val) in row track by $index">		                            
		                              <u>{{($index > 3 ) ? (val|number:1) : val }}</u>		                  		
		                        </td>		                  				                  		
		                </tr>	
			    	</tbody>
				</table>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
				<button type="button" class="btn btn-default" ng-click="descargaExcel()"><span class="glyphicon glyphicon-download-alt">&nbsp;</span>Exportar</button>
			</div>
		</div>
	</div>
</div>

<!--       ____________________________modal para Asociacion de Titulos_____________________                       -->
<div class="modal" id="modalAsociacionDeTitulos" >
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
				<h4 class="modal-title text-center"> Asociacion de Titulos para carga {{fmaFront(mesCarga)}} </h4>
				<br><br><br><br>
				<div class="l-box-body l-spaced form-horizontal">
				<div class="col-x-2">
				     <select style="width:400px;" class="form-control-sm" id="tipoError" onchange="showHideTablasErrores()">
				    	<option value="1">Sin Id de BroadView</option>
				    	<option value="2">Id de BroadView No Existe</option>				    
				    	<option value="3">T&iacute;tulo Y Filial No Existe</option>				    
				    	<option value="4">T&iacute;tulos Fuera de Periodo</option>
					</select>
					
				</div>
				<div class="col-x-3">
				     <button id="BtnAsocTitGuardar" type="button" class="btn btn-success btn-md" ng-click="actualizarIdBv()">Guardar Cambios</button>
				     <input style="background-color:gray; color:#fff9f9;" class="btn" id="bDescargaFileErrorTitulos" type="button" value="Descargar Titulos" ng-click="exportarArchivoErrAsocTitulos()">
				</div>	
				</div>					
				
			</div>
			<div class="modal-body">
				<!-- AQUI TABLAS -->
				<div class="form-group">
				<table id="tablaPadre-SinIdBroadView"> <!-- TABLA SIN ID BROADVIEW -->
				        <tr>
				            <td style="width:90px;"></td>
				            <td>
				                <table id="tablaTitulosenContratos" class="table " style="width: 350px;">
				       				<thead>
				        			    <tr> 
				     			           <td class="modal-title text-left" style="width:29px; background-color:white;"><h4> T&iacute;tulos en Contratos</h4></td>				                  				            
				         			   </tr>
				       				   <tr  class="encabezado" role="row">
				          				      <th class="sorting_disabled" rowspan="1" colspan="1" style="width:29px;"> Id BroadView </th>
				                				<th class="sorting_disabled" rowspan="1" colspan="1" style="width:50px;">Nombre Estandar</th>
				            		   </tr>
				       				</thead>
				    			   <tbody>
				         				     <tr ng-repeat="tc in titulosCarga">
				         			             <td class="text-center myborder">{{tc.idBv}}</td>
				          			             <td class="text-center myborder">{{tc.nombreEstandar}}</td>
				            			     </tr>				              
				      			   </tbody>				            
								</table>
				            </td>
				            <td style="width:200px;"></td>
				            <td style="position: absolute;">
				                  <table id="tableSinIdBroadView" class="table ">				                               
				        				<thead>
				            					<tr> 
				                					<td class="modal-title text-left" style="width:29px; background-color:white;"><h4> T&iacute;tulos de la Carga</h4></td>				                  				            
				           					    </tr>
				           						<tr  class="encabezado" role="row">
				         						       <th class="sorting_disabled" rowspan="1" colspan="1" style="width:29px;"> Id BroadView </th>
				                						<th class="sorting_disabled" rowspan="1" colspan="1" style="width:50px;">Nombre Estandar</th>
				            					</tr>
				    				   </thead>
				    				   <tbody>
				        				      <tr ng-repeat="n in sinIdBroadView">
				               					       <td class="text-center myborder" style="padding-top:4px; padding-bottom:4px; padding-left:4px;padding-right:4px;">
				               					           <input id="{{n.id_carga_titulo}}" type="text" class="text-center myborder form-control actual">
				               					       </td>
				                 				       <td id="nombreEstandar" class="text-center myborder">{{n.nombreEstandar}}</td>
				            				  </tr>
				              
				     				   </tbody>		
				   					 </table>
				            </td>
				        </tr>
				</table>	
				<div style="text-align:center;">
				             <table id="tablaPadre-idBroadViewNoExiste"  style="margin: 0 auto; width:550px;"> <!-- TABLA ID BROADVIEW NO EXISTE -->
				
				      				 <thead>
				        			    <tr> 
				     			           <td class="modal-title text-center" style="width:29px; background-color:white;"><h4> Id BroadView no Existe</h4></td>				                  				            
				         			   </tr>
				       				   <tr  class="encabezado" role="row">
				          				      <th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:29px;"> Id BroadView </th>
				                				<th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:50px;">Nombre Estandar</th>
				            		   </tr>
				      			 	</thead>
				    				<tbody>
				         				     <tr ng-repeat="idbv in idBroadViewNoExiste">
				         			             <td class="text-center myborder">{{idbv.idBv}}</td>
				          			             <td class="text-center myborder">{{idbv.nombreEstandar}}</td>
				            			     </tr>				              
				      				</tbody>					     
							</table>
							<table id="tablaPadre-tituloyFilialNoExisten"  style="margin: 0 auto; width:550px;"> <!-- TABLA TITULO Y FILIAL NO EXISTEN -->
				                    
				      				 <thead>
				        			    <tr> 
				     			           <td class="modal-title text-center" style="width:100px; background-color:white;"><h4> El T&iacute;tulo y Filial no existen</h4></td>				                  				            
				         			   </tr>
				       				   <tr  class="encabezado" role="row">
				          				        <th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:29px;"> Filial </th>
				                				<th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:50px;">Id BroadView</th>
				                				<th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:50px;">Nombre Estandar</th>
				            		   </tr>
				      			 	</thead>
				    				<tbody>
				         				     <tr ng-repeat="nexst in tituloyFilialNoExiste">
				         				         <td class="text-center myborder">{{nexst.desc_filial}}</td>
				         			             <td class="text-center myborder">{{nexst.idBv}}</td>
				          			             <td class="text-center myborder">{{nexst.nombreEstandar}}</td>
				            			     </tr>				              
				      				</tbody>					     
							 </table>
							 <table id="tablaPadre-titulosFueradePeriodo"  style="margin: 0 auto; width:550px;"> <!-- TABLA TITULOS FUERA DE PERIODO -->
				                  
				      				 <thead>
				        			    <tr> 
				     			           <td class="modal-title text-center" style="width:100px; background-color:white;"><h4>T&iacute;tulos Fuera de Periodo</h4></td>				                  				            
				         			   </tr>
				       				   <tr  class="encabezado" role="row">
				          				        <th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:29px;"> Filial </th>
				                				<th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:50px;">Id BroadView</th>
				                				<th class="sorting_disabled text-center" rowspan="1" colspan="1" style="width:50px;">Nombre Estandar</th>
				            		   </tr>
				      			 	</thead>
				    				<tbody>
				         				     <tr ng-repeat="tits in tituloFueradePeriodo">
				         				         <td class="text-center myborder">{{tits.desc_filial}}</td>
				         			             <td class="text-center myborder">{{tits.idBv}}</td>
				          			             <td class="text-center myborder">{{tits.nombreEstandar}}</td>
				            			     </tr>				              
				      				</tbody>					     
							 </table>
				</div>
							   					
				</div>				
				
			</div>
			<div class="modal-footer">
				
			</div>
		</div>
	</div>
</div>

<!--       ____________________________modal Confirmacion VALIDAR CARGA_____________________                       -->

<div style="margin:auto; padding-right:19px; width:300px; height:400px;" class="modal" id="modalValidaCarga">
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
					<h4 class="modal-title text-center"> żEst&aacute; seguro de Validar la carga de transacciones {{fmaFront(mesCarga)}}?, ya no podr&aacute; realizar cambios al realizar esta operaci&oacute;n.</h4>
				<br><br><br><br>
				<div class="l-box-body l-spaced form-horizontal">				
				<div class="col-x-3">
				     <button id="btnCancelarValidaCarga" type="button" class="btn btn-primary" data-bs-dismiss="modal">Cancelar</button>
				     <button id="btnValidaCarga" type="button" class="btn btn-success btn-md" ng-click="confirmaValidaCarga()">Validar Carga</button>
				</div>	
				</div>		
			</div>	
		</div>
	</div>
</div>

<!--       ____________________________MODAL'S PARA REPORTES_____________________                       -->

<div class="modal" id="modalAcumulateBuys">
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
					<h3 class="modal-title text-center">Vista Previa Reporte Acumulate Buys</h3>		
			</div>	
		</div>
		<div class="modal-body" id="reporteAcumulateBuys">
		      <%@include file="/jsp/dda/reporte/acumulateBuys/contentReporteAcumulateBuys.jsp"%>
		      <br>
		      <div class="form-group row">
		      <div class="col-sm-6"></div>
		      <div class="col-sm-4">
			    <button id="btnCerrar" type="button" class="btn btn-primary" data-bs-dismiss="modal">Cerrar</button>
		      </div>
		      <div class="col-sm-2"></div>
		</div>
		</div>
	</div>
</div>


<div class="modal" id="modalOveragePayments">
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
					<h3 class="modal-title text-center">Vista Previa Reporte Overage & Payments</h3>		
			</div>	
		</div>
		<div class="modal-body" id="reporteOveragePayments">
		   <%@include file="/jsp/dda/reporte/oyp/contentOyP.jsp"%>
		   <br>
		   <div class="form-group row">
		      <div class="col-sm-6"></div>
		      <div class="col-sm-4">
			    <button id="btnCerrar" type="button" class="btn btn-primary" data-bs-dismiss="modal">Cerrar</button>
		      </div>
		      <div class="col-sm-2"></div>
		   </div>	
		</div>
	</div>
</div>


<div class="modal" id="modalCostPView">
	<div class="modal-dialog  mymodal-xl">
		<div class="modal-content">
			<div class="modal-header">
					<h3 class="modal-title text-center">Vista Previa Reporte Revenue & Splits</h3>		
			</div>	
		</div>
		<div class="modal-body" id="reporteCostPView">
			<%@include file="/jsp/dda/reporte/rys/contentRyS.jsp"%>
		   <br>
		   <div class="form-group row">
		      <div class="col-sm-6"></div>
		      <div class="col-sm-4">
			    <button id="btnCerrar" type="button" class="btn btn-primary" data-bs-dismiss="modal">Cerrar</button>
		      </div>
		      <div class="col-sm-2"></div>
		   </div>	
		</div>
	</div>
</div>


