gitee/dootask
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

perf: 优化任务详情拖动发送文件

Browse Source
This commit is contained in:
kuaifan 2022-02-12 13:49:30 +08:00
parent 2fc039dd70
commit f9d28e1b6b
2 changed files with 36 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -68,10 +68,7 @@
<!--主任务--> <!--主任务-->
<div <div
v-else-if="ready" v-else-if="ready"
:class="{'task-detail':true, 'open-dialog': hasOpenDialog, 'completed': taskDetail.complete_at}" :class="{'task-detail':true, 'open-dialog': hasOpenDialog, 'completed': taskDetail.complete_at}">
@drop.prevent="taskPasteDrag($event, 'drag')"
@dragover.prevent="taskDragOver(true, $event)"
@dragleave.prevent="taskDragOver(false, $event)">
<div v-show="taskDetail.id > 0" class="task-info"> <div v-show="taskDetail.id > 0" class="task-info">
<div class="head"> <div class="head">
<TaskMenu <TaskMenu
@ -383,7 +380,10 @@
</div> </div>
</div> </div>
<ProjectLog v-if="navActive=='log' && taskId > 0" ref="log" :task-id="taskDetail.id" :show-load="false" @on-load-change="logLoadChange"/> <ProjectLog v-if="navActive=='log' && taskId > 0" ref="log" :task-id="taskDetail.id" :show-load="false" @on-load-change="logLoadChange"/>
<div v-else class="no-dialog"> <div v-else class="no-dialog"
@drop.prevent="taskPasteDrag($event, 'drag')"
@dragover.prevent="taskDragOver(true, $event)"
@dragleave.prevent="taskDragOver(false, $event)">
<div class="no-tip">{{$L('暂无消息')}}</div> <div class="no-tip">{{$L('暂无消息')}}</div>
<div class="no-input"> <div class="no-input">
<DragInput <DragInput
@ -402,13 +402,13 @@
<Icon v-else type="md-send" /> <Icon v-else type="md-send" />
</div> </div>
</div> </div>
<div v-if="dialogDrag" class="drag-over" @click="dialogDrag=false">
<div class="drag-text">{{$L('拖动到这里发送')}}</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div v-if="!taskDetail.id" class="task-load"><Loading/></div> <div v-if="!taskDetail.id" class="task-load"><Loading/></div>
<div v-if="dialogDrag" class="drag-over" @click="dialogDrag=false">
<div class="drag-text">{{$L('拖动到这里发送')}}</div>
</div>
</div> </div>
</template> </template>

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

@ -531,6 +531,7 @@
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
.no-tip { .no-tip {
flex: 1; flex: 1;
display: none; display: none;
@ -555,6 +556,33 @@
display: none; display: none;
} }
} }
.drag-over {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 3;
background-color: rgba(255, 255, 255, 0.78);
display: flex;
align-items: center;
justify-content: center;
&:before {
content: "";
position: absolute;
top: 0;
left: 36px;
right: 0;
bottom: 0;
border: 2px dashed #7b7b7b;
border-radius: 12px;
}
.drag-text {
padding: 12px;
font-size: 18px;
color: #666666;
}
}
} }
.project-log { .project-log {
margin-left: 36px; margin-left: 36px;
@ -602,33 +630,6 @@
height: 32px; height: 32px;
} }
} }
.drag-over {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 3;
background-color: rgba(255, 255, 255, 0.78);
display: flex;
align-items: center;
justify-content: center;
&:before {
content: "";
position: absolute;
top: 16px;
left: 16px;
right: 16px;
bottom: 16px;
border: 2px dashed #7b7b7b;
border-radius: 12px;
}
.drag-text {
padding: 12px;
font-size: 18px;
color: #666666;
}
}
&.open-dialog { &.open-dialog {
flex-direction: row; flex-direction: row;