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

@@ -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">

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"

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"

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"

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)

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"