增加预算板块

application/views/orders/tailormademobile.php

@@ -890,6 +890,7 @@
     color: #ad1818;
     text-align: center;
     margin: 0 auto;}
+	.budget {font-size: 19px; margin-bottom: 10px;}
 	</style>
 </head>
 
@@ -980,34 +981,80 @@
 			</div>
 		</div>
 
+		<div id="inquiryBox">
+			<div class="selectionBlock">
+				<h3>Do you have a general idea of the budget for your tour?</h3>
+				<p>Asia Highlights is dedicated to providing a premium private guided tour service, including
+					hand-picked hotels, the must-sees and unique local experiences, a local English-speaking guide,
+					and a comfortable private vehicle with a driver. <br>
+					Our prices below are for a group of 2–6 people excluding pre- and post-tour flights:</p>
+				<div class="budget">
+					<label for="Mid-range">
+						<input type="radio" value="Mid-range: about US$250 per person per day (about US$500 in Japan)" name="budget_range" id="Mid-range"
+							class="checkBorder" style="margin-right: 10px;"><strong>Mid-range:</strong> about US$250 per person per day (about US$500 in Japan)</label>
+				</div>
+				<div class="budget">
+					<label for="Comfort">
+						<input type="radio" value="Comfort: about US$300 per person per day (about US$700 in Japan)" name="budget_range" id="Comfort"
+							class="checkBorder" style="margin-right: 10px;"><strong>Comfort:</strong> about US$300 per person per day (about US$700 in Japan)</label>
+				</div>
+				<div class="budget">
+					<label for="Standard">
+						<input type="radio" value="Standard: about US$200 per person per day (about US$400 in Japan)" name="budget_range" id="Standard"
+							class="checkBorder" style="margin-right: 10px;"><strong>Standard:</strong> about US$200 per person per day (about US$400 in Japan)</label>
+				</div>
+				<div class="budget">
+					<label for="higher">
+						<input type="radio" value="pay more for a higher level of travel service" name="budget_range" id="higher"
+							class="checkBorder" style="margin-right: 10px;">I'm willing to pay more for a higher level of travel service.</label>
+			<div id="budgetTipsBlock" style="display: none;">
+			  <span class="formNote">Please let us know your expectations, for example: I usually stay in hotels costing from US$xxx per room per night; I want to take business/first class flights...</span>
+			  <div class="inputTerm">
+				<input type="text" name="budget_expectation" required="" style="padding-top: 0; font-size: 17px;">
+			  </div>
+			</div>
+				</div>
+
+				<div class="budget">
+					<label for="specific">
+						<input type="radio" value="I don't have a specific budget in mind." name="budget_range" id="specific"
+							class="checkBorder" style="margin-right: 10px;">I don't have a specific budget in mind.</label>
+				</div>
+
+				<h4>Any additional information you'd like to share about your budget?</h4>
+				<textarea id="budget_requirements" name="budget_requirements" style="resize:none;"></textarea>
+			</div>
+		</div>
+
+
 		<div id="inquiryBox">
 			<div class="selectionBlock">
 				<h3 id="dateselect">
-					<em>*</em> When would you travel?
+					<em>*</em> What's your arrival date?
 				</h3>
 				<div id="date_error_msg" class="hidden">(Please fill out this field.)</div>
 				<div class="optionLable">
 
-					<input type="radio" value="exact travel dates" id="exact" name="trip_date">
+					<input type="radio" value="exact arrival date" id="exact" name="trip_date">
 					<label for="exact" style="height: 30px;">
 						<div class="selectionText">
-							Exact travel dates
+							Exact arrival date
 						</div>
 					</label>
 				</div>
 				<div class="optionLable">
-					<input type="radio" value="approximate travel dates" id="approximate" name="trip_date">
+					<input type="radio" value="approximate arrival date" id="approximate" name="trip_date">
 					<label for="approximate" style="height: 30px;">
 						<div class="selectionText">
-							Approximate travel dates
+							Approximate arrival date
 						</div>
 					</label>
 				</div>
 				<div class="optionLable">
-					<input type="radio" value="haven't decided travel dates" id="yet" name="trip_date">
+					<input type="radio" value="Undecided arrival date" id="yet" name="trip_date">
 					<label for="yet" style="height: 30px;">
 						<div class="selectionText">
-							Undecided travel dates
+							Undecided arrival date
 						</div>
 					</label>
 				</div>
@@ -1296,8 +1343,7 @@
 					2. Interested in spending a few nights in local boutique hotels, like floating houses in Southeast
 					3. Asia, ryokans in Japan, small villa with private pool…<br>
 					4. Adult-only hotels<br>
-				5. Hotel location: near city center/at the seaside/convenient for exploring the nearby area…<br>
+				5. Hotel location: near city center/at the seaside/convenient for exploring the nearby area…
-			6. My budget for the accomodation is…
 				</span>
 				<textarea id="hotel_requirements" name="hotel_requirements" style="resize:none;"
 					style="height: 70px;"></textarea>
@@ -1306,14 +1352,7 @@
 		<div id="inquiryBox">
 			<div class="selectionBlock">
 				<h3>This is a big trip for:</h3>
-				<div class="travelStyle" id="trip4Bucket">
+
-					<input type="checkbox" value="Bucket list trip" id="bucket list trip" name="interests[]">
-					<label for="bucket list trip" data-clickable>
-						<div class="smallTag">
-							<div class="styleText">Bucket list trip</div>
-						</div>
-					</label>
-				</div>
 				<div class="travelStyle" id="trip4Retirement">
 					<input type="checkbox" value="Enjoying retirement" id="enjoying retirement" name="interests[]">
 					<label for="enjoying retirement" data-clickable>
@@ -1338,14 +1377,7 @@
 						</div>
 					</label>
 				</div>
-				<div class="travelStyle" id="trip4Work">
+
-					<input type="checkbox" value="Career break" id="break" name="interests[]">
-					<label for="break" data-clickable>
-						<div class="smallTag">
-							<div class="styleText">Career break</div>
-						</div>
-					</label>
-				</div>
 				<div class="travelStyle" id="trip4Birthday">
 					<input type="checkbox" value="Birthday" id="Birthday" name="interests[]">
 					<label for="Birthday" data-clickable>
@@ -1407,11 +1439,11 @@
 					<em>*</em> Any additional information you'd like to share about your trip?
 				</h3>
 				<div id="requirement_error_msg" class="hidden">(Please specify your requests.)</div>
-				<span class="formNote">E.g.: 1. My budget range for this big trip is around…
+				<span class="formNote">E.g.: <br>
-					<br>2. This is a big trip for my husband's birthday, our 20-year anniversary, honeymoon, retirement,
+					<br>1. This is a big trip for my husband's birthday, our 20-year anniversary, honeymoon, retirement,
 					kid's graduation, bucket list…
-					<br>3. Our must-dos/must-sees for this big trip are…
+					<br>2. Our must-dos/must-sees for this big trip are…
-					<br>4. This will be my first/second/… visit to…</span>
+					<br>3. This will be my first/second/… visit to…</span>
 				<textarea id="additionalrequirements" name="additional_requirements" style="resize:none;"></textarea>
 
 			</div>
@@ -1887,6 +1919,17 @@ margin-right: 10px;
 		var $teenagerNumberInput = $('#teenagerNumber');
 		var $childrenNumberInput = $('#childrenNumber');
 		var $infantNumberInput = $('#infantNumber');
+		var budgetTipsBlock = $('#budgetTipsBlock');
+
+		$('input[name="budget_range"]').each((i, budgetEle) => {
+			$(budgetEle).click(function (e) {
+				var currentTarget = e.currentTarget;
+        if (currentTarget.id === 'higher') {
+          const noMatter = currentTarget.checked ? budgetTipsBlock.show() : budgetTipsBlock.hide();
+        }
+			})
+		});
+
 		$('input[name="travel_group"]').each((i, groupEle) => {
 			$(groupEle).click(function (e) {