| @@ -3,6 +3,6 @@ | |||||
| # 变量必须以 VITE_ 为前缀才能暴露给外部读取 | # 变量必须以 VITE_ 为前缀才能暴露给外部读取 | ||||
| NODE_ENV='development' | NODE_ENV='development' | ||||
| VITE_APP_TITLE = 'vue3-element-admin' | |||||
| VITE_APP_TITLE = 'Metavatar-PC' | |||||
| VITE_APP_PORT = 3000 | VITE_APP_PORT = 3000 | ||||
| VITE_APP_BASE_API = '/dev-api' | VITE_APP_BASE_API = '/dev-api' | ||||
| @@ -1,5 +1,5 @@ | |||||
| ## 生产环境 | ## 生产环境 | ||||
| VITE_APP_TITLE = 'vue3-element-admin' | |||||
| VITE_APP_TITLE = 'Metavatar-PC' | |||||
| VITE_APP_PORT = 3000 | VITE_APP_PORT = 3000 | ||||
| VITE_APP_BASE_API = '/prod-api' | VITE_APP_BASE_API = '/prod-api' | ||||
| @@ -5,9 +5,7 @@ | |||||
| <meta charset="UTF-8" /> | <meta charset="UTF-8" /> | ||||
| <link rel="icon" href="/favicon.ico" /> | <link rel="icon" href="/favicon.ico" /> | ||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||||
| <meta name="description" content="vue-element-admin的vue3版本" /> | |||||
| <meta name="keywords" content="vue-element-admin,vue3-element-admin" /> | |||||
| <title>vue3-element-admin</title> | |||||
| <title>Metavatar-PC-Admin</title> | |||||
| </head> | </head> | ||||
| <body> | <body> | ||||
| @@ -1,5 +1,5 @@ | |||||
| { | { | ||||
| "name": "vue3-element-admin", | |||||
| "name": "Metavatar-PC", | |||||
| "private": true, | "private": true, | ||||
| "version": "2.2.1", | "version": "2.2.1", | ||||
| "type": "module", | "type": "module", | ||||
| @@ -98,4 +98,4 @@ | |||||
| "repository": "https://gitee.com/youlaiorg/vue3-element-admin.git", | "repository": "https://gitee.com/youlaiorg/vue3-element-admin.git", | ||||
| "author": "有来开源组织", | "author": "有来开源组织", | ||||
| "license": "MIT" | "license": "MIT" | ||||
| } | |||||
| } | |||||
| @@ -6,7 +6,7 @@ export default { | |||||
| }, | }, | ||||
| // 登录页面国际化 | // 登录页面国际化 | ||||
| login: { | login: { | ||||
| title: 'vue3-element-admin', | |||||
| title: 'Metavatar-PC', | |||||
| username: 'Username', | username: 'Username', | ||||
| password: 'Password', | password: 'Password', | ||||
| login: 'Login', | login: 'Login', | ||||
| @@ -6,7 +6,7 @@ export default { | |||||
| }, | }, | ||||
| // 登录页面国际化 | // 登录页面国际化 | ||||
| login: { | login: { | ||||
| title: 'vue3-element-admin', | |||||
| title: 'Metavatar-PC', | |||||
| username: '用户名', | username: '用户名', | ||||
| password: '密码', | password: '密码', | ||||
| login: '登 录', | login: '登 录', | ||||
| @@ -1,30 +1,3 @@ | |||||
| <script setup lang="ts"> | |||||
| import { RouteLocationRaw, useRoute, useRouter } from "vue-router"; | |||||
| import SidebarItem from "./SidebarItem.vue"; | |||||
| import Logo from "./Logo.vue"; | |||||
| import { useSettingsStore } from "@/store/modules/settings"; | |||||
| import { usePermissionStore } from "@/store/modules/permission"; | |||||
| import { useAppStore } from "@/store/modules/app"; | |||||
| import { storeToRefs } from "pinia"; | |||||
| import variables from "@/styles/variables.module.scss"; | |||||
| // 静态路由 | |||||
| import { constantRoutes } from "@/router"; | |||||
| const settingsStore = useSettingsStore(); | |||||
| const permissionStore = usePermissionStore(); | |||||
| const appStore = useAppStore(); | |||||
| const { sidebarLogo } = storeToRefs(settingsStore); | |||||
| const route = useRoute(); | |||||
| const router = useRouter(); | |||||
| function routerTo(url: RouteLocationRaw) { | |||||
| router.push(url); | |||||
| } | |||||
| </script> | |||||
| <template> | <template> | ||||
| <!-- 左侧菜单 --> | <!-- 左侧菜单 --> | ||||
| <div :class="{ 'has-logo': sidebarLogo }"> | <div :class="{ 'has-logo': sidebarLogo }"> | ||||
| @@ -73,6 +46,33 @@ function routerTo(url: RouteLocationRaw) { | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| <script setup lang="ts"> | |||||
| import { RouteLocationRaw, useRoute, useRouter } from "vue-router"; | |||||
| import SidebarItem from "./SidebarItem.vue"; | |||||
| import Logo from "./Logo.vue"; | |||||
| import { useSettingsStore } from "@/store/modules/settings"; | |||||
| import { usePermissionStore } from "@/store/modules/permission"; | |||||
| import { useAppStore } from "@/store/modules/app"; | |||||
| import { storeToRefs } from "pinia"; | |||||
| import variables from "@/styles/variables.module.scss"; | |||||
| // 静态路由 | |||||
| import { constantRoutes } from "@/router"; | |||||
| const settingsStore = useSettingsStore(); | |||||
| const permissionStore = usePermissionStore(); | |||||
| const appStore = useAppStore(); | |||||
| const { sidebarLogo } = storeToRefs(settingsStore); | |||||
| const route = useRoute(); | |||||
| const router = useRouter(); | |||||
| function routerTo(url: RouteLocationRaw) { | |||||
| router.push(url); | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | <style lang="scss" scoped> | ||||
| .myRouter { | .myRouter { | ||||
| position: relative; | position: relative; | ||||
| @@ -1,3 +1,31 @@ | |||||
| <template> | |||||
| <div :class="classObj" class="app-wrapper"> | |||||
| <!-- 手机设备侧边栏打开遮罩层 --> | |||||
| <div | |||||
| v-if="classObj.mobile && classObj.openSidebar" | |||||
| class="drawer-bg" | |||||
| @click="handleOutsideClick" | |||||
| ></div> | |||||
| <Sidebar class="sidebar-container" /> | |||||
| <div :class="{ hasTagsView: showTagsView }" class="main-container"> | |||||
| <div :class="{ 'fixed-header': fixedHeader }"> | |||||
| <navbar /> | |||||
| <tags-view v-if="showTagsView" /> | |||||
| </div> | |||||
| <!--主页面--> | |||||
| <app-main /> | |||||
| <!-- 设置面板 --> | |||||
| <RightPanel v-if="showSettings"> | |||||
| <settings /> | |||||
| </RightPanel> | |||||
| </div> | |||||
| </div> | |||||
| </template> | |||||
| <script setup lang="ts"> | <script setup lang="ts"> | ||||
| import { computed, watchEffect } from "vue"; | import { computed, watchEffect } from "vue"; | ||||
| import { useWindowSize } from "@vueuse/core"; | import { useWindowSize } from "@vueuse/core"; | ||||
| @@ -54,34 +82,6 @@ function handleOutsideClick() { | |||||
| } | } | ||||
| </script> | </script> | ||||
| <template> | |||||
| <div :class="classObj" class="app-wrapper"> | |||||
| <!-- 手机设备侧边栏打开遮罩层 --> | |||||
| <div | |||||
| v-if="classObj.mobile && classObj.openSidebar" | |||||
| class="drawer-bg" | |||||
| @click="handleOutsideClick" | |||||
| ></div> | |||||
| <Sidebar class="sidebar-container" /> | |||||
| <div :class="{ hasTagsView: showTagsView }" class="main-container"> | |||||
| <div :class="{ 'fixed-header': fixedHeader }"> | |||||
| <navbar /> | |||||
| <tags-view v-if="showTagsView" /> | |||||
| </div> | |||||
| <!--主页面--> | |||||
| <app-main /> | |||||
| <!-- 设置面板 --> | |||||
| <RightPanel v-if="showSettings"> | |||||
| <settings /> | |||||
| </RightPanel> | |||||
| </div> | |||||
| </div> | |||||
| </template> | |||||
| <style lang="scss" scoped> | <style lang="scss" scoped> | ||||
| .app-wrapper { | .app-wrapper { | ||||
| &::after { | &::after { | ||||
| @@ -42,7 +42,7 @@ interface DefaultSettings { | |||||
| } | } | ||||
| const defaultSettings: DefaultSettings = { | const defaultSettings: DefaultSettings = { | ||||
| title: "vue3-element-admin", | |||||
| title: "Metavatar-PC", | |||||
| showSettings: false, | showSettings: false, | ||||
| tagsView: false, | tagsView: false, | ||||
| fixedHeader: false, | fixedHeader: false, | ||||
| @@ -1,53 +1,57 @@ | |||||
| // generated by unplugin-vue-components | // generated by unplugin-vue-components | ||||
| // We suggest you to commit this file into source control | // We suggest you to commit this file into source control | ||||
| // Read more: https://github.com/vuejs/core/pull/3399 | // Read more: https://github.com/vuejs/core/pull/3399 | ||||
| import "@vue/runtime-core"; | |||||
| import '@vue/runtime-core' | |||||
| export {}; | |||||
| export {} | |||||
| declare module "@vue/runtime-core" { | |||||
| declare module '@vue/runtime-core' { | |||||
| export interface GlobalComponents { | export interface GlobalComponents { | ||||
| Breadcrumb: typeof import("./../components/Breadcrumb/index.vue")["default"]; | |||||
| ElBreadcrumb: typeof import("element-plus/es")["ElBreadcrumb"]; | |||||
| ElBreadcrumbItem: typeof import("element-plus/es")["ElBreadcrumbItem"]; | |||||
| ElButton: typeof import("element-plus/es")["ElButton"]; | |||||
| ElDivider: typeof import("element-plus/es")["ElDivider"]; | |||||
| ElDropdown: typeof import("element-plus/es")["ElDropdown"]; | |||||
| ElDropdownItem: typeof import("element-plus/es")["ElDropdownItem"]; | |||||
| ElDropdownMenu: typeof import("element-plus/es")["ElDropdownMenu"]; | |||||
| ElForm: typeof import("element-plus/es")["ElForm"]; | |||||
| ElFormItem: typeof import("element-plus/es")["ElFormItem"]; | |||||
| ElIcon: typeof import("element-plus/es")["ElIcon"]; | |||||
| ElInput: typeof import("element-plus/es")["ElInput"]; | |||||
| ElMenu: typeof import("element-plus/es")["ElMenu"]; | |||||
| ElMenuItem: typeof import("element-plus/es")["ElMenuItem"]; | |||||
| ElOption: typeof import("element-plus/es")["ElOption"]; | |||||
| ElRow: typeof import("element-plus/es")["ElRow"]; | |||||
| ElScrollbar: typeof import("element-plus/es")["ElScrollbar"]; | |||||
| ElSelect: typeof import("element-plus/es")["ElSelect"]; | |||||
| ElSubMenu: typeof import("element-plus/es")["ElSubMenu"]; | |||||
| ElSwitch: typeof import("element-plus/es")["ElSwitch"]; | |||||
| ElTabPane: typeof import("element-plus/es")["ElTabPane"]; | |||||
| ElTabs: typeof import("element-plus/es")["ElTabs"]; | |||||
| ElTooltip: typeof import("element-plus/es")["ElTooltip"]; | |||||
| GithubCorner: typeof import("./../components/GithubCorner/index.vue")["default"]; | |||||
| Hamburger: typeof import("./../components/Hamburger/index.vue")["default"]; | |||||
| IconSelect: typeof import("./../components/IconSelect/index.vue")["default"]; | |||||
| IEpCaretBottom: typeof import("~icons/ep/caret-bottom")["default"]; | |||||
| IEpClose: typeof import("~icons/ep/close")["default"]; | |||||
| IEpEdit: typeof import("~icons/ep/edit")["default"]; | |||||
| IEpGoods: typeof import("~icons/ep/goods")["default"]; | |||||
| IEpMenu: typeof import("~icons/ep/menu")["default"]; | |||||
| IEpSetting: typeof import("~icons/ep/setting")["default"]; | |||||
| LangSelect: typeof import("./../components/LangSelect/index.vue")["default"]; | |||||
| MultiUpload: typeof import("./../components/Upload/MultiUpload.vue")["default"]; | |||||
| Pagination: typeof import("./../components/Pagination/index.vue")["default"]; | |||||
| RightPanel: typeof import("./../components/RightPanel/index.vue")["default"]; | |||||
| RouterLink: typeof import("vue-router")["RouterLink"]; | |||||
| RouterView: typeof import("vue-router")["RouterView"]; | |||||
| SingleUpload: typeof import("./../components/Upload/SingleUpload.vue")["default"]; | |||||
| SizeSelect: typeof import("./../components/SizeSelect/index.vue")["default"]; | |||||
| SvgIcon: typeof import("./../components/SvgIcon/index.vue")["default"]; | |||||
| WangEditor: typeof import("./../components/WangEditor/index.vue")["default"]; | |||||
| Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default'] | |||||
| ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb'] | |||||
| ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem'] | |||||
| ElButton: typeof import('element-plus/es')['ElButton'] | |||||
| ElDialog: typeof import('element-plus/es')['ElDialog'] | |||||
| ElDivider: typeof import('element-plus/es')['ElDivider'] | |||||
| ElDropdown: typeof import('element-plus/es')['ElDropdown'] | |||||
| ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem'] | |||||
| ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu'] | |||||
| ElForm: typeof import('element-plus/es')['ElForm'] | |||||
| ElFormItem: typeof import('element-plus/es')['ElFormItem'] | |||||
| ElIcon: typeof import('element-plus/es')['ElIcon'] | |||||
| ElInput: typeof import('element-plus/es')['ElInput'] | |||||
| ElMenu: typeof import("element-plus/es")["ElMenu"] | |||||
| ElMenuItem: typeof import("element-plus/es")["ElMenuItem"] | |||||
| ElOption: typeof import('element-plus/es')['ElOption'] | |||||
| ElRow: typeof import('element-plus/es')['ElRow'] | |||||
| ElScrollbar: typeof import('element-plus/es')['ElScrollbar'] | |||||
| ElSelect: typeof import('element-plus/es')['ElSelect'] | |||||
| ElSubMenu: typeof import("element-plus/es")["ElSubMenu"] | |||||
| ElSwitch: typeof import('element-plus/es')['ElSwitch'] | |||||
| ElTabPane: typeof import('element-plus/es')['ElTabPane'] | |||||
| ElTabs: typeof import('element-plus/es')['ElTabs'] | |||||
| ElTooltip: typeof import('element-plus/es')['ElTooltip'] | |||||
| GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default'] | |||||
| Hamburger: typeof import('./../components/Hamburger/index.vue')['default'] | |||||
| IconSelect: typeof import('./../components/IconSelect/index.vue')['default'] | |||||
| IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default'] | |||||
| IEpClose: typeof import('~icons/ep/close')['default'] | |||||
| IEpDelete: typeof import('~icons/ep/delete')['default'] | |||||
| IEpDownload: typeof import('~icons/ep/download')['default'] | |||||
| IEpEdit: typeof import('~icons/ep/edit')['default'] | |||||
| IEpGoods: typeof import('~icons/ep/goods')['default'] | |||||
| IEpMenu: typeof import('~icons/ep/menu')['default'] | |||||
| IEpSetting: typeof import('~icons/ep/setting')['default'] | |||||
| IEpVideoPlay: typeof import('~icons/ep/video-play')['default'] | |||||
| LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] | |||||
| MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default'] | |||||
| Pagination: typeof import('./../components/Pagination/index.vue')['default'] | |||||
| RightPanel: typeof import('./../components/RightPanel/index.vue')['default'] | |||||
| RouterLink: typeof import('vue-router')['RouterLink'] | |||||
| RouterView: typeof import('vue-router')['RouterView'] | |||||
| SingleUpload: typeof import('./../components/Upload/SingleUpload.vue')['default'] | |||||
| SizeSelect: typeof import('./../components/SizeSelect/index.vue')['default'] | |||||
| SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default'] | |||||
| WangEditor: typeof import('./../components/WangEditor/index.vue')['default'] | |||||
| } | } | ||||
| } | } | ||||
| @@ -1,7 +1,12 @@ | |||||
| <template> | <template> | ||||
| <div class="login-container"> | <div class="login-container"> | ||||
| <div class="videoBox"> | <div class="videoBox"> | ||||
| <video src="../../assets/video/loginVideo.mp4" muted autoplay></video> | |||||
| <video | |||||
| src="../../assets/video/loginVideo.mp4" | |||||
| muted | |||||
| autoplay | |||||
| loop | |||||
| ></video> | |||||
| </div> | </div> | ||||
| <el-form | <el-form | ||||
| v-if="true" | v-if="true" | ||||
| @@ -44,7 +44,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => { | |||||
| // 反向代理解决跨域 | // 反向代理解决跨域 | ||||
| [env.VITE_APP_BASE_API]: { | [env.VITE_APP_BASE_API]: { | ||||
| target: "http://vapi.youlai.tech", // 线上接口地址 | target: "http://vapi.youlai.tech", // 线上接口地址 | ||||
| // target: 'http://localhost:8989', // 本地接口地址 , 后端工程仓库地址:https://gitee.com/youlaiorg/youlai-boot | |||||
| // target: 'http://localhost:8989', // 本地接口地址 | |||||
| changeOrigin: true, | changeOrigin: true, | ||||
| rewrite: (path) => | rewrite: (path) => | ||||
| path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""), // 替换 /dev-api 为 target 接口地址 | path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""), // 替换 /dev-api 为 target 接口地址 | ||||