Haina
/
information-system
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:hainatravel/information-system

Browse Source
hotfix/paypal-note
赵鹏 2 years ago
parent 2ca1e6bcfb 9605b41f98
commit 3157eac110
9 changed files with 1141 additions and 343 deletions
Show Stats Download Patch File Download Diff File

5
application/third_party/order/controllers/confirm.php vendored
Unescape Escape View File

@ -89,9 +89,10 @@ class Confirm extends CI_Controller {
$COLI_ID = $this->input->post('COLI_ID'); $COLI_ID = $this->input->post('COLI_ID');
//航班信息 //航班信息
$MEI_ArrivalFlightNo = $this->input->post('MEI_ArrivalFlightNo'); $MEI_ArrivalFlightNo = $this->input->post('MEI_ArrivalFlightNo');
$MEI_ArrivalTime = $this->input->post('MEI_ArrivalTime'); // HTML datetime-local 获取的值：2023-05-29T15:45，需要替换 T 为空格才能符合数据类型
$MEI_ArrivalTime = str_replace("T", " ", $this->input->post('MEI_ArrivalTime'));
$MEI_DepartureFlightNo = $this->input->post('MEI_DepartureFlightNo'); $MEI_DepartureFlightNo = $this->input->post('MEI_DepartureFlightNo');
$MEI_DepartureTime = $this->input->post('MEI_DepartureTime'); $MEI_DepartureTime = str_replace("T", " ", $this->input->post('MEI_DepartureTime'));
//已经确认过 //已经确认过

33
application/third_party/order/views/ah/confirm_order.php vendored
Unescape Escape View File

@ -354,6 +354,13 @@ label.gender:hover {
background: #ad1818; background: #ad1818;
color: #fff; color: #fff;
} }
select.gender_pick {border: 1px solid #d1d1d1;
border-radius: 4px;
height: 50px;
font-size: 19px;
box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%);
padding: 0 15px;
width: auto;}
</style> </style>
</head> </head>
@ -393,21 +400,11 @@ label.gender:hover {
<div class="traveler_info"> <div class="traveler_info">
<h3 data-header>Traveler 1</h3> <h3 data-header>Traveler 1</h3>
<div style="
margin-bottom: -30px;
display: inline-block;
width: 100%;">
<input type="radio" name="gender[]" id="genderMs" value="100003" style="display:none;" class="tmpick">
<label class="gender" for="genderMs" style="width: 120px;">
Ms.</label>
<input type="radio" name="gender[]" id="genderMr" value="100001" style="display:none;" class="tmpick">
<label class="gender" for="genderMr" style="width: 120px;">
Mr.</label>
</div>
<div class="selectionBlock"> <div class="selectionBlock">
<select name="gender[]" class="gender_pick">
<option value="100001">Mr.</option>
<option value="100003">Ms.</option>
</select>
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="sur_name[]" required=""> <input type="text" name="sur_name[]" required="">
<label> <label>
@ -677,14 +674,14 @@ label.gender:hover {
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of birth</p> <p> Date of birth</p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of expiration </p> <p> Date of expiration </p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
@ -770,7 +767,7 @@ label.gender:hover {
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_ArrivalTime" readonly="true" required=""> <input type="datetime-local" name="MEI_ArrivalTime" required="">
<label> <label>
Arrival time Arrival time
</label> </label>
@ -786,7 +783,7 @@ label.gender:hover {
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_DepartureTime" readonly="true" required=""> <input type="datetime-local" name="MEI_DepartureTime" required="">
<label> <label>
Departure time Departure time
</label> </label>

43
application/third_party/order/views/confirm_order.php vendored
Unescape Escape View File

@ -675,14 +675,14 @@ select.gender_pick {border: 1px solid #d1d1d1;
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of birth</p> <p> Date of birth</p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of expiration </p> <p> Date of expiration </p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
@ -768,7 +768,7 @@ select.gender_pick {border: 1px solid #d1d1d1;
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_ArrivalTime" readonly="true" autocomplete="off" data-trigger="manual" data-container="body" data-toggle="popover" data-placement="top" required=""> <input type="datetime-local" name="MEI_ArrivalTime" required="">
<label> <label>
Arrival time Arrival time
</label> </label>
@ -784,7 +784,7 @@ select.gender_pick {border: 1px solid #d1d1d1;
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_DepartureTime" readonly="true" autocomplete="off" data-trigger="manual" data-container="body" data-toggle="popover" data-placement="top" required=""> <input type="datetime-local" name="MEI_DepartureTime" required="">
<label> <label>
Departure time Departure time
</label> </label>
@ -948,41 +948,6 @@ select.gender_pick {border: 1px solid #d1d1d1;
var travelerCount = $(".traveler_info").length + 1; var travelerCount = $(".traveler_info").length + 1;
$addTraveler.find('[data-header]').text('Traveler ' + travelerCount); $addTraveler.find('[data-header]').text('Traveler ' + travelerCount);
$('#add_traveler_button').before($addTraveler); $('#add_traveler_button').before($addTraveler);
$('.datepicker').datepicker({
controlType: 'select',
oneLine: true,
changeMonth: true,
changeYear: true,
yearRange: '2010:2055',
timeFormat: 'mm/dd/yy'
});
$('.datetimepicker').datetimepicker({
controlType: 'select',
oneLine: true,
changeMonth: false,
changeYear: false,
timeFormat: 'H:mm'
});
});
$('.datepicker').datepicker({
controlType: 'select',
oneLine: true,
changeMonth: true,
changeYear: true,
yearRange: '2010:2055',
timeFormat: 'mm/dd/yy'
});
$('.datetimepicker').datetimepicker({
controlType: 'select',
oneLine: true,
changeMonth: false,
changeYear: false,
timeFormat: 'H:mm'
}); });
}); });
</script> </script>

67
application/third_party/order/views/gh/confirm_order.php vendored
Unescape Escape View File

@ -355,6 +355,13 @@ label.gender:hover {
background: #ad1818; background: #ad1818;
color: #fff; color: #fff;
} }
select.gender_pick {border: 1px solid #d1d1d1;
border-radius: 4px;
height: 50px;
font-size: 19px;
box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%);
padding: 0 15px;
width: auto;}
</style> </style>
</head> </head>
@ -394,21 +401,12 @@ label.gender:hover {
<div class="traveler_info"> <div class="traveler_info">
<h3 data-header>Traveler 1</h3> <h3 data-header>Traveler 1</h3>
<div style="
margin-bottom: -30px;
display: inline-block;
width: 100%;">
<input type="radio" name="gender[]" id="genderMs" value="100003" style="display:none;" class="tmpick">
<label class="gender" for="genderMs" style="width: 120px;">
Ms.</label>
<input type="radio" name="gender[]" id="genderMr" value="100001" style="display:none;" class="tmpick">
<label class="gender" for="genderMr" style="width: 120px;">
Mr.</label>
</div>
<div class="selectionBlock"> <div class="selectionBlock">
<select name="gender[]" class="gender_pick">
<option value="100001">Mr.</option>
<option value="100003">Ms.</option>
</select>
<div class="inputTerm"> <div class="inputTerm">
<input type="text" name="sur_name[]" required=""> <input type="text" name="sur_name[]" required="">
<label> <label>
@ -678,14 +676,14 @@ label.gender:hover {
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of birth</p> <p> Date of birth</p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<p> Date of expiration </p> <p> Date of expiration </p>
<input type="text" class="arrivalDate datepicker" <input type="date" class="arrivalDate datepicker"
name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off"> name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
</div> </div>
@ -771,7 +769,7 @@ label.gender:hover {
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_ArrivalTime" readonly="true" autocomplete="off" data-trigger="manual" data-container="body" data-toggle="popover" data-placement="top" required=""> <input type="datetime-local" name="MEI_ArrivalTime" required="">
<label> <label>
Arrival time Arrival time
</label> </label>
@ -787,7 +785,7 @@ label.gender:hover {
</div> </div>
<div class="selectionBlock"> <div class="selectionBlock">
<div class="inputTerm"> <div class="inputTerm">
<input type="text" class="datetimepicker" name="MEI_DepartureTime" readonly="true" autocomplete="off" data-trigger="manual" data-container="body" data-toggle="popover" data-placement="top" required=""> <input type="datetime-local" name="MEI_DepartureTime" required="">
<label> <label>
Departure time Departure time
</label> </label>
@ -951,41 +949,6 @@ label.gender:hover {
var travelerCount = $(".traveler_info").length + 1; var travelerCount = $(".traveler_info").length + 1;
$addTraveler.find('[data-header]').text('Traveler ' + travelerCount); $addTraveler.find('[data-header]').text('Traveler ' + travelerCount);
$('#add_traveler_button').before($addTraveler); $('#add_traveler_button').before($addTraveler);
$('.datepicker').datepicker({
controlType: 'select',
oneLine: true,
changeMonth: true,
changeYear: true,
yearRange: '2010:2055',
timeFormat: 'mm/dd/yy'
});
$('.datetimepicker').datetimepicker({
controlType: 'select',
oneLine: true,
changeMonth: false,
changeYear: false,
timeFormat: 'H:mm'
});
});
$('.datepicker').datepicker({
controlType: 'select',
oneLine: true,
changeMonth: true,
changeYear: true,
yearRange: '2010:2055',
timeFormat: 'mm/dd/yy'
});
$('.datetimepicker').datetimepicker({
controlType: 'select',
oneLine: true,
changeMonth: false,
changeYear: false,
timeFormat: 'H:mm'
}); });
}); });
</script> </script>

4
application/third_party/wwwlog/controllers/index.php vendored
Unescape Escape View File

@ -169,13 +169,13 @@ class Index extends CI_Controller
// echo $client_id; // echo $client_id;
$query_string = " $query_string = "
* | select time_local,http_referer,request_uri,http_user_agent,http_x_forwarded_for * | select time_local,http_referer,request_uri,http_user_agent,http_x_forwarded_for,
remote_addr,request_method,request_time,status,body_bytes_sent,upstream_response_time from log where remote_addr,request_method,request_time,status,body_bytes_sent,upstream_response_time from log where
request_uri like '/io/?event=pageview%' request_uri like '/io/?event=pageview%'
and (remote_addr='$ip' OR http_x_forwarded_for like '%$ip%' OR request_uri like '%$client_id%') and (remote_addr='$ip' OR http_x_forwarded_for like '%$ip%' OR request_uri like '%$client_id%')
ORDER BY __time__ DESC ORDER BY __time__ DESC
"; // 同时使用IP和用户ID "; // 同时使用IP和用户ID
$from = time() - 604800 * 4; //往前 604800(7天), 1296000(15天) $from = time() - 604800 * 2; //往前 604800(7天), 1296000(15天)
$to = time(); $to = time();
$request = new Aliyun_Log_Models_GetLogsRequest('globalhoghlights', $this->logstore[$sitecode], $from, $to, '', $query_string, 100, $offset, true); $request = new Aliyun_Log_Models_GetLogsRequest('globalhoghlights', $this->logstore[$sitecode], $from, $to, '', $query_string, 100, $offset, true);
try { try {

129
application/views/mobile_first/ah-info-page-form.php
Unescape Escape View File

@ -1,10 +1,10 @@
<script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script> <div class="tripnotes" collapse="" collapse-status="hide" data-target="tripnotes" data-target-icon="day4Icon" style="font-size: 25px;
<div class="tmbottom"> color: #ad1818;
font-weight: 600;
font-family: 'Goudy Old Style';">Click here to plan your tailor-made tour now. Your 1:1 travel consultant will reply within 1 working day.<span class="OpenIcon" id="day4Icon"></span></div>
<h3 style="text-align: center; font-size: 20px; line-height: 22px;">Start planning your tailor-made tour now. Your 1:1 travel consultant will reply within 1 working day.</h3> <div class="tripnotescontent" collapse-content="" id="tripnotes" style="display: none; box-sizing: border-box;">
<div class="tmbottom" style="padding-top: 60px; margin-top: 0;">
<form action="/orders/quick_inquiry_save" method="post" novalidate="" id="info_page_form"> <form action="/orders/quick_inquiry_save" method="post" novalidate="" id="info_page_form">
<textarea id="form_additionalrequirements" name="additional_requirements" placeholder="E.g. This is a big trip for my birthday, anniversary, honeymoon, retirement, kid's graduation, bucket list… <textarea id="form_additionalrequirements" name="additional_requirements" placeholder="E.g. This is a big trip for my birthday, anniversary, honeymoon, retirement, kid's graduation, bucket list…
Our must-dos/must-sees are…" style="height:90px;"></textarea> Our must-dos/must-sees are…" style="height:90px;"></textarea>
@ -144,6 +144,9 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
margin-bottom: 0;"><strong> margin-bottom: 0;"><strong>
When would you travel? When would you travel?
</strong></p> </strong></p>
<div id="date_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Select your travel data.</div>
</div>
<div class="travel_group date_select" > <div class="travel_group date_select" >
<input type="radio" value="exact travel dates" id="exact" name="trip_date"> <input type="radio" value="exact travel dates" id="exact" name="trip_date">
<label for="exact" class="updatedestination" style="font-size: 18px;"> <label for="exact" class="updatedestination" style="font-size: 18px;">
@ -492,7 +495,9 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
</div> </div>
--> -->
</div> </div>
</div>
<script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script>
<script src="https://data.asiahighlights.com/min/?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script> <script src="https://data.asiahighlights.com/min/?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script>
<script> <script>
@ -642,7 +647,6 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
var $expectedMonth = $('#expectedMonth'); var $expectedMonth = $('#expectedMonth');
var $dateSelectionBlock = $('#dateSelectionBlock'); var $dateSelectionBlock = $('#dateSelectionBlock');
var $expectedTravelDateBlock = $('#expectedTravelDateBlock'); var $expectedTravelDateBlock = $('#expectedTravelDateBlock');
var selectedExpectedDate = '';
$('input[name="trip_date"]').each((i, tripDateEle) => { $('input[name="trip_date"]').each((i, tripDateEle) => {
$(tripDateEle).click(function (e) { $(tripDateEle).click(function (e) {
$expectedDate.val(''); $expectedDate.val('');
@ -730,6 +734,117 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
}); });
}) })
</script> </script>
<script>
// 折叠展开
document.querySelectorAll('div[collapse]').forEach(function ($collapseDiv, index) {
$collapseDiv.onclick = function (e) {
let collapseStatus = $collapseDiv.getAttribute('collapse-status');
let targetId = $collapseDiv.getAttribute("data-target");
let targetIconId = $collapseDiv.getAttribute("data-target-icon");
let $targetElement = document.getElementById(targetId);
let $targetIcon = document.getElementById(targetIconId);
if (collapseStatus == undefined || collapseStatus == "show") {
$targetIcon.classList.remove("CloseIcon");
$targetIcon.classList.add("OpenIcon");
$collapseDiv.setAttribute("collapse-status", "hide");
slideUp($targetElement);
} else {
$targetIcon.classList.remove("OpenIcon");
$targetIcon.classList.add("CloseIcon");
$collapseDiv.setAttribute("collapse-status", "show");
slideDown($targetElement);
}
}
});
document.querySelector('.expandAll').onclick = function (e) {
let obj = document.querySelector('.expandAll');
let all_status = obj.getAttribute("collapse-status");
if (all_status == "hide") {
obj.setAttribute("collapse-status", "show");
obj.querySelector(".expandAllText").innerHTML = "Collapse All";
obj.parentNode.querySelectorAll("div[collapse] span[id$='Icon']").forEach(function(icon, i){
icon.classList.remove('OpenIcon');
icon.classList.add('CloseIcon');
});
obj.parentNode.querySelectorAll("div[collapse-content]").forEach(function(itinerary, i){
slideDown(itinerary);
});
obj.parentNode.querySelectorAll("div[collapse]").forEach(function(title, i){
title.setAttribute("collapse-status", "show");
});
} else {
obj.setAttribute("collapse-status", "hide");
obj.querySelector(".expandAllText").innerHTML = "Expand All";
obj.parentNode.querySelectorAll("div[collapse] span[id$='Icon']").forEach(function(icon, i){
icon.classList.remove('CloseIcon');
icon.classList.add('OpenIcon');
});
obj.parentNode.querySelectorAll("div[collapse-content]").forEach(function(itinerary, i){
slideUp(itinerary);
});
obj.parentNode.querySelectorAll("div[collapse]").forEach(function(title, i){
title.setAttribute("collapse-status", "hide");
});
}
}
function slideUp(target, duration) {
duration = duration ? duration : 500;
target.style.transitionProperty = 'height, margin, padding';
target.style.transitionDuration = duration + 'ms';
target.style.boxSizing = 'border-box';
target.style.height = target.offsetHeight + 'px';
target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
window.setTimeout(() => {
target.style.display = 'none';
target.style.removeProperty('height');
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
function slideDown(target, duration) {
duration = duration ? duration : 500;
target.style.removeProperty('display');
let display = window.getComputedStyle(target).display;
if (display === 'none')
display = 'block';
target.style.display = display;
let height = target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
target.offsetHeight;
target.style.boxSizing = 'border-box';
target.style.transitionProperty = "height, margin, padding";
target.style.transitionDuration = duration + 'ms';
target.style.height = height + 'px';
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
window.setTimeout(() => {
target.style.removeProperty('height');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
</script>
<style> <style>
.date_select {width: 27.5% !important; margin-bottom: 10px;} .date_select {width: 27.5% !important; margin-bottom: 10px;}
.age_range { margin-top: 45px;} .age_range { margin-top: 45px;}

345
application/views/mobile_first/ch-info-page-form.php
Unescape Escape View File

@ -1,12 +1,18 @@
<div class="tmbottom"> <div class="tripnotes" collapse="" collapse-status="hide" data-target="tripnotes" data-target-icon="day4Icon" style="font-size: 25px;
<p style="padding: 15px 15px 30px 15px;">Start planning your tailor-made tour now. Your 1:1 travel consultant will reply within 1 working day.</p> color: #ad1818;
font-weight: 600;
font-family: 'Goudy Old Style';">Click here to plan your tailor-made tour now. Your 1:1 travel consultant will reply within 1 working day.<span class="OpenIcon" id="day4Icon"></span></div>
<div class="tripnotescontent" collapse-content="" id="tripnotes" style="display: none; box-sizing: border-box;">
<div class="tmbottom" style="padding-top: 60px; margin-top: 0;">
<form action="https://www.chinahighlights.com/secureforms/qi_save" id="quick_inquiry_form" method="post" <form action="https://www.chinahighlights.com/secureforms/qi_save" id="quick_inquiry_form" method="post"
name="quick_inquiry_form" novalidate=""> name="quick_inquiry_form" novalidate="">
<div class="InquiryBox"> <div class="InquiryBox">
<textarea id="form_additionalrequirements" name="additional_requirements" <textarea id="form_additionalrequirements" name="additional_requirements"
placeholder="Tell us your travel requirements here: anniversary, honeymoon, family trip, birthday travel, beach, food... (optional)"></textarea> placeholder="Tell us your travel requirements here: anniversary, honeymoon, family trip, birthday travel, beach, food... (optional)"></textarea>
<div class="selectionBlock"> <div class="selectionBlock">
<p style=" text-align: left; font-weight: 400;"> <p style=" text-align: left; font-weight: 400; padding-bottom: 0;">
Number in your group Number in your group
</p> </p>
<div id="group_error_msg" style="display: none"> <div id="group_error_msg" style="display: none">
@ -38,12 +44,7 @@
</div> </div>
<div id="adultBlock" style="display: none"> <div id="adultBlock" style="display: none">
<p style="
margin-bottom: -25px;
font-size: 22px;
margin-top: 80px;
text-align: left;
">When you plan to take the trip:</p>
<div class="peopleSelect"> <div class="peopleSelect">
<p style=" margin-top: 20px; <p style=" margin-top: 20px;
text-align: left; text-align: left;
@ -140,6 +141,61 @@ margin-bottom: -25px;
</div> </div>
</div> </div>
<div class="selectionBlock" style="margin-bottom: 10px;">
<p style="text-align: left; font-weight: 400; padding-bottom: 0;">
When would you travel?
</p>
<div id="date_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Select your travel data.</div>
</div>
<div class="travel_group date_select" >
<input type="radio" value="exact travel dates" id="exact" name="trip_date">
<label for="exact" class="updatedestination" style="font-size: 18px;">
Exact travel dates
</label>
</div>
<div class="travel_group date_select" >
<input type="radio" value="approximate travel dates" id="approximate" name="trip_date">
<label for="approximate" class="updatedestination" style="font-size: 18px;">
Approximate travel dates
</label>
</div>
<div class="travel_group date_select" >
<input type="radio" value="haven't decided travel dates" id="yet" name="trip_date">
<label for="yet" class="updatedestination" style="font-size: 18px;">
Not decided travel dates
</label>
</div>
<div class="trip_date_length" id="tripDateBlock" style="display: none">
<p style="text-align: left; font-weight: 400; font-size: 19px;">Select your travel date and trip length (days).</p>
<div id='dateSelectionBlock'>
<div id='flatpickrBlock'>
<input type="text" class="arrivalDate datepicker" id="starting_date" name="date_start" value="" placeholder="mm/dd/yyyy" autocomplete="off" style="width: auto;
float: left;
margin-right: 15px;
border-radius: 6px;
padding: 0 15px;">
</div>
<input type="month" id="expectedMonth" name="expected_month" placeholder="Select your expected travel date." style="width: auto;
float: left;
margin-right: 15px;
border-radius: 6px;
padding: 0 15px;
margin-bottom:15px;">
</div>
<div class="peopleSelect">
<div class="numberBtn">
<input class="minaddBtn" id="tripLengthMinus" type="button" value="-">
<input class="number" type="text" value="14" id="tripLengthNumber" name="trip_length" style="margin-right: 5px;">
<input class="minaddBtn" id="tripLengthPlus" type="button" value="+">
</div>
</div>
</div>
</div>
<p> <p>
<span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/input-name.png"> <span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/input-name.png">
<span class="form_required">*</span> <span class="form_required">*</span>
@ -155,13 +211,13 @@ margin-bottom: -25px;
<span id="email_errmsg" style="display: none"><span class="requiredArea">Please enter your email.</span></span> <span id="email_errmsg" style="display: none"><span class="requiredArea">Please enter your email.</span></span>
<span id="email_verify_errmsg" style="display: none"><span class="requiredArea">Please verify your email.</span></span> <span id="email_verify_errmsg" style="display: none"><span class="requiredArea">Please verify your email.</span></span>
</p> </p>
<p> <!-- <p>
<span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/top10/tour-calendar.png"> <span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/top10/tour-calendar.png">
<span class="form_required">*</span></span> <span class="form_required">*</span></span>
<input class="InquiryCalendar" data-min-date="7" id="starting_date" <input class="InquiryCalendar" data-min-date="7" id="starting_date"
name="date_start" placeholder="Starting date" readonly="readonly" name="date_start" placeholder="Starting date" readonly="readonly"
type="text"/><span id="starting_date_errmsg" style="display: none"><span type="text"/><span id="starting_date_errmsg" style="display: none"><span
class="requiredArea">Please enter your starting date.</span></span></p> class="requiredArea">Please enter your starting date.</span></span></p>-->
<p> <p>
<select name="country_code" class="country_code"> <select name="country_code" class="country_code">
<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>
@ -438,41 +494,93 @@ margin-bottom: -25px;
</div> </div>
</div> </div>
--> -->
</div>
</div> </div>
<script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script> <script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script>
<script src="https://data.chinahighlights.com/js/min.php?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script> <script src="https://data.asiahighlights.com/min/?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script>
<script> <script>
var selectedExpectedDate = '';
document.addEventListener('DOMContentLoaded', () => {
flatpickr("#starting_date", {
dateFormat: "Y-m-d",
altInput: true,
altFormat: "F j, Y",
disableMobile: true,
minDate: "today"
});
var quick_inquiry_button = document.getElementById("quick_inquiry_button");
var quick_inquiry_form = document.getElementById("quick_inquiry_form");
quick_inquiry_button.addEventListener('click', function(event) {
var validateResult = validateQuickInquiryForm();
if (validateResult) {
if (typeof(grecaptcha) === "undefined") {
console.warn('grecaptcha is disabled.');
quick_inquiry_form.submit();
} else {
grecaptcha.enterprise.ready(async () => {
const token = await grecaptcha.enterprise.execute('6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja', {action: 'ADD_TO_CART'});
var el = document.createElement("input");
el.type = "hidden";
el.name = "__grecaptcha_token__";
el.value = token;
quick_inquiry_form.appendChild(el);
quick_inquiry_form.submit();
quick_inquiry_button.innerText = "Submitted successfully";
});
}
}
});
});
function validateQuickInquiryForm() { function validateQuickInquiryForm() {
var result = true; var result = true;
var realnameVal = document.getElementById("realname").value; var realnameVal = document.getElementById("realname").value;
var emailVal = document.getElementById("email").value; var emailVal = document.getElementById("email").value;
var startingDateVal = document.getElementById("starting_date").value; var expectedDateVal = document.getElementById("starting_date").value;
var phoneVal = document.getElementById("PhoneNo").value; var expectedMonthVal = document.getElementById("expectedMonth").value;
var contactVal = document.getElementById("PhoneNo").value;
var startingDateErrEl = document.getElementById("starting_date_errmsg");
var realnameErrEl = document.getElementById("realname_errmsg"); var realnameErrEl = document.getElementById("realname_errmsg");
var emailErrEl = document.getElementById("email_errmsg"); var emailErrEl = document.getElementById("email_errmsg");
var emailVerifyErrEl = document.getElementById("email_verify_errmsg"); var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
var phoneErrEl = document.getElementById("phone_errmsg"); var startingDateErrEl = document.getElementById("date_error_msg");
var travelGroupErrEl = document.getElementById("group_error_msg"); var contactErrEl = document.getElementById("phone_errmsg");
var groupErrEl = document.getElementById("group_error_msg");
if (realnameErrEl) realnameErrEl.style.display = 'none';
if (emailErrEl) emailErrEl.style.display = 'none'; realnameErrEl.style.display = 'none';
if (emailVerifyErrEl) emailVerifyErrEl.style.display = 'none'; emailErrEl.style.display = 'none';
if (startingDateErrEl) startingDateErrEl.style.display = 'none'; emailVerifyErrEl.style.display = 'none';
if (phoneErrEl) phoneErrEl.style.display = 'none'; startingDateErrEl.style.display = 'none';
if (travelGroupErrEl) travelGroupErrEl.style.display = 'none'; contactErrEl.style.display = 'none';
groupErrEl.style.display = 'none';
var travelGroupList = document.querySelectorAll('input[name="travel_group"]');
var travelGroupChecked = false; var travel_group_is_checked = false;
travelGroupList.forEach(function(groupNode) { document.querySelectorAll('input[name="travel_group"]').forEach(function(groupNode) {
if (groupNode.checked) { if (groupNode.checked) {
travelGroupChecked = true; travel_group_is_checked = true;
} }
}); });
if (!travelGroupChecked) { if (travel_group_is_checked === false) {
travelGroupErrEl.style.display = ''; groupErrEl.style.display = '';
result = false;
}
var tripDate_is_checked = false;
if (selectedExpectedDate === 'exact') {
tripDate_is_checked = expectedDateVal !== '';
} else if (selectedExpectedDate === 'approximate') {
tripDate_is_checked = expectedMonthVal !== '';
} else if (selectedExpectedDate === 'yet') {
tripDate_is_checked = true;
}
//时间选择
if (!tripDate_is_checked) {
startingDateErrEl.style.display = '';
result = false; result = false;
} }
@ -485,54 +593,17 @@ function validateQuickInquiryForm() {
result = false; result = false;
} else { } else {
var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/; var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
if (!emailPattern.test(emailVal) && emailVerifyErrEl) { if (!emailPattern.test(emailVal)) {
emailVerifyErrEl.style.display = ''; emailVerifyErrEl.style.display = '';
result = false; result = false;
} }
} }
if (startingDateVal === '') { if (contactVal === '') {
startingDateErrEl.style.display = ''; contactErrEl.style.display = '';
result = false;
}
if (phoneVal === '') {
phoneErrEl.style.display = '';
result = false; result = false;
} }
return result; return result;
} }
document.addEventListener('DOMContentLoaded', () => {
flatpickr("#starting_date", {
dateFormat: "Y-m-d",
altInput: true,
altFormat: "F j, Y",
disableMobile: true,
minDate: "today"
});
var quick_inquiry_form = document.getElementById('quick_inquiry_form');
var quick_inquiry_button = document.getElementById('quick_inquiry_button');
quick_inquiry_button.addEventListener('click', function(evt) {
if (validateQuickInquiryForm()) {
if (typeof(grecaptcha) === "undefined") {
console.warn('grecaptcha is disabled.');
quick_inquiry_form.submit();
} else {
grecaptcha.enterprise.ready(async () => {
const token = await grecaptcha.enterprise.execute('6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja', {action: 'ADD_TO_CART'});
var el = document.createElement("input");
el.type = "hidden";
el.name = "__grecaptcha_token__";
el.value = token;
quick_inquiry_form.appendChild(el);
quick_inquiry_form.submit();
quick_inquiry_form.innerText = "Submitted successfully";
});
}
}
});
});
</script> </script>
<script> <script>
@ -570,6 +641,34 @@ document.addEventListener('DOMContentLoaded', () => {
}) })
}); });
var $tripDateBlock = $('#tripDateBlock');
var $expectedMonth = $('#expectedMonth');
var $expectedDate = $('#starting_date');
var $dateSelectionBlock = $('#dateSelectionBlock');
var $flatpickrBlock = $('#flatpickrBlock');
$('input[name="trip_date"]').each((i, tripDateEle) => {
$(tripDateEle).click(function (e) {
$expectedDate.val('');
$expectedMonth.val('');
$tripDateBlock.show();
var selectedTripDate = e.currentTarget;
selectedExpectedDate = selectedTripDate.id;
if (selectedTripDate.id === 'exact') {
$dateSelectionBlock.show();
$expectedMonth.hide();
$flatpickrBlock.show();
} else if (selectedTripDate.id === 'approximate') {
$dateSelectionBlock.show();
$flatpickrBlock.hide();
$expectedMonth.show();
} else if (selectedTripDate.id === 'yet') {
$dateSelectionBlock.hide();
$flatpickrBlock.hide();
}
})
});
var tripLength = $('#tripLengthNumber').val();
//成人 //成人
$('#plusAdult').click(function () { $('#plusAdult').click(function () {
@ -615,5 +714,109 @@ document.addEventListener('DOMContentLoaded', () => {
$infantNumberInput.val(infantNumber); $infantNumberInput.val(infantNumber);
} }
}); });
// Trip Length
$('#tripLengthPlus').click(function () {
tripLength++;
$('#tripLengthNumber').val(tripLength);
});
$('#tripLengthMinus').click(function () {
if (tripLength > 1) {
tripLength--;
$('#tripLengthNumber').val(tripLength);
}
});
}) })
</script> </script>
<script>
// 折叠展开
document.querySelectorAll('div[collapse]').forEach(function ($collapseDiv, index) {
$collapseDiv.onclick = function (e) {
let collapseStatus = $collapseDiv.getAttribute('collapse-status');
let targetId = $collapseDiv.getAttribute("data-target");
let targetIconId = $collapseDiv.getAttribute("data-target-icon");
let $targetElement = document.getElementById(targetId);
let $targetIcon = document.getElementById(targetIconId);
if (collapseStatus == undefined || collapseStatus == "show") {
$targetIcon.classList.remove("CloseIcon");
$targetIcon.classList.add("OpenIcon");
$collapseDiv.setAttribute("collapse-status", "hide");
slideUp($targetElement);
} else {
$targetIcon.classList.remove("OpenIcon");
$targetIcon.classList.add("CloseIcon");
$collapseDiv.setAttribute("collapse-status", "show");
slideDown($targetElement);
}
}
});
function slideUp(target, duration) {
duration = duration ? duration : 500;
target.style.transitionProperty = 'height, margin, padding';
target.style.transitionDuration = duration + 'ms';
target.style.boxSizing = 'border-box';
target.style.height = target.offsetHeight + 'px';
target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
window.setTimeout(() => {
target.style.display = 'none';
target.style.removeProperty('height');
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
function slideDown(target, duration) {
duration = duration ? duration : 500;
target.style.removeProperty('display');
let display = window.getComputedStyle(target).display;
if (display === 'none')
display = 'block';
target.style.display = display;
let height = target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
target.offsetHeight;
target.style.boxSizing = 'border-box';
target.style.transitionProperty = "height, margin, padding";
target.style.transitionDuration = duration + 'ms';
target.style.height = height + 'px';
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
window.setTimeout(() => {
target.style.removeProperty('height');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
</script>
<style>
.date_select {width: 27.5% !important; margin-bottom: 10px;}
.age_range { margin-top: 45px;}
input.arrivalDate {width: 95%; padding: 0 15px; border-radius: 6px; margin-bottom:15px;}
@media (max-width: 750px){
.date_select {width: 93% !important; margin-bottom: 0 !important;}
.age_range { margin-top: 0;}
}
</style>

75
application/views/mobile_first/ch-visa-free-tester.php
Unescape Escape View File

@ -596,6 +596,8 @@
<span id="departure_date_errmsg" style="display: none;"> <span id="departure_date_errmsg" style="display: none;">
<span class="requiredArea">Please select your departure date.</span> <span class="requiredArea">Please select your departure date.</span>
</span> </span>
<p style="font-weight: 400; <p style="font-weight: 400;
font-size: 20px; font-size: 20px;
text-align: left; text-align: left;
@ -607,7 +609,7 @@
height: 40px;"> height: 40px;">
<option data-qualify="enable" value="United States ">United States</option> <option data-qualify="enable" value="United States ">United States</option>
<option data-qualify="enable" value="United Kingdom ">United Kingdom</option> <option data-qualify="enable" value="United Kingdom ">United Kingdom</option>
<option value="Australia ">Australia</option> <option data-qualify="enable" value="Australia ">Australia</option>
<option data-qualify="enable" value="Canada ">Canada</option> <option data-qualify="enable" value="Canada ">Canada</option>
<option data-qualify="enable" value="France ">France</option> <option data-qualify="enable" value="France ">France</option>
<option data-qualify="enable" value="Germany ">Germany</option> <option data-qualify="enable" value="Germany ">Germany</option>
@ -625,7 +627,7 @@
<option value="Antigua and Barbuda ">Antigua and Barbuda</option> <option value="Antigua and Barbuda ">Antigua and Barbuda</option>
<option data-qualify="enable" value="Argentina ">Argentina</option> <option data-qualify="enable" value="Argentina ">Argentina</option>
<option value="Armenia ">Armenia </option> <option value="Armenia ">Armenia </option>
<option value="Aruba ">Aruba297</option> <option value="Aruba ">Aruba</option>
<option value="Ascension Island ">Ascension Island</option> <option value="Ascension Island ">Ascension Island</option>
<option data-qualify="enable" value="Australia ">Australia</option> <option data-qualify="enable" value="Australia ">Australia</option>
<option data-qualify="enable" value="Austria ">Austria</option> <option data-qualify="enable" value="Austria ">Austria</option>
@ -642,11 +644,11 @@
<option value="Bhutan ">Bhutan</option> <option value="Bhutan ">Bhutan</option>
<option value="Bolivia ">Bolivia</option> <option value="Bolivia ">Bolivia</option>
<option data-qualify="enable" value="Bosnia and Herzegovina ">Bosnia and Herzegovina</option> <option data-qualify="enable" value="Bosnia and Herzegovina ">Bosnia and Herzegovina</option>
<option value="Botswana ">Botswana267</option> <option value="Botswana ">Botswana</option>
<option data-qualify="enable" value="Brazil ">Brazil55</option> <option data-qualify="enable" value="Brazil ">Brazil</option>
<option value="British Indian Ocean Territory ">British Indian Ocean Territory</option> <option value="British Indian Ocean Territory ">British Indian Ocean Territory</option>
<option value="British Virgin Islands ">British Virgin Islands</option> <option value="British Virgin Islands ">British Virgin Islands</option>
<option value="Brunei ">Brunei</option> <option data-qualify="enable" value="Brunei ">Brunei</option>
<option data-qualify="enable" value="Bulgaria ">Bulgaria</option> <option data-qualify="enable" value="Bulgaria ">Bulgaria</option>
<option value="Burkina Faso ">Burkina Faso</option> <option value="Burkina Faso ">Burkina Faso</option>
<option value="Burundi">Burundi</option> <option value="Burundi">Burundi</option>
@ -724,7 +726,7 @@
<option data-qualify="enable" value="Italy ">Italy</option> <option data-qualify="enable" value="Italy ">Italy</option>
<option value="Jamaica ">Jamaica</option> <option value="Jamaica ">Jamaica</option>
<option data-qualify="enable" value="Japan ">Japan</option> <option data-qualify="enable" value="Japan ">Japan</option>
<option value="Jersey ">Jersey4</option> <option value="Jersey ">Jersey</option>
<option value="Jordan ">Jordan</option> <option value="Jordan ">Jordan</option>
<option value="Kazakhstan ">Kazakhstan</option> <option value="Kazakhstan ">Kazakhstan</option>
<option value="Kenya ">Kenya</option> <option value="Kenya ">Kenya</option>
@ -766,6 +768,7 @@
<option value="Myanmar ">Myanmar5</option> <option value="Myanmar ">Myanmar5</option>
<option value="Namibia ">Namibia</option> <option value="Namibia ">Namibia</option>
<option value="Nauru ">Nauru</option> <option value="Nauru ">Nauru</option>
<option data-qualify="enable" value="Netherlands ">Netherlands</option>
<option value="Nepal ">Nepal</option> <option value="Nepal ">Nepal</option>
<option value="New Caledonia ">New Caledonia</option> <option value="New Caledonia ">New Caledonia</option>
<option data-qualify="enable" value="New Zealand ">New Zealand</option> <option data-qualify="enable" value="New Zealand ">New Zealand</option>
@ -789,7 +792,7 @@
<option data-qualify="enable" value="Poland ">Poland</option> <option data-qualify="enable" value="Poland ">Poland</option>
<option data-qualify="enable" value="Portugal ">Portugal</option> <option data-qualify="enable" value="Portugal ">Portugal</option>
<option value="Puerto Rico ">Puerto Rico</option> <option value="Puerto Rico ">Puerto Rico</option>
<option value="Qatar ">Qatar</option> <option data-qualify="enable" value="Qatar ">Qatar</option>
<option value="Réunion ">Réunion</option> <option value="Réunion ">Réunion</option>
<option data-qualify="enable" value="Romania ">Romania</option> <option data-qualify="enable" value="Romania ">Romania</option>
<option data-qualify="enable" value="Russia ">Russia</option> <option data-qualify="enable" value="Russia ">Russia</option>
@ -843,7 +846,7 @@
<option value="U.S. Virgin Islands ">U.S. Virgin Islands</option> <option value="U.S. Virgin Islands ">U.S. Virgin Islands</option>
<option value="Uganda ">Uganda</option> <option value="Uganda ">Uganda</option>
<option data-qualify="enable" value="Ukraine ">Ukraine</option> <option data-qualify="enable" value="Ukraine ">Ukraine</option>
<option value="United Arab Emirates ">United Arab Emirates</option> <option data-qualify="enable" value="United Arab Emirates ">United Arab Emirates</option>
<option data-qualify="enable" value="United Kingdom ">United Kingdom</option> <option data-qualify="enable" value="United Kingdom ">United Kingdom</option>
<option data-qualify="enable" value="United States ">United States</option> <option data-qualify="enable" value="United States ">United States</option>
<option value="Uruguay ">Uruguay</option> <option value="Uruguay ">Uruguay</option>
@ -885,6 +888,7 @@
<div id="reason_box" style="display: none; padding: 0 20px; text-align: left; font-size: 19px; font-weight: 400;"> <div id="reason_box" style="display: none; padding: 0 20px; text-align: left; font-size: 19px; font-weight: 400;">
<p>Reason you don't qualify:</p> <p>Reason you don't qualify:</p>
<ul class="infolist"> <ul class="infolist">
<li id="error_transit" style="display: none">You must be in transit to a third country or region.</li> <li id="error_transit" style="display: none">You must be in transit to a third country or region.</li>
<li id="error_72hours" style="display: none">You must leave the city area (prefecture or municipality) after the 72/144 hours (the 72/144-hour limit is calculated starting from 00:00 on the day after arrival, i.e. 24:00 on the arrival date).</li> <li id="error_72hours" style="display: none">You must leave the city area (prefecture or municipality) after the 72/144 hours (the 72/144-hour limit is calculated starting from 00:00 on the day after arrival, i.e. 24:00 on the arrival date).</li>
<!--<li id="error_3months" style="display: none">Your passport must be valid for more than 3 months at the time of entry into China.</li>--> <!--<li id="error_3months" style="display: none">Your passport must be valid for more than 3 months at the time of entry into China.</li>-->
@ -895,9 +899,10 @@
</div> </div>
<p id="tip_box" style="display: none; padding:0 20px; text-align: left; font-weight: 400; font-size: 19px;"> <p id="tip_box" style="display: none; padding:0 20px; text-align: left; font-weight: 400; font-size: 19px;">
<strong >Important notes:</strong> <br> <strong >Important notes:</strong> <br>
Your passport must be valid for more than 3 months at the time of entry into China. <br> 1. You are only allowed to remain within and depart China from <span id="allowed_area" style="font-weight:600;">Beijing</span>.<br>
You dont't have Chinese visa refusal stamps in your passport.<br> 2. Your passport must be valid for <strong>more than 3 months</strong> at the time of entry into China. <br>
Please bring your China hotel reservation in case it is needed at the time of entry into China. 3. You dont't have Chinese visa refusal stamps in your passport.<br>
4. Please bring your <strong>China hotel reservation</strong> in case it is needed at the time of entry into China.
<br> <br>
<br> <br>
More questions please feel free to <a href="/contactus/">contact us</a>. More questions please feel free to <a href="/contactus/">contact us</a>.
@ -972,6 +977,10 @@ ready(el => {
const qualify_144hours = el('qualify_144hours'); const qualify_144hours = el('qualify_144hours');
const qualify_no = el('qualify_no'); const qualify_no = el('qualify_no');
const arriveAtCitySelect = el('arrive_at_city');
const allowedAreaSpan = el('allowed_area');
let selectedCity = arriveAtCitySelect.options[arriveAtCitySelect.selectedIndex].value;
const departure_date_errmsg = el('departure_date_errmsg'); const departure_date_errmsg = el('departure_date_errmsg');
const arrival_date_errmsg = el('arrival_date_errmsg'); const arrival_date_errmsg = el('arrival_date_errmsg');
@ -1085,10 +1094,36 @@ ready(el => {
], ],
]); ]);
const arriveAtCitySelect = el('arrive_at_city'); // Chengdu: Chengdu 72小时
// Chengdu: Sichuan Province 144小时
const cityProvinceMap = new Map([
['Beijing', 'Beijing, Tianjin, Hebei Province'],
['Shanghai', 'Shanghai, Jiangsu Province, Zhejiang Province'],
['Hangzhou', 'Shanghai, Jiangsu Province, Zhejiang Province'],
['Shenyang', 'Liaoning Province'],
['Dalian', 'Liaoning Province'],
['Ningbo', 'Shanghai, Jiangsu Province, Zhejiang Province'],
['Nanjing', 'Shanghai, Jiangsu Province, Zhejiang Province'],
['Qinhuangdao', 'Beijing, Tianjin, Hebei Province'],
['Shijiazhuang', 'Beijing, Tianjin, Hebei Province'],
['Tianjin', 'Beijing, Tianjin, Hebei Province'],
['Changsha', 'Hunan Province'],
['Harbin', 'Harbin'],
['Wuhan', 'Wuhan'],
['Xiamen', 'Xiamen'],
['Qingdao', 'Shandong Province'],
['Kunming', 'Kunming'],
["Xi'an", "Xi'an, Xianyang"],
['Guilin', 'Guilin'],
['Chongqing', 'Chongqing'],
['Jieyang', 'Guangdong province'],
['Shenzhen', 'Guangdong province'],
['Guangzhou', 'Guangdong province'],
]);
const airportSelect = el('airport_or_railway_station'); const airportSelect = el('airport_or_railway_station');
arriveAtCitySelect.on('change', () => { arriveAtCitySelect.on('change', () => {
const selectedCity = arriveAtCitySelect.options[arriveAtCitySelect.selectedIndex].value; selectedCity = arriveAtCitySelect.options[arriveAtCitySelect.selectedIndex].value;
const airportList = cityAirportMap.get(selectedCity) const airportList = cityAirportMap.get(selectedCity)
airportSelect.options.length = 0; airportSelect.options.length = 0;
airportList.forEach(element => { airportList.forEach(element => {
@ -1096,7 +1131,6 @@ ready(el => {
opt.setAttribute('data-hour', element.hour); opt.setAttribute('data-hour', element.hour);
airportSelect.options.add(opt); airportSelect.options.add(opt);
}); });
}); });
takeATestButton.on('click', () => { takeATestButton.on('click', () => {
@ -1169,12 +1203,25 @@ ready(el => {
tip_box.show(); tip_box.show();
reason_box.hide(); reason_box.hide();
const allowedArea = cityProvinceMap.get(selectedCity);
if (allowedArea != null && allowedArea != 'Chengdu') {
allowedAreaSpan.innerText = allowedArea;
}
if (visa72hours) { if (visa72hours) {
qualify_72hours.show(); qualify_72hours.show();
if (selectedCity == 'Chengdu') {
allowedAreaSpan.innerText = 'Chengdu';
}
} }
if (visa144hours) { if (visa144hours) {
qualify_144hours.show(); qualify_144hours.show();
if (selectedCity == 'Chengdu') {
allowedAreaSpan.innerText = 'Sichuan Province';
}
} }
} else { } else {
tip_box.hide(); tip_box.hide();

549
application/views/mobile_first/gh-info-page-form.php
Unescape Escape View File

@ -1,3 +1,8 @@
<div class="tripnotes" collapse="" collapse-status="hide" data-target="tripnotes" data-target-icon="day4Icon" style="font-size: 25px;
color: #ad1818;
font-weight: 600;
font-family: 'Goudy Old Style';">Click here to plan your tailor-made tour now. Your 1:1 travel consultant will reply within 1 working day.<span class="OpenIcon" id="day4Icon"></span></div>
<div class="tripnotescontent" collapse-content="" id="tripnotes" style="display: none; box-sizing: border-box;">
<div class="info_page_inquiry"> <div class="info_page_inquiry">
<!-- <div class="contactwechat"> <!-- <div class="contactwechat">
<img alt="global highlights' wechat code" height="100px" src="https://data.globalhighlights.com/image/aboutus/gh-whatsapp-qr-code.jpg" width="100px"> <img alt="global highlights' wechat code" height="100px" src="https://data.globalhighlights.com/image/aboutus/gh-whatsapp-qr-code.jpg" width="100px">
@ -5,20 +10,202 @@
Email: contact@globalhighlights.com Email: contact@globalhighlights.com
</div> </div>
</div>--> </div>-->
<p class="contactus">Send an inquiry below:</p>
<form action="/forms/inquiry_save" id="info_page_form" method="post"> <form action="/forms/inquiry_save" id="info_page_form" method="post">
<div class="InquiryFormBox"> <div class="InquiryFormBox">
<div class="FieldSet"> <div class="FieldSet">
<p><textarea id="additionalrequirements" name="additional_requirements" <textarea id="additionalrequirements" name="additional_requirements"
placeholder="Anniversary, honeymoon, family trip, birthday travel, beach, food..." style="margin-bottom:20px;"></textarea></p> placeholder="Anniversary, honeymoon, family trip, birthday travel, beach, food..." style="margin-bottom:20px;"></textarea>
<p><input class="FullName" data-required="Please enter your fullname" id="realname" name="name" <div class="selectionBlock" style="margin-bottom: 0;">
placeholder="Your name" required="" type="text"></p> <p style="
<p><input class="EmailAddress" data-required="Please enter your e-mail address" margin-bottom: 0px;
data-pattern="Expecting an e-mail address" id="email" name="email" pattern="^[\w\-\.]+@[\w\-\.]+(\.\w+)+$" ">
placeholder="Email" required type="text"></p> <strong>Number in your group</strong>
<p><input class="InquiryCalendar" data-min-date="7" id="starting_date" name="date_start" </p>
placeholder="Starting date" required type="date"></p> <div id="group_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Please select number in your group.</div>
</div>
<div class="travel_group">
<input type="radio" value="Family" id="Family" name="travel_group">
<label for="Family" class="family">
Family
</label>
</div>
<div class="travel_group">
<input type="radio" value="Couple" id="Couple" name="travel_group">
<label for="Couple" class="couple">
Couple
</label>
</div>
<div class="travel_group">
<input type="radio" value="Solo" id="Solo" name="travel_group">
<label for="Solo" class="solo">
Solo
</label>
</div>
<div class="travel_group">
<input type="radio" value="group" id="Other" name="travel_group">
<label for="Other" class="group">
Other group
</label>
</div>
<div id="adultBlock" style="display: none">
<div class="peopleSelect">
<p style=" margin-top: 10px;
margin-bottom: 10px;"><strong>
Adults (≥18 years old)
</strong> </p>
<button class="minaddBtn reduceadult" id="minusAdult" type="button"
value="-">-</button>
<input class="number" type="text" value="2" id="adultNumber" name="adult">
<button class="minaddBtn addadult" type="button" id="plusAdult" value="+">+</button>
</div>
<div class="age_range">
<p> <p>
Adults' ages
</p>
<div class="checkYes" style="float:left; width: auto; margin-right: 30px;">
<label for="65+">
<input type="checkbox" value="yes" name="age_65_plus" id="65+" class="checkBorder" >65+
</label>
</div>
<div class="checkYes" style="float:left; width: auto; margin-right: 30px;">
<label for="51-64">
<input type="checkbox" value="yes" name="age_51_64" id="51-64" class="checkBorder" >51-64
</label>
</div>
<div class="checkYes" style="float:left; width: auto; margin-right: 30px;">
<label for="41-50">
<input type="checkbox" value="yes" name="age_41_50" id="41-50" class="checkBorder" >41-50
</label>
</div>
<div class="checkYes" style="float:left; width: auto; margin-right: 30px;">
<label for="31-40">
<input type="checkbox" value="yes" name="age_31_40" id="31-40" class="checkBorder" >31-40
</label>
</div>
<div class="checkYes" style="float:left; width: auto; margin-right: 30px;">
<label for="18-30">
<input type="checkbox" value="yes" name="age_18_30" id="18-30" class="checkBorder" >18-30
</label>
</div>
</div>
</div>
<div class="clear"></div>
<div id="childrenBlock" style="display: none">
<p style=" margin-bottom: 0;"><strong>Children (age of children at time of trip)</strong></p>
<div class="kids_age">
<p style="margin-bottom: 5px;">10-17 yrs old</p>
<select class="kids_number" id="teenagerNumber" name="teenager_10_17_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">3-9 yrs old</p>
<select class="kids_number" id="childrenNumber" name="children_3_9_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">0-2 yrs old</p>
<select class="kids_number" id="infantNumber" name="infant_0_2_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
</div>
</div>
<div class="selectionBlock" style="margin-bottom: 10px;">
<p style=" margin-top: 10px;
margin-bottom: 0;"><strong>
When would you travel?
</strong></p>
<div id="date_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Select your travel data.</div>
</div>
<div class="travel_group date_select" >
<input type="radio" value="exact travel dates" id="exact" name="trip_date">
<label for="exact" class="updatedestination" style="font-size: 18px;">
Exact travel dates
</label>
</div>
<div class="travel_group date_select" >
<input type="radio" value="approximate travel dates" id="approximate" name="trip_date">
<label for="approximate" class="updatedestination" style="font-size: 18px;">
Approximate travel dates
</label>
</div>
<div class="travel_group date_select" >
<input type="radio" value="haven't decided travel dates" id="yet" name="trip_date">
<label for="yet" class="updatedestination" style="font-size: 18px;">
Not decided travel dates
</label>
</div>
<div class="trip_date_length" id="tripDateBlock" style="display: none">
<p style="margin-bottom: 10px;">Select your travel date and trip length (days).</p>
<div id='dateSelectionBlock'>
<div id='flatpickrBlock'>
<input type="text" class="arrivalDate datepicker" id="starting_date" name="date_start" value="" placeholder="mm/dd/yyyy" autocomplete="off" style="width: auto; float: left; margin-right: 15px; height: 30px;
margin-top: 5px;">
</div>
<input type="month" id="expectedMonth" name="expected_month" placeholder="Select your expected travel date." style="width: auto; float: left; margin-right: 15px;height: 30px;
margin-top: 5px;">
</div>
<div class="peopleSelect">
<div class="numberBtn">
<input class="minaddBtn" id="tripLengthMinus" type="button" value="-">
<input class="number" type="text" value="14" id="tripLengthNumber" name="trip_length">
<input class="minaddBtn" id="tripLengthPlus" type="button" value="+">
</div>
</div>
</div>
</div>
<input class="FullName" data-required="Please enter your fullname" id="realname" name="name"
placeholder="Your name" required="" type="text">
<span id="realname_errmsg" style="display: none"><span class="requiredArea">Please enter your name.</span></span>
<input class="EmailAddress" data-required="Please enter your e-mail address"
data-pattern="Expecting an e-mail address" id="email" name="email" pattern="^[\w\-\.]+@[\w\-\.]+(\.\w+)+$"
placeholder="Email" required type="text">
<span id="email_errmsg" style="display: none"><span class="requiredArea">Please enter your email.</span></span>
<span id="email_verify_errmsg" style="display: none"><span class="requiredArea">Please verify your email.</span></span>
<!-- <p><input class="InquiryCalendar" data-min-date="7" id="starting_date" name="date_start"
placeholder="Starting date" required type="date"></p> -->
<select class="country_code" name="country_code"> <select class="country_code" name="country_code">
<option style="font-weight: 600;" value="United States +1">United States&nbsp; &nbsp;+1 <option style="font-weight: 600;" value="United States +1">United States&nbsp; &nbsp;+1
</option> </option>
@ -287,11 +474,16 @@
<option value="Åland Islands +385">Åland Islands&nbsp; &nbsp;+358</option> <option value="Åland Islands +385">Åland Islands&nbsp; &nbsp;+358</option>
</select> </select>
<input class="Inquiryphone" name="PhoneNo" placeholder="Phone or other ways to contact you (optional)" <input class="Inquiryphone" name="PhoneNo" placeholder="Phone or other ways to contact you (optional)"
type="text"> </p> type="text">
<p style="font-size: 17px;font-style:italic;line-height: 20px; color: #555;">Having a phone <span id="phone_errmsg" style="display: none"><span class="requiredArea">Please enter your phone number.</span></span>
<p style="font-size: 17px;font-style:italic;line-height: 20px; color: #555; margin-bottom: 5px;">Having a phone
number, especially with WhatsApp/iMessage capability will improve communication number, especially with WhatsApp/iMessage capability will improve communication
efficiency.</p> efficiency.</p>
<p style="margin-top: 0;margin-bottom: 10px;padding: 0;color: #000;font-size: 20px;">I prefer to <p style=" margin-bottom: 5px;
padding: 0;
color: #000;
font-size: 19px;
}">I prefer to
be contacted via:</p> be contacted via:</p>
<div class="checkYes" style="color:#000;"> <label for="contact whatsapp"><input <div class="checkYes" style="color:#000;"> <label for="contact whatsapp"><input
class="checkBorder mgr-primary" id="contact whatsapp" name="contact_via_WhatsApp" class="checkBorder mgr-primary" id="contact whatsapp" name="contact_via_WhatsApp"
@ -319,14 +511,329 @@
</div> </div>
</form> </form>
</div> </div>
</div>
<script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script>
<script src="https://data.asiahighlights.com/min/?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script>
<script>
var selectedExpectedDate = '';
document.addEventListener('DOMContentLoaded', () => {
flatpickr("#starting_date", {
dateFormat: "Y-m-d",
altInput: true,
altFormat: "F j, Y",
disableMobile: true,
minDate: "today"
});
var quick_inquiry_button = document.getElementById("info_page_form_btn");
var quick_inquiry_form = document.getElementById("info_page_form");
quick_inquiry_button.addEventListener('click', function(event) {
var validateResult = validateQuickInquiryForm();
if (validateResult) {
if (typeof(grecaptcha) === "undefined") {
console.warn('grecaptcha is disabled.');
quick_inquiry_form.submit();
} else {
grecaptcha.enterprise.ready(async () => {
const token = await grecaptcha.enterprise.execute('6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja', {action: 'ADD_TO_CART'});
var el = document.createElement("input");
el.type = "hidden";
el.name = "__grecaptcha_token__";
el.value = token;
quick_inquiry_form.appendChild(el);
quick_inquiry_form.submit();
quick_inquiry_button.innerText = "Submitted successfully";
});
}
}
});
});
function validateQuickInquiryForm() {
var result = true;
var realnameVal = document.getElementById("realname").value;
var emailVal = document.getElementById("email").value;
var expectedDateVal = document.getElementById("starting_date").value;
var expectedMonthVal = document.getElementById("expectedMonth").value;
var contactVal = document.getElementById("PhoneNo").value;
var realnameErrEl = document.getElementById("realname_errmsg");
var emailErrEl = document.getElementById("email_errmsg");
var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
var startingDateErrEl = document.getElementById("date_error_msg");
var contactErrEl = document.getElementById("phone_errmsg");
var groupErrEl = document.getElementById("group_error_msg");
realnameErrEl.style.display = 'none';
emailErrEl.style.display = 'none';
emailVerifyErrEl.style.display = 'none';
startingDateErrEl.style.display = 'none';
contactErrEl.style.display = 'none';
groupErrEl.style.display = 'none';
var travel_group_is_checked = false;
document.querySelectorAll('input[name="travel_group"]').forEach(function(groupNode) {
if (groupNode.checked) {
travel_group_is_checked = true;
}
});
if (travel_group_is_checked === false) {
groupErrEl.style.display = '';
result = false;
}
var tripDate_is_checked = false;
if (selectedExpectedDate === 'exact') {
tripDate_is_checked = expectedDateVal !== '';
} else if (selectedExpectedDate === 'approximate') {
tripDate_is_checked = expectedMonthVal !== '';
} else if (selectedExpectedDate === 'yet') {
tripDate_is_checked = true;
}
//时间选择
if (!tripDate_is_checked) {
startingDateErrEl.style.display = '';
result = false;
}
if (realnameVal === '') {
realnameErrEl.style.display = '';
result = false;
}
if (emailVal === '') {
emailErrEl.style.display = '';
result = false;
} else {
var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
if (!emailPattern.test(emailVal)) {
emailVerifyErrEl.style.display = '';
result = false;
}
}
if (contactVal === '') {
contactErrEl.style.display = '';
result = false;
}
return result;
}
</script>
<script>
$(function () {
var $adultBlock = $('#adultBlock');
var $childrenBlock = $('#childrenBlock');
var $adultNumberInput = $('#adultNumber');
var adultNumber = $adultNumberInput.val();
var $teenagerNumberInput = $('#teenagerNumber');
var teenagerNumber = $teenagerNumberInput.val();
var $childrenNumberInput = $('#childrenNumber');
var childrenNumber = $childrenNumberInput.val();
var $infantNumberInput = $('#infantNumber');
var infantNumber = $infantNumberInput.val();
$('input[name="travel_group"]').each((i, groupEle) => {
$(groupEle).click(function (e) {
$teenagerNumberInput.val(0);
$childrenNumberInput.val(0);
$infantNumberInput.val(0);
var currentTarget = e.currentTarget;
if (currentTarget.id === 'Family' || currentTarget.id === 'Other' ) {
$adultBlock.show();
$childrenBlock.show();
} else {
$adultBlock.show();
$childrenBlock.hide();
}
if (currentTarget.id === 'Couple') {
$adultNumberInput.val(2);
} else if (currentTarget.id === 'Solo') {
$adultNumberInput.val(1);
}
})
});
var $tripDateBlock = $('#tripDateBlock');
var $expectedDate = $('#starting_date');
var $expectedMonth = $('#expectedMonth');
var $dateSelectionBlock = $('#dateSelectionBlock');
var $flatpickrBlock = $('#flatpickrBlock');
$('input[name="trip_date"]').each((i, tripDateEle) => {
$(tripDateEle).click(function (e) {
$expectedDate.val('');
$expectedMonth.val('');
$tripDateBlock.show();
var selectedTripDate = e.currentTarget;
selectedExpectedDate = selectedTripDate.id;
if (selectedTripDate.id === 'exact') {
$dateSelectionBlock.show();
$expectedMonth.hide();
$flatpickrBlock.show();
} else if (selectedTripDate.id === 'approximate') {
$dateSelectionBlock.show();
$flatpickrBlock.hide();
$expectedMonth.show();
} else if (selectedTripDate.id === 'yet') {
$dateSelectionBlock.hide();
$flatpickrBlock.hide();
}
})
});
var tripLength = $('#tripLengthNumber').val();
//成人
$('#plusAdult').click(function () {
adultNumber++;
$adultNumberInput.val(adultNumber);
});
$('#minusAdult').click(function () {
if (adultNumber > 1) {
adultNumber--;
$adultNumberInput.val(adultNumber);
}
});
// 青少年
$('#plusTeenager').click(function () {
teenagerNumber++;
$teenagerNumberInput.val(teenagerNumber);
});
$('#minusTeenager').click(function () {
if (teenagerNumber > 0) {
teenagerNumber--;
$teenagerNumberInput.val(teenagerNumber);
}
});
// 儿童
$('#plusChildren').click(function () {
childrenNumber++;
$childrenNumberInput.val(childrenNumber);
});
$('#minusChildren').click(function () {
if (childrenNumber > 0) {
childrenNumber--;
$childrenNumberInput.val(childrenNumber);
}
});
// 婴儿
$('#plusInfant').click(function () {
infantNumber++;
$infantNumberInput.val(infantNumber);
});
$('#minusInfant').click(function () {
if (infantNumber > 0) {
infantNumber--;
$infantNumberInput.val(infantNumber);
}
});
// Trip Length
$('#tripLengthPlus').click(function () {
tripLength++;
$('#tripLengthNumber').val(tripLength);
});
$('#tripLengthMinus').click(function () {
if (tripLength > 1) {
tripLength--;
$('#tripLengthNumber').val(tripLength);
}
});
})
</script>
<script> <script>
(function () { // 折叠展开
var formEle = document.getElementById('info_page_form');
var submitBtn = document.getElementById('info_page_form_btn'); document.querySelectorAll('div[collapse]').forEach(function ($collapseDiv, index) {
formEle.addEventListener('submit', function(evt) { $collapseDiv.onclick = function (e) {
evt.preventDefault(); let collapseStatus = $collapseDiv.getAttribute('collapse-status');
formEle.submit(); let targetId = $collapseDiv.getAttribute("data-target");
submitBtn.innerText = "Submitted successfully"; let targetIconId = $collapseDiv.getAttribute("data-target-icon");
let $targetElement = document.getElementById(targetId);
let $targetIcon = document.getElementById(targetIconId);
if (collapseStatus == undefined || collapseStatus == "show") {
$targetIcon.classList.remove("CloseIcon");
$targetIcon.classList.add("OpenIcon");
$collapseDiv.setAttribute("collapse-status", "hide");
slideUp($targetElement);
} else {
$targetIcon.classList.remove("OpenIcon");
$targetIcon.classList.add("CloseIcon");
$collapseDiv.setAttribute("collapse-status", "show");
slideDown($targetElement);
}
}
}); });
})();
function slideUp(target, duration) {
duration = duration ? duration : 500;
target.style.transitionProperty = 'height, margin, padding';
target.style.transitionDuration = duration + 'ms';
target.style.boxSizing = 'border-box';
target.style.height = target.offsetHeight + 'px';
target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
window.setTimeout(() => {
target.style.display = 'none';
target.style.removeProperty('height');
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
function slideDown(target, duration) {
duration = duration ? duration : 500;
target.style.removeProperty('display');
let display = window.getComputedStyle(target).display;
if (display === 'none')
display = 'block';
target.style.display = display;
let height = target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
target.offsetHeight;
target.style.boxSizing = 'border-box';
target.style.transitionProperty = "height, margin, padding";
target.style.transitionDuration = duration + 'ms';
target.style.height = height + 'px';
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
window.setTimeout(() => {
target.style.removeProperty('height');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
</script> </script>
<style>
.date_select {width: 27.5% !important; margin-bottom: 10px;}
.age_range { margin-top: 45px;}
.InquiryFormBox input, textarea { margin-bottom: 15px;}
@media (max-width: 750px){
.date_select {width: 93% !important; margin-bottom: 0 !important;}
.age_range { margin-top: 0;}
}
</style>
Write Preview
Loading…
Cancel
Save