feat:页面header添加主题切换

This commit is contained in:
shijing 2024-04-09 10:25:55 +08:00
parent 6d1f8fcbcb
commit 6fe3ab6eb9
1 changed files with 221 additions and 179 deletions

View File

@ -52,7 +52,19 @@
</el-drawer>
</div> -->
<!-- <el-button @click="markRead">全部设为已读</el-button> -->
<el-dropdown class="user panel-item" trigger="click" @command="handleUser">
<div class="login_config">
<el-button
:icon="config.dark ? 'el-icon-sunny' : 'el-icon-moon'"
circle
type="info"
@click="configDark"
></el-button>
</div>
<el-dropdown
class="user panel-item"
trigger="click"
@command="handleUser"
>
<div class="user-avatar">
<el-avatar :size="34" shape="square">{{ userNameF }}</el-avatar>
<label>{{ userName }}</label>
@ -64,13 +76,22 @@
<el-dropdown-menu>
<el-dropdown-item command="uc">帐号信息</el-dropdown-item>
<!-- <el-dropdown-item command="clearCache">清除缓存</el-dropdown-item> -->
<el-dropdown-item divided command="outLogin">退出登录</el-dropdown-item>
<el-dropdown-item divided command="outLogin"
>退出登录</el-dropdown-item
>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
<el-dialog v-model="searchVisible" :width="700" title="搜索" class="drawerBG" center destroy-on-close>
<el-dialog
v-model="searchVisible"
:width="700"
title="搜索"
class="drawerBG"
center
destroy-on-close
>
<search @success="searchVisible = false"></search>
</el-dialog>
</template>
@ -89,17 +110,34 @@ export default {
searchVisible: false,
msg: false,
msgList: {},
config: {
lang: this.$TOOL.data.get("APP_LANG") || this.$CONFIG.LANG,
dark: this.$TOOL.data.get("APP_DARK") || false,
},
};
},
watch: {
"config.dark"(val) {
if (val) {
document.documentElement.classList.add("dark");
this.$TOOL.data.set("APP_DARK", val);
} else {
document.documentElement.classList.remove("dark");
this.$TOOL.data.remove("APP_DARK");
}
},
},
created() {
var userInfo = this.$TOOL.data.get("USER_INFO");
this.userName = userInfo.username;
this.userNameF = this.userName.substring(0, 1);
},
methods: {
openBook() {
window.open('/media/ehs_guide.pdf')
window.open("/media/ehs_guide.pdf");
},
configDark() {
this.config.dark = this.config.dark ? false : true;
},
getMyVents() {
this.$API.ecm.myevent.list
@ -109,7 +147,7 @@ export default {
});
},
goEvent() {
this.$router.push({ name: "event" })
this.$router.push({ name: "event" });
},
createhandele(id) {
this.$router.push({
@ -165,8 +203,12 @@ export default {
confirmButtonClass: "el-button--danger",
})
.then(() => {
this.$TOOL.data.remove("TOKEN")
this.$router.push(`/login?redirect=${this.$route.fullPath}`).then(() => { location.reload() })
this.$TOOL.data.remove("TOKEN");
this.$router
.push(`/login?redirect=${this.$route.fullPath}`)
.then(() => {
location.reload();
});
})
.catch(() => {
//退