github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2026-03-08 02:17:04 +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)
}
if (index > -1) {
const el = this.$refs[`dialog_${this.dialogList[index]?.id}`][0]
if (el) {
$A.scrollIntoViewIfNeeded(el)
el.classList.remove("common-shake")
requestAnimationFrame(_ => el.classList.add("common-shake"))
const el = this.$refs[`dialog_${this.dialogList[index]?.id}`]
if (el && el[0]) {
$A.scrollIntoViewIfNeeded(el[0])
el[0].classList.remove("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-title">
<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" />
</div>
</div>
</div>
</div>
<div class="setting-box">
<div class="setting-menu" :class="{'show768-menu':show768Menu}">
<div class="setting-box" :class="{'show768-box':show768Box}">
<div class="setting-menu">
<ul>
<li
v-for="(item, key) in menu"
@ -65,7 +65,7 @@ export default {
return this.$route.name
},
show768Menu() {
show768Box() {
return this.routeName === 'manage-setting'
},

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

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