Merge branch 'dev-3.9' of git.mesalab.cn:nezha/nezha-fronted into dev-3.10

This commit is contained in:
zyh
2023-12-01 14:59:05 +08:00
2 changed files with 52 additions and 16 deletions

View File

@@ -172,17 +172,21 @@
}
.personal-dropdown-menu{
width: 200px;
margin-top: 14px !important;
width: 240px;
padding: 8px 0;
box-sizing: border-box;
border: none;
.el-dropdown-menu__item{
padding: 0 12px;
line-height: 32px;
font-size: 14px;
color: $--color-text-regular;
}
.personal-dropdown {
border-bottom: 1px solid $--border-color-light;
padding: 0 12px;
padding: 8px 12px;
.personal-dropdown__username {
max-width: 176px;
max-width: 216px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
@@ -190,10 +194,11 @@
font-family: Roboto-Regular;
font-size: 14px;
color: $--color-text-primary;
font-weight: 400;
font-weight: bold;
line-height: 20px;
}
.personal-dropdown__name {
max-width: 176px;
max-width: 216px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
@@ -202,22 +207,39 @@
font-size: 14px;
color: $--color-text-secondary;
font-weight: 400;
padding-bottom: 6px;
line-height: 20px;
}
}
.notification-dropdown{
border-bottom: 1px solid $--border-color-light;
padding: 0 12px;
.notification-dropdown-item{
padding: 0 12px;
line-height: 32px;
font-size: 14px;
color: $--color-text-regular;
display: flex;
align-items: center;
i{
margin-right: 5px;
}
line-height: 32px;
font-size: 14px;
color: $--color-text-regular;
}
.toggle-item{
cursor: pointer;
line-height: 38px;
justify-content: space-between;
&:hover{
background: $--background-color-base;
color: $--color-primary;
}
}
.toggle-item.nz-btn-disabled {
opacity: .6;
cursor: not-allowed !important;
}
}
.item-divide{
height: 1px;
background: $--border-color-light;
margin: 4px 0;
}
}

View File

@@ -56,28 +56,31 @@
<div class="personal-dropdown__username" :title="name">{{name}}</div>
<div class="personal-dropdown__name" :title="username">@{{username}}</div>
</div>
<div class="item-divide"></div>
<el-dropdown-item>
<div id="header-to-profile" @click="showPinDialog"><i class="nz-icon nz-icon-user"></i>{{$t('overall.personalCenter')}}</div>
</el-dropdown-item>
<div class="notification-dropdown">
<div class="notification-dropdown-item" style="justify-content: space-between;">
<div class="notification-dropdown-item toggle-item" :class="{'nz-btn-disabled': themeSave}" @click="darkThemeChange(!darkTheme)">
<div style="display:flex;align-items:center;">
<i class="nz-icon nz-icon-a-Darktheme" style="font-size:15px;"></i>
<span>{{$t('overall.darkTheme')}}</span>
</div>
<el-switch v-model="darkTheme" @change="darkThemeChange" :disabled="themeSave"></el-switch>
<el-switch v-model="darkTheme" @change="darkThemeChange" :disabled="themeSave" @click.native.stop></el-switch>
</div>
</div>
<div class="item-divide"></div>
<div class="notification-dropdown">
<div class="notification-dropdown-item">
<i class="nz-icon nz-icon-Notification" style="font-size:15px;"></i>
<span style="font-weight: bold;">{{$t('overall.notification')}}</span>
</div>
<div class="notification-dropdown-item" style="justify-content: space-between;">
<div class="notification-dropdown-item toggle-item" :class="{'nz-btn-disabled': newAlertMessageSave}" @click="newAlertMessageChange(!newAlertMessage)">
<span>{{$t('overall.newAlertMessage')}}</span>
<el-switch v-model="newAlertMessage" @change="newAlertMessageChange" :disabled="newAlertMessageSave"></el-switch>
<el-switch v-model="newAlertMessage" @change="newAlertMessageChange" :disabled="newAlertMessageSave" @click.native.stop></el-switch>
</div>
</div>
<div class="item-divide"></div>
<el-dropdown-item>
<div id="header-to-logout" @click="logout"><i class="nz-icon nz-icon-exit"></i>{{$t('overall.signOut')}}</div>
</el-dropdown-item>
@@ -189,6 +192,9 @@ export default {
this.testAutoplay()
},
methods: {
fn () {
console.log(666)
},
...mapActions(['logoutSuccess']),
// 测试是否能自动播放 若不能 点击开关时弹窗
testAutoplay () {
@@ -209,7 +215,11 @@ export default {
this.darkTheme = theme == 'dark'
},
darkThemeChange (val) {
if (this.themeSave) {
return
}
this.themeSave = true
this.darkTheme = val
this.$get('/sys/user/profile').then(response => {
if (response.code === 200) {
const userInfo = response.user
@@ -233,7 +243,11 @@ export default {
})
},
newAlertMessageChange (val) {
if (this.newAlertMessageSave) {
return
}
this.newAlertMessageSave = true
this.newAlertMessage = val
const param = {
newAlertMessage: {
enable: val