From 4a542f1d99e9450ec891733e51b5b8c2e30a60d3 Mon Sep 17 00:00:00 2001
From: zhengzhou <zhengzhou@hotmail.com>
Date: Tue, 23 Mar 2021 18:44:39 +0800
Subject: [PATCH] update

---
 src/components/search-bar/search-bar.vue      |    4 +
 .../components/file-explorer/index.vue        | 2372 +++++++++++++++++
 .../file-explorer/search-result.vue           |   63 +
 .../workspace/components/work-flow.vue        |  196 ++
 src/views/main_web/workspace/index.vue        |  525 ++--
 .../main_web/workspace/workspace.new.vue      |   20 +-
 6 files changed, 2913 insertions(+), 267 deletions(-)
 create mode 100644 src/views/main_web/workspace/components/file-explorer/index.vue
 create mode 100644 src/views/main_web/workspace/components/file-explorer/search-result.vue
 create mode 100644 src/views/main_web/workspace/components/work-flow.vue

diff --git a/src/components/search-bar/search-bar.vue b/src/components/search-bar/search-bar.vue
index c34a06af..17e4156d 100644
--- a/src/components/search-bar/search-bar.vue
+++ b/src/components/search-bar/search-bar.vue
@@ -36,6 +36,10 @@
         isShowSearchBar: false,
       }
     },
+    model: {
+      prop: 'value',
+      event: 'input'
+    },
     props: {
       placeholder: {
         type: String,
diff --git a/src/views/main_web/workspace/components/file-explorer/index.vue b/src/views/main_web/workspace/components/file-explorer/index.vue
new file mode 100644
index 00000000..af46d310
--- /dev/null
+++ b/src/views/main_web/workspace/components/file-explorer/index.vue
@@ -0,0 +1,2372 @@
+<template>
+  <div class="file-explorer">
+    <div v-if="isShowSearchPage" class="search-res-page">
+      <change-btn :titleList="titleList" class="operate-bar"
+                  @changeContentBtnClick="changeContentBtnClick"/>
+      <div class="out-wrap"> 
+        <div class="search-res-page-wrap">
+          <div class="list-group" v-if="currentBtnIndex == 0">
+            <!-- 工作文件 -->
+            <FileItem
+              class="lisy-group-item"
+              v-for="file in searchWorkFileList"
+              :key="file.id"
+              :file="file"
+              :clientDownLoad="clientDownLoad"
+              :showFileMilestone="showFileMilestone"
+              :nodeFolder="currentNodeFolder"
+              :currentFolder="currentFolder"
+              @commitFile="showCommitWindow"
+              @dblclickFile="fileClick(file)"
+              @filePreview="filePreview"
+              @openFileWith="openFileWith(file)"
+              @openfileBtnClick="fileClick(file)"
+              @copyFileBtnClick="copyWorkFileBtnClick(file)"
+              @oneFileRightBtnClick="oneFileRightBtnClick"
+              @deleteFileClick="deleteFileClick"
+              @checkMilestoneClick="checkMilestoneClick"
+              :tempRightFileId="tempRightFileId"
+              :localFileHashMap="localFileHashMap"
+              :loadingState="localFileLoadStateMap[file.id]"
+              @dragstart.native="onfileDragStart(file, $event)"
+              draggable
+            />
+            <div class="no-file-tips" v-if="searchWorkFileList && searchWorkFileList.length == 0">搜索不到与“{{searchContent}}”相关的工作文件</div>
+          </div>
+          <div class="list-group" v-else-if="currentBtnIndex == 1">
+            <!-- 协作文件 -->
+            <FileItem
+              v-for="file in searchCoopFileList"
+              :key="file.id"
+              :file="file"
+              :tempRightFileId="tempRightFileId"
+              :clientDownLoad="clientDownLoad"
+              :showFileMilestone="showFileMilestone"
+              :nodeFolder="currentNodeFolder"
+              :currentFolder="currentFolder"
+              @dblclickFile="fileClick(file)"
+              @filePreview="filePreview"
+              @openFileWith="openFileWith(file)"
+              @openfileBtnClick="fileClick(file)"
+              @oneFileRightBtnClick="oneFileRightBtnClick"
+              :localFileHashMap="localFileHashMap"
+              :loadingState="localFileLoadStateMap[file.id]"
+              @dragstart.native="onfileDragStart(file, $event)"
+              draggable
+            />
+            <div class="no-file-tips" v-if="searchCoopFileList && searchCoopFileList.length == 0">搜索不到与“{{searchContent}}”相关的协作文件</div>
+          </div>
+        </div>
+    </div>
+    </div>
+    <div v-else>
+      <div class="listfilewarp mt-0">
+          <div class="layout_content2" v-loading="loading">
+            <section 
+              id="workspace"
+              class="layerout_H2"
+              :class="[`${closepageH} `, { 'set-workarea-height': isShowShadow && !closepageH}]"
+              @contextmenu.prevent="rightShowMenu($event, '新建文件夹', 4)"
+            >
+              <section class="yiyun_section_warp">
+                <div class="yinyong_warpBox hidescollbar">
+                  <div class="titlebar_head" id="bignav">
+                    <!-- 面包屑导航 -->
+                    <div
+                      class="section_item section_item_aside_fl"
+                    >
+                      <span
+                        class="yiyun_text-title-workspace" 
+                      >
+                        <el-breadcrumb class="folder_breadcrumb" separator-class="el-icon-arrow-right">
+                          <el-breadcrumb-item @click.native="clickBreadcrumb(-1, 0)">工作文件</el-breadcrumb-item>
+                          <el-breadcrumb-item
+                            v-for="(breadFolder, breadIdx) in breadcrumbFolderList"
+                            :key="breadFolder.id"
+                            @click.native="clickBreadcrumb(breadIdx, 0)"
+                          >{{breadFolder.folderName}}</el-breadcrumb-item>
+                        </el-breadcrumb>
+                      </span>
+                    </div>
+                    <!-- 工作列表主体 -->
+                    <div
+                      class="use-relative scollbarBox nobianju"
+                    >
+                      <AddFileButton
+                        v-if="isClient"
+                        @fileTempClick="fileTempClick"
+                        :currentNodeFolder="currentNodeFolder"
+                        :selectSystemFiles="selectSystemFiles"
+                        :selectSystemFolders="selectSystemFolders"
+                      />
+                      <!-- 文件上传队列 -->
+                      <div class="list-group" v-if="uploadFileList && uploadFileList.length > 0">
+                        <FileItem
+                          class="lisy-group-item"
+                          v-for="file in filterFilesInWork(uploadFileList)"
+                          :key="file.id"
+                          :file="file"
+                          :clientDownLoad="clientDownLoad"
+                          :showFileMilestone="showFileMilestone"
+                          :nodeFolder="currentNodeFolder"
+                          :currentFolder="currentFolder"
+                          :localFileHashMap="localFileHashMap"
+                          :loadingState="localFileLoadStateMap[file.id]"
+                        />
+                      </div>
+                      <div class="list-group" v-if="workFileList && workFileList.length > 0">
+                        <FileItem
+                          class="lisy-group-item"
+                          v-for="file in filterFilesInWork(workFileList)"
+                          :key="file.id"
+                          :file="file"
+                          :clientDownLoad="clientDownLoad"
+                          :showFileMilestone="showFileMilestone"
+                          :nodeFolder="currentNodeFolder"
+                          :currentFolder="currentFolder"
+                          @commitFile="showCommitWindow"
+                          @dblclickFile="fileClick(file)"
+                          @filePreview="filePreview"
+                          @openFileWith="openFileWith(file)"
+                          @openfileBtnClick="fileClick(file)"
+                          @copyFileBtnClick="copyWorkFileBtnClick(file)"
+                          @oneFileRightBtnClick="oneFileRightBtnClick"
+                          @deleteFileClick="deleteFileClick"
+                          @checkMilestoneClick="checkMilestoneClick"
+                          :tempRightFileId="tempRightFileId"
+                          :localFileHashMap="localFileHashMap"
+                          :loadingState="localFileLoadStateMap[file.id]"
+                          @dragstart.native="onfileDragStart(file, $event)"
+                          draggable
+                        />
+                      </div>
+                      <!--显示文件夹组 -->
+                      <div class="list-group">
+                        <FolderItem
+                          v-for="folder in filterFoldersInWork(subFolderList)"
+                          :key="folder.id"
+                          :folder="folder"
+                          :isLoading="localFolderLoadStateMap[folder.folderPath]"
+                          @onRightMenuActive="oneFileRightBtnClick"
+                          @onDownloadAll="downloadFolder"
+                          :activeRightMenuId="tempRightFileId"
+                          @dblclick.native="intoSubFolder(folder, 0)"
+                          @commitFolder="commitFolder"
+                          :filterFolderList="filterFoldersInTarget(subFolderList, folder)"
+                          :filterFileList="filterFilesInTarget(workFileList, folder)"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </section>
+            </section>
+
+            <div :class="[`${neibianju}`, {'coopBox-max-height': isShowShadow && isCollapse}]" id="bottomBox">
+              <div class="titleBox">
+                <span class="yiyun_zhediebtn DevtopIcon">
+                  <i
+                    class="Cicon text_gray icon font_family icon-icon_zhankai"
+                    title="展开面板"
+                    v-show="isCollapse"
+                    @click.stop="openCopage"
+                  ></i>
+                  <i
+                    class="Cicon text_gray icon font_family icon-icon_shouqi"
+                    title="折叠面板"
+                    v-show="!isCollapse"
+                    @click.stop="closeCopage"
+                  ></i>
+                </span>
+              
+                <div class="title_warp">
+                  <div class=" " id="bignav">
+
+                    <div class="section_item fl section_item_aside_fl xiangdui">
+                      <div class="tabtltlebox">
+                        <div
+                        class="section_item section_item_aside_fl"
+                        >
+                          <span
+                            class="yiyun_text-title-workspace mr-20 ml-8"
+                          >
+                            <el-breadcrumb class="folder_breadcrumb" separator-class="el-icon-arrow-right">
+                              <el-breadcrumb-item @click.native="clickBreadcrumb(-1, 1)">协作文件</el-breadcrumb-item>
+                              <el-breadcrumb-item
+                                v-for="(breadFolder, breadIdx) in breadcrumbFolderListInCoop"
+                                :key="breadFolder.id"
+                                @click.native="clickBreadcrumb(breadIdx, 1)"
+                              >{{breadFolder.folderName}}</el-breadcrumb-item>
+                            </el-breadcrumb>
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="section_item fr section_item_aside_fr">
+                      <div class="fr ml-10">
+                        <span class="bj_label">协作文件均只读</span>
+                      </div>
+                      <div class="fifle_search fr"></div>
+                    </div>
+                  </div>
+                  <div class="clear"></div>
+                </div>
+              </div>
+
+              <div class="fifleBox" id="coopFileContainer">
+                <div class="yiyun_section_warp layerout_H3" id="coopFileBox">
+                  <!-- 文件大box -->
+                  <div class="yinyong_warpBox">
+                    <!-- 协作文件 -->
+                    <div v-if="!isShowStartNodeFolders">
+                      <div
+                        class="mt-12"
+                      >
+                        <FileItem
+                          v-for="file in filterFilesInCoop(cooperationFileList)"
+                          :key="file.id"
+                          :file="file"
+                          :tempRightFileId="tempRightFileId"
+                          :clientDownLoad="clientDownLoad"
+                          :showFileMilestone="showFileMilestone"
+                          :nodeFolder="currentNodeFolder"
+                          :currentFolder="currentFolder"
+                          @dblclickFile="fileClick(file)"
+                          @filePreview="filePreview"
+                          @openFileWith="openFileWith(file)"
+                          @openfileBtnClick="fileClick(file)"
+                          @oneFileRightBtnClick="oneFileRightBtnClick"
+                          :localFileHashMap="localFileHashMap"
+                          :loadingState="localFileLoadStateMap[file.id]"
+                          @dragstart.native="onfileDragStart(file, $event)"
+                          draggable
+                        />
+                      </div>
+                      <!-- 协作文件以文件夹的形式展示 -->
+                      <div class="list-group">
+                          <FolderItem
+                          v-for="folder in filterFoldersInCoop(coopSubFolderList)"
+                          :key="folder.id"
+                          :folder="folder"
+                          :isWorkFolder=false
+                          :isLoading="localFolderLoadStateMap[folder.folderPath]"
+                          @onRightMenuActive="oneFileRightBtnClick"
+                          @onDownloadAll="downloadFolder"
+                          :activeRightMenuId="tempRightFileId"
+                          @dblclick.native.stop="intoSubFolder(folder, 1)"
+                          @commitFolder="commitFolder"
+                          :filterFolderList="filterFoldersInTarget(coopSubFolderList, folder, true)"
+                          :filterFileList="filterFilesInTarget(cooperationFileList, folder, true)"
+                        />
+                      </div>
+                    </div>
+                    <div v-else>
+                      <div class="list-group">
+                        <FolderItem 
+                        v-for="folder in exchangeNodeListsInCoop"
+                        :key="folder.id"
+                        :folder="folder"
+                        :isWorkFolder=false
+                        :isLoading="localFolderLoadStateMap[folder.folderPath]"
+                        @onRightMenuActive="oneFileRightBtnClick"
+                        @onDownloadAll="downloadFolder"
+                        :activeRightMenuId="tempRightFileId"
+                        @dblclick.native.stop="intoSubFolder(folder, 1), isShowStartNodeFolders = !isShowStartNodeFolders, topFolderInCoop = folder"
+                        @commitFolder="commitFolder"
+                        :filterFolderList="getRealChildFolderLists(folder)"
+                        :filterFileList="getRealChildFileLists(folder)"
+                      />
+                    </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+              <div class="showdowfix" id="bottomoShadow" v-show="isShowShadow"></div>
+
+            </div>
+
+            <!-- 右键菜单 -->
+            <div
+              v-show="rightMenuvisible" ref="right-menu"
+              :style="{ left: rightMenuleft + 'px', top: rightMenuTop + 'px' }"
+              class="contextmenu"
+            >
+              <!--新建文件分组-->
+              <ul
+                class="rightMenu"
+              >
+                <li
+                  @click="newCreateFolderGroup"
+                >
+                  新建文件夹
+                </li>
+                <li
+                  @click="openNativeCurrentFolder"
+                  v-if="isClient && this.localWorkspacePrefix"
+                >
+                  打开本地工作目录
+                </li>
+              </ul>
+            </div>
+          </div>
+    
+      </div>
+    </div>
+
+    <!-- 文件在线预览 -->
+    <el-dialog
+    width="900px"
+    :visible.sync="isVideo"
+    :close-on-click-modal="false"
+    @close="videoClose"
+    >
+    <div class="filePreview">
+      <video :src="videoSrc" controls="controls"></video>
+    </div>
+
+    </el-dialog>
+
+    <!-- 创建文件夹组 -->
+    <el-dialog
+      title="创建文件夹"
+      @submit.native.prevent
+      :visible.sync="dialogNewFolderGroup"
+      width="460px"
+      :close-on-click-modal="false"
+    >
+      <el-form>
+        <div class="appImgiconbox">
+          <img src="/static/img/folder.png" alt />
+        </div>
+        <el-form-item>
+          <el-input
+            v-model="folderGroupData.FolderName"
+            @keyup.enter.native="createSubFolder"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogNewFolderGroup = false">取 消</el-button>
+        <el-button @click="createSubFolder()" type="primary">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 创建样本文件分组 -->
+    <el-dialog v-if="currentSelectTempFile" class="temp-file-dialog"
+      :title="showNewTemplateFileDialogTitle"
+      @submit.native.prevent
+      :visible.sync="isShowNewTemplateFileDialog"
+      width="460px"
+      :show-close="false"
+      :close-on-click-modal="false"
+      >
+      <el-form>
+        <div class="appImgiconbox"
+        v-if="oneOf(currentSelectTempFile.extension, ['doc','docx','dwg','dxf','gif','jpeg','jpg','max','nwc','pdf','png','ppt','pptx','rar','rvt','skp','txt','xls','xlsx','xmind','zip'])">
+          <img  
+          :src="
+            '/static/img/files/file_sample_' + currentSelectTempFile.extension + '.svg'
+          "
+          alt
+          />
+        </div>
+        <div v-else class="img-container">
+            <!-- 非图片文件图标 -->
+            <div
+            v-if="notPicIcon()"
+            class="defultImage-small"
+            :class="`${currentSelectTempFile.extension}-mid`"
+            />
+              <!-- 图片文件图标 -->
+            <div
+                v-else-if="picIcon()"
+                class="defultImage-small img_bg-mid"
+            >
+              <div class="file_Im gbox-mid">
+                <img v-lazy="currentSelectTempFile.alias" alt class="file_Img" />
+              </div>
+            </div>
+            <!-- 视频文件图标 -->
+            <div
+            v-else
+            class="video-small"
+            >
+          </div>
+        </div>
+        <div class="guide-template-file-name">{{projectName + '_' + currentNodeFolder.folderName + '_' + currentSelectTempFile.fileName + '.' + currentSelectTempFile.extension}}</div>
+        <el-form-item>
+          <el-input
+            v-model="currentSelectTempFile.fileName"
+            @keyup.enter.native="createTemplateFile"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="isShowNewTemplateFileDialog = false">取 消</el-button>
+        <el-button @click.stop="createTemplateFile()" type="primary">完成创建</el-button>
+      </div>
+      </el-dialog>
+      
+      <!-- 文件提交判断 -->
+      <commit-judge ref="commit-judge"
+                    :file="commitJudgeFile"
+                    :fileImgClass="fileImgClass"
+                    :isShowCommitJudgeWindow="isShowCommitJudgeWindow"
+                    :coopFolderList="coopFolderList"
+                    @closeCommitJudge="closeCommitJudge"
+                    @finishCommitFile="finishCommitFile"
+      />
+    <!-- 查看历史版本 -->
+    <file-milestone
+      :visible="checkMilestoneShow"
+      :fileMilestoneInfo="fileMilestoneInfo"
+      @closeMilestonePain="closeMilestonePain"
+      @makeCopy="copyWorkFileBtnClick"
+      @openFile="fileClick"
+      :localWorkspacePrefix="localWorkspacePrefix"
+      :fileHistoryList ="fileHistoryList"
+      :file="currentFile"
+    > 
+
+    </file-milestone>
+  </div>
+</template>
+
+<script>
+import Vue from 'vue';
+import CommitJudge from '../commit-judge.vue'
+import fileMilestone from '../file-milestone.vue'
+import FileItem from '../file-item.vue';
+import FolderItem from '../folder-item.vue';
+import ChangeBtn from "@/components/change-btn/change-btn";
+import vuetify from "vuetify";
+import system from '@/services/system';
+import { firstCharToLowerCase, firstCharToUpperCase, notify } from '@/utils/tool';
+import AddFileButton from '../add-file-button';
+import * as services from '../../service';
+import { FileWorkStatus, getFileStoreKey, injectionFileLocalStatus, LoadingEnum, VirtualFolder, analyzeRelativePath, imgExtensionList, RecExtensionList, VideoExtensionList, office, filePreviewList } from '../../helper';
+import { propertyOf, uniqBy, throttle, flatten, debounce, cloneDeep } from 'lodash';
+
+const $ = window.jQuery;
+const Velocity = window.Velocity;
+Vue.use(vuetify);
+const { DOWNLOADING, UPLOADING } = LoadingEnum;
+const { WORKING, NOT_WORKING } = FileWorkStatus;
+
+const initialTempFile = (folderGroupID, folderGroupName) => ({
+  archID: null,
+  childCount: 0,
+  createTime: "",
+  createUserID: "",
+  deleted: 0,
+  folderGroupID,
+  folderGroupName,
+  folderID: "",
+  levelId: "",
+  modifyTime: "",
+  modifyUserID: "",
+  superID: "",
+});
+
+const initialFolderData = () =>({
+  Id:"",
+  ProjId:"",
+  SuperId:"",
+  LevelId:"",
+  FirstFolderId:"",
+  FolderName:"",
+  TemplateId:"",
+  NodeId:"",
+  SysCode:"",
+  FileCount:0,
+  ChildCount:0,
+  Deleted:0,
+  Customed:0,
+  CreateUserId:"",
+  CreateTime:"",
+  ModifyUserId:"",
+  ModifyTime:"",
+});
+
+export default {
+  components: { AddFileButton, fileMilestone, CommitJudge, ChangeBtn, FileItem, FolderItem },
+  props: {
+    searchContent: String,
+    nodeFolders: Array,
+    currentNodeFolder: Object,
+  },
+  data(){
+    return {
+      videoSrc:'',
+      isVideo:false,
+      loading: false, // 不一定用得上
+      isClient: system.isClient,
+      userId: sessionStorage.userId, // 当前用户id
+      projectId: sessionStorage.projId, // 当前项目id
+      projectName: sessionStorage.projName, // 当前项目名称
+      isShowpageIcon: true, //	协作空间折叠按钮状态
+      isCollapse: true,//协作空间底部协作文件一开始是属于折叠状态
+      closepageH: '', //	底部协作文件展开高度   默认为空，展开后高度为closepageH
+      showWorkline: false, // 工作链显示开关 原为isShowworklink
+      // nodeFolders: [], // 节点文件夹
+      // currentNodeFolder: {}, // 当前节点文件夹
+      currentFolder: {}, // 当前文件夹，可以是节点文件夹，可以是子文件夹
+
+      currentFolderInCoop: {},//协作文件下当前的文件夹
+
+      topFolderInCoop: {},//在协作文件中 点击的文件夹
+      /* 右键菜单 */
+      rightMenuvisible: false,
+      rightMenuEl: null,
+      rightMenuleft: 0,
+      rightMenuTop: 0,
+      dialogNewFolderGroup: false, // 新建文件分组组弹窗
+      folderGroupData: initialFolderData(), // 文件分组数据
+
+      localWorkspacePrefix: '', // 本地工作目录前缀
+      socketIns: null, // 监听文件变化的socket实例
+      timerIns: null, // 文件定时任务实例
+      // folderMap: {}, // 节点文件夹id哈希： { [folderId]: folder } 
+      subFolderMap: {}, // 子文件夹哈希: { [folderPath]: VirtualFolder }
+
+      breadcrumbFolderList: [], // 面包屑导航对应的文件夹队列
+      breadcrumbFolderListInCoop: [],//协作文件夹对应额面包屑导航
+
+      uploadFileList: [], // 上传文件的队列
+      workFileList: [], // 工作文件队列
+
+      currentSelectTempFile: null,//选择创建的样本文件
+      isShowNewTemplateFileDialog: false,//显示新建样本文件弹框
+
+      workSubFolderList: [], // 工作文件夹队列
+      coopSubFolderList: [],//协作文件夹队列
+      tempWorkSubFolderList: [], // 临时的工作文件夹队列
+      cooperationFileList: [], // 协作文件队列
+
+      neibianju: "neibianju", // 协作文件槽样式
+      isShowShadow: false,
+      localFileHashMap: null, // { `${节点名称}\\${文件名称}.${文件扩展名}`: `${ipfsCid}` }
+      /**
+       * 文件本地加载状态表
+       * 格式: {
+       *  [file.id]: {
+       *    type: DOWNLOADING | UPLOADING
+       *    loadProgress: number | string
+       *    loadSize: number | string
+       *    totalSize: number | string
+       *    unit: string
+       *  }
+       * }
+       */
+      localFileLoadStateMap: {},
+      /**
+       * 文件夹本地加载状态表
+       * 格式: {
+       *  [folder.folderPath]: boolean
+       * }
+       */
+      localFolderLoadStateMap: {},
+
+      tempRightFileId: "", // 存储点击了右键菜单的id
+      isShowStartNodeFolders: true,//协作文件是否显示一开始的节点文件夹
+      isfinishGetExchangeNodes: false,
+      // allNodeFolders: [],//保存除去项目节点 公共文件夹后 的所有节点
+      exchangeNodeListsInCoop: [],//存储与当前节点具有交换关系的节点列表
+      exchangeNodeInfoMap: [],//有交换关系的节点映射 [节点id]： {文件数量 文件夹数量}
+
+      reverseLocalFileHashMap: {},//键名是 ipfscid 键值是localFileHashMap的键名
+      
+      currentBtnIndex: 0,//0 是工作文件按钮 1是协作文件按钮
+      titleList: ['工作文件', '协作文件'],
+      // isShowSearchBar: false,//控制搜索框显示隐藏
+      // searchContent: '',//搜索的文件名称
+      searchWorkFileList: [],//搜索得到的工作文件列表
+      searchCoopFileList: [],//搜索得到的协作文件列表
+
+      isAllFileLoaded: false,//当前工作节点下的文件状态是否都加载完毕
+      hackWorkLine: null,
+
+      nestTemplateLists: [],
+      isShowCommitJudgeWindow: false,//是否显示提交判断窗口
+      uesrList: [],
+      listNewFolder: [],//该项目所有的节点以及指派人员信息
+      plainFolderList: [],//平级的含有指派人员信息的节点列表
+      exchangeNodeListsTo:[],//当前节点 -》 别的节点 别的节点列表 与exchangeNodeListsInCoop相反
+      coopFolderList: [],//过滤后的含有人员指派信息的节点列表
+      commitJudgeFile: {},//当前点击的要提交的文件
+      fileImgClass: 'defultImage-mid',//提交文件显示的图片
+
+      commitFileControlIpfsCid: "",//当前要提交文件的 版本管理文件的currentIpfsCid
+      uploadCommandInfo: {},//要提交的备注信息
+      commitJudgeCom: null,
+
+      checkMilestoneShow: false,//历史版本查看
+      fileMilestoneInfo:{},
+      fileHistoryList:[],
+      currentFile:{},
+    };
+  },
+  mounted: function () {
+    // 获取含有节点人员分配信息的节点列表 listNewFolder
+    // this.getAllNodePeopleInfo();
+    //监听version-item 设置里程碑文件的点击事件
+    this.$bus.$on('setMileStoneClick',this.handleMileStoneBtnClick);
+    sessionStorage.pageTitle = '工作空间';
+    this.hackWorkLine = this.$refs.hackworkline;
+    // window.addEventListener("scroll", this.onscroll, true);
+
+    this.$nextTick(()=> {
+      this.listenBottomHeight();//监听协作区域的高度 当有两行时出现底部阴影
+    })
+    // window.addEventListener("resize", this.listenBottomHeight, true);
+    if(this.isClient) {
+      this.initWorkspaceDropEvent();
+    }
+    //添加鼠标移入齿轮事件
+    // window.addEventListener("mouseenter", this.setIconMouseEnter, true);
+    // this.fetchNodeFolders();
+    // this.fetchFoldersByProjId();
+    // this.getNestNode();
+    this.fetchFolderFiles();
+
+    system.entryProject(
+      sessionStorage.projName, sessionStorage.accountName,
+      this.onSocketFileChangeDetected.bind(this),
+       (localWorkspacePrefix) => { this.localWorkspacePrefix = localWorkspacePrefix;},
+       socketIns => { this.socketIns = socketIns; },
+      errorEvent => { 
+        this.$notify({
+          message:'本地网关通讯失败',
+          title:'502错误',
+          type:'error'
+        })
+       }
+    );
+    this.timerIns = setTimeout(() => { this.intervalTask(); }, 10000);
+  },
+  destroyed: function () {
+    // window.removeEventListener("scroll", this.onscroll);
+    // window.removeEventListener("resize", this.listenBottomHeight);
+    // window.removeEventListener("mouseenter", this.setIconMouseEnter);
+    this.$bus.$off('setMileStoneClick', this.handleMileStoneBtnClick)
+    window.clearTimeout(this.timerIns);
+    this.timerIns = null;
+    system.leaveProject(this.socketIns);
+    sessionStorage.removeItem('nowFolderIndex');
+  },
+  watch: {
+    isShowCommitJudgeWindow(val) {
+      this.lookCoopTarget();
+    },
+    isShowSearchBar(val) {
+      if(!val) {
+        if(this.currentBtnIndex == 0) {
+          this.searchWorkFileList = [];
+        } else if(this.currentBtnIndex == 1) {
+          this.searchCoopFileList = [];
+        }
+      }
+    },
+    searchContent() {
+      this.searchForFile();
+    },
+    localFileHashMap(val) {
+      let temp = {};
+      for(let key in val) {
+        temp[val[key]] = key;
+      }
+      this.reverseLocalFileHashMap = temp;
+    },
+    nowFolderIndex() {
+      this.isfinishGetExchangeNodes && this.getExchangeNodes(); 
+    },
+    rightMenuvisible(value) {
+      if (value) {
+        document.body.addEventListener("click", this.closeShowMenu);
+      } else {
+        document.body.removeEventListener("click", this.closeShowMenu);
+      }
+    },
+    localFileLoadStateMap(obj) {
+      const hash = {};
+      Object.values(obj).forEach(state => {
+        const relativePath = state.fileRelativePath;
+        if(!relativePath) return;
+        analyzeRelativePath(relativePath, '', (folderPath) => {
+          hash[folderPath] = true;
+        });
+      })
+      this.localFolderLoadStateMap = hash;
+    },
+    currentNodeFolder(folder) {
+      this.currentFolder = folder;
+      // todo remove
+      this.currentFolderInCoop  = this.currentNodeFolder;
+      this.clearCurrentFolderFiles();
+      this.fetchFolderFiles();
+    },
+  },
+  computed: {
+    isShowSearchPage() {
+      const rg = /^\s*$/;
+      return !rg.test(this.searchContent);
+    },
+    // 创建样板文件的标题 创建XXX文件
+    showNewTemplateFileDialogTitle() {
+      return `创建${this.currentSelectTempFile ? this.currentSelectTempFile.extension : ''}文件`;
+    },
+    // 当前节点文件夹在节点文件夹数组中的顺序
+    // nowFolderIndex() {
+    //   return this.nodeFolders && this.nodeFolders.indexOf(this.currentNodeFolder);
+    // },
+    // 当前节点文件夹的名称
+    nowFolderName() {
+      return this.currentNodeFolder.folderName;
+    },
+    subFolderList() {
+      const uniqSubFolderList = uniqBy(this.workSubFolderList.concat(this.tempWorkSubFolderList), folder => folder.id);
+      return uniqSubFolderList
+    },
+    // 得到协作文件展示区域的实际高度
+    coopBoxRealHeight() {
+      return document.getElementById('coopFileBox') ? document.getElementById('coopFileBox').offsetHeight : 0;
+    },
+    isShowSearchBar() {
+      return !!this.searchContent;
+    },
+    folderMap() {
+      return this.nodeFolders.reduce((h, f) => (h[f.id] = f, h), {})
+    }
+  },
+
+  methods: {
+    // 查看当前节点 -》 别的节点  别的节点的人员指派信息
+    lookCoopTarget() {
+      let intersection = this.plainFolderList.filter((t)=> {
+        return this.exchangeNodeListsTo.find(f => t.id == f.id);
+      });
+      this.coopFolderList = intersection;
+    },
+    // async getUserList(){
+    //   const { list: userList } = await getUserListByNode({ id: this.$store.state.currentCompanyId, nodeType: 'company' }, 1, 10000);
+    //   this.userList = userList;
+    //   return userList;
+    // },
+    // // 获得所有工作链节点的 协同节点的人员指派信息
+    // async getAllNodePeopleInfo() {
+    //   // 获取所有的节点信息 以及 人员列表信息
+    //   const [userList, projectDataRes] = await Promise.all([
+    //     this.getUserList(),
+    //     this.$fetchApi('folder/queryAllNodeFolderListByProjectId', { projectId: sessionStorage.projId }),
+    //   ]);
+
+    //   const userHash = userList.reduce((h, user) => {
+    //     h[user.id] = user;
+    //     return h;
+    //   }, {});
+
+    //   const { folder, manager } = (projectDataRes.Data || {});
+    //   let uniqFolder = uniqBy(folder, 'Id');
+    //   const folderList = mergeFolderList(uniqFolder, userHash);
+
+    //   this.listNewFolder = folderList;
+    //   this.plainFolderList = getPlainOldFolderList(folderList);
+    // },
+
+    //接收某个文件设置是否为里程碑文件的点击事件的值
+    async handleMileStoneBtnClick(val, historyFile) {
+      const localWorkspacePrefix = this.localWorkspacePrefix;
+      const fileStoreKey = getFileStoreKey(this.currentFile, this.currentNodeFolder);
+
+      if(!this.localFileHashMap[fileStoreKey]) return;   
+
+      const filePath = `${localWorkspacePrefix}\\${fileStoreKey}`;
+
+      const fileId = this.currentFile.id;
+      //查询文件的历史版本管理文件的hash值
+      let commitHistoryHash = "";
+      const res = await services.queryProjArchiveHistory(fileId);
+      if(res.Code == 0){
+        commitHistoryHash = res.Data.CurrentIpfsCid;
+      }
+      // console.log('isMileStone', val);
+      // console.log('commitHistoryHash', commitHistoryHash);
+      // console.log('hash', currentHash);
+      //  editCommitHistoryMilestone: safeCall((filePath, commitHistoryHash, hash, milestone) 
+      let currentIpfsCid = "";
+      system.editCommitHistoryMilestone(filePath, commitHistoryHash, historyFile.currentHash, val, async (ipfsCid)=> {
+        currentIpfsCid = ipfsCid;
+        console.log('currentIpfsCid', currentIpfsCid);
+        const time = new Date().getTime();
+        const params = {
+        "ArchId": this.currentFile.id,
+        // "CreateTime": historyFile.createTime,
+        // "CreateUserId": historyFile.creator,
+        "CurrentIpfsCid": currentIpfsCid,
+        // "Id": historyFile.currentHash,
+        // "ModifyTime": time,
+        "ModifyUserId": sessionStorage.userId,
+        "PrevIpfsCid": commitHistoryHash
+      }
+      console.log('parms',params)
+      const editRes = await services.updateProjArchiveHistory(params);
+      console.log('editRes', editRes);
+
+      });
+    },
+    // 返回协作文件区域一开始入口的制定文件夹下的文件list 
+    getRealChildFileLists(folder) {
+      return  this.exchangeNodeInfoMap[folder.id] && this.exchangeNodeInfoMap[folder.id].realChildFileLists || [];
+    },
+    getRealChildFolderLists(folder) {
+      return  this.exchangeNodeInfoMap[folder.id] && this.exchangeNodeInfoMap[folder.id].realChildFolderLists || [];
+    },
+    // async getNestNode(){
+    //   const res1 = await queryNestTemplateByProjectId(this.projectId);
+    //   // const res2 = await queryNestTemplateByTemplateId(id);
+    //   // const temp = res1.Data || [];
+    //   // const resList = [...res1.Data]
+    //   // console.log(res1);
+    //   // circulateGetNestNode(temp, resList);
+    //   this.nestTemplateLists= (res1.Data || []).map(({ NestTemplateId }) => ({ TemplateId: NestTemplateId }));
+    //   // console.log(res1, res2);
+    //   // function circulateGetNestNode(targetList, resList) {
+    //   //   targetList.forEach(async item => {
+    //   //     const res2 = await queryNestTemplateByTemplateId(item.TemplateId);
+    //   //     const resData = res2.Data || [];
+    //   //     if(resData.length > 0) {
+    //   //       resList.push(...resData);
+    //   //     }
+    //   //   })
+    //   // }
+    // },
+    /**
+    * 搜索文件
+    */
+    //切换点击工作文件 协作文件
+    changeContentBtnClick(index) {
+      this.currentBtnIndex = index;
+    },
+    // changeSearchContent(content) {
+    //   this.searchContent = content;
+    // },
+    // hideSearchBar() {
+    //   this.currentBtnIndex = 0;
+    // },
+    // showSearchBar() {
+    // },
+    searchForFile: debounce(async function() {
+      const rg = /^\s*$/;
+      if(rg.test(this.searchContent)) {
+        return;
+      } else {
+        const folderId = this.currentNodeFolder.id;
+        const res = await services.searchFileListByFolderIdAndFileName(folderId, this.searchContent);
+        if(res.Code === 0) {
+          const tempWorkFileList = res.Data.workFile || [];
+          const tempCoopFileList = res.Data.coordinationFiles || [];
+          
+          this.searchWorkFileList = tempWorkFileList.length > 0 ? tempWorkFileList.map(f => firstCharToLowerCase(f)) : [];
+          this.searchCoopFileList = tempCoopFileList.length > 0 ? tempCoopFileList.map(cf => firstCharToLowerCase(cf)) : [];
+
+          this.currentBtnIndex = 0;
+        } else {
+            this.$notify({
+              type: ['error'],
+              message:'查询数据失败, 请稍后重试。'
+            })
+          }
+      }
+    }, 500),
+    notPicIcon() {
+     return !this.oneOf(this.currentSelectTempFile.extension, imgExtensionList) && !this.oneOf(this.currentSelectTempFile.extension, VideoExtensionList)
+    },
+    picIcon() {
+      return this.oneOf(this.currentSelectTempFile.extension, imgExtensionList);
+    },
+    // 创建样本文件
+    async createTemplateFile() {
+      let tempName = this.currentSelectTempFile.fileName;
+      let temExtension = this.currentSelectTempFile.extension;
+      //判断输入的名字是否重复 
+      let isExists = this.workFileList.findIndex(file => file.archName === tempName && file.extension == temExtension);
+      if(isExists > -1) {
+        this.$notify({
+          type: "warning",
+          message: `文件名重复 请重新输入。`,
+          offset: 100,
+          duration: 2500,
+        });
+        return;
+      }
+      const time = new Date();
+      const fileRelativePath = this.currentFolder.folderPath ? this.currentFolder.folderPath : '';
+      let file = {
+      "id": this.currentSelectTempFile.id,
+      "projId":this.projectId,
+      "folderId": this.currentNodeFolder.id,
+      "archName":tempName,
+      "extension":temExtension,
+      "ipfsCid":this.currentSelectTempFile.hash,
+      "fileSize":this.currentSelectTempFile.fileSize,
+      "folderLevelId":this.currentNodeFolder.levelId,
+      "status":0,
+      "workStatus":0,
+      "commonStatus":0,
+      "deleted":this.currentSelectTempFile.deleted,
+      "milestone":0,
+      "version":0,
+      "showUrl":"",
+      "createUserId":this.userId,
+      "createTime":time,
+      "modifyUserId":this.userId,
+      "modifyTime":time,
+      "isShowRecycle":0,
+      "relativePath":fileRelativePath}
+
+      const addFileRes = await services.addFile(file);
+
+      if(addFileRes.Code == 0) {
+        this.fetchFolderFiles();
+        this.isShowNewTemplateFileDialog = false;
+        this.$notify({
+          message: `文件 “${tempName}” 创建成功。`,
+          type: "success",
+          offset: 100,
+          duration: 2500,
+        });
+        return;
+      } else {
+        // this.fetchFolderFiles();
+        this.isShowNewTemplateFileDialog = false;
+        this.$notify({
+          message: `文件 “${tempName}” 创建失败 请稍后重试。`,
+          type: "error",
+          offset: 100,
+          duration: 2500,
+        });
+        return;
+      }
+  
+    },
+    // 点击了样本文件
+    fileTempClick(item) {
+      this.isShowNewTemplateFileDialog = true;
+      this.currentSelectTempFile = {...item};
+    },
+    //预览文件
+    async filePreview(file,type){
+      const url = await services.filePreview(sessionStorage.companyId);
+      const params={
+        API:'company/queryFileOnlineUrlByCompanyId',
+        Action:'打开文件',
+        CompanyName:sessionStorage.CompanyName,
+        Subject:file.archName+"."+file.extension,
+        Source:sessionStorage.client,  
+        ProjectName:sessionStorage.projName,
+      }
+      this.$fetchApi('operation/record',params);
+      const Url="http://"+url.Data;
+      if(type == 2){
+        //const link=encodeURIComponent(Url)
+        const officeApi="http://www.lockingos.org:8012/onlinePreview?url=";
+        const fullfilename="?fullfilename="+file.archName+"."+file.extension;
+        console.log(officeApi+Url + file.ipfsCid + fullfilename )
+        const link = officeApi + encodeURIComponent(Url + file.ipfsCid + fullfilename) + '&officePreviewType=pdf';
+        window.open(link,'');
+      }else if(type == 1){
+        this.isVideo=true;
+        this.videoSrc=Url+file.ipfsCid;        
+      }else{
+        return;
+      }
+    },
+    //
+    videoClose(){
+      this.videoSrc="";
+    },
+    // 删除文件夹 递归删除文件夹下面的所有文件
+    deleteFolderClick(id) {
+      const { isClient, subFolderList, workFileList, subFolderMap, userId, localFileHashMap, reverseLocalFileHashMap } = this;
+      const deleteFolderName = subFolderMap[id].folderName;
+      const thisApp = this;
+      const totalDeleteFileLists = [];
+      this.$confirm(`确认删除文件夹“${deleteFolderName}”吗？`, "", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          showClose: false,
+          type: "warning",
+        }).then(async function () {
+          circulateDelete(id);
+          const totalNum = totalDeleteFileLists.length;
+          console.log('要删除的文件总数是', totalNum);
+          let isFileInWorking = totalDeleteFileLists.find(f => f.workStatus == 2 && f.modifyUserId !== userId);
+          if(isFileInWorking) {
+            // 提示 该文件夹下有他人正在工作中的文件 -> 删除失败
+            thisApp.$notify({
+                message: `“${deleteFolderName}”文件夹下存在“工作中”文件,删除失败。`,
+                type: "error",
+                offset: 100,
+                duration: 2500,
+              });
+          } else {
+            // 删除文件夹
+            let counter = 0;
+            totalDeleteFileLists.forEach(async delFile => {
+             isClient && delete localFileHashMap[reverseLocalFileHashMap[delFile.ipfsCid]];
+              const res = await services.deleteFile(delFile.id);
+              counter = res.Code == 0 ? counter+1 : counter;
+              if(counter == totalNum) {
+                thisApp.$notify({
+                  message: `“${deleteFolderName}”文件夹已删除。`,
+                  type: ["success"],
+                  duration: 2500,
+                });
+              }
+            thisApp.fetchFolderFiles();
+          })
+        }
+      })
+          
+      function circulateDelete(deleteFolderId) {
+        const delFolderLists = subFolderList.filter(folder => folder.parentFolderPath == deleteFolderId);
+        if(delFolderLists.length == 0) {
+          //表明到了最底层的文件夹 删除deleteFolderId对应这个文件夹下面的所有文件
+          let delFileLists =  workFileList.filter(file => file.relativePath == deleteFolderId);
+         
+          // 删除与这个要删除文件夹同级的文件
+          const parentFolderPath = subFolderMap[deleteFolderId].parentFolderPath
+          if(parentFolderPath !== "") {
+            const tempLists = workFileList.filter(wf => wf.relativePath == parentFolderPath);
+            delFileLists.push(...tempLists);
+          }
+          totalDeleteFileLists.push(...delFileLists);
+        }
+        delFolderLists.forEach(df => {
+          circulateDelete(df.id);
+        })
+      }
+    
+    },
+
+    // // 当workLine组件获得节点的交换节点的时候 调用函数
+    // finishGetExchangeNodes() {
+    //   this.isfinishGetExchangeNodes = true;
+    //   this.getExchangeNodes(); 
+    // },
+    // // 协作文件一开始显示的文件夹要显示具有节点交换关系的文件夹 但是这个时候listShareFrom[1]还没有塞入值
+    // async getExchangeNodes() {
+    //   const froms = this.currentNodeFolder.listsShareFrom[1];//别人给我的
+    //   const to = this.currentNodeFolder.listsShareFrom[0];
+
+    //   const tempFromMap = froms.map(f => f.id);
+    //   const tempToMap = to.map(t => t.id);
+
+    //   // 获得别的节点 -》 当前节点(结果)
+    //   this.exchangeNodeListsInCoop = this.allNodeFolders.filter(folder => tempFromMap.includes(folder.id));
+    //   // 获得当前节点 -》 别的节点（结果）
+    //   this.exchangeNodeListsTo = this.allNodeFolders.filter(folder => tempToMap.includes(folder.id));
+    //   //注意： 这里的nodeFolders只会包含当前账户能看到的节点 不是全部的节点
+    //   this.getExchangeNodesChild();
+    // },
+    // //计算一开始协作文件区域入口文件夹的下项目的个数
+    // getExchangeNodesChild() {
+    //   // 编辑判断一下这些节点下的文件数量以及文件夹数量
+    //   // 过滤与当前节点有文件交换关系的文件在不同顶级文件夹下的显示
+    //   let exchangeInfoMap = {};
+    //   this.exchangeNodeListsInCoop.forEach(async tfolder => {
+    //     let res = {};
+    //     res.realChildFileLists = [];
+    //     res.realChildFolderLists = [];
+        
+    //     // 得到子文件夹的数量
+    //     res.realChildFolderLists = this.filterFoldersInTarget(this.coopSubFolderList, tfolder, tfolder, true); 
+
+    //     // 得到子文件的数量 这里三个参数 fileList, targetFolder, isCoop = false
+    //     res.realChildFileLists = this.filterFilesInTarget(this.cooperationFileList, tfolder, tfolder, true);
+
+    //     exchangeInfoMap[tfolder.id] = res;
+
+    //     this.exchangeNodeInfoMap = exchangeInfoMap;
+    //   })
+     
+    // },
+    // async fetchFoldersByProjId() {
+    //   const data = await this.$fetchApi('folder/queryAllNodeFolderListByProjectId', { projectId: sessionStorage.projId });
+    //   let [topFoler, commonFolder, ...resFolders] = data.Data.folder;
+    //   this.allNodeFolders = resFolders.map(f => firstCharToLowerCase(f)) || [];
+      
+    // },
+
+
+    // 对协作文件的relativePath处理 生成文件夹
+    dealWithCoopFiles(fileList) {
+      const folderList = [];
+      const folderMap = {};
+
+      fileList.forEach(file => {
+        const relativePath = file.relativePath;
+          if(relativePath) {
+            const paths = relativePath.split('/');
+            paths.forEach((folderName, idx) => {
+              const fullRelativePath = paths.slice(0, idx + 1).join('/');
+              if(folderMap[fullRelativePath]) return;
+              const folder = new VirtualFolder(fullRelativePath);
+              folder.topFolderId = file.folderId;
+              const parentRelativePath = folder.parentFolderPath;
+              folderList.push(folder);
+              folderMap[fullRelativePath] = folder;
+              if(folderMap[parentRelativePath]) {
+                folderMap[parentRelativePath].childCount++;
+              }
+            });
+            folderMap[relativePath].fileCount++;
+          } 
+      });
+      return folderList;
+    },
+    // 接收到了一个文件的右键菜单点击事件
+    oneFileRightBtnClick(id) {
+      this.tempRightFileId = id;
+      this.rightMenuvisible = false;
+    },
+    // 工作文件文件展示过滤 targetFolder: currentFolder
+    filterFilesInWork(fileList) {
+      // 子文件会有这个属性，节点文件夹不会有
+      const { folderPath = '' }  =  this.currentFolder;
+      return fileList.filter(file => {
+        if(file.relativePath !== folderPath) return false;
+        return true;
+      });
+    },
+    // 协作文件下的文件展示过滤 targetFolder:currentFolderInCoop topFolder: topFolderInCoop
+    filterFilesInCoop(fileList){
+      const { folderPath = '' }  =  this.currentFolderInCoop;
+      return fileList.filter(file=> {
+        if(file.relativePath == folderPath && file.folderId == this.topFolderInCoop.id) {
+          return true;
+        }
+        return false;
+      });
+    },
+    // targetFolder可以是 currentFolder 可以是currentFolderInCoop
+    filterFilesInTarget(fileList, targetFolder, topFolderInCoop = this.topFolderInCoop, isCoop = false){
+      const { folderPath = '' }  =  targetFolder;
+      return fileList.filter(file=> {
+        if(file.relativePath == folderPath) {
+          if(!isCoop) {
+            return true;
+          } else if(file.folderId == topFolderInCoop.id) {
+            return true;
+          }
+        }
+        return false;
+      });
+    },
+    // 文件夹展示过滤 targetFolder: currentFolder 或者是 currentFolderInCoop
+    filterFoldersInWork(folderList) {
+      // 子文件会有这个属性，节点文件夹不会有
+      const { folderPath = '' }  =  this.currentFolder;
+      return folderList.filter(folder => {
+        if(folder.parentFolderPath !== folderPath) return false;
+        return true;
+      });
+    },
+    filterFoldersInCoop(folderList) {
+      const { folderPath = '' }  =  this.currentFolderInCoop;
+      return folderList.filter(folder => {
+        if(folder.parentFolderPath == folderPath && folder.topFolderId == this.topFolderInCoop.id) return true;
+        return false;
+      });
+    },
+    // 查找指定文件夹下的子文件夹 targetFolder 可以是currentFolder 可以是currentFolderInCoop isCopp是否是协作类型的
+    filterFoldersInTarget(folderList, targetFolder, topFolderinCoop = this.topFolderInCoop , isCoop = false) {
+      const { folderPath = '' }  =  targetFolder;
+      return folderList.filter(folder => {
+        if(folder.parentFolderPath == folderPath) {
+          if(!isCoop) {
+            return true;
+          } else if(folder.topFolderId == topFolderinCoop.id){
+            return true;
+          }
+        }
+        return false;
+      });
+    },
+
+    oneOf(target, list) {
+      return list.indexOf(target) !== -1;
+    },
+    /* 全局监听事件 */
+    initWorkspaceDropEvent() {
+      const dropbox = document.getElementById('workspace');
+      dropbox.addEventListener("dragenter", this.stopPropagation);
+      dropbox.addEventListener("dragover", this.stopPropagation);
+      dropbox.addEventListener("dragleave", this.stopPropagation);
+      dropbox.addEventListener('drop', this.fileDropEvent, false);
+    },
+    // 从客户端外拖入文件并上传
+    fileDropEvent(e) {
+      const files = propertyOf(e)('dataTransfer.files');
+      if(!files || files.length === 0 || e.dataTransfer.effectAllowed == 'copyLink') return;
+      const itemPaths = Array.from(files).map(file => file.path);
+      this.clientUpload(itemPaths);
+      // itemPaths.forEach(async fullPath => {
+      //   const maybeTasks = await system.analyzeSystemPath(fullPath);
+      //   const tasks = maybeTasks || [];
+      //   tasks.forEach(uploadTask => this.clientUpload(uploadTask));
+      // });
+    },
+    stopPropagation(e) {
+      e.stopPropagation();
+      e.preventDefault();
+    },
+    // 从文件列表中拖到本地
+    onfileDragStart(file, e) {
+      e.dataTransfer.effectAllowed = 'move';
+      this.stopPropagation(e);
+      if(!this.isClient) return;
+      const { nodeName, id: fileId } = file;
+      const isCooperationFile = !!nodeName;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      // 本地没文件，不能拖拽
+      if(!this.localFileHashMap[fileStoreKey]) return;
+      
+      if(!isCooperationFile) { 
+        if(file.workStatus === WORKING && sessionStorage.userId !== file.modifyUserId) { // 同节点其他人正在操作的文件不能拖拽
+          return; 
+        }
+        services.changeFileWorkStatus(fileId, WORKING)
+          .then(flagRes => {
+            if(flagRes.Code !== 0) return;
+            file.workStatus = WORKING;
+            file.modifyUserId = sessionStorage.userId;
+            this.fetchFolderFiles();
+          });
+      }
+      // 协作文件可以打开
+
+      const { ipcRenderer } = global.electron;
+      ipcRenderer.invoke('project-file-dnd', `${this.localWorkspacePrefix}\\${fileStoreKey}`);
+    },
+    async intervalTask() {
+      await this.fetchFolderFiles();
+      this.timerIns ? setTimeout(()=> { this.intervalTask(); }, 3000) : "";
+      // this.timerIns = setTimeout(() => { this.intervalTask(); }, 3000);
+    },
+    /**
+     * @description: 滚动条
+     * @return:
+     */
+    onscroll: function () {
+      // if (this.$route.name == "workspace") {
+      //   var topScroll = document.body.scrollTop; //滚动的距离,距离顶部的距离
+      //   var bignav = document.getElementById("bignav"); //获取到导航栏id
+      //   if (topScroll > 350) {
+      //     //当滚动距离大于250px时执行下面的东西
+      //     bignav.style.position = "fixed";
+      //     bignav.style.top = "120px";
+      //     bignav.style.zIndex = "9999";
+      //   } else {
+      //     //当滚动距离小于250的时候执行下面的内容，也就是让导航栏恢复原状
+      //     bignav.style.position = "static";
+      //   }
+      // }
+    },
+    listenBottomHeight() {
+      let oDivH = document.getElementById('coopFileBox') ? document.getElementById("coopFileBox").offsetHeight: 0;
+ 
+      if (oDivH > 259) {
+        this.isShowShadow = true;
+      } else {
+        this.isShowShadow = false;
+      }
+    },
+    onSocketFileChangeDetected({ data }){
+      try {
+        /**
+         * 格式：
+         * {
+         *  `${节点名称}\\${文件名称}.${文件扩展名}`: `${ipfsCid}`
+         * }
+         */
+        const hash = JSON.parse(data);
+        Object.entries(hash).forEach(([key, value]) => {
+          if(value.split(';').length === 1) {
+            hash[key] = `${value};0`;
+          }
+        })
+        this.localFileHashMap = hash;
+      }catch(e) {
+        console.log('socket file change message error:', e);
+      }
+      // console.log('socket file change message detected:', args);
+    },
+    // websocket返回的ipfscid格式： hash;0 或者 hash;1
+    // 0 表示本地未修改  1 表示本地修改
+    addLocalFileRecord(fileStoreKey, ipfsCid) {
+      // this.localFileHashMap[fileStoreKey] = ipfsCid;
+      this.localFileHashMap = { ...this.localFileHashMap, [fileStoreKey]: `${ipfsCid};0`};
+    },
+    updateFileLoadState(file, type, loadProgress = 0, loadSize, loadUnit, totalSize, unit){
+      if(!file.id) {
+        debugger;
+      }
+      const updateState = {
+        type, loadProgress, loadSize, totalSize, unit, loadUnit, fileRelativePath: file.relativePath || '',
+      }
+      this.localFileLoadStateMap = { ...this.localFileLoadStateMap, [file.id]: updateState };
+    },
+    removeFileLoadingState(fileId) {
+      console.log(`going to remove file: ${fileId}`);
+      delete this.localFileLoadStateMap[fileId];
+      this.localFileLoadStateMap = { ...this.localFileLoadStateMap };
+    },
+
+    /* 工作链API */
+    /**
+     * 工作链页面点击
+     */
+    // goFolderAndBack(index) {
+    //   this.goFolder(index);
+    //   this.hideWorklinkPage();
+    // },
+    /**
+     * todo Deprecated
+     * @description: 查看工作链页面
+     * @return:
+     */
+    // showWorklinkPage: function () {
+    //   // this.$emit("isShowOutWorkSpace", true);
+    //   if(this.hackWorkLine) {
+    //     // this.hackWorkLine.showWorklinkPage();
+    //     this.hackWorkLine.isShowworklink = true;
+    //     this.hackWorkLine.workheight = "workheight";
+    //   }
+    //   this.showWorkline = true;
+    //   // this.workheight = "workheight";
+    // },
+    /**
+     * @description: 隐藏工作链页面
+     * @return:
+     */
+    // hideWorklinkPage: function () {
+    //   if(this.hackWorkLine) {
+    //     this.hackWorkLineisShowworklink = false;
+    //     this.hackWorkLine.workheight = "workheightinit";
+    //   }
+    //   this.showWorkline = false;
+    //   // this.workheight = " workheightinit";
+    // },
+    /**
+     * 查看上一个文件夹文件
+     */
+    // previousFolder () {
+    //   this.goFolder(this.nowFolderIndex - 1);
+    //   this.isShowStartNodeFolders = true;
+    // },
+    /**
+     * 查看下一个文件夹文件
+     */
+    // nextFolder(){
+    //   this.goFolder(this.nowFolderIndex + 1);
+    // },
+    /**
+     * 跳转到当前工作
+     */
+    // goFolder: function (nextFolderIndex) {
+    //   if(nextFolderIndex < 0) {
+    //     notify.error('不能再向前了');
+    //     return;
+    //   }
+    //   if(nextFolderIndex > this.nodeFolders.length - 1) {
+    //     notify.error('不能再向后了');
+    //     return;
+    //   }
+    //   sessionStorage.nowFolderIndex = nextFolderIndex; // 用于刷新页面时使用
+    //   this.currentNodeFolder = this.nodeFolders[nextFolderIndex];
+    //   if(this.currentNodeFolder !== this.currentFolder) {
+    //     this.clearCurrentFolderFiles();
+    //   }
+    //   this.currentFolder = this.currentNodeFolder;
+    //   this.currentFolderInCoop = this.currentNodeFolder;
+
+    //   this.breadcrumbFolderList = [];
+    //   this.breadcrumbFolderListInCoop = [];
+    //   this.fetchFolderFiles();
+
+    //   this.$nextTick(()=> {
+    //     this.listenBottomHeight();
+    //   })
+    // },
+    /**
+     * 当前工作点击
+     */
+    // nowFolderClick(nextFolderIndex) {
+    //   this.goFolder(nextFolderIndex);
+    //   this.isShowStartNodeFolders = true;//上面切换点击到另一个工作节点的时候 协作文件先显示总的节点入口
+    // },
+
+    /**
+     * 进入子文件夹
+     */
+    intoSubFolder(folder, flag) {
+      if(flag == 0) {
+        this.currentFolder = folder;
+        this.breadcrumbFolderList.push(folder);
+      } else if(flag == 1) {
+        this.currentFolderInCoop = folder;
+        this.breadcrumbFolderListInCoop.push(folder);
+        this.$nextTick(()=> {
+            this.listenBottomHeight();
+        })
+      }
+
+      // this.clearCurrentFolderFiles();
+      // this.fetchFolderFiles();
+    },
+
+    /* 文件夹及文件API */
+    // async fetchNodeFolders() {
+    //   const folderList = this.nodeFolders;
+    //   // this.nodeFolders = folderList;
+    //   // this.copyNodeFolders = cloneDeep(folderList);
+    //   // this.folderMap = folderList.reduce((h, f) => (h[f.id] = f, h), {});
+    //   if(!folderList.length) return;
+    //   this.currentFolder = this.currentNodeFolder;
+    //   this.currentFolderInCoop  = this.currentNodeFolder;
+    //   this.fetchFolderFiles();
+    // },
+    /**
+     * 查询当前文件夹内容
+     */
+    fetchFolderFiles: throttle(async function fetchFolderFiles() {
+      const nodeFolder = this.currentNodeFolder;
+      const userId = this.userId;
+      if(!nodeFolder || !nodeFolder.id) return;
+      // 先清空当前的文件队列 在这清空队列会有闪烁问题，得放在切换显示文件夹内容的地方触发
+      // this.uploadFileList = [];
+      // this.workFileList = [];
+      // this.workSubFolderList = [];
+      // this.cooperationFileList = [];
+      // todo 接口去除公共文件夹配置
+      const folderResInfo = await services.fetchFolderFileList(nodeFolder.id, userId, nodeFolder.id);
+      if(!folderResInfo) return;
+      // 快速切换节点的时候
+      if(this.currentNodeFolder.id !== nodeFolder.id) return;
+      this.workFileList = folderResInfo.file;
+      this.subFolderMap = { ...this.subFolderMap, ...folderResInfo.folderMap };
+      this.resolveUploadFileList(this.workFileList);
+      this.workSubFolderList = folderResInfo.folder;
+      // this.workSubFolderList = uniqBy(this.workSubFolderList.concat(folderResInfo.folder), folder => folder.id);
+      // resolve dupilicate folders
+      this.tempWorkSubFolderList = this.tempWorkSubFolderList.filter(tempFolder => !folderResInfo.folder.some(folder => folder.id === tempFolder.id));
+      this.cooperationFileList = folderResInfo.coordinationFiles;
+
+      this.coopSubFolderList = this.dealWithCoopFiles(this.cooperationFileList);
+      // this.isShowStartNodeFolders && this.getExchangeNodesChild();
+      this.resolveUploadFileList(this.cooperationFileList);
+    }, 1000),
+    /**
+     * 去掉上传队列中已经上传成功的文件
+     */
+    resolveUploadFileList(fileList) {
+      this.uploadFileList = this.uploadFileList.filter(uploadFile => {
+        const targetFile = fileList.find(iFile => iFile.relativePath === uploadFile.relativePath && iFile.archName === uploadFile.archName && iFile.extension === uploadFile.extension);
+        this.removeFileLoadingState(uploadFile.id);
+        return !targetFile;
+      });
+    },
+    /**
+     * 点击确定 保存文件夹组
+     */
+    async createSubFolder(){
+      if (!this.folderGroupData.FolderName) {
+        notify.warning('请输入文件夹名称！');
+        return;
+      }
+      const folderName = this.folderGroupData.FolderName;
+      const parentFolderPath = this.currentFolder.folderPath || '';
+      const folderPath = parentFolderPath ? `${parentFolderPath}/${folderName}` : folderName;
+      if(this.subFolderMap[folderPath]) {
+        notify.warning('创建失败，已存在同名文件夹！');
+        return;
+      }
+      const newVirtualFolder = new VirtualFolder(folderPath, folderName, parentFolderPath);
+      this.subFolderMap[folderPath] = newVirtualFolder;
+      this.tempWorkSubFolderList.push(newVirtualFolder);
+      notify.success('文件夹创建成功！');
+      this.dialogNewFolderGroup = false;
+    },
+    /**
+     * 新建文件夹显示弹窗
+     */
+    newCreateFolderGroup: function () {
+      this.dialogNewFolderGroup = true;
+      this.folderGroupData = initialFolderData();
+    },
+    clearCurrentFolderFiles() {
+      this.uploadFileList = [];
+      this.workFileList = [];
+      this.workSubFolderList = [];
+      this.tempWorkSubFolderList = [];
+      this.cooperationFileList = [];
+      // this.localFileHashMap = {};
+      this.localFileLoadStateMap = {};
+      this.localFolderLoadStateMap = {};
+      this.tempRightFileId = '';
+    },
+    /**
+     * 面包屑导航点击
+     */
+    clickBreadcrumb(breadFolderIdx, flag) {
+      if(flag == 0) {
+        // 工作文件
+        const targetFolder = breadFolderIdx === -1
+        ? this.currentNodeFolder
+        : this.breadcrumbFolderList[breadFolderIdx];
+        this.currentFolder = targetFolder;
+        // this.fetchFolderFiles();
+        // 重置面包屑导航数组
+        this.breadcrumbFolderList = this.breadcrumbFolderList.slice(0, breadFolderIdx + 1);
+      } else if(flag == 1) {
+        // 协作文件
+        const targetFolderInCoop = breadFolderIdx === -1
+        ? this.currentNodeFolder
+        : this.breadcrumbFolderListInCoop[breadFolderIdx];
+        this.currentFolderInCoop = targetFolderInCoop;
+        this.isShowStartNodeFolders = breadFolderIdx === -1;
+        // this.fetchFolderFiles();
+        // 重置面包屑导航数组
+        this.breadcrumbFolderListInCoop = this.breadcrumbFolderListInCoop.slice(0, breadFolderIdx + 1);
+        
+        this.$nextTick(()=> {
+          this.listenBottomHeight();
+        })
+      }
+      
+    },
+    /**
+     * 客户端选择文件列表并上传
+     */
+    async selectSystemFiles() {
+      if(!this.isClient) return;
+      const filePaths = await system.chooseFiles();
+      if(!filePaths) return;
+      this.clientUpload(filePaths);
+      // filePaths.forEach(async fullPath => {
+      //   const maybeTasks = await system.analyzeSystemPath(fullPath);
+      //   const tasks = maybeTasks || [];
+      //   tasks.forEach(uploadTask => this.clientUpload(uploadTask));
+      // });
+    },
+    /**
+     * 客户端选择文件夹列表并上传
+     */
+    async selectSystemFolders() {
+      if(!this.isClient) return;
+      const folderPaths = await system.chooseFolders();
+      if(!folderPaths) return;
+      this.clientUpload(folderPaths);
+      // folderPaths.forEach(async fullPath => {
+      //   const maybeTasks = await system.analyzeSystemPath(fullPath);
+      //   const tasks = maybeTasks || [];
+      //   tasks.forEach(uploadTask => this.clientUpload(uploadTask));
+      // });
+    },
+    generateVirtualFolder(relativePath, prefixPath = '') {
+      if(!relativePath) return;
+      const hash = {};
+      const list = [];
+      const subFolderMap = this.subFolderMap;
+      analyzeRelativePath(relativePath, prefixPath, (folderPath) => {
+        if(subFolderMap[folderPath]) return;
+        const newSubFolder = new VirtualFolder(folderPath);
+        hash[newSubFolder.folderPath] = newSubFolder;
+        list.push(newSubFolder);
+      });
+      this.subFolderMap = { ...subFolderMap, ...hash };
+      this.tempWorkSubFolderList = this.tempWorkSubFolderList.concat(list);
+    },
+    /**
+     * 客户端上传文件
+     * uploadTask: {
+     *  fullPath: 本地完整路径
+     *  fileName: 文件名
+     *  extension: 扩展名
+     *  relativePath: 相对路径
+     * }
+     */
+    async clientUpload(filePaths) { // uploadTask
+      const tasksGroup = await Promise.all(filePaths.map(path => system.analyzeSystemPath(path)));
+      const uploadTasks = flatten(tasksGroup);
+      const { folderName, levelId, id: folderId } = this.currentNodeFolder; 
+      const { folderPath = '' } = this.currentFolder;
+      const workFileList = this.workFileList;
+      // 检查是否存在文件重名，有则提示
+      const ifHaveRepeatFile = uploadTasks.some(uploadTask => {
+        const { fileName, extension: fileExtension, relativePath } = uploadTask;
+        const extensionedFileName = fileExtension ? `${fileName}.${fileExtension}`: fileName;
+        const distFileRelativePath = `${folderPath ? `${folderPath}\\`:''}${relativePath ? `${relativePath}`:''}`.replace(/(\\)+/g, '/');
+        return workFileList.some(iFile => distFileRelativePath === iFile.relativePath && `${iFile.archName}${iFile.extension ? `.${iFile.extension}` : ''}` === extensionedFileName)
+      });
+      if(ifHaveRepeatFile) {
+        let confirmRes = false;
+        try {
+          await Vue.prototype.$confirm('监测到文件夹存在同名文件，是否继续上传并覆盖同名文件？',"",{
+            showClose: false,
+            type: "warning"
+          });
+          confirmRes = true;
+        } catch(e) { console.log('user canceled'); }
+        if(!confirmRes) return;
+      }
+
+      let tempNumWrap = {//为了了让这个数量被保存使用修改  这里用作为对象属性传递
+        tempNumCount: 0
+      }
+      const totalReadyUploadNum = uploadTasks ? uploadTasks.length : 0;//全部要上传的文件数量
+      uploadTasks.forEach(uploadTask => {
+        const { fullPath: sourceFilePath, fileName, extension: fileExtension, relativePath } = uploadTask;
+        // 生成
+        this.generateVirtualFolder(relativePath, folderPath);
+
+        const creator = sessionStorage.getItem('accountName');
+
+        const params = {
+          creator,
+          projectId: this.projectId,
+          projectName: this.projectName,
+          folderId, folderName, folderLevelId: levelId, distFileRelativePath: [folderPath, relativePath].filter(a => a).join('\\').replace(/(\\)+/g, '/'),
+          fileName, fileExtension, sourceFilePath,
+          fileList: workFileList,
+          onSuccess: (file) => { // onSuccess
+            const {ArchName, IpfsCid, Extension, RelativePath} = file;
+            // 注入到文件下载检测表中
+            const key = `${folderName}\\${RelativePath ? `${RelativePath.replace(/\//g, '\\')}\\`: ''}${ArchName}${Extension ? `.${Extension}`: ''}`;
+            this.addLocalFileRecord(key, IpfsCid);
+            this.removeFileLoadingState(file.Id);
+            this.fetchFolderFiles();
+          },
+          onProgress: (progressData, upperUploadFile) => { // onLoading
+            const { process, hash, size, currentSize, currentUnit, unit } = progressData;
+            const uploadFile = firstCharToLowerCase(upperUploadFile);
+            // 避免使用最后一次progreessData中size被修正为Kb的数据
+            if(!hash) {
+              this.updateFileLoadState(uploadFile, UPLOADING, process, currentSize, currentUnit, size, unit);
+            }
+            // 覆盖已有的同名文件
+            if(uploadFile.id.indexOf('upload:') === -1) {
+              return;
+            }
+            // 插入上传队列
+            if(!this.uploadFileList.find(f => f.id === uploadFile.id)) {
+              this.uploadFileList.push(uploadFile);
+            }
+          },
+          onError: (e, upperFile) => {
+            this.removeFileLoadingState(upperFile.Id);
+            this.uploadFileList = this.uploadFileList.filter(iFile => iFile.id !== upperFile.Id);
+          },
+          successAllHandler: async ()=> {
+          //  await this.fetchFoldersByProjId();
+          }
+        }
+        // console.log(folderName, levelId, folderId);
+    
+    
+        system.uploadFile({...params, totalReadyUploadNum, tempNumWrap});
+      })
+    },
+    /**
+     * 客户端下载方法
+     */
+    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);
+    },
+    /**
+     * 下载文件夹
+     */
+    downloadFolder(folder) {
+      this.workFileList.forEach(file => {
+        if(file.relativePath.indexOf(folder.folderPath) === 0) {
+          this.clientDownLoad(file);
+        }
+      })
+    },
+    /**
+     * 打开本地文件夹
+     */
+    openNativeCurrentFolder(){
+      const { folderName } = this.currentNodeFolder;
+      const path = `${this.localWorkspacePrefix}\\${folderName}`;
+      system.openFolder(path);
+    },
+    /**
+     * closeCommitJudge: 关闭了提交的窗口 重置参数
+     */
+    closeCommitJudge() {
+      //弹出操作弹框
+      this.$confirm(`确定取消此次文件 “${ this.commitJudgeFile.archName }” 的提交吗？`, "", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+          this.commitFileControlIpfsCid = '';
+          this.isShowCommitJudgeWindow = false;
+          this.comitJudgeCom = null;
+        })
+        .catch((err)=> {
+          console.log(err);
+        });
+    },
+    /**
+     * 点击了完成提交按钮
+     */
+    finishCommitFile() {
+      //将文件的备注信息进行提交
+      this.commitJudgeCom = this.$refs['commit-judge'];
+      if(this.commitJudgeCom && this.commitJudgeCom.remarkContent.length == 0) {
+        this.$notify({
+          type: 'warning',
+          message: '提交备注不能为空'
+        })
+        return;
+      }
+      //要判断一下是否有冲突 即远端是否修改过
+      const file = this.commitJudgeFile;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      const fileLocalIpfsCid = this.localFileHashMap[fileStoreKey];
+
+      const { ipfsCid } = file;
+      const [myLocalIpfsCid, status] = fileLocalIpfsCid.split(";");
+      // 本地修改hash最后一位是1  且 本地hash ！== 远程hash
+      // 何时hash最后一位变成1？ -》 当本地文件写入并保存的时候
+
+      const isConflict = (fileLocalIpfsCid && status == "1" && myLocalIpfsCid !== ipfsCid);
+      console.log(isConflict);
+      if(isConflict) {
+        // const text = `${file.modifyName}编辑过您的文件，是继续我上次编辑还是打开${file.modifyName}的编辑？`;
+        const text = `${file.modifyName}更新了文件，请选择协同版本。`;
+        this.$confirm(text, "", {
+          confirmButtonText: "继续提交我的版本",
+          cancelButtonText: '保留对方版本',
+          showClose: true,
+          type: "warning",
+          customClass: 'conflit-message-box',
+        }).then(() => {
+          //点击继续我的编辑 -> 继续完成本次版本的提交 相当于忽略别人编辑过的版本
+            this.commitFile(false);
+        })
+        .catch((err)=> {
+          //点击了打开XXX的编辑 -> 完成本次版本提交
+          //但是本次版本提交updateFile(服务端)传递的 historyCurrentIpfsCid 不是websocket接口返回的 而是文件的ipfscid(别人编辑的版本)
+          this.commitFile(true);
+        });
+      } else {
+        this.commitFile(false);
+      }
+      this.isShowCommitJudgeWindow = false;
+      this.commitFileControlIpfsCid = '';
+      this.comitJudgeCom = null;
+    },
+    /**
+     * 点击了文件灰钩 要提交文件
+     */
+    showCommitWindow(file, fileImgClass) {
+      this.isShowCommitJudgeWindow = true;
+      this.commitJudgeFile = file;
+      this.fileImgClass = fileImgClass;
+    },
+    /** 
+     * 提交本地文件 fileImgClass： 获得文件图标的类型 string
+     * remarkNote: 要提交的备注信息 string
+     * isMileStone: 是否是里程碑文件 bool
+     */
+    async commitFile(isConflict) {
+      if(!this.isClient) return;
+
+      let file = this.commitJudgeFile;
+      // 根据文件的id查询 文件的历史版本管理文件
+      const historyRes = await services.queryProjArchiveHistory(file.id);
+
+      let historyControlFileRes = historyRes.Data || {};//可能是null或者是一个不为空的对象
+    
+      if(Object.keys(historyControlFileRes).length > 0) {
+        historyControlFileRes = firstCharToLowerCase(historyControlFileRes);
+      }
+
+      //得到当前文件的最新版本 因为要接着在这个版本上添加一条记录
+      this.commitFileControlIpfsCid = historyControlFileRes.currentIpfsCid ? historyControlFileRes.currentIpfsCid : "";
+
+      const { folderName, levelId, id: folderId } = this.currentNodeFolder;
+      const { archName, extension, id: fileId, relativePath } = file;
+      this.updateFileLoadState(file, UPLOADING, 0);
+      const errorHandler = () => {
+        this.removeFileLoadingState(file.id);
+      }
+      // const fileList = this.currentPageType === 0 ? this.folderFileList.listMyFiles : this.folderFileList.listOtherFiles;
+      // const fileKey = `${folderName}\\${archName}${extension ? `.${extension}`:''}`;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      const { uploadCommandInfo} = this;
+      system.updateFile(
+        file, this.localWorkspacePrefix,
+        this.projectName, `${folderName}${relativePath ? `\\${relativePath}`.replace(/\//g, '\\'):''}`,
+        this.commitFileControlIpfsCid,
+        this.commitJudgeCom.remarkContent,
+        sessionStorage.getItem('accountName'),
+        this.commitJudgeCom.isMileStone,
+        isConflict,
+        async (fileNewState) => {
+          // const resFlag = await services.changeFileWorkStatus(file.id, 1);
+          // if(resFlag.Code !== 0) return;
+          notify.success(`${file.archName}，已更新。`);
+          const {IpfsCid} = fileNewState;
+          // 注入到文件下载检测表中
+          // 同时更新文件队列中file对象的ipfsCid属性这样才能在下次刷新前使文件的记录保持一致
+          this.addLocalFileRecord(fileStoreKey, IpfsCid);
+          this.removeFileLoadingState(fileId);
+          this.workFileList = this.workFileList.map(iFile => iFile.id === file.id ? { ...iFile, ipfsCid: IpfsCid, workStatus: NOT_WORKING } : iFile);
+          // 同步搜索栏中展示的工作文件状态
+          if(this.currentBtnIndex == 0 && this.isShowSearchPage) {
+            this.searchWorkFileList = this.searchWorkFileList.map(iFile => iFile.id === file.id ? { ...iFile, ipfsCid: IpfsCid, workStatus: NOT_WORKING } : iFile);
+          }
+        },
+        (progressData) => {
+          const { process, hash, size, currentSize, currentUnit, unit } = progressData;
+          // 避免使用最后一次progreessData中size被修正为Kb的数据
+          if(hash) return;
+          this.updateFileLoadState(file, UPLOADING, process, currentSize, currentUnit, size, unit);
+        },
+        errorHandler,
+      );
+    },
+    /**
+     * 获得历史版本
+     */
+    getHistoryFileList(fileMilestoneInfo) {
+      const getData = (data) =>{
+        this.fileHistoryList = data;
+      }
+      system.queryCommitHistory(fileMilestoneInfo.path, fileMilestoneInfo.hash, getData);
+    },
+    commitFolder(folder) {
+      const path = `${this.localWorkspacePrefix}\\${this.currentNodeFolder.folderName}${folder.folderPath ? `\\${folder.folderPath}`:''}`.replace(/\//g, '\\');
+      this.clientUpload([path]);
+    },
+    /**
+     * 文件打开方式
+     */
+    async openFileWith(file) {
+      const localWorkspacePrefix = this.localWorkspacePrefix;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      if(!this.localFileHashMap[fileStoreKey]) return;   
+      const filePath = `${localWorkspacePrefix}\\${fileStoreKey}`;
+    
+      // 若文件在协作文件中，则不更改状态
+      const { archName, extension, id: fileId, nodeName } = file;
+      const isCooperationFile = !!nodeName;
+
+      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;
+      system.clientOpenFileWith(filePath);
+      // this.fetchFolderFiles();
+    },
+    /**
+     * 点击文件事件：直接打开文件
+     */
+    fileClick: async function (file) {
+      //debugger;
+      if(!this.isClient) return;
+      const { archName, extension, id: fileId, nodeName } = file;
+      const folderName = nodeName || this.currentFolder.folderName;
+      const localWorkspacePrefix = this.localWorkspacePrefix;
+      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)) {
+      //  console.log("1111")
+      //  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;
+      // }
+    
+      file.modifyUserId = sessionStorage.userId;
+      system.openFile(filePath);
+      // this.fetchFolderFiles();
+    },
+    /**
+     * 设置历史文件界面
+     */
+    showFileMilestone: function (file) {
+      // todo 待修正，思考是否可以放到file组件中去
+      debugger;
+      if (file.status == 1 && file.modifyUserID != sessionStorage.userId) {
+        this.$notify({
+          message: "其他人编辑中，不能设置历史文件",
+          type: "warning",
+          offset: 100,
+          duration: 5000,
+        });
+        return;
+      }
+      this.currentMilestone=file;
+      this.dialogFileHistory = true;
+      //返回与该文件同名的所有文件并把自己过滤掉
+      this.listMilestones=this.getMilstoneFile(file);
+      console.log(this.listMilestones)
+      this.currentArchID = file.archID;
+    },
+    /**
+     * 右键菜单
+     */
+    rightShowMenu(e, file, type) {
+      
+      this.$nextTick(()=> {
+        this.rightMenuvisible = true;
+        this.tempRightFileId = 'currentWorkFolder';
+
+        this.rightMenuleft = e.clientX;
+        this.rightMenuTop = e.clientY;
+
+        this.rightMenuEl = this.$refs['right-menu'];
+        const workspace = document.querySelector('#workspace');
+
+        const areaWidth = workspace.clientWidth;
+
+        const rightMenuWidth = this.rightMenuEl ? this.rightMenuEl.clientWidth : 0;
+        //这里用的是固定定位所有竖直方向不会被遮挡 但是仍然存在一开始渲染的时候 会被遮挡的问题 因为此时rightMenu宽度是0
+        if(e.clientX + rightMenuWidth > areaWidth) {
+          this.rightMenuleft = e.clientX - rightMenuWidth;
+        }
+
+      })
+      // const menuMinWidth = 10;
+      // const offsetLeft = this.$el.getBoundingClientRect().left; // container margin left
+      // const offsetWidth = this.$el.offsetWidth; // container width
+      // const maxLeft = offsetWidth - menuMinWidth; // left boundary
+      // const left = e.clientX - offsetLeft; // 15: margin right
+      // this.rightMenuvisible = true;
+      // this.tempRightFileId = 'currentWorkFolder';
+      // // todo 边界修正
+      // this.rightMenuleft = e.clientX; // fix 位置bug
+      // this.rightMenuTop = e.clientY;
+    },
+    /**
+     * 关闭
+     */
+    closeShowMenu: function () {
+      this.rightMenuvisible = false;
+    },
+    /**
+     * 协作文件展开
+     */
+    openCopage: function () {
+      this.isShowpageIcon = false;
+      this.isCollapse = false;
+      this.neibianju = "neibianju1";
+      this.closepageH = "closepageH";
+    },
+    /**
+     * 协作文件折叠
+     */
+    closeCopage: function () {
+      this.isShowpageIcon = true;
+      this.isCollapse = true;
+      this.neibianju = "neibianju";
+      this.closepageH = "";
+
+    },
+    /**
+    * 点击了复制文件副本的按钮
+    */
+    async copyWorkFileBtnClick(targetFile, version) {
+      // console.log(targetFile, version);
+      const copyFile = cloneDeep(targetFile);
+      let nowNum = 1, tempName = "";
+      if(version) {
+        copyFile.archName = `${copyFile.archName}-版本${version}`;
+      }
+
+      //先添加 - 副本字样 再判断是否重复 如果重复就修改版本信息
+      tempName = copyFile.archName + '-副本';
+      let isExists = this.workFileList.find(file => file.archName === tempName);
+      while(isExists) {
+        // - 副本存在 -》修改为 -副本(x) 的字样
+        tempName = copyFile.archName + `-副本(${ ++ nowNum})`;
+        isExists = this.workFileList.find(file => file.archName === tempName); 
+      }
+      let hour = '0' + new Date().getHours();
+      let minute ='0' + new Date().getMinutes();
+      let seconds = '0' + new Date().getSeconds();
+      hour = hour.substr(hour.length-2);
+      minute = minute.substr(minute.length-2);
+      seconds = seconds.substr(seconds.length-2);
+      
+      copyFile.archName = tempName + '-' + hour + minute + seconds;
+      copyFile.modifyUserId = sessionStorage.userId;
+      copyFile.modifyTime = new Date();
+      copyFile.createUserId = sessionStorage.userId;
+      copyFile.createTime = new Date();
+      copyFile.historyCurrentIpfsCid = '';
+      await services.addFile(copyFile);
+      this.fetchFolderFiles();
+    },
+    deleteFileClick(fileId, createUserId, archName, ipfscid) {
+      var thisApp = this;
+        if (createUserId != sessionStorage.userId) {
+          thisApp.$notify({
+            message: "不能删除其他用户创建的文件。",
+            type: ["error"],
+            //offset: 100,
+            duration: 2500,
+          });
+          return;
+        }
+        this.$confirm(`确认删除“${archName}”吗？`, "", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          showClose: false,
+          type: "warning",
+        }).then(async function () {
+          const res = await services.deleteFile(fileId);
+          if(res.Code === 0) {
+            thisApp.$notify({
+                message: `“${archName}”文件已移除。`,
+                type: ["success"],
+                duration: 2500,
+              });
+              for(let key in thisApp.localFileHashMap) {
+                if(thisApp.localFileHashMap[key] === ipfscid) {
+                  delete thisApp.localFileHashMap[key];
+                  break;
+                }
+              }
+            thisApp.fetchFolderFiles();
+          }
+        })
+      },
+    async checkMilestoneClick(file) {
+      this.checkMilestoneShow = true;
+      const localWorkspacePrefix = this.localWorkspacePrefix;
+      const fileStoreKey = getFileStoreKey(file, this.currentNodeFolder);
+      if(!this.localFileHashMap[fileStoreKey]) return;
+      const filePath = `${localWorkspacePrefix}\\${fileStoreKey}`;
+      this.fileMilestoneInfo.path = filePath;
+      const res = await services.queryProjArchiveHistory(file.id);
+      if(res.Code == 0){
+        this.fileMilestoneInfo.hash = res.Data?.CurrentIpfsCid || '';
+      }
+      this.getHistoryFileList(this.fileMilestoneInfo);
+      this.currentFile = file;
+    },
+    //关闭查看历史版本
+    closeMilestonePain(close) {
+      this.checkMilestoneShow = close;
+    }
+  },
+}
+</script>
+
+
+<style>
+.section_item.section_item_aside_fl {
+  overflow: hidden;
+}
+.el-message-box--center .el-message-box__status.el-icon-warning {
+  position: absolute;
+  left: 0;
+}
+.yywenjiantitle_text1 {
+  position: relative;
+  top: 2px;
+}
+.youbian {
+  color: #a7a8b7;
+  position: relative;
+  top: 2px;
+}
+.app-header-style {
+  background-color: #f0f0f0;
+}
+.app-header-style .app-header-content-right {
+    display: flex;
+}
+
+</style>
+<style lang="scss" scoped>
+  .titleBox {
+    position: relative;
+  }
+  .app-header-style {
+    background-color: #f0f0f0;
+  }
+
+  .titlebar_head {
+    flex-direction: column;
+  }
+
+  .yiyun_section_top {
+    overflow: visible;
+  }
+
+  .folder_breadcrumb {
+    ::v-deep .el-breadcrumb__item {
+      user-select: none;
+      font-size: 18px;
+      display: inline-block;
+      height: 40px;
+      line-height: 40px;
+      .el-breadcrumb__separator {
+        color: #a7a8b7;
+      }
+      &:not(:last-child) {
+        cursor: pointer;
+      }
+    }
+  }
+
+  ::v-deep .readytodownload-icon {
+    position: relative;
+    top: 40px;
+    margin: 0 auto;
+  }
+  ::v-deep .progress-circle , ::v-deep .readytodownload-icon {
+    width: 45px;
+    height: 45px;
+    background-color: #fff;
+    border-radius: 50%;
+  }
+ ::v-deep .progress-circle , ::v-deep .readytodownload-icon img, ::v-deep .progress-circle .bg-pic{
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+ 
+ ::v-deep .progress-circle svg {
+    position:relative !important;
+  }
+
+  ::v-deep .progress-circle svg .el-progress-circle__track {
+    stroke: #fff !important;
+  }
+  .filePreview{
+    text-align: center;
+    video{
+        width: 820px;
+        height: 600px;
+    }
+  }
+
+  .img-container {
+    margin: 0 auto;
+  }
+  /* 新建样本文件弹框样式 */
+  .temp-file-dialog {
+   
+    /* 新建样板文件弹框的提示文件名 */
+    .guide-template-file-name {
+      color: rgba(0, 0, 0, 1);
+      font-size: 14px;
+      text-align: center;
+      font-family: PingFangSC-Regular;
+      padding: 16px;
+      text-align: center;
+    }
+  }
+
+</style>
+<style lang="scss">
+  .temp-file-dialog {
+    .el-dialog {
+      background-color: #fcfcfc;
+
+      .el-dialog__header {
+      padding: 19px 0;
+      }
+      .el-dialog__body {
+        padding: 0 !important;
+        .el-form {
+          padding: 20px 0 0 0;
+          background-color: #f1f1f1;
+          .el-form-item {
+            margin:0 0 0 0;
+          }
+        }
+      }
+      .el-form-item__content {
+        padding: 0 16px;
+        .el-input__inner {
+          background-color: #ddd;
+          margin: 0 0 20px 0;
+        }
+      }
+      .dialog-footer {
+        display: flex;
+        justify-content: space-between;
+        padding: 16px;
+      }
+      .el-dialog__footer {
+        padding: 0;
+        .el-button {
+          border-radius: 8px;
+          /* &.el-button--primary {
+            background-color: #7850ff;
+          } */
+        }
+      }
+    }
+  }
+  
+
+</style>
+<style scoped lang="scss">
+  .set-bg {
+    background-color: #f6f6f6;
+  }
+  .operate-bar {
+    width: 162px;
+    margin: 28px auto 15px;
+  }
+
+  .search-res-page-wrap {
+    margin: 0 64px;
+    box-sizing: border-box;
+  }
+  .out-wrap {
+    height: calc(100vh - (60px + 28px + 28px + 15px));
+    overflow: scroll;
+  }
+  .out-wrap::-webkit-scrollbar{
+    width: 8px;
+    border-radius: 4px;
+  }
+
+  .out-wrap::-webkit-scrollbar-thumb {
+    -webkit-border-radius: 10px;
+    border-radius: 10px;
+    height: 10px;
+    background-color: #adadad;
+  }
+
+  /*当前窗口失去焦点时的滑块样式*/
+  .out-wrap::-webkit-scrollbar-thumb:window-inactive {
+    background-color: #adadad;
+  }
+  .no-file-tips {
+    font-size: 22px;
+    text-align: center;
+    margin: 100px auto;
+  }
+</style>
+
+<style scoped lang="scss">
+  .my-workline {
+    text-align: center;
+  }
+
+  .adjust-workline-pos-client {
+    position: relative;
+    top: -12px;
+  }
+  .adjust-workline-pos-web {
+    position: relative;
+    top: -2.5px;
+  }
+  .ml-4-mt-20 {
+    margin: 20px 0 0 4px;
+  }
+  .height-0 {
+    height: 0;
+  }
+
+  .layout_content2 {
+    height: calc(100vh - 64px);
+  }
+// 调整协作文件显示区域的高度
+  .coopBox-max-height {
+    height: 300px;
+  }
+
+</style>
+
+<style scoped>
+  .workspace-header .app-header-center {
+    -webkit-app-region: no-drag;
+  }
+
+  .set-workarea-height {
+    height: calc(100vh - 64px - 300px) !important;
+  }
+
+  #workspace .yiyun_section_warp {
+    margin: 0 0 0 64px;
+    overflow: visible !important;
+    /* 防止只有一行文件的时候 工作区域的右键菜单会被遮挡 */
+  }
+</style>
+
+<style>
+  .conflit-message-box .el-icon-close:before {
+    content: '\e6db' !important;
+  }
+</style>
diff --git a/src/views/main_web/workspace/components/file-explorer/search-result.vue b/src/views/main_web/workspace/components/file-explorer/search-result.vue
new file mode 100644
index 00000000..92e74e52
--- /dev/null
+++ b/src/views/main_web/workspace/components/file-explorer/search-result.vue
@@ -0,0 +1,63 @@
+<!--
+  本文件暂时不用，后面继续拆分file-explorer组件时，替换搜索页部分的内容
+-->
+<template>
+  <div class="search-result">
+    <change-btn  :titleList="['工作文件', '协作文件']" class="operate-bar" @changeContentBtnClick="changeContentBtnClick"/>
+      <div class="out-wrap"> 
+        <div class="search-res-page-wrap">
+          <div class="list-group" v-if="currentBtnIndex == 0">
+            <!-- 工作文件 -->
+            <FileItem
+              class="lisy-group-item"
+              v-for="file in searchWorkFileList"
+              :key="file.id"
+              :file="file"
+              :clientDownLoad="clientDownLoad"
+              :showFileMilestone="showFileMilestone"
+              :nodeFolder="currentNodeFolder"
+              :currentFolder="currentFolder"
+              @commitFile="showCommitWindow"
+              @dblclickFile="fileClick(file)"
+              @filePreview="filePreview"
+              @openFileWith="openFileWith(file)"
+              @openfileBtnClick="fileClick(file)"
+              @copyFileBtnClick="copyWorkFileBtnClick(file)"
+              @oneFileRightBtnClick="oneFileRightBtnClick"
+              @deleteFileClick="deleteFileClick"
+              @checkMilestoneClick="checkMilestoneClick"
+              :tempRightFileId="tempRightFileId"
+              :localFileHashMap="localFileHashMap"
+              :loadingState="localFileLoadStateMap[file.id]"
+              @dragstart.native="onfileDragStart(file, $event)"
+              draggable
+            />
+            <div class="no-file-tips" v-if="searchWorkFileList && searchWorkFileList.length == 0">搜索不到与“{{searchContent}}”相关的工作文件</div>
+          </div>
+          <div class="list-group" v-else-if="currentBtnIndex == 1">
+            <!-- 协作文件 -->
+            <FileItem
+              v-for="file in searchCoopFileList"
+              :key="file.id"
+              :file="file"
+              :tempRightFileId="tempRightFileId"
+              :clientDownLoad="clientDownLoad"
+              :showFileMilestone="showFileMilestone"
+              :nodeFolder="currentNodeFolder"
+              :currentFolder="currentFolder"
+              @dblclickFile="fileClick(file)"
+              @filePreview="filePreview"
+              @openFileWith="openFileWith(file)"
+              @openfileBtnClick="fileClick(file)"
+              @oneFileRightBtnClick="oneFileRightBtnClick"
+              :localFileHashMap="localFileHashMap"
+              :loadingState="localFileLoadStateMap[file.id]"
+              @dragstart.native="onfileDragStart(file, $event)"
+              draggable
+            />
+            <div class="no-file-tips" v-if="searchCoopFileList && searchCoopFileList.length == 0">搜索不到与“{{searchContent}}”相关的协作文件</div>
+          </div>
+        </div>
+      </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/src/views/main_web/workspace/components/work-flow.vue b/src/views/main_web/workspace/components/work-flow.vue
new file mode 100644
index 00000000..4a035f5e
--- /dev/null
+++ b/src/views/main_web/workspace/components/work-flow.vue
@@ -0,0 +1,196 @@
+<template>
+  <div class="work-flow">
+    <div class="flow-container">
+      <div class="flow-container-inner">
+        <div
+          class="yuandian"
+          v-for="(myfolder, index) in folderList"
+          :key="myfolder.id"
+        >
+          <!-- 移入按钮 -->
+          <div class="upList">
+            <div class="enterPoint">
+              <div
+                type="button"
+                class="linkBtn2 leftlinebox"
+                :key="indexfrom"
+                v-for="(from, indexfrom) in myfolder.listsShareFrom[1]"
+              >
+                <i class="leftline"></i>
+                <span
+                  class="worllistt2"
+                  :title="from"
+                >{{from.nodeName }}</span>
+              </div>
+            </div>
+            <div
+              class="enterLine"
+              v-if="myfolder.listsShareFrom[1].length > 0"
+            >
+              <i class="el-icon-caret-bottom bottomenter"></i>
+            </div>
+          </div>
+          <div class="conterpoint">
+            <button
+              type="button"
+              :class="{
+                currworkbutton: myfolder == currentNodeFolder,
+                workbutton: myfolder !== currentNodeFolder,
+              }"
+              @click="selectFolder(myfolder)"
+              :title="myfolder.folderName"
+            >
+              {{ myfolder.folderName }}
+            </button>
+            <i
+              class="linkline workend"
+              v-if="index < folderList.length - 1"
+            ></i>
+          </div>
+          <!-- 移出按钮 -->
+          <div
+            class="bottomlist"
+            v-if="myfolder.listsShareFrom[0].length > 0"
+          >
+            <div class="leftlin2"></div>
+            <div class="outPoint">
+              <div
+                type="button"
+                class="linkBtn2 leftlinebox"
+                :key="indexShare"
+                v-for="(share, indexShare) in myfolder.listsShareFrom[0]"
+              >
+                <i class="leftline"></i>
+                <span
+                  class="worllistt2"
+                  :title="share"
+                >{{share.nodeName}}</span>
+              </div>
+              <div class="outLine">
+                <i class="el-icon-caret-bottom bottomenter"></i>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+
+<script>
+import { queryFileExchange, queryNestTemplateByProjectId } from '@/services/template';
+export default {
+  props: {
+    projectId: String,
+    currentNodeFolder: Object,
+    folderList: Array,
+  },
+  mounted() {
+    this.fetchFileExchange();
+  },
+  watch: {
+    folderList() {
+      this.fetchFileExchange();
+    }
+  },
+  methods: {
+    selectFolder(folder) {
+      this.$emit('select', folder);
+    },
+    async fetchFileExchange() {
+      if(!this.folderList || !this.folderList.length) { return; }
+      const mainTemplateId = this.folderList[0]?.templateId;
+      const [res, data/* , data2 */] = await Promise.all([
+        queryNestTemplateByProjectId(this.projectId),
+        this.$fetchApi('folder/queryAllNodeFolderListByProjectId', { projectId: this.projectId }),
+        // this.$fetchApi('template/queryTemplateNodeByTemplateId',{ templateId: mainTemplateId})
+      ]);
+      const temp = (data.Data.folder || []).reduce((h, folder)=>{
+        if(folder.NodeId === mainTemplateId) { return h; }
+        if(folder.FolderName === '公共文件夹') { return h; }
+        h[folder.NodeId] = {};
+        h[folder.NodeId].nodeName = folder.FolderName;
+        h[folder.NodeId].id = folder.Id;
+        //h[folder.NodeId]=folder.FolderName;
+        return h;
+      },{});
+
+      // const nodeLists = data2.Data ? data2.Data.children : [];
+      // const nestNodeIdLists=[];
+      // const parentNodeId;
+      // this.getNestItem(nodeLists,nestNodeIdLists, parentNodeId);
+      // var headNode={nodeId:null, parentNodeId: mainTemplateId };
+      // nestNodeIdLists.unshift(headNode);
+      // listsShareFrom[0] 存储的是给别人的 -》
+      // listsShareFrom[1] 存储的是别人给的 《-
+      // this.folderNodeIdMap = temp;
+
+      // 第一遍时顶级的模板的templateId
+      this.nestNodeFileExchangeOperate(mainTemplateId, temp);
+      // 嵌套模板的文件关系查询
+      (res.Data || []).forEach(({ NestTemplateId }) => {
+        this.nestNodeFileExchangeOperate(NestTemplateId, temp);
+      });
+    },
+    // 这里的temp是键值为nodeId 值是包含folder名字和folderId的一个对象
+    async nestNodeFileExchangeOperate(templateId, temp) {
+      const nestRes = await queryFileExchange(templateId, templateId);
+      if(nestRes.Code !== 0) return;
+
+      let nestData = nestRes.Data;
+      if(!nestData) return;
+      this.folderList.forEach(item => {
+        nestData.forEach(item2 => {
+          if(item.nodeId == item2.PermCode && item2.Permission == 1 && item.nodeId !== item2.SysCode) {
+              const isExistsFrom = item.listsShareFrom[1].find(obj1 => obj1.nodeId == item2.SysCode);
+              if(!isExistsFrom && temp[item2.SysCode]) {
+                item.listsShareFrom[1].push(temp[item2.SysCode]);
+              }
+          } else if(item.nodeId == item2.SysCode && item2.Permission == 1 && item.nodeId !== item2.PermCode) {
+              const isExistsTo = item.listsShareFrom[0].find(obj0=> obj0.nodeId == item2.PermCode);
+              if(!isExistsTo && temp[item2.PermCode]) {
+                item.listsShareFrom[0].push(temp[item2.PermCode]);
+              }
+          }
+        })
+      })
+    },
+    /**
+     * 获取嵌套节点
+     */
+    getNestItem(nodeLists, nestNodeIdLists, parentNodeId){
+      nodeLists.forEach(item => {
+        if(item.children && item.children.length > 0){
+          parentNodeId = item.id;
+          this.getNestItem(item.children, nestNodeIdLists, parentNodeId)
+        }
+        // if(item.isNest){
+        //   nestNodeIdLists.push({nodeId:item.id,parentNodeId:parentNodeId});
+        // }  
+      })
+    }, 
+  }
+};
+</script>
+
+<style lang="less" scoped>
+.work-flow {
+  height: 100%;
+  background-color: #f0f0f0;
+  .flow-container {
+    height: calc(100% - 64px);
+    margin-left: 32px;
+    width: calc(100% - 114px);
+    display: flex;
+    margin: auto;
+    // justify-content: center;
+    overflow-y: auto;
+    &-inner {
+      display: flex;
+      margin: 0 auto;
+      align-items: center;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/main_web/workspace/index.vue b/src/views/main_web/workspace/index.vue
index b49b7bd2..a5cc72a8 100644
--- a/src/views/main_web/workspace/index.vue
+++ b/src/views/main_web/workspace/index.vue
@@ -1,68 +1,84 @@
 <template>
-  <div v-cloak>
+  <div
+    class="workspace calc-height mt-64"
+    v-cloak
+  >
     <app-header
-      backBtnTitle="退出"
+      :backBtnTitle="workFlowVisible ? '回到协作空间' : '退出'"
       :isWorkspaceTopBar="true"
       :showUserCenter="true"
       class="app-header-style workspace-header"
-      showRecycleBin
+      :showRecycleBin="!workFlowVisible"
+      :onBackBtnClick="workFlowVisible ? closeWorkFlow : undefined"
     >
       <template #center>
         <!-- 工作链 -->
         <header-flow-tabs
+          v-if="currentNodeFolder"
+          v-show="!workFlowVisible"
           :folderList="nodeFolders"
           :currentNodeFolder="currentNodeFolder"
           @changeFolder="nowFolderClick"
           @showWorkFlow="workFlowVisible = true"
         />
-        <!-- <WorkLine
-          class="my-workline"
-          :class="{'adjust-workline-pos-client': isClient, 'adjust-workline-pos-web': !isClient}"
-          :isShowlink="showWorkline"
-          :listUserFolders="nodeFolders"
-          :nowFolderIndex="nowFolderIndex"
-          :nowFolderName="nowFolderName"
-          :nestTemplateLists="nestTemplateLists"
-          @goFolderAndBack="goFolderAndBack"
-          @previousFolder="previousFolder"
-          @showWorklinkPage="showWorklinkPage"
-          @nowFolderClick="nowFolderClick"
-          @hideWorklinkPage="hideWorklinkPage"
-          @finishGetExchangeNodes="finishGetExchangeNodes"
-        /> -->
+        <span v-show="workFlowVisible">{{projectName}}</span>
       </template>
       <template #right>
         <search-bar
+          v-show="!workFlowVisible"
           class="proj-search-bar"
           placeholder="请输入要搜索的文件名"
-         
+          :maxLength="35"
+          v-model="searchKeywords"
+          @didHide="offSearch"
         />
       </template>
     </app-header>
+    <work-flow
+      v-show="workFlowVisible"
+      v-if="currentNodeFolder"
+      :projectId="projectId"
+      :folderList="nodeFolders"
+      :currentNodeFolder="currentNodeFolder"
+      @select="nowFolderClick"
+    />
+    <template v-show="!workFlowVisible && currentNodeFolder">
+      <file-explorer
+        v-if="viewType === 'file-explorer'"
+        :currentNodeFolder="currentNodeFolder"
+        :searchContent="searchKeywords"
+        :nodeFolders="nodeFolders"
+      />
+    </template>
+
   </div>
 </template>
 
 <script>
-import { propertyOf, uniqBy, throttle, flatten, debounce, cloneDeep } from 'lodash';
-import AppHeader from '@/components/app-header'
+import AppHeader from "@/components/app-header";
 import SearchBar from "@/components/search-bar/search-bar";
-import HeaderFlowTabs from './components/header-flow-tabs';
-import * as services from './service';
-import { getUserListByNode } from '@/services/user.js';
-import { firstCharToLowerCase } from '@/utils/tool';
+import HeaderFlowTabs from "./components/header-flow-tabs";
+import FileExplorer from "./components/file-explorer";
+import * as services from "./service";
+import { getUserListByNode } from "@/services/user.js";
+import { firstCharToLowerCase } from "@/utils/tool";
+import WorkFlow from "./components/work-flow.vue";
 
 export default {
-  components: { AppHeader, HeaderFlowTabs, SearchBar },
+  components: { AppHeader, HeaderFlowTabs, SearchBar, WorkFlow, FileExplorer },
   data() {
     return {
       userId: sessionStorage.userId, // 当前用户id
       projectId: sessionStorage.projId, // 当前项目id
       projectName: sessionStorage.projName, // 当前项目名称
       nodeFolders: [], // 节点文件夹
-      currentNodeFolder: {}, // 当前节点文件夹
-      currentFolder: {}, // 当前文件夹，可以是节点文件夹，可以是子文件夹
+      currentNodeFolder: null, // 当前节点文件夹
+      // currentFolder: {}, // 当前文件夹，可以是节点文件夹，可以是子文件夹
       workFlowVisible: false, // 工作链页面显示开关
-    }
+      viewType: "file-explorer", // file-explorer || archive-view
+      // 搜索关键字
+      searchKeywords: "",
+    };
   },
   mounted() {
     // 获取含有节点人员分配信息的节点列表 listNewFolder
@@ -71,54 +87,83 @@ export default {
     this.fetchNodeFolders();
   },
   methods: {
+    closeWorkFlow() {
+      this.workFlowVisible = false;
+    },
+    offSearch() {
+      this.searchKeywords = "";
+    },
     /* 获取节点文件夹列表 */
     async fetchNodeFolders() {
-      const workList = await services.fetchWorkFlow(this.projectId, this.userId);
-      const folderList = workList.filter(folder => folder.nodeId !== folder.templateId && folder.folderName !== '公共文件夹');
+      const workList = await services.fetchWorkFlow(
+        this.projectId,
+        this.userId
+      );
+      const folderList = workList.filter(
+        (folder) =>
+          folder.nodeId !== folder.templateId &&
+          folder.folderName !== "公共文件夹"
+      );
 
       this.nodeFolders = folderList;
-      this.folderMap = folderList.reduce((h, f) => (h[f.id] = f, h), {});
-      if(!folderList.length) return;
+      this.folderMap = folderList.reduce((h, f) => ((h[f.id] = f), h), {});
+      if (!folderList.length) return;
       const paramsFolderId = this.$route.params.folderId;
-      
       // 匹配存在
       if (paramsFolderId) {
-        this.currentNodeFolder = folderList.find(folder => folder.id === paramsFolderId) || folderList[0];
-      } else if(sessionStorage.nowFolderIndex) {
-        this.currentNodeFolder = folderList[sessionStorage.nowFolderIndex] ||  folderList[0];
+        this.currentNodeFolder =
+          folderList.find((folder) => folder.id === paramsFolderId) ||
+          folderList[0];
+      } else if (sessionStorage.nowFolderIndex) {
+        this.currentNodeFolder =
+          folderList[sessionStorage.nowFolderIndex] || folderList[0];
       } else {
         this.currentNodeFolder = folderList[0];
       }
-      this.currentFolder = this.currentNodeFolder;
+      // this.currentFolder = this.currentNodeFolder;
       // this.currentFolderInCoop  = this.currentNodeFolder;
       // this.fetchFolderFiles();
     },
-    async getUserList(){
-      const { list: userList } = await getUserListByNode({ id: this.$store.state.currentCompanyId, nodeType: 'company' }, 1, 10000);
-      this.userList = userList;
-      return userList;
-    },
     // 获得所有工作链节点的 协同节点的人员指派信息
     async getAllNodePeopleInfo() {
       // 获取所有的节点信息 以及 人员列表信息
-      const [userList, projectDataRes] = await Promise.all([
-        this.getUserList(),
-        this.$fetchApi('folder/queryAllNodeFolderListByProjectId', { projectId: this.projectId }),
+      const [{ list: userList }, projectDataRes] = await Promise.all([
+        getUserListByNode(
+          { id: this.$store.state.currentCompanyId, nodeType: "company" },
+          1,
+          10000
+        ),
+        this.$fetchApi("folder/queryAllNodeFolderListByProjectId", {
+          projectId: this.projectId,
+        }),
       ]);
 
-      const userHash = userList.reduce((h, user) => (h[user.id] = user, h), {})
+      const userHash = userList.reduce(
+        (h, user) => ((h[user.id] = user), h),
+        {}
+      );
       const folderMap = {};
-      const { folder, manager } = (projectDataRes.Data || {});
-      const allNodefolderList = folder.reduce((iList,upperFolder) => {
-        if(upperFolder.FolderName === '公共文件夹') { return iList; }
-        if(upperFolder.NodeId === upperFolder.TemplateId) { return iList; }
+      const { folder, manager } = projectDataRes.Data || {};
+      const allNodefolderList = folder.reduce((iList, upperFolder) => {
+        if (upperFolder.FolderName === "公共文件夹") {
+          return iList;
+        }
+        if (upperFolder.NodeId === upperFolder.TemplateId) {
+          return iList;
+        }
         const folder = firstCharToLowerCase(upperFolder);
         folder.listChildren = [];
-        folder.listUser = folder.oldGeneralId.split(',').filter(a => a).map(id => ({...userHash[id]}));
-        folder.manageUser = (folder.oldManager === '0' ? '' : folder.oldManager).split(',').filter(a => a).map(id => ({...userHash[id]}));
+        folder.listUser = folder.oldGeneralId
+          .split(",")
+          .filter((a) => a)
+          .map((id) => ({ ...userHash[id] }));
+        folder.manageUser = (folder.oldManager === "0" ? "" : folder.oldManager)
+          .split(",")
+          .filter((a) => a)
+          .map((id) => ({ ...userHash[id] }));
         folderMap[folder.id] = folder;
         const parentFolder = folderMap[folder.superId];
-        if(!parentFolder) return iList;
+        if (!parentFolder) return iList;
         parentFolder.listChildren.push(folder);
         iList.push(folder);
         return iList;
@@ -133,6 +178,7 @@ export default {
      * 切换节点文件夹
      */
     nowFolderClick(nextFolder) {
+      this.workFlowVisible = false; // 关闭工作链面板
       this.goFolder(nextFolder);
       // this.isShowStartNodeFolders = true;//上面切换点击到另一个工作节点的时候 协作文件先显示总的节点入口
     },
@@ -143,24 +189,9 @@ export default {
       const nextFolderIndex = this.nodeFolders.indexOf(nextFolder);
       sessionStorage.nowFolderIndex = nextFolderIndex; // 用于刷新页面时使用
       this.currentNodeFolder = nextFolder;
-      if(this.currentNodeFolder !== this.currentFolder) {
-        this.clearCurrentFolderFiles();
-      }
-      this.currentFolder = this.currentNodeFolder;
-      // this.currentFolderInCoop = this.currentNodeFolder;
-
-      this.breadcrumbFolderList = [];
-      this.breadcrumbFolderListInCoop = [];
-      // this.fetchFolderFiles();
-      // this.loadListTempFiles();
-
-      this.$nextTick(()=> {
-        // this.listenBottomHeight();
-      })
     },
   },
-  
-}
+};
 
 // function mergeFolderList(folderList, userHash) {
 //   const [headFolder, hash] = folderList.reduce((h, upperFolder) => {
@@ -192,12 +223,11 @@ export default {
 //           circulate(folder.listChildren);
 //         }
 //       })
-//     } 
+//     }
 //   }
 //   circulate(folderList);
 //   return plainFolderList;
 // }
-
 </script>
 
 <style>
@@ -221,222 +251,219 @@ export default {
   background-color: #f0f0f0;
 }
 .app-header-style .app-header-content-right {
-    display: flex;
+  display: flex;
 }
-
 </style>
 <style lang="scss" scoped>
-  .titleBox {
-    position: relative;
-  }
-  .app-header-style {
-    background-color: #f0f0f0;
-  }
+.titleBox {
+  position: relative;
+}
+.app-header-style {
+  background-color: #f0f0f0;
+}
 
-  .titlebar_head {
-    flex-direction: column;
-  }
+.titlebar_head {
+  flex-direction: column;
+}
 
-  .yiyun_section_top {
-    overflow: visible;
-  }
+.yiyun_section_top {
+  overflow: visible;
+}
 
-  .folder_breadcrumb {
-    ::v-deep .el-breadcrumb__item {
-      user-select: none;
-      font-size: 18px;
-      display: inline-block;
-      height: 40px;
-      line-height: 40px;
-      .el-breadcrumb__separator {
-        color: #a7a8b7;
-      }
-      &:not(:last-child) {
-        cursor: pointer;
-      }
+.folder_breadcrumb {
+  ::v-deep .el-breadcrumb__item {
+    user-select: none;
+    font-size: 18px;
+    display: inline-block;
+    height: 40px;
+    line-height: 40px;
+    .el-breadcrumb__separator {
+      color: #a7a8b7;
+    }
+    &:not(:last-child) {
+      cursor: pointer;
     }
   }
+}
 
-  ::v-deep .readytodownload-icon {
-    position: relative;
-    top: 40px;
-    margin: 0 auto;
-  }
-  ::v-deep .progress-circle , ::v-deep .readytodownload-icon {
-    width: 45px;
-    height: 45px;
-    background-color: #fff;
-    border-radius: 50%;
-  }
- ::v-deep .progress-circle , ::v-deep .readytodownload-icon img, ::v-deep .progress-circle .bg-pic{
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-  }
- 
- ::v-deep .progress-circle svg {
-    position:relative !important;
-  }
+::v-deep .readytodownload-icon {
+  position: relative;
+  top: 40px;
+  margin: 0 auto;
+}
+::v-deep .progress-circle,
+::v-deep .readytodownload-icon {
+  width: 45px;
+  height: 45px;
+  background-color: #fff;
+  border-radius: 50%;
+}
+::v-deep .progress-circle,
+::v-deep .readytodownload-icon img,
+::v-deep .progress-circle .bg-pic {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
 
-  ::v-deep .progress-circle svg .el-progress-circle__track {
-    stroke: #fff !important;
-  }
-  .filePreview{
-    text-align: center;
-    video{
-        width: 820px;
-        height: 600px;
-    }
-  }
+::v-deep .progress-circle svg {
+  position: relative !important;
+}
 
-  .img-container {
-    margin: 0 auto;
-  }
-  /* 新建样本文件弹框样式 */
-  .temp-file-dialog {
-   
-    /* 新建样板文件弹框的提示文件名 */
-    .guide-template-file-name {
-      color: rgba(0, 0, 0, 1);
-      font-size: 14px;
-      text-align: center;
-      font-family: PingFangSC-Regular;
-      padding: 16px;
-      text-align: center;
-    }
+::v-deep .progress-circle svg .el-progress-circle__track {
+  stroke: #fff !important;
+}
+.filePreview {
+  text-align: center;
+  video {
+    width: 820px;
+    height: 600px;
   }
+}
 
+.img-container {
+  margin: 0 auto;
+}
+/* 新建样本文件弹框样式 */
+.temp-file-dialog {
+  /* 新建样板文件弹框的提示文件名 */
+  .guide-template-file-name {
+    color: rgba(0, 0, 0, 1);
+    font-size: 14px;
+    text-align: center;
+    font-family: PingFangSC-Regular;
+    padding: 16px;
+    text-align: center;
+  }
+}
 </style>
 <style lang="scss">
-  .temp-file-dialog {
-    .el-dialog {
-      background-color: #fcfcfc;
+.temp-file-dialog {
+  .el-dialog {
+    background-color: #fcfcfc;
 
-      .el-dialog__header {
+    .el-dialog__header {
       padding: 19px 0;
-      }
-      .el-dialog__body {
-        padding: 0 !important;
-        .el-form {
-          padding: 20px 0 0 0;
-          background-color: #f1f1f1;
-          .el-form-item {
-            margin:0 0 0 0;
-          }
-        }
-      }
-      .el-form-item__content {
-        padding: 0 16px;
-        .el-input__inner {
-          background-color: #ddd;
-          margin: 0 0 20px 0;
+    }
+    .el-dialog__body {
+      padding: 0 !important;
+      .el-form {
+        padding: 20px 0 0 0;
+        background-color: #f1f1f1;
+        .el-form-item {
+          margin: 0 0 0 0;
         }
       }
-      .dialog-footer {
-        display: flex;
-        justify-content: space-between;
-        padding: 16px;
+    }
+    .el-form-item__content {
+      padding: 0 16px;
+      .el-input__inner {
+        background-color: #ddd;
+        margin: 0 0 20px 0;
       }
-      .el-dialog__footer {
-        padding: 0;
-        .el-button {
-          border-radius: 8px;
-          /* &.el-button--primary {
+    }
+    .dialog-footer {
+      display: flex;
+      justify-content: space-between;
+      padding: 16px;
+    }
+    .el-dialog__footer {
+      padding: 0;
+      .el-button {
+        border-radius: 8px;
+        /* &.el-button--primary {
             background-color: #7850ff;
           } */
-        }
       }
     }
   }
-  
-
+}
 </style>
 <style scoped lang="scss">
-  .set-bg {
-    background-color: #f6f6f6;
-  }
-  .operate-bar {
-    width: 162px;
-    margin: 28px auto 15px;
-  }
+.set-bg {
+  background-color: #f6f6f6;
+}
+.operate-bar {
+  width: 162px;
+  margin: 28px auto 15px;
+}
 
-  .search-res-page-wrap {
-    margin: 0 64px;
-    box-sizing: border-box;
-  }
-  .out-wrap {
-    height: calc(100vh - (60px + 28px + 28px + 15px));
-    overflow: scroll;
-  }
-  .out-wrap::-webkit-scrollbar{
-    width: 8px;
-    border-radius: 4px;
-  }
+.search-res-page-wrap {
+  margin: 0 64px;
+  box-sizing: border-box;
+}
+.out-wrap {
+  height: calc(100vh - (60px + 28px + 28px + 15px));
+  overflow: scroll;
+}
+.out-wrap::-webkit-scrollbar {
+  width: 8px;
+  border-radius: 4px;
+}
 
-  .out-wrap::-webkit-scrollbar-thumb {
-    -webkit-border-radius: 10px;
-    border-radius: 10px;
-    height: 10px;
-    background-color: #adadad;
-  }
+.out-wrap::-webkit-scrollbar-thumb {
+  -webkit-border-radius: 10px;
+  border-radius: 10px;
+  height: 10px;
+  background-color: #adadad;
+}
 
-  /*当前窗口失去焦点时的滑块样式*/
-  .out-wrap::-webkit-scrollbar-thumb:window-inactive {
-    background-color: #adadad;
-  }
-  .no-file-tips {
-    font-size: 22px;
-    text-align: center;
-    margin: 100px auto;
-  }
-  .my-workline {
-    text-align: center;
-  }
+/*当前窗口失去焦点时的滑块样式*/
+.out-wrap::-webkit-scrollbar-thumb:window-inactive {
+  background-color: #adadad;
+}
+.no-file-tips {
+  font-size: 22px;
+  text-align: center;
+  margin: 100px auto;
+}
+.my-workline {
+  text-align: center;
+}
 
-  .adjust-workline-pos-client {
-    position: relative;
-    top: -12px;
-  }
-  .adjust-workline-pos-web {
-    position: relative;
-    top: -2.5px;
-  }
-  .ml-4-mt-20 {
-    margin: 20px 0 0 4px;
-  }
-  .height-0 {
-    height: 0;
-  }
+.adjust-workline-pos-client {
+  position: relative;
+  top: -12px;
+}
+.adjust-workline-pos-web {
+  position: relative;
+  top: -2.5px;
+}
+.ml-4-mt-20 {
+  margin: 20px 0 0 4px;
+}
+.height-0 {
+  height: 0;
+}
 
-  .layout_content2 {
-    height: calc(100vh - 64px);
-  }
+.layout_content2 {
+  height: calc(100vh - 64px);
+}
 // 调整协作文件显示区域的高度
-  .coopBox-max-height {
-    height: 300px;
-  }
-
+.coopBox-max-height {
+  height: 300px;
+}
 </style>
 
 <style scoped>
-  .workspace-header .app-header-center {
-    -webkit-app-region: no-drag;
-  }
+.workspace-header .app-header-center {
+  -webkit-app-region: no-drag;
+}
 
-  .set-workarea-height {
-    height: calc(100vh - 64px - 300px) !important;
-  }
+.set-workarea-height {
+  height: calc(100vh - 64px - 300px) !important;
+}
 
-  #workspace .yiyun_section_warp {
-    margin: 0 0 0 64px;
-    overflow: visible !important;
-    /* 防止只有一行文件的时候 工作区域的右键菜单会被遮挡 */
-  }
+#workspace .yiyun_section_warp {
+  margin: 0 0 0 64px;
+  overflow: visible !important;
+  /* 防止只有一行文件的时候 工作区域的右键菜单会被遮挡 */
+}
 </style>
 
 <style>
-  .conflit-message-box .el-icon-close:before {
-    content: '\e6db' !important;
-  }
+.conflit-message-box .el-icon-close:before {
+  content: "\e6db" !important;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/main_web/workspace/workspace.new.vue b/src/views/main_web/workspace/workspace.new.vue
index acbcc86b..0da68f82 100644
--- a/src/views/main_web/workspace/workspace.new.vue
+++ b/src/views/main_web/workspace/workspace.new.vue
@@ -161,7 +161,7 @@
                       <AddFileButton
                         v-if="isClient"
                         @fileTempClick="fileTempClick"
-                        :listTempFiles="listTempFiles"
+                        :currentNodeFolder="currentNodeFolder"
                         :selectSystemFiles="selectSystemFiles"
                         :selectSystemFolders="selectSystemFolders"
                       />
@@ -492,7 +492,7 @@
     @openFile="fileClick"
     :localWorkspacePrefix="localWorkspacePrefix"
     :fileHistoryList ="fileHistoryList"
-    :file = "currentFile"
+    :file="currentFile"
   > 
 
   </file-milestone>
@@ -627,7 +627,6 @@ export default {
       uploadFileList: [], // 上传文件的队列
       workFileList: [], // 工作文件队列
 
-      listTempFiles: [],//样板文件列表
       currentSelectTempFile: null,//选择创建的样本文件
       isShowNewTemplateFileDialog: false,//显示新建样本文件弹框
 
@@ -993,19 +992,6 @@ export default {
       this.isShowNewTemplateFileDialog = true;
       this.currentSelectTempFile = {...item};
     },
-    // 加载样本文件列表
-    async loadListTempFiles() {
-      if(this.nodeFolders && this.nodeFolders[this.nowFolderIndex]) {
-        const nodeId = this.nodeFolders[this.nowFolderIndex].nodeId;
-        const res = await queryAllTemplateNodeModelFile(nodeId);
-        if (res.Code !== 0) return;
-        if(res.Data.length > 0) {
-          this.listTempFiles = res.Data.map(f => firstCharToLowerCase(f));
-        } else {
-          this.listTempFiles = [];
-        }
-      }
-    },
     //预览文件
     async filePreview(file,type){
       const url = await services.filePreview(sessionStorage.companyId);
@@ -1450,7 +1436,6 @@ export default {
       this.breadcrumbFolderList = [];
       this.breadcrumbFolderListInCoop = [];
       this.fetchFolderFiles();
-      this.loadListTempFiles();
 
       this.$nextTick(()=> {
         this.listenBottomHeight();
@@ -1505,7 +1490,6 @@ export default {
       this.currentFolder = this.currentNodeFolder;
       this.currentFolderInCoop  = this.currentNodeFolder;
       this.fetchFolderFiles();
-      this.loadListTempFiles();
     },
     /**
      * 查询当前文件夹内容