'admin-23.02.27:优化分栏布局'

This commit is contained in:
lyt 2023-02-27 23:32:58 +08:00
parent 909232742c
commit 1e78522b9f
3 changed files with 17 additions and 6 deletions

View File

@ -103,10 +103,11 @@ const initMenuFixed = (clientWidth) => {
}; };
// //
const onAsideEnterLeave = (bool) => { const onAsideEnterLeave = (bool) => {
let { layout } = themeConfig.value; const { layout, isColumnsMenuHoverPreload } = themeConfig.value;
if (layout !== 'columns') return false; if (layout !== 'columns') return false;
if (!bool) mittBus.emit('restoreDefault'); if (!bool) mittBus.emit('restoreDefault');
stores.setColumnsMenuHover(bool); // `` columnsAside.vue pinia.state
if (isColumnsMenuHoverPreload) stores.setColumnsMenuHover(bool);
}; };
// //
onBeforeMount(() => { onBeforeMount(() => {
@ -117,6 +118,7 @@ onBeforeMount(() => {
mittBus.on('setSendColumnsChildren', (res) => { mittBus.on('setSendColumnsChildren', (res) => {
state.menuList = res.children; state.menuList = res.children;
}); });
//
mittBus.on('setSendClassicChildren', (res) => { mittBus.on('setSendClassicChildren', (res) => {
let { layout, isClassicSplitMenu } = themeConfig.value; let { layout, isClassicSplitMenu } = themeConfig.value;
if (layout === 'classic' && isClassicSplitMenu) { if (layout === 'classic' && isClassicSplitMenu) {
@ -124,9 +126,11 @@ onBeforeMount(() => {
state.menuList = res.children; state.menuList = res.children;
} }
}); });
//
mittBus.on('getBreadcrumbIndexSetFilterRoutes', () => { mittBus.on('getBreadcrumbIndexSetFilterRoutes', () => {
setFilterRoutes(); setFilterRoutes();
}); });
// ()
mittBus.on('layoutMobileResize', (res) => { mittBus.on('layoutMobileResize', (res) => {
initMenuFixed(res.clientWidth); initMenuFixed(res.clientWidth);
closeLayoutAsideMobileMode(); closeLayoutAsideMobileMode();

View File

@ -5,7 +5,7 @@
<li <li
v-for="(v, k) in state.columnsAsideList" v-for="(v, k) in state.columnsAsideList"
:key="k" :key="k"
@click="onColumnsAsideMenuClick(v, k)" @click="onColumnsAsideMenuClick(v)"
@mouseenter="onColumnsAsideMenuMouseenter(v, k)" @mouseenter="onColumnsAsideMenuMouseenter(v, k)"
:ref=" :ref="
(el) => { (el) => {
@ -78,11 +78,14 @@ const setColumnsAsideMove = (k) => {
columnsAsideActiveRef.value.style.top = `${columnsAsideOffsetTopRefs.value[k].offsetTop + state.difference}px`; columnsAsideActiveRef.value.style.top = `${columnsAsideOffsetTopRefs.value[k].offsetTop + state.difference}px`;
}; };
// //
const onColumnsAsideMenuClick = (v, k) => { const onColumnsAsideMenuClick = (v) => {
setColumnsAsideMove(k);
let { path, redirect } = v; let { path, redirect } = v;
if (redirect) router.push(redirect); if (redirect) router.push(redirect);
else router.push(path); else router.push(path);
//
// https://gitee.com/lyt-top/vue-next-admin/issues/I6HW7H
if (!v.children) themeConfig.value.isCollapse = true;
else if (v.children.length > 1) themeConfig.value.isCollapse = false;
}; };
// //
const onColumnsAsideMenuMouseenter = (v, k) => { const onColumnsAsideMenuMouseenter = (v, k) => {
@ -97,6 +100,7 @@ const onColumnsAsideMenuMouseenter = (v, k) => {
}; };
// //
const onColumnsAsideMenuMouseleave = async () => { const onColumnsAsideMenuMouseleave = async () => {
if (!themeConfig.value.isColumnsMenuHoverPreload) return false;
await stores.setColumnsNavHover(false); await stores.setColumnsNavHover(false);
// store.state.routesList // store.state.routesList
setTimeout(() => { setTimeout(() => {
@ -115,6 +119,9 @@ const setFilterRoutes = () => {
const resData = setSendChildren(route.path); const resData = setSendChildren(route.path);
if (Object.keys(resData).length <= 0) return false; if (Object.keys(resData).length <= 0) return false;
onColumnsAsideDown(resData.item?.k); onColumnsAsideDown(resData.item?.k);
//
// https://gitee.com/lyt-top/vue-next-admin/issues/I6HW7H
resData.children.length <= 1 ? (themeConfig.value.isCollapse = true) : (themeConfig.value.isCollapse = false);
mittBus.emit('setSendColumnsChildren', resData); mittBus.emit('setSendColumnsChildren', resData);
}; };
// //

View File

@ -33,7 +33,7 @@ const updateScrollbar = () => {
// scrollbar // scrollbar
layoutScrollbarRef.value.update(); layoutScrollbarRef.value.update();
// scrollbar // scrollbar
layoutMainRef.value.layoutMainScrollbarRef.update(); layoutMainRef.value && layoutMainRef.value.layoutMainScrollbarRef.update();
}; };
// //
const initScrollBarHeight = () => { const initScrollBarHeight = () => {