bonus
/
bonus-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

电子档案上传

This commit is contained in:
zzyuan 2024-12-31 17:48:52 +08:00
parent 8c32e58b43
commit daa331dcb8
1 changed files with 114 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
src/views/material/archives/index.vue
View File

@ -89,16 +89,16 @@
<el-row :gutter="16" style="margin-bottom: 20px;">
<el-col :span="2">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="">上传</el-button>
<el-button type="primary" plain icon="el-icon-upload" size="mini" @click="openUpLoadDialog">上传</el-button>
</el-col>
<el-col :span="2">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">下载</el-button>
</el-col>
<el-col :span="2">
<el-button type="warning" plain icon="el-icon-download" :disabled="single" size="mini" @click="handleReName">重命名</el-button>
<el-button type="success" plain icon="el-icon-download" :disabled="single" size="mini" @click="handleReName">重命名</el-button>
</el-col>
<el-col :span="2">
<el-button type="warning" plain icon="el-icon-download" :disabled="multiple" size="mini" @click="handleAllDel">删除</el-button>
<el-button type="danger" plain icon="el-icon-download" :disabled="multiple" size="mini" @click="handleAllDel">删除</el-button>
</el-col>
<el-col :span="4" style="float: right;">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新建文件夹</el-button>
@ -124,7 +124,7 @@
<span @click="getSubDetails(scope.row)" style="cursor: pointer;margin-left: 20px;">{{ scope.row.docName }}</span>
</template>
</el-table-column>
<el-table-column label="" align="center" width="300">
<el-table-column label="" align="center" width="200">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleView(scope.row)">
查看
@ -138,8 +138,13 @@
</template>
</el-table-column>
<el-table-column label="类 型 " align="center" prop="docType" show-overflow-tooltip/>
<el-table-column label="文件大小" align="center" prop="docSize" show-overflow-tooltip>
<template slot-scope="scope">
<span v-if="scope.row.docSize">{{ scope.row.docSize }}MB</span>
</template>
</el-table-column>
<el-table-column label="年 度" align="center" prop="year" show-overflow-tooltip/>
<el-table-column label="修改时间 " align="center" prop="updateTime" show-overflow-tooltip/>
<el-table-column label="修改时间 " align="center" prop="updateTime" show-overflow-tooltip width="180"/>
<el-table-column label="上传人员 " align="center" prop="createBy" show-overflow-tooltip/>
</el-table>
@ -155,10 +160,27 @@
</el-row>
<!-- 上传弹窗 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="600px" append-to-body>
<el-upload ref="upload" :limit="20" :headers="upload.headers" :multiple="true" drag
:action="upload.url" style="width: 100%;" :file-list="fileList"
:on-success="handleSuccess" :on-error="handleError" :on-remove="handleFileRemove"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__tip text-center" slot="tip">
<span>按住Ctrl可同时多选，支持上传rar/zip格式文件，单个文件不能超过5M</span>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">上 传</el-button>
<el-button @click="cancelUpload">取 消</el-button>
</div>
</el-dialog>
<!-- 图片查看 -->
<el-dialog :visible.sync="dialogVisible">
<img width="100%" height="650px" :src="dialogImageUrl" alt />
</el-dialog>
<!-- 新增弹框(新建弹窗) -->
<el-dialog :title="addTitle" :visible.sync="addShowVisible" v-if="addShowVisible" width="500px" append-to-body :close-on-click-modal="false">
<el-form label-width="80px" :model="addFormParams" :rules="addFormParamsRules" ref="addFormParamsRef">
@ -209,6 +231,7 @@
</el-row>
</el-form>
</el-dialog>
</div>
</template>
@ -219,9 +242,8 @@ import {
getArchivesTypeListApi,getAddArchivesTypeApi,updateArchivesTypeApi,delArchivesTypeApi,
getArchivesDetailsLstApi, addArchivesDetailsApi, updateArchivesDetailsApi, delArchivesDetailsApi
} from "@/api/archives/archives";
import { imgUpLoad } from "@/api/system/upload";
import { imgUpLoad, fileUpLoad } from "@/api/system/upload";
import { getToken } from '@/utils/auth'
export default {
name: "ToolsType",
components: { Treeselect },
@ -318,7 +340,19 @@ export default {
},
],
},
fileList:[],
uploadList:[],
// 上传参数
upload: {
// 是否显示弹出层（上传导入）
open: false,
// 弹出层标题（上传导入）
title: '上传文件',
// 设置上传的请求头部
headers: { Authorization: 'Bearer ' + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + '/file/upload'
},
};
},
@ -341,6 +375,7 @@ export default {
if(this.treeOptions[0].children&&this.treeOptions[0].children.length > 0) {
const firstNode = this.treeOptions[0].children[0];
this.queryParams.infoId = firstNode.id;
console.log(firstNode)
let obj = {
id:0,
infoId:firstNode.id,
@ -507,7 +542,7 @@ export default {
if(row.docType=='文件夹'){
this.queryParams.detailsId=row.detailsId;
this.queryParams.level=row.level;
this.queryParams.infoId="";
this.queryParams.infoId=this.queryParams.infoId;
this.queryParams.pageNum = 1;
let obj = {
id:row.detailsId,
@ -546,7 +581,7 @@ export default {
if(item.detailsId!=''){
this.queryParams.detailsId=item.detailsId;
this.queryParams.level=item.level;
this.queryParams.infoId="";
this.queryParams.infoId=item.infoId;
this.queryParams.pageNum = 1;
this.$set(this, 'breadcrumbList', this.breadcrumbList.slice(0,index+1));
this.getList()
@ -586,16 +621,6 @@ export default {
this.single = selection.length != 1;
this.multiple = !selection.length;
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = { parentId: ""};
this.resetForm("form");
},
//查看
handleView(row) {
console.log(row)
@ -663,6 +688,62 @@ export default {
})
.catch(() => {});
},
//打开文件上传
openUpLoadDialog(){
this.uploadList=[]
this.upload.open=true;
},
handleSuccess(response, file, fileList) {
console.log('File uploaded successfully:', response);
console.log('File uploaded successfully:', file);
if(response.code==200){
let param = {
docName:response.data.name,
docUrl:response.data.url,
docType:response.data.name.split(".")[1],
docSize:(file.size / 1024 / 1024).toFixed(2),
detailsId:this.queryParams.detailsId,
infoId:this.queryParams.infoId
}
this.uploadList.push(param)
}
// let size = (file.size / 1024 / 1024).toFixed(2)
// console.log(size)
},
handleFileRemove(file, fileList){
console.log(file)
console.log(fileList)
let index = this.uploadList.findIndex(item=>item.docName==file.name)
this.uploadList.splice(index,1)
},
handleError(err, file, fileList) {
console.error('Error while uploading file:', err);
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
// this.upload.open = false
},
// 提交上传文件
async submitFileForm() {
console.log(this.uploadList)
let param = {
archivesDetailsList:this.uploadList
}
const res = await addArchivesDetailsApi(param);
if (res.code === 200) {
this.$message.success("上传成功！");
this.upload.open = false
this.getList()
}
// this.$refs.upload.submit()
},
cancelUpload() {
this.getList()
this.upload.open=false
},
/** 导出按钮作 */
handleExport() {
// let queryTemp = this.queryParams;
@ -809,4 +890,12 @@ export default {
}
}
}
::v-deep .el-upload{
width: 100%;
}
::v-deep .el-upload-dragger{
width: 100%;
}
</style>