build(projects): update tsconfig、eslintrc
This commit is contained in:
Soybean
parent
4093dcd6dc
commit
75de2b0604
@ -1,12 +1,11 @@
|
||||
# Editor configuration, see http://editorconfig.org
|
||||
|
||||
# 表示是最顶层的 EditorConfig 配置文件
|
||||
root = true
|
||||
|
||||
[*] # 表示所有文件适用
|
||||
charset = utf-8 # 设置文件字符集为 utf-8
|
||||
indent_style = tab # 缩进风格（tab | space）
|
||||
indent_size = 2 # 缩进大小
|
||||
end_of_line = lf # 控制换行类型(lf | cr | crlf)
|
||||
trim_trailing_whitespace = true # 去除行首的任意空白字符
|
||||
insert_final_newline = true # 始终在文件末尾插入一个新行
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = tab
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
@ -13,10 +13,10 @@ type ServiceEnv = Record<
|
||||
export const serviceEnv: ServiceEnv = {
|
||||
test: {
|
||||
env: 'test',
|
||||
url: 'http://www.baidu.com'
|
||||
url: 'http://www.baidu.com',
|
||||
},
|
||||
prod: {
|
||||
env: 'prod',
|
||||
url: 'http://www.baidu.com'
|
||||
}
|
||||
url: 'http://www.baidu.com',
|
||||
},
|
||||
};
|
||||
|
||||
@ -1 +1,2 @@
|
||||
# 是否开启打包文件大小结果分析
|
||||
VITE_VISUALIZER=false
|
||||
|
||||
@ -11,6 +11,6 @@ lib
|
||||
/docs
|
||||
.vscode
|
||||
.local
|
||||
package.json
|
||||
components.d.ts
|
||||
!.env-config.ts
|
||||
package.json
|
||||
|
||||
156
.eslintrc.js
156
.eslintrc.js
@ -1,30 +1,34 @@
|
||||
module.exports = {
|
||||
env: {
|
||||
browser: true,
|
||||
es2021: true
|
||||
es2021: true,
|
||||
'vue/setup-compiler-macros': true,
|
||||
},
|
||||
globals: {
|
||||
defineProps: 'readonly',
|
||||
defineEmits: 'readonly',
|
||||
defineExpose: 'readonly',
|
||||
withDefaults: 'readonly',
|
||||
PROJECT_BUILD_TIME: 'readonly',
|
||||
AMap: 'readonly',
|
||||
BMap: 'readonly',
|
||||
TMap: 'readonly'
|
||||
TMap: 'readonly',
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
parserOptions: {
|
||||
ecmaVersion: 12,
|
||||
parser: '@typescript-eslint/parser',
|
||||
sourceType: 'module'
|
||||
sourceType: 'module',
|
||||
},
|
||||
plugins: ['vue', '@typescript-eslint'],
|
||||
extends: ['plugin:vue/vue3-recommended', 'airbnb-base', '@vue/typescript/recommended', 'plugin:prettier/recommended'],
|
||||
extends: [
|
||||
'airbnb-base',
|
||||
'eslint:recommended',
|
||||
'plugin:vue/vue3-recommended',
|
||||
'plugin:prettier/recommended',
|
||||
'@vue/eslint-config-typescript/recommended',
|
||||
'@vue/eslint-config-prettier',
|
||||
'@vue/typescript/recommended',
|
||||
],
|
||||
rules: {
|
||||
'import/extensions': 'off',
|
||||
'import/no-extraneous-dependencies': 'off',
|
||||
'import/no-unresolved': 0,
|
||||
'import/order': [
|
||||
'error',
|
||||
{
|
||||
@ -34,129 +38,167 @@ module.exports = {
|
||||
{
|
||||
pattern: 'vue',
|
||||
group: 'external',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: 'vue-router',
|
||||
group: 'external',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: 'vuex',
|
||||
group: 'external',
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: 'pinia',
|
||||
group: 'external',
|
||||
position: 'before'
|
||||
},
|
||||
{
|
||||
pattern: 'naive-ui',
|
||||
group: 'external',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
// ui framework, such as "naive-ui"
|
||||
// {
|
||||
// pattern: 'naive-ui',
|
||||
// group: 'external',
|
||||
// position: 'before'
|
||||
// },
|
||||
{
|
||||
pattern: '@/config',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/settings',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/enum',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/plugins',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/layouts',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
},
|
||||
{
|
||||
pattern: '@/layouts',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/views',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/components',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/router',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/store',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/composables',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/hooks',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/service',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/utils',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/assets',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/**',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
position: 'before',
|
||||
},
|
||||
{
|
||||
pattern: '@/interface',
|
||||
group: 'internal',
|
||||
position: 'before'
|
||||
}
|
||||
position: 'before',
|
||||
},
|
||||
],
|
||||
pathGroupsExcludedImportTypes: ['vue', 'vue-router', 'pinia', 'naive-ui']
|
||||
}
|
||||
pathGroupsExcludedImportTypes: [
|
||||
'vue',
|
||||
'vue-router',
|
||||
'vuex',
|
||||
'pinia',
|
||||
// 'naive-ui'
|
||||
],
|
||||
},
|
||||
],
|
||||
'import/prefer-default-export': 0,
|
||||
'max-classes-per-file': 0,
|
||||
'no-shadow': 0,
|
||||
'import/no-unresolved': 'off',
|
||||
'import/prefer-default-export': 'off',
|
||||
'max-classes-per-file': 'off',
|
||||
'no-param-reassign': [
|
||||
'error',
|
||||
{
|
||||
props: true,
|
||||
ignorePropertyModificationsFor: ['state', 'acc', 'e'],
|
||||
},
|
||||
],
|
||||
'no-plusplus': 'off',
|
||||
'no-shadow': 'off',
|
||||
'no-unused-vars': 'off',
|
||||
'no-use-before-define': 'off',
|
||||
'vue/comment-directive': 0,
|
||||
'vue/multi-word-component-names': 0,
|
||||
'@typescript-eslint/ban-types': 'off',
|
||||
'@typescript-eslint/ban-ts-ignore': 'off',
|
||||
'@typescript-eslint/explicit-function-return-type': 'off',
|
||||
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
||||
'@typescript-eslint/no-empty-function': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 0,
|
||||
'@typescript-eslint/no-inferrable-types': 0,
|
||||
'@typescript-eslint/no-non-null-assertion': 'off',
|
||||
'@typescript-eslint/no-unused-vars': ['warn', { ignoreRestSiblings: true, varsIgnorePattern: 'Ignored' }],
|
||||
'vue/multi-word-component-names': [
|
||||
'error',
|
||||
{
|
||||
ignores: ['index'],
|
||||
},
|
||||
],
|
||||
'@typescript-eslint/ban-types': [
|
||||
'error',
|
||||
{
|
||||
types: {
|
||||
'{}': {
|
||||
message: 'Use object instead',
|
||||
fixWith: 'object',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'@typescript-eslint/no-shadow': 'error',
|
||||
'@typescript-eslint/no-unused-vars': ['warn', { ignoreRestSiblings: true, varsIgnorePattern: '^_' }],
|
||||
'@typescript-eslint/no-use-before-define': ['error', { classes: true, functions: false, typedefs: false }],
|
||||
'@typescript-eslint/no-var-requires': 'off'
|
||||
}
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
files: ['*.vue'],
|
||||
rules: {
|
||||
'no-undef': 'off',
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['*.html'],
|
||||
rules: {
|
||||
'vue/comment-directive': 'off',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
7
.gitignore
vendored
7
.gitignore
vendored
@ -11,17 +11,20 @@ node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
stats.html
|
||||
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
!.vscode/settings.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
stats.html
|
||||
|
||||
@ -1,27 +1,27 @@
|
||||
module.exports = {
|
||||
printWidth: 120, // 超过最大值换行
|
||||
tabWidth: 2, // 缩进字节数
|
||||
useTabs: false, // 缩进使用tab，不使用空格
|
||||
semi: true, // 句尾添加分号
|
||||
singleQuote: true, // 使用单引号代替双引号
|
||||
proseWrap: 'preserve', // 默认值。因为使用了一些折行敏感型的渲染器（如GitHub comment）而按照markdown文本样式进行折行
|
||||
arrowParens: 'avoid', // (x) => {} 箭头函数参数只有一个时是否要有小括号。avoid：省略括号
|
||||
bracketSpacing: true, // 在对象，数组括号与文字之间加空格 "{ foo: bar }"
|
||||
endOfLine: 'auto', // 结尾是 \n \r \n\r auto
|
||||
eslintIntegration: false, //不让prettier使用eslint的代码格式进行校验
|
||||
htmlWhitespaceSensitivity: 'ignore', // 指定HTML文件的全局空白区域敏感度 有效选项："css"- 遵守CSS display属性的默认值。"strict" - 空格被认为是敏感的。"ignore" - 空格被认为是不敏感的。html 中空格也会占位，影响布局，prettier 格式化的时候可能会将文本换行，造成布局错乱
|
||||
ignorePath: '.prettierignore', // 不使用prettier格式化的文件填写在项目的.prettierignore文件中
|
||||
jsxSingleQuote: false, // 在jsx中使用单引号代替双引号
|
||||
requireConfig: false, // Require a 'prettierconfig' to format prettier
|
||||
stylelintIntegration: false, //不让prettier使用stylelint的代码格式进行校验
|
||||
trailingComma: 'none', // 在对象或数组最后一个元素后面是否加逗号（在ES5中加尾逗号）
|
||||
tslintIntegration: false, // 不让prettier使用tslint的代码格式进行校验
|
||||
module.exports = { // https://prettier.io/docs/en/options.html
|
||||
arrowParens: 'always',
|
||||
bracketSameLine: false,
|
||||
bracketSpacing: true,
|
||||
embeddedLanguageFormatting: 'auto',
|
||||
htmlWhitespaceSensitivity: 'css',
|
||||
insertPragma: false,
|
||||
jsxSingleQuote: false,
|
||||
printWidth: 120,
|
||||
proseWrap: 'preserve',
|
||||
quoteProps: 'as-needed',
|
||||
requirePragma: false,
|
||||
semi: true,
|
||||
singleQuote: true,
|
||||
tabWidth: 2,
|
||||
trailingComma: 'es5',
|
||||
useTabs: false,
|
||||
vueIndentScriptAndStyle: false,
|
||||
overrides: [
|
||||
{
|
||||
files: '*.html',
|
||||
options: {
|
||||
parser: 'html'
|
||||
}
|
||||
}
|
||||
]
|
||||
parser: 'html',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
@ -4,5 +4,5 @@ import dayjs from 'dayjs';
|
||||
const PROJECT_BUILD_TIME = JSON.stringify(dayjs().format('YYYY-MM-DD HH:mm:ss'));
|
||||
|
||||
export const define = {
|
||||
PROJECT_BUILD_TIME
|
||||
PROJECT_BUILD_TIME,
|
||||
};
|
||||
|
||||
@ -10,8 +10,8 @@ export default (config: ConfigEnv): PluginOption[] => {
|
||||
inject: {
|
||||
data: {
|
||||
appName: viteEnv.VITE_APP_NAME,
|
||||
appTitle: viteEnv.VITE_APP_TITLE
|
||||
}
|
||||
}
|
||||
appTitle: viteEnv.VITE_APP_TITLE,
|
||||
},
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
@ -8,14 +8,14 @@ export default (srcPath: string) => {
|
||||
Icons({
|
||||
compiler: 'vue3',
|
||||
customCollections: {
|
||||
custom: FileSystemIconLoader(`${srcPath}/assets/svg`)
|
||||
custom: FileSystemIconLoader(`${srcPath}/assets/svg`),
|
||||
},
|
||||
scale: 1,
|
||||
defaultClass: 'inline-block'
|
||||
defaultClass: 'inline-block',
|
||||
}),
|
||||
Components({
|
||||
dts: false,
|
||||
resolvers: [IconsResolver({ customCollections: ['custom'], componentPrefix: 'icon' })]
|
||||
})
|
||||
resolvers: [IconsResolver({ customCollections: ['custom'], componentPrefix: 'icon' })],
|
||||
}),
|
||||
];
|
||||
};
|
||||
|
||||
@ -5,5 +5,5 @@ export default viteMockServe({
|
||||
injectCode: `
|
||||
import { setupMockServer } from '../mock';
|
||||
setupMockServer();
|
||||
`
|
||||
`,
|
||||
});
|
||||
|
||||
@ -2,5 +2,5 @@ import { visualizer } from 'rollup-plugin-visualizer';
|
||||
|
||||
export default visualizer({
|
||||
gzipSize: true,
|
||||
brotliSize: true
|
||||
brotliSize: true,
|
||||
});
|
||||
|
||||
@ -2,7 +2,7 @@ import type { MockMethod } from 'vite-plugin-mock';
|
||||
|
||||
const token: ApiAuth.Token = {
|
||||
token: '__TEMP_TOKEN__',
|
||||
refreshToken: '__TEMP_REFRESH_TOKEN__'
|
||||
refreshToken: '__TEMP_REFRESH_TOKEN__',
|
||||
};
|
||||
|
||||
const apis: MockMethod[] = [
|
||||
@ -14,9 +14,9 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: true
|
||||
data: true,
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
// 密码登录
|
||||
{
|
||||
@ -26,9 +26,9 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: token
|
||||
data: token,
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
// 验证码登录
|
||||
{
|
||||
@ -38,9 +38,9 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: token
|
||||
data: token,
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
// 获取用户信息(请求头携带token)
|
||||
{
|
||||
@ -54,10 +54,10 @@ const apis: MockMethod[] = [
|
||||
userId: '0',
|
||||
userName: 'Soybean',
|
||||
userPhone: '15170283876',
|
||||
userRole: 'super'
|
||||
}
|
||||
userRole: 'super',
|
||||
},
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/mock/testToken',
|
||||
@ -67,15 +67,15 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 66666,
|
||||
message: 'token 失效',
|
||||
data: null
|
||||
data: null,
|
||||
};
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: true
|
||||
data: true,
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/mock/updateToken',
|
||||
@ -84,10 +84,10 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: token
|
||||
data: token,
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default apis;
|
||||
|
||||
@ -13,8 +13,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '分析页',
|
||||
requiresAuth: true,
|
||||
icon: 'icon-park-outline:analysis'
|
||||
}
|
||||
icon: 'icon-park-outline:analysis',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'dashboard_workbench',
|
||||
@ -24,15 +24,15 @@ const routes: AuthRoute.Route[] = [
|
||||
title: '工作台',
|
||||
requiresAuth: true,
|
||||
permissions: ['super', 'admin'],
|
||||
icon: 'icon-park-outline:workbench'
|
||||
}
|
||||
}
|
||||
icon: 'icon-park-outline:workbench',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '仪表盘',
|
||||
icon: 'carbon:dashboard',
|
||||
order: 1
|
||||
}
|
||||
order: 1,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'document',
|
||||
@ -46,8 +46,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'vue文档',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:vuejs'
|
||||
}
|
||||
icon: 'mdi:vuejs',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'document_vue-new',
|
||||
@ -56,8 +56,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'vue文档(新版)',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:vuejs'
|
||||
}
|
||||
icon: 'mdi:vuejs',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'document_vite',
|
||||
@ -66,8 +66,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'vite文档',
|
||||
requiresAuth: true,
|
||||
icon: 'simple-icons:vite'
|
||||
}
|
||||
icon: 'simple-icons:vite',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'document_naive',
|
||||
@ -76,8 +76,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'naive文档',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:alpha-n-box-outline'
|
||||
}
|
||||
icon: 'mdi:alpha-n-box-outline',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'document_project',
|
||||
@ -86,15 +86,15 @@ const routes: AuthRoute.Route[] = [
|
||||
title: '项目文档(外链)',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:file-link-outline',
|
||||
href: 'https://docs.soybean.pro/'
|
||||
}
|
||||
}
|
||||
href: 'https://docs.soybean.pro/',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '文档',
|
||||
icon: 'carbon:document',
|
||||
order: 2
|
||||
}
|
||||
order: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'component',
|
||||
@ -108,8 +108,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '按钮',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-radio-button-checked'
|
||||
}
|
||||
icon: 'ic:baseline-radio-button-checked',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'component_card',
|
||||
@ -118,8 +118,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '卡片',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:card-outline'
|
||||
}
|
||||
icon: 'mdi:card-outline',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'component_table',
|
||||
@ -128,15 +128,15 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '表格',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:table-large'
|
||||
}
|
||||
}
|
||||
icon: 'mdi:table-large',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '组件示例',
|
||||
icon: 'fluent:app-store-24-regular',
|
||||
order: 3
|
||||
}
|
||||
order: 3,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin',
|
||||
@ -150,8 +150,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '地图',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:map'
|
||||
}
|
||||
icon: 'mdi:map',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_video',
|
||||
@ -160,8 +160,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '视频',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:video'
|
||||
}
|
||||
icon: 'mdi:video',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_editor',
|
||||
@ -175,8 +175,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '富文本编辑器',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:file-document-edit-outline'
|
||||
}
|
||||
icon: 'mdi:file-document-edit-outline',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_editor_markdown',
|
||||
@ -185,14 +185,14 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'markdown编辑器',
|
||||
requiresAuth: true,
|
||||
icon: 'ri:markdown-line'
|
||||
}
|
||||
}
|
||||
icon: 'ri:markdown-line',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '编辑器',
|
||||
icon: 'icon-park-outline:editor'
|
||||
}
|
||||
icon: 'icon-park-outline:editor',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_swiper',
|
||||
@ -201,8 +201,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: 'Swiper插件',
|
||||
requiresAuth: true,
|
||||
icon: 'simple-icons:swiper'
|
||||
}
|
||||
icon: 'simple-icons:swiper',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_copy',
|
||||
@ -211,8 +211,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '剪贴板',
|
||||
requiresAuth: true,
|
||||
icon: 'mdi:clipboard-outline'
|
||||
}
|
||||
icon: 'mdi:clipboard-outline',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_icon',
|
||||
@ -221,8 +221,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '图标',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-insert-emoticon'
|
||||
}
|
||||
icon: 'ic:baseline-insert-emoticon',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'plugin_print',
|
||||
@ -231,15 +231,15 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '打印',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-local-printshop'
|
||||
}
|
||||
}
|
||||
icon: 'ic:baseline-local-printshop',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '插件示例',
|
||||
icon: 'clarity:plugin-line',
|
||||
order: 4
|
||||
}
|
||||
order: 4,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'exception',
|
||||
@ -253,8 +253,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '异常页403',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-block'
|
||||
}
|
||||
icon: 'ic:baseline-block',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'exception_404',
|
||||
@ -263,8 +263,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '异常页404',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-web-asset-off'
|
||||
}
|
||||
icon: 'ic:baseline-web-asset-off',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'exception_500',
|
||||
@ -273,15 +273,15 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '异常页500',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:baseline-wifi-off'
|
||||
}
|
||||
}
|
||||
icon: 'ic:baseline-wifi-off',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '异常页',
|
||||
icon: 'ant-design:exception-outlined',
|
||||
order: 5
|
||||
}
|
||||
order: 5,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'multi-menu',
|
||||
@ -300,8 +300,8 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '二级菜单',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:outline-menu'
|
||||
}
|
||||
icon: 'ic:outline-menu',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'multi-menu_first_second-new',
|
||||
@ -315,27 +315,27 @@ const routes: AuthRoute.Route[] = [
|
||||
meta: {
|
||||
title: '三级菜单',
|
||||
requiresAuth: true,
|
||||
icon: 'ic:outline-menu'
|
||||
}
|
||||
}
|
||||
icon: 'ic:outline-menu',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '二级菜单(有子菜单)',
|
||||
icon: 'ic:outline-menu'
|
||||
}
|
||||
}
|
||||
icon: 'ic:outline-menu',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '一级菜单',
|
||||
icon: 'ic:outline-menu'
|
||||
}
|
||||
}
|
||||
icon: 'ic:outline-menu',
|
||||
},
|
||||
},
|
||||
],
|
||||
meta: {
|
||||
title: '多级菜单',
|
||||
icon: 'carbon:menu',
|
||||
order: 6
|
||||
}
|
||||
order: 6,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'about',
|
||||
@ -347,9 +347,9 @@ const routes: AuthRoute.Route[] = [
|
||||
singleLayout: 'basic',
|
||||
permissions: ['super', 'admin', 'test'],
|
||||
icon: 'fluent:book-information-24-regular',
|
||||
order: 7
|
||||
}
|
||||
}
|
||||
order: 7,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
function dataMiddleware(data: AuthRoute.Route[]): ApiRoute.Route {
|
||||
@ -361,7 +361,7 @@ function dataMiddleware(data: AuthRoute.Route[]): ApiRoute.Route {
|
||||
|
||||
return {
|
||||
routes: sortRoutes(data),
|
||||
home: routeHomeName
|
||||
home: routeHomeName,
|
||||
};
|
||||
}
|
||||
|
||||
@ -373,10 +373,10 @@ const apis: MockMethod[] = [
|
||||
return {
|
||||
code: 200,
|
||||
message: 'ok',
|
||||
data: dataMiddleware(routes)
|
||||
data: dataMiddleware(routes),
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default apis;
|
||||
|
||||
34
package.json
34
package.json
@ -4,16 +4,16 @@
|
||||
"scripts": {
|
||||
"dev": "cross-env VITE_HTTP_ENV=test vite",
|
||||
"dev:prod": "cross-env VITE_HTTP_ENV=prod vite",
|
||||
"typecheck": "vue-tsc --noEmit",
|
||||
"build": "npm run typecheck && cross-env VITE_HTTP_ENV=prod vite build",
|
||||
"build:test": "npm run typecheck && cross-env VITE_HTTP_ENV=test vite build",
|
||||
"build:vercel": "cross-env VITE_HASH_ROUTE=true vite build",
|
||||
"preview": "vite preview --port 5050",
|
||||
"release": "standard-version",
|
||||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md",
|
||||
"lint": "eslint --fix ./ --ext .vue,.js,jsx,.ts,tsx",
|
||||
"typecheck": "vue-tsc --noEmit",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
|
||||
"prepare": "husky install",
|
||||
"postinstall": "patch-package"
|
||||
"postinstall": "patch-package",
|
||||
"release": "standard-version",
|
||||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md"
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.{vue,js,jsx,ts,tsx}": "eslint --fix"
|
||||
@ -24,17 +24,17 @@
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@antv/g2plot": "^2.4.9",
|
||||
"@antv/g2plot": "^2.4.10",
|
||||
"@better-scroll/core": "^2.4.2",
|
||||
"@vueuse/core": "^7.7.1",
|
||||
"axios": "^0.26.0",
|
||||
"@vueuse/core": "^8.0.0",
|
||||
"axios": "^0.26.1",
|
||||
"clipboard": "^2.0.10",
|
||||
"colord": "^2.9.2",
|
||||
"crypto-js": "^4.1.1",
|
||||
"dayjs": "^1.10.8",
|
||||
"form-data": "^4.0.0",
|
||||
"lodash-es": "^4.17.21",
|
||||
"naive-ui": "^2.26.0",
|
||||
"naive-ui": "^2.26.4",
|
||||
"pinia": "^2.0.11",
|
||||
"print-js": "^1.6.0",
|
||||
"qs": "^6.10.3",
|
||||
@ -44,7 +44,7 @@
|
||||
"ua-parser-js": "^1.0.2",
|
||||
"vditor": "^3.8.12",
|
||||
"vue": "^3.2.31",
|
||||
"vue-router": "^4.0.13",
|
||||
"vue-router": "^4.0.14",
|
||||
"wangeditor": "^4.7.12",
|
||||
"xgplayer": "^2.31.4"
|
||||
},
|
||||
@ -52,15 +52,15 @@
|
||||
"@amap/amap-jsapi-types": "^0.0.8",
|
||||
"@commitlint/cli": "^16.2.1",
|
||||
"@commitlint/config-conventional": "^16.2.1",
|
||||
"@iconify/json": "^2.1.11",
|
||||
"@iconify/json": "^2.1.14",
|
||||
"@iconify/vue": "^3.1.4",
|
||||
"@types/bmapgl": "^0.0.5",
|
||||
"@types/crypto-js": "^4.1.1",
|
||||
"@types/node": "^17.0.21",
|
||||
"@types/qs": "^6.9.7",
|
||||
"@types/ua-parser-js": "^0.7.36",
|
||||
"@typescript-eslint/eslint-plugin": "^5.13.0",
|
||||
"@typescript-eslint/parser": "^5.13.0",
|
||||
"@typescript-eslint/eslint-plugin": "^5.14.0",
|
||||
"@typescript-eslint/parser": "^5.14.0",
|
||||
"@vitejs/plugin-vue": "^2.2.4",
|
||||
"@vue/eslint-config-prettier": "^7.0.0",
|
||||
"@vue/eslint-config-typescript": "^10.0.0",
|
||||
@ -69,7 +69,7 @@
|
||||
"cross-env": "^7.0.3",
|
||||
"cz-conventional-changelog": "^3.3.0",
|
||||
"cz-customizable": "^6.3.0",
|
||||
"eslint": "^8.10.0",
|
||||
"eslint": "^8.11.0",
|
||||
"eslint-config-airbnb-base": "^15.0.0",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-import": "^2.25.4",
|
||||
@ -83,9 +83,9 @@
|
||||
"prettier": "^2.5.1",
|
||||
"rollup-plugin-visualizer": "^5.6.0",
|
||||
"sass": "^1.49.9",
|
||||
"typescript": "~4.5.5",
|
||||
"unplugin-icons": "^0.13.2",
|
||||
"unplugin-vue-components": "^0.17.21",
|
||||
"typescript": "~4.6.2",
|
||||
"unplugin-icons": "^0.13.3",
|
||||
"unplugin-vue-components": "^0.18.0",
|
||||
"vite": "2.8.6",
|
||||
"vite-plugin-html": "^3.1.0",
|
||||
"vite-plugin-mock": "^2.9.6",
|
||||
|
||||
753
pnpm-lock.yaml
753
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
@ -53,7 +53,7 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
emptyDesc: '暂无数据',
|
||||
iconClass: 'text-320px text-primary',
|
||||
descClass: 'text-16px text-[#666]',
|
||||
showNetworkReload: false
|
||||
showNetworkReload: false,
|
||||
});
|
||||
|
||||
// 网络状态
|
||||
@ -79,7 +79,7 @@ function handleReload() {
|
||||
|
||||
const stopHandle = watch(
|
||||
() => props.loading,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
// 结束加载判断一下网络状态
|
||||
if (!newValue) {
|
||||
setNetwork(window.navigator.onLine);
|
||||
|
||||
@ -23,7 +23,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
value: true
|
||||
value: true,
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -34,7 +34,7 @@ const checked = computed({
|
||||
},
|
||||
set(newValue: boolean) {
|
||||
emit('update:value', newValue);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleClickProtocol() {
|
||||
|
||||
@ -18,7 +18,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
dark: false
|
||||
dark: false,
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -29,7 +29,7 @@ const darkMode = computed({
|
||||
},
|
||||
set(newValue: boolean) {
|
||||
emit('update:dark', newValue);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleSwitch() {
|
||||
|
||||
@ -29,7 +29,7 @@ interface Props {
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
tooltipContent: '',
|
||||
placement: 'bottom',
|
||||
contentClass: ''
|
||||
contentClass: '',
|
||||
});
|
||||
|
||||
const showTooltip = computed(() => Boolean(props.tooltipContent));
|
||||
|
||||
@ -29,7 +29,7 @@ const NaiveProviderContent = defineComponent({
|
||||
},
|
||||
render() {
|
||||
return h('div');
|
||||
}
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -10,7 +10,7 @@ interface Props {
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
fill: false
|
||||
fill: false,
|
||||
});
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -42,7 +42,7 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
separator: ',',
|
||||
decimal: '.',
|
||||
useEasing: true,
|
||||
transition: 'linear'
|
||||
transition: 'linear',
|
||||
});
|
||||
|
||||
const emit = defineEmits<{
|
||||
@ -61,7 +61,7 @@ function run() {
|
||||
duration: props.duration,
|
||||
onStarted: () => emit('on-started'),
|
||||
onFinished: () => emit('on-finished'),
|
||||
...(props.useEasing ? { transition: TransitionPresets[props.transition] } : {})
|
||||
...(props.useEasing ? { transition: TransitionPresets[props.transition] } : {}),
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -43,7 +43,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
emptyIcon: 'mdi:apps'
|
||||
emptyIcon: 'mdi:apps',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -51,7 +51,7 @@ const emit = defineEmits<Emits>();
|
||||
const theme = useThemeStore();
|
||||
|
||||
const searchValue = ref('');
|
||||
const iconsList = computed(() => props.icons.filter(v => v.includes(searchValue.value)));
|
||||
const iconsList = computed(() => props.icons.filter((v) => v.includes(searchValue.value)));
|
||||
|
||||
const modelValue = computed({
|
||||
get() {
|
||||
@ -59,7 +59,7 @@ const modelValue = computed({
|
||||
},
|
||||
set(val: string) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleChange(iconItem: string) {
|
||||
|
||||
@ -17,7 +17,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
code: ''
|
||||
code: '',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -26,11 +26,11 @@ const { domRef, imgCode, setImgCode, getImgCode } = useImageVerify();
|
||||
|
||||
watch(
|
||||
() => props.code,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
setImgCode(newValue);
|
||||
}
|
||||
);
|
||||
watch(imgCode, newValue => {
|
||||
watch(imgCode, (newValue) => {
|
||||
emit('update:code', newValue);
|
||||
});
|
||||
|
||||
|
||||
@ -19,23 +19,23 @@ export function useBasicLayout() {
|
||||
vertical: {
|
||||
showLogo: false,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: true
|
||||
showMenuCollape: true,
|
||||
},
|
||||
'vertical-mix': {
|
||||
showLogo: false,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: false
|
||||
showMenuCollape: false,
|
||||
},
|
||||
horizontal: {
|
||||
showLogo: true,
|
||||
showHeaderMenu: true,
|
||||
showMenuCollape: false
|
||||
showMenuCollape: false,
|
||||
},
|
||||
'horizontal-mix': {
|
||||
showLogo: true,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: true
|
||||
}
|
||||
showMenuCollape: true,
|
||||
},
|
||||
};
|
||||
|
||||
const headerProps = computed(() => layoutHeaderProps[theme.layout.mode]);
|
||||
@ -65,6 +65,6 @@ export function useBasicLayout() {
|
||||
headerProps,
|
||||
siderVisible,
|
||||
siderWidth,
|
||||
siderCollapsedWidth
|
||||
siderCollapsedWidth,
|
||||
};
|
||||
}
|
||||
|
||||
@ -7,7 +7,7 @@ import type { LoginModuleKey } from '@/interface';
|
||||
* 路由跳转
|
||||
* @param inSetup - 是否在vue页面/组件的setup里面调用，在axios里面无法使用useRouter和useRoute
|
||||
*/
|
||||
export function useRouterPush(inSetup: boolean = true) {
|
||||
export function useRouterPush(inSetup = true) {
|
||||
const router = inSetup ? useRouter() : globalRouter;
|
||||
const route = globalRouter.currentRoute;
|
||||
|
||||
@ -47,7 +47,7 @@ export function useRouterPush(inSetup: boolean = true) {
|
||||
const module: LoginModuleKey = loginModule || 'pwd-login';
|
||||
const routeLocation: RouteLocationRaw = {
|
||||
name: routeName('login'),
|
||||
params: { module }
|
||||
params: { module },
|
||||
};
|
||||
const redirect = redirectUrl || route.value.fullPath;
|
||||
Object.assign(routeLocation, { query: { redirect } });
|
||||
@ -81,6 +81,6 @@ export function useRouterPush(inSetup: boolean = true) {
|
||||
toHome,
|
||||
toLogin,
|
||||
toLoginModule,
|
||||
toLoginRedirect
|
||||
toLoginRedirect,
|
||||
};
|
||||
}
|
||||
|
||||
@ -16,7 +16,7 @@ export function useAppInfo(): AppInfo {
|
||||
return {
|
||||
name,
|
||||
title,
|
||||
desc
|
||||
desc,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -36,7 +36,7 @@ export const ERROR_STATUS = {
|
||||
503: '503: 服务不可用~',
|
||||
504: '504: 网关超时~',
|
||||
505: '505: http版本不支持该请求~',
|
||||
[DEFAULT_REQUEST_ERROR_CODE]: DEFAULT_REQUEST_ERROR_MSG
|
||||
[DEFAULT_REQUEST_ERROR_CODE]: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
/** 不弹出错误信息的code */
|
||||
|
||||
@ -20,7 +20,7 @@ export default function setupLoginDirective(app: App) {
|
||||
unmounted(el: HTMLElement, binding) {
|
||||
if (binding.value === false) return;
|
||||
el.removeEventListener('click', listenerHandler);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
app.directive('login', loginDirective);
|
||||
|
||||
@ -18,7 +18,7 @@ export default function setupNetworkDirective(app: App) {
|
||||
unmounted(el: HTMLElement, binding) {
|
||||
if (binding.value === false) return;
|
||||
el.removeEventListener('click', listenerHandler);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
app.directive('network', networkDirective);
|
||||
|
||||
@ -2,5 +2,5 @@
|
||||
export enum ContentType {
|
||||
json = 'application/json',
|
||||
formUrlencoded = 'application/x-www-form-urlencoded',
|
||||
formData = 'multipart/form-data'
|
||||
formData = 'multipart/form-data',
|
||||
}
|
||||
|
||||
@ -8,5 +8,5 @@ export enum EnumStorageKey {
|
||||
/** 用户信息 */
|
||||
'user-info' = '__USER_INFO__',
|
||||
/** 多页签路由信息 */
|
||||
'tab-routes' = '__TAB_ROUTES__'
|
||||
'tab-routes' = '__TAB_ROUTES__',
|
||||
}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
/** 布局组件的名称 */
|
||||
export enum EnumLayoutComponentName {
|
||||
basic = 'basic-layout',
|
||||
blank = 'blank-layout'
|
||||
blank = 'blank-layout',
|
||||
}
|
||||
|
||||
/** 登录模块 */
|
||||
@ -10,5 +10,5 @@ export enum EnumLoginModule {
|
||||
'code-login' = '手机验证码登录',
|
||||
'register' = '注册',
|
||||
'reset-pwd' = '重置密码',
|
||||
'bind-wechat' = '微信绑定'
|
||||
'bind-wechat' = '微信绑定',
|
||||
}
|
||||
|
||||
@ -3,20 +3,20 @@ export enum EnumThemeLayoutMode {
|
||||
'vertical' = '左侧菜单模式',
|
||||
'horizontal' = '顶部菜单模式',
|
||||
'vertical-mix' = '左侧菜单混合模式',
|
||||
'horizontal-mix' = '顶部菜单混合模式'
|
||||
'horizontal-mix' = '顶部菜单混合模式',
|
||||
}
|
||||
|
||||
/** 多页签风格 */
|
||||
export enum EnumThemeTabMode {
|
||||
'chrome' = '谷歌风格',
|
||||
'button' = '按钮风格'
|
||||
'button' = '按钮风格',
|
||||
}
|
||||
|
||||
/** 水平模式的菜单位置 */
|
||||
export enum EnumThemeHorizontalMenuPosition {
|
||||
'flex-start' = '居左',
|
||||
'center' = '居中',
|
||||
'flex-end' = '居右'
|
||||
'flex-end' = '居右',
|
||||
}
|
||||
|
||||
/** 过渡动画类型 */
|
||||
@ -26,5 +26,5 @@ export enum EnumThemeAnimateMode {
|
||||
'fade-slide' = '滑动',
|
||||
'fade' = '消退',
|
||||
'fade-bottom' = '底部消退',
|
||||
'fade-scale' = '缩放消退'
|
||||
'fade-scale' = '缩放消退',
|
||||
}
|
||||
|
||||
@ -10,5 +10,5 @@ export enum EnumDataType {
|
||||
date = '[object Date]',
|
||||
regexp = '[object RegExp]',
|
||||
set = '[object Set]',
|
||||
map = '[object Map]'
|
||||
map = '[object Map]',
|
||||
}
|
||||
|
||||
@ -47,6 +47,6 @@ export default function useCountDown(second: number) {
|
||||
isCounting,
|
||||
start,
|
||||
stop,
|
||||
isComplete
|
||||
isComplete,
|
||||
};
|
||||
}
|
||||
|
||||
@ -26,7 +26,7 @@ export default function useImageVerify(width = 152, height = 40) {
|
||||
domRef,
|
||||
imgCode,
|
||||
setImgCode,
|
||||
getImgCode
|
||||
getImgCode,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -54,6 +54,6 @@ export default function useSmsCode() {
|
||||
start,
|
||||
isCounting,
|
||||
getSmsCode,
|
||||
loading
|
||||
loading,
|
||||
};
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ interface ScrollBodyStyle {
|
||||
export default function useBodyScroll(duration = 300) {
|
||||
const defaultStyle: ScrollBodyStyle = {
|
||||
overflow: '',
|
||||
paddingRight: ''
|
||||
paddingRight: '',
|
||||
};
|
||||
function getInitBodyStyle() {
|
||||
const { overflow, paddingRight } = document.body.style;
|
||||
@ -42,6 +42,6 @@ export default function useBodyScroll(duration = 300) {
|
||||
getInitBodyStyle();
|
||||
|
||||
return {
|
||||
scrollBodyHandler
|
||||
scrollBodyHandler,
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { ref } from 'vue';
|
||||
|
||||
export default function useBoolean(initValue: boolean = false) {
|
||||
export default function useBoolean(initValue = false) {
|
||||
const bool = ref(initValue);
|
||||
|
||||
function setBool(value: boolean) {
|
||||
@ -21,6 +21,6 @@ export default function useBoolean(initValue: boolean = false) {
|
||||
setBool,
|
||||
setTrue,
|
||||
setFalse,
|
||||
toggle
|
||||
toggle,
|
||||
};
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@ import { provide, inject } from 'vue';
|
||||
import type { InjectionKey } from 'vue';
|
||||
|
||||
/** 创建共享上下文状态 */
|
||||
export default function useContext<T>(contextName: string = 'context') {
|
||||
export default function useContext<T>(contextName = 'context') {
|
||||
const injectKey: InjectionKey<T> = Symbol(contextName);
|
||||
|
||||
function useProvide(context: T) {
|
||||
@ -10,11 +10,11 @@ export default function useContext<T>(contextName: string = 'context') {
|
||||
}
|
||||
|
||||
function useInject() {
|
||||
return inject(injectKey)!;
|
||||
return inject(injectKey) as T;
|
||||
}
|
||||
|
||||
return {
|
||||
useProvide,
|
||||
useInject
|
||||
useInject,
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import useBoolean from './useBoolean';
|
||||
|
||||
export default function useLoading(initValue: boolean = false) {
|
||||
export default function useLoading(initValue = false) {
|
||||
const { bool: loading, setTrue: startLoading, setFalse: endLoading } = useBoolean(initValue);
|
||||
|
||||
return {
|
||||
loading,
|
||||
startLoading,
|
||||
endLoading
|
||||
endLoading,
|
||||
};
|
||||
}
|
||||
|
||||
@ -9,6 +9,6 @@ export default function useLoadingEmpty(initLoading = false, initEmpty = false)
|
||||
startLoading,
|
||||
endLoading,
|
||||
empty,
|
||||
setEmpty
|
||||
setEmpty,
|
||||
};
|
||||
}
|
||||
|
||||
@ -11,7 +11,7 @@ export default function useModalVisible(hideScroll = true) {
|
||||
const { scrollBodyHandler } = useBodyScroll();
|
||||
|
||||
function modalVisibleWatcher() {
|
||||
const stopHandle = watch(visible, async newValue => {
|
||||
const stopHandle = watch(visible, async (newValue) => {
|
||||
scrollBodyHandler(newValue);
|
||||
});
|
||||
|
||||
@ -28,6 +28,6 @@ export default function useModalVisible(hideScroll = true) {
|
||||
visible,
|
||||
openModal,
|
||||
closeModal,
|
||||
toggleModal
|
||||
toggleModal,
|
||||
};
|
||||
}
|
||||
|
||||
@ -24,6 +24,6 @@ export default function useReload() {
|
||||
|
||||
return {
|
||||
reloadFlag,
|
||||
handleReload
|
||||
handleReload,
|
||||
};
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ import type {
|
||||
EnumThemeTabMode,
|
||||
EnumThemeHorizontalMenuPosition,
|
||||
EnumThemeAnimateMode,
|
||||
EnumLoginModule
|
||||
EnumLoginModule,
|
||||
} from '@/enum';
|
||||
|
||||
/** 布局组件名称 */
|
||||
|
||||
@ -2,7 +2,7 @@ import type {
|
||||
EnumThemeLayoutMode,
|
||||
EnumThemeTabMode,
|
||||
EnumThemeHorizontalMenuPosition,
|
||||
EnumThemeAnimateMode
|
||||
EnumThemeAnimateMode,
|
||||
} from '@/enum';
|
||||
import type { ThemeLayoutMode, ThemeTabMode, ThemeHorizontalMenuPosition, ThemeAnimateMode } from './enum';
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@ interface Props {
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
showPadding: true
|
||||
showPadding: true,
|
||||
});
|
||||
|
||||
const app = useAppStore();
|
||||
|
||||
@ -20,17 +20,17 @@ const options = [
|
||||
{
|
||||
label: '用户中心',
|
||||
key: 'user-center',
|
||||
icon: iconifyRender('carbon:user-avatar')
|
||||
icon: iconifyRender('carbon:user-avatar'),
|
||||
},
|
||||
{
|
||||
type: 'divider',
|
||||
key: 'divider'
|
||||
key: 'divider',
|
||||
},
|
||||
{
|
||||
label: '退出登录',
|
||||
key: 'logout',
|
||||
icon: iconifyRender('carbon:logout')
|
||||
}
|
||||
icon: iconifyRender('carbon:logout'),
|
||||
},
|
||||
];
|
||||
|
||||
function handleDropdown(optionKey: string) {
|
||||
@ -43,7 +43,7 @@ function handleDropdown(optionKey: string) {
|
||||
negativeText: '取消',
|
||||
onPositiveClick: () => {
|
||||
auth.resetAuthStore();
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -31,7 +31,7 @@ import {
|
||||
GithubSite,
|
||||
FullScreen,
|
||||
ThemeMode,
|
||||
UserAvatar
|
||||
UserAvatar,
|
||||
} from './components';
|
||||
|
||||
interface Props {
|
||||
|
||||
@ -61,10 +61,10 @@ const show = computed({
|
||||
},
|
||||
set(val: boolean) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
watch(show, async val => {
|
||||
watch(show, async (val) => {
|
||||
if (val) {
|
||||
/** 自动聚焦 */
|
||||
await nextTick();
|
||||
@ -75,7 +75,7 @@ watch(show, async val => {
|
||||
/** 查询 */
|
||||
function search() {
|
||||
resultOptions.value = routeStore.searchMenus.filter(
|
||||
menu => keyword.value && menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
||||
(menu) => keyword.value && menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
||||
);
|
||||
if (resultOptions.value?.length > 0) {
|
||||
activePath.value = resultOptions.value[0].path;
|
||||
@ -97,7 +97,7 @@ function handleClose() {
|
||||
function handleUp() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0) return;
|
||||
const index = resultOptions.value.findIndex(item => item.path === activePath.value);
|
||||
const index = resultOptions.value.findIndex((item) => item.path === activePath.value);
|
||||
if (index === 0) {
|
||||
activePath.value = resultOptions.value[length - 1].path;
|
||||
} else {
|
||||
@ -109,7 +109,7 @@ function handleUp() {
|
||||
function handleDown() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0) return;
|
||||
const index = resultOptions.value.findIndex(item => item.path === activePath.value);
|
||||
const index = resultOptions.value.findIndex((item) => item.path === activePath.value);
|
||||
if (index + 1 === length) {
|
||||
activePath.value = resultOptions.value[0].path;
|
||||
} else {
|
||||
@ -121,8 +121,8 @@ function handleDown() {
|
||||
function handleEnter() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0 || activePath.value === '') return;
|
||||
const item = resultOptions.value.find(item => item.path === activePath.value);
|
||||
if (item?.meta?.href) {
|
||||
const routeItem = resultOptions.value.find((item) => item.path === activePath.value);
|
||||
if (routeItem?.meta?.href) {
|
||||
window.open(activePath.value, '__blank');
|
||||
} else {
|
||||
router.push(activePath.value);
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
class="bg-[#e5e7eb] dark:bg-dark h-56px mt-8px px-14px rounded-4px cursor-pointer flex-y-center justify-between"
|
||||
:style="{
|
||||
background: item.path === active ? theme.themeColor : '',
|
||||
color: item.path === active ? '#fff' : ''
|
||||
color: item.path === active ? '#fff' : '',
|
||||
}"
|
||||
@click="handleTo"
|
||||
@mouseenter="handleMouse(item)"
|
||||
@ -48,7 +48,7 @@ const active = computed({
|
||||
},
|
||||
set(val: string) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
/** 鼠标移入 */
|
||||
|
||||
@ -35,7 +35,7 @@ interface Props {
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
icon: undefined,
|
||||
isMini: false
|
||||
isMini: false,
|
||||
});
|
||||
|
||||
const { bool: isHover, setTrue, setFalse } = useBoolean();
|
||||
|
||||
@ -44,7 +44,7 @@ function setActiveParentRouteName(routeName: string) {
|
||||
}
|
||||
|
||||
const firstDegreeMenus = computed(() =>
|
||||
routeStore.menus.map(item => {
|
||||
routeStore.menus.map((item) => {
|
||||
const { routeName, label } = item;
|
||||
const icon = item?.icon;
|
||||
const hasChildren = Boolean(item.children && item.children.length);
|
||||
@ -53,13 +53,13 @@ const firstDegreeMenus = computed(() =>
|
||||
routeName,
|
||||
label,
|
||||
icon,
|
||||
hasChildren
|
||||
hasChildren,
|
||||
};
|
||||
})
|
||||
);
|
||||
|
||||
function getActiveParentRouteName() {
|
||||
firstDegreeMenus.value.some(item => {
|
||||
firstDegreeMenus.value.some((item) => {
|
||||
const routeName = route.name as string;
|
||||
const flag = routeName?.includes(item.routeName);
|
||||
if (flag) {
|
||||
@ -85,10 +85,10 @@ function resetFirstDegreeMenus() {
|
||||
|
||||
const activeChildMenus = computed(() => {
|
||||
const menus: GlobalMenuOption[] = [];
|
||||
routeStore.menus.some(item => {
|
||||
routeStore.menus.some((item) => {
|
||||
const flag = item.routeName === activeParentRouteName.value && Boolean(item.children?.length);
|
||||
if (flag) {
|
||||
menus.push(...item.children!);
|
||||
menus.push(...(item.children || []));
|
||||
}
|
||||
return flag;
|
||||
});
|
||||
|
||||
@ -38,7 +38,7 @@ type Option = DropdownOption & {
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
visible: false,
|
||||
currentPath: ''
|
||||
currentPath: '',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -52,7 +52,7 @@ const dropdownVisible = computed({
|
||||
},
|
||||
set(visible: boolean) {
|
||||
emit('update:visible', visible);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function hide() {
|
||||
@ -64,29 +64,29 @@ const options = computed<Option[]>(() => [
|
||||
label: '重新加载',
|
||||
key: 'reload-current',
|
||||
disabled: props.currentPath !== tab.activeTab,
|
||||
icon: iconifyRender('ant-design:reload-outlined')
|
||||
icon: iconifyRender('ant-design:reload-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭',
|
||||
key: 'close-current',
|
||||
disabled: props.currentPath === tab.homeTab.path,
|
||||
icon: iconifyRender('ant-design:close-outlined')
|
||||
icon: iconifyRender('ant-design:close-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭其他',
|
||||
key: 'close-other',
|
||||
icon: iconifyRender('ant-design:column-width-outlined')
|
||||
icon: iconifyRender('ant-design:column-width-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭左侧',
|
||||
key: 'close-left',
|
||||
icon: iconifyRender('mdi:format-horizontal-align-left')
|
||||
icon: iconifyRender('mdi:format-horizontal-align-left'),
|
||||
},
|
||||
{
|
||||
label: '关闭右侧',
|
||||
key: 'close-right',
|
||||
icon: iconifyRender('mdi:format-horizontal-align-right')
|
||||
}
|
||||
icon: iconifyRender('mdi:format-horizontal-align-right'),
|
||||
},
|
||||
]);
|
||||
|
||||
const actionMap = new Map<DropdownKey, () => void>([
|
||||
@ -94,32 +94,32 @@ const actionMap = new Map<DropdownKey, () => void>([
|
||||
'reload-current',
|
||||
() => {
|
||||
app.reloadPage();
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-current',
|
||||
() => {
|
||||
tab.removeTab(props.currentPath);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-other',
|
||||
() => {
|
||||
tab.clearTab([props.currentPath]);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-left',
|
||||
() => {
|
||||
tab.clearLeftTab(props.currentPath);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-right',
|
||||
() => {
|
||||
tab.clearRightTab(props.currentPath);
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
]);
|
||||
|
||||
function handleDropdown(optionKey: string) {
|
||||
|
||||
@ -64,7 +64,7 @@ const dropdown = reactive({
|
||||
visible: false,
|
||||
x: 0,
|
||||
y: 0,
|
||||
currentPath: ''
|
||||
currentPath: '',
|
||||
});
|
||||
function showDropdown() {
|
||||
dropdown.visible = true;
|
||||
@ -92,7 +92,7 @@ watch(
|
||||
getActiveTabClientX();
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
immediate: true,
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
@ -45,23 +45,23 @@ const layoutConfig: LayoutConfig = {
|
||||
vertical: {
|
||||
placement: 'bottom-start',
|
||||
menuClass: 'w-1/3 h-full',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
'vertical-mix': {
|
||||
placement: 'bottom',
|
||||
menuClass: 'w-1/4 h-full',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
horizontal: {
|
||||
placement: 'bottom',
|
||||
menuClass: 'w-full h-1/4',
|
||||
mainClass: 'w-full h-3/4'
|
||||
mainClass: 'w-full h-3/4',
|
||||
},
|
||||
'horizontal-mix': {
|
||||
placement: 'bottom-end',
|
||||
menuClass: 'w-full h-1/4',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
}
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
};
|
||||
|
||||
const activeConfig = computed(() => layoutConfig[props.mode]);
|
||||
|
||||
@ -17,7 +17,7 @@ interface Props {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
iconClass: 'text-14px'
|
||||
iconClass: 'text-14px',
|
||||
});
|
||||
|
||||
const whiteColors = ['#ffffff', '#fff', 'rgb(255,255,255)'];
|
||||
|
||||
@ -30,12 +30,13 @@ function handleResetConfig() {
|
||||
}
|
||||
|
||||
function clipboardEventListener() {
|
||||
const copy = new Clipboard(copyRef.value!);
|
||||
if (!copyRef.value) return;
|
||||
const copy = new Clipboard(copyRef.value);
|
||||
copy.on('success', () => {
|
||||
window.$dialog?.success({
|
||||
title: '操作成功',
|
||||
content: '复制成功,请替换 src/settings/theme.json的内容！',
|
||||
positiveText: '确定'
|
||||
positiveText: '确定',
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -5,4 +5,6 @@ import 'swiper/css/pagination';
|
||||
import '../styles/css/global.css';
|
||||
|
||||
/** 引入静态资源(全局引入css、字体等) */
|
||||
export default function setupAssets() {}
|
||||
export default function setupAssets() {
|
||||
//
|
||||
}
|
||||
|
||||
@ -45,7 +45,7 @@ import {
|
||||
NThing,
|
||||
NTimeline,
|
||||
NTimelineItem,
|
||||
NTooltip
|
||||
NTooltip,
|
||||
} from 'naive-ui';
|
||||
|
||||
/** 按需引入naiveUI */
|
||||
@ -96,8 +96,8 @@ export default function setupNaiveUI(app: App) {
|
||||
NThing,
|
||||
NTimeline,
|
||||
NTimelineItem,
|
||||
NTooltip
|
||||
]
|
||||
NTooltip,
|
||||
],
|
||||
});
|
||||
app.use(naive);
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@ export function createRouterGuard(router: Router) {
|
||||
// 页面跳转权限处理
|
||||
await createPermissionGuard(to, from, next, router);
|
||||
});
|
||||
router.afterEach(to => {
|
||||
router.afterEach((to) => {
|
||||
// 设置document title
|
||||
useTitle(to.meta.title);
|
||||
// 结束 loadingBar
|
||||
|
||||
@ -34,14 +34,14 @@ export async function createPermissionGuard(
|
||||
isLogin && to.name === routeName('login'),
|
||||
() => {
|
||||
next({ name: routeName('root') });
|
||||
}
|
||||
},
|
||||
],
|
||||
// 不需要登录权限的页面直接通行
|
||||
[
|
||||
!needLogin,
|
||||
() => {
|
||||
next();
|
||||
}
|
||||
},
|
||||
],
|
||||
// 未登录状态进入需要登录权限的页面
|
||||
[
|
||||
@ -49,22 +49,22 @@ export async function createPermissionGuard(
|
||||
() => {
|
||||
const redirect = to.fullPath;
|
||||
next({ name: routeName('login'), query: { redirect } });
|
||||
}
|
||||
},
|
||||
],
|
||||
// 登录状态进入需要登录权限的页面，有权限直接通行
|
||||
[
|
||||
isLogin && needLogin && hasPermission,
|
||||
() => {
|
||||
next();
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 登录状态进入需要登录权限的页面，无权限，重定向到无权限页面
|
||||
isLogin && needLogin && !hasPermission,
|
||||
() => {
|
||||
next({ name: routeName('no-permission') });
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
exeStrategyActions(actions);
|
||||
|
||||
@ -2,20 +2,20 @@ import type { RouterScrollBehavior } from 'vue-router';
|
||||
import { useTabStore } from '@/store';
|
||||
|
||||
export const scrollBehavior: RouterScrollBehavior = (to, from) => {
|
||||
return new Promise(resolve => {
|
||||
return new Promise((resolve) => {
|
||||
const tab = useTabStore();
|
||||
|
||||
if (to.hash) {
|
||||
resolve({
|
||||
el: to.hash,
|
||||
behavior: 'smooth'
|
||||
behavior: 'smooth',
|
||||
});
|
||||
}
|
||||
|
||||
const { left, top } = tab.getTabScrollPosition(to.path);
|
||||
const scrollPosition = {
|
||||
left,
|
||||
top
|
||||
top,
|
||||
};
|
||||
const { scrollLeft, scrollTop } = document.documentElement;
|
||||
|
||||
|
||||
@ -11,7 +11,7 @@ const history = VITE_HASH_ROUTE === 'true' ? createWebHashHistory(VITE_BASE_URL)
|
||||
export const router = createRouter({
|
||||
history,
|
||||
routes: transformAuthRoutesToVueRoutes(constantRoutes),
|
||||
scrollBehavior
|
||||
scrollBehavior,
|
||||
});
|
||||
|
||||
export async function setupRouter(app: App) {
|
||||
|
||||
@ -8,24 +8,24 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
path: '/',
|
||||
redirect: '/dashboard/analysis',
|
||||
meta: {
|
||||
title: 'Root'
|
||||
}
|
||||
title: 'Root',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'login',
|
||||
path: '/login',
|
||||
component: 'self',
|
||||
props: route => {
|
||||
props: (route) => {
|
||||
const moduleType = (route.params.module as LoginModuleKey) || 'pwd-login';
|
||||
return {
|
||||
module: moduleType
|
||||
module: moduleType,
|
||||
};
|
||||
},
|
||||
meta: {
|
||||
title: '登录',
|
||||
dynamicPath: `/login/:module(${getLoginModuleRegExp()})?`,
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'no-permission',
|
||||
@ -33,8 +33,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '无权限',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'not-found',
|
||||
@ -42,8 +42,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '未找到',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'service-error',
|
||||
@ -51,8 +51,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '服务器错误',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
// 匹配无效路径的路由
|
||||
{
|
||||
@ -61,9 +61,9 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'blank',
|
||||
meta: {
|
||||
title: '未找到',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
/** 路由名称 */
|
||||
|
||||
@ -9,8 +9,8 @@ import { fetchUpdateToken } from '../api';
|
||||
*/
|
||||
export async function refreshToken(axiosConfig: AxiosRequestConfig) {
|
||||
const { resetAuthStore } = useAuthStore();
|
||||
const refreshToken = getRefreshToken();
|
||||
const { data } = await fetchUpdateToken(refreshToken);
|
||||
const rToken = getRefreshToken();
|
||||
const { data } = await fetchUpdateToken(rToken);
|
||||
if (data) {
|
||||
setToken(data.token);
|
||||
setRefreshToken(data.refreshToken);
|
||||
|
||||
@ -7,7 +7,7 @@ import {
|
||||
handleAxiosError,
|
||||
handleResponseError,
|
||||
handleBackendError,
|
||||
handleServiceResult
|
||||
handleServiceResult,
|
||||
} from '@/utils';
|
||||
import { refreshToken } from './helpers';
|
||||
|
||||
@ -31,7 +31,7 @@ export default class CustomAxiosInstance {
|
||||
codeKey: 'code',
|
||||
dataKey: 'data',
|
||||
msgKey: 'message',
|
||||
successCode: 200
|
||||
successCode: 200,
|
||||
}
|
||||
) {
|
||||
this.backendConfig = backendConfig;
|
||||
@ -42,7 +42,7 @@ export default class CustomAxiosInstance {
|
||||
/** 设置请求拦截器 */
|
||||
setInterceptor() {
|
||||
this.instance.interceptors.request.use(
|
||||
async config => {
|
||||
async (config) => {
|
||||
const handleConfig = { ...config };
|
||||
if (handleConfig.headers) {
|
||||
// 数据转换
|
||||
@ -59,7 +59,7 @@ export default class CustomAxiosInstance {
|
||||
}
|
||||
);
|
||||
this.instance.interceptors.response.use(
|
||||
async response => {
|
||||
async (response) => {
|
||||
const { status } = response;
|
||||
if (status === 200 || status < 300 || status === 304) {
|
||||
const backend = response.data;
|
||||
|
||||
@ -85,7 +85,7 @@ export function createRequest(axiosConfig: AxiosRequestConfig, backendConfig?: S
|
||||
get,
|
||||
post,
|
||||
put,
|
||||
delete: handleDelete
|
||||
delete: handleDelete,
|
||||
};
|
||||
}
|
||||
|
||||
@ -138,7 +138,7 @@ export function createHookRequest(axiosConfig: AxiosRequestConfig, backendConfig
|
||||
data,
|
||||
error,
|
||||
loading,
|
||||
network
|
||||
network,
|
||||
};
|
||||
}
|
||||
|
||||
@ -183,7 +183,7 @@ export function createHookRequest(axiosConfig: AxiosRequestConfig, backendConfig
|
||||
get,
|
||||
post,
|
||||
put,
|
||||
delete: handleDelete
|
||||
delete: handleDelete,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -13,8 +13,8 @@ interface TraditionColor {
|
||||
export const traditionColors = colorJson as TraditionColor[];
|
||||
|
||||
export function isInTraditionColors(color: string) {
|
||||
return traditionColors.some(item => {
|
||||
const flag = item.data.some(v => v.color === color);
|
||||
return traditionColors.some((item) => {
|
||||
const flag = item.data.some((v) => v.color === color);
|
||||
return flag;
|
||||
});
|
||||
}
|
||||
|
||||
@ -26,7 +26,7 @@ const themeColorList = [
|
||||
'#ffb300',
|
||||
'#fdd835',
|
||||
'#6d4c41',
|
||||
'#546e7a'
|
||||
'#546e7a',
|
||||
];
|
||||
|
||||
const defaultThemeSetting: ThemeSetting = {
|
||||
@ -38,8 +38,8 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
{ value: 'vertical', label: EnumThemeLayoutMode.vertical },
|
||||
{ value: 'vertical-mix', label: EnumThemeLayoutMode['vertical-mix'] },
|
||||
{ value: 'horizontal', label: EnumThemeLayoutMode.horizontal },
|
||||
{ value: 'horizontal-mix', label: EnumThemeLayoutMode['horizontal-mix'] }
|
||||
]
|
||||
{ value: 'horizontal-mix', label: EnumThemeLayoutMode['horizontal-mix'] },
|
||||
],
|
||||
},
|
||||
themeColor: themeColorList[0],
|
||||
themeColorList,
|
||||
@ -47,7 +47,7 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
info: '#2080f0',
|
||||
success: '#52c41a',
|
||||
warning: '#faad14',
|
||||
error: '#f5222d'
|
||||
error: '#f5222d',
|
||||
},
|
||||
isCustomizeInfoColor: false,
|
||||
fixedHeaderAndTab: true,
|
||||
@ -56,8 +56,8 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
height: 56,
|
||||
crumb: {
|
||||
visible: true,
|
||||
showIcon: true
|
||||
}
|
||||
showIcon: true,
|
||||
},
|
||||
},
|
||||
tab: {
|
||||
visible: true,
|
||||
@ -65,28 +65,28 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
mode: 'chrome',
|
||||
modeList: [
|
||||
{ value: 'chrome', label: EnumThemeTabMode.chrome },
|
||||
{ value: 'button', label: EnumThemeTabMode.button }
|
||||
{ value: 'button', label: EnumThemeTabMode.button },
|
||||
],
|
||||
isCache: true
|
||||
isCache: true,
|
||||
},
|
||||
sider: {
|
||||
width: 220,
|
||||
collapsedWidth: 64,
|
||||
mixWidth: 80,
|
||||
mixCollapsedWidth: 48,
|
||||
mixChildMenuWidth: 200
|
||||
mixChildMenuWidth: 200,
|
||||
},
|
||||
menu: {
|
||||
horizontalPosition: 'flex-start',
|
||||
horizontalPositionList: [
|
||||
{ value: 'flex-start', label: EnumThemeHorizontalMenuPosition['flex-start'] },
|
||||
{ value: 'center', label: EnumThemeHorizontalMenuPosition.center },
|
||||
{ value: 'flex-end', label: EnumThemeHorizontalMenuPosition['flex-end'] }
|
||||
]
|
||||
{ value: 'flex-end', label: EnumThemeHorizontalMenuPosition['flex-end'] },
|
||||
],
|
||||
},
|
||||
footer: {
|
||||
fixed: false,
|
||||
height: 48
|
||||
height: 48,
|
||||
},
|
||||
page: {
|
||||
animate: true,
|
||||
@ -97,9 +97,9 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
{ value: 'fade-bottom', label: EnumThemeAnimateMode['fade-bottom'] },
|
||||
{ value: 'fade-scale', label: EnumThemeAnimateMode['fade-scale'] },
|
||||
{ value: 'zoom-fade', label: EnumThemeAnimateMode['zoom-fade'] },
|
||||
{ value: 'zoom-out', label: EnumThemeAnimateMode['zoom-out'] }
|
||||
]
|
||||
}
|
||||
{ value: 'zoom-out', label: EnumThemeAnimateMode['zoom-out'] },
|
||||
],
|
||||
},
|
||||
};
|
||||
|
||||
export const themeSetting = (jsonSetting as ThemeSetting) || defaultThemeSetting;
|
||||
|
||||
@ -17,7 +17,7 @@ export const useAppStore = defineStore('app-store', {
|
||||
reloadFlag: true,
|
||||
settingDrawerVisible: false,
|
||||
siderCollapse: false,
|
||||
mixSiderFixed: false
|
||||
mixSiderFixed: false,
|
||||
}),
|
||||
actions: {
|
||||
/**
|
||||
@ -65,6 +65,6 @@ export const useAppStore = defineStore('app-store', {
|
||||
/** 设置 vertical-mix模式下 侧边栏的固定状态 */
|
||||
toggleMixSiderFixed() {
|
||||
this.mixSiderFixed = !this.mixSiderFixed;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -18,13 +18,13 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
state: (): AuthState => ({
|
||||
userInfo: getUserInfo(),
|
||||
token: getToken(),
|
||||
loginLoding: false
|
||||
loginLoding: false,
|
||||
}),
|
||||
getters: {
|
||||
/** 是否登录 */
|
||||
isLogin(state) {
|
||||
return Boolean(state.token);
|
||||
}
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/** 重置auth状态 */
|
||||
@ -67,7 +67,7 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
window.$notification?.success({
|
||||
title: '登录成功!',
|
||||
content: `欢迎回来，${data.userName}!`,
|
||||
duration: 3000
|
||||
duration: 3000,
|
||||
});
|
||||
} else {
|
||||
// 不成功则重置状态
|
||||
@ -87,6 +87,6 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
await this.loginByToken(data);
|
||||
}
|
||||
this.loginLoding = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -6,7 +6,7 @@ import {
|
||||
transformAuthRouteToMenu,
|
||||
transformAuthRoutesToVueRoutes,
|
||||
transformAuthRoutesToSearchMenus,
|
||||
getCacheRoutes
|
||||
getCacheRoutes,
|
||||
} from '@/utils';
|
||||
import type { GlobalMenuOption, SearchMenu } from '@/interface';
|
||||
import { useTabStore } from '../tab';
|
||||
@ -30,7 +30,7 @@ export const useRouteStore = defineStore('route-store', {
|
||||
routeHomeName: 'dashboard_analysis',
|
||||
menus: [],
|
||||
searchMenus: [],
|
||||
cacheRoutes: []
|
||||
cacheRoutes: [],
|
||||
}),
|
||||
actions: {
|
||||
/**
|
||||
@ -49,7 +49,7 @@ export const useRouteStore = defineStore('route-store', {
|
||||
this.searchMenus = transformAuthRoutesToSearchMenus(data.routes);
|
||||
|
||||
const vueRoutes = transformAuthRoutesToVueRoutes(data.routes);
|
||||
vueRoutes.forEach(route => {
|
||||
vueRoutes.forEach((route) => {
|
||||
router.addRoute(route);
|
||||
});
|
||||
|
||||
@ -58,6 +58,6 @@ export const useRouteStore = defineStore('route-store', {
|
||||
initHomeTab(data.home, router);
|
||||
this.isAddedDynamicRoute = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -12,8 +12,8 @@ export function getTabRouteByVueRoute(route: RouteRecordNormalized | RouteLocati
|
||||
meta: route.meta,
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
};
|
||||
return tabRoute;
|
||||
}
|
||||
@ -24,7 +24,7 @@ export function getTabRouteByVueRoute(route: RouteRecordNormalized | RouteLocati
|
||||
* @param path - 该页签的路径
|
||||
*/
|
||||
export function getIndexInTabRoutes(tabs: GlobalTabRoute[], path: string) {
|
||||
return tabs.findIndex(tab => tab.path === path);
|
||||
return tabs.findIndex((tab) => tab.path === path);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -22,21 +22,21 @@ export const useTabStore = defineStore('tab-store', {
|
||||
name: 'root',
|
||||
path: '/',
|
||||
meta: {
|
||||
title: 'root'
|
||||
title: 'root',
|
||||
},
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
},
|
||||
activeTab: ''
|
||||
activeTab: '',
|
||||
}),
|
||||
getters: {
|
||||
/** 当前激活状态的页签索引 */
|
||||
activeTabIndex(state) {
|
||||
const { tabs, activeTab } = state;
|
||||
return tabs.findIndex(tab => tab.path === activeTab);
|
||||
}
|
||||
return tabs.findIndex((tab) => tab.path === activeTab);
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/**
|
||||
@ -53,7 +53,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
*/
|
||||
initHomeTab(routeHomeName: string, router: Router) {
|
||||
const routes = router.getRoutes();
|
||||
const findHome = routes.find(item => item.name === routeHomeName);
|
||||
const findHome = routes.find((item) => item.name === routeHomeName);
|
||||
if (findHome) {
|
||||
this.homeTab = getTabRouteByVueRoute(findHome);
|
||||
}
|
||||
@ -75,7 +75,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
const { routerPush } = useRouterPush(false);
|
||||
|
||||
const isActive = this.activeTab === path;
|
||||
const updateTabs = this.tabs.filter(tab => tab.path !== path);
|
||||
const updateTabs = this.tabs.filter((tab) => tab.path !== path);
|
||||
this.tabs = updateTabs;
|
||||
if (isActive && updateTabs.length) {
|
||||
const activePath = updateTabs[updateTabs.length - 1].path;
|
||||
@ -93,7 +93,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
const homePath = this.homeTab.path;
|
||||
const remain = [homePath, ...excludes];
|
||||
const hasActive = remain.includes(this.activeTab);
|
||||
const updateTabs = this.tabs.filter(tab => remain.includes(tab.path));
|
||||
const updateTabs = this.tabs.filter((tab) => remain.includes(tab.path));
|
||||
this.tabs = updateTabs;
|
||||
if (!hasActive && updateTabs.length) {
|
||||
const activePath = updateTabs[updateTabs.length - 1].path;
|
||||
@ -108,7 +108,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
clearLeftTab(path: string) {
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
const excludes = this.tabs.slice(index).map(item => item.path);
|
||||
const excludes = this.tabs.slice(index).map((item) => item.path);
|
||||
this.clearTab(excludes);
|
||||
}
|
||||
},
|
||||
@ -119,7 +119,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
clearRightTab(path: string) {
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
const excludes = this.tabs.slice(0, index + 1).map(item => item.path);
|
||||
const excludes = this.tabs.slice(0, index + 1).map((item) => item.path);
|
||||
this.clearTab(excludes);
|
||||
}
|
||||
},
|
||||
@ -154,7 +154,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
getTabScrollPosition(path: string) {
|
||||
const position = {
|
||||
left: 0,
|
||||
top: 0
|
||||
top: 0,
|
||||
};
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
@ -178,6 +178,6 @@ export const useTabStore = defineStore('tab-store', {
|
||||
}
|
||||
this.tabs = tabs;
|
||||
this.setActiveTab(currentRoute.path);
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -26,17 +26,17 @@ interface ColorAction {
|
||||
/** 获取主题颜色的各种场景对应的颜色 */
|
||||
function getThemeColors(colors: [ColorType, string][]) {
|
||||
const colorActions: ColorAction[] = [
|
||||
{ scene: '', handler: color => color },
|
||||
{ scene: 'Suppl', handler: color => color },
|
||||
{ scene: 'Hover', handler: color => getColorPalette(color, 5) },
|
||||
{ scene: 'Pressed', handler: color => getColorPalette(color, 7) },
|
||||
{ scene: 'Active', handler: color => addColorAlpha(color, 0.1) }
|
||||
{ scene: '', handler: (color) => color },
|
||||
{ scene: 'Suppl', handler: (color) => color },
|
||||
{ scene: 'Hover', handler: (color) => getColorPalette(color, 5) },
|
||||
{ scene: 'Pressed', handler: (color) => getColorPalette(color, 7) },
|
||||
{ scene: 'Active', handler: (color) => addColorAlpha(color, 0.1) },
|
||||
];
|
||||
|
||||
const themeColor: ThemeColor = {};
|
||||
|
||||
colors.forEach(color => {
|
||||
colorActions.forEach(action => {
|
||||
colors.forEach((color) => {
|
||||
colorActions.forEach((action) => {
|
||||
const [colorType, colorValue] = color;
|
||||
const colorKey: ColorKey = `${colorType}Color${action.scene}`;
|
||||
themeColor[colorKey] = action.handler(colorValue);
|
||||
@ -57,18 +57,18 @@ export function getNaiveThemeOverrides(colors: Record<ColorType, string>): Globa
|
||||
['info', info],
|
||||
['success', success],
|
||||
['warning', warning],
|
||||
['error', error]
|
||||
['error', error],
|
||||
]);
|
||||
|
||||
const colorLoading = primary;
|
||||
|
||||
return {
|
||||
common: {
|
||||
...themeColors
|
||||
...themeColors,
|
||||
},
|
||||
LoadingBar: {
|
||||
colorLoading
|
||||
}
|
||||
colorLoading,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@ -79,7 +79,7 @@ type ThemeVarsKeys = keyof ThemeVars;
|
||||
export function addThemeCssVarsToHtml(themeVars: ThemeVars) {
|
||||
const keys = Object.keys(themeVars) as ThemeVarsKeys[];
|
||||
const style: string[] = [];
|
||||
keys.forEach(key => {
|
||||
keys.forEach((key) => {
|
||||
style.push(`--${kebabCase(key)}: ${themeVars[key]}`);
|
||||
});
|
||||
const styleStr = style.join(';');
|
||||
@ -97,6 +97,6 @@ export function handleWindicssDarkMode() {
|
||||
}
|
||||
return {
|
||||
addDarkClass,
|
||||
removeDarkClass
|
||||
removeDarkClass,
|
||||
};
|
||||
}
|
||||
|
||||
@ -5,7 +5,7 @@ import type {
|
||||
ThemeLayoutMode,
|
||||
ThemeTabMode,
|
||||
ThemeHorizontalMenuPosition,
|
||||
ThemeAnimateMode
|
||||
ThemeAnimateMode,
|
||||
} from '@/interface';
|
||||
import { getThemeSettings, getNaiveThemeOverrides, addThemeCssVarsToHtml } from './helpers';
|
||||
|
||||
@ -17,13 +17,15 @@ export const useThemeStore = defineStore('theme-store', {
|
||||
/** naiveUI的主题配置 */
|
||||
naiveThemeOverrides(state) {
|
||||
const overrides = getNaiveThemeOverrides({ primary: state.themeColor, ...state.otherColor });
|
||||
addThemeCssVarsToHtml(overrides.common!);
|
||||
if (overrides.common) {
|
||||
addThemeCssVarsToHtml(overrides.common);
|
||||
}
|
||||
return overrides;
|
||||
},
|
||||
/** naive-ui暗黑主题 */
|
||||
naiveTheme(state) {
|
||||
return state.darkMode ? darkTheme : undefined;
|
||||
}
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/** 重置theme状态 */
|
||||
@ -133,6 +135,6 @@ export const useThemeStore = defineStore('theme-store', {
|
||||
/** 设置页面过渡动画类型 */
|
||||
setPageAnimateMode(mode: ThemeAnimateMode) {
|
||||
this.page.animateMode = mode;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -10,7 +10,7 @@ export default function subscribeAppStore() {
|
||||
// 弹窗打开时禁止滚动条
|
||||
const stopHandle = watch(
|
||||
() => app.settingDrawerVisible,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
scrollBodyHandler(newValue);
|
||||
}
|
||||
);
|
||||
|
||||
@ -13,7 +13,7 @@ export default function subscribeThemeStore() {
|
||||
|
||||
const stopThemeColor = watch(
|
||||
() => theme.themeColor,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
setThemeColor(newValue);
|
||||
},
|
||||
{ immediate: true }
|
||||
@ -22,7 +22,7 @@ export default function subscribeThemeStore() {
|
||||
// 监听暗黑模式
|
||||
const stopDarkMode = watch(
|
||||
() => theme.darkMode,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
if (newValue) {
|
||||
addDarkClass();
|
||||
} else {
|
||||
@ -34,7 +34,7 @@ export default function subscribeThemeStore() {
|
||||
// 监听操作系统主题模式
|
||||
const stopOsTheme = watch(
|
||||
osTheme,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
const isDark = newValue === 'dark';
|
||||
theme.setDarkMode(isDark);
|
||||
},
|
||||
@ -42,7 +42,7 @@ export default function subscribeThemeStore() {
|
||||
);
|
||||
|
||||
// 禁用横向滚动(页面切换时,过渡动画会产生水平方向的滚动条, 小于最小宽度时，不禁止)
|
||||
const stopWidth = watch(width, newValue => {
|
||||
const stopWidth = watch(width, (newValue) => {
|
||||
if (newValue < theme.layout.minWidth) {
|
||||
document.documentElement.style.overflowX = 'auto';
|
||||
} else {
|
||||
@ -69,6 +69,6 @@ function handleWindicssDarkMode() {
|
||||
}
|
||||
return {
|
||||
addDarkClass,
|
||||
removeDarkClass
|
||||
removeDarkClass,
|
||||
};
|
||||
}
|
||||
|
||||
2
src/typings/common/env.d.ts
vendored
2
src/typings/common/env.d.ts
vendored
@ -3,7 +3,7 @@
|
||||
declare module '*.vue' {
|
||||
import { DefineComponent } from 'vue';
|
||||
|
||||
const component: DefineComponent<{}, {}, any>;
|
||||
const component: DefineComponent<object, object, any>;
|
||||
export default component;
|
||||
}
|
||||
|
||||
|
||||
7
src/typings/common/route.d.ts
vendored
7
src/typings/common/route.d.ts
vendored
@ -136,11 +136,12 @@ declare namespace AuthRoute {
|
||||
| `${Path}/:module(${string})?`;
|
||||
|
||||
/** 获取一级路由(包括有子路由的一级路由) */
|
||||
type GetSingleRouteKey<Key extends RouteKey> =
|
||||
Key extends `${infer IgnoredLeft}${RouteSplitMark}${infer IgnoredRight}` ? never : Key;
|
||||
type GetSingleRouteKey<Key extends RouteKey> = Key extends `${infer _Left}${RouteSplitMark}${infer _Right}`
|
||||
? never
|
||||
: Key;
|
||||
|
||||
/** 获取子路由的一级父路由 */
|
||||
type GetRouteFirstParentKey<Key extends RouteKey> = Key extends `${infer Left}${RouteSplitMark}${infer IgnoredRight}`
|
||||
type GetRouteFirstParentKey<Key extends RouteKey> = Key extends `${infer Left}${RouteSplitMark}${infer _Right}`
|
||||
? Left
|
||||
: never;
|
||||
}
|
||||
|
||||
2
src/typings/common/window.d.ts
vendored
2
src/typings/common/window.d.ts
vendored
@ -2,7 +2,7 @@ import type {
|
||||
LoadingBarProviderInst,
|
||||
DialogProviderInst,
|
||||
MessageProviderInst,
|
||||
NotificationProviderInst
|
||||
NotificationProviderInst,
|
||||
} from 'naive-ui';
|
||||
|
||||
declare global {
|
||||
|
||||
@ -37,7 +37,7 @@ export function getUserInfo() {
|
||||
userId: '',
|
||||
userName: '',
|
||||
userPhone: '',
|
||||
userRole: 'visitor'
|
||||
userRole: 'visitor',
|
||||
};
|
||||
const userInfo: Auth.UserInfo = getLocal<Auth.UserInfo>(EnumStorageKey['user-info']) || emptyInfo;
|
||||
return userInfo;
|
||||
|
||||
@ -30,7 +30,7 @@ export function getColorPalette(color: string, index: ColorIndex) {
|
||||
const newHsv: HsvColor = {
|
||||
h: getHue(hsv, i, isLight),
|
||||
s: getSaturation(hsv, i, isLight),
|
||||
v: getValue(hsv, i, isLight)
|
||||
v: getValue(hsv, i, isLight),
|
||||
};
|
||||
|
||||
return colord(newHsv).toHex();
|
||||
@ -42,7 +42,7 @@ export function getColorPalette(color: string, index: ColorIndex) {
|
||||
*/
|
||||
export function getAllColorPalette(color: string) {
|
||||
const indexs: ColorIndex[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
||||
return indexs.map(index => getColorPalette(color, index));
|
||||
return indexs.map((index) => getColorPalette(color, index));
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
/** 执行策略模式 */
|
||||
export function exeStrategyActions(actions: Common.StrategyAction[]) {
|
||||
actions.some(item => {
|
||||
actions.some((item) => {
|
||||
const [flag, action] = item;
|
||||
if (flag) {
|
||||
action();
|
||||
|
||||
@ -27,7 +27,7 @@ export function transformToTimeCountDown(seconds: number) {
|
||||
* @param start - 开始范围
|
||||
* @param end - 结束范围
|
||||
*/
|
||||
export function getRandomInterger(end: number, start: number = 0) {
|
||||
export function getRandomInterger(end: number, start = 0) {
|
||||
const range = end - start;
|
||||
const random = Math.floor(Math.random() * range + start);
|
||||
return random;
|
||||
|
||||
@ -18,17 +18,17 @@ interface CustomFormRules {
|
||||
export const formRules: CustomFormRules = {
|
||||
phone: [
|
||||
{ required: true, message: '请输入手机号码' },
|
||||
{ pattern: REGEXP_PHONE, message: '手机号码格式错误', trigger: 'input' }
|
||||
{ pattern: REGEXP_PHONE, message: '手机号码格式错误', trigger: 'input' },
|
||||
],
|
||||
pwd: [
|
||||
{ required: true, message: '请输入密码' },
|
||||
{ pattern: REGEXP_PWD, message: '密码为8-18位数字/字符/符号，至少2种组合', trigger: 'input' }
|
||||
{ pattern: REGEXP_PWD, message: '密码为8-18位数字/字符/符号，至少2种组合', trigger: 'input' },
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: '请输入验证码' },
|
||||
{ pattern: REGEXP_CODE_SIX, message: '验证码格式错误', trigger: 'input' }
|
||||
{ pattern: REGEXP_CODE_SIX, message: '验证码格式错误', trigger: 'input' },
|
||||
],
|
||||
email: [{ pattern: REGEXP_EMAIL, message: '邮箱格式错误', trigger: 'blur' }]
|
||||
email: [{ pattern: REGEXP_EMAIL, message: '邮箱格式错误', trigger: 'blur' }],
|
||||
};
|
||||
|
||||
/** 获取确认密码的表单规则 */
|
||||
@ -43,8 +43,8 @@ export function getConfirmPwdRule(pwd: Ref<string>) {
|
||||
return Promise.resolve();
|
||||
},
|
||||
message: '输入的值与密码不一致',
|
||||
trigger: 'input'
|
||||
}
|
||||
trigger: 'input',
|
||||
},
|
||||
];
|
||||
return confirmPwdRule;
|
||||
}
|
||||
@ -61,8 +61,8 @@ export function getImgCodeRule(imgCode: Ref<string>) {
|
||||
return Promise.resolve();
|
||||
},
|
||||
message: '验证码不正确',
|
||||
trigger: 'blur'
|
||||
}
|
||||
trigger: 'blur',
|
||||
},
|
||||
];
|
||||
return imgCodeRule;
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@ import type { GlobalMenuOption, GlobalBreadcrumb } from '@/interface';
|
||||
*/
|
||||
export function getBreadcrumbByRouteKey(activeKey: string, menus: GlobalMenuOption[], rootPath: string) {
|
||||
const breadcrumbMenu = getBreadcrumbMenu(activeKey, menus);
|
||||
const breadcrumb = breadcrumbMenu.map(item => transformBreadcrumbMenuToBreadcrumb(item, rootPath));
|
||||
const breadcrumb = breadcrumbMenu.map((item) => transformBreadcrumbMenuToBreadcrumb(item, rootPath));
|
||||
return breadcrumb;
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@ export function getBreadcrumbByRouteKey(activeKey: string, menus: GlobalMenuOpti
|
||||
*/
|
||||
function getBreadcrumbMenu(activeKey: string, menus: GlobalMenuOption[]) {
|
||||
const breadcrumbMenu: GlobalMenuOption[] = [];
|
||||
menus.some(menu => {
|
||||
menus.some((menu) => {
|
||||
const flag = activeKey.includes(menu.routeName);
|
||||
if (flag) {
|
||||
breadcrumbMenu.push(...getBreadcrumbMenuItem(activeKey, menu));
|
||||
@ -42,7 +42,7 @@ function getBreadcrumbMenuItem(activeKey: string, menu: GlobalMenuOption) {
|
||||
if (activeKey.includes(menu.routeName) && menu.children && menu.children.length) {
|
||||
breadcrumbMenu.push(menu);
|
||||
breadcrumbMenu.push(
|
||||
...menu.children.map(item => getBreadcrumbMenuItem(activeKey, item as GlobalMenuOption)).flat(1)
|
||||
...menu.children.map((item) => getBreadcrumbMenuItem(activeKey, item as GlobalMenuOption)).flat(1)
|
||||
);
|
||||
}
|
||||
|
||||
@ -61,13 +61,13 @@ function transformBreadcrumbMenuToBreadcrumb(menu: GlobalMenuOption, rootPath: s
|
||||
label: menu.label as string,
|
||||
routeName: menu.routeName,
|
||||
disabled: menu.routePath === rootPath,
|
||||
hasChildren
|
||||
hasChildren,
|
||||
};
|
||||
if (menu.icon) {
|
||||
breadcrumb.icon = menu.icon;
|
||||
}
|
||||
if (hasChildren) {
|
||||
breadcrumb.children = menu.children?.map(item =>
|
||||
breadcrumb.children = menu.children?.map((item) =>
|
||||
transformBreadcrumbMenuToBreadcrumb(item as GlobalMenuOption, rootPath)
|
||||
);
|
||||
}
|
||||
|
||||
@ -6,10 +6,10 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
*/
|
||||
export function getCacheRoutes(routes: RouteRecordRaw[]) {
|
||||
const cacheNames: string[] = [];
|
||||
routes.forEach(route => {
|
||||
routes.forEach((route) => {
|
||||
// 只需要获取二级路由的缓存的组件名
|
||||
if (hasChildren(route)) {
|
||||
route.children!.forEach(item => {
|
||||
(route.children as RouteRecordRaw[]).forEach((item) => {
|
||||
if (isKeepAlive(item)) {
|
||||
cacheNames.push(item.name as string);
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@ type LayoutComponent = Record<LayoutComponentName, () => Promise<Component>>;
|
||||
export function getLayoutComponent(layoutType: LayoutComponentName) {
|
||||
const layoutComponent: LayoutComponent = {
|
||||
basic: BasicLayout,
|
||||
blank: BlankLayout
|
||||
blank: BlankLayout,
|
||||
};
|
||||
return () => setViewComponentName(layoutComponent[layoutType], EnumLayoutComponentName[layoutType]);
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ type ComponentAction = Record<AuthRoute.RouteComponent, () => void>;
|
||||
* @description 所有多级路由都会被转换成二级路由
|
||||
*/
|
||||
export function transformAuthRoutesToVueRoutes(routes: AuthRoute.Route[]) {
|
||||
return routes.map(route => transformAuthRouteToVueRoute(route)).flat(1);
|
||||
return routes.map((route) => transformAuthRouteToVueRoute(route)).flat(1);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -70,10 +70,14 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
},
|
||||
self() {
|
||||
itemRoute.component = getViewComponent(item.name);
|
||||
}
|
||||
},
|
||||
};
|
||||
try {
|
||||
action[item.component!]();
|
||||
if (item.component) {
|
||||
action[item.component]();
|
||||
} else {
|
||||
consoleError('路由组件解析失败: ', item);
|
||||
}
|
||||
} catch {
|
||||
consoleError('路由组件解析失败: ', item);
|
||||
}
|
||||
@ -91,8 +95,8 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
{
|
||||
path: '',
|
||||
name: item.name,
|
||||
component: getViewComponent('not-found-page')
|
||||
}
|
||||
component: getViewComponent('not-found-page'),
|
||||
},
|
||||
];
|
||||
} else {
|
||||
const parentPath = `${itemRoute.path}-parent` as AuthRoute.SingleRouteParentPath;
|
||||
@ -103,7 +107,7 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
path: parentPath,
|
||||
component: layout,
|
||||
redirect: item.path,
|
||||
children: [itemRoute]
|
||||
children: [itemRoute],
|
||||
};
|
||||
|
||||
return [parentRoute];
|
||||
@ -112,10 +116,10 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
|
||||
// 子路由
|
||||
if (hasChildren(item)) {
|
||||
const children = item.children!.map(child => transformAuthRouteToVueRoute(child)).flat();
|
||||
const children = (item.children as AuthRoute.Route[]).map((child) => transformAuthRouteToVueRoute(child)).flat();
|
||||
|
||||
// 找出第一个不为多级路由中间级的子路由路径作为重定向路径
|
||||
const redirectPath: AuthRoute.RoutePath = (children.find(item => !item.meta?.multi)?.path ||
|
||||
const redirectPath: AuthRoute.RoutePath = (children.find((v) => !v.meta?.multi)?.path ||
|
||||
'/') as AuthRoute.RoutePath;
|
||||
if (redirectPath === '/') {
|
||||
consoleError('该多级路由没有有效的子路径', item);
|
||||
|
||||
@ -24,7 +24,7 @@ function addPartialProps(menuItem: GlobalMenuOption, icon?: string, children?: G
|
||||
*/
|
||||
export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuOption[] {
|
||||
const globalMenu: GlobalMenuOption[] = [];
|
||||
routes.forEach(route => {
|
||||
routes.forEach((route) => {
|
||||
const { name, path, meta } = route;
|
||||
const routeName = name as string;
|
||||
let menuChildren: GlobalMenuOption[] | undefined;
|
||||
@ -36,7 +36,7 @@ export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuO
|
||||
key: routeName,
|
||||
label: meta.title,
|
||||
routeName,
|
||||
routePath: path
|
||||
routePath: path,
|
||||
},
|
||||
meta?.icon,
|
||||
menuChildren
|
||||
@ -56,7 +56,7 @@ export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuO
|
||||
* @param menus - 菜单数据
|
||||
*/
|
||||
export function getActiveKeyPathsOfMenus(activeKey: string, menus: GlobalMenuOption[]) {
|
||||
const keys = menus.map(menu => getActiveKeyPathsOfMenu(activeKey, menu)).flat(1);
|
||||
const keys = menus.map((menu) => getActiveKeyPathsOfMenu(activeKey, menu)).flat(1);
|
||||
return keys;
|
||||
}
|
||||
|
||||
@ -66,7 +66,7 @@ function getActiveKeyPathsOfMenu(activeKey: string, menu: GlobalMenuOption) {
|
||||
keys.push(menu.routeName);
|
||||
}
|
||||
if (menu.children) {
|
||||
keys.push(...menu.children.map(item => getActiveKeyPathsOfMenu(activeKey, item)).flat(1));
|
||||
keys.push(...menu.children.map((item) => getActiveKeyPathsOfMenu(activeKey, item)).flat(1));
|
||||
}
|
||||
return keys;
|
||||
}
|
||||
|
||||
@ -12,12 +12,12 @@ export function getTabRoutes() {
|
||||
const routes: GlobalTabRoute[] = [];
|
||||
const data = getLocal<GlobalTabRoute[]>(EnumStorageKey['tab-routes']);
|
||||
if (data) {
|
||||
const defaultTabRoutes = data.map(item => ({
|
||||
const defaultTabRoutes = data.map((item) => ({
|
||||
...item,
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
}));
|
||||
routes.push(...defaultTabRoutes);
|
||||
}
|
||||
|
||||
@ -6,7 +6,7 @@ import {
|
||||
NETWORK_ERROR_MSG,
|
||||
REQUEST_TIMEOUT_CODE,
|
||||
REQUEST_TIMEOUT_MSG,
|
||||
ERROR_STATUS
|
||||
ERROR_STATUS,
|
||||
} from '@/config';
|
||||
import { exeStrategyActions } from '../common';
|
||||
import { showErrorMsg } from './msg';
|
||||
@ -21,7 +21,7 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
const error: Service.RequestError = {
|
||||
type: 'axios',
|
||||
code: DEFAULT_REQUEST_ERROR_CODE,
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
const actions: Common.StrategyAction[] = [
|
||||
@ -30,14 +30,14 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
!window.navigator.onLine || axiosError.message === 'Network Error',
|
||||
() => {
|
||||
Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG });
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 超时错误
|
||||
axiosError.code === REQUEST_TIMEOUT_CODE && axiosError.message.includes('timeout'),
|
||||
() => {
|
||||
Object.assign(error, { code: REQUEST_TIMEOUT_CODE, msg: REQUEST_TIMEOUT_MSG });
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 请求不成功的错误
|
||||
@ -46,8 +46,8 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
const errorCode: ErrorStatus = (axiosError.response?.status as ErrorStatus) || 'DEFAULT';
|
||||
const msg = ERROR_STATUS[errorCode];
|
||||
Object.assign(error, { code: errorCode, msg });
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
exeStrategyActions(actions);
|
||||
@ -65,7 +65,7 @@ export function handleResponseError(response: AxiosResponse) {
|
||||
const error: Service.RequestError = {
|
||||
type: 'axios',
|
||||
code: DEFAULT_REQUEST_ERROR_CODE,
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
if (!window.navigator.onLine) {
|
||||
@ -92,7 +92,7 @@ export function handleBackendError(backendResult: Record<string, any>, config: S
|
||||
const error: Service.RequestError = {
|
||||
type: 'backend',
|
||||
code: backendResult[codeKey],
|
||||
msg: backendResult[msgKey]
|
||||
msg: backendResult[msgKey],
|
||||
};
|
||||
|
||||
showErrorMsg(error);
|
||||
|
||||
@ -3,13 +3,13 @@ export async function handleServiceResult<T = any>(error: Service.RequestError |
|
||||
if (error) {
|
||||
const fail: Service.FailedResult = {
|
||||
error,
|
||||
data: null
|
||||
data: null,
|
||||
};
|
||||
return fail;
|
||||
}
|
||||
const success: Service.SuccessResult<T> = {
|
||||
error: null,
|
||||
data
|
||||
data,
|
||||
};
|
||||
return success;
|
||||
}
|
||||
|
||||
@ -34,7 +34,7 @@ async function transformFile(file: File[] | File, key: string) {
|
||||
if (isArray(file)) {
|
||||
// 多文件
|
||||
await Promise.all(
|
||||
(file as File[]).map(item => {
|
||||
(file as File[]).map((item) => {
|
||||
formData.append(key, item);
|
||||
return true;
|
||||
})
|
||||
|
||||
@ -27,13 +27,13 @@ function transformVersionData(tuple: [string, string]): PkgVersionInfo {
|
||||
const [name, version] = tuple;
|
||||
return {
|
||||
name,
|
||||
version
|
||||
version,
|
||||
};
|
||||
}
|
||||
|
||||
export const pkgJson: PkgJson = {
|
||||
name: pkgWithType.name,
|
||||
version: pkgWithType.version,
|
||||
dependencies: Object.entries(pkgWithType.dependencies).map(item => transformVersionData(item)),
|
||||
devDependencies: Object.entries(pkgWithType.devDependencies).map(item => transformVersionData(item))
|
||||
dependencies: Object.entries(pkgWithType.dependencies).map((item) => transformVersionData(item)),
|
||||
devDependencies: Object.entries(pkgWithType.devDependencies).map((item) => transformVersionData(item)),
|
||||
};
|
||||
|
||||
@ -63,40 +63,40 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {},
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
desc: '按钮的 type 分别为 default、primary、info、success、warning 和 error。'
|
||||
desc: '按钮的 type 分别为 default、primary、info、success、warning 和 error。',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
@ -105,74 +105,74 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { strong: true, secondary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { strong: true, secondary: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { strong: true, secondary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { strong: true, secondary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { strong: true, secondary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { strong: true, secondary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { strong: true, secondary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { strong: true, secondary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { strong: true, secondary: true, round: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { strong: true, secondary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { strong: true, secondary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { strong: true, secondary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
props: { strong: true, secondary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
props: { strong: true, secondary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@ -181,64 +181,64 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { tertiary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { tertiary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { tertiary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { tertiary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { tertiary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { tertiary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { tertiary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { tertiary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { tertiary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { tertiary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { tertiary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { tertiary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
@ -247,64 +247,64 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { quaternary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { quaternary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { quaternary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { quaternary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { quaternary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { quaternary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { quaternary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { quaternary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { quaternary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { quaternary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { quaternary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { quaternary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
@ -313,39 +313,39 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { dashed: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { dashed: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { dashed: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { dashed: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { dashed: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { dashed: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { dashed: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@ -354,24 +354,24 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { size: 'tiny', strong: true },
|
||||
label: '小小'
|
||||
label: '小小',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { size: 'small', strong: true },
|
||||
label: '小'
|
||||
label: '小',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { size: 'medium', strong: true },
|
||||
label: '不小'
|
||||
label: '不小',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { size: 'large', strong: true },
|
||||
label: '不不小'
|
||||
}
|
||||
]
|
||||
label: '不不小',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
@ -381,9 +381,9 @@ const buttonExample: ButtonExample[] = [
|
||||
id: 0,
|
||||
props: { text: true },
|
||||
label: '那车头依然吐着烟',
|
||||
icon: 'mdi:train'
|
||||
}
|
||||
]
|
||||
icon: 'mdi:train',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
@ -396,12 +396,12 @@ const buttonExample: ButtonExample[] = [
|
||||
tag: 'a',
|
||||
href: 'https://github.com/honghuangdc/soybean-admin',
|
||||
target: '_blank',
|
||||
type: 'primary'
|
||||
type: 'primary',
|
||||
},
|
||||
label: 'soybean-admin'
|
||||
}
|
||||
label: 'soybean-admin',
|
||||
},
|
||||
],
|
||||
desc: '你可以把按钮渲染成不同的标签，比如 a标签 。'
|
||||
desc: '你可以把按钮渲染成不同的标签，比如 a标签 。',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
@ -410,12 +410,12 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
disabled: true
|
||||
disabled: true,
|
||||
},
|
||||
label: '不许点'
|
||||
}
|
||||
label: '不许点',
|
||||
},
|
||||
],
|
||||
desc: '按钮可以被禁用'
|
||||
desc: '按钮可以被禁用',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
@ -425,23 +425,23 @@ const buttonExample: ButtonExample[] = [
|
||||
id: 0,
|
||||
props: {
|
||||
secondary: true,
|
||||
strong: true
|
||||
strong: true,
|
||||
},
|
||||
label: '+100元',
|
||||
icon: 'mdi:cash-100'
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
iconPlacement: 'right',
|
||||
secondary: true,
|
||||
strong: true
|
||||
strong: true,
|
||||
},
|
||||
label: '+100元',
|
||||
icon: 'mdi:cash-100'
|
||||
}
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
],
|
||||
desc: '在按钮上使用图标。'
|
||||
desc: '在按钮上使用图标。',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
@ -450,24 +450,24 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
circle: true
|
||||
circle: true,
|
||||
},
|
||||
icon: 'mdi:cash-100'
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: {
|
||||
round: true
|
||||
round: true,
|
||||
},
|
||||
label: '圆角'
|
||||
label: '圆角',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: {},
|
||||
label: '方'
|
||||
}
|
||||
label: '方',
|
||||
},
|
||||
],
|
||||
desc: '按钮拥有不同的形状。'
|
||||
desc: '按钮拥有不同的形状。',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
@ -476,40 +476,40 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { ghost: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { ghost: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { ghost: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { ghost: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { ghost: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { ghost: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { ghost: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
desc: 'Ghost 按钮有透明的背景。'
|
||||
desc: 'Ghost 按钮有透明的背景。',
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
@ -518,58 +518,58 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
color: '#8a2be2'
|
||||
color: '#8a2be2',
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: {
|
||||
color: '#ff69b4'
|
||||
color: '#ff69b4',
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: {
|
||||
color: '#8a2be2',
|
||||
ghost: true
|
||||
ghost: true,
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: {
|
||||
color: '#ff69b4',
|
||||
ghost: true
|
||||
ghost: true,
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: {
|
||||
color: '#8a2be2',
|
||||
text: true
|
||||
text: true,
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: {
|
||||
color: '#ff69b4',
|
||||
text: true
|
||||
text: true,
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
}
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
],
|
||||
desc: '这两个颜色看起来像毒蘑菇。'
|
||||
}
|
||||
desc: '这两个颜色看起来像毒蘑菇。',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user