fix(sth): 优化样式

This commit is contained in:
BTMuli
2023-03-23 22:20:57 +08:00
parent f8fcd9c130
commit 62b1a195fc
5 changed files with 44 additions and 18 deletions

View File

@@ -16,17 +16,17 @@
</template>
</v-list-item>
<!-- 菜单项 -->
<v-list-item value="home" title="首页" @click="toPage('home')">
<v-list-item value="home" title="首页" link href="/">
<template v-slot:prepend>
<img src="/source/UI/paimon.webp" alt="homeIcon" class="sideIcon" />
</template>
</v-list-item>
<v-list-item title="咨讯" value="news" @click="toPage('news')">
<v-list-item title="咨讯" value="news" link href="/news">
<template v-slot:prepend>
<img src="../assets/icons/board.svg" alt="newsIcon" class="sideIcon" />
</template>
</v-list-item>
<v-list-item title="成就" value="achievements" @click="toPage('achievements')">
<v-list-item title="成就" value="achievements" link href="/achievements">
<template v-slot:prepend>
<img src="../assets/icons/achievements.svg" alt="achievementsIcon" class="sideIcon" />
</template>
@@ -34,20 +34,20 @@
<v-divider></v-divider>
<v-list-group value="database" fluid>
<template v-slot:activator="{ props }">
<v-list-item title="数据库" v-bind="props">
<v-list-item title="数据库" v-bind="props" @click="submenu('database')">
<template v-slot:prepend>
<v-icon color="rgb(205, 182, 145)">mdi-database</v-icon>
</template>
</v-list-item>
</template>
<v-list-item title="GCG" value="GCG" @click="toPage('GCG')">
<v-list-item title="GCG" value="GCG" link href="/GCG">
<template v-slot:prepend>
<img src="../assets/icons/GCG.svg" alt="gcgIcon" class="sideIcon" />
</template>
</v-list-item>
</v-list-group>
<v-divider></v-divider>
<v-list-item title="设置" value="config" @click="toPage('config')">
<v-list-item title="设置" value="config" link href="/config">
<template v-slot:prepend>
<img src="../assets/icons/setting.svg" alt="setting" class="sideIcon" />
</template>
@@ -58,22 +58,22 @@
<script lang="ts" setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
import useAppStore from "../store/modules/app";
const router = useRouter();
const appStore = useAppStore();
const rail = ref(appStore.sidebar);
const open = ref(["database"]);
const rail = ref(appStore.sidebar.collapse);
const open = ref(appStore.getSubmenu());
function collapse() {
rail.value = !rail.value;
appStore.sidebar = rail.value;
appStore.sidebar.collapse = rail.value;
}
function toPage(link: string) {
router.push(link);
function submenu(value: string) {
if (value === "database") {
appStore.sidebar.submenu.database = open.value.includes(value);
}
}
</script>