内容提交

longyvfengyun

2023-06-16 57c62fa61d720efcf3590da31ba0834a81668ef4

内容提交

 src/router/routes.js

@@ -1,24 +1,31 @@
export default [
  {
    path: "/",
    name: "home",
    component: () => import('../views/home/index.vue')
    name: "mainLayout",
    component: () => import('../views/mainLayout/index.vue'),
    children: [
      {
        path: "customer",
        name: 'customerMenu',
        children: [
          {
            path: "customer",
            name: "customer",
            component: () => import('../views/customer/customer.vue')
          },
        ],
      },
      {
        path: '/:pathMatch(.*)*',
        name: "",
        component: () => import('../views/404.vue')
      },
    ]
  },
  {
    path: "/login",
    name: "login",
    component: () => import('../views/login/index.vue')
  },
  {
    path: "/customer",
    name: 'customerMenu',
    children: [
      {
        path: "customer",
        name: "customer",
        component: () => import('../views/customer/customer.vue')
      },
    ],
  },
  {
    path: '/:pathMatch(.*)*',

 src/views/home/index.vue

@@ -1,23 +1,9 @@
<script setup>
import FlexLayout from "@/components/FlexLayout.vue";
import SlideMenu from "@/views/home/components/SlideMenu.vue";
import PageHeader from "@/views/home/components/PageHeader.vue";

</script>

<template>
    <flex-layout no-bg direction="row" bg-img>
        <template v-slot:header>
            <slide-menu></slide-menu>
        </template>
        <flex-layout no-bg>
            <template v-slot:header>
                <page-header></page-header>
            </template>
            <div class="page-content">
                <router-view></router-view>
            </div>
        </flex-layout>
    </flex-layout>

</template>

<style scoped>

 src/views/mainLayout/components/PageHeader.vue

File was renamed from src/views/home/components/PageHeader.vue
@@ -3,7 +3,7 @@
import FlexLayout from "@/components/FlexLayout.vue";
import {Expand, ArrowDown, ArrowUp, Avatar, Fold} from "@element-plus/icons-vue";
import usePageMenuStore from "@/store/usePageMenuStore";
import userDropdown from "@/views/home/js/userDropdown";
import userDropdown from "@/views/mainLayout/js/userDropdown";

const {isVisible, visibleChange, commandClick} = userDropdown();


 src/views/mainLayout/components/SlideMenu.vue

 src/views/mainLayout/index.vue

New file
@@ -0,0 +1,25 @@
<script setup>
import FlexLayout from "@/components/FlexLayout.vue";
import SlideMenu from "@/views/mainLayout/components/SlideMenu.vue";
import PageHeader from "@/views/mainLayout/components/PageHeader.vue";
</script>

<template>
    <flex-layout no-bg direction="row" bg-img>
        <template v-slot:header>
            <slide-menu></slide-menu>
        </template>
        <flex-layout no-bg>
            <template v-slot:header>
                <page-header></page-header>
            </template>
            <div class="page-content">
                <router-view></router-view>
            </div>
        </flex-layout>
    </flex-layout>
</template>

<style scoped>

</style>

 src/views/mainLayout/js/userDropdown.js