huangbin 4 年之前
父节点
当前提交
2f5822f51e
共有 2 个文件被更改,包括 32 次插入23 次删除
  1. 4 2
      src/common/setup/order/orderData.ts
  2. 28 21
      src/layout/components/top.vue

+ 4 - 2
src/common/setup/order/orderData.ts

@@ -10,10 +10,9 @@ const orderList = ref<OperationTabMenu[]>([])
 
 // 选中的具体tab下的数据
 const recordItemTab = ref<OperationTabMenu[]>([])
-
+const isBottom = ref<boolean>(false)
 // 处理页面下半部分数据
 export function handleOrderData() {
-    const isBottom = ref<boolean>(false)
     const componentId = ref<enumOrderComponents>()
     initData(() => {
         const menuList = APP.getRef('menus');
@@ -30,6 +29,9 @@ export function handleOrderData() {
 
     return { isBottom, orderList, componentId }
 }
+export function getHasBottom() {
+    return isBottom
+}
 
 // 根据 code 获取单据对应子菜单配置数据
 export function handleOrderDetailList(code: enumOrderComponents) {

+ 28 - 21
src/layout/components/top.vue

@@ -1,25 +1,24 @@
 <template>
-    <a-layout class="layout-top">
-        <a-layout-header class="m-layout-header">
-            <Header />
-        </a-layout-header>
-        <a-layout class="middleLayout">
-            <a-layout-sider
-                class="m-layout-left"
-                width="180"
-                v-model:collapsed="collapsed"
-                @collapse="collapse"
-                collapsible
-            >
-                <Menu @chooseMenu="chooseMenu" :collapsed="collapsed" />
-            </a-layout-sider>
-            <a-layout-content :style="{ background: '#0E0E0F', flex: 1, }">
-                <!-- <Drawer :title="'挂牌'" :visible="visible"></Drawer> -->
-                <!-- <Main /> -->
-                <router-view />
-            </a-layout-content>
-        </a-layout>
+  <a-layout :class="['layout-top', isBottom ? 'layout-top-bottom' : 'layout-top-no-bottom']">
+    <a-layout-header class="m-layout-header">
+      <Header />
+    </a-layout-header>
+    <a-layout class="middleLayout">
+      <a-layout-sider class="m-layout-left"
+                      width="180"
+                      v-model:collapsed="collapsed"
+                      @collapse="collapse"
+                      collapsible>
+        <Menu @chooseMenu="chooseMenu"
+              :collapsed="collapsed" />
+      </a-layout-sider>
+      <a-layout-content :style="{ background: '#0E0E0F', flex: 1, }">
+        <!-- <Drawer :title="'挂牌'" :visible="visible"></Drawer> -->
+        <!-- <Main /> -->
+        <router-view />
+      </a-layout-content>
     </a-layout>
+  </a-layout>
 </template>
 <script lang="ts">
 import { defineComponent, ref, provide } from 'vue';
@@ -32,6 +31,7 @@ import Header from './header.vue';
 import Menu from './menu.vue';
 import Main from './main.vue';
 import { OperationTabMenu } from '@/services/go/commonService/interface';
+import { getHasBottom } from '@/common/setup/order/orderData';
 
 export default defineComponent({
     name: 'layout-top',
@@ -54,6 +54,7 @@ export default defineComponent({
             const show: string[] = [''];
             context.emit('chooseMenu', show.includes(code));
         }
+        const isBottom = getHasBottom();
         // 选中菜单
         function chooseMenu(value: OperationTabMenu) {
             const matched = route.matched;
@@ -110,15 +111,21 @@ export default defineComponent({
             collapsed,
             collapse,
             chooseMenu,
+            isBottom,
         };
     },
 });
 </script>
 <style lang="less">
+.layout-top-no-bottom {
+    height: 100%;
+}
+.layout-top-bottom {
+    height: calc(100vh - 336px);
+}
 .layout-top {
     .flex;
     width: 100%;
-    height: calc(100vh - 336px);
     flex-direction: column;
     .m-layout-header {
         width: 100%;