syuanyuri
/
ChangQing


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
							<!DOCTYPE html>
<html lang="en">

<head>
  {{ partial "head.html" . }}
  <!-- <script
  src="https://code.jquery.com/jquery-3.3.1.js"
  integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
  crossorigin="anonymous"></script> -->
</head>

<body>
  {{ partial "nav.html" . }}

  <div class="container contact-form">
    <!-- <form
    id="myForm"
      action="https://script.google.com/a/macros/choozmo.com/s/AKfycbyUnjyXnSfzueA_RGbfLUphh1f7qv1RBzNvLLBErhB-zBcxEBYacQx2M9KEbavB5HNT/exec"
      method="get">
      <span>姓名：</span><input type="text" name="name" placeholder="姓名" /><br />
      <span>年齡：</span><input type="text" name="age" placeholder="年齡" /><br />
      <input type="submit" value="確認送出" />
    </form> -->

    <!-- <div>
      <span>您的大名：</span><input id="nameValue" type="text">
    </div>
    <div>
      <span>您的電話：</span><input id="phoneValue" type="text">
    </div>
    <div>
      <span>您的需求：</span><input id="demandValue" type="text">
    </div>
    <button>送出</button> -->
    <h2>客服聯絡表單</h2>
    <span class="line"></span>

    <div class="row">
      <div class="col-6">
        <form class="row g-3">
          <div class="col-12">
            <label for="nameValue" class="form-label">姓名</label>
            <input type="text" class="form-control" id="nameValue" required>
          </div>
          <div class="col-12">
            <label for="emailValue" class="form-label">Email</label>
            <input type="email" class="form-control" id="emailValue" required>
          </div>

          <div class="col-md-6">
            <label for="EZwayValue" class="form-label">EZway 分提單號(必填)</label>
            <input type="text" class="form-control" id="EZwayValue" required>
          </div>

          <div class="col-md-6">
            <label for="phoneValue" class="form-label">手機號碼</label>
            <input type="tel" class="form-control" id="phoneValue" required>
          </div>

          <div class="col-12 mt-4 form-floating">
            <textarea class="form-control" placeholder="Leave a comment here" id="demandValue"
              style="height: 100px"></textarea>
            <label for="demandValue" class="pt-3 ps-4">留言</label>
          </div>

          <div style="height: 15px;">
            <span class="errorText text-danger">請確實填寫欄位</span>
          </div>

          <div class="col-12">
            <button class="btn">
              <span class="loading-btn">
                <span class="spinner-border spinner-border-sm me-1" role="status" aria-hidden="true"></span>
              </span>
              送出
            </button>
          </div>
        </form>
      </div>
      <div class="col-6">
        <h3>客服中心：</h3>
        <p>長慶運通與客戶及合作夥伴長期以來建立穩定的關係共同成長，我們樂於了解客戶的需求，協助客戶找到最佳物流方案。</p>
        <p class="my-3">
          優秀的人力，服務的熱忱。 <br>
          提供完備服務，如行政處理、包裹查詢、簡易報關資料蒐集處理等相關服務。 <br>
          安心委託，實質服務。
        </p>
        <p>
          服務時間：週一至週五，09:00 ~ 18:00（例假日休息） <br>
          對於營業需求、問題洽詢、業務合作及異業結合 <br>
          歡迎您 E-mail 至我們的客服信箱詢問： <br>
          <strong>E-mail：service@jet-f.com</strong> <br>
          我們將盡快回覆您的需求及問題！
        </p>
      </div>
    </div>

  </div>

  {{ partial "footer.html" . }}

  <script>
    const scriptURL = 'https://script.google.com/macros/s/AKfycbzUnEWSNroTONS6dHWC6EoyIeQX0GNFJ7LGoN-inR9JM-PoCIgdNzuggVSEDR5r78sN/exec';

    function send() {
      console.log('addEventListener');
      let name = document.querySelector('#nameValue').value;
      let email = document.querySelector('#emailValue').value;
      let ezway = document.querySelector('#EZwayValue').value;
      let phone = document.querySelector('#phoneValue').value;
      let demand = document.querySelector('#demandValue').value;

      if (name === "" || email === "" || ezway === "" || phone === "") {
        $('.errorText').show();
        return;
      } else {
        $('.loading-btn').show();
        $('.errorText').hide();
      }

      $.ajax({
        url: scriptURL,
        data: {
          "name": name,
          "email": email,
          "ezway": ezway,
          "phone": phone,
          "demand": demand
        },
        success: function (response) {
          if (response == "成功") {
            $('.loading-btn').hide();
            alert("成功提交！");
          }
        },
      });
    };

    $('button').on('click', function (e) {
      e.preventDefault();
      send();
    });
  </script>
</body>

</html>