feat: 内容区域最小宽度滚动
This commit is contained in:
parent
28525002f6
commit
b73f2b3270
|
@ -35,11 +35,18 @@
|
||||||
</a-drawer>
|
</a-drawer>
|
||||||
<a-layout class="layout-content" :style="paddingStyle">
|
<a-layout class="layout-content" :style="paddingStyle">
|
||||||
<a-spin :loading="appStore.loading" :tip="appStore.loadingTip">
|
<a-spin :loading="appStore.loading" :tip="appStore.loadingTip">
|
||||||
|
<a-scrollbar
|
||||||
|
:style="{
|
||||||
|
overflow: 'auto',
|
||||||
|
width: `calc(100vw - ${menuWidth}px)`,
|
||||||
|
}"
|
||||||
|
>
|
||||||
<TabBar v-if="appStore.tabBar" />
|
<TabBar v-if="appStore.tabBar" />
|
||||||
<a-layout-content>
|
<a-layout-content>
|
||||||
<PageLayout />
|
<PageLayout />
|
||||||
</a-layout-content>
|
</a-layout-content>
|
||||||
<Footer v-if="footer" />
|
<Footer v-if="footer" />
|
||||||
|
</a-scrollbar>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</a-layout>
|
</a-layout>
|
||||||
</a-layout>
|
</a-layout>
|
||||||
|
@ -56,7 +63,6 @@
|
||||||
import Footer from '@/components/pure/footer/index.vue';
|
import Footer from '@/components/pure/footer/index.vue';
|
||||||
import TabBar from '@/components/pure/tab-bar/index.vue';
|
import TabBar from '@/components/pure/tab-bar/index.vue';
|
||||||
import usePermission from '@/hooks/usePermission';
|
import usePermission from '@/hooks/usePermission';
|
||||||
import useResponsive from '@/hooks/useResponsive';
|
|
||||||
import PageLayout from './page-layout.vue';
|
import PageLayout from './page-layout.vue';
|
||||||
|
|
||||||
const isInit = ref(false);
|
const isInit = ref(false);
|
||||||
|
@ -65,7 +71,6 @@
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const permission = usePermission();
|
const permission = usePermission();
|
||||||
useResponsive(true);
|
|
||||||
const navbarHeight = `56px`;
|
const navbarHeight = `56px`;
|
||||||
const navbar = computed(() => appStore.navbar);
|
const navbar = computed(() => appStore.navbar);
|
||||||
const renderMenu = computed(() => appStore.menu);
|
const renderMenu = computed(() => appStore.menu);
|
||||||
|
@ -164,6 +169,7 @@
|
||||||
transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
|
transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
|
||||||
.arco-layout-content {
|
.arco-layout-content {
|
||||||
padding: 16px 16px 16px 0;
|
padding: 16px 16px 16px 0;
|
||||||
|
min-width: 1000px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue