diff --git a/auto-imports.d.ts b/auto-imports.d.ts index 388a569..c7eb0c6 100644 --- a/auto-imports.d.ts +++ b/auto-imports.d.ts @@ -183,6 +183,7 @@ declare global { const useFullscreen: typeof import('@vueuse/core').useFullscreen const useGamepad: typeof import('@vueuse/core').useGamepad const useGeolocation: typeof import('@vueuse/core').useGeolocation + const useI18n: typeof import('vue-i18n').useI18n const useId: typeof import('vue').useId const useIdle: typeof import('@vueuse/core').useIdle const useImage: typeof import('@vueuse/core').useImage @@ -492,6 +493,7 @@ declare module 'vue' { readonly useFullscreen: UnwrapRef readonly useGamepad: UnwrapRef readonly useGeolocation: UnwrapRef + readonly useI18n: UnwrapRef readonly useId: UnwrapRef readonly useIdle: UnwrapRef readonly useImage: UnwrapRef diff --git a/eslint.config.mjs b/eslint.config.mjs index 35aae7d..c7e8f94 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -4,7 +4,7 @@ import antfu from "@antfu/eslint-config"; export default antfu({ vue: true, typescript: true, - jsonc: false, + jsonc: true, gitignore: true, ignores: [ "ios", diff --git a/package.json b/package.json index 63d76ed..75b43a8 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "ionicons": "^8.0.13", "lodash-es": "^4.17.21", "vue": "^3.5.25", + "vue-i18n": "^11.2.2", "vue-router": "^4.6.3" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5418565..8b806e4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -53,6 +53,9 @@ importers: vue: specifier: ^3.5.25 version: 3.5.25(typescript@5.9.3) + vue-i18n: + specifier: ^11.2.2 + version: 11.2.2(vue@3.5.25(typescript@5.9.3)) vue-router: specifier: ^4.6.3 version: 4.6.3(vue@3.5.25(typescript@5.9.3)) @@ -1114,6 +1117,18 @@ packages: peerDependencies: vue: '>=3' + '@intlify/core-base@11.2.2': + resolution: {integrity: sha512-0mCTBOLKIqFUP3BzwuFW23hYEl9g/wby6uY//AC5hTgQfTsM2srCYF2/hYGp+a5DZ/HIFIgKkLJMzXTt30r0JQ==} + engines: {node: '>= 16'} + + '@intlify/message-compiler@11.2.2': + resolution: {integrity: sha512-XS2p8Ff5JxWsKhgfld4/MRQzZRQ85drMMPhb7Co6Be4ZOgqJX1DzcZt0IFgGTycgqL8rkYNwgnD443Q+TapOoA==} + engines: {node: '>= 16'} + + '@intlify/shared@11.2.2': + resolution: {integrity: sha512-OtCmyFpSXxNu/oET/aN6HtPCbZ01btXVd0f3w00YsHOb13Kverk1jzA2k47pAekM55qbUw421fvPF1yxZ+gicw==} + engines: {node: '>= 16'} + '@ionic/cli-framework-output@2.2.8': resolution: {integrity: sha512-TshtaFQsovB4NWRBydbNFawql6yul7d5bMiW1WYYf17hd99V6xdDdk3vtF51bw6sLkxON3bDQpWsnUc9/hVo3g==} engines: {node: '>=16.0.0'} @@ -4313,6 +4328,12 @@ packages: vue-flow-layout@0.2.0: resolution: {integrity: sha512-zKgsWWkXq0xrus7H4Mc+uFs1ESrmdTXlO0YNbR6wMdPaFvosL3fMB8N7uTV308UhGy9UvTrGhIY7mVz9eN+L0Q==} + vue-i18n@11.2.2: + resolution: {integrity: sha512-ULIKZyRluUPRCZmihVgUvpq8hJTtOqnbGZuv4Lz+byEKZq4mU0g92og414l6f/4ju+L5mORsiUuEPYrAuX2NJg==} + engines: {node: '>= 16'} + peerDependencies: + vue: ^3.0.0 + vue-router@4.6.3: resolution: {integrity: sha512-ARBedLm9YlbvQomnmq91Os7ck6efydTSpRP3nuOKCvgJOHNrhRoJDSKtee8kcL1Vf7nz6U+PMBL+hTvR3bTVQg==} peerDependencies: @@ -5557,6 +5578,18 @@ snapshots: '@iconify/types': 2.0.0 vue: 3.5.25(typescript@5.9.3) + '@intlify/core-base@11.2.2': + dependencies: + '@intlify/message-compiler': 11.2.2 + '@intlify/shared': 11.2.2 + + '@intlify/message-compiler@11.2.2': + dependencies: + '@intlify/shared': 11.2.2 + source-map-js: 1.2.1 + + '@intlify/shared@11.2.2': {} + '@ionic/cli-framework-output@2.2.8': dependencies: '@ionic/utils-terminal': 2.3.5 @@ -9128,6 +9161,13 @@ snapshots: vue-flow-layout@0.2.0: {} + vue-i18n@11.2.2(vue@3.5.25(typescript@5.9.3)): + dependencies: + '@intlify/core-base': 11.2.2 + '@intlify/shared': 11.2.2 + '@vue/devtools-api': 6.6.4 + vue: 3.5.25(typescript@5.9.3) + vue-router@4.6.3(vue@3.5.25(typescript@5.9.3)): dependencies: '@vue/devtools-api': 6.6.4 diff --git a/src/api/index.ts b/src/api/index.ts index c0ef962..16c0cd7 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -1,7 +1,7 @@ import type { App } from "@riwa/api-types"; import { treaty } from "@elysiajs/eden"; -const client = treaty(`${window.location.origin}/api`, { +const client = treaty(window.location.origin, { fetch: { credentials: "include", }, diff --git a/src/locales/en-US.json b/src/locales/en-US.json new file mode 100644 index 0000000..d15f026 --- /dev/null +++ b/src/locales/en-US.json @@ -0,0 +1,9 @@ +{ + "wallet": { + "wallet": "Wallet", + "recharge": "Recharge", + "withdraw": "Withdraw", + "transfer": "Transfer", + "balance": "Balance" + } +} diff --git a/src/locales/index.ts b/src/locales/index.ts new file mode 100644 index 0000000..c1819c5 --- /dev/null +++ b/src/locales/index.ts @@ -0,0 +1,16 @@ +import { createI18n } from "vue-i18n"; +import enUS from "./en-US.json"; +import zhCN from "./zh-CN.json"; + +export type MessageSchema = typeof enUS; + +const i18n = createI18n({ + locale: "en-US", + fallbackLocale: "en-US", + messages: { + "en-US": enUS, + "zh-CN": zhCN, + }, +}); + +export { i18n }; diff --git a/src/locales/zh-CN.json b/src/locales/zh-CN.json new file mode 100644 index 0000000..96cda37 --- /dev/null +++ b/src/locales/zh-CN.json @@ -0,0 +1,9 @@ +{ + "wallet": { + "wallet": "钱包", + "recharge": "充值", + "withdraw": "提现", + "transfer": "转账", + "balance": "余额" + } +} diff --git a/src/main.ts b/src/main.ts index bccf22f..c6645a3 100644 --- a/src/main.ts +++ b/src/main.ts @@ -2,6 +2,7 @@ import { IonicVue } from "@ionic/vue"; import { createApp } from "vue"; import App from "./App.vue"; +import { i18n } from "./locales"; import router from "./router"; /* UnoCSS */ @@ -40,7 +41,8 @@ import "./theme/ionic.css"; const app = createApp(App) .use(IonicVue) - .use(router); + .use(router) + .use(i18n); router.isReady().then(() => { app.mount("#app"); diff --git a/src/utils/helper.ts b/src/utils/helper.ts index 57eb1da..2799be1 100644 --- a/src/utils/helper.ts +++ b/src/utils/helper.ts @@ -1,6 +1,6 @@ export function formatBalance(amount: MaybeRefOrGetter, locale: Intl.LocalesArgument = "en-US"): ComputedRef { return computed(() => { const balance = toValue(amount); - return `$${balance.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`; + return `$${balance.toLocaleString(locale, { minimumFractionDigits: 0, maximumFractionDigits: 2 })}`; }); } diff --git a/src/views/user/components/wallet-card.vue b/src/views/user/components/wallet-card.vue index d4adaa4..944d024 100644 --- a/src/views/user/components/wallet-card.vue +++ b/src/views/user/components/wallet-card.vue @@ -1,30 +1,46 @@ diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts index ab11073..4d91abd 100644 --- a/src/vite-env.d.ts +++ b/src/vite-env.d.ts @@ -1,2 +1,23 @@ /// /// + +import type { MessageSchema } from "@/locales"; +import { + DefineDateTimeFormat, + DefineLocaleMessage, + DefineNumberFormat, +} from "vue-i18n"; + +declare module "vue-i18n" { + // define the locale messages schema + export interface DefineLocaleMessage extends MessageSchema { + } + + // define the datetime format schema + export interface DefineDateTimeFormat { + } + + // define the number format schema + export interface DefineNumberFormat { + } +} diff --git a/uno.config.ts b/uno.config.ts index d7e2115..bceb6e1 100644 --- a/uno.config.ts +++ b/uno.config.ts @@ -33,6 +33,26 @@ export default defineConfig({ light: "var(--ion-color-light)", medium: "var(--ion-color-medium)", dark: "var(--ion-color-dark)", + text: { + 50: "var(--ion-text-color-step-50)", + 100: "var(--ion-text-color-step-100)", + 150: "var(--ion-text-color-step-150)", + 200: "var(--ion-text-color-step-200)", + 250: "var(--ion-text-color-step-250)", + 300: "var(--ion-text-color-step-300)", + 350: "var(--ion-text-color-step-350)", + 400: "var(--ion-text-color-step-400)", + 450: "var(--ion-text-color-step-450)", + 500: "var(--ion-text-color-step-500)", + 550: "var(--ion-text-color-step-550)", + 600: "var(--ion-text-color-step-600)", + 650: "var(--ion-text-color-step-650)", + 700: "var(--ion-text-color-step-700)", + 750: "var(--ion-text-color-step-750)", + 800: "var(--ion-text-color-step-800)", + 850: "var(--ion-text-color-step-850)", + 900: "var(--ion-text-color-step-900)", + }, }, }, }); diff --git a/vite.config.ts b/vite.config.ts index fd11745..901b8e0 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -23,7 +23,7 @@ export default defineConfig({ legacy(), autoImport({ dirs: ["src/composables", "src/utils"], - imports: ["vue", "vue-router", "@vueuse/core"], + imports: ["vue", "vue-router", "@vueuse/core", "vue-i18n"], resolvers: [IonicResolver()], vueTemplate: true, }),