From 38196f101433c36e500110e82a90c7847302f2f3 Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Sat, 28 Jun 2025 11:02:48 +0800
Subject: [PATCH] feat:帮助中心文件上传
---
src/views/system/helpCenter.vue | 59 +++++++++++++++++++++++++++++++++++++++--------------------
1 files changed, 39 insertions(+), 20 deletions(-)
diff --git a/src/views/system/helpCenter.vue b/src/views/system/helpCenter.vue
index db6daea..4a22519 100644
--- a/src/views/system/helpCenter.vue
+++ b/src/views/system/helpCenter.vue
@@ -2,10 +2,10 @@
<basic-container>
<div class="helpContainer">
<el-table
- class="custom-table"
+ class="custom-table"
:data="tableData"
style="width: 100%"
- :row-class-name="tableRowClassName"
+ :row-class-name="tableRowClassName"
>
<el-table-column label="序号" type="index" width="100">
<template #default="{ $index }">
@@ -19,7 +19,14 @@
<el-table-column label="操作" width="150" align="center">
<template #default="scope">
<span class="look">查看</span>
- <span class="uploads">上传</span>
+ <el-upload
+ style="display: inline-block"
+ :show-file-list="false"
+ :before-upload="onUploadFileBefore"
+ :limit="1"
+ >
+ <span class="uploads">上传</span>
+ </el-upload>
</template>
</el-table-column>
</el-table>
@@ -28,6 +35,8 @@
</template>
<script setup>
+import { uploadFileAPI } from '@/api/helpCenter/helpCenter';
+import { ElMessage } from 'element-plus';
const helpData = ref([{}]);
const tableData = [
{
@@ -63,27 +72,37 @@
return 'success-row';
}
};
+const onUploadFileBefore = file => {
+const fileFormat = file.name.split('.')[1]
+ if (fileFormat !== 'pdf') return ElMessage.error('请上传pdf格式的文件')
+ const formData = new FormData();
+ formData.append('file',file, file.name);
+ uploadFileAPI(formData)
+ .then(res => {
+ if (res.data.code !== 200) return ElMessage.error('上传失败')
+ ElMessage.success('上传成功')
+
+ })
+};
</script>
<style lang="scss">
.helpContainer {
-.el-table .success-row {
- --el-table-tr-bg-color: #fff;
-}
-.el-table .warning-row {
-
+ .el-table .success-row {
+ --el-table-tr-bg-color: #fff;
+ }
+ .el-table .warning-row {
--el-table-tr-bg-color: #f3f6ff;
+ }
}
-}
-
</style>
<style scoped lang="scss">
/* 表头样式 */
.custom-table :deep(.el-table__header) th {
height: 70px;
- font-family: Source Han Sans CN, Source Han Sans CN;
-font-weight: bold;
-font-size: 14px;
-color: #49556E;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: bold;
+ font-size: 14px;
+ color: #49556e;
background-color: #f3f6ff;
text-align: center;
}
@@ -91,14 +110,14 @@
/* 行样式 */
.custom-table :deep(.el-table__body) tr {
height: 70px;
- font-family: Source Han Sans CN, Source Han Sans CN;
-font-weight: 400;
-font-size: 14px;
-color: #363636;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 400;
+ font-size: 14px;
+ color: #363636;
text-align: center;
}
-.custom-table :deep(.el-table__body) td.el-table__cell{
-text-align: center;
+.custom-table :deep(.el-table__body) td.el-table__cell {
+ text-align: center;
}
.helpContainer {
height: 100%;
--
Gitblit v1.9.3