子系统标题

main
许宏杰 3 weeks ago
parent 44d7207ccf
commit 4ca953802c

@ -1,53 +1,64 @@
<template>
<div class="sidebar-logo-container" :class="{ 'collapse': collapse }">
<div class="sidebar-logo-container" :class="{ collapse: collapse }">
<transition name="sidebarLogoFade">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
<router-link
v-if="collapse"
key="collapse"
class="sidebar-logo-link"
to="/"
>
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 v-else class="sidebar-title">{{ title }}</h1>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 class="sidebar-title">{{ title }}</h1>
<!-- <img v-if="logo" :src="logo" class="sidebar-logo" /> -->
<h1 class="sidebar-title">{{ getLogoName }}</h1>
</router-link>
</transition>
</div>
</template>
<script setup>
import logo from '@/assets/logo/logo.png'
import useSettingsStore from '@/store/modules/settings'
import variables from '@/assets/styles/variables.module.scss'
import logo from "@/assets/logo/logo.png";
import useSettingsStore from "@/store/modules/settings";
import variables from "@/assets/styles/variables.module.scss";
const { proxy } = getCurrentInstance();
defineProps({
collapse: {
type: Boolean,
required: true
}
})
required: true,
},
});
const title = import.meta.env.VITE_APP_TITLE
const settingsStore = useSettingsStore()
const sideTheme = computed(() => settingsStore.sideTheme)
const title = import.meta.env.VITE_APP_TITLE;
const settingsStore = useSettingsStore();
const sideTheme = computed(() => settingsStore.sideTheme);
// Logo
const getLogoBackground = computed(() => {
if (settingsStore.isDark) {
return 'var(--sidebar-bg)'
return "var(--sidebar-bg)";
}
return sideTheme.value === 'theme-dark' ? variables.menuBg : variables.menuLightBg
})
return sideTheme.value === "theme-dark"
? variables.menuBg
: variables.menuLightBg;
});
// Logo
const getLogoTextColor = computed(() => {
if (settingsStore.isDark) {
return 'var(--sidebar-text)'
return "var(--sidebar-text)";
}
return sideTheme.value === 'theme-dark' ? '#fff' : variables.menuLightText
})
return sideTheme.value === "theme-dark" ? "#fff" : variables.menuLightText;
});
const getLogoName = computed(() => {
return proxy.$cache.local.get("systemName");
});
</script>
<style lang="scss" scoped>
@import '@/assets/styles/variables.module.scss';
@import "@/assets/styles/variables.module.scss";
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
@ -64,7 +75,7 @@ const getLogoTextColor = computed(() => {
height: 50px;
line-height: 50px;
// background: v-bind(getLogoBackground);
background: #537CF7;
background: #537cf7;
text-align: center;
overflow: hidden;
@ -85,8 +96,10 @@ const getLogoTextColor = computed(() => {
color: v-bind(getLogoTextColor);
font-weight: 600;
line-height: 50px;
font-size: 14px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
font-family: "Alimama ShuHeiTi-Bold";
vertical-align: middle;
}
}
@ -97,4 +110,4 @@ const getLogoTextColor = computed(() => {
}
}
}
</style>
</style>

@ -27,7 +27,7 @@
class="menu-item"
v-for="(item, index) in topMenus"
:key="index"
@click="handleSelect(item.path)"
@click="handleSelect(item.path,item.meta.title)"
>
<div class="system-type div-flex-center">
<div class="type-box div-flex-center">
@ -74,7 +74,7 @@ const router = useRouter();
* 点击菜单
* @param key
*/
function handleSelect(key) {
function handleSelect(key,title) {
if (disableList.includes(key)) {
proxy.$modal.msgWarning("功能开发中,敬请期待");
return;
@ -94,8 +94,8 @@ function handleSelect(key) {
//
const currentChildRoter = activeRoutes(key);
appStore.toggleSideBarHide(false);
if (currentChildRoter.length > 0) {
proxy.$cache.local.set('systemName', title)
router.push({ path: currentChildRoter[0].path });
}
}

Loading…
Cancel
Save