| | |
|---|
| | | :show-file-list="true" |
|---|
| | | > |
|---|
| | | <el-button type="primary">上传</el-button> |
|---|
| | | <template #file="{ file }"> |
|---|
| | | <div style="display:flex; align-items:center; gap: 10px; width: 100%;"> |
|---|
| | | <span style="flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"> |
|---|
| | | {{ file.name }} |
|---|
| | | </span> |
|---|
| | | <div style="display:flex; align-items:center; gap: 6px;"> |
|---|
| | | <el-button link type="success" :icon="Download" @click="handleDownload(file)" /> |
|---|
| | | <el-button link type="primary" :icon="View" @click="handlePreview(file)" /> |
|---|
| | | <el-button link type="danger" :icon="Delete" @click="triggerRemoveFile(file)" /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <template #tip> |
|---|
| | | <div class="el-upload__tip"> |
|---|
| | | 支持文档（doc, docx, xls, xlsx, pdf, txt）和图片（jpg, jpeg, png, gif）格式 |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </FormDialog> |
|---|
| | | <filePreview ref="filePreviewRef" /> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script setup> |
|---|
| | | import { Search } from "@element-plus/icons-vue"; |
|---|
| | | import { Search, Download, View, Delete } from "@element-plus/icons-vue"; |
|---|
| | | import { onMounted, ref, reactive, toRefs, getCurrentInstance, computed, watch } from "vue"; |
|---|
| | | import { ElMessage, ElMessageBox } from "element-plus"; |
|---|
| | | import PIMTable from "@/components/PIMTable/PIMTable.vue"; |
|---|
| | | import FormDialog from '@/components/Dialog/FormDialog.vue'; |
|---|
| | | import filePreview from '@/components/filePreview/index.vue' |
|---|
| | | import { listKnowledgeBase, delKnowledgeBase,addKnowledgeBase,updateKnowledgeBase, delKnowledgeBaseFile } from "@/api/collaborativeApproval/knowledgeBase.js"; |
|---|
| | | import useUserStore from '@/store/modules/user'; |
|---|
| | | import { userListNoPageByTenantId } from '@/api/system/user.js'; |
|---|
| | |
|---|
| | | |
|---|
| | | // 表单引用 |
|---|
| | | const formRef = ref(); |
|---|
| | | const fileUpload = ref() |
|---|
| | | const filePreviewRef = ref() |
|---|
| | | // 用户相关 |
|---|
| | | const userStore = useUserStore(); |
|---|
| | | const userList = ref([]); |
|---|
| | | |
|---|
| | | const normalizeKnowledgeFiles = (files = []) => { |
|---|
| | | const list = Array.isArray(files) ? files : [] |
|---|
| | | return list.map((f, index) => { |
|---|
| | | const name = f?.name || f?.originalName || f?.fileName || '' |
|---|
| | | const url = f?.url || f?.path || '' |
|---|
| | | return { |
|---|
| | | ...f, |
|---|
| | | name, |
|---|
| | | url, |
|---|
| | | uid: f?.uid || f?.id || `${Date.now()}_${index}`, |
|---|
| | | status: f?.status || 'success', |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | const getUploadFileUrl = (file) => { |
|---|
| | | return file?.url || file?.response?.data?.tempPath || file?.response?.data?.url |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 表格列配置 |
|---|
| | | const tableColumn = ref([ |
|---|
| | |
|---|
| | | }); |
|---|
| | | } else if (type === "edit" && row) { |
|---|
| | | dialogTitle.value = "编辑知识"; |
|---|
| | | fileList.value = row.files || []; |
|---|
| | | const existingFiles = row.files || row.commonFileList || []; |
|---|
| | | const normalizedFiles = normalizeKnowledgeFiles(existingFiles); |
|---|
| | | fileList.value = normalizedFiles; |
|---|
| | | Object.assign(form.value, { |
|---|
| | | id: row.id, |
|---|
| | | title: row.title, |
|---|
| | |
|---|
| | | keyPoints: row.keyPoints, |
|---|
| | | creator: row.creator, |
|---|
| | | usageCount: row.usageCount, |
|---|
| | | files: row.files || [], |
|---|
| | | files: normalizedFiles.map(f => ({ |
|---|
| | | id: f.id, |
|---|
| | | tempId: f.tempId, |
|---|
| | | name: f.name, |
|---|
| | | url: f.url, |
|---|
| | | uid: f.uid |
|---|
| | | })), |
|---|
| | | |
|---|
| | | }); |
|---|
| | | } |
|---|
| | |
|---|
| | | if (!form.value.files) { |
|---|
| | | form.value.files = []; |
|---|
| | | } |
|---|
| | | form.value.files.push({url:res.data.tempPath,name:res.data.originalName}); |
|---|
| | | file.tempId = res?.data?.tempId |
|---|
| | | file.url = res?.data?.tempPath || res?.data?.url |
|---|
| | | file.name = res?.data?.originalName || file?.name |
|---|
| | | form.value.files.push({ |
|---|
| | | tempId: file.tempId, |
|---|
| | | url: file.url, |
|---|
| | | name: file.name, |
|---|
| | | uid: file.uid, |
|---|
| | | }); |
|---|
| | | proxy.$modal.msgSuccess("上传成功"); |
|---|
| | | } else { |
|---|
| | | proxy.$modal.msgError(res.msg); |
|---|
| | | proxy.$refs.fileUpload.handleRemove(file); |
|---|
| | | fileUpload.value?.handleRemove?.(file) || proxy.$refs.fileUpload?.handleRemove?.(file); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // 移除文件 |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 文件预览/下载 |
|---|
| | | const handleDownload = (file) => { |
|---|
| | | const url = getUploadFileUrl(file) |
|---|
| | | if (!url) return |
|---|
| | | proxy?.$modal?.loading?.("正在下载文件，请稍候...") |
|---|
| | | proxy.$download.name(url); |
|---|
| | | proxy?.$modal?.closeLoading?.() |
|---|
| | | } |
|---|
| | | |
|---|
| | | function handlePreview(file) { |
|---|
| | | // 创建一个隐藏的a标签来触发下载 |
|---|
| | | proxy.$download.name(file.url); |
|---|
| | | const url = getUploadFileUrl(file) |
|---|
| | | if (!url) return |
|---|
| | | filePreviewRef.value?.open?.(url) |
|---|
| | | } |
|---|
| | | |
|---|
| | | function triggerRemoveFile(file) { |
|---|
| | | fileUpload.value?.handleRemove?.(file) || proxy.$refs.fileUpload?.handleRemove?.(file); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 提交知识表单 |
|---|
