fix: 修改邮箱出题页面表格显示项

This commit is contained in:
陆光LG
2025-08-17 20:20:12 +08:00
parent f5f30d2fbf
commit 7c7697f6d4
3 changed files with 132 additions and 22 deletions

View File

@@ -9,10 +9,10 @@
</el-tabs>
<div v-if="activeName === 'common'" class="common-content tab-content">
<div class="btn-line_top flex">
<el-button type="info">发送</el-button>
<el-button type="info">定时发送</el-button>
<el-button type="info">存草稿</el-button>
<el-button type="info">关闭</el-button>
<el-button type="info" @click="handleSend">发送</el-button>
<el-button type="info" @click="handleScheduledSend">定时发送</el-button>
<el-button type="info" @click="handleSaveDraft">存草稿</el-button>
<el-button type="info" @click="handleClose">关闭</el-button>
</div>
<div class="common-main">
<div class="row flex" style="margin-bottom: 5px">
@@ -31,51 +31,63 @@
</div>
<div class="row flex" style="margin-bottom: 8px">
<span class="text-label">主题</span>
<el-input v-model="recipient" class="row-input" />
<el-input v-model="subject" class="row-input" />
</div>
<div
class="row flex"
style="justify-content: flex-start; padding-left: 7.5%; margin-bottom: 5px"
>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/annex_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img src="../img/annex_logo.png" style="width: 14px; height: 14px; margin-right: 3px" />
添加附件
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/annex_logo__orange.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img
src="../img/annex_logo__orange.png"
style="width: 14px; height: 14px; margin-right: 3px"
/>
超大附件
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/photo_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img src="../img/photo_logo.png" style="width: 14px; height: 14px; margin-right: 3px" />
照片
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/document_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img
src="../img/document_logo.png"
style="width: 14px; height: 14px; margin-right: 3px"
/>
文档
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/screenshot_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img
src="../img/screenshot_logo.png"
style="width: 14px; height: 14px; margin-right: 3px"
/>
截屏
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/emoji_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img src="../img/emoji_logo.png" style="width: 14px; height: 14px; margin-right: 3px" />
表情
</div>
<div class="text-button flex" style="margin-right: 10px">
<img src="../img/more_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img src="../img/more_logo.png" style="width: 14px; height: 14px; margin-right: 3px" />
更多
</div>
<div class="text-button flex">
<img src="../img/format_logo.png" style="width: 14px; height: 14px; margin-right: 3px;" />
<img
src="../img/format_logo.png"
style="width: 14px; height: 14px; margin-right: 3px"
/>
格式
</div>
</div>
<div class="row flex" style="flex: 1; align-items: flex-start; margin-bottom: 8px">
<span class="text-label">正文</span>
<el-input v-model="recipient" type="textarea" class="row-input" />
<el-input v-model="content" type="textarea" class="row-input" />
</div>
<div class="row flex" style="justify-content: flex-start; padding-left: 7%">
<div class="text-button" style="margin-right: 8px; color: #000; cursor: default;"
<div class="text-button" style="margin-right: 8px; color: #000; cursor: default"
>发件人{{ `demo<547090564.qq.com>` }}</div
>
<div class="text-divider" style="margin-right: 8px; color: #ccc6bf">|</div>
@@ -83,10 +95,10 @@
</div>
</div>
<div class="btn-line_bottom flex">
<el-button type="info">发送</el-button>
<el-button type="info">定时发送</el-button>
<el-button type="info">存草稿</el-button>
<el-button type="info">关闭</el-button>
<el-button type="info" @click="handleSend">发送</el-button>
<el-button type="info" @click="handleScheduledSend">定时发送</el-button>
<el-button type="info" @click="handleSaveDraft">存草稿</el-button>
<el-button type="info" @click="handleClose">关闭</el-button>
</div>
</div>
</div>
@@ -94,13 +106,107 @@
<script lang="ts" setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import { sendEmailMsg } from '../index'
const name = ref('邮件')
const activeName = ref('common')
const handleClick = (tab: any) => {
activeName.value = tab.paneName.value
}
// 表单数据
const recipient = ref('')
const subject = ref('')
const content = ref('')
// 发送邮件
const handleSend = () => {
if (!recipient.value.trim()) {
ElMessage.warning('请输入收件人')
return
}
if (!subject.value.trim()) {
ElMessage.warning('请输入邮件主题')
return
}
if (!content.value.trim()) {
ElMessage.warning('请输入邮件正文')
return
}
// 保存收件人、主题、正文信息
sendEmailMsg(name.value, '收件人', 'write', 'recipient', recipient.value)
sendEmailMsg(name.value, '邮件主题', 'write', 'subject', subject.value)
sendEmailMsg(name.value, '邮件正文', 'write', 'content', content.value)
ElMessage.success('邮件发送成功!')
// 清空表单
clearForm()
}
// 定时发送
const handleScheduledSend = () => {
if (!recipient.value.trim()) {
ElMessage.warning('请输入收件人')
return
}
if (!subject.value.trim()) {
ElMessage.warning('请输入邮件主题')
return
}
if (!content.value.trim()) {
ElMessage.warning('请输入邮件正文')
return
}
// 保存邮件信息并标记为定时发送
sendEmailMsg(name.value, '定时发送收件人', 'schedule', 'recipient', recipient.value)
sendEmailMsg(name.value, '定时发送主题', 'schedule', 'subject', subject.value)
sendEmailMsg(name.value, '定时发送正文', 'schedule', 'content', content.value)
ElMessage.success('邮件已设置为定时发送!')
clearForm()
}
// 存草稿
const handleSaveDraft = () => {
if (!recipient.value.trim() && !subject.value.trim() && !content.value.trim()) {
ElMessage.warning('请至少填写一项内容')
return
}
// 保存草稿信息
if (recipient.value.trim()) {
sendEmailMsg(name.value, '草稿收件人', 'draft', 'recipient', recipient.value)
}
if (subject.value.trim()) {
sendEmailMsg(name.value, '草稿主题', 'draft', 'subject', subject.value)
}
if (content.value.trim()) {
sendEmailMsg(name.value, '草稿正文', 'draft', 'content', content.value)
}
ElMessage.success('草稿已保存!')
clearForm()
}
// 关闭/取消
const handleClose = () => {
if (recipient.value.trim() || subject.value.trim() || content.value.trim()) {
ElMessage.info('已取消邮件编辑')
}
clearForm()
}
// 清空表单
const clearForm = () => {
recipient.value = ''
subject.value = ''
content.value = ''
}
</script>
<style lang="scss" scoped>

View File

@@ -26,8 +26,8 @@ export function sendEmailMsg(pageName: string, description: string, category: st
// 拼接 content 字符串
const content = `${category}@${key}@${value}`
// 创建数据对象并添加到 store
const data = { contentIn, content };
// 创建数据对象并添加到 store包含scoreRate权值字段默认为空由用户填写
const data = { contentIn, content, scoreRate: '' };
// 为了避免重复,可以先查找并更新,如果不存在再添加
const existingIndex = emailStore.emailFormList.findIndex(item => item.content.startsWith(`${category}@${key}@`));

View File

@@ -147,7 +147,11 @@
prop="contentIn"
width="360px"
/>
<el-table-column label="配置值" align="center" prop="content" width="100px" />
<el-table-column label="值" align="center" prop="scoreRate" width="120px">
<template #default="scope">
<el-input v-model="scope.row.scoreRate" placeholder="请输入权值" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="100px">
<template #default="scope">
<el-button type="primary" link @click="handleDelete(scope.row)">