翻译

src/components/BuyPage.vue

@@ -1,7 +1,7 @@
 <template>
     <van-popup class="buy-page" v-model:show="show" closeable round position="bottom" :style="{ maxHeight: '70%' }">
         <div class="news-title text-white text-lg AlimamaShuHeiTi relative">
-            <span class="z-[1] relative">購買金豆</span>
+            <span class="z-[1] relative">{{ $t('mine.buy') }}</span>
             <img class="w-[78px] h-[16px] absolute bottom-0 left-0 z-0" src="@/assets/png-xiantiao1.png" alt="" />
         </div>
         <div class="money text-xs text-white mt-[5px]">帳戶餘額：789金豆</div>

src/components/ConnectPage.vue

@@ -4,7 +4,7 @@
         <img class="img2" src="@/assets/png-kefu-bg.png" alt="" />
         <div class="flex justify-center pt-[50px]">
             <div class="news-title text-white text-lg AlimamaShuHeiTi relative">
-                <span class="z-[1] relative">聯系客服</span>
+                <span class="z-[1] relative">{{ $t('mine.connect') }}</span>
                 <img class="w-[78px] h-[16px] absolute bottom-0 left-0 z-0" src="@/assets/png-xiantiao1.png" alt="" />
             </div>
         </div>
@@ -15,7 +15,7 @@
                 <div class="connect-content flex items-center px-[16px]">
                     <img class="w-[40px] h-[40px]" src="@/assets/icon_kefu 2.png" alt="" />
                     <div class="connect-text flex-1 ml-[13px]">
-                        <div class="text-[#121325] text-[13px]">客服</div>
+                        <div class="text-[#121325] text-[13px]">{{ $t('customer') }}</div>
                         <div class="text-[#386459] text-xs">whatsapp：+16272899</div>
                     </div>
                     <van-button
@@ -24,7 +24,7 @@
                         @click="copyText('whatsapp：+16272899')"
                         size="mini"
                         round
-                        >複製</van-button
+                        >{{ $t('copy1') }}</van-button
                     >
                 </div>
             </div>
@@ -33,7 +33,7 @@
                 <div class="connect-content flex items-center px-[16px]">
                     <img class="w-[40px] h-[40px]" src="@/assets/icon_youxiang.png" alt="" />
                     <div class="connect-text flex-1 ml-[13px]">
-                        <div class="text-[#121325] text-[13px]">郵箱</div>
+                        <div class="text-[#121325] text-[13px]">{{ $t('mail') }}</div>
                         <div class="text-[#386459] text-xs">11727272636378@139.com</div>
                     </div>
                     <van-button
@@ -42,7 +42,7 @@
                         class="w-[60px]"
                         size="mini"
                         round
-                        >複製</van-button
+                        >{{ $t('copy1') }}</van-button
                     >
                 </div>
             </div>

src/components/PosterPage.vue

@@ -9,11 +9,11 @@
                     @click="copyText(shareUrl)"
                     round
                     color="linear-gradient(180deg, #FFD1D8 , #FFEAD0 )"
-                    >複製連結</van-button
-                >
-                <van-button class="save" @click="save" round color="linear-gradient(180deg, #FF7340 , #FF3E3E )"
-                    >保存圖片</van-button
+                    >{{ $t('copy') }}</van-button
                 >
+                <van-button class="save" @click="save" round color="linear-gradient(180deg, #FF7340 , #FF3E3E )">{{
+                    $t('save')
+                }}</van-button>
             </div>
         </div>
     </ion-modal>

src/components/VideoBuy.vue

@@ -5,7 +5,7 @@
             <div class="model-box">
                 <div class="title">
                     <span class="text-[56px]">{{ buyEpInfo.price }}</span>
-                    <span class="mt-[5px]"> 个金豆兑换 </span>
+                    <span class="mt-[5px]"> {{ $t('video.buyNum') }} </span>
                 </div>
 
                 <div class="info">
@@ -13,16 +13,19 @@
                     <div class="info-text">
                         <div class="text1 van-ellipsis">{{ seriesInfo.title }}</div>
                         <div class="text2">
-                            <span>兑换第{{ buyEpInfo.episodeNum }}集</span>
-                            <span>{{ category ? category + '·' : '' }}{{ seriesInfo.totalEpisodes }}集</span>
+                            <span>{{ $t('video.change', { num: buyEpInfo.episodeNum }) }}</span>
+                            <span
+                                >{{ category ? category + '·' : '' }}{{ seriesInfo.totalEpisodes
+                                }}{{ $t('video.unit') }}</span
+                            >
                         </div>
                     </div>
                 </div>
 
                 <div class="btn w-[240px] m-auto mt-[18px]">
-                    <van-button @click="buy" block round color="linear-gradient(180deg, #FF7340 , #FF3E3E )"
-                        >立即兑换</van-button
-                    >
+                    <van-button @click="buy" block round color="linear-gradient(180deg, #FF7340 , #FF3E3E )">{{
+                        $t('video.changing')
+                    }}</van-button>
                 </div>
             </div>
         </div>

src/components/VideoHistory.vue

@@ -3,7 +3,7 @@
         <div class="sticky">
             <div class="title text-white flex overflow-hidden whitespace-nowrap">
                 <div class="van-ellipsis">{{ seriesInfo.title }}</div>
-                <div>-第{{ curEpInfo.episodeNum }}集</div>
+                <div>-{{ $t('video.index', { num: curEpInfo.episodeNum }) }}</div>
             </div>
             <div class="btns">
                 <van-button
@@ -42,11 +42,17 @@
                     <van-image block width="calc(33vw - 20.66px)" height="140" fit="cover" radius="12" :src="file" />
                     <div class="video-box" v-if="item.episodeNum === curEpInfo.episodeNum">
                         <img src="@/assets/icon_bofang.png" alt="" />
-                        <div>正在播放</div>
+                        <div>{{ $t('video.playing') }}</div>
                     </div>
                 </div>
 
-                <div class="text-xs text-white pt-[8px] pb-[10px]">第{{ item.episodeNum }}集</div>
+                <div class="text-xs text-white pt-[8px] pb-[10px]">
+                    {{
+                        $t('video.index', {
+                            num: item.episodeNum
+                        })
+                    }}
+                </div>
             </div>
         </div>
     </van-popup>

src/components/VideoLine.vue

@@ -4,10 +4,12 @@
 
         <div class="content">
             <div class="title text-white van-multi-ellipsis--l2 text-sm">{{ info.title }}</div>
-            <div class="text-[#00FFE4] text-xs" v-if="history">观看至第{{ episodeNum }}集</div>
+            <div class="text-[#00FFE4] text-xs" v-if="history">
+                {{ $t('video.history', { num: episodeNum }) }}
+            </div>
             <div class="text text-xs text-[#61657A] flex justify-between">
-                <span>{{ category ? category + '·' : '' }}{{ info.totalEpisodes }}集</span>
-                <span> {{ info.playCount }}播放</span>
+                <span>{{ category ? category + '·' : '' }}{{ info.totalEpisodes }}{{ $t('video.unit') }}</span>
+                <span> {{ info.playCount }}{{ $t('video.play') }}</span>
             </div>
         </div>
     </div>

src/components/VideoPlayer.vue

@@ -22,7 +22,7 @@
             <van-slider v-model="currentVal" @change="onChange" />
             <div class="top-box" v-if="isPre">
                 <div class="top" :style="{ top: top + 'px' }">
-                    上一集
+                    {{ $t('video.pre') }}
                     <div class="top-img">
                         <Vue3Lottie :speed="1.2" :animationData="downJSON" />
                     </div>
@@ -30,7 +30,7 @@
             </div>
             <div class="next-box" v-if="isNext">
                 <div class="next" :style="{ bottom: bottom + 'px' }">
-                    下一集
+                    {{ $t('video.next') }}
                     <div class="next-img">
                         <Vue3Lottie :speed="1.2" :animationData="downJSON" />
                     </div>

src/components/VideoSmall.vue

@@ -3,12 +3,14 @@
         <div class="top relative">
             <van-image width="calc(33vw - 21.33px)" height="140" fit="cover" radius="12" :src="img" />
             <div class="top-text text-[10px] text-white p-[8px] absolute bottom-0 left-0 right-0">
-                {{ history ? `观看至第${episodeNum}集` : `${info.playCount}播放` }}
+                {{ history ? $t('video.history', { num: episodeNum }) : `${info.playCount}${$t('video.play')}` }}
             </div>
         </div>
         <div class="content">
             <div class="text-sm text-white van-ellipsis">{{ info.title }}</div>
-            <div class="text-xs text-[#61657A]">{{ category ? category + '·' : '' }}{{ info.totalEpisodes }}集</div>
+            <div class="text-xs text-[#61657A]">
+                {{ category ? category + '·' : '' }}{{ info.totalEpisodes }}{{ $t('video.unit') }}
+            </div>
         </div>
     </div>
 </template>

src/locales/zh-tw.json

@@ -61,12 +61,34 @@
   "collected": "已追剧",
   "video": {
     "number": "第{num}集",
-    "choose": "选集"
+    "choose": "选集",
+    "play": "播放",
+    "unit": "集",
+    "history": "观看至第{num}集",
+    "pre": "上一集",
+    "next": "下一集",
+    "index": "第{num}集",
+    "playing": "正在播放",
+    "buyNum": "个金豆兑换",
+    "change": "兑换第{num}集",
+    "changing": "立即兑换"
   },
   "empty": "暂无记录",
   "wallet": {
     "buySeries": "购买《{title}》",
     "buyEpisode": "购买第{num}集"
   },
-  "wait": "敬請期待"
+  "wait": "敬請期待",
+  "copy": "複製連結",
+  "save": "保存圖片",
+  "customer": "客服",
+  "copy1": "複製",
+  "mail": "郵箱",
+  "welcome": "Hi，歡迎來到走馬短劇",
+  "form": {
+    "tips": "请输入正确内容"
+  },
+  "register": "注册",
+  "goLogin": "已有帳號，立即登入",
+  "work": "赚金豆"
 }

src/views/HistoryPage.vue

@@ -6,7 +6,7 @@
                 <van-sticky @change="changeSticky">
                     <van-nav-bar
                         :class="{ isFixed: isFixed }"
-                        title="觀看歷史"
+                        :title="$t('mine.history')"
                         left-text=""
                         left-arrow
                         @click-left="back"
@@ -14,7 +14,7 @@
                 </van-sticky>
 
                 <div class="pb-6 px-[18px]">
-                    <van-empty v-if="empty" :image="emptyImg" description="暂无记录" />
+                    <van-empty v-if="empty" :image="emptyImg" :description="$t('empty')" />
                     <van-list
                         class="hot-list"
                         v-model:loading="loading"

src/views/LoginPage.vue

@@ -10,7 +10,7 @@
         <ion-content class="login">
             <img src="@/assets/png-denglu-bg.png" class="top-bg !absolute w-full h-[200px] top-0 left-0 !z-0" alt="" />
             <div class="login-content h-full">
-                <div class="text-white text-[26px] AlimamaShuHeiTi">Hi，歡迎來到走馬短劇</div>
+                <div class="text-white text-[26px] AlimamaShuHeiTi">{{ $t('welcome') }}</div>
 
                 <!-- 可以使用 CellGroup 作为容器 -->
 
@@ -42,7 +42,7 @@
                             type="password"
                             clearable
                             v-model="form.password"
-                            label="密碼"
+                            :label="$t('login.password')"
                             :placeholder="$t('login.passwordPla')"
                             :rules="[
                                 {

src/views/RecordPage.vue

@@ -5,7 +5,7 @@
                 <ion-buttons slot="start">
                     <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
                 </ion-buttons>
-                <ion-title>消費記錄</ion-title>
+                <ion-title>{{ $t('mine.record') }}</ion-title>
             </ion-toolbar>
         </ion-header>
         <ion-content class="watching">
@@ -34,14 +34,16 @@
                                 <div class="text-xs text-[#797A8A]">{{ getTime(item.updatedAt) }}</div>
                             </div>
                             <div class="h-[58px] flex flex-col justify-between items-end ml-[12px]">
-                                <div class="text-[#00FFE4] text-xs">兑换第{{ item.episode.episodeNum }}集</div>
+                                <div class="text-[#00FFE4] text-xs">
+                                    {{ $t('video.change', { num: item.episode.episodeNum }) }}
+                                </div>
 
                                 <div class="text-[18px] text-white AlimamaShuHeiTi">-{{ item.price }}</div>
                             </div>
                         </div>
                     </van-list>
 
-                    <van-empty v-if="empty" :image="emptyImg" description="暂无记录" />
+                    <van-empty v-if="empty" :image="emptyImg" :description="$t('empty')" />
                 </div>
             </div>
         </ion-content>

src/views/RegisterPage.vue

@@ -10,7 +10,7 @@
         <ion-content :fullscreen="true" class="login">
             <img src="@/assets/png-denglu-bg.png" class="top-bg !absolute w-full h-[200px] top-0 left-0 !z-0" alt="" />
             <div class="login-content h-full">
-                <div class="text-white text-[26px] AlimamaShuHeiTi">Hi，歡迎來到走馬短劇</div>
+                <div class="text-white text-[26px] AlimamaShuHeiTi">{{ $t('welcome') }}</div>
 
                 <!-- 可以使用 CellGroup 作为容器 -->
                 <van-form @submit="onSubmit">
@@ -23,7 +23,7 @@
                                 {
                                     required: true,
                                     pattern: /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
-                                    message: '请输入正确内容'
+                                    message: $t('form.tips')
                                 }
                             ]"
                             :label="$t('login.email')"
@@ -106,19 +106,19 @@
                 </div> -->
 
                         <div class="btn py-[64px] px-[17px]">
-                            <van-button type="primary" class="AlimamaShuHeiTi" block round native-type="submit"
-                                >注册</van-button
-                            >
+                            <van-button type="primary" class="AlimamaShuHeiTi" block round native-type="submit">{{
+                                $t('register')
+                            }}</van-button>
 
                             <div class="text-[#61657A] text-sm mt-[20px] text-center" @click="goLogin">
-                                已有帳號，立即登入
+                                {{ $t('goLogin') }}
                             </div>
                         </div>
                     </van-cell-group>
                 </van-form>
 
                 <div class="rule flex justify-center van-safe-area-bottom">
-                    <van-checkbox v-model="checked">點擊同意注册協定</van-checkbox>
+                    <van-checkbox v-model="checked">{{ $t('login.sure') }}</van-checkbox>
                 </div>
             </div>
         </ion-content>

src/views/VideoPage.vue

@@ -5,7 +5,9 @@
                 <ion-buttons slot="start">
                     <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
                 </ion-buttons>
-                <ion-title v-if="curEpInfo && curEpInfo.episodeNum">{{ `第${curEpInfo.episodeNum}集` }}</ion-title>
+                <ion-title v-if="curEpInfo && curEpInfo.episodeNum">{{
+                    $t('video.index', { num: curEpInfo.episodeNum })
+                }}</ion-title>
             </ion-toolbar>
         </ion-header>
         <ion-content class="view van-safe-area-bottom">
@@ -35,7 +37,7 @@
             <div class="right-fixed">
                 <div class="right-btn share" @click="share">
                     <img class="w-[38px] h-[26px]" src="@/assets/icon_fenxiang.png" alt="" />
-                    <div>赚金豆</div>
+                    <div>{{ $t('work') }}</div>
                 </div>
                 <div class="right-btn" @click="collect">
                     <img