commit

src/components/app-header/app-header.vue

@@ -30,6 +30,12 @@
       </div>
       <div class="app-header-content-right">
         <slot name="right"></slot>
+          <span @click="toRecycle">
+            <i
+              class="Cicon icon font_family icon-icon_huishouzhan"
+              :class="{inRecycle:isInRecycle}"
+            />
+        </span>
         <user-center v-if="showUserCenter" />
       </div>
     </div>
@@ -56,6 +62,7 @@ export default {
     title: String,
     // 右侧
     showUserCenter: Boolean,
+    isInRecycle: Boolean,
   },
   data() {
     return {
@@ -90,6 +97,14 @@ export default {
       }
       this.$router.go(-1);
     },
+    /**
+     * 进入回收站
+     */
+    toRecycle: function () {
+      this.$router.push({
+        name: "recycle",
+      });
+    },
     /**
      * 检测bigbody滚动距离添加样式
      */
@@ -219,4 +234,7 @@ export default {
 .black-bg-color {
   background-color:#32323c;
 }
+.inRecycle{
+  color: #9c22ff;
+}
 </style>

src/router.js

@@ -77,7 +77,7 @@ const router = new Router({
 	{
 		path: '/recycle',
 		name: 'recycle',
-		component: () => import('@/views/main_web/recycle'),
+		component: () => import('@/views/main_web/workspace/recyclebin'),
 	},
 	{
 		path: '/cloud',

src/views/components_web/projDetail/projDetail.vue

@@ -9,7 +9,7 @@
 <template>
   <div class="proj-detail">
     <top-header v-show="!isEnterEdit"
-                backBtnTitle="完成项目编辑" theme="basis" 
+                backBtnTitle="退出项目编辑" theme="basis" 
                 :showUserCenter="false" :showBackBtn="true" :onBackBtnClick="returnToProjListPage"
     />
     <div class="content-wrap" :class="{'set-content-wrap': isEnterEdit}">

src/views/main_web/workspace/components/recycle-file.vue

@@ -0,0 +1,191 @@
+<template>
+  <div>
+      <div class="yiyun_wenjian_list loding-mask-parent">
+        <div>
+          <!-- 非图片文件图标 -->
+          <div
+            v-if="!oneOf(file.extension, imgExtensionList) && !oneOf(file.extension, VideoExtensionList)"
+            class="defultImage-mid toumin"
+            :class="`${file.extension}-mid ${!oneOf(file.extension,filePreviewList) ? '':''} ` "
+            />
+
+          <!-- 图片文件图标 -->
+          <div
+            v-else-if="oneOf(file.extension, imgExtensionList)"
+            class="defultImage-mid img_bg-mid toumin"
+          >
+            <div class="file_Im gbox-mid">
+              <img v-lazy="file.alias" alt class="file_Img" />
+            </div>
+          </div>
+          <!-- 视频文件图标 -->
+          <div
+            v-else
+            class="defultImage-mid video-mid toumin"
+          >
+          </div>
+          <!-- 右键菜单 -->
+          <div class="contextmenu" v-show="true"
+          
+          >
+            <ul class="rightMenu">
+              <li class="download" v-if="isClient" @click="clientDownLoad(file)">下载</li>
+              <li class="putaway" @click="removeFile(file.id)">放回原处</li>
+              <!-- <li class="delete">彻底删除</li> -->
+            </ul>
+          </div>
+
+          <!-- 右上设置按钮 -->
+          <!-- 下拉列表 -->
+          <!-- <div class="top_optionBar" v-show="true">
+            <el-dropdown>
+              <span class="el-dropdown-link">
+                <i
+                  class="icon iconfont icon_small-icon_small_wenjianshezhi settingIcon"
+                />
+              </span>
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item
+                  @click="fileClick(file)"
+                >
+                  <span class="download">下载</span>
+                </el-dropdown-item>
+                <el-dropdown-item
+                  @click="removeFile(file.id)"
+                >
+                  <span class="putaway">放回原处</span>
+                </el-dropdown-item>
+                <el-dropdown-item
+                  @click="fileClick(file)"
+                >
+                  <span class="delete">彻底删除</span>
+                </el-dropdown-item>
+              </el-dropdown-menu>
+            </el-dropdown>
+          </div> -->
+          <!-- 文件名 -->
+          <strong
+            class="yiyunwenjian_name"
+            :title="file.archName + '.' + file.extension"
+            >{{ file.archName }}<span v-show="!oneOf(file.extension, RecExtensionList)">.{{file.extension}}</span></strong>
+
+          <span
+            class="yiyunwenjian_infodesc"
+            >5天后删除</span>
+        </div>
+      </div>
+  </div>
+</template>
+
+<script>
+import { removeFromRecycleBin} from '../service';
+import { getFileStoreKey} from '../helper';
+import system from '@/services/system';
+const imgExtensionList = ["jpg", "png", "bmp", "gif", "jpeg"];
+const RecExtensionList = ["jpg", "png", "bmp", "gif", "jpeg", "txt", 
+                          "zip", "ae", "ai", "idml","indd","mp3","pr",
+                          "ps","sketch","xmind","skp","rvt","rar","nwc",
+                          "max","dxf","dwg","svfzip","map","supermap","pdf",
+                          "ppt","pptx","excel","xlsx","xls","doc","docx",
+                          "word","folder","folder1","folder2"
+                          ];
+const VideoExtensionList = ["avi", "mov", "wav","mp4"];
+const office =["doc","docx","ppt","pptx","xls","xlsx"];
+const filePreviewList = ["jpg", "png", "bmp", "gif", "jpeg",
+                          "doc","docx","ppt","pptx","xls","xlsx",
+                          "avi", "mov", "wav","mp4","txt","pdf",
+                          "dwg"
+                        ];
+const oneOf = (target, list) => list.indexOf(target) !== -1
+export default {
+  props: {
+    file: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+    data(){
+      return{
+        imgExtensionList,
+        RecExtensionList,
+        VideoExtensionList,
+        office,
+        filePreviewList,
+        isFileRightMenuVisible: false,
+        isClient: system.isClient,
+      }
+    },
+    methods:{
+      oneOf,
+      fileClick(){
+        console.log(12111)
+      },
+      async removeFile(id){
+        console.log(1111)
+          const res = await removeFromRecycleBin(id);
+          if(res.Code !== -1){
+              this.$notify({
+                  type:'success',
+                  message:"文件已放回原处。"
+              })
+          }
+      },
+    /**
+     * 客户端下载方法
+     */
+    clientDownLoad: function (file) {
+      if(!this.isClient) return;
+      // console.log('下载的文件对象', file);
+      const { ipfsCid, archName: fileName, extension, folderId, nodeName, relativePath } = file;
+      const folderMap = this.folderMap;
+      // const { levelId } = folderMap[folderId] || {};
+      const nodeFolderName = nodeName || this.currentNodeFolder.folderName;
+      const extensionedFileName = `${fileName}${extension ? `.${extension}`:''}`;
+      const isCooperateFile = !!nodeName;
+      const targetFolderName = `${nodeFolderName}${isCooperateFile ? '\\协作文件': ''}`;
+      const dirName = `${targetFolderName}${relativePath ? `\\${relativePath}`:''}`.replace(/\//g, '\\');
+      // const fileStoreKey = `${targetFolderName}\\${extensionedFileName}`;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      const errorHandler = () => {
+        this.removeFileLoadingState(file.id);
+      }
+      //this.updateFileLoadState(file, DOWNLOADING, 0);
+      system.downloadFile(ipfsCid, sessionStorage.projName, extensionedFileName, dirName, (resMessage, socketIns) => {
+        //console.log('receive download file message:', resMessage, socketIns);
+        // {"size":"11","currentSize":"11","unit":"B","process":100,"hash":""}
+        try {
+          const { process, hash } = JSON.parse(resMessage.data);
+          //this.updateFileLoadState(file, DOWNLOADING, process);
+          if(process !== 100) return;
+          this.addLocalFileRecord(fileStoreKey, ipfsCid);
+          this.removeFileLoadingState(file.id);
+          this.$notify({
+            type:["success","download"],
+            title:"文件已下载",
+            message:`${fileName}`
+          })
+          socketIns.close();
+          // this.$forceUpdate();
+        } catch (e) {
+          console.error('socket-download-file parse data have error:', e);
+          errorHandler();
+          socketIns.close();
+        }
+      }, errorHandler);
+    },
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.download{
+  color:#8C00FF;
+}
+.putaway{
+  color:#888888;
+}
+.delete{
+  color: #D6243A;
+}
+
+</style>

src/views/main_web/workspace/components/recyclefile.vue

@@ -1,112 +0,0 @@
-<template>
-  <div>
-      <div class="yiyun_wenjian_list loding-mask-parent">
-        <div>
-          <!-- 非图片文件图标 -->
-          <div
-            v-if="!oneOf(file.extension, imgExtensionList) && !oneOf(file.extension, VideoExtensionList)"
-            class="defultImage-mid toumin"
-            :class="`${file.extension}-mid ${!oneOf(file.extension,filePreviewList) ? '':''} ` "
-            />
-
-          <!-- 图片文件图标 -->
-          <div
-            v-else-if="oneOf(file.extension, imgExtensionList)"
-            class="defultImage-mid img_bg-mid toumin"
-          >
-            <div class="file_Im gbox-mid">
-              <img v-lazy="file.alias" alt class="file_Img" />
-            </div>
-          </div>
-          <!-- 视频文件图标 -->
-          <div
-            v-else
-            class="defultImage-mid video-mid toumin"
-          >
-          </div>
-          <!-- 右键菜单 -->
-          <div class="contextmenu" v-show="isFileRightMenuVisible"
-          :style="{ top: fileRightMenuTop + 'px', left: fileRightMenuLeft + 'px'}"
-          >
-            <ul class="rightMenu fileRightMenu">
-              <li>下载</li>
-              <li>放回原处</li>
-              <li>彻底删除</li>
-            </ul>
-          </div>
-
-          <!-- 右上设置按钮 -->
-          <!-- 下拉列表 -->
-          <!-- <div class="top_optionBar" v-show="false">
-            <el-dropdown>
-              <span class="el-dropdown-link">
-                <i
-                  class="icon iconfont icon_small-icon_small_wenjianshezhi settingIcon"
-                />
-              </span>
-              <el-dropdown-menu slot="dropdown">
-                <el-dropdown-item
-                  @click.native="fileClick(file)"
-                  v-if="
-                    isClient &&
-                    fileInLocal
-                  "
-                >
-                  <span>打开</span>
-                </el-dropdown-item>
-              </el-dropdown-menu>
-            </el-dropdown>
-          </div> -->
-          <!-- 文件名 -->
-          <strong
-            class="yiyunwenjian_name"
-            :title="file.archName + '.' + file.extension"
-            >{{ file.archName }}<span v-show="!oneOf(file.extension, RecExtensionList)">.{{file.extension}}</span></strong>
-
-          <span
-            class="yiyunwenjian_infodesc"
-            >{{ file.createUserName }} 创建</span>
-        </div>
-      </div>
-  </div>
-</template>
-
-<script>
-const imgExtensionList = ["jpg", "png", "bmp", "gif", "jpeg"];
-const RecExtensionList = ["jpg", "png", "bmp", "gif", "jpeg", "txt", 
-                          "zip", "ae", "ai", "idml","indd","mp3","pr",
-                          "ps","sketch","xmind","skp","rvt","rar","nwc",
-                          "max","dxf","dwg","svfzip","map","supermap","pdf",
-                          "ppt","pptx","excel","xlsx","xls","doc","docx",
-                          "word","folder","folder1","folder2"
-                          ];
-const VideoExtensionList = ["avi", "mov", "wav","mp4"];
-const office =["doc","docx","ppt","pptx","xls","xlsx"];
-const filePreviewList = ["jpg", "png", "bmp", "gif", "jpeg",
-                          "doc","docx","ppt","pptx","xls","xlsx",
-                          "avi", "mov", "wav","mp4","txt","pdf",
-                          "dwg"
-                        ];
-const oneOf = (target, list) => list.indexOf(target) !== -1
-export default {
-    data(){
-      return{
-        imgExtensionList,
-        RecExtensionList,
-        VideoExtensionList,
-        office,
-        filePreviewList,
-      }
-    },
-    methods:{
-      oneOf,
-      async getFilesList(){
-        
-      }
-    }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

src/views/main_web/workspace/recyclebin.vue

@@ -0,0 +1,70 @@
+<template>
+    <div>
+        <app-header
+        theme="basis"
+        showBackBtn
+        backBtnTitle="返回上一界面"
+        title="回收站"
+        showUserCenter
+        isInRecycle
+        >
+        </app-header>
+        <div class="clearfile_box">
+            <div class="clearfile_content">
+                清空
+            </div>
+        </div>
+        <div class="recycle_content">
+            <recycle-file
+            v-for="file in fileList"
+            :key="file.id"
+            :file="file"
+            >
+            </recycle-file>
+        </div>
+
+    </div> 
+</template>
+<script>
+import AppHeader from '../../../components/app-header/app-header.vue';
+import recycleFile from './components/recycle-file.vue'
+import {queryFilesFromRecycleBin, removeFromRecycleBin} from './service'
+export default {
+  components: { recycleFile, AppHeader },
+    created(){
+        this.getRecycleFiles();
+    },
+    mounted(){
+
+    },
+    data(){
+        return{
+            fileList:[],
+        }
+    },
+    methods:{
+        async getRecycleFiles(){
+            const res = await queryFilesFromRecycleBin();
+            this.fileList = res;
+        },
+    }
+
+}
+</script>
+
+<style lang="scss" scoped>
+.recycle_content{
+    padding: 0 64px;
+}
+.clearfile_content{
+    width: 64px;
+    border: 0.5px solid rgba(209, 210, 211, 1);
+    box-sizing: border-box;
+    line-height: 32px;
+    text-align: center;
+    margin: 0 auto;
+    margin-top: 16px;
+    margin-bottom: 13px;
+    cursor: pointer;
+}
+</style>

src/views/main_web/workspace/service.js

@@ -25,6 +25,13 @@ export async function queryFilesFromRecycleBin() {
   });
   return fileList;
 }
+/**
+ * 文件放回原处
+ */
+export async function removeFromRecycleBin(id){
+  const res = await fetchApi('file/removeFromRecycleBin',{fileId:id});
+  return wrapErrorHint(res);
+}
 
 /**
  * 查询文件夹下边的文件（包含子文件夹以及协同文件）

src/views/main_web/workspace/workspace.vue

@@ -5950,6 +5950,7 @@ export default {
      * item：文件对象
      */
     deleteFile: function (item) {
+      console.log(111)
       var thisApp = this;
       this.$confirm("删除文件:" + item.objectName + ", 是否继续?", "提示", {
         confirmButtonText: "确定",