完善文件模块新建文件、新建文件夹、列表查看模式、面包屑导航、文件夹文件重命名功能

src/assets/icons/svg/icon-liebiao.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1691980701595" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1118" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M896.021502 255.956996 607.897867 255.956996c-17.717453 0-31.994625-14.277171-31.994625-31.994625 0-17.717453 14.277171-31.994625 31.994625-31.994625l287.951621 0c17.717453 0 31.994625 14.277171 31.994625 31.994625C928.016126 241.679825 913.738955 255.956996 896.021502 255.956996z" p-id="1119"></path><path d="M896.021502 415.930119 607.897867 415.930119c-17.717453 0-31.994625-14.277171-31.994625-31.994625s14.277171-31.994625 31.994625-31.994625l287.951621 0c17.717453 0 31.994625 14.277171 31.994625 31.994625S913.738955 415.930119 896.021502 415.930119z" p-id="1120"></path><path d="M896.021502 672.05913 607.897867 672.05913c-17.717453 0-31.994625-14.277171-31.994625-31.994625s14.277171-31.994625 31.994625-31.994625l287.951621 0c17.717453 0 31.994625 14.277171 31.994625 31.994625S913.738955 672.05913 896.021502 672.05913z" p-id="1121"></path><path d="M896.021502 832.032253 607.897867 832.032253c-17.717453 0-31.994625-14.277171-31.994625-31.994625s14.277171-31.994625 31.994625-31.994625l287.951621 0c17.717453 0 31.994625 14.277171 31.994625 31.994625S913.738955 832.032253 896.021502 832.032253z" p-id="1122"></path><path d="M383.935495 479.919368 191.967747 479.919368c-52.980346 0-95.983874-43.003528-95.983874-95.983874L95.983874 191.967747c0-52.980346 43.003528-95.983874 95.983874-95.983874l191.967747 0c52.980346 0 95.983874 43.003528 95.983874 95.983874l0 191.967747C479.919368 436.915841 436.915841 479.919368 383.935495 479.919368zM191.967747 159.973123c-17.545439 0-31.994625 14.449185-31.994625 31.994625l0 191.967747c0 17.545439 14.449185 31.994625 31.994625 31.994625l191.967747 0c17.545439 0 31.994625-14.449185 31.994625-31.994625L415.930119 191.967747c0-17.545439-14.449185-31.994625-31.994625-31.994625L191.967747 159.973123 191.967747 159.973123z" p-id="1123"></path><path d="M383.935495 928.016126 191.967747 928.016126c-52.980346 0-95.983874-43.003528-95.983874-95.983874L95.983874 639.892491c0-52.980346 43.003528-95.983874 95.983874-95.983874l191.967747 0c52.980346 0 95.983874 43.003528 95.983874 95.983874l0 191.967747C479.919368 884.840585 436.915841 928.016126 383.935495 928.016126zM191.967747 607.897867c-17.545439 0-31.994625 14.277171-31.994625 31.994625l0 191.967747c0 17.717453 14.449185 31.994625 31.994625 31.994625l191.967747 0c17.545439 0 31.994625-14.277171 31.994625-31.994625L415.930119 639.892491c0-17.717453-14.449185-31.994625-31.994625-31.994625L191.967747 607.897867 191.967747 607.897867z" p-id="1124"></path></svg>
\ No newline at end of file

src/components/common/BreadCrumb.vue

@@ -89,17 +89,17 @@ export default {
             //  根目录
             filePathList[i] = "";
             _path.push(filePathList[i]);
-            res.push({
-              path: "/",
-              name:
-                this.fileType === 0
-                  ? "全部文件"
-                  : this.fileType === 8
-                  ? "我的分享"
-                  : this.$route.name === "Share"
-                  ? "全部分享"
-                  : "",
-            });
+            // res.push({
+            //   path: "/",
+            //   name:
+            //     this.fileType === 0
+            //       ? "全部文件"
+            //       : this.fileType === 8
+            //       ? "我的分享"
+            //       : this.$route.name === "Share"
+            //       ? "全部分享"
+            //       : "",
+            // });
           }
         }
         return res;

src/components/common/FileTable.vue

@@ -114,7 +114,11 @@
         :sort-by="['isDir', 'extendName']"
         sortable
         show-overflow-tooltip
-        v-if="selectedColumnList.includes('extendName') && screenWidth > 768"
+        v-if="
+          selectedColumnList &&
+          selectedColumnList.includes('extendName') &&
+          screenWidth > 768
+        "
       >
         <template slot-scope="scope">
           <span>{{ $file.getFileType(scope.row) }}</span>
@@ -128,7 +132,11 @@
         :sort-by="['isDir', 'fileSize']"
         sortable
         align="right"
-        v-if="selectedColumnList.includes('fileSize') && screenWidth > 768"
+        v-if="
+          selectedColumnList &&
+          selectedColumnList.includes('fileSize') &&
+          screenWidth > 768
+        "
       >
         <template slot-scope="scope">
           {{
@@ -147,6 +155,7 @@
         sortable
         align="center"
         v-if="
+          selectedColumnList &&
           selectedColumnList.includes('uploadTime') &&
           ![7, 8].includes(fileType) &&
           !['Share'].includes(this.routeName) &&
@@ -163,6 +172,7 @@
         align="center"
         v-if="
           fileType === 6 &&
+          selectedColumnList &&
           selectedColumnList.includes('deleteTime') &&
           screenWidth > 768
         "
@@ -303,7 +313,7 @@ export default {
     /**
      * 当表格的排序条件发生变化的时候会触发该事件
      */
-    
+
     handleSortChange() {
       this.sortedFileList = this.$refs.multipleTable.tableData;
     },
@@ -383,9 +393,9 @@ export default {
   margin-top: 2px;
 
   .file-type-0 {
-    height: calc(100vh - 206px) !important;
+    // height: calc(100vh - 206px) !important;
 
-    >>> .el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
       height: calc(100vh - 262px) !important;
     }
   }
@@ -393,7 +403,7 @@ export default {
   .file-type-6 {
     height: calc(100vh - 211px) !important;
 
-    >>> .el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
       height: calc(100vh - 263px) !important;
     }
   }
@@ -401,16 +411,16 @@ export default {
   .file-table.share {
     height: calc(100vh - 109px) !important;
 
-    >>> .el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
       height: calc(100vh - 161px) !important;
     }
   }
 
   .file-table {
     width: 100% !important;
-    height: calc(100vh - 203px);
+    height: calc(100vh - 290px);
 
-    >>> .el-table__header-wrapper {
+    ::v-deep .el-table__header-wrapper {
       th {
         // background: $tabBackColor;
         padding: 4px 0;
@@ -429,7 +439,7 @@ export default {
       }
     }
 
-    >>> .el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
       height: calc(100vh - 255px);
       overflow-y: auto;
       // setScrollbar(6px, transparent, #C0C4CC);

src/components/file/FileList.vue

@@ -24,7 +24,7 @@
       :filePath="filePath"
       :fileList="fileList"
       :loading.sync="loading"
-      v-if="fileModel === 0"
+      v-if="fileModel == 0"
       @getTableDataByType="getTableDataByType"
       @click.native.right="handleClickRight"
     ></FileTable>
@@ -34,7 +34,7 @@
       :filePath="filePath"
       :fileList="fileList"
       :loading="loading"
-      v-if="fileModel === 1"
+      v-if="fileModel == 1"
       @getTableDataByType="getTableDataByType"
       @click.native.right="handleClickRight"
     ></FileGrid>
@@ -48,7 +48,7 @@
       @click.native.right="handleClickRight"
     ></FileTimeLine>
     <div class="pagination-wrapper">
-      <div class="current-page-count">当前页{{ this.fileList.length }}条</div>
+      <div class="current-page-count">当前页{{ fileList.length }}条</div>
       <!-- 回收站不展示分页组件 -->
       <el-pagination
         :current-page="pageData.currentPage"
@@ -104,6 +104,7 @@ export default {
         pageCount: 50,
         total: 0,
       },
+      searchFileName: "", //当前搜索的文件名称，支持文件名和文件夹名
     };
   },
   computed: {
@@ -115,7 +116,9 @@ export default {
     },
     // 当前所在路径
     filePath() {
-      return this.$route.query.filePath ? this.$route.query.filePath : "/我的创作";
+      return this.$route.query.filePath
+        ? this.$route.query.filePath
+        : "/我的创作";
     },
     // 文件查看模式 0列表模式 1网格模式 2 时间线模式
     fileModel() {
@@ -128,11 +131,14 @@ export default {
   },
   watch: {
     filePath() {
+      // debugger;
       // 当左侧菜单选择“全部”或“我的分享”，文件路径发生变化时，再重新获取文件列表
-      if (this.$route.name === "File" && [0, 8].includes(this.fileType)) {
-        this.setPageCount();
-        this.getTableDataByType();
-      }
+      // if (this.$route.name === "File" && [0, 8].includes(this.fileType)) {
+      //   this.setPageCount();
+      //   this.getTableDataByType();
+      // }
+      this.setPageCount();
+      this.getTableDataByType();
     },
     fileType() {
       if (this.$route.name === "File") {
@@ -144,6 +150,12 @@ export default {
     fileModel() {
       this.setPageCount();
     },
+    // 监听搜索文件
+    searchFileName() {
+      console.log("searchFileName");
+      this.setPageCount();
+      this.getTableDataByType();
+    },
   },
   created() {
     this.setPageCount();
@@ -189,7 +201,7 @@ export default {
      */
     getTableDataByType() {
       this.loading = true;
-      console.log("type:",this.fileType)
+      console.log("type:", this.fileType);
       // 分类型
       if (Number(this.fileType)) {
         switch (Number(this.fileType)) {
@@ -228,18 +240,20 @@ export default {
      * 表格数据获取相关事件 | 获取当前路径下的文件列表
      */
     showFileList() {
+      console.log("showFileList");
       let data = {
         fileType: this.fileType,
         filePath: this.filePath,
         currentPage: this.pageData.currentPage,
         pageCount: this.pageData.pageCount,
+        fileName: this.searchFileName,
       };
       const params = new URLSearchParams();
       for (const key in data) {
         params.append(key, data[key]);
       }
       getFileListByPath(params).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = res.data.total;
           this.loading = false;
@@ -278,22 +292,25 @@ export default {
     /**
      * 表格数据获取相关事件 | 获取我的创作文件列表
      */
-     showMyCreateFile() {
+    showMyCreateFile() {
+      console.log("showMyCreateFile");
       let data = {
         fileType: this.fileType,
         filePath: this.filePath,
         currentPage: this.pageData.currentPage,
         pageCount: this.pageData.pageCount,
+        fileName: this.searchFileName,
       };
       const params = new URLSearchParams();
       for (const key in data) {
         params.append(key, data[key]);
       }
       getFileListByPath(params).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = res.data.total;
           this.loading = false;
+          console.log("200");
         } else {
           this.$message.error(res.msg);
         }
@@ -302,49 +319,51 @@ export default {
     /**
      * 表格数据获取相关事件 | 获取我的收藏文件列表
      */
-     showMyFavoriteFile() {
+    showMyFavoriteFile() {
       let data = {
         fileType: this.fileType,
         filePath: this.filePath,
         currentPage: this.pageData.currentPage,
         pageCount: this.pageData.pageCount,
+        fileName: this.searchFileName,
       };
       const params = new URLSearchParams();
       for (const key in data) {
         params.append(key, data[key]);
       }
       getFileListByPath(params).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = res.data.total;
-          this.loading = false;
         } else {
           this.$message.error(res.msg);
         }
+        this.loading = false;
       });
     },
     /**
      * 表格数据获取相关事件 | 获取我的笔记文件列表
      */
-     showMyNoteFile() {
+    showMyNoteFile() {
       let data = {
         fileType: this.fileType,
         filePath: this.filePath,
         currentPage: this.pageData.currentPage,
         pageCount: this.pageData.pageCount,
+        fileName: this.searchFileName,
       };
       const params = new URLSearchParams();
       for (const key in data) {
         params.append(key, data[key]);
       }
       getFileListByPath(params).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = res.data.total;
-          this.loading = false;
         } else {
           this.$message.error(res.msg);
         }
+        this.loading = false;
       });
     },
     /**
@@ -358,13 +377,13 @@ export default {
         pageCount: this.pageData.pageCount,
       };
       getMyShareFileList(data).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = Number(res.data.total);
-          this.loading = false;
         } else {
           this.$message.error(res.msg);
         }
+        this.loading = false;
       });
     },
     /**
@@ -378,7 +397,7 @@ export default {
         pageCount: this.pageData.pageCount,
       };
       getFileListByType(data).then((res) => {
-        if (res.code==200) {
+        if (res.code == 200) {
           this.fileList = res.data.records;
           this.pageData.total = Number(res.data.total);
           this.loading = false;
@@ -393,20 +412,21 @@ export default {
      * @param {string} fileName 文件名称
      */
     getSearchFileList(fileName) {
-      this.loading = true;
-      searchFile({
-        currentPage: this.pageData.currentPage,
-        pageCount: this.pageData.pageCount,
-        fileName: fileName,
-      }).then((res) => {
-        this.loading = false;
-        if (res.code==200) {
-          this.fileList = res.data.records;
-          this.pageData.total = res.data.total;
-        } else {
-          this.$message.error(res.msg);
-        }
-      });
+      // this.loading = true;
+      this.searchFileName = fileName;
+      // searchFile({
+      //   currentPage: this.pageData.currentPage,
+      //   pageCount: this.pageData.pageCount,
+      //   fileName: fileName,
+      // }).then((res) => {
+      //   this.loading = false;
+      //   if (res.code == 200) {
+      //     this.fileList = res.data.records;
+      //     this.pageData.total = res.data.total;
+      //   } else {
+      //     this.$message.error(res.msg);
+      //   }
+      // });
     },
   },
 };
@@ -431,6 +451,7 @@ export default {
     height: 44px;
     line-height: 44px;
     text-align: center;
+    padding-top: 10px;
 
     .current-page-count {
       position: absolute;

src/components/file/components/OperationMenu.vue

@@ -6,7 +6,10 @@
   >
     <el-button-group
       class="create-operate-group"
-      v-if="(!selectedFiles.length || !isBatchOperation) && [0,10,11,12].includes(fileType) "
+      v-if="
+        (!selectedFiles.length || !isBatchOperation) &&
+        [0, 10, 11, 12].includes(fileType)
+      "
     >
       <el-dropdown class="upload-drop" trigger="hover">
         <el-button
@@ -101,7 +104,6 @@
 
     <!-- 全局搜索文件 -->
     <el-input
-      v-if="fileType === 0"
       class="select-file-input"
       v-model="searchFile.fileName"
       placeholder="搜索您的文件"
@@ -135,13 +137,20 @@
     ></i>
     <el-divider direction="vertical"></el-divider>
     <template v-if="screenWidth > 768">
+      <!-- fileGroupLable:{{ fileGroupLable }} -->
       <!-- 文件展示模式 -->
-      <i
-        class="model-icon iconfont icon-liebiao1"
+      <!-- <i
+        class="model-icon iconfont icon-liebiao"
         :class="{ active: fileGroupLable === 0 }"
         title="列表模式"
         @click="handleFileDisplayModelChange(0)"
-      ></i>
+      ></i> -->
+      <svg-icon
+        icon-class="icon-liebiao"
+        @click="handleFileDisplayModelChange(0)"
+        title="列表模式"
+        :class="{ active: fileGroupLable === 0, 'model-icon': true }"
+      ></svg-icon>
       <i
         class="model-icon el-icon-s-grid"
         :class="{ active: fileGroupLable === 1 }"
@@ -326,7 +335,7 @@ export default {
           filePath: this.$route.query.filePath || "/",
         })
         .then((res) => {
-          console.log("确认结果：",res)
+          console.log("确认结果：", res);
           if (res === "confirm") {
             this.$emit("getTableDataByType");
           }
@@ -525,7 +534,7 @@ export default {
   .model-icon {
     margin-right: 8px;
     &:last-of-type {
-      margin-right: 0;
+      // margin-right: 0;
     }
   }
 

src/components/file/dialog/addFile/Dialog.vue

@@ -83,7 +83,7 @@ export default {
           })
             .then((res) => {
               this.sureBtnLoading = false;
-              if (res.success && res.code === 0) {
+              if (res.code == 200) {
                 this.$message.success("文件创建成功");
                 this.$refs[formName].resetFields();
                 this.visible = false;

src/components/file/dialog/addFolder/Dialog.vue

@@ -116,7 +116,7 @@ export default {
           })
             .then((res) => {
               this.sureBtnLoading = false;
-              if (res.success) {
+              if (res.code == 200) {
                 this.$message.success("文件夹创建成功");
                 this.$refs[formName].resetFields();
                 this.visible = false;

src/components/file/dialog/copyFile/Dialog.vue

@@ -93,7 +93,7 @@ export default {
       this.loading = true;
       getFoldTree().then((res) => {
         this.loading = false;
-        if (res.success) {
+        if (res.code == 200) {
           this.fileTree = [res.data];
           this.defaultExpandedKeys = id ? [id] : [this.fileTree[0].id];
         } else {

src/components/file/dialog/moveFile/Dialog.vue

@@ -93,7 +93,7 @@ export default {
       this.loading = true;
       getFoldTree().then((res) => {
         this.loading = false;
-        if (res.success) {
+        if (res.code == 200) {
           this.fileTree = [res.data];
           this.defaultExpandedKeys = id ? [id] : [this.fileTree[0].id];
         } else {

src/components/file/dialog/renameFile/Dialog.vue

@@ -90,7 +90,7 @@ export default {
           })
             .then((res) => {
               this.sureBtnLoading = false;
-              if (res.success) {
+              if (res.code == 200) {
                 this.$message.success("重命名成功");
                 this.$refs[formName].resetFields();
                 this.visible = false;

src/components/file/dialog/saveShareFile/Dialog.vue

@@ -93,7 +93,7 @@ export default {
       this.loading = true;
       getFoldTree().then((res) => {
         this.loading = false;
-        if (res.success) {
+        if (res.code == 200) {
           this.fileTree = [res.data];
           this.defaultExpandedKeys = id ? [id] : [this.fileTree[0].id];
         } else {

src/components/file/dialog/unzipFile/Dialog.vue

@@ -101,7 +101,7 @@ export default {
       this.loading = true;
       getFoldTree().then((res) => {
         this.loading = false;
-        if (res.success) {
+        if (res.code == 200) {
           this.fileTree = [res.data];
           this.defaultExpandedKeys = id ? [id] : [this.fileTree[0].id];
         } else {

src/libs/qiwen/globalFunction/common.js

@@ -14,7 +14,7 @@ const commonFunction = {
 	 * @param {object} others 域名、路径、有效期等，封装到对象中
 	 */
 	setCookies(name, value, others = null) {
-		Cookies.set(name, value, { domain: config.domain, ...others })
+		Cookies.set(name, value, { domain: qwConfig.domain, ...others })
 	},
 	/**
 	 * 获取 Cookies
@@ -23,7 +23,7 @@ const commonFunction = {
 	 * @returns {string} Cookies 值
 	 */
 	getCookies(name, others = null) {
-		return Cookies.get(name, { domain: config.domain, ...others })
+		return Cookies.get(name, { domain: qwConfig.domain, ...others })
 	},
 	/**
 	 * 移除 Cookies
@@ -31,7 +31,7 @@ const commonFunction = {
 	 * @param {object} others 域名、路径等，封装到对象中
 	 */
 	removeCookies(name, others = null) {
-		Cookies.remove(name, { domain: config.domain, ...others })
+		Cookies.remove(name, { domain: qwConfig.domain, ...others })
 	}
 }
 export default commonFunction

src/libs/qiwen/globalFunction/file.js

@@ -300,6 +300,7 @@ const fileFunction = {
 		}
 		// 若是文件夹则进入该文件夹
 		if (row.isDir) {
+			// debugger
 			if (router.currentRoute.name === 'Share') {
 				// 当前是查看他人分享列表的页面
 				router.push({
@@ -325,7 +326,7 @@ const fileFunction = {
 					query: {
 						filePath: `${row.filePath === '/' ? '' : row.filePath}/${row.fileName
 							}`,
-						fileType: 0
+						fileType: router.currentRoute.query.fileType
 					}
 				})
 			}

src/store/getters.js

+import { allColumnList } from '@/libs/qiwen/map.js'
+
 const getters = {
   sidebar: state => state.app.sidebar,
   size: state => state.app.size,
@@ -16,7 +18,15 @@ const getters = {
   defaultRoutes: state => state.permission.defaultRoutes,
   sidebarRouters: state => state.permission.sidebarRouters,
   //奇文
-  fileModel: state => state.fileList.fileModel,
-
+  // fileModel: state => state.fileList.fileModel,
+  // selectedColumnList: state => state.fileList.selectedColumnList,
+  // 文件查看模式
+  fileModel: (state) =>
+    state.fileList.fileModel === null ? 0 : Number(state.fileList.fileModel),
+  // 表格显示列
+  selectedColumnList: (state) =>
+    state.fileList.selectedColumnList === null
+      ? allColumnList
+      : state.fileList.selectedColumnList.split(','),
 }
 export default getters

src/utils/qwConfig.js

@@ -34,7 +34,7 @@ const qwConfig = {
     /**
      * 存放 token 时的命名方式
      */
-    tokenKeyName: 'token'
+    tokenKeyName: 'Admin-Token'
 }
 
 export default qwConfig

vue.config.js

@@ -35,7 +35,7 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://192.168.1.230:9600`,
+        target: `http://222.85.214.245:9600`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''