From 2994a48e191c43c981b5de2034c30d52276028c6 Mon Sep 17 00:00:00 2001
From: shenjianZ <shenjianZLT@gmail.com>
Date: Wed, 30 Jul 2025 13:53:21 +0800
Subject: [PATCH] feat: fix compose.yml ;add frontend .env properties

---
 docker-compose.yml                    |  1 +
 frontend/.env                         |  2 ++
 frontend/src/components/AppHeader.vue |  6 ++++-
 frontend/src/views/Home.vue           |  6 ++---
 frontend/src/views/Settings.vue       | 33 ++++++++++++---------------
 5 files changed, 26 insertions(+), 22 deletions(-)
 create mode 100644 frontend/.env

diff --git a/docker-compose.yml b/docker-compose.yml
index 0bd4b1a..98f54de 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -18,6 +18,7 @@ services:
       - compose.env
     volumes:
       - mysql-data:/var/lib/mysql
+      - ./backend/init.sql:/docker-entrypoint-initdb.d/init.sql:ro
     networks:
       - email-network
 
diff --git a/frontend/.env b/frontend/.env
new file mode 100644
index 0000000..cf27d12
--- /dev/null
+++ b/frontend/.env
@@ -0,0 +1,2 @@
+VITE_APP_DOMAIN=shenjianl.cn
+VITE_GITEA_URL=https://gitea.shenjianl.cn/shenjianZ/email-unlimit
\ No newline at end of file
diff --git a/frontend/src/components/AppHeader.vue b/frontend/src/components/AppHeader.vue
index f2bdf90..257760c 100644
--- a/frontend/src/components/AppHeader.vue
+++ b/frontend/src/components/AppHeader.vue
@@ -1,10 +1,14 @@
+<script setup>
+const giteaUrl = import.meta.env.VITE_GITEA_URL;
+</script>
+
 <template>
   <header class="app-header">
     <router-link to="/" class="logo-link">
       <div class="logo">Email Unlimit</div>
     </router-link>
     <nav class="nav-links">
-      <a href="https://gitea.shenjianl.cn/shenjianZ/email-unlimit" target="_blank">Gitee</a>
+      <a :href="giteaUrl" target="_blank">Gitea</a>
       <router-link to="/settings" class="settings-link" title="设置">
         <img src="@/assets/setting.svg" alt="Settings" class="settings-icon" />
       </router-link>
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index ef636dc..a43d266 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -2,7 +2,7 @@
   <main id="app-main">
     <section class="hero-section">
       <h1>{{ $t('home.title') }}</h1>
-      <p>{{ $t('home.subtitle') }}<code>@shenjianl.cn</code>{{ $t('home.subtitleAfter') }}</p>
+      <p>{{ $t('home.subtitle') }}<code>@{{ domain }}</code>{{ $t('home.subtitleAfter') }}</p>
       <form @submit.prevent="fetchMessages" class="input-group">
         <div class="input-wrapper">
           <input
@@ -105,14 +105,14 @@ if (import.meta.env.DEV) {
   selectedMessage.value = {
     id: 'sample-1',
     sender: 'demo@example.com',
-    recipient: 'you@shenjianl.cn',
+    recipient: `you@${domain}`,
     subject: 'Markdown 样式测试邮件',
     body: `# 会议议程：项目启动会\n\n大家好，\n\n这是关于 **“Email-Unlimit”** 项目启动会的议程安排。\n\n---\n\n## 会议详情\n\n- **日期**: 2025年7月30日\n- **时间**: 上午10:00\n- **地点**: 线上会议室 (链接稍后提供)\n\n## 议程\n\n1.  **项目介绍** - 介绍项目目标和范围。\n2.  **团队分工** - 明确各自的职责。\n3.  **技术选型** - 讨论并确认技术栈。\n4.  **Q&A** - 自由提问环节。\n\n请准时参加。\n\n谢谢！\n\n> 这是一条重要的提醒：请提前准备好您的问题。`
   };
 }
 const loading = ref(false);
 const copyStatus = ref('idle'); // 'idle' | 'copied'
-const domain = 'shenjianl.cn';
+const domain = import.meta.env.VITE_APP_DOMAIN;
 const attachments = ref([]);
 const attachmentsLoading = ref(false);
 const newMailNotification = ref(false);
diff --git a/frontend/src/views/Settings.vue b/frontend/src/views/Settings.vue
index 11c627a..6969a2f 100644
--- a/frontend/src/views/Settings.vue
+++ b/frontend/src/views/Settings.vue
@@ -1,3 +1,17 @@
+<script setup>
+import { useLanguageStore } from '@/stores/language';
+import { computed } from 'vue';
+
+const domain = import.meta.env.VITE_APP_DOMAIN;
+const languageStore = useLanguageStore();
+
+const setLanguage = (lang) => {
+  languageStore.setLocale(lang);
+};
+
+const currentLocale = computed(() => languageStore.locale);
+</script>
+
 <template>
   <div class="settings-page">
     <div class="settings-container">
@@ -5,7 +19,7 @@
       <ol>
         <i18n-t keypath="howItWorks.step1" tag="li">
           <template #domain>
-            <code>@{{ 'shenjianl.cn' }}</code>
+            <code>@{{ domain }}</code>
           </template>
         </i18n-t>
         <li>{{ $t('howItWorks.step2') }}</li>
@@ -22,25 +36,8 @@
 </template>
 
 <script>
-import { useLanguageStore } from '@/stores/language';
-import { computed } from 'vue';
-
 export default {
   name: 'Settings',
-  setup() {
-    const languageStore = useLanguageStore();
-
-    const setLanguage = (lang) => {
-      languageStore.setLocale(lang);
-    };
-
-    const currentLocale = computed(() => languageStore.locale);
-
-    return {
-      setLanguage,
-      currentLocale,
-    };
-  },
 };
 </script>