feat(article-management): 增加文章附件上传功能

- 在文章管理页面添加公告附件列表
- 实现附件上传和展示功能- 优化 Tinymce 组件,支持附件上传事件
This commit is contained in:
dj
2025-04-11 18:21:43 +08:00
parent ad6d7af1a3
commit 5cf2e4d208
3 changed files with 29 additions and 5 deletions

View File

@@ -27,10 +27,26 @@
</el-col>
<el-col :span="24" style="margin-left: 10px">
<el-form-item label="文章内容" prop="articleContent">
<Tinymce v-model:value="formData.articleContent" imageUrl="/workflow/process/file/upload" :height="500" v-if="showTinymce" :toolbar="['undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image axupimgs']" />
<Tinymce v-model:value="formData.articleContent" @getFiles="getFiles" imageUrl="/workflow/process/file/upload" :height="500" v-if="showTinymce" :toolbar="['undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image axupimgs']" />
</el-form-item>
</el-col>
<el-col :span="24" style="margin-left:90px;">
<el-form-item label="公告附件列表" prop="" style="display: flex;flex-direction: column;justify-content: flex-start;">
<template #label>
<div style="width: 100%;display: flex;align-items: center;justify-content: flex-start">
<el-icon size="16"><Paperclip /></el-icon>公告附件列表
</div>
</template>
<el-col :span="24" style="margin-left: -15px">
<div style="display: flex;flex-direction: column">
<div v-for="(item,index) in articleFile" style="display: flex;align-items: center">
{{index+1}}{{item.originalFilename}}<el-icon size="18" style="margin-left: 30px" color="#84cdfd"><CircleClose /></el-icon>
</div>
</div>
</el-col>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="oper-page-btn">
@@ -54,6 +70,7 @@ const loading = ref(false)
const showTinymce = ref(true)
const fundForm = ref()
const formData = ref({})
const articleFile = ref({})
const routerName = ref(router.currentRoute.value.name)
const rules = reactive({
articleTitle: [{required: true, message: '请输入文章标题', trigger: ['blur', 'change']}],
@@ -64,7 +81,10 @@ const rules = reactive({
const handleBack = () => {
history.back()
}
const getFiles=(filelist)=>{
console.log("🚀 ~ file:filelist ", filelist)
articleFile.value=filelist
}
const submitParam = (item) => {
return {
articleContent: item.articleContent,

View File

@@ -10,7 +10,7 @@
<el-row gutter="20">
<el-col :span="24">
<el-form-item>
<div class="article-a" v-html="formData.articleContent" @click="clickHandle"></div>
<!-- <div class="article-a" v-html="formData.articleContent" @click="clickHandle"></div>-->
</el-form-item>
</el-col>
</el-row>
@@ -43,7 +43,7 @@ const clickHandle = (e) => {
fileName
}
// handleDownload(fileId,fileName)
download(item)
// download(item)
// }else {
// e.preventDefault()
// }