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): 精简版+动态路由权限初步

Browse Source
This commit is contained in:
Soybean
2022-01-03 22:20:10 +08:00
parent 7a0648dba5
commit de2057f141
354 changed files with 2053 additions and 22117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/layouts/BasicLayout/components/HorizontalLayout/index.vue
View File

@ -1,22 +0,0 @@
<template>
<n-layout ref="scrollbar" :native-scrollbar="false" :content-style="scrollbarContentStyle" class="h-full">
<n-layout-header :inverted="headerInverted" :position="headerPosition" :class="{ 'z-11': theme.fixedHeaderAndTab }">
<global-header :show-logo="true" :show-menu-collape="false" :show-menu="true" class="relative z-2" />
<global-tab v-if="theme.multiTabStyle.visible" />
</n-layout-header>
<space-placeholder />
<global-content />
<global-footer />
</n-layout>
</template>
<script setup lang="ts">
import { NLayout, NLayoutHeader } from 'naive-ui';
import { useThemeStore } from '@/store';
import { useLayoutConfig } from '@/composables';
import { GlobalHeader, GlobalContent, GlobalFooter, GlobalTab, SpacePlaceholder } from '@/layouts/common';
const theme = useThemeStore();
const { headerInverted, headerPosition, scrollbarContentStyle, scrollbar } = useLayoutConfig();
</script>
<style scoped></style>

58
src/layouts/BasicLayout/components/HorizontalMixLayout/index.vue
View File

@ -1,58 +0,0 @@
<template>
<n-layout :native-scrollbar="false" :content-style="flexColumnStyle" class="h-full">
<n-layout-header :inverted="headerInverted" position="absolute" class="z-13">
<global-header :show-logo="true" :show-menu-collape="true" :show-menu="false" class="relative z-2" />
</n-layout-header>
<n-layout :has-sider="true" class="h-full">
<n-layout-sider
v-bind="globalSiderClassAndStyle"
:content-style="flexColumnStyle"
:inverted="siderInverted"
collapse-mode="width"
:collapsed="app.menu.collapsed"
:collapsed-width="theme.menuStyle.collapsedWidth"
:width="siderMenuWidth"
:native-scrollbar="false"
@collapse="handleMenuCollapse(true)"
@expand="handleMenuCollapse(false)"
>
<space-placeholder :remove-tab="true" />
<n-scrollbar class="flex-1-hidden">
<global-menu />
</n-scrollbar>
</n-layout-sider>
<n-layout-content ref="scrollbar" :native-scrollbar="false" :content-style="scrollbarContentStyle">
<global-tab
v-if="theme.multiTabStyle.visible"
class="absolute left-0 w-full z-11 bg-white dark:bg-dark transition-background-color duration-300 ease-in-out"
:style="{ top: headerHeight }"
/>
<space-placeholder />
<global-content />
<global-footer />
</n-layout-content>
</n-layout>
</n-layout>
</template>
<script setup lang="ts">
import { NLayout, NLayoutContent, NLayoutSider, NLayoutHeader, NScrollbar } from 'naive-ui';
import { useThemeStore, useAppStore } from '@/store';
import { useLayoutConfig } from '@/composables';
import { GlobalHeader, GlobalContent, GlobalFooter, GlobalTab, GlobalMenu, SpacePlaceholder } from '@/layouts/common';
const theme = useThemeStore();
const app = useAppStore();
const { handleMenuCollapse } = useAppStore();
const {
headerInverted,
siderInverted,
siderMenuWidth,
globalSiderClassAndStyle,
flexColumnStyle,
scrollbarContentStyle,
headerHeight,
scrollbar
} = useLayoutConfig();
</script>
<style scoped></style>

64
src/layouts/BasicLayout/components/VerticalLayout/index.vue
View File

@ -1,64 +0,0 @@
<template>
<n-layout :has-sider="true" class="h-full">
<n-layout-sider
v-bind="globalSiderClassAndStyle"
:content-style="flexColumnStyle"
:inverted="siderInverted"
collapse-mode="width"
:collapsed="app.menu.collapsed"
:collapsed-width="theme.menuStyle.collapsedWidth"
:width="siderMenuWidth"
:native-scrollbar="false"
@collapse="handleMenuCollapse(true)"
@expand="handleMenuCollapse(false)"
>
<global-logo :show-title="!app.menu.collapsed" />
<n-scrollbar class="flex-1-hidden">
<global-menu />
</n-scrollbar>
</n-layout-sider>
<n-layout-content ref="scrollbar" :native-scrollbar="false" :content-style="scrollbarContentStyle">
<n-layout-header
:inverted="headerInverted"
:position="headerPosition"
:class="{ 'z-11': theme.fixedHeaderAndTab }"
>
<global-header :show-logo="false" :show-menu-collape="true" :show-menu="false" class="relative z-2" />
<global-tab v-if="theme.multiTabStyle.visible" />
</n-layout-header>
<space-placeholder />
<global-content />
<global-footer />
</n-layout-content>
</n-layout>
</template>
<script setup lang="ts">
import { NLayout, NLayoutSider, NLayoutContent, NLayoutHeader, NScrollbar } from 'naive-ui';
import { useThemeStore, useAppStore } from '@/store';
import { useLayoutConfig } from '@/composables';
import {
GlobalHeader,
GlobalContent,
GlobalFooter,
GlobalTab,
SpacePlaceholder,
GlobalLogo,
GlobalMenu
} from '@/layouts/common';
const theme = useThemeStore();
const app = useAppStore();
const { handleMenuCollapse } = useAppStore();
const {
siderInverted,
siderMenuWidth,
headerInverted,
headerPosition,
globalSiderClassAndStyle,
flexColumnStyle,
scrollbarContentStyle,
scrollbar
} = useLayoutConfig();
</script>
<style scoped></style>

30
src/layouts/BasicLayout/components/VerticalMixLayout/index.vue
View File

@ -1,30 +0,0 @@
<template>
<n-layout :has-sider="true" class="h-full">
<mix-sider v-bind="globalSiderClassAndStyle" />
<n-layout-content ref="scrollbar" :native-scrollbar="false" :content-style="scrollbarContentStyle">
<n-layout-header
:inverted="headerInverted"
:position="headerPosition"
:class="{ 'z-11': theme.fixedHeaderAndTab }"
>
<global-header :show-logo="false" :show-menu-collape="false" :show-menu="false" class="relative z-2" />
<global-tab v-if="theme.multiTabStyle.visible" />
</n-layout-header>
<space-placeholder />
<global-content />
<global-footer />
</n-layout-content>
</n-layout>
</template>
<script setup lang="ts">
import { NLayout, NLayoutContent, NLayoutHeader } from 'naive-ui';
import { useThemeStore } from '@/store';
import { useLayoutConfig } from '@/composables';
import { MixSider, GlobalHeader, GlobalContent, GlobalFooter, GlobalTab, SpacePlaceholder } from '@/layouts/common';
const theme = useThemeStore();
const { headerInverted, headerPosition, globalSiderClassAndStyle, scrollbarContentStyle, scrollbar } =
useLayoutConfig();
</script>
<style scoped></style>

6
src/layouts/BasicLayout/components/index.ts
View File

@ -1,6 +0,0 @@
import VerticalLayout from './VerticalLayout/index.vue';
import VerticalMixLayout from './VerticalMixLayout/index.vue';
import HorizontalLayout from './HorizontalLayout/index.vue';
import HorizontalMixLayout from './HorizontalMixLayout/index.vue';
export { VerticalLayout, VerticalMixLayout, HorizontalLayout, HorizontalMixLayout };

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

@ -1,26 +0,0 @@
<template>
<component :is="layoutComponent[theme.navStyle.mode]" />
<setting-drawer />
</template>
<script setup lang="ts">
import type { Component } from 'vue';
import { useThemeStore } from '@/store';
import type { NavMode } from '@/interface';
import { VerticalLayout, VerticalMixLayout, HorizontalLayout, HorizontalMixLayout } from './components';
import { SettingDrawer } from '../common';
type LayoutComponent = {
[key in NavMode]: Component;
};
const theme = useThemeStore();
const layoutComponent: LayoutComponent = {
vertical: VerticalLayout,
'vertical-mix': VerticalMixLayout,
horizontal: HorizontalLayout,
'horizontal-mix': HorizontalMixLayout
};
</script>
<style></style>