回款详情样式优化

src/views/home/index.vue

-<template>
-  <div class="white_bg burt-container">
-    <img src="../../assets/image/home_bg.jpg" alt="">
-  </div>
-</template>
-
-<script>
-export default{
-  data(){
-    return{
-
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.burt-container{
-  height: calc(100vh - 116px);
-  padding: 0;
-  img{
-    width: 100%;
-    height: 100%;
-    object-fit: contain;
-  }
-}
+<template>
+  <div class="white_bg burt-container">
+    <img src="../../assets/image/home_bg.jpg" alt="">
+  </div>
+</template>
+
+<script>
+export default{
+  data(){
+    return{
+
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.burt-container{
+  height: calc(100vh - 86px);
+  padding: 0;
+  img{
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+}
 </style>
\ No newline at end of file

src/views/layout/components/menu/subMenu.vue

-<template>
-  <div class="sub-menu">
-    <router-link
-      tag="button"
-      :class="{ btn: true, 'btn-active': isVisit(item.path) }"
-      v-for="(item, index) in menuStack"
-      :key="item.path"
-      :to="item.path"
-    >
-      {{ item.title }}
-      <Icon v-if="menuStack.length>1"
-        @click="(e)=>closeMenu(e, index)"
-        :name="isVisit(item.path) ? 'ssiclose_active' : 'ssiclose'"
-        :size="16"
-      />
-    </router-link>
-    <slot name="tips" />
-  </div>
-</template>
-
-<script>
-import { mapState } from "vuex";
-export default {
-  computed: {
-    ...mapState({
-      menuStack: (state) => state.common.menuStack,
-    }),
-  },
-  methods: {
-    isVisit(val) {
-      const path = this.$route.path;
-      return path === val;
-    },
-    closeMenu(e, index) {
-      e.stopPropagation();
-      const menuStack = JSON.parse(JSON.stringify(this.menuStack));
-      const isVisit = this.isVisit(menuStack[index].path);
-      menuStack.splice(index, 1);
-      this.$store.commit("common/setMenuStack", menuStack);
-      if (isVisit) {
-        // 关闭的是当前正在查看的
-        const i = Math.max(0, index - 1);
-        this.$router.push(menuStack[i].path || "/");
-      }
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.sub-menu {
-  width: 100%;
-  overflow-x: auto;
-  white-space: nowrap;
-  .mg-b(16);
-  .btn {
-    .fs(14);
-    .lh(20);
-    .pa(8, 13, 8, 13);
-    .mg-r(40);
-    color: #252631;
-    font-weight: bold;
-    border: none;
-    background-color: #fff;
-    border-radius: 5px;
-    cursor: pointer;
-  }
-  .btn-active {
-    color: #fff;
-    background-color: #2b63ff;
-  }
-}
-</style>

src/views/layout/index.vue

-<template>
-  <div class="menu-layout">
-    <Header></Header>
-    <div class="container">
-      <Menu></Menu>
-      <Loading />
-      <div class="content">
-        <SubMenu></SubMenu>
-        <router-view />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import Header from "./components/Header.vue";
-import Menu from "./components/menu";
-import SubMenu from "./components/menu/subMenu.vue";
-import Loading from "@/components/Loading/Loading.vue";
-
-export default {
-  components: {
-    Header,
-    Menu,
-    SubMenu,
-    Loading
-  },
-  data() {
-    return {};
-  },
-
-  created() {},
-  mounted() {},
-  methods: {},
-};
-</script>
-
-<style>
- .icon-class.arrow{
-  position: absolute;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-}
-</style>
-<style lang="less" scoped>
-.menu-layout {
-  background-color: #f8fafb;
-  font-family: "Helvetica" "Microsoft YaHei" "微软雅黑";
-  .container {
-    display: flex;
-    position: relative;
-    .pt(68);
-    // min-height: calc(100vh - 50px);
-    .content {
-      position: relative;
-      flex: 1;
-      .mg-l(242);
-      .pa(14, 40, 0, 40);
-      min-height: calc(100vh - 68px);
-      overflow-x: hidden;
-    }
-  }
-  .menu {
-    position: fixed;
-    .w(242);
-    height: calc(100vh - 68px);
-    overflow: auto;
-    background-color: #fff;
-    li{
-      position: relative;
-    }
-  }
-}
-</style>
+<template>
+  <div class="menu-layout">
+    <Header></Header>
+    <div class="container">
+      <Menu></Menu>
+      <Loading />
+      <div class="content">
+        <router-view />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Header from "./components/Header.vue";
+import Menu from "./components/menu";
+import Loading from "@/components/Loading/Loading.vue";
+
+export default {
+  components: {
+    Header,
+    Menu,
+    Loading
+  },
+  data() {
+    return {};
+  },
+
+  created() {},
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style>
+ .icon-class.arrow{
+  position: absolute;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%);
+}
+</style>
+<style lang="less" scoped>
+.menu-layout {
+  background-color: #f8fafb;
+  font-family: "Helvetica" "Microsoft YaHei" "微软雅黑";
+  .container {
+    display: flex;
+    position: relative;
+    .pt(68);
+    // min-height: calc(100vh - 50px);
+    .content {
+      position: relative;
+      flex: 1;
+      .mg-l(242);
+      .pa(14, 40, 0, 40);
+      min-height: calc(100vh - 68px);
+      overflow-x: hidden;
+    }
+  }
+  .menu {
+    position: fixed;
+    .w(242);
+    height: calc(100vh - 68px);
+    overflow: auto;
+    background-color: #fff;
+    li{
+      position: relative;
+    }
+  }
+}
+</style>