github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2026-03-17 19:23:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化聊天页面cpu占用

Browse Source
This commit is contained in:
kuaifan 2022-09-08 17:08:22 +08:00
parent b2b2efc9a8
commit 6c760f159b
2 changed files with 40 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
resources/assets/js/pages/manage/components/DialogWrapper.vue
View File

@ -106,7 +106,9 @@
@on-emoji="onEmoji" @on-emoji="onEmoji"
@on-show-emoji-user="onShowEmojiUser"> @on-show-emoji-user="onShowEmojiUser">
<template slot="header"> <template slot="header">
<div v-if="(allMsgs.length === 0 && loadMsg) || prevId > 0" class="dialog-item loading"><Loading/></div> <div v-if="(allMsgs.length === 0 && loadMsg) || prevId > 0" class="dialog-item loading">
<div class="loading-spinner"></div>
</div>
<div v-else-if="allMsgs.length === 0" class="dialog-item nothing">{{$L('暂无消息')}}</div> <div v-else-if="allMsgs.length === 0" class="dialog-item nothing">{{$L('暂无消息')}}</div>
</template> </template>
</VirtualList> </VirtualList>

39
resources/assets/sass/pages/components/dialog-wrapper.scss vendored
View File

@ -920,10 +920,45 @@
box-sizing: content-box; box-sizing: content-box;
justify-content: center; justify-content: center;
.common-loading { .loading-spinner {
margin: 0; position: relative;
width: 18px; width: 18px;
height: 18px; height: 18px;
text-indent: -9999em;
border-radius: 50%;
background: linear-gradient(to right, #ccc 10%, rgba(255, 255, 255, 0) 42%);
animation: spinner-load 1.4s infinite linear;
transform: translateZ(0);
@keyframes spinner-load {
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}
&:before {
width: 50%;
height: 50%;
background: #ccc;
border-radius: 100% 0 0 0;
position: absolute;
top: 0;
left: 0;
content: '';
}
&:after {
background: #ffffff;
width: 75%;
height: 75%;
border-radius: 50%;
content: '';
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
} }
} }