From ee6dd973bcc61238857e87ad07fcfa28d752a71e Mon Sep 17 00:00:00 2001
From: candice <candice@hainatravel.com>
Date: Thu, 25 May 2023 15:06:23 +0800
Subject: [PATCH] 11

---
 .../views/mobile_first/ah-info-page-form.php  | 134 +++++++++---------
 1 file changed, 70 insertions(+), 64 deletions(-)

diff --git a/application/views/mobile_first/ah-info-page-form.php b/application/views/mobile_first/ah-info-page-form.php
index 6399c78c..cf631bb2 100644
--- a/application/views/mobile_first/ah-info-page-form.php
+++ b/application/views/mobile_first/ah-info-page-form.php
@@ -139,42 +139,46 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
 
 		</div>
 
-        <div class="selectionBlock">
-            <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="family">
-                    I have 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="couple">
-                    I have 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="solo">
-                    I haven't decided my travel dates.
-                </label>
-            </div>
-            <div class="trip_date_length" id="tripDateBlock" style="display: none">
-                <p style="clear: both;margin-bottom: 10px;" id="trip_date_tip">Select your travel date.</p>
-                <div id="dateSelectionBlock">
-                  <div id='flatpickrBlock'>
-                    <input class="InquiryCalendar datepicker" id="starting_date" name="date_start" placeholder="Starting date *" readonly="readonly" type="text" value="" />
+                        <div class="selectionBlock">
+                            <p style="    margin-top: 10px;
+                            margin-bottom: 0;"><strong>
+                        When would you travel?
+                                </strong></p>
+                            <div class="checkboxLabel" >
+                                <input type="radio" value="exact travel dates" id="exact" name="trip_date">
+                                <label for="exact" class="updatedestination" style="font-size: 18px;">
+                                    I have exact travel dates.
+                                </label>
+                            </div>
+                            <div class="checkboxLabel" >
+                                <input type="radio" value="approximate travel dates" id="approximate" name="trip_date">
+                                <label for="approximate" class="updatedestination" style="font-size: 18px;">
+                                    I have approximate travel dates.
+                                </label>
+                            </div>
+                            <div class="checkboxLabel" >
+                                <input type="radio" value="haven't decided travel dates" id="yet" name="trip_date">
+                                <label for="yet" class="updatedestination" style="font-size: 18px;">
+                                    I haven't decided my travel dates.
+                                </label>
+                            </div>
+                            
+                <div class="trip_date_length" id="tripDateBlock" style="display: none">
+                              <p>Select your travel date and trip length (days).</p>
+                  <div id='dateSelectionBlock'>
+                  <input type="text" class="arrivalDate datepicker" id="Date_Start" name="date_start" value="" placeholder="mm/dd/yyyy" autocomplete="off">            
+                  <input type="month" id="expectedMonth" name="expected_month" placeholder="Select your expected travel date.">
                   </div>
-                    <input type="month" id="expectedMonth" name="expected_month" placeholder="Select your expected travel date.">
-                </div>
-            </div>
-        </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" id="realname" name="name" placeholder="Your name *" required="" type="text" value="" />
     <div id="realname_errmsg" style="display: none">
@@ -631,35 +635,37 @@ Our must-dos/must-sees are…" style="height:90px;"></textarea>
                 })
             });
     
-        var $tripDateBlock = $('#tripDateBlock');
-        var $expectedDate = $('#flatpickrBlock');
-        var $expectedMonth = $('#expectedMonth');
-        var $dateSelectionBlock = $('#dateSelectionBlock');
-        var $tripDateTip = $('#trip_date_tip');
-        
-        $('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();
-              $expectedDate.show();
-              $tripDateTip.show();
-            } else if (selectedTripDate.id === 'approximate') {
-              $dateSelectionBlock.show();
-              $expectedDate.hide();
-              $expectedMonth.show();
-              $tripDateTip.show();
-            } else if (selectedTripDate.id === 'yet') {
-              $dateSelectionBlock.hide();
-              $tripDateTip.hide();
-            }
-          })
-        });
+            var $tripDateBlock = $('#tripDateBlock');
+    var $expectedDate = $('#Date_Start');
+    var $expectedMonth = $('#expectedMonth');
+    var $dateSelectionBlock = $('#dateSelectionBlock');
+    var $expectedTravelDateBlock = $('#expectedTravelDateBlock');
+    var selectedExpectedDate = '';
+    $('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();
+          $expectedTravelDateBlock.hide();
+          $expectedMonth.hide();
+          $expectedDate.show();
+        } else if (selectedTripDate.id === 'approximate') {
+          $dateSelectionBlock.show();
+          $expectedTravelDateBlock.hide();
+          $expectedDate.hide();
+          $expectedMonth.show();
+        } else if (selectedTripDate.id === 'yet') {
+          $dateSelectionBlock.hide();
+          $expectedTravelDateBlock.show();
+        }
+      })
+    });
+
+		var tripLength = $('#tripLengthNumber').val();
     
     //成人
         $('#plusAdult').click(function () {