mirror of
https://github.com/fantastic-admin/basic.git
synced 2026-10-07 04:53:40 +08:00
Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
77f62626de | ||
|
|
d1fc70175e | ||
|
|
55f7e0b9d2 | ||
|
|
7960d9c6a2 | ||
|
|
6f88513a5f | ||
|
|
b9e48842ab | ||
|
|
135dc85fa8 | ||
|
|
87ac51726f | ||
|
|
7882cd8f22 | ||
|
|
5644268411 | ||
|
|
989453a644 | ||
|
|
18285821d9 | ||
|
|
9c3085367b | ||
|
|
52f5a76ca4 | ||
|
|
12c268d18d | ||
|
|
0c43078d32 | ||
|
|
c534577feb | ||
|
|
7474a19af2 | ||
|
|
ae1f81762f | ||
|
|
ffb3c85b83 | ||
|
|
ca1ea48dc6 | ||
|
|
5c6494931b | ||
|
|
e24431c38a | ||
|
|
f85a911b8e | ||
|
|
776fe7a944 |
@@ -1,5 +1,5 @@
|
||||
<p align="center">
|
||||
<img src="https://hooray.gitee.io/fantastic-admin/logo.png" width="200" height="200" />
|
||||
<img src="https://hooray.gitee.io/fantastic-admin/logo.png" width="200" height="200" />
|
||||
</p>
|
||||
|
||||
<h1 align="center">Fantastic-admin</h1>
|
||||
@@ -7,18 +7,23 @@
|
||||
<p align="center">一款<b>开箱即用</b>的 Vue 中后台管理系统框架</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://hooray.gitee.io/fantastic-admin/" target="_blank">官网</a>
|
||||
( <a href="https://hooray.github.io/fantastic-admin" target="_blank">备用</a> )
|
||||
<span> | </span>
|
||||
演示
|
||||
( <a href="https://hooray.gitee.io/fantastic-admin-example" target="_blank">基础版</a>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin-pro-example" target="_blank">专业版</a> )
|
||||
<span> | </span>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin/support.html" target="_blank">技术支持</a>
|
||||
<span> | </span>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin/buy.html" target="_blank">购买</a>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin" target="_blank">官网</a>
|
||||
( <a href="https://hooray.github.io/fantastic-admin" target="_blank">备用</a> )
|
||||
<span> | </span>
|
||||
演示
|
||||
( <a href="https://hooray.gitee.io/fantastic-admin-example" target="_blank">基础版</a>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin-pro-example" target="_blank">专业版</a> )
|
||||
<span> | </span>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin/support.html" target="_blank">技术支持</a>
|
||||
<span> | </span>
|
||||
<a href="https://hooray.gitee.io/fantastic-admin/buy.html" target="_blank">购买</a>
|
||||
<p>
|
||||
|
||||
<p align="center">
|
||||
<a href="###"><img src="https://img.shields.io/github/license/hooray/fantastic-admin?label=%E5%BC%80%E6%BA%90%E5%8D%8F%E8%AE%AE&style=flat-square" /></a>
|
||||
<a href="https://github.com/hooray/fantastic-admin/releases" target="_blank"><img src="https://img.shields.io/github/v/release/hooray/fantastic-admin?label=%E5%BD%93%E5%89%8D%E7%89%88%E6%9C%AC&style=flat-square" /></a>
|
||||
</p>
|
||||
|
||||
## 特点
|
||||
|
||||
- 丰富的布局与主题,覆盖市面上各种中后台应用场景,兼容PC、平板和移动端
|
||||
@@ -43,16 +48,16 @@
|
||||
> 预览截图为 Vue3 专业版
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview1.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview2.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview3.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview4.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview5.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview6.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview1.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview2.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview3.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview4.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview5.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/fantastic-admin/preview6.png" /></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
## 支持
|
||||
@@ -66,37 +71,37 @@
|
||||
## 生态
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
<a href="https://hooray.gitee.io/fantastic-startkit/" target="_blank">Fantastic-startkit</a>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
一款开箱即用的 Vue 项目启动套件
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
<a href="https://hooray.gitee.io/fantastic-startkit/" target="_blank">Fantastic-startkit</a>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
一款开箱即用的 Vue 项目启动套件
|
||||
</th>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
<a href="https://hooray.gitee.io/one-step-admin/" target="_blank">One-step-admin</a>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
一款干啥都快人一步的 Vue 中后台管理系统框架
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview1.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview2.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview3.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview4.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview5.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview6.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
<a href="https://hooray.gitee.io/one-step-admin/" target="_blank">One-step-admin</a>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" align="center">
|
||||
一款干啥都快人一步的 Vue 中后台管理系统框架
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview1.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview2.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview3.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview4.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview5.png" /></td>
|
||||
<td><img src="https://hooray.gitee.io/one-step-admin/preview6.png" /></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
+20
-20
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "2.2.0",
|
||||
"version": "2.5.0",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build:test": "vue-tsc --noEmit && vite build --mode test",
|
||||
@@ -21,9 +21,9 @@
|
||||
"@tinymce/tinymce-vue": "^5.0.0",
|
||||
"@vueuse/core": "^9.6.0",
|
||||
"@vueuse/integrations": "^9.6.0",
|
||||
"axios": "^1.2.0",
|
||||
"dayjs": "^1.11.6",
|
||||
"element-plus": "^2.2.25",
|
||||
"axios": "^1.2.1",
|
||||
"dayjs": "^1.11.7",
|
||||
"element-plus": "^2.2.26",
|
||||
"hotkeys-js": "^3.10.1",
|
||||
"lodash-es": "^4.17.21",
|
||||
"mitt": "^3.0.0",
|
||||
@@ -31,45 +31,45 @@
|
||||
"nprogress": "^0.2.0",
|
||||
"path-browserify": "^1.0.1",
|
||||
"path-to-regexp": "^6.2.1",
|
||||
"pinia": "^2.0.26",
|
||||
"pinia": "^2.0.28",
|
||||
"qs": "^6.11.0",
|
||||
"tinymce": "^6.3.0",
|
||||
"tinymce": "^6.3.1",
|
||||
"vue": "^3.2.45",
|
||||
"vue-router": "^4.1.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antfu/eslint-config": "^0.31.0",
|
||||
"@antfu/eslint-config": "^0.33.1",
|
||||
"@iconify-json/ep": "^1.1.8",
|
||||
"@iconify/vue": "^4.0.0",
|
||||
"@iconify/vue": "^4.0.1",
|
||||
"@types/nprogress": "^0.2.0",
|
||||
"@types/path-browserify": "^1.0.0",
|
||||
"@types/qs": "^6.9.7",
|
||||
"@vitejs/plugin-vue": "^3.2.0",
|
||||
"@vitejs/plugin-vue-jsx": "^2.1.1",
|
||||
"@vitejs/plugin-vue": "^4.0.0",
|
||||
"@vitejs/plugin-vue-jsx": "^3.0.0",
|
||||
"autoprefixer": "^10.4.13",
|
||||
"bumpp": "^8.2.1",
|
||||
"cz-git": "^1.3.12",
|
||||
"eslint": "^8.28.0",
|
||||
"cz-git": "^1.4.0",
|
||||
"eslint": "^8.29.0",
|
||||
"esno": "^0.16.3",
|
||||
"fs-extra": "^10.1.0",
|
||||
"fs-extra": "^11.1.0",
|
||||
"http-server": "^14.1.1",
|
||||
"lint-staged": "^13.0.4",
|
||||
"lint-staged": "^13.1.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"plop": "^3.1.1",
|
||||
"postcss-html": "^1.5.0",
|
||||
"sass": "^1.56.1",
|
||||
"sass": "^1.56.2",
|
||||
"simple-git-hooks": "^2.8.1",
|
||||
"stylelint": "^14.15.0",
|
||||
"stylelint": "^14.16.0",
|
||||
"stylelint-config-standard": "^29.0.0",
|
||||
"stylelint-config-standard-scss": "^6.1.0",
|
||||
"stylelint-config-standard-vue": "^1.0.0",
|
||||
"stylelint-scss": "^4.3.0",
|
||||
"svgo": "^3.0.2",
|
||||
"typescript": "^4.9.3",
|
||||
"typescript": "^4.9.4",
|
||||
"unplugin-auto-import": "^0.12.0",
|
||||
"unplugin-vue-components": "^0.22.11",
|
||||
"vite": "^3.2.4",
|
||||
"vite-plugin-banner": "^0.6.1",
|
||||
"vite": "^4.0.0",
|
||||
"vite-plugin-banner": "^0.7.0",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-html": "^3.2.0",
|
||||
"vite-plugin-mock": "^2.9.6",
|
||||
@@ -78,7 +78,7 @@
|
||||
"vite-plugin-svg-icons": "^2.0.1",
|
||||
"vite-plugin-vue-layouts": "^0.6.0",
|
||||
"vite-plugin-vue-setup-extend": "^0.4.0",
|
||||
"vue-tsc": "^1.0.9"
|
||||
"vue-tsc": "^1.0.12"
|
||||
},
|
||||
"simple-git-hooks": {
|
||||
"pre-commit": "pnpm lint-staged",
|
||||
|
||||
Generated
+739
-483
File diff suppressed because it is too large
Load Diff
+1
-3
@@ -67,14 +67,12 @@ watch([
|
||||
() => settingsStore.title,
|
||||
], () => {
|
||||
if (settingsStore.app.enableDynamicTitle && settingsStore.title) {
|
||||
const title = settingsStore.title
|
||||
const title = typeof settingsStore.title === 'function' ? settingsStore.title() : settingsStore.title
|
||||
document.title = `${title} - ${import.meta.env.VITE_APP_TITLE}`
|
||||
}
|
||||
else {
|
||||
document.title = import.meta.env.VITE_APP_TITLE
|
||||
}
|
||||
}, {
|
||||
immediate: true,
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
+7
-6
@@ -5,12 +5,13 @@ import router from '@/router/index'
|
||||
import useUserStore from '@/store/modules/user'
|
||||
|
||||
const toLogin = () => {
|
||||
useUserStore().logout()
|
||||
router.push({
|
||||
path: '/login',
|
||||
query: {
|
||||
redirect: router.currentRoute.value.path !== '/login' ? router.currentRoute.value.fullPath : undefined,
|
||||
},
|
||||
useUserStore().logout().then(() => {
|
||||
router.push({
|
||||
path: '/login',
|
||||
query: {
|
||||
redirect: router.currentRoute.value.path !== '/login' ? router.currentRoute.value.fullPath : undefined,
|
||||
},
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
Vendored
-30
@@ -1,30 +0,0 @@
|
||||
// generated by unplugin-vue-components
|
||||
// We suggest you to commit this file into source control
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
import '@vue/runtime-core'
|
||||
|
||||
export {}
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
export interface GlobalComponents {
|
||||
Auth: typeof import('./components/Auth/index.vue')['default']
|
||||
AuthAll: typeof import('./components/AuthAll/index.vue')['default']
|
||||
BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
|
||||
Copyright: typeof import('./components/Copyright/index.vue')['default']
|
||||
Editor: typeof import('./components/Editor/index.vue')['default']
|
||||
FileUpload: typeof import('./components/FileUpload/index.vue')['default']
|
||||
FixedActionBar: typeof import('./components/FixedActionBar/index.vue')['default']
|
||||
ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
|
||||
ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
|
||||
ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
|
||||
PageHeader: typeof import('./components/PageHeader/index.vue')['default']
|
||||
PageMain: typeof import('./components/PageMain/index.vue')['default']
|
||||
PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
RouterView: typeof import('vue-router')['RouterView']
|
||||
SearchBar: typeof import('./components/SearchBar/index.vue')['default']
|
||||
SvgIcon: typeof import('./components/SvgIcon/index.vue')['default']
|
||||
SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
|
||||
Trend: typeof import('./components/Trend/index.vue')['default']
|
||||
}
|
||||
}
|
||||
@@ -130,9 +130,19 @@ function handleCopy() {
|
||||
<el-divider>顶栏</el-divider>
|
||||
<div class="setting-item">
|
||||
<div class="label">
|
||||
是否固定
|
||||
模式
|
||||
</div>
|
||||
<el-switch v-model="settingsStore.topbar.fixed" />
|
||||
<el-radio-group v-model="settingsStore.topbar.mode" size="small">
|
||||
<el-radio-button label="static">
|
||||
静止
|
||||
</el-radio-button>
|
||||
<el-radio-button label="fixed">
|
||||
固定
|
||||
</el-radio-button>
|
||||
<el-radio-button label="sticky">
|
||||
粘性
|
||||
</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<el-divider>工具栏</el-divider>
|
||||
<div v-if="settingsStore.mode === 'pc'" class="setting-item">
|
||||
|
||||
@@ -30,10 +30,10 @@ function handlerMouserScroll(event: WheelEvent) {
|
||||
<template v-for="(item, index) in menuStore.allMenus" :key="index">
|
||||
<div v-if="item.children && item.children.length !== 0" class="item-container" :class="{ active: index === menuStore.actived }">
|
||||
<div class="item" @click="switchTo(index)">
|
||||
<el-icon>
|
||||
<svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
|
||||
<el-icon v-if="item.meta?.icon">
|
||||
<svg-icon :name="item.meta.icon" />
|
||||
</el-icon>
|
||||
<span v-if="item.meta.title">{{ item.meta.title }}</span>
|
||||
<span v-if="item.meta?.title">{{ item.meta.title }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -19,12 +19,12 @@ const { switchTo } = useMenu()
|
||||
<div
|
||||
v-if="item.children && item.children.length !== 0" :key="index" class="item" :class="{
|
||||
active: index === menuStore.actived,
|
||||
}" :title="item.meta.title" @click="switchTo(index)"
|
||||
}" :title="item.meta?.title ?? '[ 无标题 ]'" @click="switchTo(index)"
|
||||
>
|
||||
<el-icon>
|
||||
<svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
|
||||
<el-icon v-if="item.meta?.icon">
|
||||
<svg-icon :name="item.meta.icon" />
|
||||
</el-icon>
|
||||
<span>{{ item.meta.title }}</span>
|
||||
<span>{{ item.meta?.title ?? '[ 无标题 ]' }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<script lang="ts" setup name="Search">
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
import hotkeys from 'hotkeys-js'
|
||||
import { isExternalLink } from '@/utils'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
import eventBus from '@/utils/eventBus'
|
||||
import useSettingsStore from '@/store/modules/settings'
|
||||
import useRouteStore from '@/store/modules/route'
|
||||
import useMenuStore from '@/store/modules/menu'
|
||||
import type { Menu, Route } from '@/global'
|
||||
import type { Menu, Route } from '#/global'
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
@@ -15,10 +15,11 @@ const routeStore = useRouteStore()
|
||||
const menuStore = useMenuStore()
|
||||
|
||||
interface listTypes {
|
||||
icon?: string
|
||||
title: string
|
||||
breadcrumb: string[]
|
||||
path: string
|
||||
icon?: string
|
||||
title?: string | Function
|
||||
link?: string
|
||||
breadcrumb: (string | Function | undefined)[]
|
||||
}
|
||||
|
||||
const isShow = ref(false)
|
||||
@@ -38,13 +39,37 @@ const resultList = computed(() => {
|
||||
let result = []
|
||||
result = sourceList.value.filter((item) => {
|
||||
let flag = false
|
||||
if (item.title.includes(searchInput.value)) {
|
||||
flag = true
|
||||
if (item.title) {
|
||||
if (typeof item.title === 'function') {
|
||||
if (item.title().includes(searchInput.value)) {
|
||||
flag = true
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (item.title.includes(searchInput.value)) {
|
||||
flag = true
|
||||
}
|
||||
}
|
||||
}
|
||||
if (item.path.includes(searchInput.value)) {
|
||||
flag = true
|
||||
}
|
||||
if (item.breadcrumb.some(b => b.includes(searchInput.value))) {
|
||||
if (item.breadcrumb.some((b) => {
|
||||
let flag = false
|
||||
if (b) {
|
||||
if (typeof b === 'function') {
|
||||
if (b().includes(searchInput.value)) {
|
||||
flag = true
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (b.includes(searchInput.value)) {
|
||||
flag = true
|
||||
}
|
||||
}
|
||||
}
|
||||
return flag
|
||||
})) {
|
||||
flag = true
|
||||
}
|
||||
return flag
|
||||
@@ -109,52 +134,46 @@ onMounted(() => {
|
||||
}
|
||||
})
|
||||
|
||||
function hasChildren(item: Route.recordRaw) {
|
||||
function hasChildren(item: RouteRecordRaw) {
|
||||
let flag = true
|
||||
if (item.children && item.children.every(i => i.meta.sidebar === false)) {
|
||||
if (item.children?.every(i => i.meta?.sidebar === false)) {
|
||||
flag = false
|
||||
}
|
||||
return flag
|
||||
}
|
||||
function getSourceList(arr: Route.recordRaw[], basePath?: string, icon?: string, breadcrumb?: string[]) {
|
||||
function getSourceList(arr: RouteRecordRaw[], basePath?: string, icon?: string, breadcrumb?: (string | Function | undefined)[]) {
|
||||
arr.forEach((item) => {
|
||||
if (item.meta.sidebar !== false) {
|
||||
if (item.meta?.sidebar !== false) {
|
||||
const breadcrumbTemp = cloneDeep(breadcrumb) || []
|
||||
if (item.children && hasChildren(item)) {
|
||||
breadcrumbTemp.push(typeof item.meta.title === 'function' ? item.meta.title() : item.meta.title)
|
||||
getSourceList(item.children, basePath ? [basePath, item.path].join('/') : item.path, item.meta.icon || icon, breadcrumbTemp)
|
||||
breadcrumbTemp.push(item.meta?.title)
|
||||
getSourceList(item.children, basePath ? [basePath, item.path].join('/') : item.path, item.meta?.icon ?? icon, breadcrumbTemp)
|
||||
}
|
||||
else {
|
||||
breadcrumbTemp.push(typeof item.meta.title === 'function' ? item.meta.title() : item.meta.title)
|
||||
let path = ''
|
||||
if (isExternalLink(item.path)) {
|
||||
path = item.path
|
||||
}
|
||||
else {
|
||||
path = basePath ? [basePath, item.path].join('/') : item.path
|
||||
}
|
||||
breadcrumbTemp.push(item.meta?.title)
|
||||
sourceList.value.push({
|
||||
icon: item.meta.icon || icon,
|
||||
title: typeof item.meta.title === 'function' ? item.meta.title() : item.meta.title,
|
||||
path: basePath ? [basePath, item.path].join('/') : item.path,
|
||||
icon: item.meta?.icon ?? icon,
|
||||
title: item.meta?.title,
|
||||
link: item.meta?.link,
|
||||
breadcrumb: breadcrumbTemp,
|
||||
path,
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
function getSourceListByMenus(arr: Menu.recordRaw[], icon?: string, breadcrumb?: string[]) {
|
||||
function getSourceListByMenus(arr: Menu.recordRaw[], icon?: string, breadcrumb?: (string | Function | undefined)[]) {
|
||||
arr.forEach((item) => {
|
||||
const breadcrumbTemp = cloneDeep(breadcrumb) || []
|
||||
if (item.children && item.children.length > 0) {
|
||||
breadcrumbTemp.push(item.meta.title)
|
||||
getSourceListByMenus(item.children, item.meta.icon, breadcrumbTemp)
|
||||
breadcrumbTemp.push(item.meta?.title)
|
||||
getSourceListByMenus(item.children, item.meta?.icon ?? icon, breadcrumbTemp)
|
||||
}
|
||||
else {
|
||||
breadcrumbTemp.push(item.meta.title)
|
||||
breadcrumbTemp.push(item.meta?.title)
|
||||
sourceList.value.push({
|
||||
icon: item.meta.icon || icon,
|
||||
title: item.meta.title,
|
||||
icon: item.meta?.icon ?? icon,
|
||||
title: item.meta?.title,
|
||||
path: item.path as string,
|
||||
breadcrumb: breadcrumbTemp,
|
||||
})
|
||||
@@ -205,12 +224,12 @@ function handleScroll() {
|
||||
})
|
||||
}
|
||||
|
||||
function pageJump(url: string) {
|
||||
if (isExternalLink(url)) {
|
||||
window.open(url, 'top')
|
||||
function pageJump(path: listTypes['path'], link: listTypes['link']) {
|
||||
if (link) {
|
||||
window.open(link, '_blank')
|
||||
}
|
||||
else {
|
||||
router.push(url)
|
||||
router.push(path)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -228,48 +247,60 @@ function pageJump(url: string) {
|
||||
</el-input>
|
||||
<div v-if="settingsStore.mode === 'pc'" class="tips">
|
||||
<div class="tip">
|
||||
<span>Alt</span>+<span>S</span>
|
||||
唤醒搜索面板
|
||||
<el-tag type="info" size="large">
|
||||
Alt + S
|
||||
</el-tag>
|
||||
<el-tag type="info" size="large">
|
||||
唤醒搜索面板
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="tip">
|
||||
<span>
|
||||
<el-tag type="info" size="large">
|
||||
<el-icon>
|
||||
<svg-icon name="search-up" />
|
||||
</el-icon>
|
||||
</span>
|
||||
<span>
|
||||
</el-tag>
|
||||
<el-tag type="info" size="large">
|
||||
<el-icon>
|
||||
<svg-icon name="search-down" />
|
||||
</el-icon>
|
||||
</span>
|
||||
切换搜索结果
|
||||
</el-tag>
|
||||
<el-tag type="info" size="large">
|
||||
切换搜索结果
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="tip">
|
||||
<span>
|
||||
<el-tag type="info" size="large">
|
||||
<el-icon>
|
||||
<svg-icon name="search-enter" />
|
||||
</el-icon>
|
||||
</span>
|
||||
访问页面
|
||||
</el-tag>
|
||||
<el-tag type="info" size="large">
|
||||
访问页面
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="tip">
|
||||
<span>ESC</span>
|
||||
退出
|
||||
<el-tag type="info" size="large">
|
||||
ESC
|
||||
</el-tag>
|
||||
<el-tag type="info" size="large">
|
||||
退出
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ref="searchResultRef" class="result" :class="{ mobile: settingsStore.mode === 'mobile' }">
|
||||
<a v-for="(item, index) in resultList" :key="item.path" :ref="setSearchResultItemRef" class="item" :class="{ actived: index === actived }" @click="pageJump(item.path)" @mouseover="actived = index">
|
||||
<div ref="searchResultRef" class="result">
|
||||
<a v-for="(item, index) in resultList" :key="item.path" :ref="setSearchResultItemRef" class="item" :class="{ actived: index === actived }" @click="pageJump(item.path, item.link)" @mouseover="actived = index">
|
||||
<el-icon class="icon">
|
||||
<svg-icon v-if="item.icon" :name="item.icon" />
|
||||
</el-icon>
|
||||
<div class="info">
|
||||
<div class="title">
|
||||
{{ item.title }}
|
||||
{{ item.title ?? '[ 无标题 ]' }}
|
||||
</div>
|
||||
<div class="breadcrumb">
|
||||
<span v-for="(bc, bcIndex) in item.breadcrumb" :key="bcIndex">
|
||||
{{ bc }}
|
||||
{{ bc ?? '[ 无标题 ]' }}
|
||||
<el-icon>
|
||||
<svg-icon name="ep:arrow-right" />
|
||||
</el-icon>
|
||||
@@ -291,10 +322,10 @@ function pageJump(url: string) {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: var(--el-overlay-color-lighter);
|
||||
backdrop-filter: blur(10px);
|
||||
background-image: radial-gradient(transparent 1px, rgb(0 0 0 / 30%) 1px);
|
||||
background-size: 4px 4px;
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
transition: all 0.2s;
|
||||
transform: translateZ(0);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
|
||||
@@ -319,7 +350,7 @@ function pageJump(url: string) {
|
||||
filter: blur(10px);
|
||||
|
||||
.search-box {
|
||||
margin: 50px 20px 40px;
|
||||
margin: 50px 20px 20px;
|
||||
|
||||
:deep(.el-input__inner) {
|
||||
height: 52px;
|
||||
@@ -335,39 +366,39 @@ function pageJump(url: string) {
|
||||
|
||||
.tips {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
margin-top: 20px;
|
||||
line-height: 24px;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
justify-content: center;
|
||||
padding-top: 20px;
|
||||
font-weight: bold;
|
||||
|
||||
span {
|
||||
margin: 0 5px;
|
||||
padding: 3px 8px 5px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
color: var(--el-text-color-primary);
|
||||
background-color: var(--el-fill-color);
|
||||
box-shadow: inset 0 -2px var(--el-fill-color-lighter), inset 0 0 1px 1px var(--el-fill-color-darker);
|
||||
.tip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 20px;
|
||||
|
||||
.el-tag {
|
||||
margin: 0 5px;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.result {
|
||||
position: relative;
|
||||
margin: 0 20px;
|
||||
max-height: calc(100% - 250px);
|
||||
margin: 0 20px 50px;
|
||||
border-radius: 5px;
|
||||
overflow: auto;
|
||||
background-color: var(--el-bg-color);
|
||||
box-shadow: 0 0 0 1px var(--el-border-color-darker);
|
||||
|
||||
&.mobile {
|
||||
max-height: calc(100% - 200px);
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<script lang="ts" setup name="SidebarItem">
|
||||
// import SidebarItem from './index.vue'
|
||||
import { isExternalLink, resolveRoutePath } from '@/utils'
|
||||
import { resolveRoutePath } from '@/utils'
|
||||
import useSettingsStore from '@/store/modules/settings'
|
||||
import type { Menu } from '@/global'
|
||||
import type { Menu } from '#/global'
|
||||
|
||||
const props = defineProps({
|
||||
item: {
|
||||
@@ -20,7 +20,7 @@ const settingsStore = useSettingsStore()
|
||||
const hasChildren = computed(() => {
|
||||
let flag = true
|
||||
if (props.item.children) {
|
||||
if (props.item.children.every(item => item.meta.sidebar === false)) {
|
||||
if (props.item.children.every(item => item.meta?.sidebar === false)) {
|
||||
flag = false
|
||||
}
|
||||
}
|
||||
@@ -33,25 +33,25 @@ const hasChildren = computed(() => {
|
||||
|
||||
<template>
|
||||
<div class="sidebar-item">
|
||||
<router-link v-if="!hasChildren" v-slot="{ href, navigate, isActive, isExactActive }" custom :to="resolveRoutePath(basePath, item.path || '')">
|
||||
<a :href="isExternalLink(resolveRoutePath(basePath, item.path || '')) ? resolveRoutePath(basePath, item.path || '') : href" :class="[isActive && 'router-link-active', isExactActive && 'router-link-exact-active']" :target="isExternalLink(resolveRoutePath(basePath, item.path || '')) ? '_blank' : '_self'" @click="navigate">
|
||||
<el-menu-item :title="item.meta.title" :index="resolveRoutePath(basePath, item.path || '')">
|
||||
<el-icon v-if="item.meta.icon" class="title-icon">
|
||||
<router-link v-if="!hasChildren" v-slot="{ href, navigate, isActive, isExactActive }" custom :to="resolveRoutePath(basePath, item.path)">
|
||||
<a :href="item.meta?.link ? item.meta.link : href" :class="[isActive && 'router-link-active', isExactActive && 'router-link-exact-active']" :target="item.meta?.link ? '_blank' : '_self'" @click="navigate">
|
||||
<el-menu-item :title="item.meta?.title ?? '[ 无标题 ]'" :index="resolveRoutePath(basePath, item.path || '')">
|
||||
<el-icon v-if="item.meta?.icon" class="title-icon">
|
||||
<svg-icon :name="item.meta.icon" />
|
||||
</el-icon>
|
||||
<span class="title">{{ item.meta.title }}</span>
|
||||
<span class="title">{{ item.meta?.title ?? '[ 无标题 ]' }}</span>
|
||||
</el-menu-item>
|
||||
</a>
|
||||
</router-link>
|
||||
<el-sub-menu v-else :title="item.meta.title" :index="settingsStore.app.routeBaseOn !== 'filesystem' ? resolveRoutePath(basePath, item.path || '') : JSON.stringify(item)">
|
||||
<el-sub-menu v-else :title="item.meta?.title ?? '[ 无标题 ]'" :index="settingsStore.app.routeBaseOn !== 'filesystem' ? resolveRoutePath(basePath, item.path) : JSON.stringify(item)">
|
||||
<template #title>
|
||||
<el-icon v-if="item.meta.icon" class="title-icon">
|
||||
<el-icon v-if="item.meta?.icon" class="title-icon">
|
||||
<svg-icon :name="item.meta.icon" />
|
||||
</el-icon>
|
||||
<span class="title">{{ item.meta.title }}</span>
|
||||
<span class="title">{{ item.meta?.title ?? '[ 无标题 ]' }}</span>
|
||||
</template>
|
||||
<template v-for="route in item.children">
|
||||
<SidebarItem v-if="route.meta.sidebar !== false" :key="route.path" :item="route" :base-path="resolveRoutePath(basePath, item.path || '')" />
|
||||
<SidebarItem v-if="route.meta?.sidebar !== false" :key="route.path" :item="route" :base-path="resolveRoutePath(basePath, item.path)" />
|
||||
</template>
|
||||
</el-sub-menu>
|
||||
</div>
|
||||
|
||||
@@ -30,7 +30,7 @@ function onSidebarScroll(e: Event) {
|
||||
>
|
||||
<transition-group name="sub-sidebar">
|
||||
<template v-for="(route, index) in menuStore.sidebarMenus">
|
||||
<SidebarItem v-if="route.meta.sidebar !== false" :key="route.path || index" :item="route" :base-path="route.path" />
|
||||
<SidebarItem v-if="route.meta?.sidebar !== false" :key="route.path || index" :item="route" :base-path="route.path" />
|
||||
</template>
|
||||
</transition-group>
|
||||
</el-menu>
|
||||
|
||||
@@ -37,7 +37,7 @@ function userCommand(command: 'home' | 'setting' | 'hotkeys' | 'logout') {
|
||||
}
|
||||
}
|
||||
function pro() {
|
||||
window.open('https://hooray.gitee.io/fantastic-admin-pro-example/', 'top')
|
||||
window.open('https://hooray.gitee.io/fantastic-admin-pro-example/', '_blank')
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -29,6 +29,7 @@ const breadcrumbList = computed(() => {
|
||||
})
|
||||
|
||||
const scrollTop = ref(0)
|
||||
const scrollOnHide = ref(false)
|
||||
onMounted(() => {
|
||||
window.addEventListener('scroll', onScroll)
|
||||
})
|
||||
@@ -36,8 +37,12 @@ onUnmounted(() => {
|
||||
window.removeEventListener('scroll', onScroll)
|
||||
})
|
||||
function onScroll() {
|
||||
scrollTop.value = document.documentElement.scrollTop || document.body.scrollTop
|
||||
scrollTop.value = (document.documentElement || document.body).scrollTop
|
||||
}
|
||||
watch(scrollTop, (val, oldVal) => {
|
||||
const topbarHeight = parseInt(getComputedStyle(document.documentElement || document.body).getPropertyValue('--g-topbar-height'))
|
||||
scrollOnHide.value = settingsStore.topbar.mode === 'sticky' && val > oldVal && val > topbarHeight
|
||||
})
|
||||
|
||||
function pathCompile(path: string) {
|
||||
const toPath = compile(path)
|
||||
@@ -48,8 +53,9 @@ function pathCompile(path: string) {
|
||||
<template>
|
||||
<div
|
||||
class="topbar-container" :class="{
|
||||
fixed: settingsStore.topbar.fixed,
|
||||
[`topbar-${settingsStore.topbar.mode}`]: true,
|
||||
shadow: scrollTop,
|
||||
hide: scrollOnHide,
|
||||
}" data-fixed-calc-width
|
||||
>
|
||||
<div class="left-box">
|
||||
@@ -61,7 +67,7 @@ function pathCompile(path: string) {
|
||||
<el-breadcrumb v-if="settingsStore.breadcrumb.enable && settingsStore.mode === 'pc' && settingsStore.app.routeBaseOn !== 'filesystem'">
|
||||
<transition-group name="breadcrumb">
|
||||
<el-breadcrumb-item v-for="(item, index) in breadcrumbList" :key="item.path" :to="index < breadcrumbList.length - 1 ? pathCompile(item.path) : ''">
|
||||
{{ item.title }}
|
||||
{{ item.title ?? '[ 无标题 ]' }}
|
||||
</el-breadcrumb-item>
|
||||
</transition-group>
|
||||
</el-breadcrumb>
|
||||
@@ -82,7 +88,8 @@ function pathCompile(path: string) {
|
||||
background-color: var(--g-toolbar-bg);
|
||||
transition: width 0.3s, top 0.3s, transform 0.3s, background-color 0.3s, var(--el-transition-box-shadow);
|
||||
|
||||
&.fixed {
|
||||
&.topbar-fixed,
|
||||
&.topbar-sticky {
|
||||
position: fixed;
|
||||
|
||||
&.shadow {
|
||||
@@ -90,6 +97,10 @@ function pathCompile(path: string) {
|
||||
}
|
||||
}
|
||||
|
||||
&.topbar-sticky.hide {
|
||||
top: calc(var(--g-topbar-height) * -1) !important;
|
||||
}
|
||||
|
||||
.left-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -0,0 +1,97 @@
|
||||
<script lang="ts" setup name="LinkView">
|
||||
const route = useRoute()
|
||||
|
||||
function open() {
|
||||
window.open(route.meta.link, '_blank')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="link-view">
|
||||
<transition name="link" mode="out-in" appear>
|
||||
<page-main :key="route.meta.link" title="⚠️访问提醒">
|
||||
<div class="container">
|
||||
<div class="title">
|
||||
是否访问此链接
|
||||
</div>
|
||||
<div class="link">
|
||||
{{ route.meta.link }}
|
||||
</div>
|
||||
<el-button type="primary" plain round @click="open">
|
||||
<template #icon>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:link" />
|
||||
</el-icon>
|
||||
</template>
|
||||
立即访问
|
||||
</el-button>
|
||||
</div>
|
||||
</page-main>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.link-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.page-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
margin: 0 50px;
|
||||
|
||||
.title {
|
||||
margin: 10px 0;
|
||||
font-size: 22px;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
.link {
|
||||
margin: 10px 0;
|
||||
max-width: 300px;
|
||||
font-size: 14px;
|
||||
color: var(--el-text-color-disabled);
|
||||
|
||||
@include text-overflow(3);
|
||||
}
|
||||
|
||||
.el-button {
|
||||
margin: 20px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// link 区动画
|
||||
.link-enter-active {
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.link-leave-active {
|
||||
transition: 0.15s;
|
||||
}
|
||||
|
||||
.link-enter-from {
|
||||
opacity: 0;
|
||||
transform: translateX(-20px);
|
||||
}
|
||||
|
||||
.link-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(20px);
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,6 @@
|
||||
<script lang="ts" setup name="Layout">
|
||||
import hotkeys from 'hotkeys-js'
|
||||
import LinkView from './components/views/link.vue'
|
||||
import Header from './components/Header/index.vue'
|
||||
import MainSidebar from './components/MainSidebar/index.vue'
|
||||
import SubSidebar from './components/SubSidebar/index.vue'
|
||||
@@ -17,6 +18,8 @@ const settingsStore = useSettingsStore()
|
||||
const keepAliveStore = useKeepAliveStore()
|
||||
const menuStore = useMenuStore()
|
||||
|
||||
const isLink = computed(() => !!routeInfo.meta.link)
|
||||
|
||||
watch(() => settingsStore.menu.subMenuCollapse, (val) => {
|
||||
if (settingsStore.mode === 'mobile') {
|
||||
if (!val) {
|
||||
@@ -72,10 +75,11 @@ onUnmounted(() => {
|
||||
<router-view v-slot="{ Component, route }">
|
||||
<transition name="main" mode="out-in" appear>
|
||||
<keep-alive :include="keepAliveStore.list">
|
||||
<component :is="Component" :key="route.fullPath" />
|
||||
<component :is="Component" v-show="!isLink" :key="route.fullPath" />
|
||||
</keep-alive>
|
||||
</transition>
|
||||
</router-view>
|
||||
<LinkView v-if="isLink" />
|
||||
</div>
|
||||
<Copyright />
|
||||
</div>
|
||||
@@ -148,10 +152,10 @@ onUnmounted(() => {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
backdrop-filter: blur(2px);
|
||||
background-image: radial-gradient(transparent 1px, rgb(0 0 0 / 30%) 1px);
|
||||
background-size: 4px 4px;
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
transition: all 0.2s;
|
||||
transform: translateZ(0);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
|
||||
|
||||
+3
-3
@@ -13,14 +13,14 @@ import 'virtual:svg-icons-register'
|
||||
import '@/assets/styles/globals.scss'
|
||||
// 加载 iconify 图标(element plus)
|
||||
import { downloadAndInstall } from '@/iconify-ep'
|
||||
if (useSettingsStore().app.iconifyOfflineUse) {
|
||||
downloadAndInstall()
|
||||
}
|
||||
|
||||
const app = createApp(App)
|
||||
app.use(ElementPlus)
|
||||
app.use(pinia)
|
||||
app.use(router)
|
||||
directive(app)
|
||||
if (useSettingsStore().app.iconifyOfflineUse) {
|
||||
downloadAndInstall()
|
||||
}
|
||||
|
||||
app.mount('#app')
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
import MultilevelMenuExample from './modules/multilevel.menu.example'
|
||||
|
||||
import type { Menu } from '@/global'
|
||||
import type { Menu } from '#/global'
|
||||
|
||||
const menu: Menu.recordMainRaw[] = [
|
||||
{
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import type { Menu } from '@/global'
|
||||
import type { Menu } from '#/global'
|
||||
|
||||
const menus: Menu.recordRaw = {
|
||||
meta: {
|
||||
|
||||
+6
-1
@@ -119,7 +119,12 @@ router.afterEach((to, from) => {
|
||||
const keepAliveStore = useKeepAliveStore()
|
||||
settingsStore.app.enableProgress && (isLoading.value = false)
|
||||
// 设置页面 title
|
||||
to.meta.title && settingsStore.setTitle(typeof to.meta.title === 'function' ? to.meta.title() : to.meta.title)
|
||||
if (settingsStore.app.routeBaseOn !== 'filesystem') {
|
||||
settingsStore.setTitle(to.meta.breadcrumbNeste?.at(-1)?.title)
|
||||
}
|
||||
else {
|
||||
settingsStore.setTitle(to.meta.title)
|
||||
}
|
||||
// 判断当前页面是否开启缓存,如果开启,则将当前页面的 name 信息存入 keep-alive 全局状态
|
||||
if (to.meta.cache) {
|
||||
const componentName = to.matched.at(-1)?.components?.default.name
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import type { Route } from '@/global'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
|
||||
const Layout = () => import('@/layouts/index.vue')
|
||||
|
||||
const routes: Route.recordRaw = {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/breadcrumb_example',
|
||||
component: Layout,
|
||||
redirect: '/breadcrumb_example/list1',
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import type { Route } from '@/global'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
|
||||
const Layout = () => import('@/layouts/index.vue')
|
||||
|
||||
const routes: Route.recordRaw = {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/multilevel_menu_example',
|
||||
component: Layout,
|
||||
redirect: '/multilevel_menu_example/page',
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
import { setupLayouts } from 'virtual:generated-layouts'
|
||||
import generatedRoutes from 'virtual:generated-pages'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
import MultilevelMenuExample from './modules/multilevel.menu.example'
|
||||
import BreadcrumbExample from './modules/breadcrumb.example'
|
||||
import type { Route } from '@/global'
|
||||
import type { Route } from '#/global'
|
||||
import useSettingsStore from '@/store/modules/settings'
|
||||
|
||||
// 固定路由(默认路由)
|
||||
const constantRoutes: Route.recordRaw[] = [
|
||||
const constantRoutes: RouteRecordRaw[] = [
|
||||
{
|
||||
path: '/login',
|
||||
name: 'login',
|
||||
@@ -26,7 +27,7 @@ const constantRoutes: Route.recordRaw[] = [
|
||||
]
|
||||
|
||||
// 系统路由
|
||||
const systemRoutes: Route.recordRaw[] = [
|
||||
const systemRoutes: RouteRecordRaw[] = [
|
||||
{
|
||||
path: '/',
|
||||
component: () => import('@/layouts/index.vue'),
|
||||
@@ -94,7 +95,7 @@ const constantRoutesByFilesystem = generatedRoutes.filter((item) => {
|
||||
|
||||
const asyncRoutesByFilesystem = setupLayouts(generatedRoutes.filter((item) => {
|
||||
return item.meta?.enabled !== false && item.meta?.constant !== true && item.meta?.layout !== false
|
||||
})) as Route.recordRaw[]
|
||||
}))
|
||||
|
||||
export {
|
||||
constantRoutes,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// 该文件为系统默认配置,请勿修改!!!
|
||||
|
||||
import type { RecursiveRequired, Settings } from './global'
|
||||
import type { RecursiveRequired, Settings } from '#/global'
|
||||
|
||||
const globalSettingsDefault: RecursiveRequired<Settings.all> = {
|
||||
app: {
|
||||
@@ -29,7 +29,7 @@ const globalSettingsDefault: RecursiveRequired<Settings.all> = {
|
||||
enableHotkeys: false,
|
||||
},
|
||||
topbar: {
|
||||
fixed: true,
|
||||
mode: 'static',
|
||||
},
|
||||
toolbar: {
|
||||
enableFullscreen: false,
|
||||
|
||||
+1
-1
@@ -1,4 +1,4 @@
|
||||
import type { Settings } from './global'
|
||||
import type { Settings } from '#/global'
|
||||
|
||||
const globalSettings: Settings.all = {}
|
||||
|
||||
|
||||
+35
-52
@@ -2,7 +2,7 @@ import { cloneDeep } from 'lodash-es'
|
||||
import useSettingsStore from './settings'
|
||||
import useUserStore from './user'
|
||||
import useRouteStore from './route'
|
||||
import type { Menu } from '@/global'
|
||||
import type { Menu } from '#/global'
|
||||
|
||||
import { resolveRoutePath } from '@/utils'
|
||||
import api from '@/api'
|
||||
@@ -10,28 +10,18 @@ import menu from '@/menu'
|
||||
|
||||
function getDeepestPath(menu: Menu.recordRaw, rootPath = '') {
|
||||
let retnPath = ''
|
||||
if (menu.path !== undefined) {
|
||||
if (menu.children) {
|
||||
if (
|
||||
menu.children.some((item) => {
|
||||
return item.meta.sidebar !== false
|
||||
})
|
||||
) {
|
||||
for (let i = 0; i < menu.children.length; i++) {
|
||||
if (menu.children[i].meta.sidebar !== false) {
|
||||
retnPath = getDeepestPath(menu.children[i], resolveRoutePath(rootPath, menu.path))
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
retnPath = getDeepestPath(menu.children[0], resolveRoutePath(rootPath, menu.path))
|
||||
}
|
||||
if (menu.children) {
|
||||
const item = menu.children.find(item => item.meta?.sidebar !== false)
|
||||
if (item) {
|
||||
retnPath = getDeepestPath(item, resolveRoutePath(rootPath, menu.path))
|
||||
}
|
||||
else {
|
||||
retnPath = resolveRoutePath(rootPath, menu.path)
|
||||
retnPath = getDeepestPath(menu.children[0], resolveRoutePath(rootPath, menu.path))
|
||||
}
|
||||
}
|
||||
else {
|
||||
retnPath = resolveRoutePath(rootPath, menu.path)
|
||||
}
|
||||
return retnPath
|
||||
}
|
||||
|
||||
@@ -39,9 +29,9 @@ function hasPermission(permissions: string[], menu: Menu.recordMainRaw | Menu.re
|
||||
let isAuth = false
|
||||
if (menu.meta && menu.meta.auth) {
|
||||
isAuth = permissions.some((auth) => {
|
||||
return typeof menu.meta.auth === 'string'
|
||||
return typeof menu.meta?.auth === 'string'
|
||||
? menu.meta.auth === auth
|
||||
: typeof menu.meta.auth === 'object'
|
||||
: typeof menu.meta?.auth === 'object'
|
||||
? menu.meta.auth.includes(auth)
|
||||
: false
|
||||
})
|
||||
@@ -72,7 +62,7 @@ function filterAsyncMenus<T extends Menu.recordMainRaw[] | Menu.recordRaw[]>(men
|
||||
function getDefaultOpenedPaths(menus: Menu.recordRaw[], rootPath = '') {
|
||||
const defaultOpenedPaths: string[] = []
|
||||
menus.forEach((item) => {
|
||||
if (item.path && item.meta.defaultOpened && item.children) {
|
||||
if (item.meta?.defaultOpened && item.children) {
|
||||
defaultOpenedPaths.push(resolveRoutePath(rootPath, item.path))
|
||||
const childrenDefaultOpenedPaths = getDefaultOpenedPaths(item.children, resolveRoutePath(rootPath, item.path))
|
||||
if (childrenDefaultOpenedPaths.length > 0) {
|
||||
@@ -142,45 +132,38 @@ const useMenuStore = defineStore(
|
||||
},
|
||||
actions: {
|
||||
// 生成导航(前端生成)
|
||||
generateMenusAtFront() {
|
||||
// eslint-disable-next-line no-async-promise-executor
|
||||
return new Promise<void>(async (resolve) => {
|
||||
async generateMenusAtFront() {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedMenus
|
||||
// 如果权限功能开启,则需要对导航数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedMenus = filterAsyncMenus(menu, permissions)
|
||||
}
|
||||
else {
|
||||
accessedMenus = cloneDeep(menu)
|
||||
}
|
||||
this.menus = accessedMenus.filter(item => item.children.length !== 0)
|
||||
},
|
||||
// 生成导航(后端生成)
|
||||
async generateMenusAtBack() {
|
||||
await api.get('menu/list', {
|
||||
baseURL: '/mock/',
|
||||
}).then(async (res) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedMenus
|
||||
let accessedMenus: Menu.recordMainRaw[]
|
||||
// 如果权限功能开启,则需要对导航数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedMenus = filterAsyncMenus(menu, permissions)
|
||||
accessedMenus = filterAsyncMenus(res.data, permissions)
|
||||
}
|
||||
else {
|
||||
accessedMenus = cloneDeep(menu)
|
||||
accessedMenus = cloneDeep(res.data)
|
||||
}
|
||||
this.menus = accessedMenus.filter(item => item.children.length !== 0)
|
||||
resolve()
|
||||
})
|
||||
},
|
||||
// 生成导航(后端生成)
|
||||
generateMenusAtBack() {
|
||||
return new Promise<void>((resolve) => {
|
||||
api.get('menu/list', {
|
||||
baseURL: '/mock/',
|
||||
}).then(async (res) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedMenus: Menu.recordMainRaw[]
|
||||
// 如果权限功能开启,则需要对导航数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedMenus = filterAsyncMenus(res.data, permissions)
|
||||
}
|
||||
else {
|
||||
accessedMenus = cloneDeep(res.data)
|
||||
}
|
||||
this.menus = accessedMenus.filter(item => item.children.length !== 0)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 切换主导航
|
||||
setActived(data: number | string) {
|
||||
|
||||
+63
-67
@@ -1,18 +1,19 @@
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
import useSettingsStore from './settings'
|
||||
import useUserStore from './user'
|
||||
import api from '@/api'
|
||||
import { resolveRoutePath } from '@/utils'
|
||||
import { systemRoutes } from '@/router/routes'
|
||||
import type { Route } from '@/global'
|
||||
import type { Route } from '#/global'
|
||||
|
||||
function hasPermission(permissions: string[], route: Route.recordMainRaw | Route.recordRaw) {
|
||||
function hasPermission(permissions: string[], route: Route.recordMainRaw | RouteRecordRaw) {
|
||||
let isAuth = false
|
||||
if (route.meta?.auth) {
|
||||
isAuth = permissions.some((auth) => {
|
||||
return typeof route.meta.auth === 'string'
|
||||
return typeof route.meta?.auth === 'string'
|
||||
? route.meta.auth === auth
|
||||
: typeof route.meta.auth === 'object'
|
||||
: typeof route.meta?.auth === 'object'
|
||||
? route.meta.auth.includes(auth)
|
||||
: false
|
||||
})
|
||||
@@ -23,7 +24,7 @@ function hasPermission(permissions: string[], route: Route.recordMainRaw | Route
|
||||
return isAuth
|
||||
}
|
||||
|
||||
function filterAsyncRoutes<T extends Route.recordMainRaw[] | Route.recordRaw[]>(routes: T, permissions: string[]): T {
|
||||
function filterAsyncRoutes<T extends Route.recordMainRaw[] | RouteRecordRaw[]>(routes: T, permissions: string[]): T {
|
||||
const res: any = []
|
||||
routes.forEach((route) => {
|
||||
if (hasPermission(permissions, route)) {
|
||||
@@ -59,31 +60,34 @@ function formatBackRoutes(routes: any, views = import.meta.glob('../../views/**/
|
||||
}
|
||||
|
||||
// 将多层嵌套路由处理成两层,保留顶层和最子层路由,中间层级将被拍平
|
||||
function flatAsyncRoutes<T extends Route.recordRaw>(routes: T): T {
|
||||
function flatAsyncRoutes<T extends RouteRecordRaw>(routes: T): T {
|
||||
if (routes.children) {
|
||||
routes.children = flatAsyncRoutesRecursive(routes.children, [{
|
||||
path: routes.path,
|
||||
title: routes.meta.title,
|
||||
hide: !routes.meta.breadcrumb && routes.meta.breadcrumb === false,
|
||||
title: routes.meta?.title,
|
||||
hide: !routes.meta?.breadcrumb && routes.meta?.breadcrumb === false,
|
||||
}], routes.path)
|
||||
}
|
||||
return routes
|
||||
}
|
||||
function flatAsyncRoutesRecursive(routes: Route.recordRaw[], breadcrumb: Route.breadcrumb[] = [], baseUrl = ''): Route.recordRaw[] {
|
||||
const res: Route.recordRaw[] = []
|
||||
function flatAsyncRoutesRecursive(routes: RouteRecordRaw[], breadcrumb: Route.breadcrumb[] = [], baseUrl = ''): RouteRecordRaw[] {
|
||||
const res: RouteRecordRaw[] = []
|
||||
routes.forEach((route) => {
|
||||
if (route.children) {
|
||||
const childrenBaseUrl = resolveRoutePath(baseUrl, route.path)
|
||||
const tmpBreadcrumb = cloneDeep(breadcrumb)
|
||||
if (route.meta.breadcrumb !== false) {
|
||||
if (route.meta?.breadcrumb !== false) {
|
||||
tmpBreadcrumb.push({
|
||||
path: childrenBaseUrl,
|
||||
title: route.meta.title,
|
||||
hide: !route.meta.breadcrumb && route.meta.breadcrumb === false,
|
||||
title: route.meta?.title,
|
||||
hide: !route.meta?.breadcrumb,
|
||||
})
|
||||
}
|
||||
const tmpRoute = cloneDeep(route)
|
||||
tmpRoute.path = childrenBaseUrl
|
||||
if (!tmpRoute.meta) {
|
||||
tmpRoute.meta = {}
|
||||
}
|
||||
tmpRoute.meta.breadcrumbNeste = tmpBreadcrumb
|
||||
delete tmpRoute.children
|
||||
res.push(tmpRoute)
|
||||
@@ -109,9 +113,12 @@ function flatAsyncRoutesRecursive(routes: Route.recordRaw[], breadcrumb: Route.b
|
||||
const tmpBreadcrumb = cloneDeep(breadcrumb)
|
||||
tmpBreadcrumb.push({
|
||||
path: tmpRoute.path,
|
||||
title: tmpRoute.meta.title,
|
||||
hide: !tmpRoute.meta.breadcrumb && tmpRoute.meta.breadcrumb === false,
|
||||
title: tmpRoute.meta?.title,
|
||||
hide: !tmpRoute.meta?.breadcrumb && tmpRoute.meta?.breadcrumb === false,
|
||||
})
|
||||
if (!tmpRoute.meta) {
|
||||
tmpRoute.meta = {}
|
||||
}
|
||||
tmpRoute.meta.breadcrumbNeste = tmpBreadcrumb
|
||||
res.push(tmpRoute)
|
||||
}
|
||||
@@ -126,14 +133,14 @@ const useRouteStore = defineStore(
|
||||
state: () => ({
|
||||
isGenerate: false,
|
||||
routes: [] as Route.recordMainRaw[],
|
||||
fileSystemRoutes: [] as Route.recordRaw[],
|
||||
fileSystemRoutes: [] as RouteRecordRaw[],
|
||||
currentRemoveRoutes: [] as Function[],
|
||||
}),
|
||||
getters: {
|
||||
// 扁平化路由(将三级及以上路由数据拍平成二级)
|
||||
flatRoutes: (state) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const routes: Route.recordRaw[] = []
|
||||
const routes: RouteRecordRaw[] = []
|
||||
if (state.routes) {
|
||||
if (settingsStore.app.routeBaseOn !== 'filesystem') {
|
||||
state.routes.forEach((item) => {
|
||||
@@ -155,57 +162,30 @@ const useRouteStore = defineStore(
|
||||
},
|
||||
actions: {
|
||||
// 根据权限动态生成路由(前端生成)
|
||||
generateRoutesAtFront(asyncRoutes: Route.recordMainRaw[]) {
|
||||
// eslint-disable-next-line no-async-promise-executor
|
||||
return new Promise<void>(async (resolve) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedRoutes
|
||||
// 如果权限功能开启,则需要对路由数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedRoutes = filterAsyncRoutes(asyncRoutes, permissions)
|
||||
}
|
||||
else {
|
||||
accessedRoutes = cloneDeep(asyncRoutes)
|
||||
}
|
||||
// 设置 routes 数据
|
||||
this.isGenerate = true
|
||||
this.routes = accessedRoutes.filter(item => item.children?.length !== 0)
|
||||
resolve()
|
||||
})
|
||||
async generateRoutesAtFront(asyncRoutes: Route.recordMainRaw[]) {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedRoutes
|
||||
// 如果权限功能开启,则需要对路由数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedRoutes = filterAsyncRoutes(asyncRoutes, permissions)
|
||||
}
|
||||
else {
|
||||
accessedRoutes = cloneDeep(asyncRoutes)
|
||||
}
|
||||
// 设置 routes 数据
|
||||
this.isGenerate = true
|
||||
this.routes = accessedRoutes.filter(item => item.children?.length !== 0) as any
|
||||
},
|
||||
// 根据权限动态生成路由(后端获取)
|
||||
generateRoutesAtBack() {
|
||||
return new Promise<void>((resolve) => {
|
||||
api.get('route/list', {
|
||||
baseURL: '/mock/',
|
||||
}).then(async (res) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
const asyncRoutes = formatBackRoutes(res.data)
|
||||
let accessedRoutes
|
||||
// 如果权限功能开启,则需要对路由数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedRoutes = filterAsyncRoutes(asyncRoutes, permissions)
|
||||
}
|
||||
else {
|
||||
accessedRoutes = cloneDeep(asyncRoutes)
|
||||
}
|
||||
// 设置 routes 数据
|
||||
this.isGenerate = true
|
||||
this.routes = accessedRoutes.filter(item => item.children.length !== 0)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
},
|
||||
// 根据权限动态生成路由(文件系统生成)
|
||||
generateRoutesAtFilesystem(asyncRoutes: Route.recordRaw[]) {
|
||||
// eslint-disable-next-line no-async-promise-executor
|
||||
return new Promise<void>(async (resolve) => {
|
||||
async generateRoutesAtBack() {
|
||||
await api.get('route/list', {
|
||||
baseURL: '/mock/',
|
||||
}).then(async (res) => {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
const asyncRoutes = formatBackRoutes(res.data)
|
||||
let accessedRoutes
|
||||
// 如果权限功能开启,则需要对路由数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
@@ -217,9 +197,25 @@ const useRouteStore = defineStore(
|
||||
}
|
||||
// 设置 routes 数据
|
||||
this.isGenerate = true
|
||||
this.fileSystemRoutes = accessedRoutes.filter(item => item.children?.length !== 0)
|
||||
resolve()
|
||||
})
|
||||
this.routes = accessedRoutes.filter(item => item.children.length !== 0) as any
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 根据权限动态生成路由(文件系统生成)
|
||||
async generateRoutesAtFilesystem(asyncRoutes: RouteRecordRaw[]) {
|
||||
const settingsStore = useSettingsStore()
|
||||
const userStore = useUserStore()
|
||||
let accessedRoutes
|
||||
// 如果权限功能开启,则需要对路由数据进行筛选过滤
|
||||
if (settingsStore.app.enablePermission) {
|
||||
const permissions = await userStore.getPermissions()
|
||||
accessedRoutes = filterAsyncRoutes(asyncRoutes, permissions)
|
||||
}
|
||||
else {
|
||||
accessedRoutes = cloneDeep(asyncRoutes)
|
||||
}
|
||||
// 设置 routes 数据
|
||||
this.isGenerate = true
|
||||
this.fileSystemRoutes = accessedRoutes.filter(item => item.children?.length !== 0) as any
|
||||
},
|
||||
// 记录 accessRoutes 路由,用于登出时删除路由
|
||||
setCurrentRemoveRoutes(routes: Function[]) {
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
import { defaultsDeep } from 'lodash-es'
|
||||
import type { RecursiveRequired, Settings } from '@/global'
|
||||
import type { RouteMeta } from 'vue-router'
|
||||
import type { RecursiveRequired, Settings } from '#/global'
|
||||
import settings from '@/settings'
|
||||
import settingsDefault from '@/settings.default'
|
||||
|
||||
interface SettingsStore extends RecursiveRequired<Settings.all> {
|
||||
subMenuCollapseLastStatus: boolean
|
||||
mode: 'pc' | 'mobile'
|
||||
title: string
|
||||
title?: RouteMeta['title']
|
||||
}
|
||||
|
||||
const useSettingsStore = defineStore(
|
||||
@@ -25,7 +26,7 @@ const useSettingsStore = defineStore(
|
||||
}),
|
||||
actions: {
|
||||
// 设置网页标题
|
||||
setTitle(title: string) {
|
||||
setTitle(title: SettingsStore['title']) {
|
||||
this.title = title
|
||||
},
|
||||
// 设置访问模式
|
||||
|
||||
+16
-23
@@ -61,34 +61,27 @@ const useUserStore = defineStore(
|
||||
})
|
||||
},
|
||||
// 获取我的权限
|
||||
getPermissions() {
|
||||
return new Promise<string[]>((resolve) => {
|
||||
// 通过 mock 获取权限
|
||||
api.get('member/permission', {
|
||||
baseURL: '/mock/',
|
||||
params: {
|
||||
account: this.account,
|
||||
},
|
||||
}).then((res) => {
|
||||
this.permissions = res.data.permissions
|
||||
resolve(res.data.permissions)
|
||||
})
|
||||
async getPermissions() {
|
||||
// 通过 mock 获取权限
|
||||
const res = await api.get('member/permission', {
|
||||
baseURL: '/mock/',
|
||||
params: {
|
||||
account: this.account,
|
||||
},
|
||||
})
|
||||
this.permissions = res.data.permissions
|
||||
return this.permissions
|
||||
},
|
||||
editPassword(data: {
|
||||
async editPassword(data: {
|
||||
password: string
|
||||
newpassword: string
|
||||
}) {
|
||||
return new Promise<void>((resolve) => {
|
||||
api.post('member/edit/password', {
|
||||
account: this.account,
|
||||
password: data.password,
|
||||
newpassword: data.newpassword,
|
||||
}, {
|
||||
baseURL: '/mock/',
|
||||
}).then(() => {
|
||||
resolve()
|
||||
})
|
||||
await api.post('member/edit/password', {
|
||||
account: this.account,
|
||||
password: data.password,
|
||||
newpassword: data.newpassword,
|
||||
}, {
|
||||
baseURL: '/mock/',
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
+4
-4
@@ -60,13 +60,13 @@ declare global {
|
||||
const triggerRef: typeof import('vue')['triggerRef']
|
||||
const unref: typeof import('vue')['unref']
|
||||
const useAttrs: typeof import('vue')['useAttrs']
|
||||
const useAuth: typeof import('./utils/composables/useAuth')['default']
|
||||
const useAuth: typeof import('../utils/composables/useAuth')['default']
|
||||
const useCssModule: typeof import('vue')['useCssModule']
|
||||
const useCssVars: typeof import('vue')['useCssVars']
|
||||
const useGlobalProperties: typeof import('./utils/composables/useGlobalProperties')['default']
|
||||
const useGlobalProperties: typeof import('../utils/composables/useGlobalProperties')['default']
|
||||
const useLink: typeof import('vue-router')['useLink']
|
||||
const useMainPage: typeof import('./utils/composables/useMainPage')['default']
|
||||
const useMenu: typeof import('./utils/composables/useMenu')['default']
|
||||
const useMainPage: typeof import('../utils/composables/useMainPage')['default']
|
||||
const useMenu: typeof import('../utils/composables/useMenu')['default']
|
||||
const useRoute: typeof import('vue-router')['useRoute']
|
||||
const useRouter: typeof import('vue-router')['useRouter']
|
||||
const useSlots: typeof import('vue')['useSlots']
|
||||
Vendored
+30
@@ -0,0 +1,30 @@
|
||||
// generated by unplugin-vue-components
|
||||
// We suggest you to commit this file into source control
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
import '@vue/runtime-core'
|
||||
|
||||
export {}
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
export interface GlobalComponents {
|
||||
Auth: typeof import('./../components/Auth/index.vue')['default']
|
||||
AuthAll: typeof import('./../components/AuthAll/index.vue')['default']
|
||||
BatchActionBar: typeof import('./../components/BatchActionBar/index.vue')['default']
|
||||
Copyright: typeof import('./../components/Copyright/index.vue')['default']
|
||||
Editor: typeof import('./../components/Editor/index.vue')['default']
|
||||
FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
|
||||
FixedActionBar: typeof import('./../components/FixedActionBar/index.vue')['default']
|
||||
ImagePreview: typeof import('./../components/ImagePreview/index.vue')['default']
|
||||
ImagesUpload: typeof import('./../components/ImagesUpload/index.vue')['default']
|
||||
ImageUpload: typeof import('./../components/ImageUpload/index.vue')['default']
|
||||
PageHeader: typeof import('./../components/PageHeader/index.vue')['default']
|
||||
PageMain: typeof import('./../components/PageMain/index.vue')['default']
|
||||
PcasCascader: typeof import('./../components/PcasCascader/index.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
RouterView: typeof import('vue-router')['RouterView']
|
||||
SearchBar: typeof import('./../components/SearchBar/index.vue')['default']
|
||||
SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default']
|
||||
SystemInfo: typeof import('./../components/SystemInfo/index.vue')['default']
|
||||
Trend: typeof import('./../components/Trend/index.vue')['default']
|
||||
}
|
||||
}
|
||||
+13
-13
@@ -113,10 +113,12 @@ declare namespace Settings {
|
||||
}
|
||||
interface topbar {
|
||||
/**
|
||||
* 是否固定顶栏
|
||||
* @默认值 `true`
|
||||
* 模式
|
||||
* @默认值 `'static'` 静止,跟随页面滚动
|
||||
* @可选值 `'fixed'` 固定,不跟随页面滚动,始终固定在顶部
|
||||
* @可选值 `'sticky'` 粘性,页面往下滚动时隐藏,往上滚动时显示
|
||||
*/
|
||||
fixed?: boolean
|
||||
mode?: 'static' | 'fixed' | 'sticky'
|
||||
}
|
||||
interface toolbar {
|
||||
/**
|
||||
@@ -210,7 +212,7 @@ declare namespace Settings {
|
||||
|
||||
declare module 'vue-router' {
|
||||
interface RouteMeta {
|
||||
title: string | Function
|
||||
title?: string | Function
|
||||
i18n?: string
|
||||
icon?: string
|
||||
activeIcon?: string
|
||||
@@ -220,17 +222,14 @@ declare module 'vue-router' {
|
||||
breadcrumb?: boolean
|
||||
activeMenu?: string
|
||||
cache?: boolean | string | string[]
|
||||
link?: string
|
||||
breadcrumbNeste?: Route.breadcrumb[]
|
||||
}
|
||||
}
|
||||
|
||||
declare namespace Route {
|
||||
interface recordRaw extends Omit<RouteRecordRaw, 'meta' | 'children'> {
|
||||
meta: RouteMeta
|
||||
children?: recordRaw[]
|
||||
}
|
||||
interface recordMainRaw {
|
||||
meta: {
|
||||
meta?: {
|
||||
title?: string | Function
|
||||
icon?: string
|
||||
auth?: string | string[]
|
||||
@@ -239,7 +238,7 @@ declare namespace Route {
|
||||
}
|
||||
interface breadcrumb {
|
||||
path: string
|
||||
title: string | Function
|
||||
title?: string | Function
|
||||
hide: boolean
|
||||
}
|
||||
}
|
||||
@@ -248,18 +247,19 @@ declare namespace Menu {
|
||||
/** 原始 */
|
||||
interface recordRaw {
|
||||
path?: string
|
||||
meta: {
|
||||
title: string
|
||||
meta?: {
|
||||
title?: string
|
||||
icon?: string
|
||||
defaultOpened?: boolean
|
||||
auth?: string | string[]
|
||||
sidebar?: boolean
|
||||
link?: string
|
||||
}
|
||||
children?: recordRaw[]
|
||||
}
|
||||
/** 主导航 */
|
||||
interface recordMainRaw {
|
||||
meta: {
|
||||
meta?: {
|
||||
title?: string
|
||||
icon?: string
|
||||
auth?: string | string[]
|
||||
+19
-19
@@ -1,19 +1,19 @@
|
||||
declare interface Window {
|
||||
webkitDevicePixelRatio: any
|
||||
mozDevicePixelRatio: any
|
||||
}
|
||||
|
||||
declare module '*.vue' {
|
||||
import { type DefineComponent } from 'vue'
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
||||
|
||||
declare const __SYSTEM_INFO__: {
|
||||
pkg: {
|
||||
version: string
|
||||
dependencies: Recordable<string>
|
||||
devDependencies: Recordable<string>
|
||||
}
|
||||
lastBuildTime: string
|
||||
}
|
||||
declare interface Window {
|
||||
webkitDevicePixelRatio: any
|
||||
mozDevicePixelRatio: any
|
||||
}
|
||||
|
||||
declare module '*.vue' {
|
||||
import { type DefineComponent } from 'vue'
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
||||
|
||||
declare const __SYSTEM_INFO__: {
|
||||
pkg: {
|
||||
version: string
|
||||
dependencies: Recordable<string>
|
||||
devDependencies: Recordable<string>
|
||||
}
|
||||
lastBuildTime: string
|
||||
}
|
||||
@@ -1,7 +1,6 @@
|
||||
import router from '@/router'
|
||||
import useSettingsStore from '@/store/modules/settings'
|
||||
import useMenuStore from '@/store/modules/menu'
|
||||
import { isExternalLink } from '@/utils'
|
||||
|
||||
export default function useMenu() {
|
||||
const settingsStore = useSettingsStore()
|
||||
@@ -10,12 +9,7 @@ export default function useMenu() {
|
||||
function switchTo(index: number | string) {
|
||||
menuStore.setActived(index)
|
||||
if (settingsStore.menu.switchMainMenuAndPageJump) {
|
||||
if (isExternalLink(menuStore.sidebarMenusFirstDeepestPath)) {
|
||||
window.open(menuStore.sidebarMenusFirstDeepestPath, '_blank')
|
||||
}
|
||||
else {
|
||||
router.push(menuStore.sidebarMenusFirstDeepestPath)
|
||||
}
|
||||
router.push(menuStore.sidebarMenusFirstDeepestPath)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
+2
-12
@@ -1,15 +1,5 @@
|
||||
import path from 'path-browserify'
|
||||
|
||||
export function isExternalLink(path: string) {
|
||||
return /^(https?:|mailto:|tel:)/.test(path)
|
||||
}
|
||||
|
||||
export function resolveRoutePath(basePath: string, routePath: string) {
|
||||
if (isExternalLink(routePath)) {
|
||||
return routePath
|
||||
}
|
||||
if (isExternalLink(basePath)) {
|
||||
return basePath
|
||||
}
|
||||
return basePath ? path.resolve(basePath, routePath) : routePath
|
||||
export function resolveRoutePath(basePath: string, routePath?: string) {
|
||||
return basePath ? path.resolve(basePath, routePath ?? '') : routePath ?? ''
|
||||
}
|
||||
|
||||
+1
-1
@@ -6,7 +6,7 @@ meta:
|
||||
|
||||
<script lang="ts" setup>
|
||||
function open(url: string) {
|
||||
window.open(url, 'top')
|
||||
window.open(url, '_blank')
|
||||
}
|
||||
|
||||
const fantasticStartkitInfo = ref({
|
||||
|
||||
+7
-39
@@ -21,12 +21,10 @@ const title = import.meta.env.VITE_APP_TITLE
|
||||
// 表单类型,login 登录,reset 重置密码
|
||||
const formType = ref('login')
|
||||
const loading = ref(false)
|
||||
const passwordType = ref('password')
|
||||
const redirect = ref(route.query.redirect?.toString() ?? '/')
|
||||
|
||||
// 登录
|
||||
const loginFormRef = ref<FormInstance>()
|
||||
const loginPasswordRef = ref<HTMLElement>()
|
||||
const loginForm = ref({
|
||||
account: localStorage.login_account || '',
|
||||
password: '',
|
||||
@@ -63,8 +61,6 @@ function handleLogin() {
|
||||
|
||||
// 注册
|
||||
const registerFormRef = ref<FormInstance>()
|
||||
const registerPasswordRef = ref<HTMLElement>()
|
||||
const registerCheckPasswordRef = ref<HTMLElement>()
|
||||
const registerForm = ref({
|
||||
account: '',
|
||||
captcha: '',
|
||||
@@ -110,7 +106,6 @@ function handleRegister() {
|
||||
|
||||
// 重置密码
|
||||
const resetFormRef = ref<FormInstance>()
|
||||
const resetNewPasswordRef = ref<HTMLElement>()
|
||||
const resetForm = ref({
|
||||
account: localStorage.login_account || '',
|
||||
captcha: '',
|
||||
@@ -140,13 +135,6 @@ function handleReset() {
|
||||
})
|
||||
}
|
||||
|
||||
function showPassword(passwordEl: HTMLElement | undefined) {
|
||||
passwordType.value = passwordType.value === 'password' ? '' : 'password'
|
||||
nextTick(() => {
|
||||
passwordEl?.focus()
|
||||
})
|
||||
}
|
||||
|
||||
function testAccount(account: string) {
|
||||
loginForm.value.account = account
|
||||
loginForm.value.password = '123456'
|
||||
@@ -170,7 +158,7 @@ function testAccount(account: string) {
|
||||
</div>
|
||||
<div>
|
||||
<el-form-item prop="account">
|
||||
<el-input ref="name" v-model="loginForm.account" placeholder="用户名" text tabindex="1" autocomplete="on">
|
||||
<el-input v-model="loginForm.account" placeholder="用户名" text tabindex="1" autocomplete="on">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:user" />
|
||||
@@ -179,17 +167,12 @@ function testAccount(account: string) {
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input ref="loginPasswordRef" v-model="loginForm.password" :type="passwordType" placeholder="密码" tabindex="2" autocomplete="on" @keyup.enter="handleLogin">
|
||||
<el-input v-model="loginForm.password" type="password" placeholder="密码" tabindex="2" autocomplete="on" show-password @keyup.enter="handleLogin">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:lock" />
|
||||
</el-icon>
|
||||
</template>
|
||||
<template #suffix>
|
||||
<el-icon>
|
||||
<svg-icon :name="passwordType === 'password' ? 'eye' : 'eye-open'" @click="showPassword(loginPasswordRef)" />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@@ -228,7 +211,7 @@ function testAccount(account: string) {
|
||||
</div>
|
||||
<div>
|
||||
<el-form-item prop="account">
|
||||
<el-input ref="name" v-model="registerForm.account" placeholder="用户名" tabindex="1" autocomplete="on">
|
||||
<el-input v-model="registerForm.account" placeholder="用户名" tabindex="1" autocomplete="on">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:user" />
|
||||
@@ -249,31 +232,21 @@ function testAccount(account: string) {
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input ref="registerPasswordRef" v-model="registerForm.password" :type="passwordType" placeholder="密码" tabindex="3" autocomplete="on">
|
||||
<el-input v-model="registerForm.password" type="password" placeholder="密码" tabindex="3" autocomplete="on" show-password>
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:lock" />
|
||||
</el-icon>
|
||||
</template>
|
||||
<template #suffix>
|
||||
<el-icon>
|
||||
<svg-icon :name="passwordType === 'password' ? 'ep:hide' : 'ep:view'" @click="showPassword(registerPasswordRef)" />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="checkPassword">
|
||||
<el-input ref="registerCheckPasswordRef" v-model="registerForm.checkPassword" :type="passwordType" placeholder="确认密码" tabindex="4" autocomplete="on">
|
||||
<el-input v-model="registerForm.checkPassword" type="password" placeholder="确认密码" tabindex="4" autocomplete="on" show-password>
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:lock" />
|
||||
</el-icon>
|
||||
</template>
|
||||
<template #suffix>
|
||||
<el-icon>
|
||||
<svg-icon :name="passwordType === 'password' ? 'ep:hide' : 'ep:view'" @click="showPassword(registerCheckPasswordRef)" />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@@ -295,7 +268,7 @@ function testAccount(account: string) {
|
||||
</div>
|
||||
<div>
|
||||
<el-form-item prop="account">
|
||||
<el-input ref="name" v-model="resetForm.account" placeholder="用户名" tabindex="1" autocomplete="on">
|
||||
<el-input v-model="resetForm.account" placeholder="用户名" tabindex="1" autocomplete="on">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:user" />
|
||||
@@ -316,17 +289,12 @@ function testAccount(account: string) {
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="newPassword">
|
||||
<el-input ref="resetNewPasswordRef" v-model="resetForm.newPassword" :type="passwordType" placeholder="新密码" tabindex="3" autocomplete="on">
|
||||
<el-input v-model="resetForm.newPassword" type="password" placeholder="新密码" tabindex="3" autocomplete="on" show-password>
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<svg-icon name="ep:lock" />
|
||||
</el-icon>
|
||||
</template>
|
||||
<template #suffix>
|
||||
<el-icon>
|
||||
<svg-icon :name="passwordType === 'password' ? 'ep:hide' : 'ep:view'" @click="showPassword(resetNewPasswordRef)" />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
@@ -74,13 +74,13 @@ function onSubmit() {
|
||||
<el-col :md="24" :lg="12">
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="原密码" prop="password">
|
||||
<el-input v-model="form.password" type="password" placeholder="请输入原密码" />
|
||||
<el-input v-model="form.password" type="password" placeholder="请输入原密码" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="newpassword">
|
||||
<el-input v-model="form.newpassword" type="password" placeholder="请输入原密码" />
|
||||
<el-input v-model="form.newpassword" type="password" placeholder="请输入原密码" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认新密码" prop="checkpassword">
|
||||
<el-input v-model="form.checkpassword" type="password" placeholder="请输入原密码" />
|
||||
<el-input v-model="form.checkpassword" type="password" placeholder="请输入原密码" show-password />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
|
||||
@@ -19,6 +19,9 @@
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"src/*"
|
||||
],
|
||||
"#/*": [
|
||||
"src/types/*"
|
||||
]
|
||||
},
|
||||
"types": [
|
||||
|
||||
@@ -53,6 +53,7 @@ export default ({ mode, command }) => {
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, 'src'),
|
||||
'#': path.resolve(__dirname, 'src/types'),
|
||||
},
|
||||
},
|
||||
css: {
|
||||
|
||||
@@ -7,7 +7,7 @@ export default function createAutoImport() {
|
||||
'vue-router',
|
||||
'pinia',
|
||||
],
|
||||
dts: 'src/auto-imports.d.ts',
|
||||
dts: './src/types/auto-imports.d.ts',
|
||||
dirs: [
|
||||
'./src/utils/composables/**',
|
||||
],
|
||||
|
||||
@@ -4,6 +4,6 @@ export default function createComponents() {
|
||||
return components({
|
||||
dirs: ['src/components'],
|
||||
include: [/\.vue$/, /\.vue\?vue/, /\.tsx$/],
|
||||
dts: 'src/components.d.ts',
|
||||
dts: './src/types/components.d.ts',
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user