浏览代码

修改outaccount_status

huangbin 4 年之前
父节点
当前提交
3264b0220c
共有 3 个文件被更改,包括 59 次插入40 次删除
  1. 12 2
      src/layout/bottom.vue
  2. 34 4
      src/layout/index.vue
  3. 13 34
      src/layout/top.vue

+ 12 - 2
src/layout/bottom.vue

@@ -1,16 +1,18 @@
 <template>
   <section class="layout-bottom">
-    <CapitalInfo></CapitalInfo>
+    <CapitalInfo class="capital-info-container"></CapitalInfo>
+    <main>xx</main>
   </section>
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
 import SecondMenu from '@/components/secondeMenu/index.vue';
+import CapitalInfo from '@/components/capitalInfo/index.vue';
 
 export default defineComponent({
     name: 'layout-top',
     components: {
-        SecondMenu,
+        CapitalInfo,
     },
     setup() {
         return {};
@@ -19,5 +21,13 @@ export default defineComponent({
 </script>
 <style lang="less">
 .layout-bottom {
+    display: flex;
+    .capital-info-container {
+        width: 180px;
+    }
+    main {
+        flex: 1;
+        background: rgb(14, 14, 15);
+    }
 }
 </style>

+ 34 - 4
src/layout/index.vue

@@ -1,14 +1,27 @@
 <template>
   <div class="layout">
-    <LayoutTop />
-    <LayoutBottom />
+    <LayoutTop @chooseMenu="chooseMenu" />
+    <template v-if="isShowBottomPart">
+      <div class="sliderLayout">
+        <div class="shortLine"></div>
+      </div>
+      <LayoutBottom />
+    </template>
   </div>
 </template>
 <script lang="ts">
 import LayoutTop from './top.vue';
 import LayoutBottom from './bottom.vue';
+import { defineComponent, ref } from 'vue';
 
-import { defineComponent } from 'vue';
+// 控制下半部分是否显示
+function submitBottomIsShow() {
+    const isShowBottomPart = ref<boolean>(false);
+    function chooseMenu(value: boolean) {
+        isShowBottomPart.value = value;
+    }
+    return { isShowBottomPart, chooseMenu };
+}
 
 export default defineComponent({
     name: 'layout',
@@ -17,7 +30,8 @@ export default defineComponent({
         LayoutBottom,
     },
     setup() {
-        return {};
+        const { isShowBottomPart, chooseMenu } = submitBottomIsShow();
+        return { isShowBottomPart, chooseMenu };
     },
 });
 </script>
@@ -27,5 +41,21 @@ export default defineComponent({
     width: 100%;
     height: 100%;
     flex-direction: column;
+    .sliderLayout {
+        width: 100%;
+        height: 4px;
+        background: #242a2e;
+        border-top: 1px solid @m-grey5;
+        border-bottom: 1px solid @m-grey5;
+        position: relative;
+        .shortLine {
+            width: 30px;
+            height: 2px;
+            background: #4b5861;
+            border-radius: 1px;
+            .position(absolute, 50%, auto, auto, 50%);
+            transform: translate(-50%, -50%);
+        }
+    }
 }
 </style>

+ 13 - 34
src/layout/top.vue

@@ -77,18 +77,6 @@
         <router-view />
       </a-layout-content>
     </a-layout>
-    <div class="sliderLayout">
-      <div class="shortLine"></div>
-    </div>
-    <a-layout class="bottomLayout">
-      <a-layout-sider class="m-layout-left"
-                      width="180">
-        <!-- 这里左边需要加上资金信息 capital-info -->
-        <CapitalInfo></CapitalInfo>
-      </a-layout-sider>
-      <a-layout-content :style="{ background: '#0E0E0F', flex: 1 }">
-      </a-layout-content>
-    </a-layout>
   </a-layout>
 </template>
 <script lang="ts">
@@ -156,11 +144,11 @@ const setFn = () => {
     const chooseSetupItem = ref<string>('');
     provide('setting', chooseSetupItem);
     const setMenu = [
-        { name: '修改密码', path: 'password' },
-        { name: '收货地址', path: 'addresss' },
-        // {name: '发票', path: 'setup-password'},
-        { name: '手机号码绑定/解绑', path: 'phone' },
-        { name: '关于我们', path: 'aboutUs' },
+        // { name: '修改密码', path: 'password' },
+        // { name: '收货地址', path: 'addresss' },
+        // // {name: '发票', path: 'setup-password'},
+        // { name: '手机号码绑定/解绑', path: 'phone' },
+        // { name: '关于我们', path: 'aboutUs' },
         { name: '退出', path: 'logout' },
     ];
     function chooseSetMenu(path: string) {
@@ -178,6 +166,11 @@ const onSearch = () => {
     }
     return { search };
 };
+// 配置是否显示下半部分
+function setShowBottomPart(code: string): boolean {
+    const unShow = ['outaccount_status'];
+    return !unShow.includes(code);
+}
 export default defineComponent({
     name: 'layout-top',
     components: {
@@ -186,7 +179,7 @@ export default defineComponent({
         CapitalInfo,
         SecondMenu,
     },
-    setup() {
+    setup(props, context) {
         const { collapsed, selectedKeys, openKeys, menuList, collapse, menuClick, fontIcon } = handleMenu();
         const router = useRouter();
 
@@ -197,6 +190,7 @@ export default defineComponent({
                 const code = list[0].children[0].code;
                 selectedKeys.value = [code];
                 openKeys.value = [list[0].code];
+                context.emit('chooseMenu', setShowBottomPart(code));
                 router.push(code);
             }
         });
@@ -300,22 +294,7 @@ export default defineComponent({
             background: @m-black0;
         }
     }
-    .sliderLayout {
-        width: 100%;
-        height: 4px;
-        background: #242a2e;
-        border-top: 1px solid @m-grey5;
-        border-bottom: 1px solid @m-grey5;
-        position: relative;
-        .shortLine {
-            width: 30px;
-            height: 2px;
-            background: #4b5861;
-            border-radius: 1px;
-            .position(absolute, 50%, auto, auto, 50%);
-            transform: translate(-50%, -50%);
-        }
-    }
+
     .bottomLayout {
         width: 100%;
         flex: none;