{% set layout = userData.role != 'ROLE_DISTRIBUTOR' ? 'base.html.twig' : 'layout-distributors.html.twig' %}
{% extends layout %}
{% block title %}Purchase{% endblock %}
{% block stylesheets %} 
	{{ parent() }}
	{{encore_entry_link_tags('mainCSS')}}
	<style>
		#container-tex{
			border: 3px solid #26a69a;
			border-radius: 4px;
			margin-top: 20px; 
			padding: 25px;
		}
		{% if is_granted("ROLE_USER_US") %}
			main{padding-left: 0px !important;}
		{% endif %}
	</style>
{% endblock %}
{% block  body %}
	{% if userData.role == "ROLE_USER" or userData.role == "ROLE_ADMIN" %}
		{{ include("mx/nav_menu.twig", {option:'mx_homepage'}) }}
	{% else  %}
			{{ include("distributors/nav_menu.twig",{option:'dist_homepage'}) }}
	{% endif %}
	{% set returnButton = "<div class='right-align'><a href='/"~ url ~"/customer-profile/" ~ id_client ~ "' class='btn btn-primary mt-2'><i class='fa-solid fa-arrow-left  mx-2'></i>Back To Profile</a></div>" %}
	<main>
		
		<div class="row container">
		{{ returnButton|raw }}
			<div class="container-form" style="padding: 0px;">
				<div id="container-tex" class="white z-depth-1">
					<h5 class="orange-text text-center">The transaction has been successfully completed</h5>
					<p>
						{% if product == 'TravelMapfre' %}
							{% for code in authCode|split(',') %}
								Authoried operation code passenger # {{loop.index}}: <b>{{ code }}</b><br>
							{% endfor %}		
						{% else %}
							Authoried operation code: <b>{{ authCode }}</b>
						{% endif %}
					</p>
					<p>
						Your order has been processed a confirmation email has been sent to <b>{% if userData.role != "ROLE_DISTRIBUTOR" %} {{ email }}{% endif %}</b> with the policy along with the <em><b>"General Conditions"</b></em> and <em><b>"What to do in case of an accident"</b></em> on PDF Format.
					</p>
					<p>
						{% if product == 'TravelMapfre' %}
							You can now <br>
							<div id="content_travel_certificates"></div>
						{% else %}
						 You can now <a href="" id="viewCertificate" target="_blank">
						 Click here to Download the Document</a>
							{# You can now <a href="{{ app.asset_path }}/documents/clients/client-{{ id_client }}/{{ yearNow }}/{{ product }}/{{ certificate_number }}.pdf" download>Click here to Download the Document</a> #}
						{% endif %}
					</p>
					<center>
						<img src="{{asset('/images/Novamar-Insurance-Mexico.jpg')}}"  class="responsive-img">
					</center>
				</div>
			</div>
		</div>
		<input type="hidden" id="certificateNumber" value={{certificate_number}}>
		<input type="hidden" id="product" value={{product}}>
	</main>	
{% endblock %}
{% block javascripts %}
    <!-- jQuery -->
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js" ></script>
	 {% if userData.role !='ROLE_DISTRIBUTOR'  %}<script src="{{ asset('js/main.js') }}" defer></script> {% endif %}

	<script>
	$(function(){
		const dataPurchase = JSON.parse(sessionStorage.getItem('dataPurchase'));;
		const policy = $("#certificateNumber").val();
		const product = $("#product").val();
		// en caso de que certificate number sea array
		if(product == 'TravelMapfre')
		{
			let html = '';
			if(policy.includes(','))
			{
				policy.split(',').forEach((certificate, index) => {
					console.log(certificate)
					console.log(index)
					console.log(dataPurchase.hashArr[index])
					html +=`
						<a href="${getUrlApiByEnvironment(ENV)}/certificate/${certificate}/${dataPurchase.hashArr[index]}">Click here to Download the Document passenger No. ${index + 1}</a><br>
					`;

					//agregamos los links al html
					$("#content_travel_certificates").html(html)
				});
			}else{
				html +=`
					<a href="${getUrlApiByEnvironment(ENV)}/certificate/${policy}/${dataPurchase.hashArr[0]}">Click here to Download the Document</a><br>
				`;
				//agregamos los links al html
				$("#content_travel_certificates").html(html)
			}
		}else{
			document.getElementById("viewCertificate").addEventListener("click", function(event) {
				const certificateUrl = `${getUrlApiByEnvironment(ENV)}/certificate/${policy}/${dataPurchase.hash}`;
				document.getElementById("viewCertificate").href = certificateUrl;
			});
		}
		$.ajax({
                method: 'POST',
                url: `${getUrlApiByEnvironment(ENV)}/dashboard-process`,
                data: JSON.stringify({
                        option: "saveTask",
                        id:    dataPurchase.idProcess,
                        task:   "purchase-success",
                        status: "completed",
                        message:1,
                        data:   {
								"id_client" : "{{ id_client }}",
								"certificateNumber": policy, 
								"authCode": "{{ authCode }}"
								},
                    })
                }).fail(function(error){
                        console.log(error)
                }).then(function(resp){});
	});
</script>
{% endblock %}