617 lines
29 KiB
PHP
617 lines
29 KiB
PHP
<!DOCTYPE html>
|
|
|
|
<html lang="fr" data-kantu="1">
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Effectuer un paiement - {{__('providers.'.$method)}}</title>
|
|
<meta name="theme-color" content="#000000">
|
|
<meta name="csrf-token" content="">
|
|
<link rel="icon" href="{{asset('assets/images/favicon.ico')}}">
|
|
<meta name="msapplication-TileColor" content="#ffffff">
|
|
<meta name="theme-color" content="#ffffff">
|
|
<link rel="stylesheet" href="{{asset('assets/app.css')}}">
|
|
|
|
<style>
|
|
.option-content1::after {
|
|
left: 42%;
|
|
}
|
|
</style>
|
|
<style type="text/css">
|
|
#page {
|
|
display: none;
|
|
}
|
|
|
|
#loading {
|
|
display: block;
|
|
position: absolute;
|
|
z-index: 100;
|
|
background-position: center;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%)
|
|
}
|
|
|
|
@keyframes ldio-5owbnf6l9j7 {
|
|
0% {
|
|
transform: translate(12px, 80px) scale(0);
|
|
}
|
|
25% {
|
|
transform: translate(12px, 80px) scale(0);
|
|
}
|
|
50% {
|
|
transform: translate(12px, 80px) scale(1);
|
|
}
|
|
75% {
|
|
transform: translate(80px, 80px) scale(1);
|
|
}
|
|
100% {
|
|
transform: translate(148px, 80px) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes ldio-5owbnf6l9j7-r {
|
|
0% {
|
|
transform: translate(148px, 80px) scale(1):
|
|
}
|
|
100% {
|
|
transform: translate(148px, 80px) scale(0);
|
|
}
|
|
}
|
|
|
|
@keyframes ldio-5owbnf6l9j7-c {
|
|
0% {
|
|
background: var(--loader-color1)
|
|
}
|
|
25% {
|
|
background: var(--loader-color2)
|
|
}
|
|
50% {
|
|
background: var(--loader-color1)
|
|
}
|
|
75% {
|
|
background: var(--loader-color2)
|
|
}
|
|
100% {
|
|
background: var(--loader-color1)
|
|
}
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div {
|
|
position: absolute;
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
transform: translate(80px, 80px) scale(1);
|
|
background: var(--loader-color1);
|
|
animation: ldio-5owbnf6l9j7 1.2048192771084336s infinite cubic-bezier(0, 0.5, 0.5, 1);
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div:nth-child(1) {
|
|
background: var(--loader-color2);
|
|
transform: translate(148px, 80px) scale(1);
|
|
animation: ldio-5owbnf6l9j7-r 0.3012048192771084s infinite cubic-bezier(0, 0.5, 0.5, 1), ldio-5owbnf6l9j7-c 1.2048192771084336s infinite step-start;
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div:nth-child(2) {
|
|
animation-delay: -0.3012048192771084s;
|
|
background: var(--loader-color1);
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div:nth-child(3) {
|
|
animation-delay: -0.6024096385542168s;
|
|
background: var(--loader-color2);
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div:nth-child(4) {
|
|
animation-delay: -0.9036144578313252s;
|
|
background: var(--loader-color1);
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div:nth-child(5) {
|
|
animation-delay: -1.2048192771084336s;
|
|
background: var(--loader-color2);
|
|
}
|
|
|
|
.loadingio-spinner-ellipsis-99po1h19hjs {
|
|
width: 200px;
|
|
height: 200px;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
background: none;
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: relative;
|
|
transform: translateZ(0) scale(1);
|
|
backface-visibility: hidden;
|
|
transform-origin: 0 0; /* see note above */
|
|
}
|
|
|
|
.ldio-5owbnf6l9j7 div {
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
|
|
.toggle-content {
|
|
display: none;
|
|
height: 0;
|
|
opacity: 0;
|
|
overflow: hidden;
|
|
transition: height 350ms ease-in-out, opacity 750ms ease-in-out;
|
|
}
|
|
|
|
.toggle-content.is-visible {
|
|
display: block;
|
|
height: auto;
|
|
opacity: 1;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body id="body">
|
|
<div id="loading">
|
|
<div class="loadingio-spinner-ellipsis-99po1h19hjs">
|
|
<div class="ldio-5owbnf6l9j7">
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="page" class="container">
|
|
<div class="row h-100 justify-content-center">
|
|
<div class="col-md-8 col-lg-6 my-auto">
|
|
<div class="desk bg-white shadow-sm">
|
|
<div class="desk-head">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="">
|
|
<div class="media align-items-center">
|
|
<div class="media-head">
|
|
<img src="{{$receiver_logo}}" class="rounded media-body mr-2 marchand-logo" alt="{{$receiver}}">
|
|
</div>
|
|
<div class="media-body">
|
|
<p class="marchand-name p-0 m-0">{{$receiver}}</p>
|
|
<h4 class="due-amount p-0 m-0">{{$amount}}</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr class="ml-2 mr-2">
|
|
<div class="desk-body">
|
|
<form id="payment_form" name="begin_form" method="POST" action="{{route('yoomee.v2.checkoutPay')}}">
|
|
<input type="hidden" name="_token" value="{{ app('request')->session()->get('_token') }}">
|
|
<input type="hidden" name="payment_token" value="{{ $payment_token }}">
|
|
<div class="desk-content">
|
|
<p class="text-center">Payer avec</p>
|
|
<div class="choose-payment-type">
|
|
<ul class="nav nav-tabs" id="myTab" role="tablist">
|
|
<li class="nav-item">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="60px" height="60px" viewBox="0 0 100 100">
|
|
<g transform="translate(-2978 2535)">
|
|
<rect width="100" height="100" transform="translate(2978 -2535)" fill="var()" opacity="0.003"></rect>
|
|
<g transform="translate(2403.753 -3004.222)">
|
|
<path d="M65.889,1.928H12.373A5.964,5.964,0,0,0,6.427,7.874V91.122a5.964,5.964,0,0,0,5.946,5.946H65.889a5.964,5.964,0,0,0,5.946-5.946V7.874A5.964,5.964,0,0,0,65.889,1.928ZM39.131,92.774a4.625,4.625,0,1,1,4.625-4.625A4.625,4.625,0,0,1,39.131,92.774ZM65.889,79.23H12.373V13.821H65.889Z" transform="translate(584.82 469.294)" fill="var(--cinetpay1)"></path>
|
|
<path d="M21.585,0V3.6H0V7.2H21.585v3.6l7.2-5.4ZM7.2,14.39,0,19.787l7.2,5.4v-3.6H28.78v-3.6H7.2Z" transform="translate(609.43 500.731)" fill=" var(--cinetpay1)"></path>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
<p class="descrip" style="font-size:medium; margin-top: 5px">{{__('providers.'.$method)}}</p>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content" id="myTabContent">
|
|
<div class="tab-pane fade active show" id="mobile-money" role="tabpanel" aria-labelledby="mobile-money-tab">
|
|
<div class="option-content1">
|
|
<div class="p-1">
|
|
<div class="desk-form">
|
|
<div class="phone-input form-group">
|
|
<label class="input-title input-phone" for="phone_number">
|
|
Numéro de téléphone
|
|
</label>
|
|
<div class="iti iti--allow-dropdown iti--separate-dial-code">
|
|
<div class="iti__flag-container">
|
|
<div class="iti__selected-flag" role="combobox"
|
|
aria-controls="iti-0__country-listbox"
|
|
aria-owns="iti-0__country-listbox"
|
|
aria-expanded="false" tabindex="0"
|
|
title="Cameroon (Cameroun): +237"
|
|
aria-activedescendant="iti-0__item-cm">
|
|
<div class="iti__flag iti__cm"></div>
|
|
<div class="iti__selected-dial-code">+237</div>
|
|
<div class="iti__arrow"></div>
|
|
</div>
|
|
<ul class="iti__country-list iti__hide"
|
|
id="iti-0__country-listbox" role="listbox"
|
|
aria-label="List of countries">
|
|
<li class="iti__country iti__standard iti__active"
|
|
tabindex="-1" id="iti-0__item-cm" role="option"
|
|
data-dial-code="237" data-country-code="cm"
|
|
aria-selected="true">
|
|
<div class="iti__flag-box">
|
|
<div class="iti__flag iti__cm"></div>
|
|
</div>
|
|
<span class="iti__country-name">Cameroon (Cameroun)</span><span
|
|
class="iti__dial-code">+237</span></li>
|
|
</ul>
|
|
</div>
|
|
<input type="tel" id="phone_number" name="phone_number"
|
|
class="form-control input-tel" value="" autofocus
|
|
required autocomplete="off"
|
|
data-intl-tel-input-id="0"
|
|
style="padding-left: 94px;" minlength="9" maxlength="9"
|
|
placeholder="6 71 23 45 67">
|
|
</div>
|
|
<img id="payment-method-icon" width="2rem"
|
|
alt="payment method logo"
|
|
src="{{url('assets/images/default.png')}}">
|
|
<div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="col-12 px-0">
|
|
<div>
|
|
<p id="methodscm" class="payment-method-box operator-box">
|
|
@if(str_contains(strtolower($method),'orange'))
|
|
<img
|
|
src="{{url('assets/images/orange.png')}}"
|
|
class="rounded mx-1 payment-method-logo"
|
|
alt="ORANGE">
|
|
@elseif(str_contains(strtolower($method),'mtn'))
|
|
<img
|
|
src="{{url('assets/images/mtn.png')}}"
|
|
class="rounded mx-1 payment-method-logo"
|
|
alt="MTN">
|
|
@elseif(str_contains(strtolower($method),'yoomee'))
|
|
<img
|
|
src="{{url('assets/images/yoomee.png')}}"
|
|
class="rounded mx-1 payment-method-logo"
|
|
alt="yoomee">
|
|
@elseif(str_contains(strtolower($method),'express'))
|
|
<img
|
|
src="{{url('assets/images/express-union.png')}}"
|
|
class="rounded mx-1 payment-method-logo"
|
|
alt="express">
|
|
@else
|
|
<img
|
|
src="{{url('assets/images/default.png')}}"
|
|
class="rounded mx-1 payment-method-logo"
|
|
alt="default">
|
|
@endif
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="desk-action p-3" id="desk-action">
|
|
<button type="submit" class="btn btn-next btn-block" id="del">
|
|
Payer {{$amount}}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
@include('footer')
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="{{asset('assets/sweetalert2/sweetalert2.all.min.js')}}"></script>
|
|
<script src="{{asset('assets/app.js')}}"></script>
|
|
<script>
|
|
|
|
document.addEventListener('readystatechange', function (event) {
|
|
if (event.target.readyState === 'complete') {
|
|
ready();
|
|
}
|
|
});
|
|
|
|
function ready() {
|
|
setTimeout(function () {
|
|
fadeIn(document.getElementById('page'))
|
|
}, 217)
|
|
fadeOut(document.getElementById('loading'));
|
|
}
|
|
|
|
// ** FADE OUT FUNCTION **
|
|
function fadeOut(el) {
|
|
el.style.opacity = 1;
|
|
(function fade() {
|
|
if ((el.style.opacity -= .1) < 0) {
|
|
el.style.display = "none";
|
|
} else {
|
|
requestAnimationFrame(fade);
|
|
}
|
|
})();
|
|
}
|
|
|
|
// ** FADE IN FUNCTION **
|
|
function fadeIn(el, display) {
|
|
el.style.opacity = 0;
|
|
el.style.display = display || "block";
|
|
(function fade() {
|
|
var val = parseFloat(el.style.opacity);
|
|
if (!((val += .1) > 1)) {
|
|
el.style.opacity = val;
|
|
requestAnimationFrame(fade);
|
|
}
|
|
})();
|
|
}
|
|
|
|
function empty(item) {
|
|
return (item === undefined || item === null || item === false || item === '');
|
|
}
|
|
</script>
|
|
|
|
<script>
|
|
document.addEventListener('readystatechange', function (event) {
|
|
if (event.target.readyState === 'complete') {
|
|
disableButtonOnSubmit();
|
|
}
|
|
});
|
|
function disableButtonOnSubmit() {
|
|
var form = document.getElementById('payment_form');
|
|
var submitButton = document.getElementById('del');
|
|
form.addEventListener('submit', function () {
|
|
submitButton.disabled = true;
|
|
setTimeout(function () {
|
|
submitButton.disabled = false;
|
|
}, 15000)
|
|
})
|
|
}
|
|
</script>
|
|
<script>
|
|
|
|
@if(session('error'))
|
|
Swal.fire({
|
|
title: 'Error!',
|
|
text: "{{session('error')}}",
|
|
icon: 'error',
|
|
confirmButtonText: 'OK'
|
|
})
|
|
@endif
|
|
|
|
function initializeIntelInput() {
|
|
try {
|
|
if (empty(window.intlTelInput) && intlTelInput) {
|
|
window.intlTelInput = intlTelInput;
|
|
}
|
|
|
|
var phoneNumberInput = document.querySelector("#phone_number");
|
|
|
|
var iti = window.intlTelInput(phoneNumberInput, {
|
|
hiddenInput: "phone_number",
|
|
onlyCountries: ["cm"],
|
|
placeholderNumberType: "MOBILE",
|
|
initialCountry: 'cm',
|
|
localizedCountries: {"cd": "Congo RDC"},
|
|
separateDialCode: true,
|
|
utilsScript: "/assets/utils.js",
|
|
customPlaceholder: function (selectedCountryPlaceholder, selectedCountryData) {
|
|
if (selectedCountryData.iso2 === 'ci') {
|
|
return '01 23 45 67 89';
|
|
} else {
|
|
return selectedCountryPlaceholder;
|
|
}
|
|
},
|
|
});
|
|
|
|
var countryJsData = iti.getSelectedCountryData();
|
|
var countryJs = 'cm';
|
|
if (!empty(countryJsData) && !empty(countryJsData.iso2)) {
|
|
countryJs = countryJsData.iso2;
|
|
getMobileMoneyPaymentMethodLogo(iti);
|
|
}
|
|
|
|
var methodCountry = document.getElementById("methods" + countryJs);
|
|
showCurrentLogos(methodCountry);
|
|
|
|
phoneNumberInput.addEventListener('countrychange', function (e) {
|
|
const methodCountry = document.getElementById("methods" + iti.getSelectedCountryData().iso2)
|
|
showCurrentLogos(methodCountry);
|
|
getMobileMoneyPaymentMethodLogo(iti);
|
|
});
|
|
|
|
|
|
phoneNumberInput.addEventListener('paste', function (e) {
|
|
getMobileMoneyPaymentMethodLogo(iti);
|
|
});
|
|
phoneNumberInput.addEventListener('keyup', function (e) {
|
|
getMobileMoneyPaymentMethodLogo(iti);
|
|
});
|
|
|
|
if (!empty(phoneNumberInput)) {
|
|
setInputFilter(phoneNumberInput, function (value) {
|
|
return /^\d*\.?\d*$/.test(value.replace(/\s/g, ''));
|
|
});
|
|
}
|
|
|
|
|
|
var countryData = iti.getSelectedCountryData()
|
|
var countryIso = countryData.iso2;
|
|
var phoneNumber = phoneNumberInput.value.replace("+" + iti.dialCode, "").trim();
|
|
displayPaymentMethodLogo(countryIso, phoneNumber);
|
|
return true;
|
|
} catch (e) {
|
|
}
|
|
}
|
|
|
|
function getMobileMoneyPaymentMethodLogo(itiEvent) {
|
|
var countryData = itiEvent.getSelectedCountryData()
|
|
var countryIso = countryData.iso2;
|
|
var phoneNumber = itiEvent.getNumber().replace("+" + countryData.dialCode, "").trim();
|
|
return displayPaymentMethodLogo(countryIso, phoneNumber);
|
|
}
|
|
|
|
if (document.readyState !== 'loading') {
|
|
initializeIntelInput();
|
|
|
|
} else {
|
|
document.addEventListener("DOMContentLoaded", initializeIntelInput);
|
|
}
|
|
|
|
</script>
|
|
<script>
|
|
if (!String.prototype.startsWith) {
|
|
Object.defineProperty(String.prototype, 'startsWith', {
|
|
value: function (search, rawPos) {
|
|
var pos = rawPos > 0 ? rawPos | 0 : 0;
|
|
return this.substring(pos, pos + search.length) === search;
|
|
}
|
|
});
|
|
}
|
|
|
|
var paymentMethods = {
|
|
"bf": {
|
|
"regex": [],
|
|
"prefixes": [{
|
|
"values": ["55", "64", "65", "66", "67", "74", "75", "76", "77"],
|
|
"name": "orange"
|
|
}, {"values": ["51", "53", "60", "61", "62", "63", "70", "71", "72", "73"], "name": "moov"}],
|
|
"max_digits": 8,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"bj": {
|
|
"regex": [],
|
|
"prefixes": [{
|
|
"values": ["51", "52", "53", "54", "61", "62", "66", "67", "69", "90", "91", "96", "97"],
|
|
"name": "mtn"
|
|
}, {"values": ["60", "63", "64", "65", "94", "95", "98", "99"], "name": "moov"}],
|
|
"max_digits": 8,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"cd": {
|
|
"regex": [],
|
|
"prefixes": [{
|
|
"values": ["80", "84", "85", "89"],
|
|
"currencies": ["CDF", "USD"],
|
|
"name": "orange"
|
|
}, {
|
|
"currencies": ["CDF", "USD"],
|
|
"values": ["97", "99"],
|
|
"name": "airtel"
|
|
}, {
|
|
"values": ["81", "82", "83", "081", "082", "080", "083"],
|
|
"currencies": ["CDF", "USD"],
|
|
"name": "mpesa"
|
|
}],
|
|
"max_digits": 10,
|
|
"currencies": ["CDF", "USD"]
|
|
},
|
|
"ci": {
|
|
"regex": [{
|
|
"values": "^[0,4,5,6,7,8,9]{1}[7,8,9]\\d{0,8}",
|
|
"name": "orange"
|
|
}, {
|
|
"values": "^[0,4,5,6,7,8,9]{1}[4,5,6]\\d{0,8}",
|
|
"name": "mtn"
|
|
}, {"values": "^[0,4,5,6,7,8,9]{1}[0,1,2,3]{1}\\d{0,8}", "name": "moov"}],
|
|
"prefixes": [],
|
|
"max_digits": 10,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"cm": {
|
|
"regex": [],
|
|
"prefixes": [
|
|
{
|
|
"values": ["690", "691", "692", "693", "694", "695", "696", "697", "698", "699", "655", "656", "657", "658", "659"],
|
|
"name": "orange"
|
|
},
|
|
{
|
|
"values": ["680", "681", "682", "683", "684", "685", "686", "687", "688", "689", "650", "651", "652", "653", "654", "678"],
|
|
"name": "mtn"
|
|
},
|
|
{
|
|
"values": ["230", "231", "232" , "233" , "240","241","242"],
|
|
"name": "yoomee"
|
|
}
|
|
],
|
|
"max_digits": 10,
|
|
"currencies": ["XAF"]
|
|
},
|
|
"ml": {
|
|
"regex": [],
|
|
"prefixes": [{"values": ["65", "66", "67", "68", "69", "95", "96", "97", "98", "99"], "name": "moov"}],
|
|
"max_digits": 10,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"ne": {
|
|
"regex": [],
|
|
"prefixes": [{"values": ["86", "87", "88", "89", "96", "97", "98", "99"], "name": "airtel"}],
|
|
"max_digits": 8,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"sn": {
|
|
"regex": [],
|
|
"prefixes": [{"values": ["77", "78"], "name": "orange"}, {
|
|
"values": ["65", "66", "76"],
|
|
"name": "freemoney"
|
|
}, {"values": ["70"], "name": "expresso"}],
|
|
"max_digits": 10,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"tg": {
|
|
"regex": [],
|
|
"prefixes": [{
|
|
"values": ["79", "96", "97", "98", "99"],
|
|
"name": "moov"
|
|
}, {"values": ["70", "90", "91", "92", "93"], "name": "tmoney"}],
|
|
"max_digits": 10,
|
|
"currencies": ["XOF"]
|
|
},
|
|
"gn": {
|
|
"regex": [],
|
|
"prefixes": [{"values": ["610", "611", "62"], "name": "orange"}, {"values": ["66"], "name": "mtn"}],
|
|
"max_digits": 8,
|
|
"currencies": ["GNF"]
|
|
}
|
|
};
|
|
|
|
function displayPaymentMethodLogo(country, phoneNumber) {
|
|
var countriesPaymentMethods = paymentMethods[country.toLowerCase()];
|
|
var logosPath = '/assets/images/';
|
|
var logo = 'default';
|
|
if (countriesPaymentMethods !== undefined) {
|
|
var countriesPaymentMethodsRegexEntries = countriesPaymentMethods['regex'];
|
|
var countriesPaymentMethodsValuesEntries = countriesPaymentMethods['prefixes'];
|
|
if (typeof countriesPaymentMethodsRegexEntries !== undefined && countriesPaymentMethodsRegexEntries.length > 0) {
|
|
for (var regexItem of countriesPaymentMethodsRegexEntries) {
|
|
if (new RegExp(regexItem.values).test(phoneNumber) && phoneNumber.length <= countriesPaymentMethods['max_digits']) {
|
|
logo = regexItem.name;
|
|
document.getElementById("payment-method-icon").src = logosPath + logo + '.png';
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
if (typeof countriesPaymentMethodsValuesEntries !== undefined && countriesPaymentMethodsValuesEntries.length > 0) {
|
|
for (var prefixItem of countriesPaymentMethodsValuesEntries) {
|
|
var prefixes = prefixItem['values'];
|
|
for (var prefix of prefixes) {
|
|
if (phoneNumber.startsWith(prefix) && phoneNumber.length <= countriesPaymentMethods['max_digits']) {
|
|
logo = prefixItem['name'];
|
|
document.getElementById("payment-method-icon").src = logosPath + logo + '.png';
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
document.getElementById("payment-method-icon").src = logosPath + 'default.png';
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|