mirror of
https://github.com/kuaifan/dootask.git
synced 2026-01-12 08:58:11 +00:00
移动端任务窗口聊天loading优化
This commit is contained in:
parent
dace5b92c7
commit
7fa2c0d6e7
@ -69,7 +69,12 @@
|
||||
<!-- 发送按钮 -->
|
||||
<li class="chat-send" :class="sendClass" v-touchmouse="clickSend">
|
||||
<ETooltip placement="top" :disabled="!$isDesktop" :content="$L('发送')">
|
||||
<div>
|
||||
<div v-if="loading">
|
||||
<div class="chat-load">
|
||||
<Loading/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<transition name="mobile-send">
|
||||
<i v-if="sendClass === 'recorder'" class="taskfont"></i>
|
||||
</transition>
|
||||
|
||||
@ -403,16 +403,14 @@
|
||||
ref="chatInput"
|
||||
:task-id="taskId"
|
||||
v-model="msgText"
|
||||
:loading="sendLoad > 0"
|
||||
:maxlength="20000"
|
||||
:placeholder="$L('输入消息...')"
|
||||
@on-more="onEventMore"
|
||||
@on-file="onSelectFile"
|
||||
@on-record="onRecord"
|
||||
@on-send="onSend"/>
|
||||
<div v-if="sendLoad > 0 || taskDetail.msg_num" class="input-badge" @click.stop="onSend">
|
||||
<Loading v-if="sendLoad > 0"/>
|
||||
<em v-else>{{taskDetail.msg_num > 99 ? '99+' : taskDetail.msg_num}}</em>
|
||||
</div>
|
||||
<div v-if="sendLoad === 0 && taskDetail.msg_num" class="input-badge" @click.stop="onSend">{{taskDetail.msg_num > 99 ? '99+' : taskDetail.msg_num}}</div>
|
||||
</div>
|
||||
<div v-if="dialogDrag" class="drag-over" @click="dialogDrag=false">
|
||||
<div class="drag-text">{{$L('拖动到这里发送')}}</div>
|
||||
|
||||
@ -165,6 +165,20 @@
|
||||
transition: all 0.3s ease;
|
||||
color: #ffffff;
|
||||
}
|
||||
.chat-load {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 3;
|
||||
transform: translate(-50%, -50%) scale(1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.common-loading {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.chat-record-recwave {
|
||||
position: absolute;
|
||||
|
||||
@ -592,25 +592,16 @@
|
||||
top: 2px;
|
||||
right: 22px;
|
||||
z-index: 2;
|
||||
.common-loading {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 0;
|
||||
}
|
||||
> em {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
border-radius: 10px;
|
||||
min-width: 20px;
|
||||
background: #ed4014;
|
||||
color: #fff;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
padding: 0 6px;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
white-space: nowrap;
|
||||
}
|
||||
height: 20px;
|
||||
border-radius: 10px;
|
||||
min-width: 20px;
|
||||
background: #ed4014;
|
||||
color: #fff;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
padding: 0 6px;
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.drag-over {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user