ralfu/rustdesk-api-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
ljw
2024-10-22 14:07:53 +08:00
parent bd490d9f7e
commit 1969f7d196
1 changed files with 38 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/layout/components/setting/index.vue
+38 -30
View File
@@ -1,31 +1,37 @@
<template>
<div class="setting">
<div class="menu-item">
<el-dropdown>
<div class="title">
<i data-v-f414ea64="" class="el-icon el-tooltip__trigger" aria-label="请选择您的语言" id="el-id-1024-2" role="button" tabindex="0" aria-controls="el-id-1024-3" aria-expanded="false" aria-haspopup="navigation" style="font-size: 24px;"><svg data-v-f414ea64="" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24" width="1.2em" height="1.2em"><path fill="currentColor" d="m18.5 10l4.4 11h-2.155l-1.201-3h-4.09l-1.199 3h-2.154L16.5 10h2zM10 2v2h6v2h-1.968a18.222 18.222 0 0 1-3.62 6.301a14.864 14.864 0 0 0 2.336 1.707l-.751 1.878A17.015 17.015 0 0 1 9 13.725a16.676 16.676 0 0 1-6.201 3.548l-.536-1.929a14.7 14.7 0 0 0 5.327-3.042A18.078 18.078 0 0 1 4.767 8h2.24A16.032 16.032 0 0 0 9 10.877a16.165 16.165 0 0 0 2.91-4.876L2 6V4h6V2h2zm7.5 10.885L16.253 16h2.492L17.5 12.885z"></path></svg></i>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="(v, k) in appStore.setting.langs" @click="changeLang(k)" :key="k">{{ v.name }}</el-dropdown-item>
</el-dropdown-menu>
<el-switch
v-model="isDark"
style="--el-switch-on-color:#18222c"
>
<template #active-action>
<el-icon>
<Moon/>
</el-icon>
</template>
</el-dropdown>
</div>
<div class="menu-item">
<el-switch
v-model="isDark"
style="--el-switch-on-color:#18222c"
>
<template #active-action>
<el-icon><Moon/></el-icon>
</template>
<template #inactive-action>
<el-icon ><Sunny color="#000"/></el-icon>
</template>
</el-switch>
<template #inactive-action>
<el-icon>
<Sunny color="#000"/>
</el-icon>
</template>
</el-switch>
</div>
<el-dropdown class="menu-item">
<div class="title">
<i class="el-icon el-tooltip__trigger" style="font-size: 24px;">
<svg preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24" width="1.2em" height="1.2em">
<path fill="currentColor"
d="m18.5 10l4.4 11h-2.155l-1.201-3h-4.09l-1.199 3h-2.154L16.5 10h2zM10 2v2h6v2h-1.968a18.222 18.222 0 0 1-3.62 6.301a14.864 14.864 0 0 0 2.336 1.707l-.751 1.878A17.015 17.015 0 0 1 9 13.725a16.676 16.676 0 0 1-6.201 3.548l-.536-1.929a14.7 14.7 0 0 0 5.327-3.042A18.078 18.078 0 0 1 4.767 8h2.24A16.032 16.032 0 0 0 9 10.877a16.165 16.165 0 0 0 2.91-4.876L2 6V4h6V2h2zm7.5 10.885L16.253 16h2.492L17.5 12.885z"></path>
</svg>
</i>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="(v, k) in appStore.setting.langs" @click="changeLang(k)" :key="k">{{ v.name }}</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-dropdown class="menu-item">
<div class="title">
<!-- <el-image class="avatar" :src="user.avatar"></el-image>-->
@@ -38,8 +44,8 @@
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="showChangePwd">{{T('ChangePassword')}}</el-dropdown-item>
<el-dropdown-item @click="logout">{{ T('Logout')}}</el-dropdown-item>
<el-dropdown-item @click="showChangePwd">{{ T('ChangePassword') }}</el-dropdown-item>
<el-dropdown-item @click="logout">{{ T('Logout') }}</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
@@ -53,8 +59,8 @@
import changePwdDialog from '@/components/changePwdDialog.vue'
import { ref } from 'vue'
import { T } from '@/utils/i18n'
import { useDark } from "@vueuse/core"
import {Sunny, Moon} from '@element-plus/icons'
import { useDark } from '@vueuse/core'
import { Sunny, Moon } from '@element-plus/icons'
const userStore = useUserStore()
const user = userStore
@@ -72,7 +78,7 @@
const changeLang = (v) => {
appStore.changeLang(v)
}
const isDark = useDark();
const isDark = useDark()
// const toggleDark = useToggle(isDark)
</script>
@@ -82,9 +88,11 @@
display: flex;
align-items: center;
justify-content: space-around;
.menu-item {
margin-left: 10px;
*{
margin-left: 15px;
* {
outline: none;
}
}