From 59b659f77b501fd159b0e6010c61be47ba434e49 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=86=E5=85=89LG?= Date: Sun, 17 Aug 2025 20:03:19 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E6=B7=BB=E5=8A=A0=E9=82=AE=E7=AE=B1?= =?UTF-8?q?=E5=87=BA=E9=A2=98=E9=A1=B5=E9=9D=A2=E4=BA=8B=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Email组件外部表格保存功能说明.md | 92 ++++++ .../Email/children/components/antiSpam.vue | 34 +++ .../children/components/experimentLab.vue | 29 ++ .../children/components/folderSettings.vue | 29 ++ .../Email/children/components/letterhead.vue | 29 ++ .../Email/children/components/mailRules.vue | 34 +++ .../children/components/otherMailbox.vue | 29 ++ .../children/components/registerEnglish.vue | 160 ++++++++++ .../children/components/skinSettings.vue | 192 ++++++++++++ .../children/components/subscription.vue | 29 ++ src/components/Email/children/index.vue | 72 +++++ src/components/Email/components/setting.vue | 284 ++++++++++++++++-- src/components/Email/index.ts | 45 +++ src/components/Email/index.vue | 68 ++++- src/store/modules/email.ts | 38 +++ src/views/paper/question/CdesignForm.vue | 4 +- src/views/paper/question/EmailForm.vue | 52 ++-- 17 files changed, 1160 insertions(+), 60 deletions(-) create mode 100644 Email组件外部表格保存功能说明.md create mode 100644 src/components/Email/children/components/antiSpam.vue create mode 100644 src/components/Email/children/components/experimentLab.vue create mode 100644 src/components/Email/children/components/folderSettings.vue create mode 100644 src/components/Email/children/components/letterhead.vue create mode 100644 src/components/Email/children/components/mailRules.vue create mode 100644 src/components/Email/children/components/otherMailbox.vue create mode 100644 src/components/Email/children/components/registerEnglish.vue create mode 100644 src/components/Email/children/components/skinSettings.vue create mode 100644 src/components/Email/children/components/subscription.vue create mode 100644 src/components/Email/children/index.vue create mode 100644 src/components/Email/index.ts create mode 100644 src/store/modules/email.ts diff --git a/Email组件外部表格保存功能说明.md b/Email组件外部表格保存功能说明.md new file mode 100644 index 0000000..2d3ca7a --- /dev/null +++ b/Email组件外部表格保存功能说明.md @@ -0,0 +1,92 @@ +# Email组件外部表格保存功能测试说明 + +## 功能概述 + +已为Email组件实现了模仿Setting组件的外部表格保存功能。当用户在Email组件中进行设置时,配置数据会自动保存到store中,当关闭弹窗时,外部的EmailForm会从store中获取这些数据并显示在表格中。 + +## 实现细节 + +### 1. 创建了Email Store (`src/store/modules/email.ts`) + +- `emailFormList`: 存储邮件配置数据的数组 +- `addEmailData()`: 添加邮件配置数据 +- `updateEmailData()`: 更新邮件配置数据 +- `removeEmailData()`: 删除邮件配置数据 +- `clearEmailData()`: 清空所有邮件配置数据 + +### 2. 创建了Email消息发送函数 (`src/components/Email/index.ts`) + +- `sendEmailMsg()`: 将邮件设置数据保存到store中 +- 格式化数据:支持boolean类型显示为"打开/关闭",其他类型直接显示值 +- 数据结构:`{ contentIn: "设置描述", content: "category@key@value" }` +- 避免重复:相同category@key的数据会被更新而不是重复添加 + +### 3. 修改了Email Setting组件 (`src/components/Email/components/setting.vue`) + +- 导入了`sendEmailMsg`函数 +- 为所有设置项的变更事件添加了数据保存调用: + - 语言设置:`common@language@value` + - 文字大小:`common@fontSize@value` + - 邮件数量:`common@emailCount@value` + - 邮件选项:`common@checkList@value` + - 天气显示:`common@weather@value` + - 生日提醒:`common@birthdayRemind@value` + - 邮件昵称:`account@nickname@value` + - 生日信息:`account@birthYear/birthMonth/birthDay@value` + - 生日可见性:`account@birthdayVisible@value` + - 默认账户:`account@defaultAccount@value` + +### 4. 修改了Email子组件 (`src/components/Email/children/components/skinSettings.vue`) + +- 为皮肤设置功能添加了数据保存: + - 选择皮肤:`skin@selectedSkin@value` + - 应用皮肤:`skin@appliedSkin@value` + - 恢复默认:`skin@resetSkin@default` + +### 5. 修改了EmailForm组件 (`src/views/paper/question/EmailForm.vue`) + +- 导入了`useEmailStore` +- 添加了`handleEmailForm()`函数,在dialog关闭时从store获取数据 +- 修改了dialog的`@close`事件,绑定到`handleEmailForm` +- 调整了表格显示: + - 将"试题考点"改为"邮件配置" + - 将"考点"列改为"配置项"列 + - 将"权值"列改为"配置值"列 + - 将"添加"按钮改为"设置"按钮 + +## 使用流程 + +1. 用户在EmailForm中点击"设置"按钮 +2. 打开Email组件的设置弹窗 +3. 用户在Email组件中进行各种设置(语言、皮肤、账户等) +4. 每次设置都会通过`sendEmailMsg()`保存到`emailStore.emailFormList`中 +5. 用户关闭弹窗时,触发`handleEmailForm()`函数 +6. `handleEmailForm()`从store中获取数据并更新外部表格`list.value` +7. 表格显示格式化的配置信息,如: + - "设置邮件界面语言: 中文" | "common@language@zh_cn" + - "设置邮件应用皮肤: default" | "skin@appliedSkin@default" + - "设置邮件邮件昵称: demo" | "account@nickname@demo" + +## 数据格式说明 + +每个配置项在store中的数据格式: + +```javascript +{ + contentIn: "设置邮件界面语言: 中文", // 用户友好的描述 + content: "common@language@zh_cn" // 结构化的数据标识 +} +``` + +## 测试验证 + +可以按以下步骤测试功能: + +1. 打开EmailForm页面 +2. 点击"邮件配置"标签页中的"设置"按钮 +3. 在Email组件中修改各种设置(语言、皮肤等) +4. 关闭设置弹窗 +5. 检查外部表格是否显示了相应的配置项 +6. 通过浏览器开发者工具查看console.log输出确认数据保存 + +这样就完成了Email组件的外部表格保存功能,与Setting组件的实现模式完全一致。 diff --git a/src/components/Email/children/components/antiSpam.vue b/src/components/Email/children/components/antiSpam.vue new file mode 100644 index 0000000..90f2c1a --- /dev/null +++ b/src/components/Email/children/components/antiSpam.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/src/components/Email/children/components/experimentLab.vue b/src/components/Email/children/components/experimentLab.vue new file mode 100644 index 0000000..200a754 --- /dev/null +++ b/src/components/Email/children/components/experimentLab.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/components/Email/children/components/folderSettings.vue b/src/components/Email/children/components/folderSettings.vue new file mode 100644 index 0000000..c1463df --- /dev/null +++ b/src/components/Email/children/components/folderSettings.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/components/Email/children/components/letterhead.vue b/src/components/Email/children/components/letterhead.vue new file mode 100644 index 0000000..765769f --- /dev/null +++ b/src/components/Email/children/components/letterhead.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/components/Email/children/components/mailRules.vue b/src/components/Email/children/components/mailRules.vue new file mode 100644 index 0000000..bc4f0df --- /dev/null +++ b/src/components/Email/children/components/mailRules.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/src/components/Email/children/components/otherMailbox.vue b/src/components/Email/children/components/otherMailbox.vue new file mode 100644 index 0000000..b79ea5a --- /dev/null +++ b/src/components/Email/children/components/otherMailbox.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/components/Email/children/components/registerEnglish.vue b/src/components/Email/children/components/registerEnglish.vue new file mode 100644 index 0000000..c7a4228 --- /dev/null +++ b/src/components/Email/children/components/registerEnglish.vue @@ -0,0 +1,160 @@ + + + + + diff --git a/src/components/Email/children/components/skinSettings.vue b/src/components/Email/children/components/skinSettings.vue new file mode 100644 index 0000000..99cc912 --- /dev/null +++ b/src/components/Email/children/components/skinSettings.vue @@ -0,0 +1,192 @@ + + + + + diff --git a/src/components/Email/children/components/subscription.vue b/src/components/Email/children/components/subscription.vue new file mode 100644 index 0000000..9a3a1d6 --- /dev/null +++ b/src/components/Email/children/components/subscription.vue @@ -0,0 +1,29 @@ + + + diff --git a/src/components/Email/children/index.vue b/src/components/Email/children/index.vue new file mode 100644 index 0000000..f8d0ea2 --- /dev/null +++ b/src/components/Email/children/index.vue @@ -0,0 +1,72 @@ + + + + + diff --git a/src/components/Email/components/setting.vue b/src/components/Email/components/setting.vue index b0d644e..78bbf04 100644 --- a/src/components/Email/components/setting.vue +++ b/src/components/Email/components/setting.vue @@ -5,14 +5,14 @@ - - - - - - - - + + + + + + + + @@ -21,13 +21,14 @@
显示
- - + + + - + 标准 中号 大号 @@ -36,30 +37,37 @@
每页显示   - + +  封邮件
- + 显示邮件摘要 显示邮件大小
- 显示天气 + 显示天气
所在地:   - - + + + +

(自动选择,系统将根据你的IP自动显示你所在的城市的今明两天天气情况。)

- 在首页显示好友的生日提醒 + 在首页显示好友的生日提醒
@@ -67,14 +75,22 @@
显示
- +

(你发出的所有邮件,发件人将显示你的邮件昵称,你还可以给每个账户单独设置昵称。)

- + - + 月 - +
- 好友可见我的生日 + 好友可见我的生日

(快过生日时,你的好友可以在邮箱首页看到你的生日信息。)

默认发信帐号
-