workspace update

src/services/system.js

@@ -5,6 +5,7 @@
 import { fetchApi, wrapErrorHint } from '@/utils/request';
 import { notify, firstCharToUpperCase } from '@/utils/tool';
 import { identity } from 'lodash';
+import Vue from 'vue';
 
 export const isClient = !!global.electron; // process.env.IS_CLIENT;
 
@@ -110,71 +111,82 @@ const system = {
     const filePath = filePaths[0];
     const extensionedFileName = filePath.split(/\/|\\/g).pop();
 
+    const tempFilePaths = extensionedFileName.split('.');
+    const extension = tempFilePaths.length > 1 ? tempFilePaths.pop() : '';
+    const fileName = tempFilePaths.join('.');
+
+    const maybeFile = fileList.find(iFile => `${iFile.archName}${iFile.extension ? `.${iFile.extension}` : ''}` === extensionedFileName);
+    // 检测当前工作目录中是否存在同名文件
+    if(maybeFile) {
+      let confirmRes = false;
+      try {
+        await Vue.prototype.$confirm('当前文件夹存在同名文件,是否上传并覆盖？');
+        confirmRes = true;
+      } catch(e) { console.log('user canceled'); }
+      if(!confirmRes) return;
+    }
+    
+    const uploadFile = maybeFile
+      ? firstCharToUpperCase({ ...maybeFile, ModifyUserId: sessionStorage.userId })
+      : {
+        // 文件名称 不带扩展名
+        ArchName: fileName,
+        // CommonStatus: 0,
+        // CreateTime: "string",
+        // 文件上传者Id
+        CreateUserId: sessionStorage.userId,
+        // Deleted: 0,
+        Extension: extension,
+        // 文件大小 单位?
+        // FileSize: +size,
+        // 所处文件夹id
+        FolderId: folderId,
+        // 所处文件夹层级，拼接符：_
+        FolderLevelId: levelId,
+        // Id: 0,
+        // IpfsCid: hash,
+        // IsShowRecycle: 0,
+        // Milestone: 0,
+        // ModifyTime: "string",
+        // ModifyUserId: 0,
+        // 项目id
+        ProjId: projectId,
+        // ShowUrl: "string",
+        // Status: 0,
+        // Version: 0,
+        // WorkStatus: 0
+      };
+
     const socket = io('upload');
     socket.on('open', () => {
       const data = [filePath, extensionedFileName, projectName, folderName].join('|');
       socket.send(data);
+      onProgressHandler({ process: 0 }, uploadFile);
     });
 
     socket.on('message', async (e) => {
       console.log('receive download file message:', e);
       try {
-        const { size, process, hash } = JSON.parse(e.data);
-        onProgressHandler(e);
+        const progressData = JSON.parse(e.data);
+        const { size, process, hash } = progressData;
+        onProgressHandler(progressData, uploadFile);
         if(process !== 100 || !hash) return;
         socket.close();
         // {"size":"88.69","currentSize":"88.69","unit":"KiB","process":100,"hash":""}
         // {"size":"","currentSize":"","unit":"","process":100,"hash":"QmPJ9i4z5UdoQpLH1DrkhZiTZra2rGicXiPabiLw4LvTmX"}
-        const maybeFile = fileList.find(iFile => `${iFile.archName}${iFile.extension ? `.${iFile.extension}` : ''}` === extensionedFileName);
-        if(maybeFile) { // 更新同名文件
-          const copyFile = firstCharToUpperCase({ ...maybeFile, ipfsCid: hash, ModifyUserId: sessionStorage.userId });
-
-          const res = await fetchApi('file/updateFile', copyFile);
-          wrapErrorHint(res);
-          if(res.Code === 0) { notify.success('上传成功, 已覆盖同名文件'); }
-          return;
-        }
-        const tempFilePaths = extensionedFileName.split('.');
-        const extension = tempFilePaths.length > 1 ? tempFilePaths.pop() : '';
-        const fileName = tempFilePaths.join('.');
-        // 1.get file ipfscid
-        const fileObj = {
-          // 文件名称 不带扩展名
-          ArchName: fileName,
-          // CommonStatus: 0,
-          // CreateTime: "string",
-          // 文件上传者Id
-          CreateUserId: sessionStorage.userId,
-          // Deleted: 0,
-          Extension: extension,
-          // 文件大小 单位?
-          FileSize: +size,
-          // 所处文件夹id
-          FolderId: folderId,
-          // 所处文件夹层级，拼接符：_
-          FolderLevelId: levelId,
-          // Id: 0,
-          IpfsCid: hash,
-          // IsShowRecycle: 0,
-          // Milestone: 0,
-          // ModifyTime: "string",
-          // ModifyUserId: 0,
-          // 项目id
-          ProjId: projectId,
-          // ShowUrl: "string",
-          // Status: 0,
-          // Version: 0,
-          // WorkStatus: 0
-        }
-        // console.log('trying to execute file/addFile:', fileObj);
-        // socket.close();
-        const res = await fetchApi('file/addFile', fileObj);
+        // const maybeFile = fileList.find(iFile => `${iFile.archName}${iFile.extension ? `.${iFile.extension}` : ''}` === extensionedFileName);
+        uploadFile.FileSize = +size;
+        uploadFile.IpfsCid = hash;
+        const res = await fetchApi(`file/${maybeFile ? 'updateFile' : 'addFile'}`, uploadFile);
         wrapErrorHint(res);
         if(res.Code !== 0) return;
-        notify.success('上传成功');
-        onSuccessHandler(fileObj);
+        notify.success(maybeFile ? '上传成功, 已覆盖同名文件' : '上传成功');
+        onSuccessHandler(uploadFile);
+        
       } catch (e) {
         console.error('socket-upload-file parse data have error:', e);
+        // todo 上传失败
+
       }
     });
   }),
@@ -206,6 +218,7 @@ const system = {
         return;
       } catch(err) {
         console.error('socket-update-file parse data have error:', e);
+        // todo 上传失败
       }
     });
   }),

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

@@ -35,7 +35,7 @@
           <!-- 标签 -->
           <div
             class="eidtTip"
-            v-if="file.workStatus == 2 && file.modifyUserId !== currentUserId"
+            v-if="file.workStatus == FileWorkStatus.WORKING && file.modifyUserId !== currentUserId"
           >
             工作中
           </div>
@@ -55,6 +55,7 @@
 
 <script>
 import system from "@/services/system";
+import { FileWorkStatus, DownloadStatus } from './helper';
 
 const imgExtensionList = ["jpg", "png", "bmp", "gif", "jpeg"];
 
@@ -62,13 +63,15 @@ export default {
   props: {
     file: {
       type: Object,
-      default: {},
-      currentUserId: sessionStorage.userId,
+      default: () => ({}),
     },
   },
   data() {
     return {
       isClient: system.isClient,
+      currentUserId: sessionStorage.userId,
+      FileWorkStatus,
+      DownloadStatus
     };
   },
   computed: {

src/views/main_web/workspace/helper.js

@@ -0,0 +1,27 @@
+export const DownloadStatus = {
+  /**
+   * 未下载
+   */
+  UNDOWNLOAD: 0,
+  /**
+   * 正在下载
+   */
+  DOWNLOADING: 1,
+  /**
+   * 已下载/已上传
+   */
+  DOWNLOADED: 2,
+  /**
+   * 上传中
+   */
+  UPLOADING: 3,
+}
+/**
+ * 文件工作状态 
+ */
+export const FileWorkStatus = {
+  // 非工作中
+  NOT_WORKING: 1,
+  // 工作中
+  WORKING: 2,
+}

src/views/main_web/workspace/workspace.vue

@@ -449,6 +449,17 @@
                     <span class="newbtn_label">新建文件</span>
                   </div>
                 </div>
+                <div
+                  class="list-group"
+                  v-show="false"
+                >
+                  <FileItem
+                    class="lisy-group-item"
+                    v-for="file in uploadFileList"
+                    :key="file.id"
+                    :file="file"
+                  />
+                </div>
                 <!-- zxm修改托拽 start -->
                 <!--显示文件 -->
                 <draggable
@@ -2599,7 +2610,8 @@ import vuetify from "vuetify";
 import system from '@/services/system';
 import * as services from './service';
 import { firstCharToLowerCase, firstCharToUpperCase, notify } from '@/utils/tool';
-
+import FileItem from './components/file-item';
+import { FileWorkStatus, DownloadStatus } from './helper';
 
 const $ = window.jQuery;
 const Velocity = window.Velocity;
@@ -2620,32 +2632,6 @@ const initialTempFile = (folderGroupID, folderGroupName) => ({
   superID: "",
 });
 
-const DownloadStatus = {
-  /**
-   * 未下载
-   */
-  UNDOWNLOAD: 0,
-  /**
-   * 正在下载
-   */
-  DOWNLOADING: 1,
-  /**
-   * 已下载/已上传
-   */
-  DOWNLOADED: 2,
-  /**
-   * 上传中
-   */
-  UPLOADING: 3,
-}
-/**
- * 文件工作状态 
- */
-const FileWorkStatus = {
-  NOT_WORKING: 1,
-  WORKING: 2,
-}
-
 const fileIsDownloaded = file => file.downloadStatus === DownloadStatus.DOWNLOADED;
 
 export default {
@@ -2890,6 +2876,7 @@ export default {
       fileDownloadStatusHash: {}, // 文件上传/下载状态存储
       folderMap: {}, // 文件夹id哈希： { [folderId]: folder } 
       fileLocalStateMap: {}, // 本地网关文件通信数据缓存: { [fileId]: {  } }
+      uploadFileList: [], // 文件上传队列
     };
   },
   created: function () {
@@ -4776,13 +4763,39 @@ export default {
       // console.log(folderName, levelId, folderId);
       system.uploadFile(
         sessionStorage.projId, sessionStorage.projName, folderId, folderName, levelId, this.myFilesList,
-        (file) => {
+        (file) => { // onSuccess
           const {ArchName, IpfsCid} = file;
           // 注入到文件下载检测表中
           const key = `${folderName}\\${ArchName}`;
           this.fileDownloadStatusHash[key] = IpfsCid;
           this.refreshFileStatus();
-        }
+        },
+        (progressData, uploadFile) => { // onLoading
+          const { process, hash } = progressData;
+          const updateState = {
+            loadProgress: process,
+            downloadStatus: process === 100 ? DownloadStatus.DOWNLOADED : DownloadStatus.UPLOADING,
+            isDownload: true,
+          };
+          if(uploadFile.Id) { // 若为同名覆盖
+            const stateMap = this.fileLocalStateMap;
+            stateMap[uploadFile.Id] = updateState;
+            this.refreshFileStatus();
+            return;
+          }
+          const targetFile = this.uploadFileList.find(iFile => iFile.archName === uploadFile.ArchName && iFile.extension === uploadFile.Extension);
+          if(targetFile) {
+            const shadowFile = firstCharToLowerCase({ ...targetFile, ...updateState });
+            this.uploadFileList = this.uploadFileList.map(iFile => {
+              if(iFile.archName === shadowFile.archName && iFile.extension === shadowFile.extension) {
+                return shadowFile;
+              }
+              return iFile;
+            });
+            return;
+          }
+          this.uploadFileList.push(firstCharToLowerCase({ ...uploadFile, ...updateState }));
+        },
       );
     },
     /**
@@ -7229,6 +7242,7 @@ export default {
     WorkLine: WorkLine,
     draggable: draggable,
     AppHeader,
+    FileItem,
   },
 };
 </script>