|
@@ -141,74 +141,62 @@
|
|
|
<el-row :gutter="10" class="mb8">
|
|
|
<el-col :span="1.5">
|
|
|
<el-button
|
|
|
- type="primary"
|
|
|
+ type="info"
|
|
|
plain
|
|
|
- icon="el-icon-plus"
|
|
|
+ icon="el-icon-upload2"
|
|
|
size="mini"
|
|
|
- @click="handleAdd"
|
|
|
- v-hasPermi="['system:file:add']"
|
|
|
- >新增
|
|
|
+ @click="handleImport"
|
|
|
+ v-hasPermi="['system:file:import']"
|
|
|
+ >上传文件
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
<el-col :span="1.5">
|
|
|
<el-button
|
|
|
- type="success"
|
|
|
+ type="warning"
|
|
|
plain
|
|
|
- icon="el-icon-edit"
|
|
|
+ icon="el-icon-download"
|
|
|
size="mini"
|
|
|
- :disabled="single"
|
|
|
- @click="handleUpdate"
|
|
|
- v-hasPermi="['system:file:edit']"
|
|
|
- >修改
|
|
|
+ @click="handleExport"
|
|
|
+ v-hasPermi="['system:file:export']"
|
|
|
+ >导出文件
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
<el-col :span="1.5">
|
|
|
<el-button
|
|
|
- type="danger"
|
|
|
+ type="primary"
|
|
|
plain
|
|
|
icon="el-icon-delete"
|
|
|
size="mini"
|
|
|
- :disabled="multiple"
|
|
|
@click="handleDelete"
|
|
|
v-hasPermi="['system:file:remove']"
|
|
|
- >删除
|
|
|
+ >删除文件
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
<el-col :span="1.5">
|
|
|
<el-button
|
|
|
type="info"
|
|
|
plain
|
|
|
- icon="el-icon-upload2"
|
|
|
- size="mini"
|
|
|
- @click="handleImport"
|
|
|
- v-hasPermi="['system:file:import']"
|
|
|
- >导入
|
|
|
- </el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="1.5">
|
|
|
- <el-button
|
|
|
- type="warning"
|
|
|
- plain
|
|
|
icon="el-icon-download"
|
|
|
size="mini"
|
|
|
- @click="handleExport"
|
|
|
- v-hasPermi="['system:file:export']"
|
|
|
- >导出
|
|
|
+ @click="importTemplate"
|
|
|
+ >下载模板
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
+ <!-- 超级用户上传模板按钮 -->
|
|
|
<el-col :span="1.5">
|
|
|
<el-button
|
|
|
- type="warning"
|
|
|
+ type="success"
|
|
|
plain
|
|
|
- icon="el-icon-refresh"
|
|
|
+ icon="el-icon-upload2"
|
|
|
size="mini"
|
|
|
- @click="handleDingTalk"
|
|
|
- >同步钉钉
|
|
|
+ @click="handleUploadTemplate"
|
|
|
+ >上传模板
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
|
|
|
</el-row>
|
|
|
|
|
|
+<!-- 文件列表 --->
|
|
|
<el-table v-loading="loading" :data="fileList" @selection-change="handleSelectionChange">
|
|
|
<el-table-column type="selection" width="50" align="center"/>
|
|
|
<el-table-column label="文件编号" type="index" width="50" :index="indexMethod" align="center" key="filelId"
|
|
@@ -247,41 +235,18 @@
|
|
|
class-name="small-padding fixed-width"
|
|
|
>
|
|
|
<template #default="scope">
|
|
|
- <div v-if="scope.row.fileId !== 1">
|
|
|
- <el-button
|
|
|
- size="mini"
|
|
|
- type="text"
|
|
|
- icon="el-icon-edit"
|
|
|
- @click="handleUpdate(scope.row)"
|
|
|
- v-hasPermi="['system:file:edit']"
|
|
|
- >修改
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- size="mini"
|
|
|
- type="text"
|
|
|
- icon="el-icon-delete"
|
|
|
- @click="handleDelete(scope.row)"
|
|
|
- v-hasPermi="['system:file:remove']"
|
|
|
- >删除
|
|
|
- </el-button>
|
|
|
- <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)"
|
|
|
- v-hasPermi="['system:file:resetPwd', 'system:file:edit']">
|
|
|
- <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
|
|
|
- <template #dropdown>
|
|
|
- <el-dropdown-menu>
|
|
|
- <el-dropdown-item command="handleResetPwd" icon="el-icon-key"
|
|
|
- v-hasPermi="['system:file:resetPwd']">重置密码
|
|
|
- </el-dropdown-item>
|
|
|
- <el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check"
|
|
|
- v-hasPermi="['system:file:edit']">分配角色
|
|
|
- </el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </template>
|
|
|
- </el-dropdown>
|
|
|
- </div>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-download"
|
|
|
+ @click="handleDownload(scope.row)"
|
|
|
+ v-hasPermi="['system:file:remove']"
|
|
|
+ >下载
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+ <!-- 分页 -->
|
|
|
<pagination
|
|
|
v-show="total>0"
|
|
|
:total="total"
|
|
@@ -362,12 +327,13 @@
|
|
|
<el-upload
|
|
|
ref="upload"
|
|
|
:limit="1"
|
|
|
- accept=".xlsx, .xls,.pdf,.docx"
|
|
|
+ accept="allowedFileTypes.join(',')"
|
|
|
:headers="upload.headers"
|
|
|
:action="upload.url + '?updateSupport=' + upload.updateSupport"
|
|
|
:disabled="upload.isUploading"
|
|
|
:on-progress="handleFileUploadProgress"
|
|
|
:on-success="handleFileSuccess"
|
|
|
+ :on-error="handleFileError"
|
|
|
:auto-upload="false"
|
|
|
drag
|
|
|
>
|
|
@@ -378,10 +344,7 @@
|
|
|
<el-checkbox v-model="upload.updateSupport"/>
|
|
|
是否更新已经存在的文件数据
|
|
|
</div>
|
|
|
- <span>仅允许导入xls、xlsx格式文件。</span>
|
|
|
- <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
|
|
|
- @click="importTemplate">下载模板
|
|
|
- </el-link>
|
|
|
+ <span>仅允许导入{{ allowedFileTypes.join('、') }}格式文件。</span>
|
|
|
</div>
|
|
|
</el-upload>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
@@ -393,18 +356,15 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {
|
|
|
- initDingTalk
|
|
|
-} from "@/api/system/user";
|
|
|
import {getToken} from "@/utils/auth";
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
import {addFolder, delFolder, folderTreeSelect, getFolder, updateFolder,checkFolderDeletable} from "@/api/system/folder";
|
|
|
-import {addFile, delFile, getFile, listFile, updateFile} from "@/api/system/file";
|
|
|
+import {addFile, delFile, download, listFile, updateFile} from "@/api/system/file";
|
|
|
import dict from "@/utils/dict";
|
|
|
import {parseTime} from "@/utils/xzl";
|
|
|
import {updateFileStatus} from "@/api/system/file";
|
|
|
-
|
|
|
+import {saveAs} from "file-saver";
|
|
|
|
|
|
export default {
|
|
|
name: "File",
|
|
@@ -444,6 +404,8 @@ export default {
|
|
|
levels: [],
|
|
|
// 新增字段:用于缓存选中的文件夹ID
|
|
|
selectedFolderId: null,
|
|
|
+ // 文件上传参数
|
|
|
+ allowedFileTypes: ['.xlsx', '.xls', '.pdf', '.docx'],
|
|
|
// 表单参数
|
|
|
form: {
|
|
|
fileId: null,
|
|
@@ -639,24 +601,6 @@ export default {
|
|
|
break;
|
|
|
}
|
|
|
},
|
|
|
- /** 新增按钮操作 */
|
|
|
- handleAdd() {
|
|
|
- this.reset();
|
|
|
- if (this.selectedFolderId) {
|
|
|
- this.form.folderId = this.selectedFolderId;
|
|
|
- }
|
|
|
- this.open = true;
|
|
|
- this.title = "添加文件";
|
|
|
- },
|
|
|
- /** 修改按钮操作 */
|
|
|
- handleUpdate(row) {
|
|
|
- this.reset();
|
|
|
- getFolder(row.fileId).then(res => {
|
|
|
- this.form = res.data;
|
|
|
- this.open = true;
|
|
|
- this.title = '修改文件';
|
|
|
- });
|
|
|
- },
|
|
|
/** 提交按钮 */
|
|
|
submitForm() {
|
|
|
this.$refs['form'].validate(valid => {
|
|
@@ -677,31 +621,44 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- /** 删除按钮操作 */
|
|
|
- handleDelete(row) {
|
|
|
- const ids = row.fileId || this.ids;
|
|
|
- this.$modal.confirm(`是否确认删除文件编号为"${ids}"的数据项?`).then(() => {
|
|
|
- delFile(ids).then(() => {
|
|
|
- this.getList();
|
|
|
- this.$modal.msgSuccess('删除成功');
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
/** 导出按钮操作 */
|
|
|
handleExport() {
|
|
|
this.download('system/folder/export', {
|
|
|
...this.queryParams
|
|
|
}, `file_${new Date().getTime()}.xlsx`)
|
|
|
},
|
|
|
- handleDingTalk() {
|
|
|
- initDingTalk().then(res => {
|
|
|
- this.$modal.msgSuccess("同步成功");
|
|
|
- })
|
|
|
- },
|
|
|
/** 导入按钮操作 */
|
|
|
handleImport() {
|
|
|
+ if (!this.selectedFolderId) {
|
|
|
+ this.$message.warning('请先选择一个文件夹');
|
|
|
+ return;
|
|
|
+ }
|
|
|
this.upload.title = "文件导入";
|
|
|
this.upload.open = true;
|
|
|
+ this.$refs.upload.clearFiles();
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 提交文件表单 */
|
|
|
+ async submitFileForm() {
|
|
|
+ const fileList = this.$refs.upload.uploadFiles;
|
|
|
+ if (fileList.length === 0) {
|
|
|
+ this.$message.warning('请选择要上传的文件');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ const file = fileList[0];
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('file', file.raw);
|
|
|
+ formData.append('updateSupport', this.upload.updateSupport);
|
|
|
+ formData.append('folderId', this.selectedFolderId);
|
|
|
+ this.upload.isUploading = true;
|
|
|
+ try {
|
|
|
+ const response = await addFile(formData);
|
|
|
+ this.handleFileSuccess(response, file, fileList);
|
|
|
+ } catch (error) {
|
|
|
+ this.handleFileError(error, file, fileList);
|
|
|
+ } finally {
|
|
|
+ this.upload.isUploading = false;
|
|
|
+ }
|
|
|
},
|
|
|
/** 下载模板操作 */
|
|
|
importTemplate() {
|
|
@@ -714,46 +671,33 @@ export default {
|
|
|
// 文件上传成功处理
|
|
|
handleFileSuccess(response, file, fileList) {
|
|
|
this.upload.open = false;
|
|
|
- this.upload.isUploading = false;
|
|
|
this.$refs.upload.clearFiles();
|
|
|
- this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", {dangerouslyUseHTMLString: true});
|
|
|
- this.getList();
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.$message.success('文件导入成功');
|
|
|
+ this.getList();
|
|
|
+ } else {
|
|
|
+ this.$message.error(response.msg || '文件导入失败');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleFileError(error, file, fileList) {
|
|
|
+ this.$message.error('文件上传失败,请重试');
|
|
|
},
|
|
|
getFolderName(row, column, cellValue, index) {
|
|
|
return row.folderName
|
|
|
- // if (!cellValue) {
|
|
|
- // return '根目录';
|
|
|
- // }
|
|
|
- //
|
|
|
- // // 如果已缓存,直接返回
|
|
|
- // if (this.parentFolderCache[cellValue]) {
|
|
|
- // return this.parentFolderCache[cellValue];
|
|
|
- // }
|
|
|
- //
|
|
|
- // try {
|
|
|
- // const response = await getFileParentName(cellValue); // 调用接口获取父文件夹名
|
|
|
- // const folderName = response.data || '未知';
|
|
|
- //
|
|
|
- // // 缓存结果
|
|
|
- // this.parentFolderCache[cellValue] = folderName;
|
|
|
- // return folderName;
|
|
|
- // } catch (error) {
|
|
|
- // console.error(`获取父文件夹名称失败(文件夹ID: ${cellValue})`, error);
|
|
|
- // return '错误';
|
|
|
- // }
|
|
|
},
|
|
|
indexMethod(index) {
|
|
|
// 支持分页:当前页码 * 每页条数 + 当前行索引
|
|
|
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + index + 1;
|
|
|
},
|
|
|
|
|
|
+ // 新增文件夹
|
|
|
handleAddFolder(data) {
|
|
|
this.$prompt('请输入新文件夹名称', '新增文件夹', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
inputPattern: /.+/,
|
|
|
inputErrorMessage: '文件夹名称不能为空'
|
|
|
- }).then(({ value }) => {
|
|
|
+ }).then(({value}) => {
|
|
|
const newFolder = {
|
|
|
parentId: data.id,
|
|
|
folderName: value
|
|
@@ -767,6 +711,7 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
|
|
|
+ // 获取文件夹层级
|
|
|
getLevel(folderId) {
|
|
|
if (this.levels[folderId] !== undefined) {
|
|
|
return this.levels[folderId];
|
|
@@ -779,22 +724,24 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
|
|
|
- handleUpdateFolderName(data){
|
|
|
+ // 修改文件夹名称
|
|
|
+ handleUpdateFolderName(data) {
|
|
|
this.$prompt('请输入新的文件夹名称', '修改文件夹', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
inputValue: data.label,
|
|
|
inputPattern: /.+/,
|
|
|
inputErrorMessage: '文件夹名称不能为空'
|
|
|
- }).then(({ value }) => {
|
|
|
- updateFolder({ folderId: data.id, folderName: value }).then(() => {
|
|
|
+ }).then(({value}) => {
|
|
|
+ updateFolder({folderId: data.id, folderName: value}).then(() => {
|
|
|
this.$modal.msgSuccess("修改成功");
|
|
|
this.getFileTree(); // 刷新树
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
|
|
|
- handleDeleteFolder(data){
|
|
|
+ // 删除文件夹
|
|
|
+ handleDeleteFolder(data) {
|
|
|
this.$confirm(`是否确认删除文件夹 “${data.label}”?`, '提示', {
|
|
|
type: 'warning'
|
|
|
}).then(() => {
|
|
@@ -826,6 +773,36 @@ export default {
|
|
|
}).catch(() => {
|
|
|
this.$message.info("操作已取消");
|
|
|
});
|
|
|
+ },
|
|
|
+ handleDelete() {
|
|
|
+ if (this.ids.length === 0) {
|
|
|
+ this.$message.warning('您未选择文件,请选择要删除的文件');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ delFile(this.ids).then(() => {
|
|
|
+ this.$modal.msgSuccess("删除成功");
|
|
|
+ this.getList(); // 刷新文件列表
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async handleDownload(row) {
|
|
|
+ if (!row || !row.fileId) {
|
|
|
+ this.$message.error('文件 ID 无效,无法下载')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ this.loading = true
|
|
|
+ const response = await download(row.fileId)
|
|
|
+ if (response.status === 200) {
|
|
|
+ const blob = new Blob([response.data], {type: 'application/octet-stream'})
|
|
|
+ saveAs(blob, row.fileName)
|
|
|
+ this.$message.success('文件下载成功')
|
|
|
+ } else {
|
|
|
+ this.$message.error('文件下载失败,响应状态码异常')
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('文件下载出错:', error)
|
|
|
+ this.$message.error('文件下载失败,请重试')
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
};
|