| | |
| | | <template> |
| | | <div :class="[prefixCls, getLayoutContentMode]" v-loading="getOpenPageLoading && getPageLoading"> |
| | | <PageLayout /> |
| | | <!-- update-begin-author:zyf date:20211129 for:qiankun 挂载子应用盒子 --> |
| | | <div id="content" class="app-view-box" v-if="openQianKun == 'true'"></div> |
| | | <!-- update-end-author:zyf date:20211129 for: qiankun 挂载子应用盒子--> |
| | | </div> |
| | | <div :class="[prefixCls, getLayoutContentMode]" v-loading="getOpenPageLoading && getPageLoading"> |
| | | <PageLayout /> |
| | | <!-- update-begin-author:zyf date:20211129 for:qiankun 挂载子应用盒子 --> |
| | | <div id="content" class="app-view-box" v-if="openQianKun == 'true'"></div> |
| | | <!-- update-end-author:zyf date:20211129 for: qiankun 挂载子应用盒子--> |
| | | </div> |
| | | </template> |
| | | <script lang="ts"> |
| | | import { defineComponent, onMounted } from 'vue'; |
| | | import PageLayout from '/@/layouts/page/index.vue'; |
| | | import { useDesign } from '/@/hooks/web/useDesign'; |
| | | import { useRootSetting } from '/@/hooks/setting/useRootSetting'; |
| | | import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting'; |
| | | import { useContentViewHeight } from './useContentViewHeight'; |
| | | // import registerApps from '/@/qiankun'; |
| | | import { useGlobSetting } from '/@/hooks/setting'; |
| | | export default defineComponent({ |
| | | name: 'LayoutContent', |
| | | components: { PageLayout }, |
| | | setup() { |
| | | const { prefixCls } = useDesign('layout-content'); |
| | | const { getOpenPageLoading } = useTransitionSetting(); |
| | | const { getLayoutContentMode, getPageLoading } = useRootSetting(); |
| | | const globSetting = useGlobSetting(); |
| | | const openQianKun = globSetting.openQianKun; |
| | | useContentViewHeight(); |
| | | onMounted(() => { |
| | | // //注册openQianKun |
| | | // if (openQianKun == 'true') { |
| | | // if (!window.qiankunStarted) { |
| | | // window.qiankunStarted = true; |
| | | // registerApps(); |
| | | // } |
| | | // } |
| | | }); |
| | | return { |
| | | prefixCls, |
| | | openQianKun, |
| | | getOpenPageLoading, |
| | | getLayoutContentMode, |
| | | getPageLoading, |
| | | }; |
| | | }, |
| | | }); |
| | | import { defineComponent, onMounted } from 'vue' |
| | | import PageLayout from '/@/layouts/page/index.vue' |
| | | import { useDesign } from '/@/hooks/web/useDesign' |
| | | import { useRootSetting } from '/@/hooks/setting/useRootSetting' |
| | | import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting' |
| | | import { useContentViewHeight } from './useContentViewHeight' |
| | | // import registerApps from '/@/qiankun'; |
| | | import { useGlobSetting } from '/@/hooks/setting' |
| | | export default defineComponent({ |
| | | name: 'LayoutContent', |
| | | components: { PageLayout }, |
| | | setup() { |
| | | const { prefixCls } = useDesign('layout-content') |
| | | const { getOpenPageLoading } = useTransitionSetting() |
| | | const { getLayoutContentMode, getPageLoading } = useRootSetting() |
| | | const globSetting = useGlobSetting() |
| | | const openQianKun = globSetting.openQianKun |
| | | useContentViewHeight() |
| | | onMounted(() => { |
| | | // //注册openQianKun |
| | | // if (openQianKun == 'true') { |
| | | // if (!window.qiankunStarted) { |
| | | // window.qiankunStarted = true; |
| | | // registerApps(); |
| | | // } |
| | | // } |
| | | }) |
| | | return { |
| | | prefixCls, |
| | | openQianKun, |
| | | getOpenPageLoading, |
| | | getLayoutContentMode, |
| | | getPageLoading, |
| | | } |
| | | }, |
| | | }) |
| | | </script> |
| | | <style lang="less"> |
| | | @prefix-cls: ~'@{namespace}-layout-content'; |
| | | @prefix-cls: ~'@{namespace}-layout-content'; |
| | | |
| | | .@{prefix-cls} { |
| | | position: relative; |
| | | flex: 1 1 auto; |
| | | min-height: 0; |
| | | .@{prefix-cls} { |
| | | position: relative; |
| | | flex: 1 1 auto; |
| | | min-height: 0; |
| | | overflow: scroll; |
| | | &.fixed { |
| | | width: 1200px; |
| | | margin: 0 auto; |
| | | } |
| | | |
| | | &.fixed { |
| | | width: 1200px; |
| | | margin: 0 auto; |
| | | } |
| | | |
| | | &-loading { |
| | | position: absolute; |
| | | top: 200px; |
| | | z-index: @page-loading-z-index; |
| | | } |
| | | } |
| | | &-loading { |
| | | position: absolute; |
| | | top: 200px; |
| | | z-index: @page-loading-z-index; |
| | | } |
| | | } |
| | | </style> |