Merge branch 'master' of https://gitlab.gsstcloud.com/poc/poc-fe into beta

src/views/login/login.vue

@@ -103,6 +103,8 @@ const isShowCountdown = ref(false)
 const countdownDuration = ref<number>(60000)
 const googleLoginBtnLoading = ref(false)
 
+const isAgreeAgreement = ref(false)
+
 const phoneNumberAreaOptions = computed(() => {
   return [
     {
@@ -192,6 +194,11 @@ function getInputPhoneNumber() {
 }
 
 function handleLoginSubmit(method: LoginMethod) {
+  if (!isAgreeAgreement.value) {
+    window.$message.warning(t('login_module.please_review_and_accept_the_agreement'))
+    return
+  }
+
   let payload: LoginPayload = {
     loginChannel: 'MEMBER_PLATFOMR_PW',
     account: '',
@@ -376,6 +383,14 @@ function getGoogleLoginClientId() {
     return res.data
   })
 }
+
+function handleAgreementNavigator(name: 'UserAgreement' | 'PrivacyPolicy') {
+  if (name === 'UserAgreement') {
+    window.open('https://tcn9nhw8kfwe.feishu.cn/wiki/Y1ELwRVESi9jw9kshc0chT2ZnSf?fromScene=spaceOverview', '_blank')
+  } else if (name === 'PrivacyPolicy') {
+    window.open('https://tcn9nhw8kfwe.feishu.cn/wiki/OBzxwhGBviHP8lk9ca0chUh9nCc?fromScene=spaceOverview', '_blank')
+  }
+}
 </script>
 
 <template>
@@ -647,9 +662,20 @@ function getGoogleLoginClientId() {
             </div>
           </div>
 
-          <!-- <div class="text-center">
-            <n-checkbox size="small"><span class="text-[12px]">閱讀並同意協議</span></n-checkbox>
-          </div> -->
+          <div class="flex-center mt-[16px] flex select-none text-center">
+            <n-checkbox v-model:checked="isAgreeAgreement" />
+
+            <span class="pl-[5px] text-[12px] leading-[23px]">
+              <span>{{ t('login_module.agreement_prefix') }}</span>
+              <span class="cursor-pointer text-[#518AFF]" @click="handleAgreementNavigator('UserAgreement')"
+                >《{{ t('login_module.agreement_terms') }}》</span
+              >
+              <span>{{ t('login_module.agreement_and') }}</span>
+              <span class="cursor-pointer text-[#518AFF]" @click="handleAgreementNavigator('PrivacyPolicy')"
+                >《{{ t('login_module.agreement_privacy') }}》</span
+              >
+            </span>
+          </div>
         </div>
       </div>
     </div>