file-item部分代码

public/static/img/警示.svg

@@ -3,7 +3,7 @@
 <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 1024 1024" style="enable-background:new 0 0 1024 1024;" xml:space="preserve">
 <style type="text/css">
-	.st0{fill:#D6243A;}
+	.st0{fill:#c9c9c9;}
 </style>
 <g id="图层_1_1_">
 </g>

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

@@ -50,6 +50,19 @@
           >
             <div class="readytodownload-icon"><img src="/static/img/download.svg" alt class="imgjuzhong" /></div>
           </div>
+
+          <!-- 如果不在工作中 且上一次的修改者不是自己说明文件已经被更新 本地需要下载 -->
+          <div
+          @contextmenu.prevent.stop="
+            rightShowMenu($event, file, 1)
+          "
+          class="downloadIcon"
+          @click="clientDownLoad(file, 1)"
+          v-if="isClient && file.workStatus !== FileWorkStatus.WORKING && file.modifyUserId !== currentUserId
+          "
+          >
+            <div class="readytodownload-icon"><img src="/static/img/download.svg" alt class="imgjuzhong" /></div>
+          </div>
           
           <div
             class="downloadIcon"
@@ -85,23 +98,31 @@
             </span> -->
           </div>
 
-          <!-- 左上角图标 -->
-          <div v-if="file.workStatus === FileWorkStatus.NOT_WORKING" class="yijianxietong isonselect_defual">
+          <!-- 左上角图标 文件上传 显示绿色 -->
+          <div v-if="file.workStatus === FileWorkStatus.NOT_WORKING" class="yijianxietong isonselect">
             <i
               class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon"
-              title="点击启用协同"
-              @click="setFileStatus(file, 2, '更新为已完成', 1)"
+              title="文件处于协同中"
             ></i>
           </div>
 
+          <!-- 文件被修改 显示感叹号图标 灰色 (点击进行文件更新后再次显示绿色) -->
           <div
-            v-if="file.workStatus === FileWorkStatus.NOT_WORKING"
-            class="yijianxietong isonselect"
+            v-if="file.workStatus === FileWorkStatus.WORKING"
+            class="yijianxietong modified-icon-parent"
           >
+            <img src="/static/img/警示.svg" alt
+              class="have-modified-icon"
+              title="文件已经被修改 点击进行文件更新"
+              @click="updateFileWorkStatus(file, 1, '文件已更新', 1)"
+            />
+          </div>
+          
+          <!-- 用户B看到用户A修改后的文件 显示蓝色图标 -->
+          <div v-if="file.workStatus === FileWorkStatus.NOT_WORKING && file.modifyUserId !== currentUserId" class="yijianxietong isonselect_update">
             <i
-              class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon"
-              title="点击暂停协同"
-              @click="setFileStatus(file, 1, '更新为工作中', 1)"
+              class="icon font_family icon-icon_status_wenjianbiaojigengxin yijianIcon"
+              title="当前文件不是最新的文件"
             ></i>
           </div>
 
@@ -169,6 +190,9 @@ export default {
     rightShowMenu: Function,
     clientDownLoad: Function,
     setFileStatus: Function,
+    updateFileWorkStatus: Function,
+    fileClick: Function,
+    fileClickColl: Function
   },
   data() {
     return {
@@ -214,4 +238,13 @@ export default {
   .progress-circle svg .el-progress-circle__track {
     stroke: #fff !important;
   }
+  .have-modified-icon {
+    width : 22px;
+    height: 22px;
+    border-radius: 50%;
+    background-color: #fff;
+  }
+  .modified-icon-parent {
+    background-color:  transparent !important;
+  }
 </style>