feat(F006): 资讯列表封面上传 2M→5M + 内容改富文本编辑器(RichEditor, 支持图文粘贴)

package-lock.json

@@ -9,6 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "@element-plus/icons-vue": "^2.3.1",
+        "@vueup/vue-quill": "^1.5.5",
         "axios": "^1.6.7",
         "dayjs": "^1.11.10",
         "echarts": "^5.5.0",
@@ -1489,6 +1490,19 @@
       "integrity": "sha512-FTW0AFZNaK5/mOqvGBwVfUlNLU38TiQn4+DQgIFUnrBBJQ1crMJ82yeGQLV5jyKFsO8yRukpbuP7x+nRbH6aug==",
       "license": "MIT"
     },
+    "node_modules/@vueup/vue-quill": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@vueup/vue-quill/-/vue-quill-1.5.5.tgz",
+      "integrity": "sha512-ygA61ZZPaRzTHXi8H1w5td1XCtjwRsO6oBuJHdCbfotGQ7hBQukVp5dsYeVXWKuSiF8hGDKwIlROyNNrMalQCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "quill": "2.0.2 || >=2.0.4 <3",
+        "quill-delta": "^5.1.0"
+      },
+      "peerDependencies": {
+        "vue": "^3.2.41"
+      }
+    },
     "node_modules/@vueuse/core": {
       "version": "14.3.0",
       "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-14.3.0.tgz",
@@ -1938,6 +1952,12 @@
       "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
       "license": "MIT"
     },
+    "node_modules/eventemitter3": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz",
+      "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==",
+      "license": "MIT"
+    },
     "node_modules/exsolve": {
       "version": "1.0.8",
       "resolved": "https://registry.npmmirror.com/exsolve/-/exsolve-1.0.8.tgz",
@@ -1945,6 +1965,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/fast-diff": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz",
+      "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==",
+      "license": "Apache-2.0"
+    },
     "node_modules/fast-glob": {
       "version": "3.3.3",
       "resolved": "https://registry.npmmirror.com/fast-glob/-/fast-glob-3.3.3.tgz",
@@ -2285,6 +2311,19 @@
         "lodash-es": "*"
       }
     },
+    "node_modules/lodash.clonedeep": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==",
+      "license": "MIT"
+    },
+    "node_modules/lodash.isequal": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+      "deprecated": "This package is deprecated. Use require('node:util').isDeepStrictEqual instead.",
+      "license": "MIT"
+    },
     "node_modules/magic-string": {
       "version": "0.30.21",
       "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.30.21.tgz",
@@ -2463,6 +2502,12 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/parchment": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/parchment/-/parchment-3.0.0.tgz",
+      "integrity": "sha512-HUrJFQ/StvgmXRcQ1ftY6VEZUq3jA2t9ncFN4F84J/vN0/FPpQF+8FKXb3l6fLces6q0uOHj6NJn+2xvZnxO6A==",
+      "license": "BSD-3-Clause"
+    },
     "node_modules/path-browserify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/path-browserify/-/path-browserify-1.0.1.tgz",
@@ -2627,6 +2672,35 @@
       ],
       "license": "MIT"
     },
+    "node_modules/quill": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/quill/-/quill-2.0.2.tgz",
+      "integrity": "sha512-QfazNrhMakEdRG57IoYFwffUIr04LWJxbS/ZkidRFXYCQt63c1gK6Z7IHUXMx/Vh25WgPBU42oBaNzQ0K1R/xw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "eventemitter3": "^5.0.1",
+        "lodash-es": "^4.17.21",
+        "parchment": "^3.0.0",
+        "quill-delta": "^5.1.0"
+      },
+      "engines": {
+        "npm": ">=8.2.3"
+      }
+    },
+    "node_modules/quill-delta": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-5.1.0.tgz",
+      "integrity": "sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-diff": "^1.3.0",
+        "lodash.clonedeep": "^4.5.0",
+        "lodash.isequal": "^4.5.0"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      }
+    },
     "node_modules/readdirp": {
       "version": "5.0.0",
       "resolved": "https://registry.npmmirror.com/readdirp/-/readdirp-5.0.0.tgz",

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.1",
+    "@vueup/vue-quill": "^1.5.5",
     "axios": "^1.6.7",
     "dayjs": "^1.11.10",
     "echarts": "^5.5.0",

src/components/RichEditor/RichEditor.vue

@@ -0,0 +1,146 @@
+<template>
+  <div class="rich-editor">
+    <quill-editor
+      ref="editorRef"
+      v-model:content="model"
+      :options="options"
+      content-type="html"
+      class="quill-editor-area"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, nextTick } from "vue"
+import { Quill, QuillEditor } from "@vueup/vue-quill"
+import "@vueup/vue-quill/dist/vue-quill.snow.css"
+
+const model = defineModel<string>({ default: "" })
+
+const editorRef = ref<any>(null)
+let quill: any = null
+
+// === 图片上传 handler (支持多选, 5MB) ===
+const imageHandler = () => {
+  const input = document.createElement("input")
+  input.type = "file"
+  input.accept = "image/*"
+  input.multiple = true
+  input.click()
+  input.onchange = async () => {
+    const files = input.files ? Array.from(input.files) : []
+    if (!files.length) return
+    try {
+      const urls = await Promise.all(files.map(uploadFile))
+      const quillNow = quill || editorRef.value?.getQuill()
+      if (!quillNow) return
+      const sel = quillNow.getSelection(true)
+      let idx = sel ? sel.index : quillNow.getLength()
+      urls.forEach((url) => {
+        quillNow.insertEmbed(idx, "image", url)
+        quillNow.insertText(idx + 1, "\n", "api")
+        idx += 2
+      })
+      quillNow.setSelection(idx)
+    } catch (e: any) {
+      console.error("图片上传失败:", e)
+      alert(e?.message || "图片上传失败，请重试")
+    }
+  }
+}
+
+// === 单文件上传 (admin_new: /api 前缀 + access_token) ===
+async function uploadFile(file: File): Promise<string> {
+  if (file.size > 5 * 1024 * 1024) throw new Error("图片大小不能超过5MB，请压缩后重试")
+  const fd = new FormData()
+  fd.append("file", file)
+  const token = localStorage.getItem("access_token") || ""
+  let resp: Response
+  try {
+    resp = await fetch("/api/sys/file/upload", { method: "POST", headers: { Authorization: `Bearer ${token}` }, body: fd })
+  } catch {
+    throw new Error("图片上传失败，请检查网络后重试")
+  }
+  if (resp.status === 413) {
+    throw new Error("图片超过大小限制（5MB），请压缩后重试")
+  }
+  const data = await resp.json()
+  if (data.code === 0) return data?.data?.url || data?.url || ""
+  throw new Error(data.msg || "图片上传失败")
+}
+
+// === Quill 配置 ===
+const options = ref({
+  theme: "snow",
+  modules: {
+    toolbar: {
+      container: [
+        ["bold", "italic", "underline", "strike"],
+        [{ color: [] }, { background: [] }],
+        [{ align: [] }],
+        [{ size: ["small", false, "large", "huge"] }],
+        [{ font: [] }],
+        [{ header: [1, 2, 3, 4, 5, 6, false] }],
+        [{ indent: "-1" }, { indent: "+1" }],
+        [{ list: "ordered" }, { list: "bullet" }],
+        [{ script: "sub" }, { script: "super" }],
+        ["blockquote", "code-block"],
+        ["clean"],
+        ["link", "image", "video"],
+      ],
+      handlers: {
+        image: imageHandler,
+      },
+    },
+  },
+})
+
+// === 工具栏中文提示 ===
+const titleConfig: { Choice: string; title: string }[] = [
+  { Choice: ".ql-bold", title: "加粗" },
+  { Choice: ".ql-italic", title: "斜体" },
+  { Choice: ".ql-underline", title: "下划线" },
+  { Choice: ".ql-strike", title: "删除线" },
+  { Choice: ".ql-blockquote", title: "块引用" },
+  { Choice: ".ql-code-block", title: "插入代码段" },
+  { Choice: ".ql-font", title: "字体" },
+  { Choice: ".ql-size", title: "字体大小" },
+  { Choice: ".ql-list[value=\"ordered\"]", title: "编号列表" },
+  { Choice: ".ql-list[value=\"bullet\"]", title: "项目列表" },
+  { Choice: ".ql-header", title: "标题" },
+  { Choice: ".ql-align", title: "对齐方式" },
+  { Choice: ".ql-color", title: "字体颜色" },
+  { Choice: ".ql-background", title: "背景颜色" },
+  { Choice: ".ql-image", title: "图片(支持多选)" },
+  { Choice: ".ql-video", title: "视频" },
+  { Choice: ".ql-link", title: "添加链接" },
+  { Choice: ".ql-clean", title: "清除格式" },
+  { Choice: ".ql-script[value=\"sub\"]", title: "下标" },
+  { Choice: ".ql-script[value=\"super\"]", title: "上标" },
+  { Choice: ".ql-indent[value=\"-1\"]", title: "向左缩进" },
+  { Choice: ".ql-indent[value=\"+1\"]", title: "向右缩进" },
+]
+
+onMounted(() => nextTick(initTitle))
+
+function initTitle() {
+  for (const item of titleConfig) {
+    const el = document.querySelector(`.rich-editor ${item.Choice}`) as HTMLElement | null
+    if (el) el.setAttribute("title", item.title)
+  }
+}
+</script>
+
+<style scoped>
+.rich-editor :deep(.ql-toolbar) {
+  border-radius: 6px 6px 0 0;
+}
+.rich-editor :deep(.ql-container) {
+  min-height: 280px;
+  font-size: 14px;
+  border-radius: 0 0 6px 6px;
+}
+.rich-editor :deep(.ql-editor) {
+  min-height: 280px;
+}
+</style>

src/modules/other/information/InformationListView.vue

@@ -14,6 +14,7 @@ import { httpGet, httpPost, httpDelete } from '@/utils/request'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import DataTable from '@/components/DataTable/DataTable.vue'
 import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import RichEditor from '@/components/RichEditor/RichEditor.vue'
 
 interface Info {
   id: string
@@ -152,7 +153,7 @@ async function onDelete(row: Info) {
 // === 图片上传 (FormData + Bearer 头由拦截器自动带) ===
 async function customUpload(opt: any) {
   const file = opt.file as File
-  if (file.size > 2 * 1024 * 1024) { ElMessage.error('图片大小不能超过 2MB!'); return }
+  if (file.size > 5 * 1024 * 1024) { ElMessage.error('图片大小不能超过 5MB，请压缩后重试'); return }
   uploadLoading.value = true
   try {
     const fd = new FormData()
@@ -235,11 +236,11 @@ async function customUpload(opt: any) {
               <img v-if="editForm.images" :src="editForm.images" alt="封面" class="upload-preview" referrerpolicy="no-referrer" />
               <el-button v-else :loading="uploadLoading">上传封面</el-button>
             </el-upload>
-            <span class="rr-muted">支持 JPG/PNG, 不超过 2MB</span>
+            <span class="rr-muted">支持 JPG/PNG, 不超过 5MB</span>
           </div>
         </el-form-item>
         <el-form-item label="资讯内容">
-          <el-input v-model="editForm.content" type="textarea" :rows="8" placeholder="资讯内容(支持 HTML)" maxlength="20000" />
+          <RichEditor v-model="editForm.content" style="margin-bottom: 8px" />
         </el-form-item>
       </el-form>
       <template #footer>

src/modules/user/enterprise/EnterpriseDetailView.vue

@@ -34,6 +34,7 @@ const enterpriseId = computed(() => String(route.params.id || ''))
 const loading = ref(false)
 const activeTab = ref('basic')
 const detail = ref<any>({})
+function isPdfUrl(u: string) { return (u || '').toLowerCase().endsWith('.pdf') }
 const otherList = ref<any[]>([])
 const performanceList = ref<any[]>([])
 
@@ -486,7 +487,14 @@ onMounted(load)
                 </div>
               </div>
               <div v-if="cert.imageList?.length" class="cert-imgs">
-                <el-image v-for="(img, j) in cert.imageList" :key="j" :src="img" fit="cover" class="cert-thumb" :preview-src-list="cert.imageList" preview-teleported />
+                <template v-for="(img, j) in cert.imageList" :key="j">
+                  <a v-if="isPdfUrl(img)" :href="img" target="_blank" rel="noopener"
+                    class="pdf-card" :title="'打开 PDF 文件'">
+                    <el-icon style="font-size:22px;color:#e34d4d"><Document /></el-icon>
+                    <span style="font-size:11px;font-weight:bold;color:#e34d4d">PDF</span>
+                  </a>
+                  <el-image v-else :src="img" fit="cover" class="cert-thumb" :preview-src-list="[img]" preview-teleported />
+                </template>
               </div>
             </div>
           </div>
@@ -744,6 +752,8 @@ onMounted(load)
 .cert-row .label { min-width: 76px; }
 .cert-imgs { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
 .cert-thumb { width: 96px; height: 120px; border-radius: 6px; border: 1px solid var(--border); cursor: zoom-in; }
+.pdf-card { width: 96px; height: 120px; border-radius: 6px; background: #fef2f2; border: 1px solid #fecaca; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; text-decoration: none; }
+.pdf-card:hover { border-color: #fca5a5; background: #fee2e2; }
 
 /* ===== 履约 ===== */
 .kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }