|
|
@@ -13,7 +13,7 @@ |
|
|
|
v-if="!oneOf(file.extension, imgExtensionList)" |
|
|
|
class="defultImage-mid" |
|
|
|
:class="`${file.extension}-mid ${ |
|
|
|
isClient && file.downloadStatus !== DownloadStatus.DOWNLOADED ? 'toumin' : '' |
|
|
|
isClient && !localFileIsLatest ? 'toumin' : '' |
|
|
|
}`" |
|
|
|
@contextmenu.prevent.stop="rightShowMenu($event, file, 1)" |
|
|
|
/> |
|
|
@@ -22,7 +22,7 @@ |
|
|
|
v-else |
|
|
|
class="defultImage-mid img_bg-mid" |
|
|
|
:class=" |
|
|
|
isClient && file.downloadStatus !== DownloadStatus.DOWNLOADED ? 'toumin' : '' |
|
|
|
isClient && !localFileIsLatest ? 'toumin' : '' |
|
|
|
" |
|
|
|
@contextmenu.prevent.stop="rightShowMenu($event, file, 1)" |
|
|
|
> |
|
|
@@ -34,106 +34,91 @@ |
|
|
|
<!-- 标签 --> |
|
|
|
<div |
|
|
|
class="eidtTip" |
|
|
|
v-if="isWorking && file.modifyUserId !== currentUserId" |
|
|
|
v-if="isInWorkFolder && isWorking && file.modifyUserId !== currentUserId" |
|
|
|
> |
|
|
|
工作中 |
|
|
|
</div> |
|
|
|
|
|
|
|
<div |
|
|
|
@contextmenu.prevent.stop=" |
|
|
|
rightShowMenu($event, file, 1) |
|
|
|
" |
|
|
|
class="downloadIcon" |
|
|
|
@click="clientDownLoad(file, 1)" |
|
|
|
v-if="isClient && file.downloadStatus === DownloadStatus.UNDOWNLOAD && file.workStatus !== FileWorkStatus.WORKING |
|
|
|
" |
|
|
|
> |
|
|
|
<div class="readytodownload-icon"><img src="/static/img/download.svg" alt class="imgjuzhong" /></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 如果不在工作中 且上一次的修改者不是自己说明文件已经被更新 本地需要下载 --> |
|
|
|
<div |
|
|
|
@contextmenu.prevent.stop=" |
|
|
|
rightShowMenu($event, file, 1) |
|
|
|
" |
|
|
|
class="downloadIcon" |
|
|
|
@click="clientDownLoad(file, 1)" |
|
|
|
v-if="isClient && file.workStatus !== FileWorkStatus.WORKING && file.modifyUserId !== currentUserId |
|
|
|
" |
|
|
|
> |
|
|
|
<div class="readytodownload-icon"><img src="/static/img/download.svg" alt class="imgjuzhong" /></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div |
|
|
|
class="downloadIcon" |
|
|
|
v-if=" |
|
|
|
isClient && |
|
|
|
file.downloadStatus === DownloadStatus.DOWNLOADING |
|
|
|
" |
|
|
|
> |
|
|
|
<div class="progress-circle"> |
|
|
|
<img class="bg-pic" src="/static/img/download.svg" alt=""> |
|
|
|
<el-progress :width="45" :height="45" |
|
|
|
type="circle" :show-text="false" |
|
|
|
:percentage="file.loadProgress" :stroke-width="3" color="rgb(140, 0, 255)"> |
|
|
|
</el-progress> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div |
|
|
|
@contextmenu.prevent.stop="rightShowMenu($event, file, 1)" |
|
|
|
class="downloadIcon" |
|
|
|
v-if="isClient && file.downloadStatus === DownloadStatus.UPLOADING" |
|
|
|
> |
|
|
|
<div class="progress-circle"> |
|
|
|
<img class="bg-pic" src="/static/img/upload.png" alt="" :style="{ width: '24px' }" > |
|
|
|
<el-progress :width="45" :height="45" |
|
|
|
type="circle" :show-text="false" |
|
|
|
:percentage="file.loadProgress" :stroke-width="3" color="rgb(140, 0, 255)"> |
|
|
|
</el-progress> |
|
|
|
</div> |
|
|
|
<!-- <span class="spanjuzhong"> |
|
|
|
<i class="el-icon-loading largeicon"></i> |
|
|
|
<div class="minifont">上传中 {{file.loadProgress}}</div> |
|
|
|
</span> --> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 左上角图标 --> |
|
|
|
<template v-if="isClient && file.localIpfsCid"> |
|
|
|
<!-- 灰色感叹号 --> |
|
|
|
<template v-if="isClient"> |
|
|
|
<!-- 如果不在工作中 且上一次的修改者不是自己说明文件已经被更新 本地需要下载 --> |
|
|
|
<!-- 待下载 状态蒙板 --> |
|
|
|
<div |
|
|
|
class="yijianxietong modified-icon-parent" |
|
|
|
v-if="isInWorkFolder && (isWorking || (file.modifyUserId === userId && file.localIpfsCid !== file.ipfsCid))" |
|
|
|
@contextmenu.prevent.stop="rightShowMenu($event, file, 1)" |
|
|
|
class="downloadIcon" |
|
|
|
@click="clientDownLoad(file, 1)" |
|
|
|
v-if="(!isInWorkFolder || !otherUserIsWorking) && !localFileIsLatest" |
|
|
|
> |
|
|
|
<img src="/static/img/警示.svg" alt |
|
|
|
class="have-modified-icon" |
|
|
|
title="文件已经被修改 点击进行文件更新" |
|
|
|
@click="updateFileWorkStatus(file, 1, '文件已更新', 1)" |
|
|
|
/> |
|
|
|
<div class="readytodownload-icon"><img src="/static/img/download.svg" alt class="imgjuzhong" /></div> |
|
|
|
</div> |
|
|
|
<!-- 蓝色更新图标 协同文件列表中当本地文件和云端文件不同时 出现 --> |
|
|
|
<!-- 下载中 状态蒙板 --> |
|
|
|
<div |
|
|
|
v-if=" |
|
|
|
!isInWorkFolder && file.downloadStatus === DownloadStatus.DIFF |
|
|
|
" |
|
|
|
class="yijianxietong isonselect_update" |
|
|
|
class="downloadIcon" |
|
|
|
v-if="file.downloadStatus === DownloadStatus.DOWNLOADING" |
|
|
|
> |
|
|
|
<i |
|
|
|
class="icon font_family icon-icon_status_wenjianbiaojigengxin yijianIcon" |
|
|
|
title="当前文件不是最新的文件" |
|
|
|
@click="clientDownLoad(file, 1)" |
|
|
|
/> |
|
|
|
<div class="progress-circle"> |
|
|
|
<LottieSvg class="bg-pic" :width="40" :height="40" path="static/img/lottie.download.svg.json" /> |
|
|
|
<el-progress :width="45" :height="45" |
|
|
|
type="circle" :show-text="false" |
|
|
|
:percentage="file.loadProgress" :stroke-width="3" color="rgb(140, 0, 255)"> |
|
|
|
</el-progress> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 绿色钩 --> |
|
|
|
<!-- 上传中 状态蒙板 todo: 调整样式--> |
|
|
|
<div |
|
|
|
v-if="isInWorkFolder && file.workStatus === FileWorkStatus.NOT_WORKING" |
|
|
|
class="yijianxietong isonselect" |
|
|
|
@contextmenu.prevent.stop="rightShowMenu($event, file, 1)" |
|
|
|
class="downloadIcon" |
|
|
|
v-if="isClient && file.downloadStatus === DownloadStatus.UPLOADING" |
|
|
|
> |
|
|
|
<i |
|
|
|
class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon" |
|
|
|
title="已是最新版本" |
|
|
|
></i> |
|
|
|
<div class="progress-circle"> |
|
|
|
<img class="bg-pic" src="/static/img/upload.png" alt="" :style="{ width: '24px' }" > |
|
|
|
<el-progress :width="45" :height="45" |
|
|
|
type="circle" :show-text="false" |
|
|
|
:percentage="file.loadProgress" :stroke-width="3" color="rgb(140, 0, 255)"> |
|
|
|
</el-progress> |
|
|
|
</div> |
|
|
|
<!-- <span class="spanjuzhong"> |
|
|
|
<i class="el-icon-loading largeicon"></i> |
|
|
|
<div class="minifont">上传中 {{file.loadProgress}}</div> |
|
|
|
</span> --> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 左上角图标 --> |
|
|
|
<template v-if="fileInLocal"> |
|
|
|
<!-- 灰色感叹号 --> |
|
|
|
<div |
|
|
|
class="yijianxietong modified-icon-parent" |
|
|
|
v-if="isInWorkFolder && file.modifyUserId === currentUserId && isWorking" |
|
|
|
> |
|
|
|
<img src="/static/img/警示.svg" alt |
|
|
|
class="have-modified-icon" |
|
|
|
title="文件已经被修改 点击进行文件更新" |
|
|
|
@click="updateFileWorkStatus(file, 1, '文件已更新', 1)" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<!-- 蓝色更新图标 协同文件列表中当本地文件和云端文件不同时 出现 --> |
|
|
|
<div |
|
|
|
v-if=" |
|
|
|
!isInWorkFolder && file.downloadStatus === DownloadStatus.DIFF |
|
|
|
" |
|
|
|
class="yijianxietong isonselect_update" |
|
|
|
> |
|
|
|
<i |
|
|
|
class="icon font_family icon-icon_status_wenjianbiaojigengxin yijianIcon" |
|
|
|
title="当前文件不是最新的文件" |
|
|
|
@click="clientDownLoad(file, 1)" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<!-- 绿色钩 --> |
|
|
|
<div |
|
|
|
v-if="isInWorkFolder && file.workStatus === FileWorkStatus.NOT_WORKING" |
|
|
|
class="yijianxietong isonselect" |
|
|
|
> |
|
|
|
<i |
|
|
|
class="icon font_family icon-icon_status_wenjianbiaojiwancheng yijianIcon" |
|
|
|
title="已是最新版本" |
|
|
|
></i> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
<!-- 右上设置按钮 --> |
|
|
@@ -165,7 +150,7 @@ |
|
|
|
>{{ file.archName }}</strong> |
|
|
|
|
|
|
|
<span |
|
|
|
v-if="file.createUserId != currentUserId" |
|
|
|
v-if="isInWorkFolder && file.createUserId != currentUserId" |
|
|
|
class="yiyunwenjian_infodesc" |
|
|
|
>{{ file.createUserName }} 创建</span> |
|
|
|
|
|
|
@@ -178,6 +163,7 @@ |
|
|
|
版本 |
|
|
|
{{ file.version }} |
|
|
|
</span> |
|
|
|
<span v-if="!isInWorkFolder" class="yiyunwenjian_infodesc">{{file.nodeName}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-tooltip> |
|
|
@@ -186,12 +172,16 @@ |
|
|
|
|
|
|
|
<script> |
|
|
|
import system from "@/services/system"; |
|
|
|
import LottieSvg from '@/components/lottieSvg'; |
|
|
|
import { FileWorkStatus, DownloadStatus } from '../helper'; |
|
|
|
|
|
|
|
const imgExtensionList = ["jpg", "png", "bmp", "gif", "jpeg"]; |
|
|
|
const oneOf = (target, list) => list.indexOf(target) !== -1 |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { |
|
|
|
LottieSvg |
|
|
|
}, |
|
|
|
props: { |
|
|
|
file: { |
|
|
|
type: Object, |
|
|
@@ -228,8 +218,24 @@ export default { |
|
|
|
return file.folderId === currentFolder.id; |
|
|
|
}, |
|
|
|
isWorking() { |
|
|
|
console.log(this.file, this.file.archName); |
|
|
|
return this.file.workStatus === FileWorkStatus.WORKING; |
|
|
|
}, |
|
|
|
fileIsDifferent() { |
|
|
|
const { localIpfsCid, ipfsCid } = this.file; |
|
|
|
return localIpfsCid && localIpfsCid !== ipfsCid; |
|
|
|
}, |
|
|
|
localFileIsLatest() { |
|
|
|
const { localIpfsCid, ipfsCid } = this.file; |
|
|
|
return localIpfsCid && localIpfsCid === ipfsCid; |
|
|
|
}, |
|
|
|
// 本地是否有文件 |
|
|
|
fileInLocal() { |
|
|
|
return !!this.file.localIpfsCid; |
|
|
|
}, |
|
|
|
// 其他人员正在修改 |
|
|
|
otherUserIsWorking() { |
|
|
|
const { modifyUserId, workStatus } = this.file; |
|
|
|
return workStatus === FileWorkStatus.WORKING && modifyUserId !== this.currentUserId; |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|