p71924506
/
file_sharing_ms_fe
1
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

1.完成文件内容列表基础获取功能 2.完成文件上传功能 3.完成文件分类添加功能 4.完成按分类查询显示功能 TODO:需要完成按名称搜索功能 用户导入添加功能。需配合对应后端代码更新

This commit is contained in:
p71924506 2022-12-07 17:17:54 +08:00
parent e06046d77d
commit 292dce1630
2 changed files with 207 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/utils/http/interface.js
View File

@ -62,6 +62,50 @@ export const getUserDataByUserId = data => {
})
};
//获取分类
export const getAllType =()=>{
return axios({
headers:{
"Authorization": localStorage.getItem("systemToken")
},
url: '/file/getAlltype',
method: 'post'
})
}
export const addType = data =>{
return axios({
headers:{
"Authorization": localStorage.getItem("systemToken")
},
url: '/file/addType',
method: 'post',
data
})
}
export const addFileInfo = data =>{
return axios({
headers:{
"Authorization": localStorage.getItem("systemToken")
},
url: '/file/addFileInfo',
method: 'post',
data
})
}
export const getFilesInfoByType = data =>{
return axios({
headers:{
"Authorization": localStorage.getItem("systemToken")
},
url: '/file/getFilesInfoByType',
method: 'post',
data
})
}
// 默认全部倒出
@ -73,5 +117,8 @@ export default {
getUserDataByUserId,
login,
register,
getAllType,
addType,
addFileInfo,
getFilesInfoByType
}

189
src/views/fileList/FileList.vue
View File

@ -9,13 +9,14 @@
<!-- 下拉选框 -->
<span style="margin-left: 10px">分类：</span>
<el-select v-model="searchInfo.type" clearable filterable placeholder="请选择">
<el-option v-for="item in division_info_all"
:key="item.division_name"
:label="item.division_name"
:value="item.division_name"></el-option>
<el-select v-model="searchInfo.type" clearable filterable placeholder="请选择" @change="selectByType">
<el-option v-for="item in filesTypeList"
:key="item.filesTypeId"
:label="item.name"
:value="item.filesTypeId"></el-option>
</el-select>
<el-button style="margin-left: 10px" type="primary" @click="dialogVisible = true">上传文件</el-button>
<el-button style="margin-left: 10px" type="primary" @click="typeDialogVisible = true" plain>添加分类</el-button>
@ -27,30 +28,32 @@
width="50%"
:before-close="handleClose">
<el-form label-position="top" label-width="80px" :model="filesInfo" :rules="rules" style="text-align: left">
<el-form-item label="文件名">
<el-form-item label="文件名" prop="name">
<el-input placeholder="请填写文件名" v-model="filesInfo.name"></el-input>
</el-form-item>
<!-- <el-form-item label="竞赛名称" prop="compName">-->
<!-- <el-input placeholder="竞赛名称" v-model="compInfo.compName"></el-input>-->
<!-- </el-form-item>-->
<el-form-item label="文件分类">
<el-form-item label="文件分类" prop="fileTypeId">
<el-select v-model="filesInfo.filesTypeId" placeholder="请选择文件分类">
<el-option label="管理办法" value=0></el-option>
<el-option label="采购材料" value=1></el-option>
<el-option v-for="item in filesTypeList"
:key="item.filesTypeId"
:label="item.name"
:value="item.filesTypeId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="文件状态">
<el-form-item label="文件状态" prop="status">
<el-select v-model="filesInfo.status" placeholder="请选择文件状态">
<el-option label="待更新" value=0></el-option>
<el-option label="已更新" value=1></el-option>
<el-option label="已废弃" value=2></el-option>
<el-option label="待更新" value="待更新"></el-option>
<el-option label="已更新" value="已更新"></el-option>
<el-option label="已废弃" value="已废弃"></el-option>
</el-select>
</el-form-item>
<el-form-item label="文件上传">
<el-form-item label="文件上传" prop="upload">
<el-upload
class="upload-demo"
drag
@ -69,11 +72,25 @@
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitComp">确 定</el-button>
<el-button type="primary" @click="fileInfoSubmit">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="添加分类"
:visible.sync="typeDialogVisible"
width="30%"
:before-close="typeHandleClose">
<el-form label-position="top" label-width="80px" :model="fileType" :rules="rules" style="text-align: left">
<el-form-item label="分类名称" prop="typeName">
<el-input placeholder="请输入分类名称" v-model="fileType.name"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="addTypeSubmit">确 定</el-button>
</span>
</el-dialog>
<el-table
v-loading="listLoading"
:data="list"
@ -127,6 +144,7 @@
import { getList } from '@/api/table'
import pageUtils from '@/utils/pageUtils'
import { Message } from 'element-ui'
import { getFilesInfoByType } from '@/utils/http/interface'
export default {
name: 'FileList',
@ -168,27 +186,46 @@ export default {
//dialog规则
rules: {
// filesInfoId: [
// { required: true, message: '请输入竞赛ID', trigger: 'blur' },
// ],
// compName: [
// { required: true, message: '请输入竞赛名称', trigger: 'blur' },
// ],
name: [
{ required: true, message: '请填写文件名', trigger: 'blur' },
],
fileTypeId: [
{ required: true, message: '请选择文件分类', trigger: 'blur' },
],
status: [
{ required: true, message: '请选择文件状态', trigger: 'blur' },
],
upload: [
{ required: true, message: '请上传文件', trigger: 'blur' },
],
typeName:[
{required: true, message: '请输入分类名称', trigger: 'blur' }
]
},
//上传文件
filesInfo:{
filesInfoId:0,
filesTypeId:0,
filesInfoId:null,
filesTypeId:null,
location:"",
name:"",
uploadUserId:"",
status:""
},
//添加分类
fileType:{
name:""
},
// 上传文件弹窗状态
dialogVisible: false,
//分类弹窗
typeDialogVisible: false,
//文件类型列表
filesTypeList: null
// 暂时不需要
// filesData:{
//
@ -201,25 +238,38 @@ export default {
this.fetchData()
},
methods: {
fetchData() {
this.listLoading = true
getAllType(){
this.$api.getAllType().then((res)=>{
if (res.status === 0) {
this.filesTypeList =res.data
}
console.log(res)
})
},
getAllFiles(){
this.$api.getAllFilesInfo().then((res)=>{
console.log(res)
if (res.status === 0) {
this.list = res.data
console.log(this.list)
this.listLoading = false
}else {
Message.warning("加载失败")
}
}).catch(function (res) {
alert(res);
});
// getList().then(response => {
// this.list = response.data.items
// this.listLoading = false
// })
},
// 获取数据
fetchData() {
this.listLoading = true
this.getAllFiles()
this.getAllType()
},
downloadFile(link) {
window.location.href = '/api' + link
window.location.href = '/api/' + link
// console.log('/api' + link)
// pageUtils.openPage(this.$router, '/api' + link)
},
@ -227,8 +277,8 @@ export default {
//关闭上传弹窗
handleClose() {
this.dialogVisible = false;
this.filesInfo.filesInfoId = 0;
this.filesInfo.filesTypeId = 0;
this.filesInfo.filesInfoId = null;
this.filesInfo.filesTypeId = null;
this.filesInfo.location = "";
this.filesInfo.name = "";
this.filesInfo.uploadUserId = "";
@ -237,6 +287,16 @@ export default {
},
//关闭添加分类弹窗
typeHandleClose(){
this.typeDialogVisible = false;
this.fileType.name = ""
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
//上传文件本身成功调用，信息未上传
uploadSuccess(response){
@ -245,6 +305,69 @@ export default {
//此时会有一个返回的生成随机ID 暂不需要 如之后做成果库可以升级
this.filesInfo.location = response.url
}
},
//添加fileinfo
fileInfoSubmit(){
//检查是否有url
if (this.filesInfo.location != null && this.filesInfo.location != '') {
//提交
console.log(localStorage.getItem("userId"))
this.filesInfo.uploadUserId = localStorage.getItem("userId")
this.$api.addFileInfo(this.filesInfo).then((res)=>{
console.log(res)
if (res.status == 0) {
Message.success("上传成功")
this.handleClose()
this.getAllFiles()
}
})
}else{
Message.warning("请上传文件完善信息")
}
},
//添加type按钮执行
addTypeSubmit(){
if (this.fileType.name != null && this.fileType.name !== '') {
//提交
this.$api.addType(this.fileType).then((res)=>{
console.log(res)
if (res.status == 30) {
Message.warning(res.msg)
}else if (res.status == 0){
Message.success("添加成功")
this.typeHandleClose()
this.getAllType()
//刷新页面
}else {
Message.warning("系统错误请重试")
}
})
}else{
Message.warning("请输入文件分类")
}
},
//分类change
selectByType(){
// console.log(this.searchInfo.type)
if (this.searchInfo.type != null && this.searchInfo.type != '' && this.searchInfo.type != undefined) {
let filesInfo = {
filesTypeId : this.searchInfo.type
}
this.$api.getFilesInfoByType(filesInfo).then((res)=>{
if (res.status == 0) {
this.list = res.data
}else {
Message.warning("服务错误")
}
})
// console.log("非空非默认状态啊")
}else {
this.getAllFiles()
// console.log("默认状态")
}
}
},