补回工作中状态 添加同步按钮 更新按钮替换为下载图标 (#11)

src/views/main_web/project/components/plain-folder-list.vue

@@ -197,7 +197,7 @@ export default {
   methods: {
     //判断是否存在可嵌套节点
     canNest(folder) {
-      console.log(folder);
+      // console.log(folder);
       return true;
       // let len = this.nestNodeList.length;
       // for (let i = 0; i < len; i++) {

src/views/main_web/workspace/components/file-explorer/index.vue

@@ -1922,12 +1922,12 @@ export default {
 
       if(isCooperationFile) {  system.clientOpenFileWith(filePath); return; }
       // 将文件状态设置为编辑中
-      // const flagRes = await services.changeFileWorkStatus(fileId, 2);
-      // if(flagRes.Code !== 0) return;
-      // file.workStatus = 2;
-      // file.modifyUserId = sessionStorage.userId;
+      const flagRes = await services.changeFileWorkStatus(fileId, 2);
+      if(flagRes.Code !== 0) return;
+      file.workStatus = 2;
+      file.modifyUserId = sessionStorage.userId;
       system.clientOpenFileWith(filePath);
-      // this.fetchFolderFiles();
+      this.fetchFolderFiles();
     },
     /**
      * 点击文件事件：直接打开文件
@@ -1935,38 +1935,37 @@ export default {
     fileClick: async function (file) {
       //debugger;
       if(!this.isClient) return;
-      // const { archName, extension, id: fileId, nodeName } = file;
+      const { archName, extension, id: fileId, nodeName } = file;
       // const folderName = nodeName || this.currentFolder.folderName;
       const localWorkspacePrefix = this.localWorkspacePrefix;
-      // const isCooperationFile = !!nodeName;
+      const isCooperationFile = !!nodeName;
       // const fileStoreKey = `${folderName}${isCooperationFile ? '\\协作文件': ''}\\${archName}${extension ? `.${extension}` : ''}`;
       const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
       if(!this.localFileHashMap[fileStoreKey]) return;                   
       const filePath = `${localWorkspacePrefix}\\${fileStoreKey}`;
       
-      // if(!isCooperationFile && (file.workStatus === 2 && sessionStorage.userId !== file.modifyUserId)) {
+      if(!isCooperationFile && (file.workStatus === 2 && sessionStorage.userId !== file.modifyUserId)) {
       //  console.log("1111")
-      //  this.$notify({
-      //    type:["warning"],
-      //    title:"暂不能打开此文件",
-      //    message:`${file.modifyName}正在编辑此文件，请在“工作中”标识消失后再尝试打开。`
-      //  })
-      //   return;
-      // }
+       this.$notify({
+         type:["warning"],
+         title:"暂不能打开此文件",
+         message:`${file.modifyName}正在编辑此文件，请在“工作中”标识消失后再尝试打开。`
+       })
+        return;
+      }
       
-      // // 若文件在协作文件中，则不更改状态
-      // if(isCooperationFile) { system.openFile(filePath); return; }
-      // // 将文件状态设置为编辑中
-
-      // if(file.workStatus !== 2) {
-      //     file.workStatus = 2;
-      //     const flagRes = await services.changeFileWorkStatus(fileId, 2);
-      //     if(flagRes.Code !== 0) return;
-      // }
+      // 若文件在协作文件中，则不更改状态
+      if(isCooperationFile) { system.openFile(filePath); return; }
+      // 将文件状态设置为编辑中
+      if(file.workStatus !== 2) {
+        file.workStatus = 2;
+        const flagRes = await services.changeFileWorkStatus(fileId, 2);
+        if(flagRes.Code !== 0) return;
+      }
     
       file.modifyUserId = sessionStorage.userId;
       system.openFile(filePath);
-      // this.fetchFolderFiles();
+      this.fetchFolderFiles();
     },
     /**
      * 右键菜单

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

@@ -15,14 +15,14 @@
               v-if="!oneOf(file.extension, imgExtensionList) && !oneOf(file.extension, VideoExtensionList)"
               class="defultImage-mid"
               :class="`${file.extension}-mid ${
-                fileIsLoading || showDownloadMask ? 'toumin' : ''
+                fileIsLoading || (isInWorkFolder && otherUserIsWorking) ? 'toumin' : ''
               } ${!oneOf(file.extension,filePreviewList) ? '':''} ` "
               />
             <!-- 图片文件图标 -->
             <div ref="file-img"
               v-else-if="oneOf(file.extension, imgExtensionList)"
               class="defultImage-mid img_bg-mid"
-              :class=" fileIsLoading || showDownloadMask  ? 'toumin' : ''"
+              :class=" fileIsLoading ||(isInWorkFolder && otherUserIsWorking) || showDownloadMask  ? 'toumin' : ''"
             >
               <div class="file_Im gbox-mid">
                 <img v-lazy="file.alias" alt class="file_Img" />
@@ -39,6 +39,12 @@
 
           <template v-if="isClient">
             <!-- 如果不在工作中 且上一次的修改者不是自己说明文件已经被更新 本地需要下载 -->
+            <div
+              class="eidtTip"
+              v-if="otherUserIsWorking"
+            >
+              工作中
+            </div>
             <!-- 待下载 状态蒙板 -->
             <div
               class="downloadIcon"
@@ -79,9 +85,9 @@
             </div>
        
             <!-- 左上角图标 -->
-            <template v-if="fileInLocal && !fileIsLoading">
+            <template v-if="fileInLocal && isInWorkFolder && !fileIsLoading">
               <!-- 灰色感叹号 协作文件无灰色钩-->
-              <div
+              <!-- <div
                 class="yijianxietong have-modified-icon"
                 v-if="isInWorkFolder && !fileEnableShare"
               >
@@ -90,9 +96,9 @@
                   title="点击开启文件协同"
                   @click.stop="toggleFileShareStatus"
                 />
-              </div>
+              </div> -->
               <!-- 蓝色更新图标 只有协作文件有更新图标-->
-              <div
+              <!-- <div
                 v-if="isFileNeedsUpdate"
                 class="yijianxietong"
               >
@@ -101,17 +107,21 @@
                   title="当前文件不是最新的文件 点击获取最新文件"
                   @click="clientDownLoad(file, 1)"
                 />
-              </div>
+              </div> -->
+              <!-- 提交标识 蓝色“同步”-->
+              <div
+                class="file-left-top-icon commit"
+                title="提交当前文件内容"
+                v-if="isFileModified"
+                @click.stop="commitFile"
+              >同步</div>
               <!-- 绿色钩 协作文件无绿色钩-->
               <div
-                v-if="isInWorkFolder && fileEnableShare"
+                v-if="fileEnableShare"
                 class="yijianxietong isonselect"
+                title="文件已协同"
               >
-                <i
-                  class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon"
-                  title="点击关闭文件协同"
-                  @click.stop="toggleFileShareStatus"
-                />
+                <i class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon" />
               </div>
             </template>
           </template>
@@ -139,8 +149,7 @@
               
               <li v-if="isClient && isInWorkFolder" @click.stop="copyFileBtnClick">创建文件副本</li>
               <li v-if="isClient && isInWorkFolder" @click.stop="deleteFileClick">移动到回收站</li>
-              <li v-if="!isClient && oneOf(file.extension,filePreviewList)"
-                  @click.stop="filePreview">在线预览</li>
+              <li v-if="!isClient && oneOf(file.extension,filePreviewList)" @click.stop="filePreview">在线预览</li>
               <li v-else-if="!isClient && !(oneOf(file.extension,filePreviewList))" class="function-disabled" title="暂时不支持此类文件的预览">在线预览</li> 
               <!-- 查看历史版本 -->
               <li v-if="isClient && isInWorkFolder && fileInLocal" @click.stop="checkMilestoneClick">查看历史版本</li>
@@ -150,7 +159,7 @@
 
           <!-- 右上设置按钮 -->
           <!-- 下拉列表 -->
-          <div class="top_optionBar" v-show="false">
+          <!-- <div class="top_optionBar" v-show="false">
             <el-dropdown>
               <span class="el-dropdown-link">
                 <i
@@ -169,7 +178,7 @@
                 </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
-          </div>
+          </div> -->
           <!-- 文件名 -->
           <strong ref="file-name"
             class="yiyunwenjian_name"
@@ -315,10 +324,11 @@ export default {
       if(this.fileIsLoading) return false;
       if(!this.isInWorkFolder) return !this.fileInLocal;
       if(!this.fileInLocal) return true;
+      if(this.otherUserIsWorking) return false;
       //如果我有还没有提交的修改 优先显示灰色图标 -> 要让用户提交操作
       if(this.isFileModified) return false;
       // 如果本地和远端的记录不同步 -》 不显示下载图标 -》 而是可以让用户点击蓝色图标选择更新获取最新文件
-      if(this.isFileNeedsUpdate) return false;
+      // if(this.isFileNeedsUpdate) return false;
       //工作文件的更新就是显示下载图标
       return this.isInWorkFolder && this.isFileNeedsUpdate;
     },
@@ -383,10 +393,10 @@ export default {
       return !!this.localIpfsCid;
     },
     // 其他人员正在修改
-    // otherUserIsWorking() {
-    //   const { modifyUserId, workStatus } = this.file;
-    //   return workStatus === WORKING && modifyUserId !== this.currentUserId;
-    // }
+    otherUserIsWorking() {
+      const { modifyUserId, workStatus } = this.file;
+      return workStatus === WORKING && modifyUserId !== this.currentUserId;
+    }
   },
   methods: {
     commitFile() {
@@ -578,10 +588,10 @@ export default {
     left: 0;
   }
   .gray{
-    -webkit-filter: grayscale(100%);
-    -moz-filter: grayscale(100%);
-    -ms-filter: grayscale(100%);
-    -o-filter: grayscale(100%);
+    // -webkit-filter: grayscale(100%);
+    // -moz-filter: grayscale(100%);
+    // -ms-filter: grayscale(100%);
+    // -o-filter: grayscale(100%);
     
     filter: grayscale(100%);
 	
@@ -599,7 +609,21 @@ export default {
     text-align: right;
     font-family: PingFangSC-Regular;
   }
-
+  .file-left-top-icon  {
+    position: absolute;
+    top: 4px;
+    left: 3px;
+    &.commit {
+      width: 56px;
+      height: 28px;
+      line-height: 28px;
+      border-radius: 21px;
+      background-color: #327DFF;
+      color: rgba(#f5f5f7, 0.7);
+      font-size: 14px;
+      box-shadow: 0 1px 2px rgb(#666, 0.2);
+    }
+  }
 </style>
 
 <style lang="scss">