jiangyc/ruoyi-plus-soybean
1
0
Fork 0
mirror of https://github.com/m-xlsea/ruoyi-plus-soybean.git synced 2025-09-24 07:49:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(projects): perfect scrollbar style [完善滚动条]

Browse Source
This commit is contained in:
Soybean
2022-11-13 09:45:00 +08:00
parent 1bdd81a1d8
commit 1a02cab97c
5 changed files with 1014 additions and 904 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/layouts/BasicLayout/index.vue
View File

@ -10,7 +10,6 @@
:sider-width="siderWidth"
:sider-collapsed-width="siderCollapsedWidth"
:sider-collapse="app.siderCollapse"
:add-main-overflow-hidden="addMainOverflowHidden"
:fixed-footer="theme.footer.fixed"
@update:sider-collapse="app.setSiderCollapse"
>
@ -23,7 +22,7 @@
<template #sider>
<global-sider />
</template>
<global-content @hide-main-overflow="setAddMainOverflowHidden" />
<global-content />
<template #footer>
<global-footer />
</template>
@ -36,7 +35,6 @@
import AdminLayout from '@soybeanjs/vue-admin-layout';
import { useAppStore, useThemeStore } from '@/store';
import { useBasicLayout } from '@/composables';
import { useBoolean } from '@/hooks';
import {
GlobalBackTop,
GlobalContent,
@ -53,8 +51,6 @@ const app = useAppStore();
const theme = useThemeStore();
const { mode, isMobile, headerProps, siderVisible, siderWidth, siderCollapsedWidth } = useBasicLayout();
const { bool: addMainOverflowHidden, setBool: setAddMainOverflowHidden } = useBoolean();
</script>
<style scoped></style>

22
src/layouts/common/GlobalContent/index.vue
View File

@ -4,13 +4,7 @@
class="h-full bg-[#f6f9f8] dark:bg-[#101014] transition duration-300 ease-in-out"
>
<router-view v-slot="{ Component, route }">
<transition
:name="theme.pageAnimateMode"
mode="out-in"
:appear="true"
@before-leave="handleBeforeLeave"
@after-enter="handleAfterEnter"
>
<transition :name="theme.pageAnimateMode" mode="out-in" :appear="true">
<keep-alive :include="routeStore.cacheRoutes">
<component :is="Component" v-if="app.reloadFlag" :key="route.fullPath" />
</keep-alive>
@ -33,23 +27,9 @@ withDefaults(defineProps<Props>(), {
showPadding: true
});
interface Emits {
/** 禁止主体溢出 */
(e: 'hide-main-overflow', hidden: boolean): void;
}
const emit = defineEmits<Emits>();
const app = useAppStore();
const theme = useThemeStore();
const routeStore = useRouteStore();
function handleBeforeLeave() {
emit('hide-main-overflow', true);
}
function handleAfterEnter() {
emit('hide-main-overflow', false);
}
</script>
<style scoped></style>