From 40eb2dadb013afb25147894406932eb8aa94c4a7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A5=80=E6=A2=A6?= <3501646051@qq.com>
Date: Mon, 16 Mar 2026 15:47:15 +0800
Subject: [PATCH] fix: configure Element Plus Chinese locale (zh-cn)

Add zh-cn locale to Element Plus globally via app.use() and el-config-provider wrapper, and apply :locale prop to all el-date-picker components in dialogs to ensure correct Chinese display in date pickers, calendars, and other locale-aware UI.

Made-with: Cursor
---
 WebUI/src/App.vue                          | 3 +++
 WebUI/src/components/AnniversaryDialog.vue | 3 +++
 WebUI/src/components/InstallmentDialog.vue | 2 ++
 WebUI/src/components/TaskDialog.vue        | 2 ++
 WebUI/src/main.ts                          | 3 ++-
 WebUI/src/views/ProfileView.vue            | 2 ++
 api/webui/index.html                       | 4 ++--
 7 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/WebUI/src/App.vue b/WebUI/src/App.vue
index 5439fbd..b1c1538 100644
--- a/WebUI/src/App.vue
+++ b/WebUI/src/App.vue
@@ -6,6 +6,7 @@ import { useCategoryStore } from '@/stores/useCategoryStore'
 import { useTagStore } from '@/stores/useTagStore'
 import { useUIStore } from '@/stores/useUIStore'
 import { useUserSettingsStore } from '@/stores/useUserSettingsStore'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import AppHeader from '@/components/AppHeader.vue'
 import TaskDialog from '@/components/TaskDialog.vue'
 import CategoryDialog from '@/components/CategoryDialog.vue'
@@ -60,6 +61,7 @@ onMounted(async () => {
 </script>
 
 <template>
+  <el-config-provider :locale="zhCn">
   <div class="app-container">
     <div class="decoration-star" style="top: 20%; right: 8%; animation-delay: 0.5s;"></div>
     <div class="decoration-star" style="top: 60%; left: 3%; animation-delay: 1s;"></div>
@@ -97,6 +99,7 @@ onMounted(async () => {
     <TaskDialog />
     <CategoryDialog />
   </div>
+  </el-config-provider>
 </template>
 
 <style scoped lang="scss">
diff --git a/WebUI/src/components/AnniversaryDialog.vue b/WebUI/src/components/AnniversaryDialog.vue
index ef6306f..fe8c06d 100644
--- a/WebUI/src/components/AnniversaryDialog.vue
+++ b/WebUI/src/components/AnniversaryDialog.vue
@@ -3,6 +3,7 @@ import { ref, computed, watch } from 'vue'
 import { useAnniversaryStore } from '@/stores/useAnniversaryStore'
 import type { Anniversary } from '@/api/types'
 import { ElMessage } from 'element-plus'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 interface Props {
   visible: boolean
@@ -119,6 +120,7 @@ function handleClose() {
         <el-date-picker
           v-model="form.date"
           type="date"
+          :locale="zhCn"
           placeholder="选择日期"
           format="MM-DD"
           value-format="YYYY-MM-DD"
@@ -135,6 +137,7 @@ function handleClose() {
         <el-date-picker
           v-model="form.year"
           type="year"
+          :locale="zhCn"
           placeholder="选择年份（可留空）"
           format="YYYY"
           value-format="YYYY"
diff --git a/WebUI/src/components/InstallmentDialog.vue b/WebUI/src/components/InstallmentDialog.vue
index 266ab8e..207023d 100644
--- a/WebUI/src/components/InstallmentDialog.vue
+++ b/WebUI/src/components/InstallmentDialog.vue
@@ -3,6 +3,7 @@ import { ref, computed, watch } from 'vue'
 import { useAccountStore } from '@/stores/useAccountStore'
 import type { DebtInstallment, FinancialAccount } from '@/api/types'
 import { ElMessage } from 'element-plus'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 interface Props {
   visible: boolean
@@ -207,6 +208,7 @@ function handleClose() {
         <el-date-picker
           v-model="form.start_date"
           type="date"
+          :locale="zhCn"
           placeholder="选择首次还款日期"
           format="YYYY-MM-DD"
           value-format="YYYY-MM-DD"
diff --git a/WebUI/src/components/TaskDialog.vue b/WebUI/src/components/TaskDialog.vue
index e3701ce..fc192eb 100644
--- a/WebUI/src/components/TaskDialog.vue
+++ b/WebUI/src/components/TaskDialog.vue
@@ -6,6 +6,7 @@ import { useTagStore } from '@/stores/useTagStore'
 import { useUIStore } from '@/stores/useUIStore'
 import type { TaskFormData } from '@/api/types'
 import { ElMessage } from 'element-plus'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 const taskStore = useTaskStore()
 const categoryStore = useCategoryStore()
@@ -158,6 +159,7 @@ function handleClose() {
         <el-date-picker
           v-model="form.due_date"
           type="datetime"
+          :locale="zhCn"
           placeholder="选择截止日期~（可选）"
           format="YYYY-MM-DD HH:mm"
           value-format="YYYY-MM-DDTHH:mm:ss"
diff --git a/WebUI/src/main.ts b/WebUI/src/main.ts
index 8d24d65..227be32 100644
--- a/WebUI/src/main.ts
+++ b/WebUI/src/main.ts
@@ -1,6 +1,7 @@
 import { createApp } from 'vue'
 import { createPinia } from 'pinia'
 import ElementPlus from 'element-plus'
+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 import 'element-plus/dist/index.css'
 import '@/styles/main.scss'
@@ -12,7 +13,7 @@ const pinia = createPinia()
 
 app.use(pinia)
 app.use(router)
-app.use(ElementPlus)
+app.use(ElementPlus, { locale: zhCn })
 
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   app.component(key, component)
diff --git a/WebUI/src/views/ProfileView.vue b/WebUI/src/views/ProfileView.vue
index e9284c4..8764e03 100644
--- a/WebUI/src/views/ProfileView.vue
+++ b/WebUI/src/views/ProfileView.vue
@@ -2,6 +2,7 @@
 import { ref, computed, onMounted } from 'vue'
 import { ElMessage } from 'element-plus'
 import type { UploadProps } from 'element-plus'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import { useUserSettingsStore } from '@/stores/useUserSettingsStore'
 
 const userStore = useUserSettingsStore()
@@ -171,6 +172,7 @@ async function handleSave() {
               <el-date-picker
                 v-model="form.birthday"
                 type="date"
+                :locale="zhCn"
                 placeholder="选择你的生日"
                 format="YYYY-MM-DD"
                 value-format="YYYY-MM-DD"
diff --git a/api/webui/index.html b/api/webui/index.html
index 9573baf..55c27fd 100644
--- a/api/webui/index.html
+++ b/api/webui/index.html
@@ -5,10 +5,10 @@
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>webui</title>
-    <script type="module" crossorigin src="/assets/index-CZ83FtWq.js"></script>
+    <script type="module" crossorigin src="/assets/index-DP1ITMxF.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/vendor-CwFI-VDq.js">
     <link rel="modulepreload" crossorigin href="/assets/element-plus-CAICPA8-.js">
-    <link rel="stylesheet" crossorigin href="/assets/index-DQPizegK.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-DE0sVD5v.css">
   </head>
   <body>
     <div id="app"></div>