更新侧边栏
This commit is contained in:
parent
e776179c72
commit
3ee4b2e9a8
1
platform-vue
Submodule
1
platform-vue
Submodule
@ -0,0 +1 @@
|
|||||||
|
Subproject commit e776179c72c44ecd4e6e197f0c88253e8ab71bae
|
||||||
@ -167,6 +167,10 @@ import { useAllDataStore, useMenuStore } from "@/stores";
|
|||||||
|
|
||||||
const emit = defineEmits(["menu-click"]);
|
const emit = defineEmits(["menu-click"]);
|
||||||
|
|
||||||
|
const toggleMobile = () => {
|
||||||
|
store.state.isCollapse = !store.state.isCollapse;
|
||||||
|
};
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const menuStore = useMenuStore();
|
const menuStore = useMenuStore();
|
||||||
@ -194,6 +198,11 @@ const closeMobile = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
toggleMobile,
|
||||||
|
closeMobile,
|
||||||
|
});
|
||||||
|
|
||||||
const updateDeviceType = () => {
|
const updateDeviceType = () => {
|
||||||
isMobile.value = window.innerWidth <= 768;
|
isMobile.value = window.innerWidth <= 768;
|
||||||
// 手机端默认收起侧边栏
|
// 手机端默认收起侧边栏
|
||||||
@ -373,7 +382,7 @@ const fetchMenus = async () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleCollapse = () => {
|
const handleCollapse = () => {
|
||||||
store.state.isCollapse = !store.state.isCollapse;
|
toggleMobile();
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleMenuRefresh = () => {
|
const handleMenuRefresh = () => {
|
||||||
@ -626,7 +635,22 @@ h3 {
|
|||||||
// 响应式设计
|
// 响应式设计
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.common-aside {
|
.common-aside {
|
||||||
width: 100% !important;
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 240px !important;
|
||||||
|
max-width: 80vw;
|
||||||
|
z-index: 1000;
|
||||||
|
transform: translateX(-100%);
|
||||||
|
transition:
|
||||||
|
transform 0.3s ease,
|
||||||
|
width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
|
||||||
|
background-color 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.common-aside.mobile-open {
|
||||||
|
transform: translateX(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.el-menu) {
|
:deep(.el-menu) {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user