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: 优化移动端设置

Browse Source
This commit is contained in:
kuaifan 2023-02-22 12:17:35 +08:00
parent 9d5c5e0982
commit 2b7ed69c21
3 changed files with 30 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
resources/assets/js/pages/manage/messenger.vue
View File

@ -508,11 +508,11 @@ export default {
index = this.dialogList.findIndex(dialog => $A.getDialogUnread(dialog, true) > 0) index = this.dialogList.findIndex(dialog => $A.getDialogUnread(dialog, true) > 0)
} }
if (index > -1) { if (index > -1) {
const el = this.$refs[`dialog_${this.dialogList[index]?.id}`][0] const el = this.$refs[`dialog_${this.dialogList[index]?.id}`]
if (el) { if (el && el[0]) {
$A.scrollIntoViewIfNeeded(el) $A.scrollIntoViewIfNeeded(el[0])
el.classList.remove("common-shake") el[0].classList.remove("common-shake")
requestAnimationFrame(_ => el.classList.add("common-shake")) requestAnimationFrame(_ => el[0].classList.add("common-shake"))
} }
} }
}, },

8
resources/assets/js/pages/manage/setting/index.vue
View File

@ -5,14 +5,14 @@
<div class="setting-titbox"> <div class="setting-titbox">
<div class="setting-title"> <div class="setting-title">
<h1>{{$L(settingTitleName)}}</h1> <h1>{{$L(settingTitleName)}}</h1>
<div v-if="!show768Menu" class="setting-more" @click="toggleRoute('index')"> <div v-if="!show768Box" class="setting-more" @click="toggleRoute('index')">
<Icon type="md-close" /> <Icon type="md-close" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="setting-box"> <div class="setting-box" :class="{'show768-box':show768Box}">
<div class="setting-menu" :class="{'show768-menu':show768Menu}"> <div class="setting-menu">
<ul> <ul>
<li <li
v-for="(item, key) in menu" v-for="(item, key) in menu"
@ -65,7 +65,7 @@ export default {
return this.$route.name return this.$route.name
}, },
show768Menu() { show768Box() {
return this.routeName === 'manage-setting' return this.routeName === 'manage-setting'
}, },

25
resources/assets/sass/pages/page-setting.scss vendored
View File

@ -381,7 +381,20 @@
} }
.setting-box { .setting-box {
position: relative; position: relative;
.setting-menu { overflow: hidden;
padding-bottom: 0;
&.show768-box {
.setting-menu {
transform: translateX(0);
opacity: 1;
}
.setting-content {
transform: translateX(120%);
opacity: 0;
}
}
.setting-menu,
.setting-content {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -389,10 +402,11 @@
height: 100%; height: 100%;
z-index: 9; z-index: 9;
background-color: #ffffff; background-color: #ffffff;
transition: all 0.3s;
}
.setting-menu {
transform: translateX(-120%); transform: translateX(-120%);
&.show768-menu { opacity: 0;
transform: translateX(0);
}
> ul { > ul {
padding: 12px 32px; padding: 12px 32px;
> li { > li {
@ -404,6 +418,9 @@
} }
} }
.setting-content { .setting-content {
transform: translateX(0);
opacity: 1;
padding-bottom: 16px;
.setting-content-title { .setting-content-title {
display: none; display: none;
} }