github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-10 18:02:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化查看任务附件菜单

Browse Source
This commit is contained in:
kuaifan 2024-05-11 23:45:04 +09:00
parent 7bf5805714
commit 186d3b0d79
5 changed files with 85 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
language/original-web.txt
View File

@ -54,7 +54,6 @@
仅限项目或任务负责人操作
仅限项目或任务负责人添加
任务列表不存在或已被删除
你确定要删除这个文件吗？
密码错误，请输入正确密码
开放：所有人都可以发言。
强大易用的协同创作云文档
@ -1600,3 +1599,4 @@ License Key
长按语音消息可转换成文字。
需要在应用中开启 ChatGPT AI 机器人
关闭语音转文字功能。
你确定要删除文件【(*)】吗？

2
resources/assets/js/pages/manage/components/FileContent.vue
View File

@ -14,7 +14,7 @@
<div v-else class="edit-header">
<div class="header-title">
<EPopover v-if="!equalContent" v-model="unsaveTip" class="file-unsave-tip">
<div class="task-detail-delete-file-popover">
<div class="confirm-popover">
<p>{{$L('未保存当前修改内容？')}}</p>
<div class="buttons">
<Button size="small" type="text" @click="unSaveGive">{{$L('放弃')}}</Button>

114
resources/assets/js/pages/manage/components/TaskDetail.vue
View File

@ -277,25 +277,11 @@
</div>
<ul class="item-content file">
<li v-if="taskDetail.file_num > 50" class="tip">{{$L(`共${taskDetail.file_num}个文件，仅显示最新50个`)}}</li>
<li v-for="file in fileList">
<li v-for="file in fileList" @click="showFileDropdown(file, $event)">
<img v-if="file.id" class="file-ext" :src="file.thumb"/>
<Loading v-else class="file-load"/>
<div class="file-name">{{file.name}}</div>
<div class="file-size">{{$A.bytesToSize(file.size)}}</div>
<div class="file-menu" :class="{show:file._show_menu}">
<Icon @click="viewFile(file)" type="md-eye" />
<Icon @click="downFile(file)" type="md-arrow-round-down" />
<EPopover v-model="file._show_menu" class="file-delete">
<div class="task-detail-delete-file-popover">
<p>{{$L('你确定要删除这个文件吗？')}}</p>
<div class="buttons">
<Button size="small" type="text" @click="file._show_menu=false">{{$L('取消')}}</Button>
<Button size="small" type="primary" @click="deleteFile(file)">{{$L('确定')}}</Button>
</div>
</div>
<i slot="reference" class="taskfont del">&#xe6ea;</i>
</EPopover>
</div>
</li>
</ul>
<ul class="item-content">
@ -365,21 +351,21 @@
<div class="calculate-content"></div>
<EDropdownMenu slot="dropdown">
<EDropdownItem :command="1">
<div class="task-menu-icon" >
<div class="task-menu-icon">
<Icon v-if="taskDetail.visibility == 1" class="completed" :type="'md-checkmark-circle'"/>
<Icon v-else class="uncomplete" :type="'md-radio-button-off'"/>
{{$L('项目人员')}}
</div>
</EDropdownItem>
<EDropdownItem :command="2">
<div class="task-menu-icon" >
<div class="task-menu-icon">
<Icon v-if="taskDetail.visibility == 2" class="completed" :type="'md-checkmark-circle'"/>
<Icon v-else class="uncomplete" :type="'md-radio-button-off'"/>
{{$L('任务人员')}}
</div>
</EDropdownItem>
<EDropdownItem :command="3">
<div class="task-menu-icon" >
<div class="task-menu-icon">
<Icon v-if="taskDetail.visibility == 3" class="completed" :type="'md-checkmark-circle'"/>
<Icon v-else class="uncomplete" :type="'md-radio-button-off'"/>
{{$L('指定成员')}}
@ -391,14 +377,24 @@
<div class="calculate-content"></div>
<EDropdownMenu slot="dropdown">
<EDropdownItem :command="1">
<div class="task-menu-icon" >
{{$L('任务延期')}}
</div>
{{$L('任务延期')}}
</EDropdownItem>
<EDropdownItem :command="2">
<div class="task-menu-icon" >
{{$L('修改时间')}}
</div>
{{$L('修改时间')}}
</EDropdownItem>
</EDropdownMenu>
</EDropdown>
<EDropdown ref="eFileRef" class="calculate-dropdown" trigger="click" placement="bottom" @command="dropFile">
<div class="calculate-content"></div>
<EDropdownMenu slot="dropdown">
<EDropdownItem :command="1">
{{$L('查看附件')}}
</EDropdownItem>
<EDropdownItem :command="2">
{{$L('下载附件')}}
</EDropdownItem>
<EDropdownItem :command="3" class="task-calc-warn-text">
{{$L('删除附件')}}
</EDropdownItem>
</EDropdownMenu>
</EDropdown>
@ -1679,6 +1675,22 @@ export default {
});
},
showDropdown(ref, eRect){
const boxRect = this.$refs.scroller.$el.getBoundingClientRect()
const refEl = ref.$el
refEl.style.top = (eRect.top - boxRect.top) + 'px'
refEl.style.left = (eRect.left - boxRect.left) + 'px'
refEl.style.width = eRect.width + 'px'
refEl.style.height = eRect.height + 'px'
//
if (ref.visible) {
ref.hide()
}
setTimeout(() => {
ref.show()
}, 0)
},
showCisibleDropdown(e){
let eRect = null
if (e === null) {
@ -1689,37 +1701,12 @@ export default {
if (eRect === null) {
return
}
const boxRect = this.$refs.scroller.$el.getBoundingClientRect()
const refEl = this.$refs.eDropdownRef.$el
refEl.style.top = (eRect.top - boxRect.top) + 'px'
refEl.style.left = (eRect.left - boxRect.left) + 'px'
refEl.style.width = eRect.width + 'px'
refEl.style.height = eRect.height + 'px'
//
if (this.$refs.eDropdownRef.visible) {
this.$refs.eDropdownRef.hide()
}
setTimeout(() => {
this.$refs.eDropdownRef.show()
}, 0)
this.showDropdown(this.$refs.eDropdownRef, eRect)
},
showAtDropdown({target}){
this.timeOpen = false
const eRect = target.getBoundingClientRect()
const boxRect = this.$refs.scroller.$el.getBoundingClientRect()
const refEl = this.$refs.eDeadlineRef.$el
refEl.style.top = (eRect.top - boxRect.top) + 'px'
refEl.style.left = (eRect.left - boxRect.left) + 'px'
refEl.style.width = eRect.width + 'px'
refEl.style.height = eRect.height + 'px'
//
if (this.$refs.eDeadlineRef.visible) {
this.$refs.eDeadlineRef.hide()
}
setTimeout(() => {
this.$refs.eDeadlineRef.show()
}, 0)
this.showDropdown(this.$refs.eDeadlineRef, target.getBoundingClientRect())
},
visibleUserSelectShowChange(isShow){
@ -1794,6 +1781,31 @@ export default {
})
},
showFileDropdown(file, {target}){
this.operationFile = file
this.showDropdown(this.$refs.eFileRef, target.getBoundingClientRect())
},
dropFile(command) {
switch (command) {
case 1:
this.viewFile(this.operationFile)
break;
case 2:
this.downFile(this.operationFile)
break;
case 3:
$A.modalConfirm({
title: '删除文件',
content: `你确定要删除文件【${this.operationFile.name}】吗？`,
onOk: () => {
this.deleteFile(this.operationFile)
}
});
break;
}
},
updateVisible() {
this.updateData(['visibility', 'visibility_appointor'])
}

10
resources/assets/sass/pages/common.scss vendored
View File

@ -834,3 +834,13 @@ body.window-portrait {
.block-setting-space {
height: 8px;
}
.confirm-popover {
max-width: 200px;
.buttons {
text-align: right;
margin-top: 12px;
.ivu-btn-small {
font-size: 12px
}
}
}

49
resources/assets/sass/pages/components/task-detail.scss vendored
View File

@ -251,6 +251,7 @@
&.file {
margin-bottom: -3px;
> li {
cursor: pointer;
margin-bottom: 2px;
&.tip {
color: #999;
@ -281,38 +282,12 @@
font-size: 12px;
color: #bbbbbb;
}
.file-menu {
display: flex;
align-items: center;
opacity: 0;
transition: all 0.3s;
padding-left: 12px;
&.show {
opacity: 1;
}
i {
font-size: 14px;
color: #aaaaaa;
transition: color 0.3s;
cursor: pointer;
padding: 0 4px;
&:hover {
color: #777777;
}
&.del {
font-size: 13px;
&:hover {
color: #ff0000;
}
}
}
}
&:hover {
.file-name {
color: $primary-title-color;
}
.file-menu {
opacity: 1;
.file-size {
color: $primary-text-color;
}
}
}
@ -528,6 +503,9 @@
width: 100%;
height: 100%;
}
.calculate-text {
color: $flow-status-start-color;
}
}
}
.upload {
@ -855,23 +833,16 @@
}
}
.task-detail-delete-file-popover {
max-width: 200px;
.buttons {
text-align: right;
margin-top: 12px;
.ivu-btn-small {
font-size: 12px
}
}
}
.task-detail-loop {
> li {
text-align: center;
}
}
.task-calc-warn-text {
color: $flow-status-start-color !important;
}
body.window-portrait {
.task-detail {
.task-info {