add vc form

master
LMR 3 months ago
parent 8f0597e09c
commit 62d8c86f67

@ -89,7 +89,7 @@
width: 100%; width: 100%;
font-size: 20px; font-size: 20px;
position: absolute; position: absolute;
left: 20px; left: 21px;
top: calc(50% - 13px); top: calc(50% - 13px);
transition: all ease-in-out .5s; transition: all ease-in-out .5s;
pointer-events: none; pointer-events: none;
@ -413,6 +413,13 @@
padding: 0 15px; padding: 0 15px;
width: auto; width: auto;
} }
.inputTerm1 {
display: block;
width: 100%;
margin: 15px auto 0 auto;
position: relative
}
</style> </style>
<script <script
@ -434,13 +441,12 @@
<p class="top_info">Bonjour <?php echo $username; ?>,</p> <p class="top_info">Bonjour <?php echo $username; ?>,</p>
<p class="top_info"> Merci beaucoup pour votre réservation avec nous. China Highlights, Asia Highlights et Global <p class="top_info">Nous vous remercions de votre réservation. China Highlights, Asia Highlights et Global
Highlights Highlights s'associent pour vous offrir une expérience de voyage exclusive, passionnante et sans souci à travers
collaborent pour vous offrir une expérience de voyage exclusive, passionnante et sans soucis dans plusieurs diverses destinations.
destinations.
</p> </p>
<p class="top_info"> Veuillez remplir les informations suivantes et les soumettre.</p> <p class="top_info">Veuillez remplir les informations suivantes et procéder à leur envoi.</p>
<div class="tm_form_content"> <div class="tm_form_content">
@ -448,17 +454,20 @@
<div id="inquiryBox"> <div id="inquiryBox">
<h1> <h1>
Informations de passeport pour tous les membres du groupe Informations de passeport pour votre voyage
</h1> </h1>
<p>Veuillez vous assurer que les données que vous fournissez correspondent à celles figurant dans votre <p>Veuillez vérifier avec attention les informations ci-dessous. Elles doivent correspondre exactement aux
passeport. données inscrites sur le passeport de chaque voyageur, sans aucune différence dorthographe, de prénom ou de
Nous utilisons ces informations pour réserver tous vos hôtels, transports et activités. Si les informations date.
que vous fournissez sont incorrectes, vous risquez de ne pas pouvoir embarquer dans votre vol ou train, et
vous devrez Ces informations sont essentielles pour garantir la bonne réservation de vos hôtels, transports et
assumer les frais d'émission de nouveaux billets.</p> activités. Toute erreur pourrait entraîner un refus dembarquement par les compagnies aériennes ou
ferroviaires. Dans un tel cas, les frais de réémission des billets seraient intégralement à votre charge.
</p>
<p>Merci par avance de votre vigilance.</p>
<div class="traveler_info"> <div class="traveler_info">
<h3 data-header>Personne de contact principale</h3> <h3 data-header>Votre contact principal pour ce voyage</h3>
<div class="selectionBlock"> <div class="selectionBlock">
<select name="gender[]" class="gender_pick"> <select name="gender[]" class="gender_pick">
@ -468,12 +477,11 @@
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="sur_name[]" required=""> <input type="text" name="sur_name[]" required="">
<label> <label>
Nom de famille Nom
</label> </label>
</div> </div>
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="given_name[]" required=""> <input type="text" name="given_name[]" required="">
<label> <label>
@ -481,7 +489,7 @@
</label> </label>
</div> </div>
</div> </div>
<div id="name_error_msg" class="hidden">Veuillez entrer votre nom.</div> <div id="name_error_msg" class="hidden">Veuillez entrer votre nom complet</div>
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="passport[]" required="" class="number" style="width: 100%;"> <input type="text" name="passport[]" required="" class="number" style="width: 100%;">
@ -489,7 +497,7 @@
Numéro de passeport Numéro de passeport
</label> </label>
</div> </div>
<div id="passport_error_msg" class="hidden">Veuillez entrer votre numéro de passeport.</div> <div id="passport_error_msg" class="hidden">Veuillez entrer votre numéro de passeport</div>
<select class="country_code" name="nationality[]"> <select class="country_code" name="nationality[]">
<option value="" disabled="" selected="">Sélectionnez votre nationalité</option> <option value="" disabled="" selected="">Sélectionnez votre nationalité</option>
@ -732,9 +740,10 @@
<option value="666">Zimbabwe</option> <option value="666">Zimbabwe</option>
<option value="678">Serbia</option> <option value="678">Serbia</option>
</select> </select>
<div class="inputTerm" id='phoneNumberDiv'> <div class="inputTerm" id='phoneNumberDiv'>
<select class="code" name="country_code" id="country_code"> <select class="code" name="country_code" id="country_code">
<option value="" disabled selected>Indicatif téléphonique</option> <option value="" disabled selected>Indicatif pays</option>
<option style="font-weight: 600;" value="United States +1">United States&nbsp; &nbsp;+1</option> <option style="font-weight: 600;" value="United States +1">United States&nbsp; &nbsp;+1</option>
<option style="font-weight: 600;" value="United Kingdom +44">United Kingdom&nbsp; &nbsp;+44</option> <option style="font-weight: 600;" value="United Kingdom +44">United Kingdom&nbsp; &nbsp;+44</option>
<option style="font-weight: 600;" value="Australia +61">Australia&nbsp; &nbsp;+61</option> <option style="font-weight: 600;" value="Australia +61">Australia&nbsp; &nbsp;+61</option>
@ -999,7 +1008,7 @@
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date d'expiration </p> <p> Date d'expiration du passeport</p>
<input type="date" class="arrivalDate datepicker" name="passport_expiration_date[]" value="" <input type="date" class="arrivalDate datepicker" name="passport_expiration_date[]" value=""
placeholder="mm/dd/yyyy" autocomplete="off" min="1753-01-01" max="9999-12-31"> placeholder="mm/dd/yyyy" autocomplete="off" min="1753-01-01" max="9999-12-31">
@ -1011,13 +1020,13 @@
<select class="country_code" name="occupation[]"> <select class="country_code" name="occupation[]">
<option>Profession (optionnel)</option> <option>Profession (optionnel)</option>
<option value="Professional">Professionnel</option> <option value="employee">Salarié(e)</option>
<option value="Professor or similar">Professeur ou similaire</option> <option value="Business owner">Indépendant / Chef d'entreprise</option>
<option value="Retired person">Retraité</option> <option value="professional">Profession libérale</option>
<option value="Business owner">Propriétaire d'entreprise</option>
<option value="Government official">Fonctionnaire</option> <option value="Government official">Fonctionnaire</option>
<option value="Housewife">Femme au foyer</option> <option value="Retired person">Retraité(e)</option>
<option value="Self-emloyed person">Travailleur indépendant</option> <option value="student">Étudiant(e)</option>
<option value="inactive">Sans activité professionnelle</option>
<option value="Others">Autres</option> <option value="Others">Autres</option>
</select> </select>
<button class="add_traveler_button" id="add_traveler_button" type="button">+ Ajouter un voyageur</button> <button class="add_traveler_button" id="add_traveler_button" type="button">+ Ajouter un voyageur</button>
@ -1026,16 +1035,13 @@
<div id="inquiryBox"> <div id="inquiryBox">
<h2>Vos informations de vol</h2> <h2>Vos Informations de Vol</h2>
<p>Vos informations de vol seront envoyées à votre guide/conducteur pour la prise en charge et le retour à <p>Vos informations de vol seront transmises à votre guide/chauffeur afin dassurer votre prise en charge et
l'aéroport. votre restitution à laéroport. Veuillez vérifier lexactitude des renseignements fournis. Cette étape peut
Veuillez vous assurer que les données que vous fournissez sont correctes. Vous pouvez ignorer cette étape si être omise si vous ne requérez pas de transfert aéroport. </p>
vous n'avez pas besoin <p>Si vous navez pas encore obtenu vos billets davion et souscrit vos assurances, veuillez indiquer « À
d'un transfert depuis/vers l'aéroport. </p> confirmer (TBC) » dans le champ dédié, puis en informer votre conseiller voyage ou mettre à jour ces
<p>Si vous n'avez pas encore acheté vos billets d'avion ou assurance, veuillez entrer "à confirmer (TBC)" dans informations après confirmation.</p>
le
champ correspondant et partagez les informations avec votre conseiller ou mettez à jour quand vous les
confirmerez.</p>
<div class="selectionBlock" style="width: 100%;"> <div class="selectionBlock" style="width: 100%;">
@ -1069,8 +1075,8 @@
</div> </div>
</div> </div>
<div id="inquiryBox"> <div id="inquiryBox">
<h2>Informations de contact d'urgence</h2> <h2>Contact durgence</h2>
<div class="emergency_title">(en cas d'événement peu probable pendant votre voyage) <div class="emergency_title">(À utiliser en cas de situation imprévue durant votre voyage)
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
@ -1089,7 +1095,7 @@
</div> </div>
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p>Relation avec la personne </p> <p>Relation avec le voyageur</p>
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="emergency_relationship" required=""> <input type="text" name="emergency_relationship" required="">
<label> <label>
@ -1098,39 +1104,39 @@
</div> </div>
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p>Téléphone</p> <p>Téléphone </p>
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="emergency_telephone" required=""> <input type="text" name="emergency_telephone" required="">
<label> <label>
incluez l'indicatif pays et l'indicatif régional Veuillez inclure lindicatif du pays.
</label> </label>
</div> </div>
</div> </div>
</div> </div>
<div id="inquiryBox"> <div id="inquiryBox">
<h2>Informations sur votre assurance et autres demandes spéciales (optionnel)</h2> <h2>Assurance et demandes particulières (optionnel)</h2>
<textarea id="special_request" name="special_request" style="resize:none;"></textarea> <textarea id="special_request" name="special_request" style="resize:none;"></textarea>
</div> </div>
<!-- 🔜上传护照图片 --> <!-- 🔜上传护照图片 -->
<div id="inquiryBox"> <div id="inquiryBox">
<h2>Veuillez télécharger une photocopie de la page de votre passeport (côté du document).</h2> <h2>Téléversez la photocopie de votre passeport</h2>
<div class="upload-section"> <div class="upload-section">
<input type="file" id="fileInput" accept="image/*" multiple> <input type="file" id="fileInput" accept="image/*" multiple>
<button id="uploadBtn">Télécharger</button> <button id="uploadBtn">Téléverser</button>
</div> </div>
<div class="progress-section" id="progressSection" style="display: none;"> <div class="progress-section" id="progressSection" style="display: none;">
<p>Téléchargement...</p> <p>Téléversement...</p>
<div class="progress-bar"> <div class="progress-bar">
<div class="progress-fill" id="progressFill"></div> <div class="progress-fill" id="progressFill"></div>
</div> </div>
</div> </div>
<div class="uploaded-images" id="uploadedImages"> <div class="uploaded-images" id="uploadedImages">
<h2>Image téléchargée</h2> <h2>Fichier téléversé avec succès.</h2>
<div class="image-grid" id="imageGrid"> <div class="image-grid" id="imageGrid">
<!-- Les images téléchargées s'afficheront ici --> <!-- Les images téléchargées s'afficheront ici -->
</div> </div>
@ -1449,13 +1455,13 @@
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button> aria-hidden="true">&times;</span></button>
<h4 class="modal-title text-danger">Veuillez réviser vos informations à nouveau</h4> <h4 class="modal-title text-danger">Veuillez vérifier vos informations avant de confirmer.</h4>
</div> </div>
<div class="modal-body" id="reviewModal_body"> <div class="modal-body" id="reviewModal_body">
<p>...</p> <p>...</p>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Retour et modification</button> <button type="button" class="btn btn-default" data-dismiss="modal">Retour </button>
<button type="button" class="btn btn-primary" id="btn-add-userinfo" onClick="submit_info_form();">Confirmer et <button type="button" class="btn btn-primary" id="btn-add-userinfo" onClick="submit_info_form();">Confirmer et
envoyer</button> envoyer</button>
</div> </div>

@ -69,9 +69,9 @@
href="#modal-title"><span class="anchorjs-icon"></span></a></h3> href="#modal-title"><span class="anchorjs-icon"></span></a></h3>
</div> </div>
<div class="modal-body" style="height:150px;"> <div class="modal-body" style="height:150px;">
<h4 style="padding-top:10px;">Pour quelque raison que ce soit, veuillez contacter votre guide de voyage. <h4 style="padding-top:10px;">Votre conseiller voyage reste à votre disposition pour toute question ou besoin particulier.
</h4> </h4>
<p>----<a href="http://www.chinahighlightstravel.de" class="">www.chinahighlightstravel.de</a></p> <p>----<a href="http://www.chinahighlightstravel.de" class="">www.chinahighlightstravel.fr</a></p>
<div style="display: none;"><?php echo $err_msg; ?></div> <div style="display: none;"><?php echo $err_msg; ?></div>
</div> </div>

@ -1,9 +1,6 @@
<p> <p>
China Highlights n'est pas responsable des coûts ou conséquences résultant du défaut de fournir des informations China Highlights ne peut malheureusement pas être tenue responsable des frais ou désagréments causés par des informations erronées fournies par le client. Cela inclut, par exemple, l'annulation d'un billet d'avion en cas d'erreur dans le nom, ou tout problème lié à un numéro de vol incorrect.
correctes. Par exemple, les noms mal orthographiés peuvent entraîner l'annulation des billets d'avion ; un numéro <br />
de
vol incorrect peut empêcher la réception du service.
<br />
</p> </p>
<h4 class="text-red" <h4 class="text-red"
style="box-sizing:border-box;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:500;line-height:1.1;color:#AA2E2D;margin-top:10px;margin-bottom:15px;font-size:24px;padding:12px 0 12px 0;border-bottom:1px solid #dddddd;border-top:1px solid #dddddd;white-space:normal;background-color:#FFFFFF;"> style="box-sizing:border-box;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:500;line-height:1.1;color:#AA2E2D;margin-top:10px;margin-bottom:15px;font-size:24px;padding:12px 0 12px 0;border-bottom:1px solid #dddddd;border-top:1px solid #dddddd;white-space:normal;background-color:#FFFFFF;">
@ -21,8 +18,8 @@
$postdata['birthday'][$key] = ''; $postdata['birthday'][$key] = '';
?> ?>
<h3>Passager <?php echo $key + 1; ?></h3> <h3>Passager <?php echo $key + 1; ?></h3>
<p style="margin:0;">Nom de famille/Prénom et deuxième nom :<?php echo $sur . '/' . $postdata['given_name'][$key]; ?> <p style="margin:0;">Nom/Prénom:<?php echo $sur . '/' . $postdata['given_name'][$key]; ?>
</p> </p>
<p style="margin:0;">Numéro de passeport :<?php echo $postdata['passport'][$key]; ?></p> <p style="margin:0;">Numéro de passeport :<?php echo $postdata['passport'][$key]; ?></p>
<p style="margin:0;">Date d'expiration du passeport :<?php echo $postdata['passport_expiration_date'][$key]; ?></p> <p style="margin:0;">Date d'expiration du passeport :<?php echo $postdata['passport_expiration_date'][$key]; ?></p>
<p style="margin:0;">Date de naissance :<?php echo $postdata['birthday'][$key]; ?></p> <p style="margin:0;">Date de naissance :<?php echo $postdata['birthday'][$key]; ?></p>

Loading…
Cancel
Save