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

src/utils/http/interface.js

@@ -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
 }

src/views/fileList/FileList.vue

@@ -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
 
-        this.list = res.data
-
-        console.log(this.list)
-        this.listLoading = false
+          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("默认状态")
+      }
     }
   },