init
|
@ -0,0 +1,4 @@
|
|||
> 1%
|
||||
last 2 versions
|
||||
not dead
|
||||
not ie 11
|
|
@ -0,0 +1,21 @@
|
|||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
.eslintcache
|
||||
report.html
|
||||
|
||||
yarn.lock
|
||||
npm-debug.log*
|
||||
.pnpm-error.log*
|
||||
.pnpm-debug.log
|
||||
tests/**/coverage/
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
tsconfig.tsbuildinfo
|
|
@ -0,0 +1,14 @@
|
|||
# http://editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.md]
|
||||
insert_final_newline = false
|
||||
trim_trailing_whitespace = false
|
|
@ -0,0 +1,34 @@
|
|||
# 平台本地运行端口号
|
||||
VITE_PORT=8201
|
||||
|
||||
# 预发布环境路由历史模式(Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数")
|
||||
VITE_ROUTER_HISTORY="hash"
|
||||
|
||||
# 基础请求路径
|
||||
VITE_BASE_API=/api
|
||||
|
||||
# 跨域代理地址
|
||||
VITE_APP_URL=http://localhost:8801
|
||||
|
||||
# mock地址
|
||||
VITE_MOCK_BASE_API=/mock
|
||||
|
||||
# 网络请求延迟时间
|
||||
VITE_BASE_API_TIMEOUT=60000
|
||||
|
||||
# 失败重试次数
|
||||
VITE_BASE_API_RETRY=5
|
||||
|
||||
# 失败重试时间
|
||||
VITE_BASE_API_RETRY_DELAY=3000
|
||||
|
||||
# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
|
||||
VITE_CDN=false
|
||||
|
||||
# 是否启用gzip压缩或brotli压缩(分两种情况,删除原始文件和不删除原始文件)
|
||||
# 压缩时不删除原始文件的配置:gzip、brotli、both(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
# 压缩时删除原始文件的配置:gzip-clear、brotli-clear、both-clear(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
VITE_COMPRESSION="none"
|
||||
|
||||
# 开发环境读取配置文件路径
|
||||
VITE_PUBLIC_PATH=/
|
|
@ -0,0 +1,34 @@
|
|||
# 平台本地运行端口号
|
||||
VITE_PORT=8201
|
||||
|
||||
# 预发布环境路由历史模式(Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数")
|
||||
VITE_ROUTER_HISTORY="hash"
|
||||
|
||||
# 基础请求路径
|
||||
VITE_BASE_API=/api
|
||||
|
||||
# 跨域代理地址
|
||||
VITE_APP_URL=http://localhost:8801
|
||||
|
||||
# mock地址
|
||||
VITE_MOCK_BASE_API=/mock
|
||||
|
||||
# 网络请求延迟时间
|
||||
VITE_BASE_API_TIMEOUT=60000
|
||||
|
||||
# 失败重试次数
|
||||
VITE_BASE_API_RETRY=5
|
||||
|
||||
# 失败重试时间
|
||||
VITE_BASE_API_RETRY_DELAY=3000
|
||||
|
||||
# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
|
||||
VITE_CDN=false
|
||||
|
||||
# 是否启用gzip压缩或brotli压缩(分两种情况,删除原始文件和不删除原始文件)
|
||||
# 压缩时不删除原始文件的配置:gzip、brotli、both(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
# 压缩时删除原始文件的配置:gzip-clear、brotli-clear、both-clear(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
VITE_COMPRESSION="none"
|
||||
|
||||
# 开发环境读取配置文件路径
|
||||
VITE_PUBLIC_PATH=/
|
|
@ -0,0 +1,34 @@
|
|||
# 平台本地运行端口号
|
||||
VITE_PORT=8201
|
||||
|
||||
# 预发布环境路由历史模式(Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数")
|
||||
VITE_ROUTER_HISTORY="hash"
|
||||
|
||||
# 基础请求路径
|
||||
VITE_BASE_API=/api
|
||||
|
||||
# 跨域代理地址
|
||||
VITE_APP_URL=http://localhost:8801
|
||||
|
||||
# mock地址
|
||||
VITE_MOCK_BASE_API=/mock
|
||||
|
||||
# 网络请求延迟时间
|
||||
VITE_BASE_API_TIMEOUT=60000
|
||||
|
||||
# 失败重试次数
|
||||
VITE_BASE_API_RETRY=5
|
||||
|
||||
# 失败重试时间
|
||||
VITE_BASE_API_RETRY_DELAY=3000
|
||||
|
||||
# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
|
||||
VITE_CDN=false
|
||||
|
||||
# 是否启用gzip压缩或brotli压缩(分两种情况,删除原始文件和不删除原始文件)
|
||||
# 压缩时不删除原始文件的配置:gzip、brotli、both(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
# 压缩时删除原始文件的配置:gzip-clear、brotli-clear、both-clear(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认)
|
||||
VITE_COMPRESSION="none"
|
||||
|
||||
# 开发环境读取配置文件路径
|
||||
VITE_PUBLIC_PATH=/
|
|
@ -0,0 +1,22 @@
|
|||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
.eslintcache
|
||||
report.html
|
||||
vite.config.*.timestamp*
|
||||
|
||||
yarn.lock
|
||||
npm-debug.log*
|
||||
.pnpm-error.log*
|
||||
.pnpm-debug.log
|
||||
tests/**/coverage/
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
tsconfig.tsbuildinfo
|
|
@ -0,0 +1,4 @@
|
|||
#!/bin/sh
|
||||
. "$(dirname -- "$0")/_/husky.sh"
|
||||
|
||||
pnpm exec lint-staged
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"*.{js,jsx,ts,tsx}": [
|
||||
"prettier --cache --ignore-unknown --write",
|
||||
"eslint --cache --fix"
|
||||
],
|
||||
"{!(package)*.json,*.code-snippets,.!({browserslist,npm,nvm})*rc}": [
|
||||
"prettier --cache --write--parser json"
|
||||
],
|
||||
"package.json": ["prettier --cache --write"],
|
||||
"*.vue": [
|
||||
"prettier --write",
|
||||
"eslint --cache --fix",
|
||||
"stylelint --fix --allow-empty-input"
|
||||
],
|
||||
"*.{css,scss,html}": [
|
||||
"prettier --cache --ignore-unknown --write",
|
||||
"stylelint --fix --allow-empty-input"
|
||||
],
|
||||
"*.md": ["prettier --cache --ignore-unknown --write"]
|
||||
}
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"default": true,
|
||||
"MD003": false,
|
||||
"MD033": false,
|
||||
"MD013": false,
|
||||
"MD001": false,
|
||||
"MD025": false,
|
||||
"MD024": false,
|
||||
"MD007": { "indent": 4 },
|
||||
"no-hard-tabs": false
|
||||
}
|
|
@ -0,0 +1,4 @@
|
|||
shell-emulator=true
|
||||
shamefully-hoist=true
|
||||
enable-pre-post-scripts=false
|
||||
strict-peer-dependencies=false
|
|
@ -0,0 +1,9 @@
|
|||
// @ts-check
|
||||
|
||||
/** @type {import("prettier").Config} */
|
||||
export default {
|
||||
bracketSpacing: true,
|
||||
singleQuote: false,
|
||||
arrowParens: "avoid",
|
||||
trailingComma: "none"
|
||||
};
|
|
@ -0,0 +1,4 @@
|
|||
/dist/*
|
||||
/public/*
|
||||
public/*
|
||||
src/style/reset.scss
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2020-present, pure-admin
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
|
@ -0,0 +1,19 @@
|
|||
<h1>bunny-admin精简版(国际化版本)</h1>
|
||||
|
||||
[![license](https://img.shields.io/github/license/pure-admin/vue-pure-admin.svg)](LICENSE)
|
||||
|
||||
## 介绍
|
||||
|
||||
精简版是基于 [vue-pure-admin](https://github.com/pure-admin/vue-pure-admin)
|
||||
提炼出的架子,包含主体功能,更适合实际项目开发,打包后的大小在全局引入 [element-plus](https://element-plus.org)
|
||||
的情况下仍然低于 `2.3MB`,并且会永久同步完整版的代码。开启 `brotli` 压缩和 `cdn` 替换本地库模式后,打包大小低于 `350kb`
|
||||
|
||||
在之前作者基础上添加了适合自己开发的相关内容
|
||||
|
||||
## 维护者
|
||||
|
||||
[Bunny](https://gitee.com/BunnyBoss/bunny-admin-element-thin)
|
||||
|
||||
## 许可证
|
||||
|
||||
[MIT © 2020-present, pure-admin](./LICENSE)
|
|
@ -0,0 +1,52 @@
|
|||
import { pathResolve } from "./utils";
|
||||
import type { BuildOptions } from "vite";
|
||||
|
||||
export const buildEnvironment = () => {
|
||||
const environment: BuildOptions = {
|
||||
target: "es2015",
|
||||
assetsInlineLimit: 20000,
|
||||
// 构建输出的目录,默认值为"dist"
|
||||
outDir: "dist",
|
||||
// 用于指定使用的代码压缩工具。在这里,minify 被设置为 'terser',表示使用 Terser 进行代码压缩。默认值terser
|
||||
// esbuild 打包更快,但是不能去除 console.log,terser打包慢,但能去除 console.log
|
||||
minify: "terser",
|
||||
// 用于配置 Terser 的选项
|
||||
terserOptions: {
|
||||
// 用于配置压缩选项
|
||||
compress: {
|
||||
drop_console: true, // 是否删除代码中的 console 语句, 默认值false
|
||||
drop_debugger: true // 是否删除代码中的 debugger 语句, 默认值false
|
||||
}
|
||||
},
|
||||
// 禁用 gzip 压缩大小报告,可略微减少打包时间
|
||||
reportCompressedSize: false,
|
||||
// 用于指定是否生成源映射文件。源映射文件可以帮助调试和定位源代码中的错误。当设置为false时,构建过程不会生成源映射文件
|
||||
sourcemap: false,
|
||||
// 用于配置 CommonJS 模块的选项
|
||||
commonjsOptions: {
|
||||
// 用于指定是否忽略 CommonJS 模块中的 try-catch 语句。当设置为false时,构建过程会保留 CommonJS 模块中的 try-catch 语句
|
||||
ignoreTryCatch: false
|
||||
},
|
||||
// 规定触发警告的 chunk 大小, 当某个代码分块的大小超过该限制时,Vite 会发出警告
|
||||
chunkSizeWarningLimit: 2000,
|
||||
rollupOptions: {
|
||||
input: {
|
||||
index: pathResolve("../index.html", import.meta.url)
|
||||
},
|
||||
// 静态资源分类打包
|
||||
output: {
|
||||
chunkFileNames: "static/js/[name]-[hash].js",
|
||||
entryFileNames: "static/js/[name]-[hash].js",
|
||||
assetFileNames: "static/[ext]/[name]-[hash].[ext]",
|
||||
manualChunks: id => {
|
||||
// 如果是包含在包中则打包成 vendor
|
||||
if (id.includes("node_modules")) {
|
||||
return "vendor";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return environment;
|
||||
};
|
|
@ -0,0 +1,60 @@
|
|||
import { Plugin as importToCDN } from "vite-plugin-cdn-import";
|
||||
|
||||
/**
|
||||
* @description 打包时采用`cdn`模式,仅限外网使用(默认不采用,如果需要采用cdn模式,请在 .env.production 文件,将 VITE_CDN 设置成true)
|
||||
* 平台采用国内cdn:https://www.bootcdn.cn,当然你也可以选择 https://unpkg.com 或者 https://www.jsdelivr.com
|
||||
* 注意:上面提到的仅限外网使用也不是完全肯定的,如果你们公司内网部署的有相关js、css文件,也可以将下面配置对应改一下,整一套内网版cdn
|
||||
*/
|
||||
export const cdn = importToCDN({
|
||||
//(prodUrl解释: name: 对应下面modules的name,version: 自动读取本地package.json中dependencies依赖中对应包的版本号,path: 对应下面modules的path,当然也可写完整路径,会替换prodUrl)
|
||||
prodUrl: "https://cdn.bootcdn.net/ajax/libs/{name}/{version}/{path}",
|
||||
modules: [
|
||||
{
|
||||
name: "vue",
|
||||
var: "Vue",
|
||||
path: "vue.global.prod.min.js"
|
||||
},
|
||||
{
|
||||
name: "vue-router",
|
||||
var: "VueRouter",
|
||||
path: "vue-router.global.min.js"
|
||||
},
|
||||
{
|
||||
name: "vue-i18n",
|
||||
var: "VueI18n",
|
||||
path: "vue-i18n.runtime.global.prod.min.js"
|
||||
},
|
||||
// 项目中没有直接安装vue-demi,但是pinia用到了,所以需要在引入pinia前引入vue-demi(https://github.com/vuejs/pinia/blob/v2/packages/pinia/package.json#L77)
|
||||
{
|
||||
name: "vue-demi",
|
||||
var: "VueDemi",
|
||||
path: "index.iife.min.js"
|
||||
},
|
||||
{
|
||||
name: "pinia",
|
||||
var: "Pinia",
|
||||
path: "pinia.iife.min.js"
|
||||
},
|
||||
{
|
||||
name: "element-plus",
|
||||
var: "ElementPlus",
|
||||
path: "index.full.min.js",
|
||||
css: "index.min.css"
|
||||
},
|
||||
{
|
||||
name: "axios",
|
||||
var: "axios",
|
||||
path: "axios.min.js"
|
||||
},
|
||||
{
|
||||
name: "dayjs",
|
||||
var: "dayjs",
|
||||
path: "dayjs.min.js"
|
||||
},
|
||||
{
|
||||
name: "echarts",
|
||||
var: "echarts",
|
||||
path: "echarts.min.js"
|
||||
}
|
||||
]
|
||||
});
|
|
@ -0,0 +1,63 @@
|
|||
import type { Plugin } from "vite";
|
||||
import { isArray } from "@pureadmin/utils";
|
||||
import compressPlugin from "vite-plugin-compression";
|
||||
|
||||
export const configCompressPlugin = (
|
||||
compress: ViteCompression
|
||||
): Plugin | Plugin[] => {
|
||||
if (compress === "none") return null;
|
||||
|
||||
const gz = {
|
||||
// 生成的压缩包后缀
|
||||
ext: ".gz",
|
||||
// 体积大于threshold才会被压缩
|
||||
threshold: 0,
|
||||
// 默认压缩.js|mjs|json|css|html后缀文件,设置成true,压缩全部文件
|
||||
filter: () => true,
|
||||
// 压缩后是否删除原始文件
|
||||
deleteOriginFile: false
|
||||
};
|
||||
const br = {
|
||||
ext: ".br",
|
||||
algorithm: "brotliCompress",
|
||||
threshold: 0,
|
||||
filter: () => true,
|
||||
deleteOriginFile: false
|
||||
};
|
||||
|
||||
const codeList = [
|
||||
{ k: "gzip", v: gz },
|
||||
{ k: "brotli", v: br },
|
||||
{ k: "both", v: [gz, br] }
|
||||
];
|
||||
|
||||
const plugins: Plugin[] = [];
|
||||
|
||||
codeList.forEach(item => {
|
||||
if (compress.includes(item.k)) {
|
||||
if (compress.includes("clear")) {
|
||||
if (isArray(item.v)) {
|
||||
item.v.forEach(vItem => {
|
||||
plugins.push(
|
||||
compressPlugin(Object.assign(vItem, { deleteOriginFile: true }))
|
||||
);
|
||||
});
|
||||
} else {
|
||||
plugins.push(
|
||||
compressPlugin(Object.assign(item.v, { deleteOriginFile: true }))
|
||||
);
|
||||
}
|
||||
} else {
|
||||
if (isArray(item.v)) {
|
||||
item.v.forEach(vItem => {
|
||||
plugins.push(compressPlugin(vItem));
|
||||
});
|
||||
} else {
|
||||
plugins.push(compressPlugin(item.v));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return plugins;
|
||||
};
|
|
@ -0,0 +1,62 @@
|
|||
import type { Plugin } from "vite";
|
||||
import { getPackageSize } from "./utils";
|
||||
import dayjs, { type Dayjs } from "dayjs";
|
||||
import duration from "dayjs/plugin/duration";
|
||||
import gradientString from "gradient-string";
|
||||
import boxen, { type Options as BoxenOptions } from "boxen";
|
||||
|
||||
dayjs.extend(duration);
|
||||
|
||||
const welcomeMessage = (VITE_PORT: number) => {
|
||||
return gradientString("cyan", "magenta").multiline(
|
||||
`您好! 欢迎使用 bunny 系列开发模板
|
||||
项目访问地址如下:
|
||||
http://localhost:${VITE_PORT}`
|
||||
);
|
||||
};
|
||||
|
||||
const boxenOptions: BoxenOptions = {
|
||||
padding: 0.5,
|
||||
borderColor: "cyan",
|
||||
borderStyle: "round"
|
||||
};
|
||||
|
||||
export function viteBuildInfo(VITE_PORT: number): Plugin {
|
||||
let config: { command: string };
|
||||
let startTime: Dayjs;
|
||||
let endTime: Dayjs;
|
||||
let outDir: string;
|
||||
return {
|
||||
name: "vite:buildInfo",
|
||||
configResolved(resolvedConfig) {
|
||||
config = resolvedConfig;
|
||||
outDir = resolvedConfig.build?.outDir ?? "dist";
|
||||
},
|
||||
buildStart() {
|
||||
console.log(boxen(welcomeMessage(VITE_PORT), boxenOptions));
|
||||
if (config.command === "build") {
|
||||
startTime = dayjs(new Date());
|
||||
}
|
||||
},
|
||||
closeBundle() {
|
||||
if (config.command === "build") {
|
||||
endTime = dayjs(new Date());
|
||||
getPackageSize({
|
||||
folder: outDir,
|
||||
callback: (size: string) => {
|
||||
console.log(
|
||||
boxen(
|
||||
gradientString("cyan", "magenta").multiline(
|
||||
`🎉 恭喜打包完成(总用时${dayjs
|
||||
.duration(endTime.diff(startTime))
|
||||
.format("mm分ss秒")},打包后的大小为${size})`
|
||||
),
|
||||
boxenOptions
|
||||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
|
@ -0,0 +1,34 @@
|
|||
/**
|
||||
* 此文件作用于 `vite.config.ts` 的 `optimizeDeps.include` 依赖预构建配置项
|
||||
* 依赖预构建,`vite` 启动时会将下面 include 里的模块,编译成 esm 格式并缓存到 node_modules/.vite 文件夹,页面加载到对应模块时如果浏览器有缓存就读取浏览器缓存,如果没有会读取本地缓存并按需加载
|
||||
* 尤其当您禁用浏览器缓存时(这种情况只应该发生在调试阶段)必须将对应模块加入到 include里,否则会遇到开发环境切换页面卡顿的问题(vite 会认为它是一个新的依赖包会重新加载并强制刷新页面),因为它既无法使用浏览器缓存,又没有在本地 node_modules/.vite 里缓存
|
||||
* 温馨提示:如果您使用的第三方库是全局引入,也就是引入到 src/main.ts 文件里,就不需要再添加到 include 里了,因为 vite 会自动将它们缓存到 node_modules/.vite
|
||||
*/
|
||||
const include = [
|
||||
"qs",
|
||||
"mitt",
|
||||
"dayjs",
|
||||
"axios",
|
||||
"pinia",
|
||||
"vue-i18n",
|
||||
"vue-types",
|
||||
"js-cookie",
|
||||
"vue-tippy",
|
||||
"pinyin-pro",
|
||||
"sortablejs",
|
||||
"@vueuse/core",
|
||||
"@pureadmin/utils",
|
||||
"responsive-storage"
|
||||
];
|
||||
|
||||
/**
|
||||
* 在预构建中强制排除的依赖项
|
||||
* 温馨提示:所有以 `@iconify-icons/` 开头引入的的本地图标模块,都应该加入到下面的 `exclude` 里,因为平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入,不需要预构建,直接让浏览器加载就好
|
||||
*/
|
||||
const exclude = [
|
||||
"@iconify-icons/ep",
|
||||
"@iconify-icons/ri",
|
||||
"@pureadmin/theme/dist/browser-utils"
|
||||
];
|
||||
|
||||
export { include, exclude };
|
|
@ -0,0 +1,66 @@
|
|||
import { cdn } from "./cdn";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import { pathResolve } from "./utils";
|
||||
import { viteBuildInfo } from "./info";
|
||||
import svgLoader from "vite-svg-loader";
|
||||
import type { PluginOption } from "vite";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
import Inspector from "vite-plugin-vue-inspector";
|
||||
import { configCompressPlugin } from "./compress";
|
||||
import removeNoMatch from "vite-plugin-router-warn";
|
||||
import { visualizer } from "rollup-plugin-visualizer";
|
||||
import removeConsole from "vite-plugin-remove-console";
|
||||
import { themePreprocessorPlugin } from "@pureadmin/theme";
|
||||
import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
|
||||
import { genScssMultipleScopeVars } from "../src/layout/theme";
|
||||
import { vitePluginFakeServer } from "vite-plugin-fake-server";
|
||||
|
||||
export function getPluginsList(
|
||||
VITE_CDN: boolean,
|
||||
VITE_COMPRESSION: ViteCompression,
|
||||
VITE_PORT: number
|
||||
): PluginOption[] {
|
||||
const lifecycle = process.env.npm_lifecycle_event;
|
||||
return [
|
||||
vue(),
|
||||
// jsx、tsx语法支持
|
||||
vueJsx(),
|
||||
VueI18nPlugin({
|
||||
jitCompilation: false,
|
||||
include: [pathResolve("../locales/**")]
|
||||
}),
|
||||
// 按下Command(⌘)+Shift(⇧),然后点击页面元素会自动打开本地IDE并跳转到对应的代码位置
|
||||
Inspector(),
|
||||
viteBuildInfo(VITE_PORT),
|
||||
/**
|
||||
* 开发环境下移除非必要的vue-router动态路由警告No match found for location with path
|
||||
* 非必要具体看 https://github.com/vuejs/router/issues/521 和 https://github.com/vuejs/router/issues/359
|
||||
* vite-plugin-router-warn只在开发环境下启用,只处理vue-router文件并且只在服务启动或重启时运行一次,性能消耗可忽略不计
|
||||
*/
|
||||
removeNoMatch(),
|
||||
// mock支持
|
||||
vitePluginFakeServer({
|
||||
logger: false,
|
||||
include: "mock",
|
||||
infixName: false,
|
||||
enableProd: true
|
||||
}),
|
||||
// 自定义主题
|
||||
themePreprocessorPlugin({
|
||||
scss: {
|
||||
multipleScopeVars: genScssMultipleScopeVars(),
|
||||
extract: true
|
||||
}
|
||||
}),
|
||||
// svg组件化支持
|
||||
svgLoader(),
|
||||
VITE_CDN ? cdn : null,
|
||||
configCompressPlugin(VITE_COMPRESSION),
|
||||
// 线上环境删除console
|
||||
removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
|
||||
// 打包分析
|
||||
lifecycle === "report"
|
||||
? visualizer({ open: true, brotliSize: true, filename: "report.html" })
|
||||
: (null as any)
|
||||
];
|
||||
}
|
|
@ -0,0 +1,31 @@
|
|||
import { loadEnv, type ServerOptions } from "vite";
|
||||
import { root, wrapperEnv } from "./utils";
|
||||
|
||||
export const serverOptions = (mode: string) => {
|
||||
const { VITE_PORT, VITE_APP_URL } = wrapperEnv(loadEnv(mode, root));
|
||||
|
||||
const options: ServerOptions = {
|
||||
port: VITE_PORT, // ? 端口号
|
||||
host: "0.0.0.0",
|
||||
open: true,
|
||||
cors: true,
|
||||
proxy: {
|
||||
"/api": {
|
||||
target: VITE_APP_URL,
|
||||
changeOrigin: true,
|
||||
rewrite: (path: string) => path.replace(/^\/api/, "/api")
|
||||
},
|
||||
"/mock": {
|
||||
target: VITE_APP_URL,
|
||||
changeOrigin: true,
|
||||
rewrite: (path: string) => path.replace(/^\/mock/, "/mock")
|
||||
}
|
||||
},
|
||||
// 预热文件以提前转换和缓存结果,降低启动期间的初始页面加载时长并防止转换瀑布
|
||||
warmup: {
|
||||
clientFiles: ["./index.html", "./src/{views,components}/*"]
|
||||
}
|
||||
};
|
||||
|
||||
return options;
|
||||
};
|
|
@ -0,0 +1,111 @@
|
|||
import dayjs from "dayjs";
|
||||
import { readdir, stat } from "node:fs";
|
||||
import { fileURLToPath } from "node:url";
|
||||
import { dirname, resolve } from "node:path";
|
||||
import { formatBytes, sum } from "@pureadmin/utils";
|
||||
import {
|
||||
dependencies,
|
||||
devDependencies,
|
||||
engines,
|
||||
name,
|
||||
version
|
||||
} from "../package.json";
|
||||
|
||||
/** 启动`node`进程时所在工作目录的绝对路径 */
|
||||
const root: string = process.cwd();
|
||||
|
||||
/**
|
||||
* @description 根据可选的路径片段生成一个新的绝对路径
|
||||
* @param dir 路径片段,默认`build`
|
||||
* @param metaUrl 模块的完整`url`,如果在`build`目录外调用必传`import.meta.url`
|
||||
*/
|
||||
const pathResolve = (dir = ".", metaUrl = import.meta.url) => {
|
||||
// 当前文件目录的绝对路径
|
||||
const currentFileDir = dirname(fileURLToPath(metaUrl));
|
||||
// build 目录的绝对路径
|
||||
const buildDir = resolve(currentFileDir, "build");
|
||||
// 解析的绝对路径
|
||||
const resolvedPath = resolve(currentFileDir, dir);
|
||||
// 检查解析的绝对路径是否在 build 目录内
|
||||
if (resolvedPath.startsWith(buildDir)) {
|
||||
// 在 build 目录内,返回当前文件路径
|
||||
return fileURLToPath(metaUrl);
|
||||
}
|
||||
// 不在 build 目录内,返回解析后的绝对路径
|
||||
return resolvedPath;
|
||||
};
|
||||
|
||||
/** 设置别名 */
|
||||
const alias: Record<string, string> = {
|
||||
"@": pathResolve("../src"),
|
||||
"@build": pathResolve()
|
||||
};
|
||||
|
||||
/** 平台的名称、版本、运行所需的`node`和`pnpm`版本、依赖、最后构建时间的类型提示 */
|
||||
const __APP_INFO__ = {
|
||||
pkg: { name, version, engines, dependencies, devDependencies },
|
||||
lastBuildTime: dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss")
|
||||
};
|
||||
|
||||
/** 处理环境变量 */
|
||||
const wrapperEnv = (envConf: Recordable): ViteEnv => {
|
||||
// 默认值
|
||||
const ret: ViteEnv = {
|
||||
VITE_PORT: 8848,
|
||||
VITE_PUBLIC_PATH: "",
|
||||
VITE_ROUTER_HISTORY: "",
|
||||
VITE_APP_URL: "",
|
||||
VITE_CDN: false,
|
||||
VITE_HIDE_HOME: "false",
|
||||
VITE_COMPRESSION: "none"
|
||||
};
|
||||
|
||||
for (const envName of Object.keys(envConf)) {
|
||||
let realName = envConf[envName].replace(/\\n/g, "\n");
|
||||
realName =
|
||||
realName === "true" ? true : realName === "false" ? false : realName;
|
||||
|
||||
if (envName === "VITE_PORT") {
|
||||
realName = Number(realName);
|
||||
}
|
||||
ret[envName] = realName;
|
||||
if (typeof realName === "string") {
|
||||
process.env[envName] = realName;
|
||||
} else if (typeof realName === "object") {
|
||||
process.env[envName] = JSON.stringify(realName);
|
||||
}
|
||||
}
|
||||
return ret;
|
||||
};
|
||||
|
||||
const fileListTotal: number[] = [];
|
||||
|
||||
/** 获取指定文件夹中所有文件的总大小 */
|
||||
const getPackageSize = options => {
|
||||
const { folder = "dist", callback, format = true } = options;
|
||||
readdir(folder, (err, files: string[]) => {
|
||||
if (err) throw err;
|
||||
let count = 0;
|
||||
const checkEnd = () => {
|
||||
++count == files.length &&
|
||||
callback(format ? formatBytes(sum(fileListTotal)) : sum(fileListTotal));
|
||||
};
|
||||
files.forEach((item: string) => {
|
||||
stat(`${folder}/${item}`, async (err, stats) => {
|
||||
if (err) throw err;
|
||||
if (stats.isFile()) {
|
||||
fileListTotal.push(stats.size);
|
||||
checkEnd();
|
||||
} else if (stats.isDirectory()) {
|
||||
getPackageSize({
|
||||
folder: `${folder}/${item}/`,
|
||||
callback: checkEnd
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
files.length === 0 && callback(0);
|
||||
});
|
||||
};
|
||||
|
||||
export { root, pathResolve, alias, __APP_INFO__, wrapperEnv, getPackageSize };
|
|
@ -0,0 +1,122 @@
|
|||
// @see: https://cz-git.qbenben.com/zh/guide
|
||||
/** @type {import("cz-git").UserConfig} */
|
||||
|
||||
export default {
|
||||
ignores: [commit => commit === "init"],
|
||||
extends: ["@commitlint/config-conventional"],
|
||||
rules: {
|
||||
// @see: https://commitlint.js.org/#/reference-rules
|
||||
"body-leading-blank": [2, "always"],
|
||||
"footer-leading-blank": [1, "always"],
|
||||
"header-max-length": [2, "always", 108],
|
||||
"subject-empty": [2, "never"],
|
||||
"type-empty": [2, "never"],
|
||||
"subject-case": [0],
|
||||
"type-enum": [
|
||||
2,
|
||||
"always",
|
||||
[
|
||||
"init",
|
||||
"feat",
|
||||
"page",
|
||||
"media",
|
||||
"completepage",
|
||||
"fix",
|
||||
"fixbug",
|
||||
"docs",
|
||||
"style",
|
||||
"refactor",
|
||||
"perf",
|
||||
"test",
|
||||
"build",
|
||||
"ci",
|
||||
"chore",
|
||||
"revert",
|
||||
"wip",
|
||||
"workflow",
|
||||
"types",
|
||||
"release",
|
||||
"optimize"
|
||||
]
|
||||
]
|
||||
},
|
||||
prompt: {
|
||||
messages: {
|
||||
type: "选择你要提交的类型 :",
|
||||
scope: "选择一个提交范围(可选):",
|
||||
customScope: "请输入自定义的提交范围 :",
|
||||
subject: "填写简短精炼的变更描述 :\n",
|
||||
body: '填写更加详细的变更描述(可选)。使用 "|" 换行 :\n',
|
||||
breaking: '列举非兼容性重大的变更(可选)。使用 "|" 换行 :\n',
|
||||
footerPrefixsSelect: "选择关联issue前缀(可选):",
|
||||
customFooterPrefixs: "输入自定义issue前缀 :",
|
||||
footer: "列举关联issue (可选) 例如: #31, #I3244 :\n",
|
||||
confirmCommit: "是否提交或修改commit ?"
|
||||
},
|
||||
types: [
|
||||
{ value: "init", name: "初始化: ⏳ 初始化项目", emoji: "⏳" },
|
||||
{ value: "optimize", name: "优化代码: ♻️ 优化项目代码", emoji: "♻️" },
|
||||
{ value: "feat", name: "新增: 🚀 新增功能", emoji: "🚀" },
|
||||
{ value: "media", name: "媒体: 🎁 新增媒体资源", emoji: "🎁" },
|
||||
{ value: "page", name: "页面: 📄 新增页面", emoji: "📄" },
|
||||
{ value: "completepage", name: "完成页面: 🍻 完成页面", emoji: "🍻" },
|
||||
{ value: "fixbug", name: "bug: 🐛 修改bug", emoji: "🐛" },
|
||||
{ value: "fix", name: "修复: 🧩 修复缺陷", emoji: "🧩" },
|
||||
{ value: "docs", name: "文档: 📚 文档变更", emoji: "📚" },
|
||||
{
|
||||
value: "style",
|
||||
name: "格式: 🎨 代码格式(不影响功能,例如空格、分号等格式修正)",
|
||||
emoji: "🎨"
|
||||
},
|
||||
{
|
||||
value: "refactor",
|
||||
name: "重构: 〽️ 代码重构(不包括 bug 修复、功能新增)",
|
||||
emoji: "〽️"
|
||||
},
|
||||
{ value: "perf", name: "性能: ⚡️ 性能优化", emoji: "⚡️" },
|
||||
{
|
||||
value: "test",
|
||||
name: "测试: ✅ 添加疏漏测试或已有测试改动",
|
||||
emoji: "✅"
|
||||
},
|
||||
{
|
||||
value: "chore",
|
||||
name: "构建: 📦️ 构建流程、外部依赖变更(如升级 npm 包、修改 webpack 配置等)",
|
||||
emoji: "📦️"
|
||||
},
|
||||
{ value: "ci", name: "集成: 🎡 修改 CI 配置、脚本", emoji: "🎡" },
|
||||
{ value: "revert", name: "回退: ⏪️ 回滚 commit", emoji: "⏪️" },
|
||||
{ value: "build", name: "打包: 🔨 项目打包发布", emoji: "🔨" }
|
||||
],
|
||||
useEmoji: true,
|
||||
themeColorCode: "",
|
||||
scopes: [],
|
||||
allowCustomScopes: true,
|
||||
allowEmptyScopes: true,
|
||||
customScopesAlign: "bottom",
|
||||
customScopesAlias: "custom",
|
||||
emptyScopesAlias: "empty",
|
||||
upperCaseSubject: false,
|
||||
allowBreakingChanges: ["feat", "fix"],
|
||||
breaklineNumber: 100,
|
||||
breaklineChar: "|",
|
||||
skipQuestions: [],
|
||||
issuePrefixs: [
|
||||
{ value: "closed", name: "closed: ISSUES has been processed" }
|
||||
],
|
||||
customIssuePrefixsAlign: "top",
|
||||
emptyIssuePrefixsAlias: "skip",
|
||||
customIssuePrefixsAlias: "custom",
|
||||
allowCustomIssuePrefixs: true,
|
||||
allowEmptyIssuePrefixs: true,
|
||||
confirmColorize: true,
|
||||
maxHeaderLength: Infinity,
|
||||
maxSubjectLength: Infinity,
|
||||
minSubjectLength: 0,
|
||||
scopeOverrides: undefined,
|
||||
defaultBody: "",
|
||||
defaultIssues: "",
|
||||
defaultScope: "",
|
||||
defaultSubject: ""
|
||||
}
|
||||
};
|
|
@ -0,0 +1,27 @@
|
|||
# 使用官方的 Nginx 镜像作为基础镜像
|
||||
FROM nginx
|
||||
|
||||
# 删除默认的 Nginx 配置文件
|
||||
RUN rm /etc/nginx/conf.d/default.conf
|
||||
|
||||
# 将自定义的 Nginx 配置文件复制到容器中
|
||||
COPY nginx.conf /etc/nginx/conf.d/
|
||||
|
||||
# 设置时区,构建镜像时执行的命令
|
||||
RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime
|
||||
RUN echo "Asia/Shanghai" > /etc/timezone
|
||||
|
||||
# 创建一个目录来存放前端项目文件
|
||||
WORKDIR /usr/share/nginx/html
|
||||
|
||||
# 将前端项目打包文件复制到 Nginx 的默认静态文件目录
|
||||
COPY dist/ /usr/share/nginx/html
|
||||
# 复制到nginx目录下
|
||||
COPY dist/ /etc/nginx/html
|
||||
|
||||
# 暴露 Nginx 的默认端口
|
||||
EXPOSE 80
|
||||
|
||||
# 自动启动 Nginx
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
map $http_upgrade $connection_upgrade {
|
||||
default upgrade;
|
||||
'' close;
|
||||
}
|
||||
|
||||
server {
|
||||
listen 80;
|
||||
listen [::]:80;
|
||||
server_name localhost;
|
||||
|
||||
location / {
|
||||
root /etc/nginx/html;
|
||||
index index.html index.htm;
|
||||
try_files $uri /index.html;
|
||||
}
|
||||
|
||||
# 后端跨域请求
|
||||
location ~/api/ {
|
||||
proxy_pass http://192.168.3.98:8200;
|
||||
}
|
||||
|
||||
# 配置WebSocket
|
||||
location ~/ws/ {
|
||||
# WebSocket 代理配置
|
||||
proxy_pass http://192.168.3.98:8200; # WebSocket 服务器地址和端口
|
||||
proxy_http_version 1.1; # 使用 HTTP 1.1 版本
|
||||
proxy_set_header Upgrade $http_upgrade;
|
||||
proxy_set_header Connection $connection_upgrade;
|
||||
proxy_read_timeout 600s; # 保持连接的超时时间,根据需要调整
|
||||
proxy_redirect off; # 关闭重定向
|
||||
}
|
||||
|
||||
# mock 跨域
|
||||
location ~/mock/ {
|
||||
proxy_pass http://192.168.3.98:8200;
|
||||
}
|
||||
|
||||
error_page 404 404.html;
|
||||
|
||||
location = /50x.html {
|
||||
root html;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,181 @@
|
|||
import js from "@eslint/js";
|
||||
import pluginVue from "eslint-plugin-vue";
|
||||
import * as parserVue from "vue-eslint-parser";
|
||||
import configPrettier from "eslint-config-prettier";
|
||||
import pluginPrettier from "eslint-plugin-prettier";
|
||||
import { defineFlatConfig } from "eslint-define-config";
|
||||
import * as parserTypeScript from "@typescript-eslint/parser";
|
||||
import pluginTypeScript from "@typescript-eslint/eslint-plugin";
|
||||
|
||||
export default defineFlatConfig([
|
||||
{
|
||||
...js.configs.recommended,
|
||||
ignores: [
|
||||
"**/.*",
|
||||
"dist/*",
|
||||
"*.d.ts",
|
||||
"public/*",
|
||||
"src/assets/**",
|
||||
"src/**/iconfont/**"
|
||||
],
|
||||
languageOptions: {
|
||||
globals: {
|
||||
// index.d.ts
|
||||
RefType: "readonly",
|
||||
EmitType: "readonly",
|
||||
TargetContext: "readonly",
|
||||
ComponentRef: "readonly",
|
||||
ElRef: "readonly",
|
||||
ForDataType: "readonly",
|
||||
AnyFunction: "readonly",
|
||||
PropType: "readonly",
|
||||
Writable: "readonly",
|
||||
Nullable: "readonly",
|
||||
NonNullable: "readonly",
|
||||
Recordable: "readonly",
|
||||
ReadonlyRecordable: "readonly",
|
||||
Indexable: "readonly",
|
||||
DeepPartial: "readonly",
|
||||
Without: "readonly",
|
||||
Exclusive: "readonly",
|
||||
TimeoutHandle: "readonly",
|
||||
IntervalHandle: "readonly",
|
||||
Effect: "readonly",
|
||||
ChangeEvent: "readonly",
|
||||
WheelEvent: "readonly",
|
||||
ImportMetaEnv: "readonly",
|
||||
Fn: "readonly",
|
||||
PromiseFn: "readonly",
|
||||
ComponentElRef: "readonly",
|
||||
parseInt: "readonly",
|
||||
parseFloat: "readonly"
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
prettier: pluginPrettier
|
||||
},
|
||||
rules: {
|
||||
...configPrettier.rules,
|
||||
...pluginPrettier.configs.recommended.rules,
|
||||
"no-debugger": "off",
|
||||
"no-unused-vars": [
|
||||
"error",
|
||||
{
|
||||
argsIgnorePattern: "^_",
|
||||
varsIgnorePattern: "^_"
|
||||
}
|
||||
],
|
||||
"prettier/prettier": [
|
||||
"error",
|
||||
{
|
||||
endOfLine: "auto"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
files: ["**/*.?([cm])ts", "**/*.?([cm])tsx"],
|
||||
languageOptions: {
|
||||
parser: parserTypeScript,
|
||||
parserOptions: {
|
||||
sourceType: "module"
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
"@typescript-eslint": pluginTypeScript
|
||||
},
|
||||
rules: {
|
||||
...pluginTypeScript.configs.strict.rules,
|
||||
"@typescript-eslint/ban-types": "off",
|
||||
"@typescript-eslint/no-redeclare": "error",
|
||||
"@typescript-eslint/ban-ts-comment": "off",
|
||||
"@typescript-eslint/no-explicit-any": "off",
|
||||
"@typescript-eslint/prefer-as-const": "warn",
|
||||
"@typescript-eslint/no-empty-function": "off",
|
||||
"@typescript-eslint/no-non-null-assertion": "off",
|
||||
"@typescript-eslint/no-import-type-side-effects": "error",
|
||||
"@typescript-eslint/explicit-module-boundary-types": "off",
|
||||
"@typescript-eslint/consistent-type-imports": [
|
||||
"error",
|
||||
{ disallowTypeAnnotations: false, fixStyle: "inline-type-imports" }
|
||||
],
|
||||
"@typescript-eslint/prefer-literal-enum-member": [
|
||||
"error",
|
||||
{ allowBitwiseExpressions: true }
|
||||
],
|
||||
"@typescript-eslint/no-unused-vars": [
|
||||
"error",
|
||||
{
|
||||
argsIgnorePattern: "^_",
|
||||
varsIgnorePattern: "^_"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
files: ["**/*.d.ts"],
|
||||
rules: {
|
||||
"eslint-comments/no-unlimited-disable": "off",
|
||||
"import/no-duplicates": "off",
|
||||
"unused-imports/no-unused-vars": "off"
|
||||
}
|
||||
},
|
||||
{
|
||||
files: ["**/*.?([cm])js"],
|
||||
rules: {
|
||||
"@typescript-eslint/no-require-imports": "off",
|
||||
"@typescript-eslint/no-var-requires": "off"
|
||||
}
|
||||
},
|
||||
{
|
||||
files: ["**/*.vue"],
|
||||
languageOptions: {
|
||||
globals: {
|
||||
$: "readonly",
|
||||
$$: "readonly",
|
||||
$computed: "readonly",
|
||||
$customRef: "readonly",
|
||||
$ref: "readonly",
|
||||
$shallowRef: "readonly",
|
||||
$toRef: "readonly"
|
||||
},
|
||||
parser: parserVue,
|
||||
parserOptions: {
|
||||
ecmaFeatures: {
|
||||
jsx: true
|
||||
},
|
||||
extraFileExtensions: [".vue"],
|
||||
parser: "@typescript-eslint/parser",
|
||||
sourceType: "module"
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
vue: pluginVue
|
||||
},
|
||||
processor: pluginVue.processors[".vue"],
|
||||
rules: {
|
||||
...pluginVue.configs.base.rules,
|
||||
...pluginVue.configs["vue3-essential"].rules,
|
||||
...pluginVue.configs["vue3-recommended"].rules,
|
||||
"no-undef": "off",
|
||||
"no-unused-vars": "off",
|
||||
"vue/no-v-html": "off",
|
||||
"vue/require-default-prop": "off",
|
||||
"vue/require-explicit-emits": "off",
|
||||
"vue/multi-word-component-names": "off",
|
||||
"vue/no-setup-props-reactivity-loss": "off",
|
||||
"vue/html-self-closing": [
|
||||
"error",
|
||||
{
|
||||
html: {
|
||||
void: "always",
|
||||
normal: "always",
|
||||
component: "always"
|
||||
},
|
||||
svg: "always",
|
||||
math: "always"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]);
|
|
@ -0,0 +1,87 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<meta name="renderer" content="webkit" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
|
||||
/>
|
||||
<title>pure-admin-thin</title>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<script>
|
||||
window.process = {};
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<style>
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.loader,
|
||||
.loader::before,
|
||||
.loader::after {
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
border-radius: 50%;
|
||||
animation: load-animation 1.8s infinite ease-in-out;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
.loader {
|
||||
position: relative;
|
||||
top: 0;
|
||||
margin: 80px auto;
|
||||
font-size: 10px;
|
||||
color: #406eeb;
|
||||
text-indent: -9999em;
|
||||
transform: translateZ(0);
|
||||
transform: translate(-50%, 0);
|
||||
animation-delay: -0.16s;
|
||||
}
|
||||
|
||||
.loader::before,
|
||||
.loader::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.loader::before {
|
||||
left: -3.5em;
|
||||
animation-delay: -0.32s;
|
||||
}
|
||||
|
||||
.loader::after {
|
||||
left: 3.5em;
|
||||
}
|
||||
|
||||
@keyframes load-animation {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
box-shadow: 0 2.5em 0 -1.3em;
|
||||
}
|
||||
|
||||
40% {
|
||||
box-shadow: 0 2.5em 0 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div class="loader"></div>
|
||||
</div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,10 @@
|
|||
export default {
|
||||
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
|
||||
"{!(package)*.json,*.code-snippets,.!(browserslist)*rc}": [
|
||||
"prettier --write--parser json"
|
||||
],
|
||||
"package.json": ["prettier --write"],
|
||||
"*.vue": ["eslint --fix", "prettier --write", "stylelint --fix"],
|
||||
"*.{scss,less,styl,html}": ["stylelint --fix", "prettier --write"],
|
||||
"*.md": ["prettier --write"]
|
||||
};
|
|
@ -0,0 +1,61 @@
|
|||
// 模拟后端动态生成路由
|
||||
import { defineFakeRoute } from "vite-plugin-fake-server/client";
|
||||
|
||||
/**
|
||||
* roles:页面级别权限,这里模拟二种 "admin"、"common"
|
||||
* admin:管理员角色
|
||||
* common:普通角色
|
||||
*/
|
||||
const permissionRouter = {
|
||||
path: "/permission",
|
||||
meta: {
|
||||
title: "menus.purePermission",
|
||||
icon: "ep:lollipop",
|
||||
rank: 10
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: "/permission/page/index",
|
||||
name: "PermissionPage",
|
||||
meta: {
|
||||
title: "menus.purePermissionPage",
|
||||
roles: ["admin", "common"]
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/permission/button/router",
|
||||
component: "permission/button/index",
|
||||
name: "PermissionButtonRouter",
|
||||
meta: {
|
||||
title: "menus.purePermissionButtonRouter",
|
||||
auths: [
|
||||
"permission:btn:add",
|
||||
"permission:btn:edit",
|
||||
"permission:btn:delete"
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/permission/button/login",
|
||||
component: "permission/button/perms",
|
||||
name: "PermissionButtonLogin",
|
||||
meta: {
|
||||
title: "menus.purePermissionButtonLogin"
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// 获取系统路由
|
||||
export default defineFakeRoute([
|
||||
{
|
||||
url: "/mock/get-async-routes",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
success: true,
|
||||
data: [permissionRouter]
|
||||
};
|
||||
}
|
||||
}
|
||||
]);
|
|
@ -0,0 +1,16 @@
|
|||
import { defineFakeRoute } from "vite-plugin-fake-server/client";
|
||||
import en from "./i18n/en";
|
||||
import zh from "./i18n/zh";
|
||||
|
||||
export default defineFakeRoute([
|
||||
{
|
||||
url: "/mock/getI18n",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: { zh, en, local: "zh" }
|
||||
};
|
||||
}
|
||||
}
|
||||
]);
|
|
@ -0,0 +1,20 @@
|
|||
import { buttons } from "./en/buttons";
|
||||
import { search } from "./en/search";
|
||||
import { panel } from "./en/panel";
|
||||
import { menus } from "./en/menus";
|
||||
import { status } from "./en/status";
|
||||
import { login } from "./en/login";
|
||||
import { style } from "./en/style";
|
||||
import { system } from "./en/system";
|
||||
|
||||
export default {
|
||||
name: "en",
|
||||
buttons,
|
||||
search,
|
||||
panel,
|
||||
menus,
|
||||
status,
|
||||
login,
|
||||
style,
|
||||
system
|
||||
};
|
|
@ -0,0 +1,25 @@
|
|||
export const buttons = {
|
||||
openSystemSet: "Open System Configs",
|
||||
pureOpenSystemSet: "pureOpenSystemSet",
|
||||
|
||||
pureAccountSettings: "Account",
|
||||
pureLoginOut: "LoginOut",
|
||||
pureLogin: "Login",
|
||||
pureReload: "Reload",
|
||||
pureCloseCurrentTab: "Close CurrentTab",
|
||||
pureCloseLeftTabs: "Close LeftTabs",
|
||||
pureCloseRightTabs: "Close RightTabs",
|
||||
pureCloseOtherTabs: "Close OtherTabs",
|
||||
pureCloseAllTabs: "Close AllTabs",
|
||||
pureContentFullScreen: "Content FullScreen",
|
||||
pureContentExitFullScreen: "Content ExitFullScreen",
|
||||
pureClickCollapse: "Collapse",
|
||||
pureClickExpand: "Expand",
|
||||
confirm: "Confirm",
|
||||
pureSwitch: "Switch",
|
||||
close: "Close",
|
||||
pureBackTop: "BackTop",
|
||||
pureOpenText: "Open",
|
||||
pureCloseText: "Close",
|
||||
rest: "Rest"
|
||||
};
|
|
@ -0,0 +1,40 @@
|
|||
export const login = {
|
||||
loginSuccess: "Login Success",
|
||||
loginFail: "Login Fail",
|
||||
usernameRegex: "please input username",
|
||||
username: "input username",
|
||||
password: "input password",
|
||||
login: "Login",
|
||||
|
||||
email: "email",
|
||||
repeatPassword: "Sure Password",
|
||||
emailCode: "input email code",
|
||||
verifyCode: "verify code",
|
||||
emailRegex: "please input email",
|
||||
passwordRegex: "please input password",
|
||||
passwordSureRegex: "Please entr confirm password",
|
||||
passwordDifferentRegex: "The two passwords do not match!",
|
||||
emailCodeRegex: "please input email code",
|
||||
getEmailCode: "get email code",
|
||||
rememberMe: "days no need to login",
|
||||
rememberInfo:
|
||||
"After checking and logging in, will automatically log in to the system without entering your username and password within the specified number of days.",
|
||||
forgetPassword: "Forget Password?",
|
||||
getCodeInfo: "Seconds",
|
||||
getVerifyCode: "Get VerifyCode",
|
||||
definite: "definite",
|
||||
back: "back",
|
||||
passWordUpdateReg: "Password has been updated",
|
||||
pureTip: 'After scanning the code, click "Confirm" to complete the login',
|
||||
pureRegisterSuccess: "Regist Success",
|
||||
pureTickPrivacy: "Please tick Privacy Policy",
|
||||
pureReadAccept: "I have read it carefully and accept",
|
||||
purePrivacyPolicy: "Privacy Policy",
|
||||
pureVerifyCodeReg: "Please enter verify code",
|
||||
pureVerifyCodeCorrectReg: "Please enter correct verify code",
|
||||
pureVerifyCodeSixReg: "Please enter a 6-digit verify code",
|
||||
purePhoneReg: "Please enter the phone",
|
||||
purePhoneCorrectReg: "Please enter the correct phone number format",
|
||||
purePassWordRuleReg:
|
||||
"The password format should be any combination of 8-18 digits"
|
||||
};
|
|
@ -0,0 +1,120 @@
|
|||
export const menus = {
|
||||
home: "Home",
|
||||
purePermissionButtonRouter: "PermissionButtonRouter",
|
||||
purePermissionButtonLogin: "purePermissionButtonLogin",
|
||||
pureLogin: "Login",
|
||||
pureEmpty: "Empty Page",
|
||||
pureTable: "Table",
|
||||
pureSysManagement: "System Manage",
|
||||
pureUser: "User Manage",
|
||||
pureRole: "Role Manage",
|
||||
pureSystemMenu: "Menu Manage",
|
||||
pureDept: "Dept Manage",
|
||||
pureSysMonitor: "System Monitor",
|
||||
pureOnlineUser: "Online User",
|
||||
pureLoginLog: "Login Log",
|
||||
pureOperationLog: "Operation Log",
|
||||
pureSystemLog: "System Log",
|
||||
pureEditor: "Editor",
|
||||
pureAbnormal: "Abnormal Page",
|
||||
pureFourZeroFour: "404",
|
||||
pureFourZeroOne: "403",
|
||||
pureFive: "500",
|
||||
pureComponents: "Components",
|
||||
pureDialog: "Dialog",
|
||||
pureMessage: "Message Tips",
|
||||
pureVideo: "Video",
|
||||
pureSegmented: "Segmented",
|
||||
pureWaterfall: "Waterfall",
|
||||
pureMap: "Map",
|
||||
pureDraggable: "Draggable",
|
||||
pureSplitPane: "Split Pane",
|
||||
pureText: "Text Ellipsis",
|
||||
pureElButton: "Button",
|
||||
pureButton: "Button Animation",
|
||||
pureCheckButton: "Check Button",
|
||||
pureCropping: "Picture Cropping",
|
||||
pureAnimatecss: "AnimateCss Selector",
|
||||
pureCountTo: "Digital Animation",
|
||||
pureSelector: "Scope Selector",
|
||||
pureFlowChart: "Flow Chart",
|
||||
pureSeamless: "Seamless Scroll",
|
||||
pureContextmenu: "Context Menu",
|
||||
pureTypeit: "Typeit",
|
||||
pureJsonEditor: "JSON Editor",
|
||||
pureColorPicker: "Color Picker",
|
||||
pureDatePicker: "Date Picker",
|
||||
pureDateTimePicker: "DateTimePicker",
|
||||
pureTimePicker: "TimePicker",
|
||||
pureTag: "Tag",
|
||||
pureStatistic: "Statistic",
|
||||
pureCollapse: "Collapse",
|
||||
pureGanttastic: "Gantt Chart",
|
||||
pureProgress: "Progress",
|
||||
pureUpload: "File Upload",
|
||||
pureCheckCard: "CheckCard",
|
||||
pureMenus: "MultiLevel Menu",
|
||||
pureMenu1: "Menu1",
|
||||
pureMenu2: "Menu2",
|
||||
purePermission: "Permission Manage",
|
||||
purePermissionPage: "Page Permission",
|
||||
purePermissionButton: "Button Permission",
|
||||
pureTabs: "Tabs Operate",
|
||||
pureGuide: "Guide",
|
||||
pureAble: "Able",
|
||||
pureMenuTree: "Menu Tree",
|
||||
pureVideoFrame: "Video Frame Capture",
|
||||
pureWavesurfer: "Audio Visualization",
|
||||
pureRipple: "Ripple",
|
||||
pureMqtt: "Mqtt Client",
|
||||
pureOptimize: "Debounce、Throttle、Copy、Longpress Directives",
|
||||
pureVerify: "Captcha",
|
||||
pureWatermark: "Water Mark",
|
||||
purePrint: "Print",
|
||||
pureDownload: "Download",
|
||||
pureExternalPage: "External Page",
|
||||
pureExternalDoc: "Docs External",
|
||||
pureEmbeddedDoc: "Docs Embedded",
|
||||
pureExternalLink: "Vue-Pure-Admin",
|
||||
pureUtilsLink: "Pure-Admin-Utils",
|
||||
pureColorHuntDoc: "ColorHunt",
|
||||
pureUiGradients: "UiGradients",
|
||||
pureEpDoc: "Element-Plus",
|
||||
pureTailwindcssDoc: "Tailwindcss",
|
||||
pureVueDoc: "Vue3",
|
||||
pureViteDoc: "Vite",
|
||||
purePiniaDoc: "Pinia",
|
||||
pureRouterDoc: "Vue-Router",
|
||||
pureAbout: "About",
|
||||
pureResult: "Result Page",
|
||||
pureSuccess: "Success Page",
|
||||
pureFail: "Fail Page",
|
||||
pureIconSelect: "Icon Select",
|
||||
pureTimeline: "Time Line",
|
||||
pureLineTree: "LineTree",
|
||||
pureList: "List Page",
|
||||
pureCardList: "Card List Page",
|
||||
pureDebounce: "Debounce & Throttle",
|
||||
pureFormDesign: "Form Design",
|
||||
pureBarcode: "Barcode",
|
||||
pureQrcode: "Qrcode",
|
||||
pureCascader: "Area Cascader",
|
||||
pureSwiper: "Swiper Plugin",
|
||||
pureVirtualList: "Virtual List",
|
||||
purePdf: "PDF Preview",
|
||||
pureExcel: "Export Excel",
|
||||
pureInfiniteScroll: "Table Infinite Scroll",
|
||||
pureSensitive: "Sensitive Filter",
|
||||
purePinyin: "PinYin",
|
||||
pureDanmaku: "Danmaku",
|
||||
pureSchemaForm: "Form",
|
||||
pureTableBase: "Base Usage",
|
||||
pureTableHigh: "High Usage",
|
||||
pureTableEdit: "Edit Usage",
|
||||
pureVxeTable: "Virtual Usage",
|
||||
pureBoard: "Paint Board",
|
||||
pureMindMap: "Mind Map",
|
||||
pureMenuOverflow: "Menu Overflow Show Tooltip Text",
|
||||
pureChildMenuOverflow: "Child Menu Overflow Show Tooltip Text",
|
||||
systemctlTest: "Systemctl lTest"
|
||||
};
|
|
@ -0,0 +1,38 @@
|
|||
export const panel = {
|
||||
pureSystemSet: "System Configs",
|
||||
pureCloseSystemSet: "Close System Configs",
|
||||
pureClearCacheAndToLogin: "Clear cache and return to login page",
|
||||
pureClearCache: "Clear Cache",
|
||||
pureOverallStyle: "Overall Style",
|
||||
pureOverallStyleLight: "Light",
|
||||
pureOverallStyleLightTip:
|
||||
"Set sail freshly and light up the comfortable work interface",
|
||||
pureOverallStyleDark: "Dark",
|
||||
pureOverallStyleDarkTip:
|
||||
"Moonlight Overture, indulge in the tranquility and elegance of the night",
|
||||
pureOverallStyleSystem: "Auto",
|
||||
pureOverallStyleSystemTip:
|
||||
"Synchronize time, the interface naturally responds to morning and dusk",
|
||||
pureThemeColor: "Theme Color",
|
||||
pureLayoutModel: "Layout Model",
|
||||
pureVerticalTip: "The menu on the left is familiar and friendly",
|
||||
pureHorizontalTip: "Top menu, concise overview",
|
||||
pureMixTip: "Mixed menu, flexible",
|
||||
pureStretch: "Stretch Page",
|
||||
pureStretchFixed: "Fixed",
|
||||
pureStretchFixedTip:
|
||||
"Compact pages make it easy to find the information you need",
|
||||
pureStretchCustom: "Custom",
|
||||
pureStretchCustomTip: "Minimum 1280, maximum 1600",
|
||||
pureTagsStyle: "Tags Style",
|
||||
pureTagsStyleSmart: "Smart",
|
||||
pureTagsStyleSmartTip: "Smart tags add fun and brilliance",
|
||||
pureTagsStyleCard: "Card",
|
||||
pureTagsStyleCardTip: "Card tags for efficient browsing",
|
||||
pureInterfaceDisplay: "Interface Display",
|
||||
pureGreyModel: "Grey Model",
|
||||
pureWeakModel: "Weak Model",
|
||||
pureHiddenTags: "Hidden Tags",
|
||||
pureHiddenFooter: "Hidden Footer",
|
||||
pureMultiTagsCache: "MultiTags Cache"
|
||||
};
|
|
@ -0,0 +1,8 @@
|
|||
export const search = {
|
||||
pureTotal: "Total",
|
||||
pureHistory: "History",
|
||||
pureCollect: "Collect",
|
||||
pureDragSort: "(Drag Sort)",
|
||||
pureEmpty: "Empty",
|
||||
purePlaceholder: "Search Menu"
|
||||
};
|
|
@ -0,0 +1,11 @@
|
|||
export const status = {
|
||||
pureLoad: "Loading...",
|
||||
pureMessage: "Message",
|
||||
pureNotify: "Notify",
|
||||
pureTodo: "Todo",
|
||||
pureNoMessage: "No Message",
|
||||
pureNoNotify: "No Notify",
|
||||
pureNoTodo: "No Todo",
|
||||
enable: "enable",
|
||||
disable: "disable"
|
||||
};
|
|
@ -0,0 +1,5 @@
|
|||
export const style = {
|
||||
larger: "Larger",
|
||||
default: "Default",
|
||||
small: "Small"
|
||||
};
|
|
@ -0,0 +1,8 @@
|
|||
export const system = {
|
||||
carousel: "carousel setting",
|
||||
config: "system config",
|
||||
favicon: "system favicon",
|
||||
feedback: "system feedback",
|
||||
emailUsers: "email users",
|
||||
log: "system log"
|
||||
};
|
|
@ -0,0 +1,20 @@
|
|||
import { buttons } from "./zh/buttons";
|
||||
import { search } from "./zh/search";
|
||||
import { panel } from "./zh/panel";
|
||||
import { menus } from "./zh/menus";
|
||||
import { status } from "./zh/status";
|
||||
import { login } from "./zh/login";
|
||||
import { style } from "./zh/style";
|
||||
import { system } from "./zh/system";
|
||||
|
||||
export default {
|
||||
name: "zh",
|
||||
buttons,
|
||||
search,
|
||||
panel,
|
||||
menus,
|
||||
status,
|
||||
login,
|
||||
style,
|
||||
system
|
||||
};
|
|
@ -0,0 +1,26 @@
|
|||
export const buttons = {
|
||||
openSystemSet: "打开系统配置",
|
||||
pureOpenSystemSet: "权限设定",
|
||||
|
||||
pureAccountSettings: "账户设置",
|
||||
pureLoginOut: "退出系统",
|
||||
pureLogin: "登录",
|
||||
pureReload: "重新加载",
|
||||
pureCloseCurrentTab: "关闭当前标签页",
|
||||
pureCloseLeftTabs: "关闭左侧标签页",
|
||||
pureCloseRightTabs: "关闭右侧标签页",
|
||||
pureCloseOtherTabs: "关闭其他标签页",
|
||||
pureCloseAllTabs: "关闭全部标签页",
|
||||
pureContentFullScreen: "内容区全屏",
|
||||
pureContentExitFullScreen: "内容区退出全屏",
|
||||
pureClickCollapse: "点击折叠",
|
||||
pureClickExpand: "点击展开",
|
||||
confirm: "确认",
|
||||
pureSwitch: "切换",
|
||||
close: "关闭",
|
||||
pureBackTop: "回到顶部",
|
||||
pureOpenText: "开",
|
||||
pureCloseText: "关",
|
||||
rest: "重置",
|
||||
search: "搜索"
|
||||
};
|
|
@ -0,0 +1,38 @@
|
|||
export const login = {
|
||||
loginSuccess: "登录成功",
|
||||
loginFail: "登录失败",
|
||||
usernameRegex: "请输入账号",
|
||||
username: "输入用户名",
|
||||
password: "输入密码",
|
||||
login: "登录",
|
||||
|
||||
email: "输入邮箱",
|
||||
repeatPassword: "确认密码",
|
||||
emailCode: "邮箱验证码",
|
||||
verifyCode: "图形验证码",
|
||||
emailRegex: "输入邮箱",
|
||||
passwordRegex: "请输入密码",
|
||||
passwordSureRegex: "请输入确认密码",
|
||||
repeatPasswordRegex: "请输入确认密码",
|
||||
passwordDifferentRegex: "两次密码不一致!",
|
||||
emailCodeRegex: "请输入邮箱验证码",
|
||||
verifyCodeRegex: "输入验证码",
|
||||
getEmailCode: "获取邮箱验证码",
|
||||
rememberMe: "天内免登录",
|
||||
rememberInfo: "勾选并登录后,规定天数内无需输入用户名和密码会自动登入系统",
|
||||
forgetPassword: "忘记密码?",
|
||||
getVerifyCode: "获取验证码",
|
||||
definite: "确定",
|
||||
back: "返回",
|
||||
getCodeInfo: "秒后重新获取",
|
||||
passWordUpdateReg: "修改密码成功",
|
||||
pureRegisterSuccess: "注册成功",
|
||||
pureTickPrivacy: "请勾选隐私政策",
|
||||
pureReadAccept: "我已仔细阅读并接受",
|
||||
purePrivacyPolicy: "《隐私政策》",
|
||||
pureVerifyCodeCorrectReg: "请输入正确的验证码",
|
||||
pureVerifyCodeSixReg: "请输入6位数字验证码",
|
||||
purePhoneReg: "请输入手机号码",
|
||||
purePhoneCorrectReg: "请输入正确的手机号码格式",
|
||||
purePassWordRuleReg: "密码格式应为8-18位数字、字母、符号的任意两种组合"
|
||||
};
|
|
@ -0,0 +1,120 @@
|
|||
export const menus = {
|
||||
home: "首页",
|
||||
purePermissionButtonRouter: "权限1",
|
||||
purePermissionButtonLogin: "权限2",
|
||||
pureLogin: "登录",
|
||||
pureEmpty: "无Layout页",
|
||||
pureTable: "表格",
|
||||
pureSysManagement: "系统管理",
|
||||
pureUser: "用户管理",
|
||||
pureRole: "角色管理",
|
||||
pureSystemMenu: "菜单管理",
|
||||
pureDept: "部门管理",
|
||||
pureSysMonitor: "系统监控",
|
||||
pureOnlineUser: "在线用户",
|
||||
pureLoginLog: "登录日志",
|
||||
pureOperationLog: "操作日志",
|
||||
pureSystemLog: "系统日志",
|
||||
pureEditor: "编辑器",
|
||||
pureAbnormal: "异常页面",
|
||||
pureFourZeroFour: "404",
|
||||
pureFourZeroOne: "403",
|
||||
pureFive: "500",
|
||||
pureComponents: "组件",
|
||||
pureDialog: "函数式弹框",
|
||||
pureMessage: "消息提示",
|
||||
pureVideo: "视频",
|
||||
pureSegmented: "分段控制器",
|
||||
pureWaterfall: "瀑布流无限滚动",
|
||||
pureMap: "地图",
|
||||
pureDraggable: "拖拽",
|
||||
pureSplitPane: "切割面板",
|
||||
pureText: "文本省略",
|
||||
pureElButton: "按钮",
|
||||
pureCheckButton: "可选按钮",
|
||||
pureButton: "按钮动效",
|
||||
pureCropping: "图片裁剪",
|
||||
pureAnimatecss: "animate.css选择器",
|
||||
pureCountTo: "数字动画",
|
||||
pureSelector: "范围选择器",
|
||||
pureFlowChart: "流程图",
|
||||
pureSeamless: "无缝滚动",
|
||||
pureContextmenu: "右键菜单",
|
||||
pureTypeit: "打字机",
|
||||
pureJsonEditor: "JSON编辑器",
|
||||
pureColorPicker: "颜色选择器",
|
||||
pureDatePicker: "日期选择器",
|
||||
pureDateTimePicker: "日期时间选择器",
|
||||
pureTimePicker: "时间选择器",
|
||||
pureTag: "标签",
|
||||
pureStatistic: "统计组件",
|
||||
pureCollapse: "折叠面板",
|
||||
pureGanttastic: "甘特图",
|
||||
pureProgress: "进度条",
|
||||
pureUpload: "文件上传",
|
||||
pureCheckCard: "多选卡片",
|
||||
pureMenus: "多级菜单",
|
||||
pureMenu1: "菜单1",
|
||||
pureMenu2: "菜单2",
|
||||
purePermission: "权限管理",
|
||||
purePermissionPage: "页面权限",
|
||||
purePermissionButton: "按钮权限",
|
||||
pureTabs: "标签页操作",
|
||||
pureGuide: "引导页",
|
||||
pureAble: "功能",
|
||||
pureMenuTree: "菜单树结构",
|
||||
pureVideoFrame: "视频帧截取-wasm版",
|
||||
pureWavesurfer: "音频可视化",
|
||||
pureRipple: "波纹(Ripple)",
|
||||
pureMqtt: "MQTT客户端(mqtt)",
|
||||
pureOptimize: "防抖、截流、复制、长按指令",
|
||||
pureVerify: "图形验证码",
|
||||
pureWatermark: "水印",
|
||||
purePrint: "打印",
|
||||
pureDownload: "下载",
|
||||
pureExternalPage: "外部页面",
|
||||
pureExternalDoc: "文档外链",
|
||||
pureEmbeddedDoc: "文档内嵌",
|
||||
pureExternalLink: "vue-pure-admin",
|
||||
pureUtilsLink: "pure-admin-utils",
|
||||
pureColorHuntDoc: "调色板",
|
||||
pureUiGradients: "渐变色",
|
||||
pureEpDoc: "element-plus",
|
||||
pureTailwindcssDoc: "tailwindcss",
|
||||
pureVueDoc: "vue3",
|
||||
pureViteDoc: "vite",
|
||||
purePiniaDoc: "pinia",
|
||||
pureRouterDoc: "vue-router",
|
||||
pureAbout: "关于",
|
||||
pureResult: "结果页面",
|
||||
pureSuccess: "成功页面",
|
||||
pureFail: "失败页面",
|
||||
pureIconSelect: "图标选择器",
|
||||
pureTimeline: "时间线",
|
||||
pureLineTree: "树形连接线",
|
||||
pureList: "列表页面",
|
||||
pureCardList: "卡片列表页",
|
||||
pureDebounce: "防抖节流",
|
||||
pureFormDesign: "表单设计器",
|
||||
pureBarcode: "条形码",
|
||||
pureQrcode: "二维码",
|
||||
pureCascader: "区域级联选择器",
|
||||
pureSwiper: "Swiper插件",
|
||||
pureVirtualList: "虚拟列表",
|
||||
purePdf: "PDF预览",
|
||||
pureExcel: "导出Excel",
|
||||
pureInfiniteScroll: "表格无限滚动",
|
||||
pureSensitive: "敏感词过滤",
|
||||
purePinyin: "汉语拼音",
|
||||
pureDanmaku: "弹幕",
|
||||
pureSchemaForm: "表单",
|
||||
pureTableBase: "基础用法",
|
||||
pureTableHigh: "高级用法",
|
||||
pureTableEdit: "可编辑用法",
|
||||
pureVxeTable: "虚拟滚动",
|
||||
pureBoard: "艺术画板",
|
||||
pureMindMap: "思维导图",
|
||||
pureMenuOverflow: "目录超出显示 Tooltip 文字提示",
|
||||
pureChildMenuOverflow: "菜单超出显示 Tooltip 文字提示",
|
||||
systemctlTest: "系统测试"
|
||||
};
|
|
@ -0,0 +1,34 @@
|
|||
export const panel = {
|
||||
pureSystemSet: "系统配置",
|
||||
pureCloseSystemSet: "关闭配置",
|
||||
pureClearCacheAndToLogin: "清空缓存并返回登录页",
|
||||
pureClearCache: "清空缓存",
|
||||
pureOverallStyle: "整体风格",
|
||||
pureOverallStyleLight: "浅色",
|
||||
pureOverallStyleLightTip: "清新启航,点亮舒适的工作界面",
|
||||
pureOverallStyleDark: "深色",
|
||||
pureOverallStyleDarkTip: "月光序曲,沉醉于夜的静谧雅致",
|
||||
pureOverallStyleSystem: "自动",
|
||||
pureOverallStyleSystemTip: "同步时光,界面随晨昏自然呼应",
|
||||
pureThemeColor: "主题色",
|
||||
pureLayoutModel: "导航模式",
|
||||
pureVerticalTip: "左侧菜单,亲切熟悉",
|
||||
pureHorizontalTip: "顶部菜单,简洁概览",
|
||||
pureMixTip: "混合菜单,灵活多变",
|
||||
pureStretch: "页宽",
|
||||
pureStretchFixed: "固定",
|
||||
pureStretchFixedTip: "紧凑页面,轻松找到所需信息",
|
||||
pureStretchCustom: "自定义",
|
||||
pureStretchCustomTip: "最小1280、最大1600",
|
||||
pureTagsStyle: "页签风格",
|
||||
pureTagsStyleSmart: "灵动",
|
||||
pureTagsStyleSmartTip: "灵动标签,添趣生辉",
|
||||
pureTagsStyleCard: "卡片",
|
||||
pureTagsStyleCardTip: "卡片标签,高效浏览",
|
||||
pureInterfaceDisplay: "界面显示",
|
||||
pureGreyModel: "灰色模式",
|
||||
pureWeakModel: "色弱模式",
|
||||
pureHiddenTags: "隐藏标签页",
|
||||
pureHiddenFooter: "隐藏页脚",
|
||||
pureMultiTagsCache: "页签持久化"
|
||||
};
|
|
@ -0,0 +1,10 @@
|
|||
export const search = {
|
||||
search: {
|
||||
pureTotal: "共",
|
||||
pureHistory: "搜索历史",
|
||||
pureCollect: "收藏",
|
||||
pureDragSort: "(可拖拽排序)",
|
||||
pureEmpty: "暂无搜索结果",
|
||||
purePlaceholder: "搜索菜单(支持拼音搜索)"
|
||||
}
|
||||
};
|
|
@ -0,0 +1,11 @@
|
|||
export const status = {
|
||||
pureLoad: "加载中...",
|
||||
pureMessage: "消息",
|
||||
pureNotify: "通知",
|
||||
pureTodo: "待办",
|
||||
pureNoMessage: "暂无消息",
|
||||
pureNoNotify: "暂无通知",
|
||||
pureNoTodo: "暂无待办",
|
||||
enable: "启用",
|
||||
disable: "不启用"
|
||||
};
|
|
@ -0,0 +1,5 @@
|
|||
export const style = {
|
||||
larger: "宽松",
|
||||
default: "默认",
|
||||
small: "紧凑"
|
||||
};
|
|
@ -0,0 +1,8 @@
|
|||
export const system = {
|
||||
config: "系统设置",
|
||||
carousel: "轮播图设置",
|
||||
favicon: "图标设置",
|
||||
feedback: "用户反馈",
|
||||
emailUsers: "邮件用户",
|
||||
log: "系统日志"
|
||||
};
|
|
@ -0,0 +1,42 @@
|
|||
// 根据角色动态生成路由
|
||||
import { defineFakeRoute } from "vite-plugin-fake-server/client";
|
||||
|
||||
export default defineFakeRoute([
|
||||
{
|
||||
url: "/mock/login",
|
||||
method: "post",
|
||||
response: ({ body }) => {
|
||||
if (body.username === "admin") {
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
avatar: "https://avatars.githubusercontent.com/u/44761321",
|
||||
username: "admin",
|
||||
nickname: "小铭",
|
||||
// 一个用户可能有多个角色
|
||||
roles: ["admin"],
|
||||
// 按钮级别权限
|
||||
permissions: ["*:*:*"],
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.admin",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.adminRefresh",
|
||||
expires: "2030/10/30 00:00:00"
|
||||
}
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
avatar: "https://avatars.githubusercontent.com/u/52823142",
|
||||
username: "common",
|
||||
nickname: "小林",
|
||||
roles: ["common"],
|
||||
permissions: ["permission:btn:add", "permission:btn:edit"],
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.common",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.commonRefresh",
|
||||
expires: "2030/10/30 00:00:00"
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
]);
|
|
@ -0,0 +1,27 @@
|
|||
import { defineFakeRoute } from "vite-plugin-fake-server/client";
|
||||
|
||||
// 模拟刷新token接口
|
||||
export default defineFakeRoute([
|
||||
{
|
||||
url: "/mock/refresh-token",
|
||||
method: "post",
|
||||
response: ({ body }) => {
|
||||
if (body.refreshToken) {
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.newAdmin",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.newAdminRefresh",
|
||||
// `expires`选择这种日期格式是为了方便调试,后端直接设置时间戳或许更方便(每次都应该递增)。如果后端返回的是时间戳格式,前端开发请来到这个目录`src/utils/auth.ts`,把第`38`行的代码换成expires = data.expires即可。
|
||||
expires: "2030/10/30 23:59:59"
|
||||
}
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
success: false,
|
||||
data: {}
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
]);
|
|
@ -0,0 +1,204 @@
|
|||
{
|
||||
"name": "bunny-admin-element",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"keywords": [
|
||||
"bunny-admin-element",
|
||||
"bunny-cli",
|
||||
"element-plus",
|
||||
"tailwindcss",
|
||||
"typescript",
|
||||
"pinia",
|
||||
"vue3",
|
||||
"vite",
|
||||
"esm"
|
||||
],
|
||||
"homepage": "https://gitee.com/BunnyBoss/bunny-admin-element.git",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitee.com/BunnyBoss/bunny-admin-element.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://gitee.com/BunnyBoss/bunny-admin-element.git/issues"
|
||||
},
|
||||
"license": "MIT",
|
||||
"author": {
|
||||
"name": "Bunny0212",
|
||||
"email": "1319900154@qq.com",
|
||||
"url": "https://github.com/xiaoxian521"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "NODE_OPTIONS=--max-old-space-size=4096 vite",
|
||||
"serve": "pnpm vite",
|
||||
"start": "vite",
|
||||
"build": "rimraf dist && NODE_OPTIONS=--max-old-space-size=8192 vite build && generate-version-file",
|
||||
"build:staging": "rimraf dist && vite build --mode staging",
|
||||
"report": "rimraf dist && vite build",
|
||||
"preview": "vite preview",
|
||||
"preview:build": "pnpm build && vite preview",
|
||||
"typecheck": "tsc --noEmit && vue-tsc --noEmit --skipLibCheck",
|
||||
"svgo": "svgo -f . -r",
|
||||
"clean:cache": "rimraf .eslintcache && rimraf pnpm-lock.yaml && rimraf node_modules && pnpm store prune && pnpm install",
|
||||
"lint:eslint": "eslint --cache --max-warnings 0 \"{src,mock,build}/**/*.{vue,js,ts,tsx}\" --fix",
|
||||
"lint:prettier": "prettier --write \"src/**/*.{js,ts,json,tsx,css,scss,vue,html,md}\"",
|
||||
"lint:stylelint": "stylelint --cache --fix \"**/*.{html,vue,css,scss}\" --cache-location node_modules/.cache/stylelint/",
|
||||
"lint": "pnpm lint:eslint && pnpm lint:prettier && pnpm lint:stylelint",
|
||||
"prepare": "husky install",
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
"commit": "git pull && git add -A && git-cz && git push"
|
||||
},
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
"@howdyjs/mouse-menu": "^2.1.3",
|
||||
"@infectoone/vue-ganttastic": "^2.3.2",
|
||||
"@logicflow/core": "^1.2.27",
|
||||
"@logicflow/extension": "^1.2.27",
|
||||
"@pureadmin/descriptions": "^1.2.1",
|
||||
"@pureadmin/table": "^3.1.2",
|
||||
"@pureadmin/utils": "^2.4.7",
|
||||
"@vue-flow/background": "^1.3.0",
|
||||
"@vue-flow/core": "^1.33.6",
|
||||
"@vueuse/core": "^10.9.0",
|
||||
"@vueuse/motion": "^2.1.0",
|
||||
"@wangeditor/editor": "^5.1.23",
|
||||
"@wangeditor/editor-for-vue": "^5.1.12",
|
||||
"@zxcvbn-ts/core": "^3.0.4",
|
||||
"animate.css": "^4.1.1",
|
||||
"axios": "^1.6.8",
|
||||
"china-area-data": "^5.0.1",
|
||||
"cropperjs": "^1.6.2",
|
||||
"dayjs": "^1.11.11",
|
||||
"echarts": "^5.5.0",
|
||||
"el-table-infinite-scroll": "^3.0.3",
|
||||
"element-plus": "2.7.1",
|
||||
"intro.js": "^7.2.0",
|
||||
"js-cookie": "^3.0.5",
|
||||
"jsbarcode": "^3.11.6",
|
||||
"localforage": "^1.10.0",
|
||||
"mint-filter": "^4.0.3",
|
||||
"mitt": "^3.0.1",
|
||||
"mqtt": "4.3.7",
|
||||
"nprogress": "^0.2.0",
|
||||
"path": "^0.12.7",
|
||||
"pinia": "^2.1.7",
|
||||
"pinia-plugin-persistedstate": "^3.2.1",
|
||||
"pinyin-pro": "^3.20.4",
|
||||
"plus-pro-components": "^0.1.1",
|
||||
"qrcode": "^1.5.3",
|
||||
"qs": "^6.12.1",
|
||||
"responsive-storage": "^2.2.0",
|
||||
"sortablejs": "^1.15.2",
|
||||
"swiper": "^11.1.1",
|
||||
"terser": "^5.31.0",
|
||||
"typeit": "^8.8.3",
|
||||
"v-contextmenu": "^3.2.0",
|
||||
"v3-infinite-loading": "^1.3.1",
|
||||
"version-rocket": "^1.7.1",
|
||||
"vite-plugin-vue-inspector": "^5.1.3",
|
||||
"vue": "^3.4.27",
|
||||
"vue-i18n": "^9.13.1",
|
||||
"vue-json-pretty": "^2.4.0",
|
||||
"vue-pdf-embed": "^2.0.3",
|
||||
"vue-router": "^4.3.2",
|
||||
"vue-tippy": "^6.4.1",
|
||||
"vue-types": "^5.1.2",
|
||||
"vue-virtual-scroller": "2.0.0-beta.8",
|
||||
"vue-waterfall-plugin-next": "^2.4.3",
|
||||
"vue3-danmaku": "^1.6.0",
|
||||
"vue3-puzzle-vcode": "^1.1.7",
|
||||
"vuedraggable": "^4.1.0",
|
||||
"vxe-table": "^4.6.9",
|
||||
"wavesurfer.js": "^7.7.13",
|
||||
"xgplayer": "^3.0.17",
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^19.3.0",
|
||||
"@commitlint/config-conventional": "^19.2.2",
|
||||
"@commitlint/types": "^19.0.3",
|
||||
"@eslint/js": "^9.2.0",
|
||||
"@faker-js/faker": "^8.4.1",
|
||||
"@iconify-icons/ep": "^1.2.12",
|
||||
"@iconify-icons/ri": "^1.2.10",
|
||||
"@iconify/vue": "^4.1.2",
|
||||
"@intlify/unplugin-vue-i18n": "^4.0.0",
|
||||
"@pureadmin/theme": "^3.2.0",
|
||||
"@types/dagre": "^0.7.52",
|
||||
"@types/gradient-string": "^1.1.6",
|
||||
"@types/intro.js": "^5.1.5",
|
||||
"@types/js-cookie": "^3.0.6",
|
||||
"@types/node": "^20.12.11",
|
||||
"@types/nprogress": "^0.2.3",
|
||||
"@types/qrcode": "^1.5.5",
|
||||
"@types/qs": "^6.9.15",
|
||||
"@types/sortablejs": "^1.15.8",
|
||||
"@typescript-eslint/eslint-plugin": "^7.8.0",
|
||||
"@typescript-eslint/parser": "^7.8.0",
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"boxen": "^7.1.1",
|
||||
"commitizen": "^4.2.4",
|
||||
"commitlint": "^17.0.1",
|
||||
"cssnano": "^7.0.1",
|
||||
"cz-git": "^1.3.2",
|
||||
"dagre": "^0.8.5",
|
||||
"eslint": "^9.2.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-define-config": "^2.1.0",
|
||||
"eslint-plugin-prettier": "^5.1.3",
|
||||
"eslint-plugin-vue": "^9.25.0",
|
||||
"gradient-string": "^2.0.2",
|
||||
"husky": "^8.0.1",
|
||||
"lint-staged": "^15.2.2",
|
||||
"postcss": "^8.4.38",
|
||||
"postcss-html": "^1.7.0",
|
||||
"postcss-import": "^16.1.0",
|
||||
"postcss-scss": "^4.0.9",
|
||||
"prettier": "^3.2.5",
|
||||
"rimraf": "^5.0.5",
|
||||
"rollup-plugin-visualizer": "^5.12.0",
|
||||
"sass": "^1.77.0",
|
||||
"stylelint": "^16.5.0",
|
||||
"stylelint-config-recess-order": "^5.0.1",
|
||||
"stylelint-config-recommended-vue": "^1.5.0",
|
||||
"stylelint-config-standard-scss": "^13.1.0",
|
||||
"stylelint-prettier": "^5.0.0",
|
||||
"svgo": "^3.3.0",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"typescript": "^5.4.5",
|
||||
"vite": "^5.2.11",
|
||||
"vite-plugin-cdn-import": "^0.3.5",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-fake-server": "^2.1.1",
|
||||
"vite-plugin-remove-console": "^2.2.0",
|
||||
"vite-plugin-router-warn": "^1.0.0",
|
||||
"vite-svg-loader": "^5.1.0",
|
||||
"vue-eslint-parser": "^9.4.2",
|
||||
"vue-tsc": "^1.8.27"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.18.0 || ^20.9.0 || >=21.1.0",
|
||||
"pnpm": ">=8.6.10"
|
||||
},
|
||||
"pnpm": {
|
||||
"allowedDeprecatedVersions": {
|
||||
"sourcemap-codec": "*",
|
||||
"domexception": "*",
|
||||
"w3c-hr-time": "*",
|
||||
"stable": "*",
|
||||
"abab": "*"
|
||||
},
|
||||
"peerDependencyRules": {
|
||||
"allowedVersions": {
|
||||
"eslint": "9"
|
||||
}
|
||||
}
|
||||
},
|
||||
"config": {
|
||||
"commitizen": {
|
||||
"path": "node_modules/cz-git"
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,12 @@
|
|||
// @ts-check
|
||||
|
||||
/** @type {import('postcss-load-config').Config} */
|
||||
export default {
|
||||
plugins: {
|
||||
"postcss-import": {},
|
||||
"tailwindcss/nesting": {},
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
...(process.env.NODE_ENV === "production" ? { cssnano: {} } : {})
|
||||
}
|
||||
};
|
After Width: | Height: | Size: 9.4 KiB |
|
@ -0,0 +1,740 @@
|
|||
<!doctype html>
|
||||
<html lang="zh">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="btns">
|
||||
<div class="btn java">JAVA攻城狮</div>
|
||||
<div class="btn golang">Golang工程师!</div>
|
||||
<div class="btn js"><span>js攻城狮</span></div>
|
||||
<div class="btn nodd-ruby ruby">
|
||||
<div class="anim"></div>
|
||||
<span>Ruby攻城狮</span>
|
||||
</div>
|
||||
|
||||
<div class="btn vb">
|
||||
<span>VB攻城狮</span>
|
||||
<div class="dot"></div>
|
||||
</div>
|
||||
<div class="btn python python-1">python攻城狮</div>
|
||||
<div class="btn python python-2">python攻城狮</div>
|
||||
<div class="btn python python-3">python攻城狮</div>
|
||||
<div class="btn python python-4">python攻城狮</div>
|
||||
<div class="btn python python-5">python攻城狮</div>
|
||||
|
||||
<div class="btn php php-1">php攻城狮</div>
|
||||
<div class="btn php php-2">php攻城狮</div>
|
||||
<div class="btn php php-3">php攻城狮</div>
|
||||
<div class="btn php php-4">php攻城狮</div>
|
||||
<div class="btn php php-5">php攻城狮</div>
|
||||
|
||||
<div class="btn kotlin kotlin-3">kotlin攻城狮</div>
|
||||
<div class="btn kotlin kotlin-1">kotlin攻城狮</div>
|
||||
<div class="btn kotlin kotlin-4">kotlin攻城狮</div>
|
||||
<div class="btn kotlin kotlin-2">kotlin攻城狮</div>
|
||||
<div class="btn kotlin kotlin-5">kotlin攻城狮</div>
|
||||
<div class="btn c">C语言攻城狮</div>
|
||||
</div>
|
||||
</body>
|
||||
<style>
|
||||
.text-info {
|
||||
position: absolute;
|
||||
top: calc(50vh - 245px);
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
width: 100%;
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
vertical-align: top;
|
||||
margin: 15px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
width: 122px;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.java {
|
||||
color: #eb9e05;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
width: 120px;
|
||||
border: 1px solid #eb9e05;
|
||||
opacity: 1;
|
||||
transition: all 0.6s;
|
||||
}
|
||||
|
||||
.java:hover {
|
||||
background: #eb9e05;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.java:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.c {
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
background: #55acee;
|
||||
transition: all 0.5s;
|
||||
box-shadow: 0px 5px 0px 0px #3486d5;
|
||||
}
|
||||
|
||||
.c:hover {
|
||||
background-color: #6fc6ff;
|
||||
}
|
||||
|
||||
.c:active {
|
||||
transform: translate(0px, 4px);
|
||||
box-shadow: 0px 1px 0px 0px #3486d5;
|
||||
}
|
||||
|
||||
@keyframes sheen {
|
||||
0% {
|
||||
transform: skewY(-45deg) translateX(0);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: skewY(-45deg) translateX(12.5em);
|
||||
}
|
||||
}
|
||||
|
||||
.golang {
|
||||
vertical-align: top;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
width: 120px;
|
||||
color: #2194e0;
|
||||
border: 1px solid #2194e0;
|
||||
transition: all 0.2s ease-in-out;
|
||||
position: relative;
|
||||
opacity: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.golang:before {
|
||||
content: "";
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
height: 100%;
|
||||
width: 3em;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -4.5em;
|
||||
transform: skewX(-45deg) translateX(0);
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.golang:hover {
|
||||
background-color: #2194e0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.golang:hover:before {
|
||||
transform: skewX(-45deg) translateX(260px);
|
||||
transition: all 0.5s ease-in-out;
|
||||
}
|
||||
|
||||
.golang:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.js {
|
||||
width: 160px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
background: #0d6;
|
||||
width: 120px;
|
||||
border: 1px solid #0d6;
|
||||
overflow: hidden;
|
||||
transition: all 0.5s;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.js:hover,
|
||||
.js:active {
|
||||
text-decoration: none;
|
||||
color: #0c5;
|
||||
border-color: #0c5;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.js:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.js span {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
padding-right: 0;
|
||||
transition: padding-right 0.5s;
|
||||
}
|
||||
|
||||
.js span:after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -18px;
|
||||
opacity: 0;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-top: -10px;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
border: 2px solid #fff;
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
transition:
|
||||
opacity 0.5s,
|
||||
top 0.5s,
|
||||
right 0.5s;
|
||||
transform: rotate(-140deg);
|
||||
}
|
||||
|
||||
.js:hover span,
|
||||
.js:active span {
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
.js:hover span:after,
|
||||
.js:active span:after {
|
||||
transition:
|
||||
opacity 0.5s,
|
||||
top 0.5s,
|
||||
right 0.5s;
|
||||
opacity: 1;
|
||||
border-color: #0c5;
|
||||
right: 0;
|
||||
top: calc(50% + 2.5px);
|
||||
transform: rotate(-140deg);
|
||||
}
|
||||
|
||||
.nodd-ruby {
|
||||
background: #c147e6;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
input[type="checkbox"].toggle {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type="checkbox"].toggle:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.anim {
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.anim:before {
|
||||
position: relative;
|
||||
content: "";
|
||||
display: block;
|
||||
margin-top: 100%;
|
||||
}
|
||||
|
||||
.anim:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.node .toggle:checked + .anim {
|
||||
animation: 0.75s anim-in;
|
||||
}
|
||||
|
||||
.node .toggle:checked + .anim:after {
|
||||
animation: anim-in-pseudo 0.75s;
|
||||
}
|
||||
|
||||
.node .toggle:not(:checked) + .anim {
|
||||
animation: anim-out 0.75s;
|
||||
}
|
||||
|
||||
.node .toggle:not(:checked) + .anim:after {
|
||||
animation: anim-out-pseudo 0.75s;
|
||||
}
|
||||
|
||||
.node {
|
||||
background: #ed3f14;
|
||||
}
|
||||
|
||||
.node:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.ruby:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.ruby:hover > .anim {
|
||||
animation: anim-out 0.75s;
|
||||
}
|
||||
|
||||
.ruby:hover > .anim:after {
|
||||
animation: anim-out-pseudo 0.75s;
|
||||
}
|
||||
|
||||
@keyframes anim-in {
|
||||
0% {
|
||||
width: 0%;
|
||||
}
|
||||
|
||||
100% {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes anim-in-pseudo {
|
||||
0% {
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
100% {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes anim-out {
|
||||
0% {
|
||||
width: 0%;
|
||||
}
|
||||
|
||||
100% {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes anim-out-pseudo {
|
||||
0% {
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
100% {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.python {
|
||||
transition: 0.5s;
|
||||
background-size: 200% auto;
|
||||
}
|
||||
|
||||
.python:hover {
|
||||
background-position: right center;
|
||||
}
|
||||
|
||||
.python-1 {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
#f6d365 0%,
|
||||
#fda085 51%,
|
||||
#f6d365 100%
|
||||
);
|
||||
}
|
||||
|
||||
.python-2 {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
#fbc2eb 0%,
|
||||
#a6c1ee 51%,
|
||||
#fbc2eb 100%
|
||||
);
|
||||
}
|
||||
|
||||
.python-3 {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
#84fab0 0%,
|
||||
#8fd3f4 51%,
|
||||
#84fab0 100%
|
||||
);
|
||||
}
|
||||
|
||||
.python-4 {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
#a1c4fd 0%,
|
||||
#c2e9fb 51%,
|
||||
#a1c4fd 100%
|
||||
);
|
||||
}
|
||||
|
||||
.python-5 {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
#ffecd2 0%,
|
||||
#fcb69f 51%,
|
||||
#ffecd2 100%
|
||||
);
|
||||
}
|
||||
|
||||
.php,
|
||||
.php::after {
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.php {
|
||||
border: 1px solid #c147e6;
|
||||
color: #c147e6;
|
||||
width: 120px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.php:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.php::before,
|
||||
.php::after {
|
||||
background: #c147e6;
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: -2;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.php-1::after {
|
||||
height: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.php-1:hover:after {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.php-2::after {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.php-2:hover:after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.php-3::after {
|
||||
height: 0;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.php-3:hover:after {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.php-4::before {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.php-4::after {
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.php-4:hover:after {
|
||||
height: 0;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.php-5 {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.php-5::after {
|
||||
height: 100%;
|
||||
left: -35%;
|
||||
top: 0;
|
||||
transform: skew(50deg);
|
||||
transition-duration: 0.6s;
|
||||
transform-origin: top left;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.php-5:hover:after {
|
||||
height: 100%;
|
||||
width: 135%;
|
||||
}
|
||||
|
||||
.kotlin {
|
||||
background: none;
|
||||
border: 1px solid;
|
||||
width: 120px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
letter-spacing: inherit;
|
||||
text-transform: inherit;
|
||||
transition: color 1s;
|
||||
}
|
||||
|
||||
.kotlin-1 {
|
||||
color: #9c89f7;
|
||||
}
|
||||
|
||||
.kotlin-1:hover {
|
||||
animation: halftone 1s forwards;
|
||||
background:
|
||||
radial-gradient(circle, #9c89f7 0.2em, transparent 0.25em) 0 0/1.25em
|
||||
1.25em,
|
||||
radial-gradient(circle, #9c89f7 0.2em, transparent 0.25em) 6.25em 6.25em/1.25em
|
||||
1.25em;
|
||||
color: #e4f789;
|
||||
}
|
||||
|
||||
@keyframes halftone {
|
||||
100% {
|
||||
background-size:
|
||||
2.375em 2.375em,
|
||||
0.1em 0.1em;
|
||||
}
|
||||
}
|
||||
|
||||
.kotlin-2 {
|
||||
color: #82f6d8;
|
||||
}
|
||||
|
||||
.kotlin-2:hover {
|
||||
animation: stripes-move 0.75s infinite linear;
|
||||
background: repeating-linear-gradient(
|
||||
45deg,
|
||||
#82f6d8 0,
|
||||
#82f6d8 0.25em,
|
||||
transparent 0.25em,
|
||||
transparent 0.5em
|
||||
);
|
||||
color: #f682a0;
|
||||
}
|
||||
|
||||
@keyframes stripes-move {
|
||||
100% {
|
||||
background-position: 5em 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.kotlin-3 {
|
||||
color: #d3f169;
|
||||
}
|
||||
|
||||
.kotlin-3:hover {
|
||||
animation: sawtooth 0.35s infinite linear;
|
||||
background:
|
||||
linear-gradient(45deg, #d3f169 0.5em, transparent 0.5em) 0 0/1em 1em,
|
||||
linear-gradient(-45deg, #d3f169 0.5em, transparent 0.5em) 0 0/1em 1em;
|
||||
color: #8769f1;
|
||||
}
|
||||
|
||||
@keyframes sawtooth {
|
||||
100% {
|
||||
background-position: 1em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.kotlin-4 {
|
||||
color: #eea163;
|
||||
}
|
||||
|
||||
.kotlin-4:hover {
|
||||
animation: zigzag 1s linear infinite;
|
||||
background:
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(238, 161, 99, 0.25) 0.25em,
|
||||
transparent 0.25em
|
||||
) -0.5em 0,
|
||||
linear-gradient(
|
||||
225deg,
|
||||
rgba(238, 161, 99, 0.25) 0.25em,
|
||||
transparent 0.25em
|
||||
) -0.5em 0,
|
||||
linear-gradient(
|
||||
315deg,
|
||||
rgba(238, 161, 99, 0.25) 0.25em,
|
||||
transparent 0.25em
|
||||
)
|
||||
0 0,
|
||||
linear-gradient(
|
||||
45deg,
|
||||
rgba(238, 161, 99, 0.25) 0.25em,
|
||||
transparent 0.25em
|
||||
)
|
||||
0 0;
|
||||
background-size: 0.75em 0.75em;
|
||||
color: #63b0ee;
|
||||
}
|
||||
|
||||
@keyframes zigzag {
|
||||
100% {
|
||||
background-position:
|
||||
1em 0,
|
||||
1em 0,
|
||||
-0.75em 0,
|
||||
-0.75em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.kotlin-5 {
|
||||
color: #f9879b;
|
||||
}
|
||||
|
||||
.kotlin-5:hover {
|
||||
animation: pulse 1s ease-in infinite;
|
||||
background:
|
||||
radial-gradient(circle, rgba(249, 135, 155, 0.25) 43%, transparent 50%)
|
||||
0 0/1em 1em,
|
||||
radial-gradient(circle, rgba(249, 135, 155, 0.25) 43%, transparent 50%)
|
||||
0.5em 0.5em/2em 2em;
|
||||
color: #0bdcb7;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
50% {
|
||||
background-position:
|
||||
0.66em 0.66em,
|
||||
-0.33em -0.33em;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-size:
|
||||
2em 2em,
|
||||
1em 1em;
|
||||
background-position:
|
||||
-1.5em -1.5em,
|
||||
-1em -1em;
|
||||
}
|
||||
}
|
||||
|
||||
.vb:before,
|
||||
.vb:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.vb {
|
||||
position: relative;
|
||||
width: 120px;
|
||||
color: #fa5555;
|
||||
height: 40px;
|
||||
line-height: 42px;
|
||||
border: 2px solid #fa5555;
|
||||
border-radius: 14px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.dot {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 32px;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
transition: all 300ms ease;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dot:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
background: #fa5555;
|
||||
border-radius: 50%;
|
||||
border: 4px solid #fa5555;
|
||||
box-shadow:
|
||||
0 0 0.7em #fff,
|
||||
0 0 2em #fa5555;
|
||||
}
|
||||
|
||||
.vb:hover .dot,
|
||||
.vb:focus .dot {
|
||||
animation: atom 2s infinite linear;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*calc(122px - 36px) 按钮宽度 - dot宽度 - 边框宽度*/
|
||||
@keyframes atom {
|
||||
0% {
|
||||
transform: translateX(0) rotate(0);
|
||||
}
|
||||
|
||||
30% {
|
||||
transform: translateX(calc(122px - 36px)) rotate(0);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translateX(calc(122px - 36px)) rotate(180deg);
|
||||
}
|
||||
|
||||
80% {
|
||||
transform: translateX(0) rotate(180deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(0) rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-down {
|
||||
position: absolute;
|
||||
top: calc(50vh - 280px);
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
left: calc(50vw - 87px);
|
||||
width: 122px;
|
||||
line-height: 44px;
|
||||
color: #fff;
|
||||
background: #2194e0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.btn-down:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
</style>
|
||||
</html>
|
After Width: | Height: | Size: 25 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024"><path fill="#386BF3" d="M410.558.109c0 210.974-300.876 361.752-300.876 633.548 0 174.943 134.704 316.787 300.876 316.787s300.877-141.817 300.877-316.787C711.408 361.752 410.558 210.974 410.558.109"/><path fill="#C3D2FB" d="M613.469 73.665c0 211.055-300.877 361.914-300.877 633.547C312.592 882.156 447.296 1024 613.47 1024s300.876-141.817 300.876-316.788C914.29 435.58 613.469 284.72 613.469 73.665"/><path fill="#303F5B" d="M312.592 707.212c0-183.713 137.636-312.171 226.723-441.39 81.702 106.112 172.12 218.74 172.12 367.726A309.755 309.755 0 0 1 420.36 950.064a323.1 323.1 0 0 1-107.769-242.852z"/></svg>
|
After Width: | Height: | Size: 706 B |
|
@ -0,0 +1,27 @@
|
|||
{
|
||||
"Version": "5.8.0",
|
||||
"Title": "PureAdmin",
|
||||
"FixedHeader": true,
|
||||
"HiddenSideBar": false,
|
||||
"MultiTagsCache": false,
|
||||
"KeepAlive": true,
|
||||
"Locale": "zh",
|
||||
"Layout": "vertical",
|
||||
"Theme": "light",
|
||||
"DarkMode": false,
|
||||
"OverallStyle": "light",
|
||||
"Grey": false,
|
||||
"Weak": false,
|
||||
"HideTabs": false,
|
||||
"HideFooter": false,
|
||||
"Stretch": false,
|
||||
"SidebarStatus": true,
|
||||
"EpThemeColor": "#409EFF",
|
||||
"ShowLogo": true,
|
||||
"ShowModel": "smart",
|
||||
"MenuArrowIconNoTransition": false,
|
||||
"CachingAsyncRoutes": false,
|
||||
"TooltipEffect": "light",
|
||||
"ResponsiveStorageNameSpace": "responsive-",
|
||||
"MenuSearchHistory": 6
|
||||
}
|
|
@ -0,0 +1,60 @@
|
|||
<template>
|
||||
<el-config-provider :locale="currentLocale">
|
||||
<router-view />
|
||||
<ReDialog />
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
import { computed, onMounted } from "vue";
|
||||
import { ReDialog } from "@/components/BaseDialog";
|
||||
import en from "element-plus/es/locale/lang/en";
|
||||
import zhCn from "element-plus/es/locale/lang/zh-cn";
|
||||
import plusEn from "plus-pro-components/es/locale/lang/en";
|
||||
import plusZhCn from "plus-pro-components/es/locale/lang/zh-cn";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { userI18nStore } from "@/store/i18n/i18n";
|
||||
|
||||
const i18nStore = userI18nStore();
|
||||
const i18n = useI18n();
|
||||
const { $storage } = useNav();
|
||||
|
||||
/**
|
||||
* * 设置多语言内容
|
||||
*/
|
||||
const setI18n = async () => {
|
||||
await i18nStore.fetchI18n();
|
||||
const languageData = JSON.parse(localStorage.getItem("i18nStore") as any);
|
||||
// 初始化设置多语言内容
|
||||
const locale = $storage.locale.locale;
|
||||
// 如果本地没有语言版本,设置为服务端默认内容
|
||||
if (locale == "" || locale == null || !locale) {
|
||||
const local = languageData.i18n.local;
|
||||
i18n.locale.value = local;
|
||||
$storage.locale = { locale: local };
|
||||
i18n.mergeLocaleMessage(local, languageData.i18n[local]);
|
||||
return;
|
||||
}
|
||||
|
||||
i18n.locale.value = locale;
|
||||
$storage.locale = { locale };
|
||||
i18nStore.i18n.local = locale;
|
||||
i18n.mergeLocaleMessage(locale, languageData.i18n[locale]);
|
||||
};
|
||||
|
||||
/**
|
||||
* * 当前语言类别
|
||||
*/
|
||||
const currentLocale = computed(() => {
|
||||
const languageData = JSON.parse(localStorage.getItem("i18nStore") as any);
|
||||
const local = languageData ? languageData.i18n.local : {};
|
||||
return local === "zh" ? { ...zhCn, ...plusZhCn } : { ...plusEn, ...en };
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// 设置多语言
|
||||
setI18n();
|
||||
});
|
||||
</script>
|
|
@ -0,0 +1,198 @@
|
|||
import Axios, {
|
||||
type AxiosInstance,
|
||||
type AxiosRequestConfig,
|
||||
type CustomParamsSerializer
|
||||
} from "axios";
|
||||
import type {
|
||||
PureHttpError,
|
||||
PureHttpRequestConfig,
|
||||
PureHttpResponse,
|
||||
RequestMethods
|
||||
} from "./types";
|
||||
import { stringify } from "qs";
|
||||
import NProgress from "../../utils/progress";
|
||||
import { formatToken, getToken } from "@/utils/auth";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
|
||||
// 相关配置请参考:www.axios-js.com/zh-cn/docs/#axios-request-config-1
|
||||
const defaultConfig: AxiosRequestConfig = {
|
||||
// 默认请求地址
|
||||
baseURL: import.meta.env.VITE_BASE_API,
|
||||
// 设置超时时间
|
||||
timeout: import.meta.env.VITE_BASE_API_TIMEOUT,
|
||||
// @ts-expect-error
|
||||
retry: import.meta.env.VITE_BASE_API_RETRY, //设置全局重试请求次数(最多重试几次请求)
|
||||
retryDelay: import.meta.env.VITE_BASE_API_RETRY_DELAY, //设置全局请求间隔
|
||||
// 跨域允许携带凭证
|
||||
// withCredentials: true,
|
||||
headers: {
|
||||
Accept: "application/json, text/plain, */*",
|
||||
"Content-Type": "application/json",
|
||||
"X-Requested-With": "XMLHttpRequest"
|
||||
},
|
||||
// 数组格式参数序列化(https://github.com/axios/axios/issues/5142)
|
||||
paramsSerializer: {
|
||||
serialize: stringify as unknown as CustomParamsSerializer
|
||||
}
|
||||
};
|
||||
|
||||
class PureHttp {
|
||||
/** `token`过期后,暂存待执行的请求 */
|
||||
private static requests = [];
|
||||
/** 防止重复刷新`token` */
|
||||
private static isRefreshing = false;
|
||||
/** 初始化配置对象 */
|
||||
private static initConfig: PureHttpRequestConfig = {};
|
||||
/** 保存当前`Axios`实例对象 */
|
||||
private static axiosInstance: AxiosInstance = Axios.create(defaultConfig);
|
||||
|
||||
constructor() {
|
||||
this.httpInterceptorsRequest();
|
||||
this.httpInterceptorsResponse();
|
||||
}
|
||||
|
||||
/** 重连原始请求 */
|
||||
private static retryOriginalRequest(config: PureHttpRequestConfig) {
|
||||
return new Promise(resolve => {
|
||||
PureHttp.requests.push((token: string) => {
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
resolve(config);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** 通用请求工具函数 */
|
||||
public request<T>(
|
||||
method: RequestMethods,
|
||||
url: string,
|
||||
param?: AxiosRequestConfig,
|
||||
axiosConfig?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
const config = {
|
||||
method,
|
||||
url,
|
||||
...param,
|
||||
...axiosConfig
|
||||
} as PureHttpRequestConfig;
|
||||
|
||||
// 单独处理自定义请求/响应回调
|
||||
return new Promise((resolve, reject) => {
|
||||
PureHttp.axiosInstance
|
||||
.request(config)
|
||||
.then((response: undefined) => {
|
||||
resolve(response);
|
||||
})
|
||||
.catch(error => {
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** 单独抽离的`post`工具函数 */
|
||||
public post<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
return this.request<T>("post", url, params, config);
|
||||
}
|
||||
|
||||
/** 单独抽离的`get`工具函数 */
|
||||
public get<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
return this.request<T>("get", url, params, config);
|
||||
}
|
||||
|
||||
/** 请求拦截 */
|
||||
private httpInterceptorsRequest(): void {
|
||||
PureHttp.axiosInstance.interceptors.request.use(
|
||||
async (config: PureHttpRequestConfig): Promise<any> => {
|
||||
// 开启进度条动画
|
||||
NProgress.start();
|
||||
// 优先判断post/get等方法是否传入回调,否则执行初始化设置等回调
|
||||
if (typeof config.beforeRequestCallback === "function") {
|
||||
config.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
if (PureHttp.initConfig.beforeRequestCallback) {
|
||||
PureHttp.initConfig.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
/** 请求白名单,放置一些不需要`token`的接口(通过设置请求白名单,防止`token`过期后再请求造成的死循环问题) */
|
||||
const whiteList = ["/refresh-token", "/login"];
|
||||
return whiteList.some(url => config.url.endsWith(url))
|
||||
? config
|
||||
: new Promise(resolve => {
|
||||
const data = getToken();
|
||||
if (data) {
|
||||
const now = new Date().getTime();
|
||||
const expired = parseInt(data.expires) - now <= 0;
|
||||
if (expired) {
|
||||
if (!PureHttp.isRefreshing) {
|
||||
PureHttp.isRefreshing = true;
|
||||
// token过期刷新
|
||||
useUserStoreHook()
|
||||
.handRefreshToken({ refreshToken: data.refreshToken })
|
||||
.then(res => {
|
||||
const token = res.data.accessToken;
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
PureHttp.requests.forEach(cb => cb(token));
|
||||
PureHttp.requests = [];
|
||||
})
|
||||
.finally(() => {
|
||||
PureHttp.isRefreshing = false;
|
||||
});
|
||||
}
|
||||
resolve(PureHttp.retryOriginalRequest(config));
|
||||
} else {
|
||||
config.headers["Authorization"] = formatToken(
|
||||
data.accessToken
|
||||
);
|
||||
resolve(config);
|
||||
}
|
||||
} else {
|
||||
resolve(config);
|
||||
}
|
||||
});
|
||||
},
|
||||
error => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/** 响应拦截 */
|
||||
private httpInterceptorsResponse(): void {
|
||||
const instance = PureHttp.axiosInstance;
|
||||
instance.interceptors.response.use(
|
||||
(response: PureHttpResponse) => {
|
||||
const $config = response.config;
|
||||
// 关闭进度条动画
|
||||
NProgress.done();
|
||||
// 优先判断post/get等方法是否传入回调,否则执行初始化设置等回调
|
||||
if (typeof $config.beforeResponseCallback === "function") {
|
||||
$config.beforeResponseCallback(response);
|
||||
return response.data;
|
||||
}
|
||||
if (PureHttp.initConfig.beforeResponseCallback) {
|
||||
PureHttp.initConfig.beforeResponseCallback(response);
|
||||
return response.data;
|
||||
}
|
||||
return response.data;
|
||||
},
|
||||
(error: PureHttpError) => {
|
||||
const $error = error;
|
||||
$error.isCancelRequest = Axios.isCancel($error);
|
||||
// 关闭进度条动画
|
||||
NProgress.done();
|
||||
// 所有的响应异常 区分来源为取消请求/非取消请求
|
||||
return Promise.reject($error);
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export const http = new PureHttp();
|
|
@ -0,0 +1,191 @@
|
|||
import Axios, {
|
||||
type AxiosInstance,
|
||||
type AxiosRequestConfig,
|
||||
type CustomParamsSerializer
|
||||
} from "axios";
|
||||
import type {
|
||||
PureHttpError,
|
||||
PureHttpRequestConfig,
|
||||
PureHttpResponse,
|
||||
RequestMethods
|
||||
} from "./types";
|
||||
import { stringify } from "qs";
|
||||
import NProgress from "../../utils/progress";
|
||||
import { formatToken, getToken } from "@/utils/auth";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
|
||||
// 相关配置请参考:www.axios-js.com/zh-cn/docs/#axios-request-config-1
|
||||
const defaultConfig: AxiosRequestConfig = {
|
||||
timeout: import.meta.env.VITE_BASE_API_TIMEOUT,
|
||||
baseURL: import.meta.env.VITE_MOCK_BASE_API || "/mock",
|
||||
headers: {
|
||||
Accept: "application/json, text/plain, */*",
|
||||
"Content-Type": "application/json",
|
||||
"X-Requested-With": "XMLHttpRequest"
|
||||
},
|
||||
// 数组格式参数序列化(https://github.com/axios/axios/issues/5142)
|
||||
paramsSerializer: {
|
||||
serialize: stringify as unknown as CustomParamsSerializer
|
||||
}
|
||||
};
|
||||
|
||||
class PureHttp {
|
||||
/** `token`过期后,暂存待执行的请求 */
|
||||
private static requests = [];
|
||||
/** 防止重复刷新`token` */
|
||||
private static isRefreshing = false;
|
||||
/** 初始化配置对象 */
|
||||
private static initConfig: PureHttpRequestConfig = {};
|
||||
/** 保存当前`Axios`实例对象 */
|
||||
private static axiosInstance: AxiosInstance = Axios.create(defaultConfig);
|
||||
|
||||
constructor() {
|
||||
this.httpInterceptorsRequest();
|
||||
this.httpInterceptorsResponse();
|
||||
}
|
||||
|
||||
/** 重连原始请求 */
|
||||
private static retryOriginalRequest(config: PureHttpRequestConfig) {
|
||||
return new Promise(resolve => {
|
||||
PureHttp.requests.push((token: string) => {
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
resolve(config);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** 通用请求工具函数 */
|
||||
public request<T>(
|
||||
method: RequestMethods,
|
||||
url: string,
|
||||
param?: AxiosRequestConfig,
|
||||
axiosConfig?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
const config = {
|
||||
method,
|
||||
url,
|
||||
...param,
|
||||
...axiosConfig
|
||||
} as PureHttpRequestConfig;
|
||||
|
||||
// 单独处理自定义请求/响应回调
|
||||
return new Promise((resolve, reject) => {
|
||||
PureHttp.axiosInstance
|
||||
.request(config)
|
||||
.then((response: undefined) => {
|
||||
resolve(response);
|
||||
})
|
||||
.catch(error => {
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** 单独抽离的`post`工具函数 */
|
||||
public post<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
return this.request<T>("post", url, params, config);
|
||||
}
|
||||
|
||||
/** 单独抽离的`get`工具函数 */
|
||||
public get<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T> {
|
||||
return this.request<T>("get", url, params, config);
|
||||
}
|
||||
|
||||
/** 请求拦截 */
|
||||
private httpInterceptorsRequest(): void {
|
||||
PureHttp.axiosInstance.interceptors.request.use(
|
||||
async (config: PureHttpRequestConfig): Promise<any> => {
|
||||
// 开启进度条动画
|
||||
NProgress.start();
|
||||
// 优先判断post/get等方法是否传入回调,否则执行初始化设置等回调
|
||||
if (typeof config.beforeRequestCallback === "function") {
|
||||
config.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
if (PureHttp.initConfig.beforeRequestCallback) {
|
||||
PureHttp.initConfig.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
/** 请求白名单,放置一些不需要`token`的接口(通过设置请求白名单,防止`token`过期后再请求造成的死循环问题) */
|
||||
const whiteList = ["/refresh-token", "/login"];
|
||||
return whiteList.some(url => config.url.endsWith(url))
|
||||
? config
|
||||
: new Promise(resolve => {
|
||||
const data = getToken();
|
||||
if (data) {
|
||||
const now = new Date().getTime();
|
||||
const expired = parseInt(data.expires) - now <= 0;
|
||||
if (expired) {
|
||||
if (!PureHttp.isRefreshing) {
|
||||
PureHttp.isRefreshing = true;
|
||||
// token过期刷新
|
||||
useUserStoreHook()
|
||||
.handRefreshToken({ refreshToken: data.refreshToken })
|
||||
.then(res => {
|
||||
const token = res.data.accessToken;
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
PureHttp.requests.forEach(cb => cb(token));
|
||||
PureHttp.requests = [];
|
||||
})
|
||||
.finally(() => {
|
||||
PureHttp.isRefreshing = false;
|
||||
});
|
||||
}
|
||||
resolve(PureHttp.retryOriginalRequest(config));
|
||||
} else {
|
||||
config.headers["Authorization"] = formatToken(
|
||||
data.accessToken
|
||||
);
|
||||
resolve(config);
|
||||
}
|
||||
} else {
|
||||
resolve(config);
|
||||
}
|
||||
});
|
||||
},
|
||||
error => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/** 响应拦截 */
|
||||
private httpInterceptorsResponse(): void {
|
||||
const instance = PureHttp.axiosInstance;
|
||||
instance.interceptors.response.use(
|
||||
(response: PureHttpResponse) => {
|
||||
const $config = response.config;
|
||||
// 关闭进度条动画
|
||||
NProgress.done();
|
||||
// 优先判断post/get等方法是否传入回调,否则执行初始化设置等回调
|
||||
if (typeof $config.beforeResponseCallback === "function") {
|
||||
$config.beforeResponseCallback(response);
|
||||
return response.data;
|
||||
}
|
||||
if (PureHttp.initConfig.beforeResponseCallback) {
|
||||
PureHttp.initConfig.beforeResponseCallback(response);
|
||||
return response.data;
|
||||
}
|
||||
return response.data;
|
||||
},
|
||||
(error: PureHttpError) => {
|
||||
const $error = error;
|
||||
$error.isCancelRequest = Axios.isCancel($error);
|
||||
// 关闭进度条动画
|
||||
NProgress.done();
|
||||
// 所有的响应异常 区分来源为取消请求/非取消请求
|
||||
return Promise.reject($error);
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export const http = new PureHttp();
|
|
@ -0,0 +1,47 @@
|
|||
import type {
|
||||
Method,
|
||||
AxiosError,
|
||||
AxiosResponse,
|
||||
AxiosRequestConfig
|
||||
} from "axios";
|
||||
|
||||
export type resultType = {
|
||||
accessToken?: string;
|
||||
};
|
||||
|
||||
export type RequestMethods = Extract<
|
||||
Method,
|
||||
"get" | "post" | "put" | "delete" | "patch" | "option" | "head"
|
||||
>;
|
||||
|
||||
export interface PureHttpError extends AxiosError {
|
||||
isCancelRequest?: boolean;
|
||||
}
|
||||
|
||||
export interface PureHttpResponse extends AxiosResponse {
|
||||
config: PureHttpRequestConfig;
|
||||
}
|
||||
|
||||
export interface PureHttpRequestConfig extends AxiosRequestConfig {
|
||||
beforeRequestCallback?: (request: PureHttpRequestConfig) => void;
|
||||
beforeResponseCallback?: (response: PureHttpResponse) => void;
|
||||
}
|
||||
|
||||
export default class PureHttp {
|
||||
request<T>(
|
||||
method: RequestMethods,
|
||||
url: string,
|
||||
param?: AxiosRequestConfig,
|
||||
axiosConfig?: PureHttpRequestConfig
|
||||
): Promise<T>;
|
||||
post<T, P>(
|
||||
url: string,
|
||||
params?: P,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T>;
|
||||
get<T, P>(
|
||||
url: string,
|
||||
params?: P,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<T>;
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
import { http } from "@/api/service/mockRequest";
|
||||
import type { Result } from "@/types/store/baseStoreState";
|
||||
|
||||
/**
|
||||
* * 获取多语言内容
|
||||
*/
|
||||
export const fetchGetI18n = () => {
|
||||
return http.request<Result<object>>("get", "getI18n");
|
||||
};
|
|
@ -0,0 +1,10 @@
|
|||
import { http } from "@/api/service/mockRequest";
|
||||
|
||||
type Result = {
|
||||
success: boolean;
|
||||
data: Array<any>;
|
||||
};
|
||||
|
||||
export const getAsyncRoutes = () => {
|
||||
return http.request<Result>("get", "/get-async-routes");
|
||||
};
|
|
@ -0,0 +1,85 @@
|
|||
import { http } from "@/utils/http";
|
||||
|
||||
type Result = {
|
||||
success: boolean;
|
||||
data?: Array<any>;
|
||||
};
|
||||
|
||||
type ResultTable = {
|
||||
success: boolean;
|
||||
data?: {
|
||||
/** 列表数据 */
|
||||
list: Array<any>;
|
||||
/** 总条目数 */
|
||||
total?: number;
|
||||
/** 每页显示条目个数 */
|
||||
pageSize?: number;
|
||||
/** 当前页数 */
|
||||
currentPage?: number;
|
||||
};
|
||||
};
|
||||
|
||||
/** 获取系统管理-用户管理列表 */
|
||||
export const getUserList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/user", { data });
|
||||
};
|
||||
|
||||
/** 系统管理-用户管理-获取所有角色列表 */
|
||||
export const getAllRoleList = () => {
|
||||
return http.request<Result>("get", "/list-all-role");
|
||||
};
|
||||
|
||||
/** 系统管理-用户管理-根据userId,获取对应角色id列表(userId:用户id) */
|
||||
export const getRoleIds = (data?: object) => {
|
||||
return http.request<Result>("post", "/list-role-ids", { data });
|
||||
};
|
||||
|
||||
/** 获取系统管理-角色管理列表 */
|
||||
export const getRoleList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/role", { data });
|
||||
};
|
||||
|
||||
/** 获取系统管理-菜单管理列表 */
|
||||
export const getMenuList = (data?: object) => {
|
||||
return http.request<Result>("post", "/menu", { data });
|
||||
};
|
||||
|
||||
/** 获取系统管理-部门管理列表 */
|
||||
export const getDeptList = (data?: object) => {
|
||||
return http.request<Result>("post", "/dept", { data });
|
||||
};
|
||||
|
||||
/** 获取系统监控-在线用户列表 */
|
||||
export const getOnlineLogsList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/online-logs", { data });
|
||||
};
|
||||
|
||||
/** 获取系统监控-登录日志列表 */
|
||||
export const getLoginLogsList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/login-logs", { data });
|
||||
};
|
||||
|
||||
/** 获取系统监控-操作日志列表 */
|
||||
export const getOperationLogsList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/operation-logs", { data });
|
||||
};
|
||||
|
||||
/** 获取系统监控-系统日志列表 */
|
||||
export const getSystemLogsList = (data?: object) => {
|
||||
return http.request<ResultTable>("post", "/system-logs", { data });
|
||||
};
|
||||
|
||||
/** 获取系统监控-系统日志-根据 id 查日志详情 */
|
||||
export const getSystemLogsDetail = (data?: object) => {
|
||||
return http.request<Result>("post", "/system-logs-detail", { data });
|
||||
};
|
||||
|
||||
/** 获取角色管理-权限-菜单权限 */
|
||||
export const getRoleMenu = (data?: object) => {
|
||||
return http.request<Result>("post", "/role-menu", { data });
|
||||
};
|
||||
|
||||
/** 获取角色管理-权限-菜单权限-根据角色 id 查对应菜单 */
|
||||
export const getRoleMenuIds = (data?: object) => {
|
||||
return http.request<Result>("post", "/role-menu-ids", { data });
|
||||
};
|
|
@ -0,0 +1,45 @@
|
|||
import { http } from "@/api/service/mockRequest";
|
||||
|
||||
export type UserResult = {
|
||||
success: boolean;
|
||||
data: {
|
||||
/** 头像 */
|
||||
avatar: string;
|
||||
/** 用户名 */
|
||||
username: string;
|
||||
/** 昵称 */
|
||||
nickname: string;
|
||||
/** 当前登录用户的角色 */
|
||||
roles: Array<string>;
|
||||
/** 按钮级别权限 */
|
||||
permissions: Array<string>;
|
||||
/** `token` */
|
||||
accessToken: string;
|
||||
/** 用于调用刷新`accessToken`的接口时所需的`token` */
|
||||
refreshToken: string;
|
||||
/** `accessToken`的过期时间(格式'xxxx/xx/xx xx:xx:xx') */
|
||||
expires: Date;
|
||||
};
|
||||
};
|
||||
|
||||
export type RefreshTokenResult = {
|
||||
success: boolean;
|
||||
data: {
|
||||
/** `token` */
|
||||
accessToken: string;
|
||||
/** 用于调用刷新`accessToken`的接口时所需的`token` */
|
||||
refreshToken: string;
|
||||
/** `accessToken`的过期时间(格式'xxxx/xx/xx xx:xx:xx') */
|
||||
expires: Date;
|
||||
};
|
||||
};
|
||||
|
||||
/** 登录 */
|
||||
export const getLogin = (data?: object) => {
|
||||
return http.request<UserResult>("post", "/login", { data });
|
||||
};
|
||||
|
||||
/** 刷新`token` */
|
||||
export const refreshTokenApi = (data?: object) => {
|
||||
return http.request<RefreshTokenResult>("post", "/refresh-token", { data });
|
||||
};
|
|
@ -0,0 +1,27 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2208059 */
|
||||
src:
|
||||
url("iconfont.woff2?t=1671895108120") format("woff2"),
|
||||
url("iconfont.woff?t=1671895108120") format("woff"),
|
||||
url("iconfont.ttf?t=1671895108120") format("truetype");
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.pure-iconfont-tabs:before {
|
||||
content: "\e63e";
|
||||
}
|
||||
|
||||
.pure-iconfont-logo:before {
|
||||
content: "\e620";
|
||||
}
|
||||
|
||||
.pure-iconfont-new:before {
|
||||
content: "\e615";
|
||||
}
|
|
@ -0,0 +1,30 @@
|
|||
{
|
||||
"id": "2208059",
|
||||
"name": "pure-admin",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "pure-iconfont-",
|
||||
"description": "pure-admin-iconfont",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "20594647",
|
||||
"name": "Tabs",
|
||||
"font_class": "tabs",
|
||||
"unicode": "e63e",
|
||||
"unicode_decimal": 58942
|
||||
},
|
||||
{
|
||||
"icon_id": "22129506",
|
||||
"name": "PureLogo",
|
||||
"font_class": "logo",
|
||||
"unicode": "e620",
|
||||
"unicode_decimal": 58912
|
||||
},
|
||||
{
|
||||
"icon_id": "7795615",
|
||||
"name": "New",
|
||||
"font_class": "new",
|
||||
"unicode": "e615",
|
||||
"unicode_decimal": 58901
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024"><path fill="#386BF3" d="M410.558.109c0 210.974-300.876 361.752-300.876 633.548 0 174.943 134.704 316.787 300.876 316.787s300.877-141.817 300.877-316.787C711.408 361.752 410.558 210.974 410.558.109"/><path fill="#C3D2FB" d="M613.469 73.665c0 211.055-300.877 361.914-300.877 633.547C312.592 882.156 447.296 1024 613.47 1024s300.876-141.817 300.876-316.788C914.29 435.58 613.469 284.72 613.469 73.665"/><path fill="#303F5B" d="M312.592 707.212c0-183.713 137.636-312.171 226.723-441.39 81.702 106.112 172.12 218.74 172.12 367.726A309.755 309.755 0 0 1 420.36 950.064a323.1 323.1 0 0 1-107.769-242.852z"/></svg>
|
After Width: | Height: | Size: 706 B |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 6.7 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 13 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2.88 18.054a35.9 35.9 0 0 1 8.531-16.32.8.8 0 0 1 1.178 0q.25.27.413.455a35.9 35.9 0 0 1 8.118 15.865c-2.141.451-4.34.747-6.584.874l-2.089 4.178a.5.5 0 0 1-.894 0l-2.089-4.178a44 44 0 0 1-6.584-.874m6.698-1.123 1.157.066L12 19.527l1.265-2.53 1.157-.066a42 42 0 0 0 4.227-.454A33.9 33.9 0 0 0 12 4.09a33.9 33.9 0 0 0-6.649 12.387q2.093.334 4.227.454M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2"/></svg>
|
After Width: | Height: | Size: 533 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.38 2.019a7.5 7.5 0 1 0 10.6 10.6C21.662 17.854 17.316 22 12.001 22 6.477 22 2 17.523 2 12c0-5.315 4.146-9.661 9.38-9.981"/></svg>
|
After Width: | Height: | Size: 262 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12M11 1h2v3h-2zm0 19h2v3h-2zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414zm2.121-14.85 1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414zM23 11v2h-3v-2zM4 11v2H1v-2z"/></svg>
|
After Width: | Height: | Size: 435 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" class="iconify iconify--ant-design" viewBox="0 0 1024 1024"><path fill="currentColor" d="M864 170h-60c-4.4 0-8 3.6-8 8v518H310v-73c0-6.7-7.8-10.5-13-6.3l-141.9 112a8 8 0 0 0 0 12.6l141.9 112c5.3 4.2 13 .4 13-6.3v-75h498c35.3 0 64-28.7 64-64V178c0-4.4-3.6-8-8-8"/></svg>
|
After Width: | Height: | Size: 351 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3.5 4H1V3h2V1h1v2.5zM13 3V1h-1v2.5l.5.5H15V3zm-1 9.5V15h1v-2h2v-1h-2.5zM1 12v1h2v2h1v-2.5l-.5-.5zm11-1.5-.5.5h-7l-.5-.5v-5l.5-.5h7l.5.5zM10 7H6v2h4z"/></svg>
|
After Width: | Height: | Size: 327 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3 12h10V4H3zm2-6h6v4H5zM2 6H1V2.5l.5-.5H5v1H2zm13-3.5V6h-1V3h-3V2h3.5zM14 10h1v3.5l-.5.5H11v-1h3zM2 13h3v1H1.5l-.5-.5V10h1z"/></svg>
|
After Width: | Height: | Size: 302 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="globalization" viewBox="0 0 512 512"><path fill="currentColor" d="m478.33 433.6-90-218a22 22 0 0 0-40.67 0l-90 218a22 22 0 1 0 40.67 16.79L316.66 406h102.67l18.33 44.39A22 22 0 0 0 458 464a22 22 0 0 0 20.32-30.4zM334.83 362 368 281.65 401.17 362zm-66.99-19.08a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.65-53.68 62.11-114.75 71.27-143.49H330a22 22 0 0 0 0-44H214V70a22 22 0 0 0-44 0v20H54a22 22 0 0 0 0 44h197.25c-9.52 26.95-27.05 69.5-53.79 108.36-31.41-41.68-43.08-68.65-43.17-68.87a22 22 0 0 0-40.58 17c.58 1.38 14.55 34.23 52.86 83.93.92 1.19 1.83 2.35 2.74 3.51-39.24 44.35-77.74 71.86-93.85 80.74a22 22 0 1 0 21.07 38.63c2.16-1.18 48.6-26.89 101.63-85.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z"/></svg>
|
After Width: | Height: | Size: 826 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" class="iconify iconify--mdi" viewBox="0 0 24 24"><path fill="currentColor" d="M1 7h6v2H3v2h4v2H3v2h4v2H1zm10 0h4v2h-4v2h2a2 2 0 0 1 2 2v2c0 1.11-.89 2-2 2H9v-2h4v-2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2m8 0h2a2 2 0 0 1 2 2v1h-2V9h-2v6h2v-1h2v1c0 1.11-.89 2-2 2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2"/></svg>
|
After Width: | Height: | Size: 379 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="icon" viewBox="0 0 1024 1024"><path d="M554 849.574c0 23.365-18.635 42.307-42 42.307s-42-18.941-42-42.307V662.719c0-23.365 18.635-42.307 42-42.307v-7.051c23.365 0 42 25.993 42 49.358z"/><path d="M893 888.5c0 17.397-14.103 31.5-31.5 31.5h-700c-17.397 0-31.5-14.103-31.5-31.5s14.103-31.5 31.5-31.5h700c17.397 0 31.5 14.103 31.5 31.5m33-714.074C926 135.484 894.686 105 855.744 105H168.256C129.314 105 98 135.484 98 174.426V533h828zM98 630.988C98 669.931 129.314 702 168.256 702h687.488C894.686 702 926 669.931 926 630.988V596H98z"/></svg>
|
After Width: | Height: | Size: 605 B |
|
@ -0,0 +1 @@
|
|||
<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M13.79 10.21a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42l-2.5-2.5a1 1 0 0 0-.33-.21 1 1 0 0 0-.76 0 1 1 0 0 0-.33.21l-2.5 2.5a1 1 0 0 0 1.42 1.42l.79-.8v5.18l-.79-.8a1 1 0 0 0-1.42 1.42l2.5 2.5a1 1 0 0 0 .33.21.94.94 0 0 0 .76 0 1 1 0 0 0 .33-.21l2.5-2.5a1 1 0 0 0-1.42-1.42l-.79.8V9.41ZM7 4h10a1 1 0 0 0 0-2H7a1 1 0 0 0 0 2m10 16H7a1 1 0 0 0 0 2h10a1 1 0 0 0 0-2"/></svg>
|
After Width: | Height: | Size: 439 B |
|
@ -0,0 +1 @@
|
|||
<svg width="32" height="32" fill="currentColor" aria-hidden="true" data-icon="holder" viewBox="64 64 896 896"><path d="M300 276.5a56 56 0 1 0 56-97 56 56 0 0 0-56 97m0 284a56 56 0 1 0 56-97 56 56 0 0 0-56 97M640 228a56 56 0 1 0 112 0 56 56 0 0 0-112 0m0 284a56 56 0 1 0 112 0 56 56 0 0 0-112 0M300 844.5a56 56 0 1 0 56-97 56 56 0 0 0-56 97M640 796a56 56 0 1 0 112 0 56 56 0 0 0-112 0"/></svg>
|
After Width: | Height: | Size: 392 B |
|
@ -0,0 +1 @@
|
|||
<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M22 4V2H2v2h9v14.17l-5.5-5.5-1.42 1.41L12 22l7.92-7.92-1.42-1.41-5.5 5.5V4z"/></svg>
|
After Width: | Height: | Size: 161 B |
|
@ -0,0 +1 @@
|
|||
<svg width="32" height="32" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 11A8.1 8.1 0 0 0 4.5 9M4 5v4h4m-4 4a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"/></svg>
|
After Width: | Height: | Size: 235 B |
|
@ -0,0 +1 @@
|
|||
<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M3.34 17a10 10 0 0 1-.978-2.326 3 3 0 0 0 .002-5.347A10 10 0 0 1 4.865 4.99a3 3 0 0 0 4.631-2.674 10 10 0 0 1 5.007.002 3 3 0 0 0 4.632 2.672A10 10 0 0 1 20.66 7c.433.749.757 1.53.978 2.326a3 3 0 0 0-.002 5.347 10 10 0 0 1-2.501 4.337 3 3 0 0 0-4.631 2.674 10 10 0 0 1-5.007-.002 3 3 0 0 0-4.632-2.672A10 10 0 0 1 3.34 17m5.66.196a5 5 0 0 1 2.25 2.77q.75.071 1.499.001A5 5 0 0 1 15 17.197a5 5 0 0 1 3.525-.565q.435-.614.748-1.298A5 5 0 0 1 18 12c0-1.26.47-2.437 1.273-3.334a8 8 0 0 0-.75-1.298A5 5 0 0 1 15 6.804a5 5 0 0 1-2.25-2.77q-.75-.071-1.499-.001A5 5 0 0 1 9 6.803a5 5 0 0 1-3.525.565 8 8 0 0 0-.748 1.298A5 5 0 0 1 6 12a5 5 0 0 1-1.273 3.334 8 8 0 0 0 .75 1.298A5 5 0 0 1 9 17.196M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2"/></svg>
|
After Width: | Height: | Size: 840 B |
After Width: | Height: | Size: 3.6 KiB |
|
@ -0,0 +1,7 @@
|
|||
import { withInstall } from "@pureadmin/utils";
|
||||
import reAnimateSelector from "./src/index.vue";
|
||||
|
||||
/** [animate.css](https://animate.style/) 选择器组件 */
|
||||
export const ReAnimateSelector = withInstall(reAnimateSelector);
|
||||
|
||||
export default ReAnimateSelector;
|
|
@ -0,0 +1,114 @@
|
|||
export const animates = [
|
||||
/* Attention seekers */
|
||||
"bounce",
|
||||
"flash",
|
||||
"pulse",
|
||||
"rubberBand",
|
||||
"shakeX",
|
||||
"headShake",
|
||||
"swing",
|
||||
"tada",
|
||||
"wobble",
|
||||
"jello",
|
||||
"heartBeat",
|
||||
/* Back entrances */
|
||||
"backInDown",
|
||||
"backInLeft",
|
||||
"backInRight",
|
||||
"backInUp",
|
||||
/* Back exits */
|
||||
"backOutDown",
|
||||
"backOutLeft",
|
||||
"backOutRight",
|
||||
"backOutUp",
|
||||
/* Bouncing entrances */
|
||||
"bounceIn",
|
||||
"bounceInDown",
|
||||
"bounceInLeft",
|
||||
"bounceInRight",
|
||||
"bounceInUp",
|
||||
/* Bouncing exits */
|
||||
"bounceOut",
|
||||
"bounceOutDown",
|
||||
"bounceOutLeft",
|
||||
"bounceOutRight",
|
||||
"bounceOutUp",
|
||||
/* Fading entrances */
|
||||
"fadeIn",
|
||||
"fadeInDown",
|
||||
"fadeInDownBig",
|
||||
"fadeInLeft",
|
||||
"fadeInLeftBig",
|
||||
"fadeInRight",
|
||||
"fadeInRightBig",
|
||||
"fadeInUp",
|
||||
"fadeInUpBig",
|
||||
"fadeInTopLeft",
|
||||
"fadeInTopRight",
|
||||
"fadeInBottomLeft",
|
||||
"fadeInBottomRight",
|
||||
/* Fading exits */
|
||||
"fadeOut",
|
||||
"fadeOutDown",
|
||||
"fadeOutDownBig",
|
||||
"fadeOutLeft",
|
||||
"fadeOutLeftBig",
|
||||
"fadeOutRight",
|
||||
"fadeOutRightBig",
|
||||
"fadeOutUp",
|
||||
"fadeOutUpBig",
|
||||
"fadeOutTopLeft",
|
||||
"fadeOutTopRight",
|
||||
"fadeOutBottomRight",
|
||||
"fadeOutBottomLeft",
|
||||
/* Flippers */
|
||||
"flip",
|
||||
"flipInX",
|
||||
"flipInY",
|
||||
"flipOutX",
|
||||
"flipOutY",
|
||||
/* Lightspeed */
|
||||
"lightSpeedInRight",
|
||||
"lightSpeedInLeft",
|
||||
"lightSpeedOutRight",
|
||||
"lightSpeedOutLeft",
|
||||
/* Rotating entrances */
|
||||
"rotateIn",
|
||||
"rotateInDownLeft",
|
||||
"rotateInDownRight",
|
||||
"rotateInUpLeft",
|
||||
"rotateInUpRight",
|
||||
/* Rotating exits */
|
||||
"rotateOut",
|
||||
"rotateOutDownLeft",
|
||||
"rotateOutDownRight",
|
||||
"rotateOutUpLeft",
|
||||
"rotateOutUpRight",
|
||||
/* Specials */
|
||||
"hinge",
|
||||
"jackInTheBox",
|
||||
"rollIn",
|
||||
"rollOut",
|
||||
/* Zooming entrances */
|
||||
"zoomIn",
|
||||
"zoomInDown",
|
||||
"zoomInLeft",
|
||||
"zoomInRight",
|
||||
"zoomInUp",
|
||||
/* Zooming exits */
|
||||
"zoomOut",
|
||||
"zoomOutDown",
|
||||
"zoomOutLeft",
|
||||
"zoomOutRight",
|
||||
"zoomOutUp",
|
||||
/* Sliding entrances */
|
||||
"slideInDown",
|
||||
"slideInLeft",
|
||||
"slideInRight",
|
||||
"slideInUp",
|
||||
/* Sliding exits */
|
||||
"slideOutDown",
|
||||
"slideOutLeft",
|
||||
"slideOutRight",
|
||||
"slideOutUp"
|
||||
];
|
|
@ -0,0 +1,136 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, computed } from "vue";
|
||||
import { animates } from "./animate";
|
||||
import { cloneDeep } from "@pureadmin/utils";
|
||||
|
||||
defineOptions({
|
||||
name: "ReAnimateSelector"
|
||||
});
|
||||
|
||||
defineProps({
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: "请选择动画"
|
||||
}
|
||||
});
|
||||
|
||||
const inputValue = defineModel({ type: String });
|
||||
|
||||
const searchVal = ref();
|
||||
const animatesList = ref(animates);
|
||||
const copyAnimatesList = cloneDeep(animatesList);
|
||||
|
||||
const animateClass = computed(() => {
|
||||
return [
|
||||
"mt-1",
|
||||
"flex",
|
||||
"border",
|
||||
"w-[130px]",
|
||||
"h-[100px]",
|
||||
"items-center",
|
||||
"cursor-pointer",
|
||||
"transition-all",
|
||||
"justify-center",
|
||||
"border-[#e5e7eb]",
|
||||
"hover:text-primary",
|
||||
"hover:duration-[700ms]"
|
||||
];
|
||||
});
|
||||
|
||||
const animateStyle = computed(
|
||||
() => (i: string) =>
|
||||
inputValue.value === i
|
||||
? {
|
||||
borderColor: "var(--el-color-primary)",
|
||||
color: "var(--el-color-primary)"
|
||||
}
|
||||
: ""
|
||||
);
|
||||
|
||||
function onChangeIcon(animate: string) {
|
||||
inputValue.value = animate;
|
||||
}
|
||||
|
||||
function onClear() {
|
||||
inputValue.value = "";
|
||||
}
|
||||
|
||||
function filterMethod(value: any) {
|
||||
searchVal.value = value;
|
||||
animatesList.value = copyAnimatesList.value.filter((i: string | any[]) =>
|
||||
i.includes(value)
|
||||
);
|
||||
}
|
||||
|
||||
const animateMap = ref({});
|
||||
function onMouseEnter(index: string | number) {
|
||||
animateMap.value[index] = animateMap.value[index]?.loading
|
||||
? Object.assign({}, animateMap.value[index], {
|
||||
loading: false
|
||||
})
|
||||
: Object.assign({}, animateMap.value[index], {
|
||||
loading: true
|
||||
});
|
||||
}
|
||||
function onMouseleave() {
|
||||
animateMap.value = {};
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-select
|
||||
clearable
|
||||
filterable
|
||||
:placeholder="placeholder"
|
||||
popper-class="pure-animate-popper"
|
||||
:model-value="inputValue"
|
||||
:filter-method="filterMethod"
|
||||
@clear="onClear"
|
||||
>
|
||||
<template #empty>
|
||||
<div class="w-[280px]">
|
||||
<el-scrollbar
|
||||
noresize
|
||||
height="212px"
|
||||
:view-style="{ overflow: 'hidden' }"
|
||||
class="border-t border-[#e5e7eb]"
|
||||
>
|
||||
<ul class="flex flex-wrap justify-around mb-1">
|
||||
<li
|
||||
v-for="(animate, index) in animatesList"
|
||||
:key="index"
|
||||
:class="animateClass"
|
||||
:style="animateStyle(animate)"
|
||||
@mouseenter.prevent="onMouseEnter(index)"
|
||||
@mouseleave.prevent="onMouseleave"
|
||||
@click="onChangeIcon(animate)"
|
||||
>
|
||||
<h4
|
||||
:class="[
|
||||
`animate__animated animate__${
|
||||
animateMap[index]?.loading
|
||||
? animate + ' animate__infinite'
|
||||
: ''
|
||||
} `
|
||||
]"
|
||||
>
|
||||
{{ animate }}
|
||||
</h4>
|
||||
</li>
|
||||
</ul>
|
||||
<el-empty
|
||||
v-show="animatesList.length === 0"
|
||||
:description="`${searchVal} 动画不存在`"
|
||||
:image-size="60"
|
||||
/>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</template>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.pure-animate-popper {
|
||||
min-width: 0 !important;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,5 @@
|
|||
import auth from "./src/auth";
|
||||
|
||||
const Auth = auth;
|
||||
|
||||
export { Auth };
|
|
@ -0,0 +1,20 @@
|
|||
import { defineComponent, Fragment } from "vue";
|
||||
import { hasAuth } from "@/router/utils";
|
||||
|
||||
export default defineComponent({
|
||||
name: "Auth",
|
||||
props: {
|
||||
value: {
|
||||
type: undefined,
|
||||
default: []
|
||||
}
|
||||
},
|
||||
setup(props, { slots }) {
|
||||
return () => {
|
||||
if (!slots) return null;
|
||||
return hasAuth(props.value) ? (
|
||||
<Fragment>{slots.default?.()}</Fragment>
|
||||
) : null;
|
||||
};
|
||||
}
|
||||
});
|