fix i18n

src/components/LicenseStatus.vue

@@ -2,17 +2,17 @@
   <div v-if="shown" class="license-status-info">
     <div class="license-content">
       <div class="license-status-text">
-        <strong>许可证状态: </strong>
+        <strong>{{ $t('license.status.label') }}</strong>
         <span v-if="licenseDisplayInfo" v-html="licenseStatusText"></span><span v-else> ... </span>
       </div>
       <div class="license-actions">
         <template v-if="!licenseDisplayInfo.isPaid">
-          <button class="action-btn" @click="refreshLicenseStatus" :disabled="checking" ref="checkButton">检查</button>
-          <kuc-tooltip title="重新检查许可证状态" :container="checkButton"></kuc-tooltip>
-          <button class="action-btn main" @click="purchaseLicense" ref="buyButton">购买</button>
-          <kuc-tooltip title="购买后当前域名下所有应用都可使用" :container="buyButton"></kuc-tooltip>
+          <button class="action-btn" @click="refreshLicenseStatus" :disabled="checking" ref="checkButton">{{ $t('license.button.checkLicense.label') }}</button>
+          <kuc-tooltip :title="$t('license.button.checkLicense.desc')" :container="checkButton"></kuc-tooltip>
+          <button class="action-btn main" @click="purchaseLicense" ref="buyButton">{{ $t('license.button.purchase.label') }}</button>
+          <kuc-tooltip :title="$t('license.button.purchase.desc')" :container="buyButton"></kuc-tooltip>
         </template>
-        <button v-else class="action-btn" @click="hidePaidMsg">不再显示</button>
+        <button v-else class="action-btn" @click="hidePaidMsg">{{ $t('license.button.hide') }}</button>
       </div>
     </div>
   </div>
@@ -20,10 +20,13 @@
 
 <script setup lang="ts">
 import { ref, onMounted, computed, shallowRef } from 'vue';
+import { useI18n } from 'vue-i18n';
 import { LicenseService } from '@/services/LicenseService';
-import type { LicenseInfo, LicenseCheckResult } from '@/types/license';
+import type { LicenseInfo } from '@/types/license';
 import { LicenseStorage } from '@/utils/LicenseStorage';
 
+const { t: $t } = useI18n();// 配置国际化
+
 type LicenseDisplayInfo = {
   isPaid: boolean;
   expiryDate: string;
@@ -44,7 +47,7 @@ const licenseDisplayInfo = computed<LicenseDisplayInfo>(() => {
   if (!licenseInfo.value || loading.value) {
     return {
       isPaid: false,
-      expiryDate: '未知',
+      expiryDate: $t('license.status.unknown'),
       isExpired: false,
       remainingDays: 1,
     };
@@ -74,7 +77,7 @@ const addPaidLabel = () => {
   const isExist = !!document.querySelector('#license-label')
   if (!shown.value && !isExist) {
     const spanElement = document.createElement('span');
-    spanElement.textContent = '已授权';
+    spanElement.textContent = $t('license.status.permanent'),
     spanElement.id = 'license-label';
     document.querySelector('#app > .settings-heading')?.appendChild(spanElement);
   }
@@ -93,29 +96,28 @@ const isPaidAreaShown = () => {
 
 const licenseStatusText = computed(() => {
   if (!licenseDisplayInfo.value) {
-    return '未知';
+    return $t('license.status.unknown');
   }
 
   if (loading.value) {
-    return '加载中...';
+    return $t('license.status.checking');
   }
 
   if (licenseDisplayInfo.value.isPaid) {
-    return '<span class="text-green">永久可用</span>';
+    return `<span class="text-green">${$t('license.status.permanentDisplay')}</span>`;
   }
 
-  let status = `到期时间 ${licenseDisplayInfo.value.expiryDate} `;
+  let status = $t('license.expiry.expiryDate', { date: licenseDisplayInfo.value.expiryDate });
 
   if (licenseDisplayInfo.value.isExpired) {
-    status += '(<span class="text-red">已过期</span>)';
-  } else if (licenseDisplayInfo.value.remainingDays == 0) {
-    status += '(今天)';
-  } else if (licenseDisplayInfo.value.remainingDays == 1) {
-    status += '(明天)';
-  } else {
-    status += '(剩余 ' + licenseDisplayInfo.value.remainingDays + ' 天)';
+    status += `(<span class="text-red">${$t('license.status.expired')}</span>)`;
+    return status;
   }
 
+  const remainingDays = licenseDisplayInfo.value.remainingDays;
+  const days = $t('license.notification.days', remainingDays)
+  status += `(${days})`;
+
   return status;
 });