|
|
@@ -4,6 +4,7 @@ import { ref, reactive, computed, onMounted } from "vue";
|
|
|
import { useMainStore } from "@/stores/main";
|
|
|
import { useDisplay } from "vuetify";
|
|
|
import { storeToRefs } from "pinia";
|
|
|
+import { useI18n } from "vue-i18n";
|
|
|
import Navbar from "@/components/Navbar.vue";
|
|
|
|
|
|
const mainStore = useMainStore();
|
|
|
@@ -13,6 +14,7 @@ const mainStoreRef = storeToRefs(mainStore);
|
|
|
const email = ref("");
|
|
|
const password = ref("");
|
|
|
const { name } = useDisplay();
|
|
|
+const { t } = useI18n();
|
|
|
const confirmPassword = ref("");
|
|
|
let data = reactive({
|
|
|
email: "",
|
|
|
@@ -59,15 +61,15 @@ async function submit() {
|
|
|
<section class="overflow-hidden banner-item">
|
|
|
<img src="../assets/img/banner.png" alt="" />
|
|
|
<h2>
|
|
|
- 將您的生活、創作、宣傳做成影片
|
|
|
+ {{ t("describe_1") }}
|
|
|
<br />
|
|
|
- 開始使用 AI Presentors
|
|
|
+ {{ t("describe_2") }}
|
|
|
</h2>
|
|
|
</section>
|
|
|
</v-col>
|
|
|
<v-col :cols="width" class="px-6 my-8 my-md-0">
|
|
|
<div class="form-title">
|
|
|
- <h3>註冊</h3>
|
|
|
+ <h3>{{ t("register") }}</h3>
|
|
|
<span></span>
|
|
|
</div>
|
|
|
<v-form ref="form" class="login-form" lazy-validation>
|
|
|
@@ -81,7 +83,7 @@ async function submit() {
|
|
|
<v-text-field
|
|
|
v-model="data.email"
|
|
|
:rules="[(v) => !!v || '請輸入您的電子信箱']"
|
|
|
- label="電子信箱"
|
|
|
+ :label="$t('emailAddress')"
|
|
|
required
|
|
|
></v-text-field>
|
|
|
|
|
|
@@ -90,8 +92,8 @@ async function submit() {
|
|
|
:append-icon="showPassword ? 'visibility' : 'visibility_off'"
|
|
|
:rules="[(v) => !!v || '請輸入您的密碼']"
|
|
|
:type="showPassword ? 'text' : 'password'"
|
|
|
- label="設定密碼"
|
|
|
- hint="4-12 位數密碼"
|
|
|
+ :label="$t('registerPassword')"
|
|
|
+ :hint="$t('passwordLength')"
|
|
|
@click:append="showPassword = !showPassword"
|
|
|
required
|
|
|
></v-text-field>
|
|
|
@@ -101,8 +103,8 @@ async function submit() {
|
|
|
:append-icon="showConfirmPassword ? 'visibility' : 'visibility_off'"
|
|
|
:rules="[(v) => !!v || '請輸入您的密碼']"
|
|
|
:type="showConfirmPassword ? 'text' : 'password'"
|
|
|
- label="確認密碼"
|
|
|
- hint="再次輸入您的密碼"
|
|
|
+ :label="$t('confirmPassword')"
|
|
|
+ :hint="$t('passwordConfirm')"
|
|
|
@click:append="showConfirmPassword = !showConfirmPassword"
|
|
|
required
|
|
|
></v-text-field>
|
|
|
@@ -112,7 +114,8 @@ async function submit() {
|
|
|
</v-alert>
|
|
|
|
|
|
<p class="text-center">
|
|
|
- 已經有帳號？ <router-link to="/login">登入</router-link>
|
|
|
+ {{ t("haveAccount") }}
|
|
|
+ <router-link to="/login"> {{ t("login") }}</router-link>
|
|
|
</p>
|
|
|
|
|
|
<v-btn
|
|
|
@@ -121,65 +124,67 @@ async function submit() {
|
|
|
@click.prevent="submit"
|
|
|
class="login-btn"
|
|
|
>
|
|
|
- 立即註冊
|
|
|
+ {{ t("registerLink") }}
|
|
|
</v-btn>
|
|
|
|
|
|
<section
|
|
|
class="mt-5 d-flex align-center justify-center dialog-content"
|
|
|
>
|
|
|
- <p>註冊即表示您已閱讀並同意</p>
|
|
|
- <v-dialog v-model="dialog" max-width="700" scrollable>
|
|
|
- <template v-slot:activator="{ props }">
|
|
|
- <v-btn
|
|
|
- variant="text"
|
|
|
- color="primary"
|
|
|
- v-bind="props"
|
|
|
- class="px-1"
|
|
|
- >
|
|
|
- 服務條款及隱私權政策
|
|
|
- </v-btn>
|
|
|
- </template>
|
|
|
-
|
|
|
- <v-card class="terms-card">
|
|
|
- <v-card-title>
|
|
|
- <v-spacer></v-spacer>
|
|
|
- <v-btn icon @click="dialog = false">
|
|
|
- <v-icon icon="md:close"></v-icon>
|
|
|
- </v-btn>
|
|
|
- </v-card-title>
|
|
|
- <v-card-text>
|
|
|
- <h3 class="text-h5 text-center font-weight-bold mb-5">
|
|
|
- 使用者的守法義務
|
|
|
- </h3>
|
|
|
- 您承諾絕不為任何非法目的或以任何非法方式使用本服務，並承諾遵守中華民國相關法規及一切使用網際網路之國際慣例。您若係中華民國以外之使用者，並同意遵守所屬國家或地域之法令。您同意並保證不得利用本服務從事侵害他人權益或違法之行為，包括但不限於：
|
|
|
- <ul class="mb-3">
|
|
|
- <li>
|
|
|
- 上載、張貼、公布或傳送任何誹謗、侮辱、具威脅性、攻擊性、不雅、猥褻、不實、違反公共秩序或善良風俗或其他不法之文字、圖片或任何形式的檔案於本服務上
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- 侵害他人名譽、隱私權、營業秘密、商標權、著作權、專利權、其他智慧財產權及其他權利
|
|
|
- </li>
|
|
|
- <li>違反依法律或契約所應負之保密義務</li>
|
|
|
- <li>冒用他人名義使用本服務</li>
|
|
|
- </ul>
|
|
|
- <v-divider></v-divider>
|
|
|
- <h3 class="text-h5 text-center font-weight-bold mt-7 mb-5">
|
|
|
- 免責聲明
|
|
|
- </h3>
|
|
|
- 您明確了解並同意：ChoozMo
|
|
|
- 對本服務不提供任何明示或默示的擔保，包含但不限於權利完整、商業適售性、特定目的之適用性及未侵害他人權利。本服務乃依其「現狀」及「提供使用時」之基礎提供，您使用本服務時，須自行承擔相關風險。ChoozMo
|
|
|
- 不保證以下事項：
|
|
|
- <ul>
|
|
|
- <li>本服務將符合您的需求</li>
|
|
|
- <li>本服務不受干擾、及時提供、安全可靠或無錯誤</li>
|
|
|
- <li>由本服務之使用而取得之結果為正確或可靠</li>
|
|
|
- </ul>
|
|
|
-
|
|
|
- 是否經由本服務之使用下載或取得任何資料應由您自行考量且自負風險，並拋棄因前開任何資料之下載而導致您電腦系統、網路存取、下載或播放設備之任何損壞或資料流失，對
|
|
|
- ChoozMo 提出任何請求或採取法律行動，您應自負完全責任。
|
|
|
- </v-card-text>
|
|
|
- </v-card>
|
|
|
- </v-dialog>
|
|
|
+ <p>
|
|
|
+ {{ t("privacy_term_1") }}
|
|
|
+ <v-dialog v-model="dialog" max-width="700" scrollable>
|
|
|
+ <template v-slot:activator="{ props }">
|
|
|
+ <a
|
|
|
+ href="javascript:;"
|
|
|
+ color="primary"
|
|
|
+ v-bind="props"
|
|
|
+ class="ms-1"
|
|
|
+ >
|
|
|
+ {{ t("privacy_term_2") }}
|
|
|
+ </a>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <v-card class="terms-card">
|
|
|
+ <v-card-title>
|
|
|
+ <v-spacer></v-spacer>
|
|
|
+ <v-btn icon @click="dialog = false">
|
|
|
+ <v-icon icon="md:close"></v-icon>
|
|
|
+ </v-btn>
|
|
|
+ </v-card-title>
|
|
|
+ <v-card-text>
|
|
|
+ <h3 class="text-h5 text-center font-weight-bold mb-5">
|
|
|
+ 使用者的守法義務
|
|
|
+ </h3>
|
|
|
+ 您承諾絕不為任何非法目的或以任何非法方式使用本服務，並承諾遵守中華民國相關法規及一切使用網際網路之國際慣例。您若係中華民國以外之使用者，並同意遵守所屬國家或地域之法令。您同意並保證不得利用本服務從事侵害他人權益或違法之行為，包括但不限於：
|
|
|
+ <ul class="mb-3">
|
|
|
+ <li>
|
|
|
+ 上載、張貼、公布或傳送任何誹謗、侮辱、具威脅性、攻擊性、不雅、猥褻、不實、違反公共秩序或善良風俗或其他不法之文字、圖片或任何形式的檔案於本服務上
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ 侵害他人名譽、隱私權、營業秘密、商標權、著作權、專利權、其他智慧財產權及其他權利
|
|
|
+ </li>
|
|
|
+ <li>違反依法律或契約所應負之保密義務</li>
|
|
|
+ <li>冒用他人名義使用本服務</li>
|
|
|
+ </ul>
|
|
|
+ <v-divider></v-divider>
|
|
|
+ <h3 class="text-h5 text-center font-weight-bold mt-7 mb-5">
|
|
|
+ 免責聲明
|
|
|
+ </h3>
|
|
|
+ 您明確了解並同意：ChoozMo
|
|
|
+ 對本服務不提供任何明示或默示的擔保，包含但不限於權利完整、商業適售性、特定目的之適用性及未侵害他人權利。本服務乃依其「現狀」及「提供使用時」之基礎提供，您使用本服務時，須自行承擔相關風險。ChoozMo
|
|
|
+ 不保證以下事項：
|
|
|
+ <ul>
|
|
|
+ <li>本服務將符合您的需求</li>
|
|
|
+ <li>本服務不受干擾、及時提供、安全可靠或無錯誤</li>
|
|
|
+ <li>由本服務之使用而取得之結果為正確或可靠</li>
|
|
|
+ </ul>
|
|
|
+
|
|
|
+ 是否經由本服務之使用下載或取得任何資料應由您自行考量且自負風險，並拋棄因前開任何資料之下載而導致您電腦系統、網路存取、下載或播放設備之任何損壞或資料流失，對
|
|
|
+ ChoozMo 提出任何請求或採取法律行動，您應自負完全責任。
|
|
|
+ </v-card-text>
|
|
|
+ </v-card>
|
|
|
+ </v-dialog>
|
|
|
+ </p>
|
|
|
</section>
|
|
|
</v-form>
|
|
|
</v-col>
|
|
|
@@ -192,7 +197,7 @@ async function submit() {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 13px;
|
|
|
letter-spacing: 1px;
|
|
|
.v-btn {
|
|
|
&:hover > .v-btn__overlay {
|
