This commit is contained in:
李远
parent
29bce3569f
commit
ca5998e98e
|
|
@ -1,8 +0,0 @@
|
|||
[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue,css,scss,sass,less,styl}]
|
||||
charset = utf-8
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
end_of_line = lf
|
||||
max_line_length = 100
|
||||
9
.env
9
.env
|
|
@ -1,9 +0,0 @@
|
|||
# 开发环境配置
|
||||
VITE_DEV_API_BASE_URL=http://192.168.10.10:8085/api/
|
||||
VITE_DEV_DEBUG=true
|
||||
VITE_DEV_REQUEST_TIMEOUT=5000
|
||||
|
||||
# 生产环境配置
|
||||
VITE_PROD_API_BASE_URL=https://your-api-domain.com/api
|
||||
VITE_PROD_DEBUG=false
|
||||
VITE_PROD_REQUEST_TIMEOUT=10000
|
||||
|
|
@ -1,325 +0,0 @@
|
|||
{
|
||||
"globals": {
|
||||
"Component": true,
|
||||
"ComponentPublicInstance": true,
|
||||
"ComputedRef": true,
|
||||
"DirectiveBinding": true,
|
||||
"EffectScope": true,
|
||||
"ElNotification": true,
|
||||
"ExtractDefaultPropTypes": true,
|
||||
"ExtractPropTypes": true,
|
||||
"ExtractPublicPropTypes": true,
|
||||
"InjectionKey": true,
|
||||
"MaybeRef": true,
|
||||
"MaybeRefOrGetter": true,
|
||||
"PropType": true,
|
||||
"Ref": true,
|
||||
"ShallowRef": true,
|
||||
"Slot": true,
|
||||
"Slots": true,
|
||||
"VNode": true,
|
||||
"WritableComputedRef": true,
|
||||
"acceptHMRUpdate": true,
|
||||
"asyncComputed": true,
|
||||
"autoResetRef": true,
|
||||
"computed": true,
|
||||
"computedAsync": true,
|
||||
"computedEager": true,
|
||||
"computedInject": true,
|
||||
"computedWithControl": true,
|
||||
"controlledComputed": true,
|
||||
"controlledRef": true,
|
||||
"createApp": true,
|
||||
"createEventHook": true,
|
||||
"createGlobalState": true,
|
||||
"createInjectionState": true,
|
||||
"createPinia": true,
|
||||
"createReactiveFn": true,
|
||||
"createRef": true,
|
||||
"createReusableTemplate": true,
|
||||
"createSharedComposable": true,
|
||||
"createTemplatePromise": true,
|
||||
"createUnrefFn": true,
|
||||
"customRef": true,
|
||||
"debouncedRef": true,
|
||||
"debouncedWatch": true,
|
||||
"defineAsyncComponent": true,
|
||||
"defineComponent": true,
|
||||
"defineStore": true,
|
||||
"eagerComputed": true,
|
||||
"effectScope": true,
|
||||
"extendRef": true,
|
||||
"getActivePinia": true,
|
||||
"getCurrentInstance": true,
|
||||
"getCurrentScope": true,
|
||||
"getCurrentWatcher": true,
|
||||
"h": true,
|
||||
"ignorableWatch": true,
|
||||
"inject": true,
|
||||
"injectLocal": true,
|
||||
"isDefined": true,
|
||||
"isProxy": true,
|
||||
"isReactive": true,
|
||||
"isReadonly": true,
|
||||
"isRef": true,
|
||||
"isShallow": true,
|
||||
"makeDestructurable": true,
|
||||
"mapActions": true,
|
||||
"mapGetters": true,
|
||||
"mapState": true,
|
||||
"mapStores": true,
|
||||
"mapWritableState": true,
|
||||
"markRaw": true,
|
||||
"nextTick": true,
|
||||
"onActivated": true,
|
||||
"onBeforeMount": true,
|
||||
"onBeforeRouteLeave": true,
|
||||
"onBeforeRouteUpdate": true,
|
||||
"onBeforeUnmount": true,
|
||||
"onBeforeUpdate": true,
|
||||
"onClickOutside": true,
|
||||
"onDeactivated": true,
|
||||
"onElementRemoval": true,
|
||||
"onErrorCaptured": true,
|
||||
"onKeyStroke": true,
|
||||
"onLongPress": true,
|
||||
"onMounted": true,
|
||||
"onRenderTracked": true,
|
||||
"onRenderTriggered": true,
|
||||
"onScopeDispose": true,
|
||||
"onServerPrefetch": true,
|
||||
"onStartTyping": true,
|
||||
"onUnmounted": true,
|
||||
"onUpdated": true,
|
||||
"onWatcherCleanup": true,
|
||||
"pausableWatch": true,
|
||||
"provide": true,
|
||||
"provideLocal": true,
|
||||
"reactify": true,
|
||||
"reactifyObject": true,
|
||||
"reactive": true,
|
||||
"reactiveComputed": true,
|
||||
"reactiveOmit": true,
|
||||
"reactivePick": true,
|
||||
"readonly": true,
|
||||
"ref": true,
|
||||
"refAutoReset": true,
|
||||
"refDebounced": true,
|
||||
"refDefault": true,
|
||||
"refManualReset": true,
|
||||
"refThrottled": true,
|
||||
"refWithControl": true,
|
||||
"resolveComponent": true,
|
||||
"resolveRef": true,
|
||||
"setActivePinia": true,
|
||||
"setMapStoreSuffix": true,
|
||||
"shallowReactive": true,
|
||||
"shallowReadonly": true,
|
||||
"shallowRef": true,
|
||||
"storeToRefs": true,
|
||||
"syncRef": true,
|
||||
"syncRefs": true,
|
||||
"templateRef": true,
|
||||
"throttledRef": true,
|
||||
"throttledWatch": true,
|
||||
"toRaw": true,
|
||||
"toReactive": true,
|
||||
"toRef": true,
|
||||
"toRefs": true,
|
||||
"toValue": true,
|
||||
"triggerRef": true,
|
||||
"tryOnBeforeMount": true,
|
||||
"tryOnBeforeUnmount": true,
|
||||
"tryOnMounted": true,
|
||||
"tryOnScopeDispose": true,
|
||||
"tryOnUnmounted": true,
|
||||
"unref": true,
|
||||
"unrefElement": true,
|
||||
"until": true,
|
||||
"useActiveElement": true,
|
||||
"useAnimate": true,
|
||||
"useArrayDifference": true,
|
||||
"useArrayEvery": true,
|
||||
"useArrayFilter": true,
|
||||
"useArrayFind": true,
|
||||
"useArrayFindIndex": true,
|
||||
"useArrayFindLast": true,
|
||||
"useArrayIncludes": true,
|
||||
"useArrayJoin": true,
|
||||
"useArrayMap": true,
|
||||
"useArrayReduce": true,
|
||||
"useArraySome": true,
|
||||
"useArrayUnique": true,
|
||||
"useAsyncQueue": true,
|
||||
"useAsyncState": true,
|
||||
"useAttrs": true,
|
||||
"useBase64": true,
|
||||
"useBattery": true,
|
||||
"useBluetooth": true,
|
||||
"useBreakpoints": true,
|
||||
"useBroadcastChannel": true,
|
||||
"useBrowserLocation": true,
|
||||
"useCached": true,
|
||||
"useClipboard": true,
|
||||
"useClipboardItems": true,
|
||||
"useCloned": true,
|
||||
"useColorMode": true,
|
||||
"useConfirmDialog": true,
|
||||
"useCountdown": true,
|
||||
"useCounter": true,
|
||||
"useCssModule": true,
|
||||
"useCssSupports": true,
|
||||
"useCssVar": true,
|
||||
"useCssVars": true,
|
||||
"useCurrentElement": true,
|
||||
"useCycleList": true,
|
||||
"useDark": true,
|
||||
"useDateFormat": true,
|
||||
"useDebounce": true,
|
||||
"useDebounceFn": true,
|
||||
"useDebouncedRefHistory": true,
|
||||
"useDeviceMotion": true,
|
||||
"useDeviceOrientation": true,
|
||||
"useDevicePixelRatio": true,
|
||||
"useDevicesList": true,
|
||||
"useDisplayMedia": true,
|
||||
"useDocumentVisibility": true,
|
||||
"useDraggable": true,
|
||||
"useDropZone": true,
|
||||
"useElementBounding": true,
|
||||
"useElementByPoint": true,
|
||||
"useElementHover": true,
|
||||
"useElementSize": true,
|
||||
"useElementVisibility": true,
|
||||
"useEventBus": true,
|
||||
"useEventListener": true,
|
||||
"useEventSource": true,
|
||||
"useEyeDropper": true,
|
||||
"useFavicon": true,
|
||||
"useFetch": true,
|
||||
"useFileDialog": true,
|
||||
"useFileSystemAccess": true,
|
||||
"useFocus": true,
|
||||
"useFocusWithin": true,
|
||||
"useFps": true,
|
||||
"useFullscreen": true,
|
||||
"useGamepad": true,
|
||||
"useGeolocation": true,
|
||||
"useId": true,
|
||||
"useIdle": true,
|
||||
"useImage": true,
|
||||
"useInfiniteScroll": true,
|
||||
"useIntersectionObserver": true,
|
||||
"useInterval": true,
|
||||
"useIntervalFn": true,
|
||||
"useKeyModifier": true,
|
||||
"useLastChanged": true,
|
||||
"useLink": true,
|
||||
"useLocalStorage": true,
|
||||
"useMagicKeys": true,
|
||||
"useManualRefHistory": true,
|
||||
"useMediaControls": true,
|
||||
"useMediaQuery": true,
|
||||
"useMemoize": true,
|
||||
"useMemory": true,
|
||||
"useModel": true,
|
||||
"useMounted": true,
|
||||
"useMouse": true,
|
||||
"useMouseInElement": true,
|
||||
"useMousePressed": true,
|
||||
"useMutationObserver": true,
|
||||
"useNavigatorLanguage": true,
|
||||
"useNetwork": true,
|
||||
"useNow": true,
|
||||
"useObjectUrl": true,
|
||||
"useOffsetPagination": true,
|
||||
"useOnline": true,
|
||||
"usePageLeave": true,
|
||||
"useParallax": true,
|
||||
"useParentElement": true,
|
||||
"usePerformanceObserver": true,
|
||||
"usePermission": true,
|
||||
"usePointer": true,
|
||||
"usePointerLock": true,
|
||||
"usePointerSwipe": true,
|
||||
"usePreferredColorScheme": true,
|
||||
"usePreferredContrast": true,
|
||||
"usePreferredDark": true,
|
||||
"usePreferredLanguages": true,
|
||||
"usePreferredReducedMotion": true,
|
||||
"usePreferredReducedTransparency": true,
|
||||
"usePrevious": true,
|
||||
"useRafFn": true,
|
||||
"useRefHistory": true,
|
||||
"useResizeObserver": true,
|
||||
"useRoute": true,
|
||||
"useRouter": true,
|
||||
"useSSRWidth": true,
|
||||
"useScreenOrientation": true,
|
||||
"useScreenSafeArea": true,
|
||||
"useScriptTag": true,
|
||||
"useScroll": true,
|
||||
"useScrollLock": true,
|
||||
"useSessionStorage": true,
|
||||
"useShare": true,
|
||||
"useSlots": true,
|
||||
"useSorted": true,
|
||||
"useSpeechRecognition": true,
|
||||
"useSpeechSynthesis": true,
|
||||
"useStepper": true,
|
||||
"useStorage": true,
|
||||
"useStorageAsync": true,
|
||||
"useStyleTag": true,
|
||||
"useSupported": true,
|
||||
"useSwipe": true,
|
||||
"useTemplateRef": true,
|
||||
"useTemplateRefsList": true,
|
||||
"useTextDirection": true,
|
||||
"useTextSelection": true,
|
||||
"useTextareaAutosize": true,
|
||||
"useThrottle": true,
|
||||
"useThrottleFn": true,
|
||||
"useThrottledRefHistory": true,
|
||||
"useTimeAgo": true,
|
||||
"useTimeAgoIntl": true,
|
||||
"useTimeout": true,
|
||||
"useTimeoutFn": true,
|
||||
"useTimeoutPoll": true,
|
||||
"useTimestamp": true,
|
||||
"useTitle": true,
|
||||
"useToNumber": true,
|
||||
"useToString": true,
|
||||
"useToggle": true,
|
||||
"useTransition": true,
|
||||
"useUrlSearchParams": true,
|
||||
"useUserMedia": true,
|
||||
"useVModel": true,
|
||||
"useVModels": true,
|
||||
"useVibrate": true,
|
||||
"useVirtualList": true,
|
||||
"useWakeLock": true,
|
||||
"useWebNotification": true,
|
||||
"useWebSocket": true,
|
||||
"useWebWorker": true,
|
||||
"useWebWorkerFn": true,
|
||||
"useWindowFocus": true,
|
||||
"useWindowScroll": true,
|
||||
"useWindowSize": true,
|
||||
"watch": true,
|
||||
"watchArray": true,
|
||||
"watchAtMost": true,
|
||||
"watchDebounced": true,
|
||||
"watchDeep": true,
|
||||
"watchEffect": true,
|
||||
"watchIgnorable": true,
|
||||
"watchImmediate": true,
|
||||
"watchOnce": true,
|
||||
"watchPausable": true,
|
||||
"watchPostEffect": true,
|
||||
"watchSyncEffect": true,
|
||||
"watchThrottled": true,
|
||||
"watchTriggerable": true,
|
||||
"watchWithFilter": true,
|
||||
"whenever": true
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
* text=auto eol=lf
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
### 该问题是怎么引起的？
|
||||
|
||||
|
||||
|
||||
### 重现步骤
|
||||
|
||||
|
||||
|
||||
### 报错信息
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
### 相关的Issue
|
||||
|
||||
|
||||
### 原因（目的、解决的问题等）
|
||||
|
||||
|
||||
### 描述（做了什么，变更了什么）
|
||||
|
||||
|
||||
### 测试用例（新增、改动、可能影响的功能）
|
||||
|
||||
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
*.vscode
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
*.tsbuildinfo
|
||||
|
||||
.eslintcache
|
||||
|
||||
# Cypress
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Vitest
|
||||
__screenshots__/
|
||||
|
||||
# Vite
|
||||
*.timestamp-*-*.mjs
|
||||
|
||||
##auto
|
||||
auto-imports.d.ts
|
||||
components.d.ts
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
{
|
||||
"$schema": "./node_modules/oxlint/configuration_schema.json",
|
||||
"plugins": ["eslint", "typescript", "unicorn", "oxc", "vue"],
|
||||
"env": {
|
||||
"browser": true
|
||||
},
|
||||
"categories": {
|
||||
"correctness": "error"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/prettierrc",
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"printWidth": 100
|
||||
}
|
||||
36
README.en.md
36
README.en.md
|
|
@ -1,36 +0,0 @@
|
|||
# foreign admin ui
|
||||
|
||||
#### Description
|
||||
{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**}
|
||||
|
||||
#### Software Architecture
|
||||
Software architecture description
|
||||
|
||||
#### Installation
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### Instructions
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### Contribution
|
||||
|
||||
1. Fork the repository
|
||||
2. Create Feat_xxx branch
|
||||
3. Commit your code
|
||||
4. Create Pull Request
|
||||
|
||||
|
||||
#### Gitee Feature
|
||||
|
||||
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
|
||||
2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
|
||||
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
|
||||
4. The most valuable open source project [GVP](https://gitee.com/gvp)
|
||||
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
|
||||
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
|
||||
39
README.md
39
README.md
|
|
@ -1,39 +0,0 @@
|
|||
# foreign admin ui
|
||||
|
||||
#### 介绍
|
||||
{**以下是 Gitee 平台说明，您可以替换此简介**
|
||||
Gitee 是 OSCHINA 推出的基于 Git 的代码托管平台（同时支持 SVN）。专为开发者提供稳定、高效、安全的云端软件开发协作平台
|
||||
无论是个人、团队、或是企业，都能够用 Gitee 实现代码托管、项目管理、协作开发。企业项目请看 [https://gitee.com/enterprises](https://gitee.com/enterprises)}
|
||||
|
||||
#### 软件架构
|
||||
软件架构说明
|
||||
|
||||
|
||||
#### 安装教程
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### 使用说明
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### 参与贡献
|
||||
|
||||
1. Fork 本仓库
|
||||
2. 新建 Feat_xxx 分支
|
||||
3. 提交代码
|
||||
4. 新建 Pull Request
|
||||
|
||||
|
||||
#### 特技
|
||||
|
||||
1. 使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
|
||||
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
|
||||
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
|
||||
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
|
||||
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
|
||||
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue,css,scss,sass,less,styl}]
|
||||
charset = utf-8
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
end_of_line = lf
|
||||
max_line_length = 100
|
||||
|
|
@ -1 +0,0 @@
|
|||
* text=auto eol=lf
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
*.tsbuildinfo
|
||||
|
||||
.eslintcache
|
||||
|
||||
# Cypress
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Vitest
|
||||
__screenshots__/
|
||||
|
||||
# Vite
|
||||
*.timestamp-*-*.mjs
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
{
|
||||
"$schema": "./node_modules/oxlint/configuration_schema.json",
|
||||
"plugins": ["eslint", "typescript", "unicorn", "oxc", "vue"],
|
||||
"env": {
|
||||
"browser": true
|
||||
},
|
||||
"categories": {
|
||||
"correctness": "error"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/prettierrc",
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"printWidth": 100
|
||||
}
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
# admin-system
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
|
||||
|
||||
## Recommended Browser Setup
|
||||
|
||||
- Chromium-based browsers (Chrome, Edge, Brave, etc.):
|
||||
- [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
|
||||
- [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters)
|
||||
- Firefox:
|
||||
- [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
|
||||
- [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/)
|
||||
|
||||
## Type Support for `.vue` Imports in TS
|
||||
|
||||
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
|
||||
|
||||
## Customize configuration
|
||||
|
||||
See [Vite Configuration Reference](https://vite.dev/config/).
|
||||
|
||||
## Project Setup
|
||||
|
||||
```sh
|
||||
pnpm install
|
||||
```
|
||||
|
||||
### Compile and Hot-Reload for Development
|
||||
|
||||
```sh
|
||||
pnpm dev
|
||||
```
|
||||
|
||||
### Type-Check, Compile and Minify for Production
|
||||
|
||||
```sh
|
||||
pnpm build
|
||||
```
|
||||
|
||||
### Lint with [ESLint](https://eslint.org/)
|
||||
|
||||
```sh
|
||||
pnpm lint
|
||||
```
|
||||
|
|
@ -1 +0,0 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import { globalIgnores } from 'eslint/config'
|
||||
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
|
||||
import pluginVue from 'eslint-plugin-vue'
|
||||
import pluginOxlint from 'eslint-plugin-oxlint'
|
||||
import skipFormatting from 'eslint-config-prettier/flat'
|
||||
|
||||
// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
|
||||
// import { configureVueProject } from '@vue/eslint-config-typescript'
|
||||
// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
|
||||
// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setup
|
||||
|
||||
export default defineConfigWithVueTs(
|
||||
{
|
||||
name: 'app/files-to-lint',
|
||||
files: ['**/*.{vue,ts,mts,tsx}'],
|
||||
},
|
||||
|
||||
globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),
|
||||
|
||||
...pluginVue.configs['flat/essential'],
|
||||
vueTsConfigs.recommended,
|
||||
|
||||
...pluginOxlint.buildFromOxlintConfigFile('.oxlintrc.json'),
|
||||
|
||||
skipFormatting,
|
||||
)
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
{
|
||||
"name": "admin-system",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "run-p type-check \"build-only {@}\" --",
|
||||
"preview": "vite preview",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --build",
|
||||
"lint": "run-s lint:*",
|
||||
"lint:oxlint": "oxlint . --fix",
|
||||
"lint:eslint": "eslint . --fix --cache",
|
||||
"format": "prettier --write --experimental-cli src/"
|
||||
},
|
||||
"dependencies": {
|
||||
"pinia": "^3.0.4",
|
||||
"vue": "^3.5.27",
|
||||
"vue-router": "^5.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tsconfig/node24": "^24.0.4",
|
||||
"@types/node": "^24.10.9",
|
||||
"@vitejs/plugin-vue": "^6.0.3",
|
||||
"@vue/eslint-config-typescript": "^14.6.0",
|
||||
"@vue/tsconfig": "^0.8.1",
|
||||
"eslint": "^9.39.2",
|
||||
"eslint-config-prettier": "^10.1.8",
|
||||
"eslint-plugin-oxlint": "~1.42.0",
|
||||
"eslint-plugin-vue": "~10.7.0",
|
||||
"jiti": "^2.6.1",
|
||||
"npm-run-all2": "^8.0.4",
|
||||
"oxlint": "~1.42.0",
|
||||
"prettier": "3.8.1",
|
||||
"typescript": "~5.9.3",
|
||||
"vite": "^7.3.1",
|
||||
"vite-plugin-vue-devtools": "^8.0.5",
|
||||
"vue-tsc": "^3.2.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^20.19.0 || >=22.12.0"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
|
|
@ -1,11 +0,0 @@
|
|||
<script setup lang="ts"></script>
|
||||
|
||||
<template>
|
||||
<h1>You did it!</h1>
|
||||
<p>
|
||||
Visit <a href="https://vuejs.org/" target="_blank" rel="noopener">vuejs.org</a> to read the
|
||||
documentation
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { createApp } from 'vue'
|
||||
import { createPinia } from 'pinia'
|
||||
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
app.use(createPinia())
|
||||
app.use(router)
|
||||
|
||||
app.mount('#app')
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
routes: [],
|
||||
})
|
||||
|
||||
export default router
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { ref, computed } from 'vue'
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
export const useCounterStore = defineStore('counter', () => {
|
||||
const count = ref(0)
|
||||
const doubleCount = computed(() => count.value * 2)
|
||||
function increment() {
|
||||
count.value++
|
||||
}
|
||||
|
||||
return { count, doubleCount, increment }
|
||||
})
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"exclude": ["src/**/__tests__/*"],
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
{
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.app.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"extends": "@tsconfig/node24/tsconfig.json",
|
||||
"include": [
|
||||
"vite.config.*",
|
||||
"vitest.config.*",
|
||||
"cypress.config.*",
|
||||
"nightwatch.conf.*",
|
||||
"playwright.config.*",
|
||||
"eslint.config.*"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"noEmit": true,
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Bundler",
|
||||
"types": ["node"]
|
||||
}
|
||||
}
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueDevTools from 'vite-plugin-vue-devtools'
|
||||
|
||||
// https://vite.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
vueDevTools(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
},
|
||||
},
|
||||
})
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import { globalIgnores } from 'eslint/config'
|
||||
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
|
||||
import pluginVue from 'eslint-plugin-vue'
|
||||
import pluginOxlint from 'eslint-plugin-oxlint'
|
||||
import skipFormatting from 'eslint-config-prettier/flat'
|
||||
|
||||
// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
|
||||
// import { configureVueProject } from '@vue/eslint-config-typescript'
|
||||
// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
|
||||
// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setup
|
||||
|
||||
export default defineConfigWithVueTs(
|
||||
{
|
||||
name: 'app/files-to-lint',
|
||||
files: ['**/*.{vue,ts,mts,tsx}'],
|
||||
},
|
||||
|
||||
globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),
|
||||
|
||||
...pluginVue.configs['flat/essential'],
|
||||
vueTsConfigs.recommended,
|
||||
|
||||
...pluginOxlint.buildFromOxlintConfigFile('.oxlintrc.json'),
|
||||
|
||||
skipFormatting,
|
||||
)
|
||||
13
index.html
13
index.html
|
|
@ -1,13 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app" class="app-container"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
55
package.json
55
package.json
|
|
@ -1,55 +0,0 @@
|
|||
{
|
||||
"name": "admin-system",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "run-p type-check \"build-only {@}\" --",
|
||||
"preview": "vite preview",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --build",
|
||||
"lint": "run-s lint:*",
|
||||
"lint:oxlint": "oxlint . --fix",
|
||||
"lint:eslint": "eslint . --fix --cache",
|
||||
"format": "prettier --write --experimental-cli src/"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vueuse/core": "^14.2.0",
|
||||
"axios": "^1.13.4",
|
||||
"dayjs": "^1.11.19",
|
||||
"element-plus": "^2.13.2",
|
||||
"js-md5": "^0.8.3",
|
||||
"pinia": "^3.0.4",
|
||||
"vue": "^3.5.27",
|
||||
"vue-router": "^5.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@element-plus/icons-vue": "^2.3.2",
|
||||
"@tsconfig/node24": "^24.0.4",
|
||||
"@types/node": "^24.10.9",
|
||||
"@vitejs/plugin-vue": "^6.0.3",
|
||||
"@vue/eslint-config-typescript": "^14.6.0",
|
||||
"@vue/tsconfig": "^0.8.1",
|
||||
"eslint": "^9.39.2",
|
||||
"eslint-config-prettier": "^10.1.8",
|
||||
"eslint-plugin-oxlint": "~1.42.0",
|
||||
"eslint-plugin-vue": "~10.7.0",
|
||||
"jiti": "^2.6.1",
|
||||
"npm-run-all2": "^8.0.4",
|
||||
"oxlint": "~1.42.0",
|
||||
"prettier": "3.8.1",
|
||||
"sass": "^1.97.3",
|
||||
"typescript": "~5.9.3",
|
||||
"unplugin-auto-import": "^21.0.0",
|
||||
"unplugin-element-plus": "^0.11.2",
|
||||
"unplugin-icons": "^23.0.1",
|
||||
"unplugin-vue-components": "^31.0.0",
|
||||
"vite": "^7.3.1",
|
||||
"vite-plugin-vue-devtools": "^8.0.5",
|
||||
"vue-tsc": "^3.2.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^20.19.0 || >=22.12.0"
|
||||
}
|
||||
}
|
||||
4305
pnpm-lock.yaml
4305
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
50
src/App.vue
50
src/App.vue
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<!-- 动态绑定 Transition 的 name -->
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="route-fade" mode="out-in" appear>
|
||||
<component :is="Component" />
|
||||
</transition>
|
||||
</router-view>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
/* 过渡动画的 CSS 类（前缀和 Transition 的 name 一致） */
|
||||
/* 进入动画开始 */
|
||||
.route-fade-enter-from {
|
||||
opacity: 0;
|
||||
transform: translateX(20px);
|
||||
/* 可选：从右侧滑入 */
|
||||
}
|
||||
|
||||
/* 进入动画过程 */
|
||||
.route-fade-enter-active {
|
||||
transition: all 0.3s ease;
|
||||
/* 动画时长和缓动效果 */
|
||||
}
|
||||
|
||||
/* 进入动画结束 */
|
||||
.route-fade-enter-to {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* 离开动画开始 */
|
||||
.route-fade-leave-from {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* 离开动画过程 */
|
||||
.route-fade-leave-active {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/* 离开动画结束 */
|
||||
.route-fade-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(-20px);
|
||||
/* 可选：向左侧滑出 */
|
||||
}
|
||||
</style>
|
||||
138
src/api/index.ts
138
src/api/index.ts
|
|
@ -1,138 +0,0 @@
|
|||
import axios from 'axios'
|
||||
import type { AxiosInstance, AxiosError, AxiosResponse, InternalAxiosRequestConfig } from 'axios'
|
||||
import { useLocalStorage } from '@/utils/storage'
|
||||
import type { ApiResponse } from '@/type/api';
|
||||
import router from '@/router'
|
||||
// 判断当前环境：import.meta.env.DEV 是 Vite 内置的环境变量，开发环境为 true，生产环境为 false
|
||||
const isDev = import.meta.env.DEV;
|
||||
|
||||
// 根据环境读取对应的配置
|
||||
export const API_CONFIG = {
|
||||
// API 基础地址
|
||||
baseUrl: isDev
|
||||
? import.meta.env.VITE_DEV_API_BASE_URL
|
||||
: import.meta.env.VITE_PROD_API_BASE_URL,
|
||||
// 调试模式
|
||||
debug: isDev
|
||||
? import.meta.env.VITE_DEV_DEBUG === 'true' // 注意：env 变量读取出来都是字符串，需要转布尔
|
||||
: import.meta.env.VITE_PROD_DEBUG === 'false',
|
||||
// 请求超时时间
|
||||
timeout: isDev
|
||||
? Number(import.meta.env.VITE_DEV_REQUEST_TIMEOUT) // 转数字
|
||||
: Number(import.meta.env.VITE_PROD_REQUEST_TIMEOUT)
|
||||
};
|
||||
|
||||
// 创建 axios 实例
|
||||
const service: AxiosInstance = axios.create({
|
||||
baseURL: API_CONFIG.baseUrl, // 自动切换的接口地址
|
||||
timeout: API_CONFIG.timeout, // 自动切换的超时时间
|
||||
headers: {
|
||||
'Content-Type': 'application/json;charset=utf-8'
|
||||
}
|
||||
})
|
||||
|
||||
// 请求拦截器
|
||||
service.interceptors.request.use(
|
||||
(config: InternalAxiosRequestConfig) => {
|
||||
// 获取令牌
|
||||
const token = useLocalStorage.get('token')
|
||||
|
||||
// 添加令牌到请求头
|
||||
if (token.value) {
|
||||
config.headers['token'] = token.value
|
||||
}
|
||||
|
||||
// 开发环境下打印请求信息
|
||||
if (API_CONFIG.debug) {
|
||||
console.log('请求配置:', config)
|
||||
}
|
||||
|
||||
return config
|
||||
},
|
||||
(error: AxiosError) => {
|
||||
console.error('请求错误:', error)
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
// 响应拦截器
|
||||
service.interceptors.response.use(
|
||||
(response: AxiosResponse<ApiResponse>) => {
|
||||
// 开发环境下打印响应信息
|
||||
if (API_CONFIG.debug) {
|
||||
console.log('响应数据:', response)
|
||||
}
|
||||
|
||||
// 提取响应数据
|
||||
const { data, headers } = response;
|
||||
// 检查响应状态码
|
||||
if (data.code !== 200 && data.code !== 0) {
|
||||
console.error('业务错误:', data.msg)
|
||||
return Promise.reject(new Error(data.msg))
|
||||
}
|
||||
if (headers['new_token'] !== undefined) {
|
||||
useLocalStorage.set('token', headers['new_token'])
|
||||
}
|
||||
return response
|
||||
},
|
||||
(error: AxiosError) => {
|
||||
// 处理网络错误
|
||||
const status = error.response?.status
|
||||
let message = ''
|
||||
|
||||
switch (status) {
|
||||
case 401:
|
||||
message = '未授权，请重新登录'
|
||||
// 清除令牌并跳转到登录页
|
||||
useLocalStorage.remove('token')
|
||||
router.replace('/login')
|
||||
break
|
||||
case 403:
|
||||
message = '登录过期，请重新登录'
|
||||
useLocalStorage.remove('token')
|
||||
router.replace('/login')
|
||||
break
|
||||
case 404:
|
||||
message = '请求地址不存在'
|
||||
break
|
||||
case 500:
|
||||
message = '服务器内部错误'
|
||||
break
|
||||
default:
|
||||
message = error.message || '网络请求失败'
|
||||
}
|
||||
|
||||
console.error(`[${status || '未知'}] ${message}`)
|
||||
ElNotification({
|
||||
message: message,
|
||||
type: 'error'
|
||||
})
|
||||
return Promise.reject(new Error(message))
|
||||
}
|
||||
)
|
||||
|
||||
// 封装请求方法
|
||||
export const request = {
|
||||
get: <T = any>(url: string, params?: any) => {
|
||||
return service.get<ApiResponse<T>>(url, { params })
|
||||
},
|
||||
|
||||
post: <T = any>(url: string, data?: any) => {
|
||||
return service.post<ApiResponse<T>>(url, data)
|
||||
},
|
||||
|
||||
// put: <T = any>(url: string, data?: any) => {
|
||||
// return service.put<ApiResponse<T>>(url, data)
|
||||
// },
|
||||
|
||||
// delete: <T = any>(url: string, params?: any) => {
|
||||
// return service.delete<ApiResponse<T>>(url, { params })
|
||||
// },
|
||||
|
||||
// patch: <T = any>(url: string, data?: any) => {
|
||||
// return service.patch<ApiResponse<T>>(url, data)
|
||||
// }
|
||||
}
|
||||
|
||||
// 导出 axios 实例供业务使用
|
||||
export default service
|
||||
|
|
@ -1,166 +0,0 @@
|
|||
<template>
|
||||
<el-aside class="aside-container">
|
||||
<el-menu class="el-menu-container" unique-opened :default-active="activeIndex" router :collapse="isCollapse">
|
||||
<!-- 软件名头部 -->
|
||||
<div class="logo" :class="isCollapse ? 'logo-collapse' : ''">
|
||||
<img src="https://picsum.photos/seed/avatar1/60/60" alt="logo" :class="isCollapse ? 'logo-img' : ''" />
|
||||
<span :class="isCollapse ? 'logo-text' : ''">Foreign Admin</span>
|
||||
</div>
|
||||
<!-- 遍历asideList渲染菜单 -->
|
||||
<template v-for="menu in asideList" :key="menu.id">
|
||||
<!-- 1. 渲染折叠子菜单（el-sub-menu） -->
|
||||
<el-sub-menu v-if="menu.children && menu.children.length > 0" :index="menu.path">
|
||||
<template #title>
|
||||
<!-- 渲染菜单图标（如果有） -->
|
||||
<el-icon v-if="menu.icon">
|
||||
<component :is="menu.icon" />
|
||||
</el-icon>
|
||||
<span>{{ menu.name }}</span>
|
||||
</template>
|
||||
<!-- 渲染子菜单列表 -->
|
||||
<el-menu-item v-for="child in menu.children" :key="child.id" :index="child.path">
|
||||
{{ child.name }}
|
||||
</el-menu-item>
|
||||
</el-sub-menu>
|
||||
|
||||
<!-- 2. 渲染普通菜单项（el-menu-item） -->
|
||||
<el-menu-item v-else :index="menu.path">
|
||||
<el-icon v-if="menu.icon">
|
||||
<component :is="menu.icon" />
|
||||
</el-icon>
|
||||
<span>{{ menu.name }}</span>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</el-menu>
|
||||
</el-aside>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
// element 图标导入
|
||||
import { HomeFilled, Menu, Histogram, UserFilled, Promotion, HelpFilled, BellFilled, Management, List } from '@element-plus/icons-vue'
|
||||
//ts 类型导入
|
||||
import type { RawMenuItem, MenuItem, IconMap } from '@/type/menu'
|
||||
// pinia 导入 获取用户菜单
|
||||
import { useUserStore } from '@/stores/user'
|
||||
|
||||
defineProps({
|
||||
isCollapse: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
const route = useRoute()
|
||||
const activeIndex = ref(route.path)
|
||||
let asideList = ref<MenuItem[]>([]) // 现在使用适配后的 MenuItem 类型
|
||||
|
||||
// 1. 图标映射表（使用 IconMap 类型约束）
|
||||
const pathToIconMap: IconMap = {
|
||||
"/": markRaw(HomeFilled),
|
||||
"/fund": markRaw(Menu),
|
||||
"/trade": markRaw(Histogram),
|
||||
"/account": markRaw(UserFilled),
|
||||
"/customized": markRaw(Promotion),
|
||||
"/agent": markRaw(HelpFilled),
|
||||
"/notice": markRaw(BellFilled),
|
||||
"/permission": markRaw(Management),
|
||||
"/template": markRaw(List)
|
||||
}
|
||||
|
||||
// 2. 递归转换原始菜单数据为适配 Element Plus 的格式
|
||||
const transformRawMenu = (rawMenu: RawMenuItem): MenuItem => {
|
||||
const isSubMenu = !!rawMenu.son && rawMenu.son.length > 0
|
||||
// 基础转换
|
||||
const menuItem: MenuItem = {
|
||||
id: rawMenu.id,
|
||||
name: rawMenu.name,
|
||||
path: rawMenu.path,
|
||||
index: rawMenu.path, // index 直接使用 path
|
||||
icon: pathToIconMap[rawMenu.path] || undefined,
|
||||
isSubMenu,
|
||||
raw: rawMenu // 保留原始数据
|
||||
}
|
||||
// 递归处理子菜单
|
||||
if (isSubMenu) {
|
||||
menuItem.children = rawMenu.son!.map(child => transformRawMenu(child))
|
||||
}
|
||||
|
||||
return menuItem
|
||||
}
|
||||
|
||||
// 3. 批量转换菜单列表
|
||||
const transformMenuList = (rawList: RawMenuItem[]): MenuItem[] => {
|
||||
return rawList.map(menu => transformRawMenu(menu))
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 获取原始数据（类型为 RawMenuItem[]）
|
||||
// const rawMenuList = userStore.menus
|
||||
// 转换为适配 Element Plus 的格式
|
||||
// asideList.value = transformMenuList(rawMenuList)
|
||||
})
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.aside-container {
|
||||
height: 100vh;
|
||||
width: fit-content;
|
||||
|
||||
.logo {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid var(--el-menu-border-color);
|
||||
|
||||
&-collapse {
|
||||
padding: 6px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
img {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
&-img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
span {
|
||||
margin-left: 10px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
&-text {
|
||||
opacity: 0;
|
||||
transition: transform 10s ease-in-out;
|
||||
transform: translateX(-70px);
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu-container {
|
||||
height: 100vh;
|
||||
background: transparent;
|
||||
|
||||
:deep(.el-menu) {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
:deep(.el-menu-item.is-active) {
|
||||
background-color: var(--el-color-primary-light-9) !important;
|
||||
color: var(--el-color-primary) !important;
|
||||
}
|
||||
|
||||
:deep(.el-sub-menu__title.is-active) {
|
||||
color: var(--el-color-primary) !important;
|
||||
}
|
||||
|
||||
:deep(.el-menu-item.is-active .el-icon),
|
||||
:deep(.el-sub-menu__title.is-active .el-icon) {
|
||||
color: inherit !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,157 +0,0 @@
|
|||
<template>
|
||||
<section class="sticky">
|
||||
<el-header class="header">
|
||||
<div class="header-content">
|
||||
<div class="logo">
|
||||
<el-icon class="el-icon--right" size="24" @click="handleToggleCollapse"
|
||||
:class="{ 'collapse': isCollapse }">
|
||||
<Expand />
|
||||
</el-icon>
|
||||
</div>
|
||||
|
||||
<div class="profile">
|
||||
<!-- Tooltip 包裹整个 Dropdown，提示框指向头像 -->
|
||||
<el-dropdown @command="handleDropdownCommand" class="lang-dropdown">
|
||||
<span class="el-dropdown-lang">
|
||||
{{ langText }}
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item v-for="item in lang" :key="item.id" :command="item.text">{{ item.text
|
||||
}}</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-tooltip :content="tooltip" placement="left-start">
|
||||
<el-dropdown placement="bottom-start">
|
||||
<el-icon size="24" class="avatar-icon" style="cursor: pointer;">
|
||||
<Avatar />
|
||||
</el-icon>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<!-- <el-dropdown-item @click="handleChangePassword">修改密码</el-dropdown-item> -->
|
||||
<el-dropdown-item @click="handleLogout">退出登录</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
</section>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ArrowDown } from '@element-plus/icons-vue'
|
||||
import { Expand, Avatar } from '@element-plus/icons-vue'
|
||||
import { useUserStore } from '@/stores/user'
|
||||
import { useLocalStorage } from '@/utils/storage'
|
||||
|
||||
const router = useRouter()
|
||||
const userStore = useUserStore()
|
||||
const tooltip = ref(`当前登录用户:${useLocalStorage.get('user').value?.username || ''}`)
|
||||
const lang = ref([
|
||||
{
|
||||
id: 'zh-CN',
|
||||
text: '中文'
|
||||
},
|
||||
{
|
||||
id: 'en-US',
|
||||
text: '英文'
|
||||
}
|
||||
])
|
||||
const langText = ref('中文')
|
||||
|
||||
// 接收折叠状态
|
||||
const props = defineProps<{
|
||||
isCollapse: boolean
|
||||
}>()
|
||||
|
||||
// 触发父组件的切换方法
|
||||
const emit = defineEmits<{
|
||||
'toggle-collapse': []
|
||||
}>()
|
||||
|
||||
const handleToggleCollapse = () => {
|
||||
emit('toggle-collapse')
|
||||
}
|
||||
const handleLogout = () => {
|
||||
userStore.logout()
|
||||
}
|
||||
const handleChangePassword = () => {
|
||||
router.push('/user/change-password')
|
||||
}
|
||||
const handleDropdownCommand = (command: string) => {
|
||||
langText.value = command
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.header {
|
||||
height: 50px;
|
||||
|
||||
.header-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
|
||||
.logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.el-icon--right {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.collapse {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
.profile {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.lang-dropdown {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.el-dropdown-lang {
|
||||
cursor: pointer;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
|
||||
&:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-icon {
|
||||
cursor: pointer;
|
||||
|
||||
&:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
height: 35px;
|
||||
border-top: 1px solid var(--el-menu-border-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<el-main>
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="route-fade" mode="out-in" appear>
|
||||
<component :is="Component" />
|
||||
</transition>
|
||||
</router-view>
|
||||
</el-main>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style scoped lang="scss">
|
||||
/* 过渡动画的 CSS 类（前缀和 Transition 的 name 一致） */
|
||||
/* 进入动画开始 */
|
||||
.route-fade-enter-from {
|
||||
opacity: 0;
|
||||
transform: translateX(20px);
|
||||
/* 可选：从右侧滑入 */
|
||||
}
|
||||
|
||||
/* 进入动画结束 */
|
||||
.route-fade-enter-active {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.route-fade-enter-to {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* 退出动画开始 */
|
||||
.route-fade-leave-from {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* 退出动画结束 */
|
||||
.route-fade-leave-active {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.route-fade-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(-20px);
|
||||
/* 可选：向左侧滑出 */
|
||||
}
|
||||
</style>
|
||||
15
src/main.ts
15
src/main.ts
|
|
@ -1,15 +0,0 @@
|
|||
import { createApp } from 'vue'
|
||||
import { createPinia } from 'pinia'
|
||||
import './styles/global.scss'
|
||||
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import { useUserStore } from './stores/user'
|
||||
const app = createApp(App)
|
||||
|
||||
app.use(createPinia())
|
||||
app.use(router)
|
||||
// ✅ 页面加载时优先执行initUser，恢复菜单
|
||||
const userStore = useUserStore();
|
||||
userStore.initUser();
|
||||
app.mount('#app')
|
||||
|
|
@ -1,96 +0,0 @@
|
|||
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import { useLocalStorage, useSessionStorage } from '@/utils/storage'
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'Layout',
|
||||
component: () => import('@/views/Layout/index.vue'),
|
||||
meta: {
|
||||
title: '首页',
|
||||
transition: 'none'
|
||||
},
|
||||
children: [
|
||||
// 修改密码
|
||||
// {
|
||||
// path: '/user/change-password',
|
||||
// name: 'ChangePassword',
|
||||
// component: () => import('@/views/User/ChangePassword.vue'),
|
||||
// meta: {
|
||||
// title: '修改密码',
|
||||
// transition: 'fade'
|
||||
// }
|
||||
// },
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
component: () => import('@/views/User/Login.vue'),
|
||||
meta: {
|
||||
title: '登录',
|
||||
transition: 'none'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: '/reset-password',
|
||||
// name: 'ResetPassword',
|
||||
// component: () => import('@/views/User/ResetPassword.vue'),
|
||||
// meta: {
|
||||
// title: '重置密码',
|
||||
// transition: 'none'
|
||||
// }
|
||||
// },
|
||||
// 新增：404 页面（必须最后添加）
|
||||
{
|
||||
path: '/404',
|
||||
name: '404',
|
||||
component: () => import('@/views/404/index.vue'),
|
||||
meta: { title: '页面不存在', transition: 'none' }
|
||||
},
|
||||
{
|
||||
path: '/:pathMatch(.*)*',
|
||||
redirect: '/404',
|
||||
}
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(),
|
||||
routes
|
||||
})
|
||||
|
||||
// 导航守卫
|
||||
// 定义无需登录的白名单页面（登录、重置密码、404等）
|
||||
const whiteList = ['/login', '/reset-password', '/404'];
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
// 1. 设置页面标题（优化类型判断）
|
||||
if (to.meta.title && typeof to.meta.title === 'string') {
|
||||
document.title = to.meta.title;
|
||||
}
|
||||
|
||||
// 2. 获取 token（使用封装的 useLocalStorage.get，添加空值保护）
|
||||
const token = useLocalStorage.get<string>('token');
|
||||
|
||||
// 4. 路由鉴权
|
||||
if (token?.value) {
|
||||
// 已登录：如果访问白名单页面，重定向到首页
|
||||
if (whiteList.includes(to.path)) {
|
||||
next('/'); // 唯一调用：重定向首页
|
||||
} else {
|
||||
// 已登录且访问非白名单页面，正常放行
|
||||
next();
|
||||
}
|
||||
} else {
|
||||
// 未登录：如果访问白名单页面，正常放行
|
||||
if (whiteList.includes(to.path)) {
|
||||
next();
|
||||
} else {
|
||||
// 未登录且访问非白名单页面，重定向到登录页
|
||||
next('/login');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
export default router
|
||||
|
|
@ -1,237 +0,0 @@
|
|||
// 导入单独抽离的类型
|
||||
import type { UserInfo, LoginForm, LoginResponse, ResetPasswordForm, ResetPasswordResponse, ChangePasswordForm, ChangePasswordResponse } from '@/type/user';
|
||||
import { request } from '@/api/index'
|
||||
import { useLocalStorage, useSessionStorage } from '@/utils/storage'
|
||||
import router from '@/router';
|
||||
/**
|
||||
* 用户状态管理 Store
|
||||
* 核心功能：登录、登出、状态持久化、初始化用户信息
|
||||
*/
|
||||
export const useUserStore = defineStore('user', () => {
|
||||
// ========== 响应式状态 ==========
|
||||
/** 用户基本信息 */
|
||||
const userInfo = ref<UserInfo>({
|
||||
id: '',
|
||||
username: '',
|
||||
nickname: '',
|
||||
roles: [],
|
||||
permissions: []
|
||||
});
|
||||
/** 用户登录令牌 */
|
||||
const token = ref<string>('');
|
||||
/** 是否加载中（登录/登出请求时） */
|
||||
const loading = ref<boolean>(false);
|
||||
// ========== 方法 ==========
|
||||
/**
|
||||
* 用户登录
|
||||
* @param form 登录表单数据
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
const login = async (form: LoginForm): Promise<void> => {
|
||||
try {
|
||||
loading.value = true;
|
||||
// 使用API服务进行登录请求
|
||||
const response = await request.post<LoginResponse>('/login', form);
|
||||
|
||||
// 从响应中获取数据
|
||||
const res = response.data;
|
||||
ElNotification({
|
||||
type: 'success',
|
||||
message: '登录成功',
|
||||
duration: 2000
|
||||
})
|
||||
// 更新响应式状态
|
||||
userInfo.value = res.data.user;
|
||||
token.value = res.data.user.token ?? '';
|
||||
// 持久化到本地存储（防止页面刷新丢失）
|
||||
useLocalStorage.set('user', res.data.user);
|
||||
useLocalStorage.set('token', res.data.user.token);
|
||||
} catch (error) {
|
||||
// 统一错误处理
|
||||
const errMsg = error instanceof Error ? error.message : '登录异常';
|
||||
ElNotification({
|
||||
type: 'error',
|
||||
message: errMsg,
|
||||
duration: 2000
|
||||
})
|
||||
throw new Error(errMsg); // 抛出错误让组件层捕获
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 用户登出
|
||||
*/
|
||||
const logout = async (): Promise<void> => {
|
||||
try {
|
||||
loading.value = true;
|
||||
// 使用API服务进行登出请求
|
||||
await request.post<LoginResponse>('/logout');
|
||||
} catch (error) {
|
||||
// 统一错误处理
|
||||
const errMsg = error instanceof Error ? error.message : '登出异常';
|
||||
ElNotification({
|
||||
type: 'error',
|
||||
message: errMsg,
|
||||
duration: 2000
|
||||
})
|
||||
throw new Error(errMsg); // 抛出错误让组件层捕获
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
// 清空响应式状态
|
||||
userInfo.value = {
|
||||
id: '',
|
||||
username: '',
|
||||
nickname: '',
|
||||
roles: [],
|
||||
permissions: []
|
||||
};
|
||||
token.value = '';
|
||||
|
||||
// 清除本地存储
|
||||
useLocalStorage.remove('user');
|
||||
useLocalStorage.remove('token');
|
||||
useSessionStorage.remove('backPath');
|
||||
useLocalStorage.remove('menus');
|
||||
// 可选：登出后跳转到登录页（如果需要）
|
||||
// 使用 Vue Router 进行跳转
|
||||
// 显示登出成功通知
|
||||
ElNotification({
|
||||
type: 'success',
|
||||
message: '退出登录',
|
||||
duration: 2000
|
||||
});
|
||||
// 跳转到登录页
|
||||
router.push('/login');
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化用户信息（页面刷新后恢复）
|
||||
*/
|
||||
const initUser = (): void => {
|
||||
try {
|
||||
const savedUser = useLocalStorage.get('user');
|
||||
const savedToken = useLocalStorage.get('token');
|
||||
const savedMenus = useLocalStorage.get('menus');
|
||||
if (savedUser.value && savedToken.value) {
|
||||
// 类型断言 + 验证，确保数据格式正确
|
||||
const parsedUser = savedUser.value as UserInfo;
|
||||
// 基础校验（防止本地存储数据被篡改）
|
||||
if (parsedUser.id && parsedUser.username) {
|
||||
userInfo.value = parsedUser;
|
||||
token.value = savedToken.value;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('初始化用户信息失败:', error);
|
||||
// 校验失败则清空本地存储
|
||||
useLocalStorage.remove('user');
|
||||
useLocalStorage.remove('token');
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 检查用户是否拥有指定权限
|
||||
* @param permission 权限标识
|
||||
* @returns boolean
|
||||
*/
|
||||
const hasPermission = (permission: string): boolean => {
|
||||
return userInfo.value.permissions.includes(permission);
|
||||
};
|
||||
|
||||
/**
|
||||
* 检查用户是否拥有指定角色
|
||||
* @param role 角色标识
|
||||
* @returns boolean
|
||||
*/
|
||||
const hasRole = (role: string): boolean => {
|
||||
return userInfo.value.roles.includes(role);
|
||||
};
|
||||
/**
|
||||
* 重置密码
|
||||
* @param form 重置密码表单数据
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
const resetPassword = async (form: ResetPasswordForm): Promise<void> => {
|
||||
try {
|
||||
loading.value = true;
|
||||
// 使用API服务进行重置密码请求
|
||||
const response = await request.post<ResetPasswordResponse>('user/reset-password', form);
|
||||
|
||||
// 从响应中获取数据
|
||||
const res = response.data;
|
||||
ElNotification({
|
||||
type: 'success',
|
||||
message: '密码重置成功',
|
||||
duration: 2000
|
||||
});
|
||||
|
||||
// 重置成功后跳转到登录页
|
||||
router.push('/login');
|
||||
} catch (error) {
|
||||
// 统一错误处理
|
||||
const errMsg = error instanceof Error ? error.message : '密码重置失败';
|
||||
ElNotification({
|
||||
type: 'error',
|
||||
message: errMsg,
|
||||
duration: 2000
|
||||
});
|
||||
throw new Error(errMsg); // 抛出错误让组件层捕获
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 修改密码
|
||||
* @param form 修改密码表单数据
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
const changePassword = async (form: ChangePasswordForm): Promise<void> => {
|
||||
try {
|
||||
loading.value = true;
|
||||
// 使用API服务进行修改密码请求
|
||||
const response = await request.post<ChangePasswordResponse>('user/change-password', form);
|
||||
|
||||
// 从响应中获取数据
|
||||
const res = response.data;
|
||||
ElNotification({
|
||||
type: 'success',
|
||||
message: '密码修改成功',
|
||||
duration: 2000
|
||||
});
|
||||
|
||||
// 修改成功后跳转到登录页
|
||||
useLocalStorage.remove('token');
|
||||
router.push('/login');
|
||||
} catch (error) {
|
||||
// 统一错误处理
|
||||
const errMsg = error instanceof Error ? error.message : '密码修改失败';
|
||||
ElNotification({
|
||||
type: 'error',
|
||||
message: errMsg,
|
||||
duration: 2000
|
||||
});
|
||||
throw new Error(errMsg); // 抛出错误让组件层捕获
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// ========== 暴露状态和方法 ==========
|
||||
return {
|
||||
// 状态和数据
|
||||
userInfo,
|
||||
token,
|
||||
loading,
|
||||
// 方法
|
||||
login,
|
||||
logout,
|
||||
initUser,
|
||||
hasPermission,
|
||||
hasRole,
|
||||
resetPassword,
|
||||
changePassword
|
||||
};
|
||||
});
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
// 确保 html 和 body 没有默认边距
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden; // 直接隐藏溢出内容
|
||||
}
|
||||
|
||||
.app-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(to top, #ffffff, #e8edf5);
|
||||
}
|
||||
|
||||
// 登录和忘记密码公用样式
|
||||
.user-container {
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card {
|
||||
width: 375px;
|
||||
padding: 28px;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
margin-bottom: 26px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
// 设计稿基准尺寸（根据你的实际设计稿调整，一般是 1920px 或 375px）
|
||||
$design-width: 1920px; // 桌面端设计稿宽度
|
||||
$design-height: 1080px; // 桌面端设计稿高度
|
||||
|
||||
// px 转 vw 函数（核心）
|
||||
@function vw($px) {
|
||||
@if unitless($px) {
|
||||
$px: $px * 1px;
|
||||
}
|
||||
@return ($px / $design-width) * 100vw;
|
||||
}
|
||||
|
||||
// px 转 vh 函数
|
||||
@function vh($px) {
|
||||
@if unitless($px) {
|
||||
$px: $px * 1px;
|
||||
}
|
||||
@return ($px / $design-height) * 100vh;
|
||||
}
|
||||
|
||||
// 响应式字体大小 mixin（适配不同屏幕）
|
||||
@mixin font-size($px) {
|
||||
font-size: $px;
|
||||
font-size: vw($px);
|
||||
}
|
||||
|
||||
// 响应式尺寸 mixin（宽/高/间距通用）
|
||||
@mixin size-vw($width, $height: $width) {
|
||||
width: vw($width);
|
||||
height: vw($height);
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
/**
|
||||
* 通用 API 响应接口
|
||||
* @template T - data 字段的类型，默认值为 any
|
||||
*/
|
||||
export interface ApiResponse<T = any> {
|
||||
msg: string;
|
||||
success: boolean;
|
||||
code: number;
|
||||
message: string;
|
||||
data: T;
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户信息接口（登录返回的 user 字段）
|
||||
*/
|
||||
export interface UserInfo {
|
||||
username: string;
|
||||
token: string;
|
||||
expiresIn: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录接口返回的 data 结构
|
||||
*/
|
||||
export interface LoginResponseData {
|
||||
user: UserInfo;
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录接口的完整响应类型
|
||||
* （通用 ApiResponse + 登录专属的 data 类型）
|
||||
*/
|
||||
export type LoginApiResponse = ApiResponse<LoginResponseData>;
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
// 1. 后端返回的原始菜单数据类型（严格匹配接口返回）
|
||||
export interface RawMenuItem {
|
||||
id: number;
|
||||
name: string; // 菜单显示名称
|
||||
api: string; // 接口路径
|
||||
path: string; // 路由路径
|
||||
icon: string; // 后端返回的图标字段（为空字符串）
|
||||
parent_id: number; // 父菜单ID
|
||||
sort: number; // 排序序号
|
||||
type: number; // 菜单类型（1表示菜单）
|
||||
status: number; // 状态（1表示启用）
|
||||
son?: RawMenuItem[]; // 子菜单列表
|
||||
}
|
||||
|
||||
// 2. 前端适配 Element Plus 的菜单类型（增强版）
|
||||
export interface MenuItem {
|
||||
// 基础属性
|
||||
id: number;
|
||||
name: string;
|
||||
path: string;
|
||||
index: string; // 对应 el-menu-item / el-sub-menu 的 index 属性
|
||||
icon?: Component; // 图标组件或图标名称
|
||||
isSubMenu: boolean; // 是否是子菜单容器
|
||||
children?: MenuItem[]; // 子菜单列表（统一命名为children，更符合Vue习惯）
|
||||
// 原始数据保留（便于后续使用）
|
||||
raw?: RawMenuItem;
|
||||
}
|
||||
|
||||
// 4. 图标映射类型（约束图标映射表的类型）
|
||||
export type IconMap = Record<string, Component>;
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
// src/utils/storage.types.ts
|
||||
import type { Ref } from 'vue'
|
||||
|
||||
/**
|
||||
* 存储类型
|
||||
*/
|
||||
export type StorageType = 'localStorage' | 'sessionStorage'
|
||||
|
||||
/**
|
||||
* 存储选项
|
||||
*/
|
||||
export interface StorageOptions {
|
||||
/**
|
||||
* 存储类型，默认为 localStorage
|
||||
*/
|
||||
type?: StorageType
|
||||
/**
|
||||
* 命名空间，避免键名冲突
|
||||
*/
|
||||
namespace?: string
|
||||
}
|
||||
|
||||
/**
|
||||
* 存储工具返回的方法集合类型
|
||||
*/
|
||||
export interface StorageTool {
|
||||
/**
|
||||
* 获取存储值（响应式）
|
||||
* @param key 键名
|
||||
* @param defaultValue 默认值
|
||||
* @returns 响应式存储值
|
||||
*/
|
||||
get: <T = any>(key: string, defaultValue?: T) => Ref<T | null>
|
||||
|
||||
/**
|
||||
* 设置存储值
|
||||
* @param key 键名
|
||||
* @param value 值
|
||||
*/
|
||||
set: <T = any>(key: string, value: T) => void
|
||||
|
||||
/**
|
||||
* 移除存储值
|
||||
* @param key 键名
|
||||
*/
|
||||
remove: (key: string) => void
|
||||
|
||||
/**
|
||||
* 清空存储
|
||||
* @param withNamespace 是否只清空当前命名空间下的存储
|
||||
*/
|
||||
clear: (withNamespace?: boolean) => void
|
||||
|
||||
/**
|
||||
* 检查键是否存在
|
||||
* @param key 键名
|
||||
* @returns 是否存在
|
||||
*/
|
||||
has: (key: string) => boolean
|
||||
|
||||
/**
|
||||
* 获取所有键
|
||||
* @param withNamespace 是否只获取当前命名空间下的键
|
||||
* @returns 键名数组
|
||||
*/
|
||||
keys: (withNamespace?: boolean) => string[]
|
||||
}
|
||||
|
|
@ -1,69 +0,0 @@
|
|||
/**
|
||||
* 用户信息类型定义
|
||||
*/
|
||||
export interface UserInfo {
|
||||
// 基础字段（根据你的实际业务调整）
|
||||
id: string | number;
|
||||
username: string;
|
||||
nickname: string;
|
||||
avatar?: string; // 可选字段
|
||||
email?: string;
|
||||
phone?: string;
|
||||
token?: string;
|
||||
expiresIn?: number; // token过期时间（可选）
|
||||
// 权限相关
|
||||
roles: string[];
|
||||
permissions: string[];
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录表单类型
|
||||
*/
|
||||
export interface LoginForm {
|
||||
email: string;
|
||||
password: string;
|
||||
login_type: number;
|
||||
remember?: boolean; // 可选：记住我
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录接口返回数据类型
|
||||
*/
|
||||
export interface LoginResponse {
|
||||
code: number;
|
||||
message: string;
|
||||
user: UserInfo;
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置密码表单类型
|
||||
*/
|
||||
export interface ResetPasswordForm {
|
||||
username: string;
|
||||
newPassword: string;
|
||||
confirmPassword: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置密码接口返回数据类型
|
||||
*/
|
||||
export interface ResetPasswordResponse {
|
||||
code: number;
|
||||
message: string;
|
||||
}
|
||||
/**
|
||||
* 修改密码表单类型
|
||||
*/
|
||||
export interface ChangePasswordForm {
|
||||
username: string;
|
||||
currentPassword: string;
|
||||
newPassword: string;
|
||||
confirmPassword: string;
|
||||
}
|
||||
/**
|
||||
* 修改密码接口返回数据类型
|
||||
*/
|
||||
export interface ChangePasswordResponse {
|
||||
code: number;
|
||||
message: string;
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
import md5 from 'js-md5';
|
||||
|
||||
// 你的加密函数（原样保留）
|
||||
export const encryptPassword = (password: string, salt = ''): string => {
|
||||
const encryptStr = salt ? password + salt : password;
|
||||
return md5(encryptStr);
|
||||
};
|
||||
|
|
@ -1,113 +0,0 @@
|
|||
import { useStorage } from '@vueuse/core'
|
||||
// 引入抽离的类型
|
||||
import type { StorageOptions, StorageTool } from '@/type/storage'
|
||||
|
||||
/**
|
||||
* 通用存储工具
|
||||
* @param options 存储选项
|
||||
* @returns 包含增删改查方法的对象
|
||||
*/
|
||||
export function createStorage(options: StorageOptions = {}): StorageTool {
|
||||
const {
|
||||
type = 'localStorage',
|
||||
namespace = 'foreign_'
|
||||
} = options
|
||||
|
||||
// 获取存储实例
|
||||
const storageInstance = type === 'localStorage' ? localStorage : sessionStorage
|
||||
|
||||
/**
|
||||
* 拼接键名，添加命名空间
|
||||
*/
|
||||
const getKey = (key: string): string => {
|
||||
if (!key) {
|
||||
throw new Error('存储键名不能为空')
|
||||
}
|
||||
return namespace ? `${namespace}${key}` : key
|
||||
}
|
||||
const serializer = {
|
||||
read: (v: any) => v ? JSON.parse(v) : null,
|
||||
write: (v: any) => JSON.stringify(v),
|
||||
}
|
||||
return {
|
||||
/**
|
||||
* 获取存储值（响应式）
|
||||
* @param key 键名
|
||||
* @param defaultValue 默认值
|
||||
* @returns 响应式存储值
|
||||
*/
|
||||
get: <T = any>(key: string, defaultValue?: T) => {
|
||||
return useStorage<T | null>(getKey(key), defaultValue ?? null, storageInstance, { serializer })
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置存储值
|
||||
* @param key 键名
|
||||
* @param value 值
|
||||
*/
|
||||
set: <T = any>(key: string, value: T) => {
|
||||
const storage = useStorage<T | null>(getKey(key), null, storageInstance, { serializer })
|
||||
storage.value = value
|
||||
},
|
||||
|
||||
/**
|
||||
* 移除存储值
|
||||
* @param key 键名
|
||||
*/
|
||||
remove: (key: string) => {
|
||||
storageInstance.removeItem(getKey(key))
|
||||
},
|
||||
|
||||
/**
|
||||
* 清空存储
|
||||
* @param withNamespace 是否只清空当前命名空间下的存储
|
||||
*/
|
||||
clear: (withNamespace = true) => {
|
||||
if (withNamespace && namespace) {
|
||||
// 只清空当前命名空间的存储
|
||||
Object.keys(storageInstance).forEach(key => {
|
||||
if (key.startsWith(namespace)) {
|
||||
storageInstance.removeItem(key)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 清空所有存储
|
||||
storageInstance.clear()
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 检查键是否存在
|
||||
* @param key 键名
|
||||
* @returns 是否存在
|
||||
*/
|
||||
has: (key: string) => {
|
||||
return Object.prototype.hasOwnProperty.call(storageInstance, getKey(key))
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取所有键
|
||||
* @param withNamespace 是否只获取当前命名空间下的键
|
||||
* @returns 键名数组
|
||||
*/
|
||||
keys: (withNamespace = true) => {
|
||||
const keys = Object.keys(storageInstance)
|
||||
if (withNamespace && namespace) {
|
||||
return keys
|
||||
.filter(key => key.startsWith(namespace))
|
||||
.map(key => key.replace(namespace, ''))
|
||||
}
|
||||
return keys
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 默认 localStorage 存储实例
|
||||
*/
|
||||
export const useLocalStorage = createStorage({ type: 'localStorage' })
|
||||
|
||||
/**
|
||||
* 默认 sessionStorage 存储实例
|
||||
*/
|
||||
export const useSessionStorage = createStorage({ type: 'sessionStorage' })
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
<template>
|
||||
<div class="not-found">
|
||||
<h1>404 - 页面不存在</h1>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.not-found {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
<template>
|
||||
<div class="home-page">
|
||||
<el-container>
|
||||
<Aside :isCollapse="isCollapse" />
|
||||
<el-container class="main-container">
|
||||
<Header :isCollapse="isCollapse" @toggle-collapse="toggleSidebar" />
|
||||
<Main />
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Aside from '@/components/Aside/index.vue'
|
||||
import Header from '@/components/Header/index.vue'
|
||||
import Main from '@/components/Main/index.vue'
|
||||
|
||||
import { useLocalStorage } from '@/utils/storage'
|
||||
// 控制 el-menu 原生折叠的状态
|
||||
const isCollapse = ref(useLocalStorage.get('isCollapse') ?? false)
|
||||
|
||||
// 切换折叠状态的方法
|
||||
const toggleSidebar = () => {
|
||||
isCollapse.value = !isCollapse.value
|
||||
// 同步到 localStorage
|
||||
useLocalStorage.set('isCollapse', isCollapse.value)
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.main-container {
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,76 +0,0 @@
|
|||
<template>
|
||||
<div class="user-container">
|
||||
<div class="card">
|
||||
<div class="header">
|
||||
<h1>修改密码🔑</h1>
|
||||
</div>
|
||||
<el-form :model="changePasswordForm" :rules="formRules" ref="changePasswordFormRef">
|
||||
<el-form-item label="旧密码" prop="currentPassword" :label-position="labelPosition" label-width="100px">
|
||||
<el-input v-model="changePasswordForm.currentPassword" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="newPassword" :label-position="labelPosition" label-width="100px">
|
||||
<el-input v-model="changePasswordForm.newPassword" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认新密码" prop="confirmPassword" :label-position="labelPosition" label-width="100px">
|
||||
<el-input v-model="changePasswordForm.confirmPassword" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="large" style="width: 100%"
|
||||
@click="handleChangePassword">修改密码</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import type { FormRules, FormProps, FormInstance } from 'element-plus'
|
||||
import { useLocalStorage, useSessionStorage } from '@/utils/storage'
|
||||
import { useUserStore } from '@/stores/user'
|
||||
|
||||
const labelPosition = ref<FormProps['labelPosition']>('left')
|
||||
const changePasswordFormRef = ref<FormInstance>()
|
||||
const error = ref('')
|
||||
|
||||
const changePasswordForm = ref({
|
||||
username: useLocalStorage.get('user').value?.username || '',
|
||||
currentPassword: '',
|
||||
newPassword: '',
|
||||
confirmPassword: ''
|
||||
})
|
||||
|
||||
const formRules = reactive<FormRules>({
|
||||
currentPassword: [{ required: true, message: '请输入旧密码', trigger: 'blur' }, { min: 6, message: '旧密码不得少于6位', trigger: 'blur' }],
|
||||
newPassword: [{ required: true, message: '请输入新密码', trigger: 'blur' }, { min: 6, message: '新密码不得少于6位', trigger: 'blur' }],
|
||||
confirmPassword: [{ required: true, message: '请确认新密码', trigger: 'blur' }, {
|
||||
validator: (rule, value, callback) => {
|
||||
if (value !== changePasswordForm.value.newPassword) {
|
||||
callback(new Error('两次输入的密码不一致'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur'
|
||||
}]
|
||||
})
|
||||
const handleChangePassword = async () => {
|
||||
if (!changePasswordFormRef.value) return
|
||||
changePasswordFormRef.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
try {
|
||||
error.value = ''
|
||||
useSessionStorage.set('changePassword', true);
|
||||
await useUserStore().changePassword(changePasswordForm.value)
|
||||
} catch (err) {
|
||||
error.value = err instanceof Error ? err.message : '密码修改失败'
|
||||
}
|
||||
} else {
|
||||
console.log('密码修改表单验证失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.user-container {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,141 +0,0 @@
|
|||
<template>
|
||||
<div class="user-container">
|
||||
<div class="card">
|
||||
<!-- 头部标题 -->
|
||||
<div class="header">
|
||||
<h1>登录 👋</h1>
|
||||
</div>
|
||||
|
||||
<el-form :model="LoginForm" :rules="formRules" ref="loginFormRef" class="login-form" size="default">
|
||||
<!-- 用户名输入 -->
|
||||
<el-form-item label="用户名" prop="username" :label-position="labelPosition" label-width="65px">
|
||||
<el-input v-model="LoginForm.email" placeholder="请输入用户名" :prefix-icon="User" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 密码输入 -->
|
||||
<el-form-item label="密码" prop="password" :label-position="labelPosition" label-width="65px">
|
||||
<el-input v-model="LoginForm.password" type="password" placeholder="请输入密码" :prefix-icon="Lock"
|
||||
show-password />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 记住账号 & 忘记密码 -->
|
||||
<el-form-item class="form-footer">
|
||||
<div class="form-footer-content">
|
||||
<el-checkbox v-model="LoginForm.remember" class="remember-checkbox">记住账号</el-checkbox>
|
||||
<router-link to="/reset-password" class="forgot-password">忘记密码？</router-link>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 登录按钮（Element Plus 主按钮规范） -->
|
||||
<el-form-item width="100%">
|
||||
<el-button type="primary" class="login-btn" size="large" @click="handleLogin" style="width: 100%"
|
||||
:loading="userStore.loading" :disabled="userStore.loading">
|
||||
{{ userStore.loading ? '登录中...' : '登录' }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
// element 导入
|
||||
import type { FormInstance, FormRules, FormProps } from 'element-plus'
|
||||
import { User, Lock } from '@element-plus/icons-vue'
|
||||
// type导入
|
||||
import type { LoginForm as LoginFormType } from '@/type/user'
|
||||
// 业务导入
|
||||
import { useUserStore } from '@/stores/user'
|
||||
import { useLocalStorage, useSessionStorage } from '@/utils/storage'
|
||||
|
||||
// 加密导入
|
||||
import { encryptPassword } from '@/utils/encrypt'
|
||||
|
||||
const router = useRouter()
|
||||
const error = ref('')
|
||||
const userStore = useUserStore()
|
||||
// 表单 Ref（符合 Element Plus 规范）
|
||||
const loginFormRef = ref<FormInstance>()
|
||||
const labelPosition = ref<FormProps['labelPosition']>('left')
|
||||
// 表单数据
|
||||
const LoginForm = reactive<LoginFormType>({
|
||||
email: '1241208486@qq.com',
|
||||
password: encryptPassword('888888'),
|
||||
login_type: 1,
|
||||
})
|
||||
// 表单校验规则（Element Plus 标准校验）
|
||||
const formRules = reactive<FormRules>({
|
||||
email: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
|
||||
password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
|
||||
})
|
||||
|
||||
// 登录
|
||||
const handleLogin = async () => {
|
||||
if (!loginFormRef.value) return
|
||||
loginFormRef.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
try {
|
||||
error.value = ''
|
||||
await userStore.login(LoginForm)
|
||||
saveRememberedUsername()
|
||||
// 如果是登录或者退出登录重新登录，都是跳转首页，如果是从修改密码操作返回登录页，就跳转回修改密码操作前的页面
|
||||
const isChangePassword = useSessionStorage.get('changePassword');
|
||||
const backPath = useSessionStorage.get('backPath') || '/';
|
||||
|
||||
// 2. 先清理 sessionStorage（避免残留，执行顺序关键）
|
||||
useSessionStorage.remove('changePassword');
|
||||
useSessionStorage.remove('backPath');
|
||||
|
||||
// 3. 重置菜单折叠状态（提前执行，避免跳转中断）
|
||||
useLocalStorage.set('isCollapse', false);
|
||||
const targetPath = isChangePassword ? backPath : '/';
|
||||
|
||||
router.push(typeof targetPath === 'string' ? targetPath : targetPath.value || '/');
|
||||
} catch (err) {
|
||||
error.value = err instanceof Error ? err.message : '登录失败'
|
||||
}
|
||||
} else {
|
||||
console.log('登录表单验证失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 记住账号
|
||||
const saveRememberedUsername = () => {
|
||||
if (LoginForm.remember) {
|
||||
useLocalStorage.set('rememberedUsername', LoginForm.email)
|
||||
} else {
|
||||
useLocalStorage.remove('rememberedUsername')
|
||||
}
|
||||
}
|
||||
// 从本地存储加载记住的用户名
|
||||
const loadRememberedUsername = () => {
|
||||
const rememberedUsername = useLocalStorage.get('rememberedUsername')
|
||||
if (rememberedUsername.value) {
|
||||
LoginForm.email = rememberedUsername.value
|
||||
LoginForm.remember = true
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
// 组件挂载时加载记住的用户名
|
||||
loadRememberedUsername()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.login-form {
|
||||
.form-footer {
|
||||
.form-footer-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
.forgot-password {
|
||||
color: #409eff;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,77 +0,0 @@
|
|||
<template>
|
||||
<div class="user-container">
|
||||
<div class="card">
|
||||
<!-- 头部标题 -->
|
||||
<div class="header">
|
||||
<h1>重置密码?🤦🏻♂️</h1>
|
||||
</div>
|
||||
<!-- 重置密码表单 -->
|
||||
<el-form :model="ResetPasswordForm" :rules="formRules" ref="ResetPasswordFormRef">
|
||||
<el-form-item label="用户名" prop="username" :label-position="labelPosition" label-width="80px">
|
||||
<el-input v-model="ResetPasswordForm.username" type="=text" placeholder="请输入用户名"
|
||||
:prefix-icon="User" />
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="newPassword" :label-position="labelPosition" label-width="80px">
|
||||
<el-input v-model="ResetPasswordForm.newPassword" type="password" placeholder="请输入新密码"
|
||||
:prefix-icon="Lock" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="confirmPassword" :label-position="labelPosition" label-width="80px">
|
||||
<el-input v-model="ResetPasswordForm.confirmPassword" type="password" placeholder="请确认新密码"
|
||||
:prefix-icon="Lock" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item width="100%">
|
||||
<el-button type="primary" class="login-btn" size="large" @click="handleResetPassword"
|
||||
style="width: 100%" :loading="userStore.loading" :disabled="userStore.loading">
|
||||
{{ userStore.loading ? '' : '重置密码' }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import type { FormRules, FormProps, FormInstance } from 'element-plus'
|
||||
import { User, Lock } from '@element-plus/icons-vue'
|
||||
|
||||
// 业务导入
|
||||
import { useUserStore } from '@/stores/user'
|
||||
const userStore = useUserStore()
|
||||
|
||||
const labelPosition = ref<FormProps['labelPosition']>('left')
|
||||
const ResetPasswordFormRef = ref<FormInstance>()
|
||||
const ResetPasswordForm = reactive({
|
||||
username: '',
|
||||
newPassword: '',
|
||||
confirmPassword: ''
|
||||
})
|
||||
// 表单校验规则（Element Plus 标准校验）
|
||||
const formRules = reactive<FormRules>({
|
||||
username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
|
||||
newPassword: [{ required: true, message: '请输入新密码', trigger: 'blur' }, { min: 6, message: '新密码不得少于6位', trigger: 'blur' }],
|
||||
confirmPassword: [{
|
||||
required: true, message: '请确认新密码', trigger: 'blur'
|
||||
}, {
|
||||
validator: (rule, value, callback) => {
|
||||
if (value !== ResetPasswordForm.newPassword) {
|
||||
callback(new Error('两次输入的密码不一致'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur'
|
||||
}]
|
||||
})
|
||||
|
||||
// 重置密码处理函数
|
||||
const handleResetPassword = async () => {
|
||||
if (!ResetPasswordFormRef.value) return
|
||||
ResetPasswordFormRef.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
await userStore.resetPassword(ResetPasswordForm)
|
||||
} else {
|
||||
console.log('重置密码表单验证失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"include": [
|
||||
"env.d.ts",
|
||||
"src/**/*",
|
||||
"src/**/*.vue"
|
||||
],
|
||||
"exclude": [
|
||||
"src/**/__tests__/*"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"./src/*"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
{
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.app.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"extends": "@tsconfig/node24/tsconfig.json",
|
||||
"include": [
|
||||
"vite.config.*",
|
||||
"vitest.config.*",
|
||||
"cypress.config.*",
|
||||
"nightwatch.conf.*",
|
||||
"playwright.config.*",
|
||||
"eslint.config.*"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"noEmit": true,
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Bundler",
|
||||
"types": [
|
||||
"node"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -1,92 +0,0 @@
|
|||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueDevTools from 'vite-plugin-vue-devtools'
|
||||
|
||||
// auto import - 新增的自动导入插件导入
|
||||
import AutoImport from 'unplugin-auto-import/vite'
|
||||
import Components from 'unplugin-vue-components/vite'
|
||||
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
|
||||
import ElementPlus from 'unplugin-element-plus/vite'
|
||||
import Icons from 'unplugin-icons/vite'
|
||||
import IconsResolver from 'unplugin-icons/resolver'
|
||||
|
||||
// https://vite.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
vueDevTools(),
|
||||
|
||||
// Element Plus 样式按需导入
|
||||
ElementPlus({
|
||||
useSource: true
|
||||
}),
|
||||
// 自动导入 API
|
||||
AutoImport({
|
||||
// 自动导入Vue、VueRouter、Pinia、VueUse等核心API
|
||||
imports: [
|
||||
'vue',
|
||||
'vue-router',
|
||||
'pinia',
|
||||
'@vueuse/core'
|
||||
],
|
||||
// 解析Element Plus和图标组件的API
|
||||
resolvers: [
|
||||
ElementPlusResolver(),
|
||||
IconsResolver({
|
||||
prefix: 'Icon'
|
||||
})
|
||||
],
|
||||
// 生成类型声明文件，解决TS类型提示问题
|
||||
dts: './src/auto-imports.d.ts',
|
||||
// 生成eslint配置，解决自动导入的eslint报错
|
||||
eslintrc: {
|
||||
enabled: true,
|
||||
filepath: './.eslintrc-auto-import.json'
|
||||
}
|
||||
}),
|
||||
// 自动导入组件
|
||||
Components({
|
||||
// 自动导入自定义组件的目录
|
||||
dirs: ['src/components'],
|
||||
resolvers: [
|
||||
// 自动导入Element Plus组件
|
||||
ElementPlusResolver(),
|
||||
// 自动导入图标组件
|
||||
IconsResolver({
|
||||
enabledCollections: ['ep'], // Element Plus图标集
|
||||
prefix: 'Icon'
|
||||
})
|
||||
],
|
||||
// 生成组件类型声明文件
|
||||
dts: './src/components.d.ts'
|
||||
}),
|
||||
// 自动导入图标
|
||||
Icons({
|
||||
autoInstall: true, // 自动安装缺失的图标依赖
|
||||
scale: 1, // 图标缩放比例
|
||||
defaultClass: 'inline-block' // 图标默认样式
|
||||
}),
|
||||
// ========== 新增的自动导入配置结束 ==========
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
},
|
||||
},
|
||||
// 跨域代理核心配置
|
||||
server: {
|
||||
port: 5173, // 前端项目运行端口（可自定义）
|
||||
cors: true, // 允许跨域（基础配置）
|
||||
proxy: {
|
||||
// 匹配以 /api 开头的请求
|
||||
'/api': {
|
||||
target: 'http://192.168.10.10:8085', // 后端接口基础地址
|
||||
changeOrigin: true, // 开启跨域（关键）
|
||||
rewrite: (path) => path.replace(/^\/api/, '/api') // 路径重写（根据后端实际情况调整）
|
||||
// 如果后端接口没有 /api 前缀，需要改为：rewrite: (path) => path.replace(/^\/api/, '')
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
Loading…
Reference in New Issue