0099

2023-06-05 21:02:25 +08:00
parent bdbda8b68e
commit d778ceab61
41 changed files with 1259 additions and 94 deletions
--- a/cdTMP/.eslintrc.cjs
+++ b/cdTMP/.eslintrc.cjs
@@ -3,10 +3,19 @@ module.exports = {
        browser: true,
        es2015: true
    },
-    extends: ["eslint:recommended", "plugin:vue/vue3-essential", "plugin:prettier/recommended"],
+    extends: [
+        "eslint:recommended",
+        "plugin:vue/vue3-essential",
+        "plugin:prettier/recommended",
+        "@vue/typescript/recommended",
+        "plugin:@typescript-eslint/recommended"
+    ],
    parserOptions: {
-        ecmaVersion: "latest",
-        sourceType: "module"
+        sourceType: "module",
+        ecmaVersion: 2020,
+        ecmaFeatures: {
+            jsx: true
+        }
    },
    plugins: ["vue"],
    rules: {
--- a/cdTMP/babel.config.js
+++ b/cdTMP/babel.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+    plugins: ['@vue/babel-plugin-jsx'],
+}
--- a/cdTMP/package-lock.json
+++ b/cdTMP/package-lock.json
@@ -10,6 +10,7 @@
            "dependencies": {
                "@arco-design/color": "^0.4.0",
                "@arco-design/web-vue": "^2.46.2",
+                "@vueuse/core": "^10.1.2",
                "axios": "^1.4.0",
                "crypto-js": "^4.1.1",
                "dayjs": "^1.11.7",
@@ -30,9 +31,12 @@
            },
            "devDependencies": {
                "@types/lodash": "^4.14.195",
+                "@types/node": "^20.2.5",
+                "@types/nprogress": "^0.2.0",
                "@types/qs": "^6.9.7",
                "@vitejs/plugin-vue": "^4.1.0",
                "@vitejs/plugin-vue-jsx": "^3.0.1",
+                "@vue/babel-plugin-jsx": "^1.1.1",
                "autoprefixer": "^10.4.14",
                "eslint": "^8.42.0",
                "eslint-plugin-vue": "^9.14.1",
@@ -1113,8 +1117,13 @@
            "version": "20.2.5",
            "resolved": "https://registry.npmmirror.com/@types/node/-/node-20.2.5.tgz",
            "integrity": "sha512-JJulVEQXmiY9Px5axXHeYGLSjhkZEnD+MDPDGbCbIAbMslkKwmygtZFy1X6s/075Yo94sf8GuSlFfPzysQrWZQ==",
-            "dev": true,
-            "peer": true
+            "dev": true
+        },
+        "node_modules/@types/nprogress": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmmirror.com/@types/nprogress/-/nprogress-0.2.0.tgz",
+            "integrity": "sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A==",
+            "dev": true
        },
        "node_modules/@types/qs": {
            "version": "6.9.7",
@@ -1122,6 +1131,11 @@
            "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==",
            "dev": true
        },
+        "node_modules/@types/web-bluetooth": {
+            "version": "0.0.17",
+            "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.17.tgz",
+            "integrity": "sha512-4p9vcSmxAayx72yn70joFoL44c9MO/0+iVEBIQXe3v2h2SiAsEIo/G5v6ObFWvNKRFjbrVadNf9LqEEZeQPzdA=="
+        },
        "node_modules/@vitejs/plugin-vue": {
            "version": "4.2.3",
            "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-4.2.3.tgz",
@@ -1283,6 +1297,74 @@
            "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.3.4.tgz",
            "integrity": "sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ=="
        },
+        "node_modules/@vueuse/core": {
+            "version": "10.1.2",
+            "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-10.1.2.tgz",
+            "integrity": "sha512-roNn8WuerI56A5uiTyF/TEYX0Y+VKlhZAF94unUfdhbDUI+NfwQMn4FUnUscIRUhv3344qvAghopU4bzLPNFlA==",
+            "dependencies": {
+                "@types/web-bluetooth": "^0.0.17",
+                "@vueuse/metadata": "10.1.2",
+                "@vueuse/shared": "10.1.2",
+                "vue-demi": ">=0.14.0"
+            }
+        },
+        "node_modules/@vueuse/core/node_modules/vue-demi": {
+            "version": "0.14.5",
+            "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.5.tgz",
+            "integrity": "sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==",
+            "hasInstallScript": true,
+            "bin": {
+                "vue-demi-fix": "bin/vue-demi-fix.js",
+                "vue-demi-switch": "bin/vue-demi-switch.js"
+            },
+            "engines": {
+                "node": ">=12"
+            },
+            "peerDependencies": {
+                "@vue/composition-api": "^1.0.0-rc.1",
+                "vue": "^3.0.0-0 || ^2.6.0"
+            },
+            "peerDependenciesMeta": {
+                "@vue/composition-api": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@vueuse/metadata": {
+            "version": "10.1.2",
+            "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-10.1.2.tgz",
+            "integrity": "sha512-3mc5BqN9aU2SqBeBuWE7ne4OtXHoHKggNgxZR2K+zIW4YLsy6xoZ4/9vErQs6tvoKDX6QAqm3lvsrv0mczAwIQ=="
+        },
+        "node_modules/@vueuse/shared": {
+            "version": "10.1.2",
+            "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-10.1.2.tgz",
+            "integrity": "sha512-1uoUTPBlgyscK9v6ScGeVYDDzlPSFXBlxuK7SfrDGyUTBiznb3mNceqhwvZHjtDRELZEN79V5uWPTF1VDV8svA==",
+            "dependencies": {
+                "vue-demi": ">=0.14.0"
+            }
+        },
+        "node_modules/@vueuse/shared/node_modules/vue-demi": {
+            "version": "0.14.5",
+            "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.5.tgz",
+            "integrity": "sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==",
+            "hasInstallScript": true,
+            "bin": {
+                "vue-demi-fix": "bin/vue-demi-fix.js",
+                "vue-demi-switch": "bin/vue-demi-switch.js"
+            },
+            "engines": {
+                "node": ">=12"
+            },
+            "peerDependencies": {
+                "@vue/composition-api": "^1.0.0-rc.1",
+                "vue": "^3.0.0-0 || ^2.6.0"
+            },
+            "peerDependenciesMeta": {
+                "@vue/composition-api": {
+                    "optional": true
+                }
+            }
+        },
        "node_modules/@webassemblyjs/ast": {
            "version": "1.11.6",
            "resolved": "https://registry.npmmirror.com/@webassemblyjs/ast/-/ast-1.11.6.tgz",
--- a/cdTMP/package.json
+++ b/cdTMP/package.json
@@ -12,6 +12,7 @@
    "dependencies": {
        "@arco-design/color": "^0.4.0",
        "@arco-design/web-vue": "^2.46.2",
+        "@vueuse/core": "^10.1.2",
        "axios": "^1.4.0",
        "crypto-js": "^4.1.1",
        "dayjs": "^1.11.7",
@@ -32,9 +33,12 @@
    },
    "devDependencies": {
        "@types/lodash": "^4.14.195",
+        "@types/node": "^20.2.5",
+        "@types/nprogress": "^0.2.0",
        "@types/qs": "^6.9.7",
        "@vitejs/plugin-vue": "^4.1.0",
        "@vitejs/plugin-vue-jsx": "^3.0.1",
+        "@vue/babel-plugin-jsx": "^1.1.1",
        "autoprefixer": "^10.4.14",
        "eslint": "^8.42.0",
        "eslint-plugin-vue": "^9.14.1",
--- a/cdTMP/src/api/login.js
+++ b/cdTMP/src/api/login.js
@@ -0,0 +1,53 @@
+import { request } from "@/api/request"
+
+export default {
+    /**
+     * 获取验证码
+     * @returns
+     */
+    getCaptch() {
+        return request({
+            url: "system/captcha",
+            method: "get"
+        })
+    },
+
+    /**
+     * 用户登录
+     * @param {object} params
+     * @returns
+     */
+    login(params = {}) {
+        return request({
+            url: "system/login",
+            method: "post",
+            data: params
+        })
+    },
+
+    /**
+     * 用户退出
+     * @param {object} params
+     * @returns
+     */
+    logout(params = {}) {
+        return request({
+            url: "system/logout",
+            method: "post",
+            data: params
+        })
+    },
+
+    /**
+     * 获取登录用户信息
+     * @param {object} params
+     * @returns
+     */
+    getInfo(params = {}) {
+        return request({
+            url: "system/getInfo",
+            method: "get",
+            data: params
+        })
+    }
+}
--- a/cdTMP/src/assets/img/avatar.jpg
+++ b/cdTMP/src/assets/img/avatar.jpg
--- a/cdTMP/src/config/setting.json
+++ b/cdTMP/src/config/setting.json
@@ -0,0 +1,17 @@
+{
+    "theme": "light",
+    "colorWeak": false,
+    "navbar": true,
+    "menu": true,
+    "topMenu": false,
+    "hideMenu": false,
+    "menuCollapse": false,
+    "footer": true,
+    "themeColor": "#165DFF",
+    "menuWidth": 220,
+    "globalSettings": false,
+    "device": "desktop",
+    "tabBar": true,
+    "menuFromServer": false,
+    "serverMenu": []
+}
--- a/cdTMP/src/env.d.ts
+++ b/cdTMP/src/env.d.ts
@@ -0,0 +1 @@
+declare module "@arco-design/web-vue/dist/arco-vue-icon"
--- a/cdTMP/src/hooks/logout.js
+++ b/cdTMP/src/hooks/logout.js
@@ -0,0 +1,24 @@
+import { useRouter } from 'vue-router'
+import { Message } from '@arco-design/web-vue'
+
+import { useUserStore } from '@/store'
+
+export default function useUser() {
+    const router = useRouter()
+    const userStore = useUserStore()
+    const logout = async (logoutTo) => {
+        await userStore.logout()
+        const currentRoute = router.currentRoute.value
+        Message.success('登出成功')
+        router.push({
+            name: logoutTo && typeof logoutTo === 'string' ? logoutTo : 'login',
+            query: {
+                ...router.currentRoute.value.query,
+                redirect: currentRoute.name,
+            },
+        })
+    }
+    return {
+        logout,
+    }
+}
--- a/cdTMP/src/hooks/permission.js
+++ b/cdTMP/src/hooks/permission.js
@@ -0,0 +1,33 @@
+import { useUserStore } from "@/store"
+
+export default function usePermission() {
+    const userStore = useUserStore()
+    return {
+        // 返回的函数可自定义路由权限
+        accessRouter(route) {
+            return (
+                !route.meta?.requiresAuth ||
+                !route.meta?.roles ||
+                route.meta?.roles?.includes("*") ||
+                route.meta?.roles?.includes(userStore.role)
+            )
+        },
+        findFirstPermissionRoute(_routers, role = "admin") {
+            const cloneRouters = [..._routers]
+            while (cloneRouters.length) {
+                const firstElement = cloneRouters.shift()
+                if (
+                    firstElement?.meta?.roles?.find((el) => {
+                        return el.includes("*") || el.includes(role)
+                    })
+                )
+                    return { name: firstElement.name }
+                if (firstElement?.children) {
+                    cloneRouters.push(...firstElement.children)
+                }
+            }
+            return null
+        }
+        // 你可以添加任何规则
+    }
+}
--- a/cdTMP/src/layout/components/menu.vue
+++ b/cdTMP/src/layout/components/menu.vue
@@ -0,0 +1,146 @@
+<script lang="jsx">
+import { defineComponent, ref, h, compile, computed } from "vue"
+import { useRoute, useRouter } from "vue-router"
+import { useAppStore } from "@/store"
+import { listenerRouteChange } from "@/utils/route-listener"
+import { openWindow, regexUrl } from "@/utils"
+import useMenuTree from "./use-menu-tree"
+
+export default defineComponent({
+    emit: ["collapse"],
+    setup() {
+        const appStore = useAppStore()
+        const router = useRouter()
+        const route = useRoute()
+        const { menuTree } = useMenuTree()
+        const collapsed = computed({
+            get() {
+                if (appStore.device === "desktop") return appStore.menuCollapse
+                return false
+            },
+            set(value) {
+                appStore.updateSettings({ menuCollapse: value })
+            }
+        })
+
+        const topMenu = computed(() => appStore.topMenu)
+        const openKeys = ref([])
+        const selectedKey = ref([])
+
+        const goto = (item) => {
+            // Open external link
+            if (regexUrl.test(item.path)) {
+                openWindow(item.path)
+                selectedKey.value = [item.name]
+                return
+            }
+            // Eliminate external link side effects
+            const { hideInMenu, activeMenu } = item.meta
+            if (route.name === item.name && !hideInMenu && !activeMenu) {
+                selectedKey.value = [item.name]
+                return
+            }
+            // Trigger router change
+            router.push({
+                name: item.name
+            })
+        }
+        const findMenuOpenKeys = (target) => {
+            const result = []
+            let isFind = false
+            const backtrack = (item, keys) => {
+                if (item.name === target) {
+                    isFind = true
+                    result.push(...keys)
+                    return
+                }
+                if (item.children?.length) {
+                    item.children.forEach((el) => {
+                        backtrack(el, [...keys, el.name])
+                    })
+                }
+            }
+            menuTree.value.forEach((el) => {
+                if (isFind) return // Performance optimization
+                backtrack(el, [el.name])
+            })
+            return result
+        }
+        listenerRouteChange((newRoute) => {
+            const { requiresAuth, activeMenu, hideInMenu } = newRoute.meta
+            if (requiresAuth && (!hideInMenu || activeMenu)) {
+                const menuOpenKeys = findMenuOpenKeys(activeMenu || newRoute.name)
+
+                const keySet = new Set([...menuOpenKeys, ...openKeys.value])
+                openKeys.value = [...keySet]
+
+                selectedKey.value = [activeMenu || menuOpenKeys[menuOpenKeys.length - 1]]
+            }
+        }, true)
+        const setCollapse = (val) => {
+            if (appStore.device === "desktop") appStore.updateSettings({ menuCollapse: val })
+        }
+
+        const renderSubMenu = () => {
+            function travel(_route, nodes = []) {
+                if (_route) {
+                    _route.forEach((element) => {
+                        // This is demo, modify nodes as needed
+                        const icon = element?.meta?.icon ? () => h(compile(`<${element?.meta?.icon}/>`)) : null
+                        const node =
+                            element?.children && element?.children.length !== 0 ? (
+                                <a-sub-menu
+                                    key={element?.name}
+                                    v-slots={{
+                                        icon,
+                                        title: () => h(compile(element?.meta?.locale || ""))
+                                    }}
+                                >
+                                    {travel(element?.children)}
+                                </a-sub-menu>
+                            ) : (
+                                <a-menu-item key={element?.name} v-slots={{ icon }} onClick={() => goto(element)}>
+                                    {element?.meta?.locale || ""}
+                                </a-menu-item>
+                            )
+                        nodes.push(node)
+                    })
+                }
+                return nodes
+            }
+            return travel(menuTree.value)
+        }
+
+        return () => (
+            <a-menu
+                mode={topMenu.value ? "horizontal" : "vertical"}
+                v-model:collapsed={collapsed.value}
+                v-model:open-keys={openKeys.value}
+                show-collapse-button={appStore.device !== "mobile"}
+                auto-open={false}
+                selected-keys={selectedKey.value}
+                auto-open-selected={true}
+                level-indent={34}
+                style="height: 100%;width:100%;"
+                onCollapse={setCollapse}
+            >
+                {renderSubMenu()}
+            </a-menu>
+        )
+    }
+})
+</script>
+
+<style lang="less" scoped>
+:deep(.arco-menu-inner) {
+    .arco-menu-inline-header {
+        display: flex;
+        align-items: center;
+    }
+    .arco-icon {
+        &:not(.arco-icon-down) {
+            font-size: 18px;
+        }
+    }
+}
+</style>
--- a/cdTMP/src/layout/components/navbar.vue
+++ b/cdTMP/src/layout/components/navbar.vue
@@ -0,0 +1,207 @@
+<template>
+    <div class="navbar">
+        <div class="left-side">
+            <a-space>
+                <img src="@/assets/img/wxwx-logo.svg" class="logo" alt="logo" />
+                <a-typography-title :style="{ margin: 0, fontSize: '18px' }" :heading="5">
+                    成都测试管理平台
+                </a-typography-title>
+                <icon-menu-fold
+                    v-if="!topMenu && appStore.device === 'mobile'"
+                    style="font-size: 22px; cursor: pointer"
+                    @click="toggleDrawerMenu"
+                />
+            </a-space>
+        </div>
+        <div class="center-side">
+            <Menu v-if="topMenu"></Menu>
+        </div>
+        <ul class="right-side">
+            <li>
+                <a-tooltip content="搜索-暂无">
+                    <a-button class="nav-btn" type="outline" :shape="'circle'">
+                        <template #icon>
+                            <icon-search />
+                        </template>
+                    </a-button>
+                </a-tooltip>
+            </li>
+            <li>
+                <a-tooltip content="语言-暂无">
+                    <a-button class="nav-btn" type="outline" :shape="'circle'">
+                        <template #icon>
+                            <icon-language />
+                        </template>
+                    </a-button>
+                </a-tooltip>
+                <!-- 这里有个下拉列表 -->
+            </li>
+            <li>
+                <a-tooltip content="切换主题-暂无">
+                    <a-button class="nav-btn" type="outline" :shape="'circle'">
+                        <template #icon>
+                            <icon-moon-fill />
+                        </template>
+                    </a-button>
+                </a-tooltip>
+            </li>
+            <li>
+                <a-tooltip :content="isFullscreen ? '退出全屏' : '进入全屏'">
+                    <a-button class="nav-btn" type="outline" :shape="'circle'" @click="toggleFullScreen">
+                        <template #icon>
+                            <icon-fullscreen-exit v-if="isFullscreen" />
+                            <icon-fullscreen v-else />
+                        </template>
+                    </a-button>
+                </a-tooltip>
+            </li>
+            <li>
+                <a-tooltip content="设置">
+                    <a-button class="nav-btn" type="outline" :shape="'circle'" @click="setVisible">
+                        <template #icon>
+                            <icon-settings />
+                        </template>
+                    </a-button>
+                </a-tooltip>
+            </li>
+            <li>
+                <a-dropdown trigger="click">
+                    <a-avatar :size="32" :style="{ marginRight: '8px', cursor: 'pointer' }">
+                        <img alt="avatar" src="@/assets/img/avatar.jpg" />
+                    </a-avatar>
+                    <template #content>
+                        <a-doption>
+                            <a-space @click="switchRoles">
+                                <icon-tag />
+                                <span> 切换角色 </span>
+                            </a-space>
+                        </a-doption>
+                        <a-doption>
+                            <a-space @click="$router.push({ name: 'Info' })">
+                                <icon-user />
+                                <span> 用户中心 </span>
+                            </a-space>
+                        </a-doption>
+                        <a-doption>
+                            <a-space @click="$router.push({ name: 'Setting' })">
+                                <icon-settings />
+                                <span> 用户设置 </span>
+                            </a-space>
+                        </a-doption>
+                        <a-doption>
+                            <a-space @click="handleLogout">
+                                <icon-export />
+                                <span> 退出登录 </span>
+                            </a-space>
+                        </a-doption>
+                    </template>
+                </a-dropdown>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script setup>
+import { computed, inject } from "vue"
+import { useAppStore } from "@/store"
+import { useFullscreen } from "@vueuse/core"
+// 这个hook就是退出登录跳转的
+import useUser from "@/hooks/logout"
+import { Message } from "@arco-design/web-vue"
+import Menu from "@/layout/components/menu.vue"
+const appStore = useAppStore()
+// 是否menu在顶部-暂时不用
+const topMenu = computed(() => appStore.topMenu && appStore.menu)
+// 全屏设置,使用了@vueuse/core
+const { isFullscreen, toggle: toggleFullScreen } = useFullscreen()
+// appStore里面设置
+const setVisible = () => {
+    console.log("在appStore里面设置全局{ globalSettings: true }，暂无做")
+    appStore.updateSettings({ globalSettings: true })
+}
+// 右上角下拉
+const setDropDownVisible = () => {
+    const event = new MouseEvent("click", {
+        view: window,
+        bubbles: true,
+        cancelable: true
+    })
+    triggerBtn.value.dispatchEvent(event)
+}
+/// 切换角色
+const switchRoles = async () => {
+    Message.success("模拟切换角色")
+}
+/// 退出登录
+const { logout } = useUser()
+const handleLogout = () => {
+    logout()
+}
+// 注入事件
+const toggleDrawerMenu = inject("toggleDrawerMenu")
+</script>
+
+<style scoped lang="less">
+.logo {
+    width: 35px;
+    height: 35px;
+}
+
+.navbar {
+    display: flex;
+    justify-content: space-between;
+    height: 100%;
+    background-color: var(--color-bg-2);
+    border-bottom: 1px solid var(--color-border);
+}
+
+.left-side {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+}
+
+.center-side {
+    flex: 1;
+}
+
+.right-side {
+    display: flex;
+    padding-right: 20px;
+    list-style: none;
+    :deep(.locale-select) {
+        border-radius: 20px;
+    }
+    li {
+        display: flex;
+        align-items: center;
+        padding: 0 10px;
+    }
+
+    a {
+        color: var(--color-text-1);
+        text-decoration: none;
+    }
+    .nav-btn {
+        border-color: rgb(var(--gray-2));
+        color: rgb(var(--gray-8));
+        font-size: 16px;
+    }
+    .trigger-btn,
+    .ref-btn {
+        position: absolute;
+        bottom: 14px;
+    }
+    .trigger-btn {
+        margin-left: 14px;
+    }
+}
+</style>
+
+<style lang="less">
+.message-popover {
+    .arco-popover-content {
+        margin-top: 0;
+    }
+}
+</style>
--- a/cdTMP/src/layout/components/tab-bar.vue
+++ b/cdTMP/src/layout/components/tab-bar.vue
@@ -0,0 +1,90 @@
+<template>
+    <div class="tab-bar-container">
+        <a-affix ref="affixRef" :offset-top="offsetTop">
+            <div class="tab-bar-box">
+                <div class="tab-bar-scroll">
+                    <div class="tags-wrap">
+                        <tab-item v-for="(tag, index) in tagList" :key="tag.fullPath" :index="index" :item-data="tag" />
+                    </div>
+                </div>
+                <div class="tag-bar-operation"></div>
+            </div>
+        </a-affix>
+    </div>
+</template>
+
+<script lang="ts" setup>
+    import { ref, computed, watch, onUnmounted } from 'vue'
+    import type { RouteLocationNormalized } from 'vue-router'
+    import { listenerRouteChange, removeRouteListener } from '@/utils/route-listener'
+    import { useAppStore, useTabBarStore } from '@/store'
+    import tabItem from './tab-item.vue'
+
+    const appStore = useAppStore()
+    const tabBarStore = useTabBarStore()
+
+    const affixRef = ref()
+    const tagList = computed(() => {
+        return tabBarStore.getTabList
+    })
+    const offsetTop = computed(() => {
+        return appStore.navbar ? 60 : 0
+    })
+
+    watch(
+        () => appStore.navbar,
+        () => {
+            affixRef.value.updatePosition()
+        }
+    )
+    listenerRouteChange((route) => {
+        if (!route.meta.noAffix && !tagList.value.some((tag) => tag.fullPath === route.fullPath)) {
+            tabBarStore.updateTabList(route)
+        }
+    }, true)
+
+    onUnmounted(() => {
+        removeRouteListener()
+    })
+</script>
+
+<style scoped lang="less">
+    .tab-bar-container {
+        position: relative;
+        background-color: var(--color-bg-2);
+        .tab-bar-box {
+            display: flex;
+            padding: 0 0 0 20px;
+            background-color: var(--color-bg-2);
+            border-bottom: 1px solid var(--color-border);
+            .tab-bar-scroll {
+                height: 32px;
+                flex: 1;
+                overflow: hidden;
+                .tags-wrap {
+                    padding: 4px 0;
+                    height: 48px;
+                    white-space: nowrap;
+                    overflow-x: auto;
+
+                    :deep(.arco-tag) {
+                        display: inline-flex;
+                        align-items: center;
+                        margin-right: 6px;
+                        cursor: pointer;
+                        &:first-child {
+                            .arco-tag-close-btn {
+                                display: none;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        .tag-bar-operation {
+            width: 100px;
+            height: 32px;
+        }
+    }
+</style>
--- a/cdTMP/src/layout/components/use-menu-tree.js
+++ b/cdTMP/src/layout/components/use-menu-tree.js
@@ -0,0 +1,66 @@
+import { computed } from 'vue'
+import usePermission from '@/hooks/permission'
+import { useAppStore } from '@/store'
+import appClientMenus from '@/router/app-menus'
+import { cloneDeep } from 'lodash'
+
+export default function useMenuTree() {
+    const permission = usePermission()
+    const appStore = useAppStore()
+    const appRoute = computed(() => {
+        if (appStore.menuFromServer) {
+            return appStore.appAsyncMenus
+        }
+        return appClientMenus
+    })
+    const menuTree = computed(() => {
+        const copyRouter = cloneDeep(appRoute.value)
+        copyRouter.sort((a, b) => {
+            return 0 - 0
+        })
+        function travel(_routes, layer) {
+            if (!_routes) return null
+
+            const collector = _routes.map((element) => {
+                // no access
+                if (!permission.accessRouter(element)) {
+                    return null
+                }
+
+                // leaf node
+                if (element.meta?.hideChildrenInMenu || !element.children) {
+                    element.children = []
+                    return element
+                }
+
+                // route filter hideInMenu true
+                element.children = element.children.filter((x) => x.meta?.hideInMenu !== true)
+
+                // Associated child node
+                const subItem = travel(element.children, layer + 1)
+
+                if (subItem.length) {
+                    element.children = subItem
+                    return element
+                }
+                // the else logic
+                if (layer > 1) {
+                    element.children = subItem
+                    return element
+                }
+
+                if (element.meta?.hideInMenu === false) {
+                    return element
+                }
+
+                return null
+            })
+            return collector.filter(Boolean)
+        }
+        return travel(copyRouter, 0)
+    })
+
+    return {
+        menuTree,
+    }
+}
--- a/cdTMP/src/layout/default-layout.vue
+++ b/cdTMP/src/layout/default-layout.vue
@@ -0,0 +1,168 @@
+<template>
+    <a-layout class="layout" :class="{ mobile: appStore.hideMenu }">
+        <div class="navbar layout-navbar">
+            <NavBar />
+        </div>
+        <a-layout>
+            <a-layout>
+                <a-layout-sider
+                    v-if="renderMenu"
+                    v-show="!hideMenu"
+                    class="layout-sider"
+                    breakpoint="xl"
+                    :collapsed="collapsed"
+                    :collapsible="true"
+                    :width="menuWidth"
+                    :style="{ paddingTop: navbar ? '60px' : '' }"
+                    :hide-trigger="true"
+                    @collapse="setCollapsed"
+                >
+                    <div class="menu-wrapper">
+                        <Menu />
+                    </div>
+                </a-layout-sider>
+                <a-drawer
+                    v-if="hideMenu"
+                    :visible="drawerVisible"
+                    placement="left"
+                    :footer="false"
+                    mask-closable
+                    :closable="false"
+                    @cancel="drawerCancel"
+                >
+                    <Menu />
+                </a-drawer>
+                <a-layout class="layout-content" :style="paddingStyle">
+
+                </a-layout>
+            </a-layout>
+        </a-layout>
+    </a-layout>
+</template>
+
+<script setup>
+import { ref, computed, watch, provide, onMounted } from "vue"
+import { useAppStore, useUserStore } from "@/store"
+import NavBar from "@/layout/components/navbar.vue"
+import Menu from "@/layout/components/menu.vue"
+import usePermission from "@/hooks/permission"
+const appStore = useAppStore()
+const userStore = useUserStore()
+const permission = usePermission()
+// 初始化数据
+const isInit = ref(false)
+// 是否渲染左侧菜单
+const renderMenu = computed(() => appStore.menu && !appStore.topMenu)
+const hideMenu = computed(() => appStore.hideMenu)
+// 菜单收缩
+const collapsed = computed(() => {
+    return appStore.menuCollapse
+})
+const setCollapsed = (val) => {
+    if (!isInit.value) return // 针对页面初始化菜单状态问题
+    appStore.updateSettings({ menuCollapse: val })
+}
+// 菜单宽度
+const menuWidth = computed(() => {
+    return appStore.menuCollapse ? 48 : appStore.menuWidth
+})
+// 角色监控
+watch(
+    () => userStore.role,
+    (roleValue) => {
+        if (roleValue && !permission.accessRouter(route)) router.push({ name: "notFound" })
+    }
+)
+// 缩小后的menu菜单
+const drawerVisible = ref(false)
+const drawerCancel = () => {
+    drawerVisible.value = false
+}
+provide("toggleDrawerMenu", () => {
+    drawerVisible.value = !drawerVisible.value
+})
+// 确认加载完毕
+onMounted(() => {
+    isInit.value = true
+})
+// 右侧内容区padding的响应式
+const navbar = computed(() => appStore.navbar)
+const navbarHeight = `60px`
+const paddingStyle = computed(() => {
+    const paddingLeft = renderMenu.value && !hideMenu.value ? { paddingLeft: `${menuWidth.value}px` } : {}
+    const paddingTop = navbar.value ? { paddingTop: navbarHeight } : {}
+    return { ...paddingLeft, ...paddingTop }
+})
+</script>
+
+<style scoped lang="less">
+@nav-size-height: 60px;
+@layout-max-width: 1100px;
+
+.layout {
+    width: 100%;
+    height: 100%;
+}
+
+.layout-navbar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 100;
+    width: 100%;
+    height: @nav-size-height;
+}
+
+.layout-sider {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 99;
+    height: 100%;
+    transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+    &::after {
+        position: absolute;
+        top: 0;
+        right: -1px;
+        display: block;
+        width: 1px;
+        height: 100%;
+        background-color: var(--color-border);
+        content: "";
+    }
+
+    > :deep(.arco-layout-sider-children) {
+        overflow-y: hidden;
+    }
+}
+
+.menu-wrapper {
+    height: 100%;
+    overflow: auto;
+    overflow-x: hidden;
+    :deep(.arco-menu) {
+        ::-webkit-scrollbar {
+            width: 12px;
+            height: 4px;
+        }
+
+        ::-webkit-scrollbar-thumb {
+            border: 4px solid transparent;
+            background-clip: padding-box;
+            border-radius: 7px;
+            background-color: var(--color-text-4);
+        }
+
+        ::-webkit-scrollbar-thumb:hover {
+            background-color: var(--color-text-3);
+        }
+    }
+}
+
+.layout-content {
+    min-height: 100vh;
+    overflow-y: hidden;
+    background-color: var(--color-fill-2);
+    transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+}
+</style>
--- a/cdTMP/src/router/app-menus/index.js
+++ b/cdTMP/src/router/app-menus/index.js
@@ -0,0 +1,15 @@
+import { appRoutes, appExternalRoutes } from "@/router/routes"
+
+const mixinRoutes = [...appRoutes, appExternalRoutes]
+const appClientMenus = mixinRoutes.map((el) => {
+    const { name, path, meta, redirect, children } = el
+    return {
+        name,
+        path,
+        meta,
+        redirect,
+        children
+    }
+})
+
+export default appClientMenus
--- a/cdTMP/src/router/constants.js
+++ b/cdTMP/src/router/constants.js
@@ -23,7 +23,7 @@ export const DEFAULT_ROUTE_NAME = "Workplace"
 * @type: object
 */
 export const DEFAULT_ROUTE = {
-    title: "menu.dashboard.workplace",
+    title: "工作台",
    name: DEFAULT_ROUTE_NAME,
    fullPath: "/dashboard/workplace"
 }
--- a/cdTMP/src/router/guard/index.js
+++ b/cdTMP/src/router/guard/index.js
@@ -0,0 +1,16 @@
+import { setRouteEmitter } from "@/utils/route-listener"
+import setupUserLoginInfoGuard from "./userLoginInfo"
+import setupPermissionGuard from "@/router/guard/permisstion"
+
+function setupPageGuard(router) {
+    router.beforeEach(async (to) => {
+        // 发出路由改变的事件
+        setRouteEmitter(to)
+    })
+}
+
+export default function createRouteGuard(router) {
+    setupPageGuard(router)
+    setupUserLoginInfoGuard(router)
+    setupPermissionGuard(router)
+}
--- a/cdTMP/src/router/guard/permisstion.js
+++ b/cdTMP/src/router/guard/permisstion.js
@@ -0,0 +1,48 @@
+import NProgress from "nprogress" // progress bar
+
+import usePermission from "@/hooks/permission"
+import { useUserStore, useAppStore } from "@/store"
+import { appRoutes } from "../routes"
+import { WHITE_LIST, NOT_FOUND } from "../constants"
+// 权限守卫
+export default function setupPermissionGuard(router) {
+    router.beforeEach(async (to, from, next) => {
+        const appStore = useAppStore()
+        const userStore = useUserStore()
+        const Permission = usePermission()
+        // 该函数根据角色返回是否有这个路由
+        const permissionsAllow = Permission.accessRouter(to)
+        if (appStore.menuFromServer) {
+            // 针对来自服务端的菜单配置进行处理
+            // Handle routing configuration from the server
+
+            // 根据需要自行完善来源于服务端的菜单配置的permission逻辑
+            // Refine the permission logic from the server's menu configuration as needed
+            if (!appStore.appAsyncMenus.length && !WHITE_LIST.find((el) => el.name === to.name)) {
+                await appStore.fetchServerMenuConfig()
+            }
+            const serverMenuConfig = [...appStore.appAsyncMenus, ...WHITE_LIST]
+
+            let exist = false
+            while (serverMenuConfig.length && !exist) {
+                const element = serverMenuConfig.shift()
+                if (element?.name === to.name) exist = true
+
+                if (element?.children) {
+                    serverMenuConfig.push(...element.children)
+                }
+            }
+            if (exist && permissionsAllow) {
+                next()
+            } else next(NOT_FOUND)
+        } else {
+            // eslint-disable-next-line no-lonely-if
+            if (permissionsAllow) next()
+            else {
+                const destination = Permission.findFirstPermissionRoute(appRoutes, userStore.role) || NOT_FOUND
+                next(destination)
+            }
+        }
+        NProgress.done()
+    })
+}
--- a/cdTMP/src/router/guard/userLoginInfo.js
+++ b/cdTMP/src/router/guard/userLoginInfo.js
@@ -0,0 +1,40 @@
+import NProgress from "nprogress" // progress bar
+import { useUserStore } from "@/store"
+// userInfo守卫
+export default function setupUserLoginInfoGuard(router) {
+    router.beforeEach(async (to, from, next) => {
+        NProgress.start()
+        const userStore = useUserStore()
+        if (userStore.isLogin()) {
+            if (userStore.role) {
+                next()
+            } else {
+                try {
+                    await userStore.info()
+                    next()
+                } catch (error) {
+                    await userStore.logout()
+                    next({
+                        name: "login",
+                        query: {
+                            redirect: to.name,
+                            ...to.query
+                        }
+                    })
+                }
+            }
+        } else {
+            if (to.name === "login") {
+                next()
+                return
+            }
+            next({
+                name: "login",
+                query: {
+                    redirect: to.name,
+                    ...to.query
+                }
+            })
+        }
+    })
+}
--- a/cdTMP/src/router/index.js
+++ b/cdTMP/src/router/index.js
@@ -3,6 +3,7 @@ import { createRouter, createWebHistory } from "vue-router"
 import { appRoutes } from "./routes"
 // 引入基本重定向路由和notFound路由
 import { REDIRECT_MAIN, NOT_FOUND_ROUTE } from "./routes/base"
+import createRouteGuard from "@/router/guard/index"

 const router = createRouter({
    history: createWebHistory(),
@@ -28,4 +29,5 @@ const router = createRouter({
        return { top: 0 }
    }
 })
+createRouteGuard(router)
 export default router
--- a/cdTMP/src/router/routes/base.js
+++ b/cdTMP/src/router/routes/base.js
@@ -1,15 +1,15 @@
 import { REDIRECT_ROUTE_NAME } from "@/router/constants"

 /**
- * @description: 返回import("@/layout/default-layout.vue")
+ * @description: import('@/layout/default-layout.vue')
 * @type: Promise对象
 */
-export const DEFAULT_LAYOUT = () => import("@/layout/default-layout.vue")
+export const DEFAULT_LAYOUT = () => import('@/layout/default-layout.vue')

 export const REDIRECT_MAIN = {
    path: "/redirect",
    name: "redirectWrapper",
-    component: DEFAULT_LAYOUT, // () => import("@/layout/default-layout.vue")
+    component: DEFAULT_LAYOUT, // import('@/layout/default-layout.vue')
    meta: {
        requiresAuth: true,
        hideInMenu: true
@@ -30,5 +30,5 @@ export const REDIRECT_MAIN = {
 export const NOT_FOUND_ROUTE = {
    path: "/:pathMatch(.*)*",
    name: "notFound",
-    component: () => import("@/views/not-found/index.vue")
+    component: () => import("@/layout/404.vue")
 }
--- a/cdTMP/src/router/routes/guard/index.js
+++ b/cdTMP/src/router/routes/guard/index.js
@@ -1 +0,0 @@
-import { setRouteEmitter } from "@/utils/route-listener"
--- a/cdTMP/src/router/routes/guard/permisstion.js
+++ b/cdTMP/src/router/routes/guard/permisstion.js
@@ -1 +0,0 @@
-import NProgress from 'nprogress'
--- a/cdTMP/src/router/routes/guard/userLoginInfo.js
+++ b/cdTMP/src/router/routes/guard/userLoginInfo.js
--- a/cdTMP/src/router/routes/modules/dashboard.js
+++ b/cdTMP/src/router/routes/modules/dashboard.js
@@ -5,10 +5,10 @@ const DASHBOARD = {
    name: "dashboard",
    component: DEFAULT_LAYOUT, // () => import("@/layout/default-layout.vue")
    meta: {
-        locale: "menu.dashboard",
        requiresAuth: true,
        icon: "icon-dashboard",
-        order: 0
+        order: 0,
+        locale:"图标展示"
    },
    children: [
        {
@@ -16,9 +16,9 @@ const DASHBOARD = {
            name: "Workplace",
            component: () => import("@/views/dashboard/workplace/index.vue"),
            meta: {
-                locale: "menu.dashboard.workplace",
                requiresAuth: true,
-                roles: ["*"]
+                roles: ["*"],
+                locale:"工作台"
            }
        },
    ]
--- a/cdTMP/src/store/index.js
+++ b/cdTMP/src/store/index.js
@@ -1,5 +1,8 @@
 import { createPinia } from "pinia"
+import useUserStore from "./modules/user"
+import useAppStore from "./modules/app"

 const pinia = createPinia()

+export { useUserStore, useAppStore }
 export default pinia
--- a/cdTMP/src/store/modules/app.js
+++ b/cdTMP/src/store/modules/app.js
@@ -0,0 +1,73 @@
+import { defineStore } from "pinia"
+import { Notification } from "@arco-design/web-vue"
+import defaultSettings from "@/config/setting.json"
+
+const useAppStore = defineStore("app", {
+    state: () => ({
+        ...defaultSettings
+    }),
+    getters: {
+        appCurrentSetting(state) {
+            return { ...state }
+        },
+        appDevice(state) {
+            return state.device
+        },
+        appAsyncMenus(state) {
+            return state.serverMenu
+        }
+    },
+    actions: {
+        // 更新设置
+        updateSettings(partial) {
+            this.$patch(partial)
+        },
+        // 改变主题
+        toggleTheme(dark) {
+            if (dark) {
+                this.theme = "dark"
+                document.body.setAttribute("arco-theme", "dark")
+            } else {
+                this.theme = "light"
+                document.body.setAttribute("arco-theme", "light")
+            }
+        },
+        // 切换用户设备
+        toggleDevice(device) {
+            this.device = device
+        },
+        // 切换菜单
+        toggleMenu(value) {
+            this.hideMenu = value
+        },
+        async fetchServerMenuConfig() {
+            let notifyInstance = null
+            try {
+                notifyInstance = Notification.info({
+                    id: "menuNotice", // Keep the instance id the same
+                    content: "loading",
+                    closable: true
+                })
+                const { data } = await getMenuList()
+                this.serverMenu = data
+                notifyInstance = Notification.success({
+                    id: "menuNotice",
+                    content: "success",
+                    closable: true
+                })
+            } catch (error) {
+                // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                notifyInstance = Notification.error({
+                    id: "menuNotice",
+                    content: "error",
+                    closable: true
+                })
+            }
+        },
+        clearServerMenu() {
+            this.serverMenu = []
+        }
+    }
+})
+
+export default useAppStore
--- a/cdTMP/src/store/modules/user.js
+++ b/cdTMP/src/store/modules/user.js
@@ -0,0 +1,101 @@
+import { defineStore } from "pinia"
+import tool from "@/utils/tool"
+import { removeRouteListener } from "@/utils/route-listener"
+import loginAPI from "@/api/login"
+import { useAppStore } from "@/store"
+
+const useUserStore = defineStore("user", {
+    state: () => ({
+        name: undefined,
+        avatar: undefined,
+        job: undefined,
+        organization: undefined,
+        location: undefined,
+        email: undefined,
+        introduction: undefined,
+        personalWebsite: undefined,
+        jobName: undefined,
+        organizationName: undefined,
+        locationName: undefined,
+        phone: undefined,
+        registrationDate: undefined,
+        accountId: undefined,
+        certification: undefined,
+        role: '',
+    }),
+
+    getters: {
+        setUserInfo(state) {
+            return { ...state }
+        }
+    },
+
+    actions: {
+        // 切换角色函数
+        switchRoles() {
+            return new Promise((resolve) => {
+                this.role = this.role === "user" ? "admin" : "user"
+                resolve(this.role)
+            })
+        },
+        // token相关操作
+        isLogin() {
+            return !!localStorage.getItem(import.meta.env.VITE_APP_TOKEN_PREFIX)
+        },
+        setToken(token) {
+            tool.local.set(import.meta.env.VITE_APP_TOKEN_PREFIX, token)
+        },
+        getToken() {
+            return tool.local.get(import.meta.env.VITE_APP_TOKEN_PREFIX)
+        },
+        clearToken() {
+            tool.local.remove(import.meta.env.VITE_APP_TOKEN_PREFIX)
+        },
+        // 全局更新userInfo信息
+        setInfo(data) {
+            this.$patch(data)
+        },
+        // 请求用户信息
+        async info() {
+            const res = await loginAPI.getInfo()
+            this.setInfo(res.data)
+        },
+        resetUserInfo() {
+            this.$reset()
+        },
+
+        // login函数，传一个form信息
+        login(form) {
+            return loginAPI
+                .login(form)
+                .then((res) => {
+                    if (res.success) {
+                        this.setToken(res.data.token)
+                        return true
+                    } else {
+                        return false
+                    }
+                })
+                .catch((e) => {
+                    console.log(e)
+                    return false
+                })
+        },
+        logoutCallBack() {
+            const appStore = useAppStore()
+            this.resetUserInfo()
+            this.clearToken()
+            removeRouteListener()
+            appStore.clearServerMenu()
+        },
+        async logout() {
+            try {
+                await loginAPI.logout()
+            } finally {
+                this.logoutCallBack()
+            }
+        }
+    }
+})
+
+export default useUserStore
--- a/cdTMP/src/utils/index.ts
+++ b/cdTMP/src/utils/index.ts
@@ -0,0 +1,22 @@
+type TargetContext = '_self' | '_parent' | '_blank' | '_top'
+
+export const openWindow = (url: string, opts?: { target?: TargetContext; [key: string]: any }) => {
+    const { target = '_blank', ...others } = opts || {}
+    window.open(
+        url,
+        target,
+        Object.entries(others)
+            .reduce((preValue: string[], curValue) => {
+                const [key, value] = curValue
+                return [...preValue, `${key}=${value}`]
+            }, [])
+            .join(',')
+    )
+}
+
+export const regexUrl = new RegExp(
+    '^(?!mailto:)(?:(?:http|https|ftp)://)(?:\\S+(?::\\S*)?@)?(?:(?:(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[0-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))|(?:(?:[a-z\\u00a1-\\uffff0-9]+-?)*[a-z\\u00a1-\\uffff0-9]+)(?:\\.(?:[a-z\\u00a1-\\uffff0-9]+-?)*[a-z\\u00a1-\\uffff0-9]+)*(?:\\.(?:[a-z\\u00a1-\\uffff]{2,})))|localhost)(?::\\d{2,5})?(?:(/|\\?|#)[^\\s]*)?$',
+    'i'
+)
+
+export default null
--- a/cdTMP/src/views/dashboard/workplace/index.vue
+++ b/cdTMP/src/views/dashboard/workplace/index.vue
@@ -0,0 +1,7 @@
+<template>
+    <div><h2>我是workplace</h2></div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped></style>
--- a/cdTMP/src/views/login.vue
+++ b/cdTMP/src/views/login.vue
@@ -76,9 +76,9 @@
 <script setup>
 import { reactive, onMounted, ref } from "vue"
 import verifyCode from "@cps/ma-verifyCode/index.vue"
-import { Message } from "@arco-design/web-vue"
 import { useUserStore } from "@/store"
 import { useRouter, useRoute } from "vue-router"
+import { Message } from "@arco-design/web-vue"
 const router = useRouter()
 const route = useRoute()
 const userStore = useUserStore()
@@ -88,6 +88,7 @@ const form = reactive({ username: "superAdmin", password: "admin123", code: "" }
 const Verify = ref(null)
 const loading = ref(null)
 // 点击登录按钮
+const errorMessage = ref("")
 const handleSubmit = async ({ values, errors }) => {
    if (loading.value) {
        return
@@ -95,18 +96,18 @@ const handleSubmit = async ({ values, errors }) => {
    loading.value = true
    if (Verify.value.checkResult(form.code) && !errors) {
        // 登录逻辑需要用到userStore
-        const result = await useUserStore.login(form)
-        if (!result) {
+        try {
+            await userStore.login(form)
+            const { redirect, ...otherQuery } = router.currentRoute.value.query
+            router.push({
+                name: redirect || "Workplace"
+            })
+            Message.success("登录成功，等待跳转")
+        } catch (err) {
+            errorMessage.value = err.message
+        } finally {
            loading.value = false
-            return
        }
-        // 1.注意router.currentRoute.value要加value
-        // 2.query是router的东西，params是axios的东西
-        const { redirect, ...othersQuery } = router.currentRoute.value.query
-        router.push({
-            name: redirect || "WorkPlace",
-            query: { ...othersQuery }
-        })
    }
    loading.value = false
 }
--- a/cdTMP/vite.config.js
+++ b/cdTMP/vite.config.js
@@ -13,7 +13,8 @@ export default ({ mode }) => {
            alias: {
                "@": resolve(__dirname, "src"),
                "@cps": resolve(__dirname, "src/components"),
-                "vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js"
+                "vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js",
+                vue: "vue/dist/vue.esm-bundler.js"
            }
        },

--- a/cdtestplant/tsconfig.json
+++ b/cdtestplant/tsconfig.json
@@ -8,7 +8,7 @@
        "sourceMap": true,
        "resolveJsonModule": true,
        "esModuleInterop": true,
-        "baseUrl": ".",
+        "baseUrl": "./",
        "paths": {
            "@/*": [
                "src/*"
--- a/chengduTestPlant/src/layout/components/banner/index.vue
+++ b/chengduTestPlant/src/layout/components/banner/index.vue
@@ -1,12 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
 <template>
    <a-layout class="layout flex flex-col h-full">
        <a-layout-header class="ma-ui-header flex justify-between h-50 layout-banner-header operation-area">
--- a/chengduTestPlant/src/layout/components/classic/index.vue
+++ b/chengduTestPlant/src/layout/components/classic/index.vue
@@ -1,12 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
 <template>
    <a-layout class="layout flex justify-between h-full">
        <ma-classic-slider class="ma-ui-slider" />
--- a/chengduTestPlant/src/layout/components/classic/ma-classic-header.vue
+++ b/chengduTestPlant/src/layout/components/classic/ma-classic-header.vue
@@ -1,12 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
 <template>
    <a-layout-header class="layout-classic-header flex flex-col operation-area">
        <div class="flex justify-between layout-classic-header-container">
--- a/chengduTestPlant/src/layout/components/classic/ma-classic-slider.vue
+++ b/chengduTestPlant/src/layout/components/classic/ma-classic-slider.vue
@@ -1,12 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
 <template>
    <a-layout-sider
        class="layout-classic-sider h-full flex flex-col hidden lg:block"
--- a/chengduTestPlant/src/layout/components/components/children-banner.vue
+++ b/chengduTestPlant/src/layout/components/components/children-banner.vue
@@ -1,12 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
 <template>
    <a-layout-content class="sys-menus">
        <a-menu
--- a/chengduTestPlant/src/layout/components/components/children-menu.vue
+++ b/chengduTestPlant/src/layout/components/components/children-menu.vue
@@ -1,13 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
-
 <template>
    <a-layout-content class="sys-menus">
        <template v-for="menu in modelValue" :key="menu.id">
--- a/chengduTestPlant/src/layout/setting.vue
+++ b/chengduTestPlant/src/layout/setting.vue
@@ -1,13 +1,3 @@
-<!--
- - MineAdmin is committed to providing solutions for quickly building web applications
- - Please view the LICENSE file that was distributed with this source code,
- - For the full copyright and license information.
- - Thank you very much for using MineAdmin.
- -
- - @Author X.Mo<root@imoi.cn>
- - @Link   https://gitee.com/xmo/mineadmin-vue
-->
-
 <template>
    <a-drawer
        class="backend-setting"
				`@@ -0,0 +1 @@`
				`declare module "@arco-design/web-vue/dist/arco-vue-icon"`
				`@@ -1 +0,0 @@`
				`import { setRouteEmitter } from "@/utils/route-listener"`