DC
/
Moderna-Survey


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495
							<!DOCTYPE html>
<html lang="zh-Hant-TW">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=640, user-scalable=no" />
  <meta name="format-detection" content="telephone=no">

  <title>健康護照</title>
  <meta name="description" content="" />
  <meta name="keywords" content="" />

  <link rel="shortcut icon" href="" type="image/x-icon" sizes="32x32" />
  <link rel="image_src" href="/healthpassport/images/share.jpg" />
  <meta property="og:title" content="健康護照" />
  <meta property="og:type" content="website" />
  <meta property="og:url" content="" />
  <meta property="og:image" content="/healthpassport/images/share.jpg" />
  <meta property="og:description" content="" />
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/css/bootstrap.min.css"
    integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  <link rel="stylesheet" href="./css/all.css">

</head>

<body>
  <div class="wapper-loading">
      <!-- Loading Start -->
    <div class="loading">
      <div class="loading__box">
        <div class="loading__ani"></div>
        <div class="loading__text">Loading</div>
      </div>
    </div>
    <!-- Loading End -->
  </div>
  <div class="wrapper"> 
      <main class="main">
        <!-- 表單 form -->
        <section class="section register">
          <div class="section__container form__container">
            <div class="form">
              <div class="form__item form__item-photo photo">
                <div class="photo__img"></div>
                <input type="file" id="fileInput1" class="fileInput" accept="image/*">
                <div class="photo__icon photo__icon-1">
                  <img src="./images/solar_camera-linear.png" alt="">
                </div>
              </div>
              <fieldset class="form__item form__item-1 form__item-healthAction" data-ques="healthAction">
                <legend class="form__ques">
                    <p>
                      平常你有什麼健康行動(複選)
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_1" type="checkbox" value="tag-WCzAvKUiL" name="healthAction">
                      <label for="healthActionOption_1">
                          <p>良好作息</p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_2" type="checkbox" value="tag-lIcE-WkEe" name="healthAction">
                      <label for="healthActionOption_2">
                          <p>
                              規律運動
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_3" type="checkbox" value="tag-uEOBbgPoG" name="healthAction">
                      <label for="healthActionOption_3">
                          <p>
                              飲食控制
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_4" type="checkbox" value="tag-YEJfK7-I7" name="healthAction">
                      <label for="healthActionOption_4">
                          <p>
                              營養品補充
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_5" type="checkbox" value="tag-stfrz1nD8" name="healthAction">
                      <label for="healthActionOption_5">
                          <p>
                              閱讀健康文章
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthActionOption_6" type="checkbox" value="x" name="healthAction">
                      <label for="healthActionOption_6">
                          <p>
                            其他
                          </p>
                      </label>
                  </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-2 form__item-healthTopic" data-ques="healthTopic">
                <legend class="form__ques">
                    <p>
                      你對什麼健康話題有興趣(複選)
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_1" type="checkbox" value="tag-vstHmk4YP" name="healthTopic">
                      <label for="healthTopicOption_1">
                          <p>流行感冒</p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_2" type="checkbox" value="tag-CorN36876" name="healthTopic">
                      <label for="healthTopicOption_2">
                          <p>
                              免疫調節
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_3" type="checkbox" value="tag-nWHBzbUCr" name="healthTopic">
                      <label for="healthTopicOption_3">
                          <p>
                              腸胃功能
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_4" type="checkbox" value="tag-VQSDoXlAL" name="healthTopic">
                      <label for="healthTopicOption_4">
                          <p>
                              過敏體質
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_5" type="checkbox" value="tag-MLdZCbE9y" name="healthTopic">
                      <label for="healthTopicOption_5">
                          <p>
                              睡眠問題
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                      <input id="healthTopicOption_6" type="checkbox" value="tag-Yz0_DhZBV" name="healthTopic">
                      <label for="healthTopicOption_6">
                          <p>
                            日常保健
                          </p>
                      </label>
                  </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-3 form__item-healthStatus" data-ques="healthStatus">
                <legend class="form__ques">
                    <p>
                      你覺得自己的身體狀況如何
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthStatusOption_1" type="radio" value="tag-TN-u8YIrm" name="healthStatus">
                    <label for="healthStatusOption_1">
                        <p>
                            很少生病
                        </p>
                    </label>
                    
                </div>
                <div class="form__options__item tags__item tags__item-md">
                    <input id="healthStatusOption_2" type="radio" value="tag-ATnIMezXK" name="healthStatus">
                    <label for="healthStatusOption_2">
                        <p>
                            偶爾疲倦
                        </p>
                    </label>
                </div>
                <div class="form__options__item tags__item tags__item-md">
                    <input id="healthStatusOption_3" type="radio" value="tag-LJg1ec9-L" name="healthStatus">
                    <label for="healthStatusOption_3">
                        <p>
                            經常感冒
                        </p>
                    </label>
                </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-4 form__item-healthAdapt" data-ques="healthAdapt">
                <legend class="form__ques">
                    <p>
                      面對疫情趨緩，<br>以下哪一個情況最符合你的應對
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-lg">
                    <input id="healthAdaptOption_1" type="radio" value="tag-bDRawibcP" name="healthAdapt">
                    <label for="healthAdaptOption_1">
                        <p>
                          我仍會主動參考政府機構的資訊，持續戴口罩積極防疫
                        </p>
                    </label>
                    
                </div>
                <div class="form__options__item tags__item tags__item-lg">
                    <input id="healthAdaptOption_2" type="radio" value="tag-JiWCgTnNs" name="healthAdapt">
                    <label for="healthAdaptOption_2">
                        <p>
                          我在前往人多的地方或搭乘大眾交通工具時會佩戴口罩
                        </p>
                    </label>
                </div>
                <div class="form__options__item tags__item tags__item-lg">
                    <input id="healthAdaptOption_3" type="radio" value="tag-4dcsmiwqt" name="healthAdapt">
                    <label for="healthAdaptOption_3">
                        <p>
                          我不再對疫情感到恐慌，幾乎不戴口罩、回到正常生活
                        </p>
                    </label>
                </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-5 form__item-healthThought" data-ques="healthThought">
                <legend class="form__ques">
                    <p>
                      下列哪一個敘述符合你的想法<br>
                      (複選，至多可選擇2個答案)
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-lg">
                      <input id="healthThoughtOption_1" type="checkbox" value="tag-FhMvcmSJm" name="healthThought">
                      <label for="healthThoughtOption_1">
                          <p>我願意了解新的疫苗並採取行動</p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-lg">
                      <input id="healthThoughtOption_2" type="checkbox" value="tag-g4GSGpTHq" name="healthThought">
                      <label for="healthThoughtOption_2">
                          <p>
                              我會自律做好防疫，避免造成他人困擾
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-lg">
                      <input id="healthThoughtOption_3" type="checkbox" value="tag-lDhpoS39o" name="healthThought">
                      <label for="healthThoughtOption_3">
                          <p>
                              我覺得應該維持正常社交，不用過度緊張
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-lg">
                      <input id="healthThoughtOption_4" type="checkbox" value="tag-qmywOc8af" name="healthThought">
                      <label for="healthThoughtOption_4">
                          <p>
                              我覺得保持正向的態度，與病毒共處自然會產生抗體
                          </p>
                      </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-lg">
                      <input id="healthThoughtOption_5" type="checkbox" value="tag-77KImqQGb" name="healthThought">
                      <label for="healthThoughtOption_5">
                          <p>
                              沒做好防疫準備，我會感到焦慮
                          </p>
                      </label>
                  </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-6 form__item-healthAge" data-ques="healthAge">
                <legend class="form__ques">
                    <p>
                      你的年齡
                    </p>
                </legend>
                <div class="form__options tags">
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_1" type="radio" value="tag-bjbXSt2gi" name="healthAge">
                    <label for="healthAgeOption_1">
                        <p>
                          19歲以下
                        </p>
                    </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_2" type="radio" value="tag-qYe0v6HqF" name="healthAge">
                    <label for="healthAgeOption_2">
                        <p>
                          20-29歲
                        </p>
                    </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_3" type="radio" value="tag-6iaNB8Ea4" name="healthAge">
                    <label for="healthAgeOption_3">
                        <p>
                          30-39歲
                        </p>
                    </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_4" type="radio" value="tag-e4JG3GBG_" name="healthAge">
                    <label for="healthAgeOption_4">
                        <p>
                          40-49歲
                        </p>
                    </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_5" type="radio" value="tag-DTE6DWovG" name="healthAge">
                    <label for="healthAgeOption_5">
                        <p>
                          50-59歲
                        </p>
                    </label>
                  </div>
                  <div class="form__options__item tags__item tags__item-md">
                    <input id="healthAgeOption_6" type="radio" value="tag-pAxHnckQs" name="healthAge">
                    <label for="healthAgeOption_6">
                        <p>
                          60歲以上
                        </p>
                    </label>
                  </div>
                </div>
              </fieldset>
              <fieldset class="form__item form__item-6 form__item-healthNickname" data-ques="healthNickname">
                <legend class="form__ques">
                    <p>
                      暱稱
                    </p>
                </legend>
                <div class="form__input">
                  <input id="nickName" type="text" value="" placeholder="請輸入暱稱">
                </div>
              </fieldset>
              <fieldset class="form__item form__item-6 form__item-healthGender" data-ques="healthGender">
                <legend class="form__ques">
                    <p>
                      性別
                    </p>
                </legend>
                <div class="form__input">
                  <select name="gender" id="gender">
                    <option value="">請選擇性別</option>
                    <option value="tag-8HwqQuQ43">女性</option>
                    <option value="tag-F8Me8-UGg">男性</option>
                    <option value="tag-BrpgwlI5E">其他</option>
                  </select>
                </div>
              </fieldset>
              <div class="form__item form__item-agree">
                <label for="methodsAgree" class="label">
                    <input type="checkbox" id="methodsAgree" name="methodsAgree">
                    <div class="label__checkbox"></div>
                    <p>我同意<span class="goToActivity">個人資料使用方法</span></p>
                </label>
            </div>
              <div class="button form-submit">
                <p>下一步</p>
              </div>
            </div>
          </div>
        </section>
        <!-- 活動辦法 methods -->
        <section class="section methods wrapper__line-scroll-fixed">
          <div class="backform"><span><</span><p>回上一頁</p></div>
          <div class="section__container methods__container">
            <p>
              李慶雲兒童感染暨疫苗發展醫學文教基金會以本訊息向您告知並徵求同意。由於個人資料蒐集涉及您的隱私權益，請您務必詳閱本告知內容。為經營「mRNA 健康管家」LINE官方帳號之需要，帳號內的「健康護照」功能互動，將蒐集您的個人資料，以進行後續的內容分眾溝通。<br><br>

              其中包含暱稱、照片、性別、年齡區間、對於健康議題之
              想法意向等。但毋須提供姓名、出生年月日、身分證字號
              、住居所地址、各類電信電話號碼、電子郵件信箱、聯絡
              人資訊以及其他可辨識之個人資料。本單位只會在中華民
              國境內利用您的個人資料，利用期間為本單位或業務所必
              須之保存期間。利用方式為符合個人資料保護相關法令以
              自動化機器或其他非自動化之利用方式。除非有個人資料
              保護法所規定例外情形，否則您可以依照個人資料保護法
              相關規定，就您提供的個人資料行使以下權利：查詢或請
              求閱覽或請求製給複製本、請求補充或更正、請求停止蒐
              集、處理或利用、請求刪除，如有相關需求，可透過 Email
              與我們聯繫（prof.lee.foundation@gmail.com）。<br><br>

              提醒您，您可以自由選擇提供您的個人資料，如果您拒絕
              提供的個人資料是與前述蒐集、處理與利用目的相關，則
              會導致您無法使用帳號內的「健康護照」功能。
            </p>
          </div>
        </section>
        <!-- 護照 passport -->
        <section class="section passport wrapper__line-scroll-fixed">
          <div class="section__container passport__container">
            <div class="passport__intro">
              <div class="passport__intro__bg">
                <img src="./images/passport-intro.png" alt="">
              </div>
              <div class="passport__intro__container">
                <div class="photo">
                  <div class="photo__img"></div>
                  <input type="file" id="fileInput2" class="fileInput" accept="image/*">
                  <div class="photo__icon photo__icon-2">
                    <img src="./images/solar_camera-linear.png" alt="">
                  </div>
                </div>
                <div class="passport__intro__content">
                  <div class="passport__intro__nickname">
                    <h2></h2>
                  </div>
                  <div class="passport__intro__info">
                    <p><span class="introGender"></span> / <span class="introAge"></span></p>
                  </div>
                </div>
              </div>
            </div>
            <div class="passport__toggle passport__toggle-healthTopic">
              <div class="passport__toggle__head">
                <p>關注議題</p>
              </div>
              <div class="passport__toggle__body">
                <div class="tags"></div>
              </div>
            </div>
            <div class="passport__toggle passport__toggle-healthAction">
              <div class="passport__toggle__head">
                <p>健康行動</p>
              </div>
              <div class="passport__toggle__body">
                <div class="tags"></div>
              </div>
            </div>
          </div>
        </section>
      </main>
      <footer class="footer">
      </footer>
  </div>
  <!-- Alert Modal -->
  <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
      <div class="modal-content">
        <button type="button" class="close modal__close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <div class="modal-header">
        </div>
        <div class="modal-body">
          <p class="alert-message"></p>
        </div>
        <div class="modal-footer">

          <button type="button" class="close button" data-dismiss="modal" aria-label="Close">
            <p><span aria-hidden="true">確定</span></p>
          </button>

        </div>
      </div>
    </div>
  </div>

  <!-- <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> -->
  <script src="./lib/jquery-3.5.1.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/js/bootstrap.min.js"
    integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
    crossorigin="anonymous"></script>
  <script charset="utf-8" src="https://static.line-scdn.net/liff/edge/2/sdk.js"></script>
  <script src="./lib/gsap.min.js"></script>
  <script src="./lib/exif.js"></script>
  <script src="./lib/photoHelper.js"></script>
  <script src="./js/utlis.js"></script>
  <script src="./js/services/userModel.js"></script>
  <script src="./js/services/index.js"></script>
  <script src="./js/base.js"></script>
  <script src="./js/register.js"></script>
  <script src="./js/passport.js"></script>

  <!-- <script src="https://cdn.jsdelivr.net/npm/vconsole@3.2.0/dist/vconsole.min.js"></script>

  <script>
    // init vConsole
    var vConsole = new VConsole();
    console.log('Hello world');
  </script> -->

</body>

</html>