release: update 5.4.0
This commit is contained in:
xiaoxian521
parent
270df1b17a
commit
e25f4bcf39
@ -1,11 +0,0 @@
|
||||
public
|
||||
dist
|
||||
*.d.ts
|
||||
/src/assets
|
||||
package.json
|
||||
eslint.config.js
|
||||
.prettierrc.js
|
||||
commitlint.config.js
|
||||
postcss.config.js
|
||||
tailwind.config.ts
|
||||
stylelint.config.js
|
||||
120
.eslintrc.js
120
.eslintrc.js
@ -1,120 +0,0 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
globals: {
|
||||
// Ref sugar (take 2)
|
||||
$: "readonly",
|
||||
$$: "readonly",
|
||||
$ref: "readonly",
|
||||
$shallowRef: "readonly",
|
||||
$computed: "readonly",
|
||||
|
||||
// index.d.ts
|
||||
// global.d.ts
|
||||
Fn: "readonly",
|
||||
PromiseFn: "readonly",
|
||||
RefType: "readonly",
|
||||
LabelValueOptions: "readonly",
|
||||
EmitType: "readonly",
|
||||
TargetContext: "readonly",
|
||||
ComponentElRef: "readonly",
|
||||
ComponentRef: "readonly",
|
||||
ElRef: "readonly",
|
||||
global: "readonly",
|
||||
ForDataType: "readonly",
|
||||
ComponentRoutes: "readonly",
|
||||
|
||||
// script setup
|
||||
defineProps: "readonly",
|
||||
defineEmits: "readonly",
|
||||
defineExpose: "readonly",
|
||||
withDefaults: "readonly"
|
||||
},
|
||||
extends: [
|
||||
"plugin:vue/vue3-essential",
|
||||
"eslint:recommended",
|
||||
"@vue/typescript/recommended",
|
||||
"@vue/prettier",
|
||||
"@vue/eslint-config-typescript"
|
||||
],
|
||||
parser: "vue-eslint-parser",
|
||||
parserOptions: {
|
||||
parser: "@typescript-eslint/parser",
|
||||
ecmaVersion: 2020,
|
||||
sourceType: "module",
|
||||
jsxPragma: "React",
|
||||
ecmaFeatures: {
|
||||
jsx: true
|
||||
}
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
files: ["*.ts", "*.vue"],
|
||||
rules: {
|
||||
"no-undef": "off"
|
||||
}
|
||||
},
|
||||
{
|
||||
files: ["*.vue"],
|
||||
parser: "vue-eslint-parser",
|
||||
parserOptions: {
|
||||
parser: "@typescript-eslint/parser",
|
||||
extraFileExtensions: [".vue"],
|
||||
ecmaVersion: "latest",
|
||||
ecmaFeatures: {
|
||||
jsx: true
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
"no-undef": "off"
|
||||
}
|
||||
}
|
||||
],
|
||||
rules: {
|
||||
"vue/no-v-html": "off",
|
||||
"vue/require-default-prop": "off",
|
||||
"vue/require-explicit-emits": "off",
|
||||
"vue/multi-word-component-names": "off",
|
||||
"@typescript-eslint/no-explicit-any": "off", // any
|
||||
"no-debugger": "off",
|
||||
"@typescript-eslint/explicit-module-boundary-types": "off", // setup()
|
||||
"@typescript-eslint/ban-types": "off",
|
||||
"@typescript-eslint/ban-ts-comment": "off",
|
||||
"@typescript-eslint/no-empty-function": "off",
|
||||
"@typescript-eslint/no-non-null-assertion": "off",
|
||||
"vue/html-self-closing": [
|
||||
"error",
|
||||
{
|
||||
html: {
|
||||
void: "always",
|
||||
normal: "always",
|
||||
component: "always"
|
||||
},
|
||||
svg: "always",
|
||||
math: "always"
|
||||
}
|
||||
],
|
||||
"@typescript-eslint/no-unused-vars": [
|
||||
"error",
|
||||
{
|
||||
argsIgnorePattern: "^_",
|
||||
varsIgnorePattern: "^_"
|
||||
}
|
||||
],
|
||||
"no-unused-vars": [
|
||||
"error",
|
||||
{
|
||||
argsIgnorePattern: "^_",
|
||||
varsIgnorePattern: "^_"
|
||||
}
|
||||
],
|
||||
"prettier/prettier": [
|
||||
"error",
|
||||
{
|
||||
endOfLine: "auto"
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
@ -10,7 +10,14 @@ import pluginTypeScript from "@typescript-eslint/eslint-plugin";
|
||||
export default defineFlatConfig([
|
||||
{
|
||||
...js.configs.recommended,
|
||||
ignores: ["src/assets/**", "src/**/iconfont/**"],
|
||||
ignores: [
|
||||
"**/.*",
|
||||
"dist/*",
|
||||
"*.d.ts",
|
||||
"public/*",
|
||||
"src/assets/**",
|
||||
"src/**/iconfont/**"
|
||||
],
|
||||
languageOptions: {
|
||||
globals: {
|
||||
// index.d.ts
|
||||
|
||||
@ -10,7 +10,9 @@ export default defineFakeRoute([
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
avatar: "https://avatars.githubusercontent.com/u/44761321",
|
||||
username: "admin",
|
||||
nickname: "小铭",
|
||||
// 一个用户可能有多个角色
|
||||
roles: ["admin"],
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.admin",
|
||||
@ -22,8 +24,9 @@ export default defineFakeRoute([
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
avatar: "https://avatars.githubusercontent.com/u/52823142",
|
||||
username: "common",
|
||||
// 一个用户可能有多个角色
|
||||
nickname: "小林",
|
||||
roles: ["common"],
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.common",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.commonRefresh",
|
||||
|
||||
51
package.json
51
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "pure-admin-thin",
|
||||
"version": "5.3.0",
|
||||
"version": "5.4.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
@ -13,7 +13,6 @@
|
||||
"preview:build": "pnpm build && vite preview",
|
||||
"typecheck": "tsc --noEmit && vue-tsc --noEmit --skipLibCheck",
|
||||
"svgo": "svgo -f . -r",
|
||||
"cloc": "NODE_OPTIONS=--max-old-space-size=4096 cloc . --exclude-dir=node_modules --exclude-lang=YAML",
|
||||
"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}\"",
|
||||
@ -57,51 +56,50 @@
|
||||
"axios": "^1.6.8",
|
||||
"dayjs": "^1.11.10",
|
||||
"echarts": "^5.5.0",
|
||||
"element-plus": "^2.6.2",
|
||||
"element-plus": "^2.7.1",
|
||||
"js-cookie": "^3.0.5",
|
||||
"localforage": "^1.10.0",
|
||||
"mitt": "^3.0.1",
|
||||
"nprogress": "^0.2.0",
|
||||
"path": "^0.12.7",
|
||||
"pinia": "^2.1.7",
|
||||
"pinyin-pro": "^3.19.6",
|
||||
"qs": "^6.12.0",
|
||||
"pinyin-pro": "^3.20.2",
|
||||
"qs": "^6.12.1",
|
||||
"responsive-storage": "^2.2.0",
|
||||
"sortablejs": "^1.15.2",
|
||||
"vue": "^3.4.21",
|
||||
"vue-router": "^4.3.0",
|
||||
"vue": "^3.4.23",
|
||||
"vue-router": "^4.3.2",
|
||||
"vue-tippy": "^6.4.1",
|
||||
"vue-types": "^5.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^19.2.1",
|
||||
"@commitlint/config-conventional": "^19.1.0",
|
||||
"@commitlint/cli": "^19.2.2",
|
||||
"@commitlint/config-conventional": "^19.2.2",
|
||||
"@commitlint/types": "^19.0.3",
|
||||
"@eslint/js": "^8.57.0",
|
||||
"@eslint/js": "^9.1.1",
|
||||
"@faker-js/faker": "^8.4.1",
|
||||
"@iconify-icons/ep": "^1.2.12",
|
||||
"@iconify-icons/ri": "^1.2.10",
|
||||
"@iconify/vue": "^4.1.1",
|
||||
"@iconify/vue": "^4.1.2",
|
||||
"@pureadmin/theme": "^3.2.0",
|
||||
"@types/gradient-string": "^1.1.5",
|
||||
"@types/gradient-string": "^1.1.6",
|
||||
"@types/js-cookie": "^3.0.6",
|
||||
"@types/node": "^20.11.30",
|
||||
"@types/node": "^20.12.7",
|
||||
"@types/nprogress": "^0.2.3",
|
||||
"@types/qs": "^6.9.14",
|
||||
"@types/qs": "^6.9.15",
|
||||
"@types/sortablejs": "^1.15.8",
|
||||
"@typescript-eslint/eslint-plugin": "^7.4.0",
|
||||
"@typescript-eslint/parser": "^7.4.0",
|
||||
"@typescript-eslint/eslint-plugin": "^7.7.0",
|
||||
"@typescript-eslint/parser": "^7.7.0",
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"boxen": "^7.1.1",
|
||||
"cloc": "^2.11.0",
|
||||
"cssnano": "^6.1.2",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint": "^9.1.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-define-config": "^2.1.0",
|
||||
"eslint-plugin-prettier": "^5.1.3",
|
||||
"eslint-plugin-vue": "^9.24.0",
|
||||
"eslint-plugin-vue": "^9.25.0",
|
||||
"gradient-string": "^2.0.2",
|
||||
"husky": "^9.0.11",
|
||||
"lint-staged": "^15.2.2",
|
||||
@ -112,16 +110,16 @@
|
||||
"prettier": "^3.2.5",
|
||||
"rimraf": "^5.0.5",
|
||||
"rollup-plugin-visualizer": "^5.12.0",
|
||||
"sass": "^1.72.0",
|
||||
"sass": "^1.75.0",
|
||||
"stylelint": "^16.3.1",
|
||||
"stylelint-config-recess-order": "^5.0.0",
|
||||
"stylelint-config-recess-order": "^5.0.1",
|
||||
"stylelint-config-recommended-vue": "^1.5.0",
|
||||
"stylelint-config-standard-scss": "^13.0.0",
|
||||
"stylelint-config-standard-scss": "^13.1.0",
|
||||
"stylelint-prettier": "^5.0.0",
|
||||
"svgo": "^3.2.0",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"typescript": "^5.4.3",
|
||||
"vite": "^5.2.6",
|
||||
"typescript": "^5.4.5",
|
||||
"vite": "^5.2.10",
|
||||
"vite-plugin-cdn-import": "^0.3.5",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-fake-server": "^2.1.1",
|
||||
@ -143,6 +141,11 @@
|
||||
"w3c-hr-time": "*",
|
||||
"stable": "*",
|
||||
"abab": "*"
|
||||
},
|
||||
"peerDependencyRules": {
|
||||
"allowedVersions": {
|
||||
"eslint": "9"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
1105
pnpm-lock.yaml
generated
1105
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,5 @@
|
||||
{
|
||||
"Version": "5.3.0",
|
||||
"Version": "5.4.0",
|
||||
"Title": "PureAdmin",
|
||||
"FixedHeader": true,
|
||||
"HiddenSideBar": false,
|
||||
|
||||
@ -8,8 +8,9 @@
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
|
||||
import { ReDialog } from "@/components/ReDialog";
|
||||
import zhCn from "element-plus/es/locale/lang/zh-cn";
|
||||
|
||||
export default defineComponent({
|
||||
name: "app",
|
||||
components: {
|
||||
|
||||
@ -3,9 +3,13 @@ import { http } from "@/utils/http";
|
||||
export type UserResult = {
|
||||
success: boolean;
|
||||
data: {
|
||||
/** 头像 */
|
||||
avatar: string;
|
||||
/** 用户名 */
|
||||
username: string;
|
||||
/** 当前登陆用户的角色 */
|
||||
/** 昵称 */
|
||||
nickname: string;
|
||||
/** 当前登录用户的角色 */
|
||||
roles: Array<string>;
|
||||
/** `token` */
|
||||
accessToken: string;
|
||||
@ -33,7 +37,7 @@ export const getLogin = (data?: object) => {
|
||||
return http.request<UserResult>("post", "/login", { data });
|
||||
};
|
||||
|
||||
/** 刷新token */
|
||||
/** 刷新`token` */
|
||||
export const refreshTokenApi = (data?: object) => {
|
||||
return http.request<RefreshTokenResult>("post", "/refresh-token", { data });
|
||||
};
|
||||
|
||||
@ -11,6 +11,10 @@ import { isFunction } from "@pureadmin/utils";
|
||||
import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
|
||||
import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
|
||||
|
||||
defineOptions({
|
||||
name: "ReDialog"
|
||||
});
|
||||
|
||||
const fullscreen = ref(false);
|
||||
|
||||
const footerButtons = computed(() => {
|
||||
@ -37,6 +41,7 @@ const footerButtons = computed(() => {
|
||||
type: "primary",
|
||||
text: true,
|
||||
bg: true,
|
||||
popconfirm: options?.popconfirm,
|
||||
btnClick: ({ dialog: { options, index } }) => {
|
||||
const done = () =>
|
||||
closeDialog(options, index, { command: "sure" });
|
||||
@ -149,19 +154,34 @@ function handleClose(
|
||||
<component :is="options?.footerRenderer({ options, index })" />
|
||||
</template>
|
||||
<span v-else>
|
||||
<el-button
|
||||
v-for="(btn, key) in footerButtons(options)"
|
||||
:key="key"
|
||||
v-bind="btn"
|
||||
@click="
|
||||
btn.btnClick({
|
||||
dialog: { options, index },
|
||||
button: { btn, index: key }
|
||||
})
|
||||
"
|
||||
>
|
||||
{{ btn?.label }}
|
||||
</el-button>
|
||||
<template v-for="(btn, key) in footerButtons(options)" :key="key">
|
||||
<el-popconfirm
|
||||
v-if="btn.popconfirm"
|
||||
v-bind="btn.popconfirm"
|
||||
@confirm="
|
||||
btn.btnClick({
|
||||
dialog: { options, index },
|
||||
button: { btn, index: key }
|
||||
})
|
||||
"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button v-bind="btn">{{ btn?.label }}</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
<el-button
|
||||
v-else
|
||||
v-bind="btn"
|
||||
@click="
|
||||
btn.btnClick({
|
||||
dialog: { options, index },
|
||||
button: { btn, index: key }
|
||||
})
|
||||
"
|
||||
>
|
||||
{{ btn?.label }}
|
||||
</el-button>
|
||||
</template>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
@ -11,6 +11,13 @@ type ArgsType = {
|
||||
/** `cancel` 点击取消按钮、`sure` 点击确定按钮、`close` 点击右上角关闭按钮或空白页或按下了esc键 */
|
||||
command: "cancel" | "sure" | "close";
|
||||
};
|
||||
type ButtonType =
|
||||
| "primary"
|
||||
| "success"
|
||||
| "warning"
|
||||
| "danger"
|
||||
| "info"
|
||||
| "text";
|
||||
|
||||
/** https://element-plus.org/zh-CN/component/dialog.html#attributes */
|
||||
type DialogProps = {
|
||||
@ -58,6 +65,34 @@ type DialogProps = {
|
||||
destroyOnClose?: boolean;
|
||||
};
|
||||
|
||||
//element-plus.org/zh-CN/component/popconfirm.html#attributes
|
||||
type Popconfirm = {
|
||||
/** 标题 */
|
||||
title?: string;
|
||||
/** 确认按钮文字 */
|
||||
confirmButtonText?: string;
|
||||
/** 取消按钮文字 */
|
||||
cancelButtonText?: string;
|
||||
/** 确认按钮类型，默认 `primary` */
|
||||
confirmButtonType?: ButtonType;
|
||||
/** 取消按钮类型，默认 `text` */
|
||||
cancelButtonType?: ButtonType;
|
||||
/** 自定义图标，默认 `QuestionFilled` */
|
||||
icon?: string | Component;
|
||||
/** `Icon` 颜色，默认 `#f90` */
|
||||
iconColor?: string;
|
||||
/** 是否隐藏 `Icon`，默认 `false` */
|
||||
hideIcon?: boolean;
|
||||
/** 关闭时的延迟，默认 `200` */
|
||||
hideAfter?: number;
|
||||
/** 是否将 `popover` 的下拉列表插入至 `body` 元素，默认 `true` */
|
||||
teleported?: boolean;
|
||||
/** 当 `popover` 组件长时间不触发且 `persistent` 属性设置为 `false` 时, `popover` 将会被删除，默认 `false` */
|
||||
persistent?: boolean;
|
||||
/** 弹层宽度，最小宽度 `150px`，默认 `150` */
|
||||
width?: string | number;
|
||||
};
|
||||
|
||||
type BtnClickDialog = {
|
||||
options?: DialogOptions;
|
||||
index?: number;
|
||||
@ -86,6 +121,8 @@ type ButtonProps = {
|
||||
round?: boolean;
|
||||
/** 是否为圆形按钮，默认 `false` */
|
||||
circle?: boolean;
|
||||
/** 确认按钮的 `Popconfirm` 气泡确认框相关配置 */
|
||||
popconfirm?: Popconfirm;
|
||||
/** 是否为加载中状态，默认 `false` */
|
||||
loading?: boolean;
|
||||
/** 自定义加载中状态图标组件 */
|
||||
@ -123,6 +160,8 @@ interface DialogOptions extends DialogProps {
|
||||
props?: any;
|
||||
/** 是否隐藏 `Dialog` 按钮操作区的内容 */
|
||||
hideFooter?: boolean;
|
||||
/** 确认按钮的 `Popconfirm` 气泡确认框相关配置 */
|
||||
popconfirm?: Popconfirm;
|
||||
/**
|
||||
* @description 自定义对话框标题的内容渲染器
|
||||
* @see {@link https://element-plus.org/zh-CN/component/dialog.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E5%A4%B4%E9%83%A8}
|
||||
|
||||
@ -6,7 +6,7 @@ import fontIcon from "./src/iconfont";
|
||||
const IconifyIconOffline = iconifyIconOffline;
|
||||
/** 在线图标组件 */
|
||||
const IconifyIconOnline = iconifyIconOnline;
|
||||
/** iconfont组件 */
|
||||
/** `iconfont`组件 */
|
||||
const FontIcon = fontIcon;
|
||||
|
||||
export { IconifyIconOffline, IconifyIconOnline, FontIcon };
|
||||
|
||||
@ -1,6 +1,14 @@
|
||||
import Sortable from "sortablejs";
|
||||
import { useEpThemeStoreHook } from "@/store/modules/epTheme";
|
||||
import { defineComponent, ref, computed, type PropType, nextTick } from "vue";
|
||||
import {
|
||||
type PropType,
|
||||
ref,
|
||||
unref,
|
||||
computed,
|
||||
nextTick,
|
||||
defineComponent,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
import {
|
||||
delay,
|
||||
cloneDeep,
|
||||
@ -33,6 +41,10 @@ const props = {
|
||||
isExpandAll: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
tableKey: {
|
||||
type: [String, Number] as PropType<string | number>,
|
||||
default: "0"
|
||||
}
|
||||
};
|
||||
|
||||
@ -45,6 +57,7 @@ export default defineComponent({
|
||||
const loading = ref(false);
|
||||
const checkAll = ref(true);
|
||||
const isIndeterminate = ref(false);
|
||||
const instance = getCurrentInstance()!;
|
||||
const isExpandAll = ref(props.isExpandAll);
|
||||
const filterColumns = cloneDeep(props?.columns).filter(column =>
|
||||
isBoolean(column?.hide)
|
||||
@ -167,9 +180,9 @@ export default defineComponent({
|
||||
const rowDrop = (event: { preventDefault: () => void }) => {
|
||||
event.preventDefault();
|
||||
nextTick(() => {
|
||||
const wrapper: HTMLElement = document.querySelector(
|
||||
".el-checkbox-group>div"
|
||||
);
|
||||
const wrapper: HTMLElement = (
|
||||
instance?.proxy?.$refs[`GroupRef${unref(props.tableKey)}`] as any
|
||||
).$el.firstElementChild;
|
||||
Sortable.create(wrapper, {
|
||||
animation: 300,
|
||||
handle: ".drag-btn",
|
||||
@ -294,6 +307,7 @@ export default defineComponent({
|
||||
<div class="pt-[6px] pl-[11px]">
|
||||
<el-scrollbar max-height="36vh">
|
||||
<el-checkbox-group
|
||||
ref={`GroupRef${unref(props.tableKey)}`}
|
||||
modelValue={checkedColumns.value}
|
||||
onChange={value => handleCheckedColumnsChange(value)}
|
||||
>
|
||||
|
||||
@ -34,9 +34,19 @@ const props = {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
/** 控件尺寸 */
|
||||
/** 控件尺寸 */
|
||||
size: {
|
||||
type: String as PropType<"small" | "default" | "large">
|
||||
},
|
||||
/** 是否全局禁用，默认 `false` */
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
/** 当内容发生变化时，设置 `resize` 可使其自适应容器位置 */
|
||||
resize: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
};
|
||||
|
||||
@ -57,7 +67,7 @@ export default defineComponent({
|
||||
: ref(0);
|
||||
|
||||
function handleChange({ option, index }, event: Event) {
|
||||
if (option.disabled) return;
|
||||
if (props.disabled || option.disabled) return;
|
||||
event.preventDefault();
|
||||
isNumber(props.modelValue)
|
||||
? emit("update:modelValue", index)
|
||||
@ -67,6 +77,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
function handleMouseenter({ option, index }, event: Event) {
|
||||
if (props.disabled) return;
|
||||
event.preventDefault();
|
||||
curMouseActive.value = index;
|
||||
if (option.disabled || curIndex.value === index) {
|
||||
@ -79,6 +90,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
function handleMouseleave(_, event: Event) {
|
||||
if (props.disabled) return;
|
||||
event.preventDefault();
|
||||
curMouseActive.value = -1;
|
||||
}
|
||||
@ -101,7 +113,7 @@ export default defineComponent({
|
||||
});
|
||||
}
|
||||
|
||||
props.block && handleResizeInit();
|
||||
(props.block || props.resize) && handleResizeInit();
|
||||
|
||||
watch(
|
||||
() => curIndex.value,
|
||||
@ -124,14 +136,16 @@ export default defineComponent({
|
||||
ref={`labelRef${index}`}
|
||||
class={[
|
||||
"pure-segmented-item",
|
||||
option?.disabled && "pure-segmented-item-disabled"
|
||||
(props.disabled || option?.disabled) &&
|
||||
"pure-segmented-item-disabled"
|
||||
]}
|
||||
style={{
|
||||
background:
|
||||
curMouseActive.value === index ? segmentedItembg.value : "",
|
||||
color:
|
||||
!option.disabled &&
|
||||
(curIndex.value === index || curMouseActive.value === index)
|
||||
color: props.disabled
|
||||
? null
|
||||
: !option.disabled &&
|
||||
(curIndex.value === index || curMouseActive.value === index)
|
||||
? isDark.value
|
||||
? "rgba(255, 255, 255, 0.85)"
|
||||
: "rgba(0,0,0,.88)"
|
||||
|
||||
@ -2,6 +2,10 @@
|
||||
import { h, onMounted, ref, useSlots } from "vue";
|
||||
import { type TippyOptions, useTippy } from "vue-tippy";
|
||||
|
||||
defineOptions({
|
||||
name: "ReText"
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
// 行数
|
||||
lineClamp: {
|
||||
|
||||
@ -35,7 +35,7 @@ export const getPlatformConfig = async (app: App): Promise<undefined> => {
|
||||
})
|
||||
.then(({ data: config }) => {
|
||||
let $config = app.config.globalProperties.$config;
|
||||
// 自动注入项目配置
|
||||
// 自动注入系统配置
|
||||
if (app && $config && typeof config === "object") {
|
||||
$config = Object.assign($config, config);
|
||||
app.config.globalProperties.$config = $config;
|
||||
|
||||
@ -65,7 +65,7 @@ const {
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
title="打开项目配置"
|
||||
title="打开系统配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline :icon="Setting" />
|
||||
@ -123,7 +123,7 @@ const {
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
width: 120px;
|
||||
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
display: inline-flex;
|
||||
|
||||
@ -51,7 +51,7 @@ onBeforeUnmount(() => {
|
||||
<div
|
||||
class="project-configuration border-b-[1px] border-solid border-[var(--pure-border-color)]"
|
||||
>
|
||||
<h4 class="dark:text-white">项目配置</h4>
|
||||
<h4 class="dark:text-white">系统配置</h4>
|
||||
<span
|
||||
v-tippy="{
|
||||
content: '关闭配置',
|
||||
|
||||
@ -145,18 +145,20 @@ function setFalse(Doms): any {
|
||||
}
|
||||
|
||||
/** 页宽 */
|
||||
const stretchTypeOptions: Array<OptionsType> = [
|
||||
{
|
||||
label: "固定",
|
||||
tip: "紧凑页面，轻松找到所需信息",
|
||||
value: "fixed"
|
||||
},
|
||||
{
|
||||
label: "自定义",
|
||||
tip: "最小1280、最大1600",
|
||||
value: "custom"
|
||||
}
|
||||
];
|
||||
const stretchTypeOptions = computed<Array<OptionsType>>(() => {
|
||||
return [
|
||||
{
|
||||
label: "固定",
|
||||
tip: "紧凑页面，轻松找到所需信息",
|
||||
value: "fixed"
|
||||
},
|
||||
{
|
||||
label: "自定义",
|
||||
tip: "最小1280、最大1600",
|
||||
value: "custom"
|
||||
}
|
||||
];
|
||||
});
|
||||
|
||||
const setStretch = value => {
|
||||
settings.stretch = value;
|
||||
@ -217,18 +219,20 @@ const themeOptions = computed<Array<OptionsType>>(() => {
|
||||
];
|
||||
});
|
||||
|
||||
const markOptions: Array<OptionsType> = [
|
||||
{
|
||||
label: "灵动",
|
||||
tip: "灵动标签，添趣生辉",
|
||||
value: "smart"
|
||||
},
|
||||
{
|
||||
label: "卡片",
|
||||
tip: "卡片标签，高效浏览",
|
||||
value: "card"
|
||||
}
|
||||
];
|
||||
const markOptions = computed<Array<OptionsType>>(() => {
|
||||
return [
|
||||
{
|
||||
label: "灵动",
|
||||
tip: "灵动标签，添趣生辉",
|
||||
value: "smart"
|
||||
},
|
||||
{
|
||||
label: "卡片",
|
||||
tip: "卡片标签，高效浏览",
|
||||
value: "card"
|
||||
}
|
||||
];
|
||||
});
|
||||
|
||||
/** 设置导航模式 */
|
||||
function setLayoutModel(layout: string) {
|
||||
@ -291,7 +295,7 @@ function watchSystemThemeChange() {
|
||||
}
|
||||
|
||||
onBeforeMount(() => {
|
||||
/* 初始化项目配置 */
|
||||
/* 初始化系统配置 */
|
||||
nextTick(() => {
|
||||
watchSystemThemeChange();
|
||||
settings.greyVal &&
|
||||
@ -311,6 +315,7 @@ onUnmounted(() => removeMatchMedia);
|
||||
<div class="p-5">
|
||||
<p :class="pClass">整体风格</p>
|
||||
<Segmented
|
||||
resize
|
||||
class="select-none"
|
||||
:modelValue="overallStyle === 'system' ? 2 : dataTheme ? 1 : 0"
|
||||
:options="themeOptions"
|
||||
@ -390,6 +395,7 @@ onUnmounted(() => removeMatchMedia);
|
||||
<span v-if="useAppStoreHook().getViewportWidth > 1280">
|
||||
<p :class="['mt-5', pClass]">页宽</p>
|
||||
<Segmented
|
||||
resize
|
||||
class="mb-2 select-none"
|
||||
:modelValue="isNumber(settings.stretch) ? 1 : 0"
|
||||
:options="stretchTypeOptions"
|
||||
@ -432,6 +438,7 @@ onUnmounted(() => removeMatchMedia);
|
||||
|
||||
<p :class="['mt-4', pClass]">页签风格</p>
|
||||
<Segmented
|
||||
resize
|
||||
class="select-none"
|
||||
:modelValue="markValue === 'smart' ? 0 : 1"
|
||||
:options="markOptions"
|
||||
|
||||
@ -84,7 +84,7 @@ nextTick(() => {
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
title="打开项目配置"
|
||||
title="打开系统配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline :icon="Setting" />
|
||||
@ -99,7 +99,7 @@ nextTick(() => {
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
width: 120px;
|
||||
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
display: inline-flex;
|
||||
|
||||
@ -116,7 +116,7 @@ watch(
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
title="打开项目配置"
|
||||
title="打开系统配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline :icon="Setting" />
|
||||
@ -131,7 +131,7 @@ watch(
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
width: 120px;
|
||||
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
display: inline-flex;
|
||||
|
||||
@ -144,7 +144,7 @@ function resolvePath(routePath) {
|
||||
props.item?.pathList?.length === 2)
|
||||
"
|
||||
truncated
|
||||
class="!px-4 !text-inherit"
|
||||
class="!w-full !px-4 !text-inherit"
|
||||
>
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</el-text>
|
||||
@ -156,7 +156,7 @@ function resolvePath(routePath) {
|
||||
offset: [0, -10],
|
||||
theme: tooltipEffect
|
||||
}"
|
||||
class="!text-inherit"
|
||||
class="!w-full !text-inherit"
|
||||
>
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</ReText>
|
||||
@ -184,18 +184,21 @@ function resolvePath(routePath) {
|
||||
</div>
|
||||
<ReText
|
||||
v-if="
|
||||
!(
|
||||
layout === 'vertical' &&
|
||||
isCollapse &&
|
||||
toRaw(props.item.meta.icon) &&
|
||||
props.item.parentId === null
|
||||
)
|
||||
layout === 'mix' && toRaw(props.item.meta.icon)
|
||||
? !isCollapse || props.item?.pathList?.length !== 2
|
||||
: !(
|
||||
layout === 'vertical' &&
|
||||
isCollapse &&
|
||||
toRaw(props.item.meta.icon) &&
|
||||
props.item.parentId === null
|
||||
)
|
||||
"
|
||||
:tippyProps="{
|
||||
offset: [0, -10],
|
||||
theme: tooltipEffect
|
||||
}"
|
||||
:class="{
|
||||
'!w-full': true,
|
||||
'!text-inherit': true,
|
||||
'!px-4':
|
||||
layout !== 'horizontal' &&
|
||||
|
||||
@ -90,6 +90,10 @@
|
||||
padding: 0 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-tag {
|
||||
padding: 0 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -7,6 +7,7 @@ import { onClickOutside } from "@vueuse/core";
|
||||
import { handleAliveRoute, getTopMenu } from "@/router/utils";
|
||||
import { useSettingStoreHook } from "@/store/modules/settings";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
import { ref, watch, unref, toRaw, nextTick, onBeforeUnmount } from "vue";
|
||||
import {
|
||||
delay,
|
||||
@ -57,6 +58,10 @@ const contextmenuRef = ref();
|
||||
const isShowArrow = ref(false);
|
||||
const topPath = getTopMenu()?.path;
|
||||
const { VITE_HIDE_HOME } = import.meta.env;
|
||||
const fixedTags = [
|
||||
...routerArrays,
|
||||
...usePermissionStoreHook().flatteningRoutes.filter(v => v?.meta?.fixedTag)
|
||||
];
|
||||
|
||||
const dynamicTagView = async () => {
|
||||
await nextTick();
|
||||
@ -226,10 +231,13 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
|
||||
other?: boolean
|
||||
): void => {
|
||||
if (other) {
|
||||
useMultiTagsStoreHook().handleTags("equal", [
|
||||
VITE_HIDE_HOME === "false" ? routerArrays[0] : toRaw(getTopMenu()),
|
||||
obj
|
||||
]);
|
||||
useMultiTagsStoreHook().handleTags(
|
||||
"equal",
|
||||
[
|
||||
VITE_HIDE_HOME === "false" ? fixedTags : toRaw(getTopMenu()),
|
||||
obj
|
||||
].flat()
|
||||
);
|
||||
} else {
|
||||
useMultiTagsStoreHook().handleTags("splice", "", {
|
||||
startIndex,
|
||||
@ -242,7 +250,7 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
|
||||
if (tag === "other") {
|
||||
spliceRoute(1, 1, true);
|
||||
} else if (tag === "left") {
|
||||
spliceRoute(1, valueIndex - 1);
|
||||
spliceRoute(fixedTags.length, valueIndex - 1, true);
|
||||
} else if (tag === "right") {
|
||||
spliceRoute(valueIndex + 1, multiTags.value.length);
|
||||
} else {
|
||||
@ -319,10 +327,11 @@ function onClickDrop(key, item, selectRoute?: RouteConfigs) {
|
||||
case 5:
|
||||
// 关闭全部标签页
|
||||
useMultiTagsStoreHook().handleTags("splice", "", {
|
||||
startIndex: 1,
|
||||
startIndex: fixedTags.length,
|
||||
length: multiTags.value.length
|
||||
});
|
||||
router.push(topPath);
|
||||
// router.push(fixedTags[fixedTags.length - 1]?.path);
|
||||
handleAliveRoute(route as ToRouteType);
|
||||
break;
|
||||
case 6:
|
||||
@ -361,10 +370,14 @@ function showMenus(value: boolean) {
|
||||
});
|
||||
}
|
||||
|
||||
function disabledMenus(value: boolean) {
|
||||
function disabledMenus(value: boolean, fixedTag = false) {
|
||||
Array.of(1, 2, 3, 4, 5).forEach(v => {
|
||||
tagsViews[v].disabled = value;
|
||||
});
|
||||
if (fixedTag) {
|
||||
tagsViews[2].show = false;
|
||||
tagsViews[2].disabled = true;
|
||||
}
|
||||
}
|
||||
|
||||
/** 检查当前右键的菜单两边是否存在别的菜单，如果左侧的菜单是顶级菜单，则不显示关闭左侧标签页，如果右侧没有菜单，则不显示关闭右侧标签页 */
|
||||
@ -381,6 +394,13 @@ function showMenuModel(
|
||||
} else {
|
||||
currentIndex = allRoute.findIndex(v => isEqual(v.query, query));
|
||||
}
|
||||
function fixedTagDisabled() {
|
||||
if (allRoute[currentIndex]?.meta?.fixedTag) {
|
||||
Array.of(1, 2, 3, 4, 5).forEach(v => {
|
||||
tagsViews[v].disabled = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
showMenus(true);
|
||||
|
||||
@ -399,6 +419,7 @@ function showMenuModel(
|
||||
tagsViews[v].disabled = false;
|
||||
});
|
||||
tagsViews[2].disabled = true;
|
||||
fixedTagDisabled();
|
||||
} else if (currentIndex === 1 && routeLength === 2) {
|
||||
disabledMenus(false);
|
||||
// 左侧的菜单是顶级菜单，右侧不存在别的菜单
|
||||
@ -406,6 +427,7 @@ function showMenuModel(
|
||||
tagsViews[v].show = false;
|
||||
tagsViews[v].disabled = true;
|
||||
});
|
||||
fixedTagDisabled();
|
||||
} else if (routeLength - 1 === currentIndex && currentIndex !== 0) {
|
||||
// 当前路由是所有路由中的最后一个
|
||||
tagsViews[3].show = false;
|
||||
@ -413,29 +435,31 @@ function showMenuModel(
|
||||
tagsViews[v].disabled = false;
|
||||
});
|
||||
tagsViews[3].disabled = true;
|
||||
if (allRoute[currentIndex - 1]?.meta?.fixedTag) {
|
||||
tagsViews[2].show = false;
|
||||
tagsViews[2].disabled = true;
|
||||
}
|
||||
fixedTagDisabled();
|
||||
} else if (currentIndex === 0 || currentPath === `/redirect${topPath}`) {
|
||||
// 当前路由为顶级菜单
|
||||
disabledMenus(true);
|
||||
} else {
|
||||
disabledMenus(false);
|
||||
disabledMenus(false, allRoute[currentIndex - 1]?.meta?.fixedTag);
|
||||
fixedTagDisabled();
|
||||
}
|
||||
}
|
||||
|
||||
function openMenu(tag, e) {
|
||||
closeMenu();
|
||||
if (tag.path === topPath) {
|
||||
// 右键菜单为顶级菜单，只显示刷新
|
||||
if (tag.path === topPath || tag?.meta?.fixedTag) {
|
||||
// 右键菜单为顶级菜单或拥有 fixedTag 属性，只显示刷新
|
||||
showMenus(false);
|
||||
tagsViews[0].show = true;
|
||||
} else if (route.path !== tag.path && route.name !== tag.name) {
|
||||
// 右键菜单不匹配当前路由，隐藏刷新
|
||||
tagsViews[0].show = false;
|
||||
showMenuModel(tag.path, tag.query);
|
||||
} else if (
|
||||
// eslint-disable-next-line no-dupe-else-if
|
||||
multiTags.value.length === 2 &&
|
||||
route.path !== tag.path
|
||||
) {
|
||||
} else if (multiTags.value.length === 2 && route.path !== tag.path) {
|
||||
showMenus(true);
|
||||
// 只有两个标签时不显示关闭其他标签页
|
||||
tagsViews[4].show = false;
|
||||
@ -483,7 +507,6 @@ function tagOnClick(item) {
|
||||
} else {
|
||||
router.push({ path });
|
||||
}
|
||||
// showMenuModel(item?.path, item?.query);
|
||||
}
|
||||
|
||||
onClickOutside(contextmenuRef, closeMenu, {
|
||||
@ -547,7 +570,11 @@ onBeforeUnmount(() => {
|
||||
v-for="(item, index) in multiTags"
|
||||
:ref="'dynamic' + index"
|
||||
:key="index"
|
||||
:class="['scroll-item is-closable', linkIsActive(item)]"
|
||||
:class="[
|
||||
'scroll-item is-closable',
|
||||
linkIsActive(item),
|
||||
!isAllEmpty(item?.meta?.fixedTag) && 'fixed-tag'
|
||||
]"
|
||||
@contextmenu.prevent="openMenu(item, $event)"
|
||||
@mouseenter.prevent="onMouseenter(index)"
|
||||
@mouseleave.prevent="onMouseleave(index)"
|
||||
@ -560,8 +587,10 @@ onBeforeUnmount(() => {
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
iconIsActive(item, index) ||
|
||||
(index === activeIndex && index !== 0)
|
||||
isAllEmpty(item?.meta?.fixedTag)
|
||||
? iconIsActive(item, index) ||
|
||||
(index === activeIndex && index !== 0)
|
||||
: false
|
||||
"
|
||||
class="el-icon-close"
|
||||
@click.stop="deleteMenu(item)"
|
||||
|
||||
@ -1,21 +1,22 @@
|
||||
import { storeToRefs } from "pinia";
|
||||
import { getConfig } from "@/config";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
import userAvatar from "@/assets/user.jpg";
|
||||
import Avatar from "@/assets/user.jpg";
|
||||
import { getTopMenu } from "@/router/utils";
|
||||
import { useFullscreen } from "@vueuse/core";
|
||||
import { useGlobal } from "@pureadmin/utils";
|
||||
import type { routeMetaType } from "../types";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { router, remainingPaths } from "@/router";
|
||||
import { computed, type CSSProperties } from "vue";
|
||||
import { useAppStoreHook } from "@/store/modules/app";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
import { useGlobal, isAllEmpty } from "@pureadmin/utils";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
|
||||
import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
|
||||
|
||||
const errorInfo = "当前路由配置不正确，请检查配置";
|
||||
const errorInfo =
|
||||
"The current routing configuration is incorrect, please check the configuration";
|
||||
|
||||
export function useNav() {
|
||||
const route = useRoute();
|
||||
@ -36,9 +37,18 @@ export function useNav() {
|
||||
};
|
||||
});
|
||||
|
||||
/** 用户名 */
|
||||
/** 头像（如果头像为空则使用 src/assets/user.jpg ） */
|
||||
const userAvatar = computed(() => {
|
||||
return isAllEmpty(useUserStoreHook()?.avatar)
|
||||
? Avatar
|
||||
: useUserStoreHook()?.avatar;
|
||||
});
|
||||
|
||||
/** 昵称（如果昵称为空则显示用户名） */
|
||||
const username = computed(() => {
|
||||
return useUserStoreHook()?.username;
|
||||
return isAllEmpty(useUserStoreHook()?.nickname)
|
||||
? useUserStoreHook()?.username
|
||||
: useUserStoreHook()?.nickname;
|
||||
});
|
||||
|
||||
const avatarsStyle = computed(() => {
|
||||
|
||||
@ -17,9 +17,9 @@ import {
|
||||
isIncludeAllChildren
|
||||
} from "@pureadmin/utils";
|
||||
import { getConfig } from "@/config";
|
||||
import type { menuType } from "@/layout/types";
|
||||
import { buildHierarchyTree } from "@/utils/tree";
|
||||
import { userKey, type DataInfo } from "@/utils/auth";
|
||||
import { type menuType, routerArrays } from "@/layout/types";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
const IFrame = () => import("@/layout/frameView.vue");
|
||||
@ -81,7 +81,7 @@ function isOneOfArray(a: Array<string>, b: Array<string>) {
|
||||
: true;
|
||||
}
|
||||
|
||||
/** 从localStorage里取出当前登陆用户的角色roles，过滤无权限的菜单 */
|
||||
/** 从localStorage里取出当前登录用户的角色roles，过滤无权限的菜单 */
|
||||
function filterNoPermissionTree(data: RouteComponent[]) {
|
||||
const currentRoles =
|
||||
storageLocal().getItem<DataInfo<number>>(userKey)?.roles ?? [];
|
||||
@ -178,6 +178,14 @@ function handleAsyncRoutes(routeList) {
|
||||
);
|
||||
usePermissionStoreHook().handleWholeMenus(routeList);
|
||||
}
|
||||
if (!useMultiTagsStoreHook().getMultiTagsCache) {
|
||||
useMultiTagsStoreHook().handleTags("equal", [
|
||||
...routerArrays,
|
||||
...usePermissionStoreHook().flatteningRoutes.filter(
|
||||
v => v?.meta?.fixedTag
|
||||
)
|
||||
]);
|
||||
}
|
||||
addPathMatch();
|
||||
}
|
||||
|
||||
@ -359,9 +367,23 @@ function hasAuth(value: string | Array<string>): boolean {
|
||||
return isAuths ? true : false;
|
||||
}
|
||||
|
||||
function handleTopMenu(route) {
|
||||
if (route?.children && route.children.length > 1) {
|
||||
if (route.redirect) {
|
||||
return route.children.filter(cur => cur.path === route.redirect)[0];
|
||||
} else {
|
||||
return route.children[0];
|
||||
}
|
||||
} else {
|
||||
return route;
|
||||
}
|
||||
}
|
||||
|
||||
/** 获取所有菜单中的第一个菜单（顶级菜单）*/
|
||||
function getTopMenu(tag = false): menuType {
|
||||
const topMenu = usePermissionStoreHook().wholeMenus[0]?.children[0];
|
||||
const topMenu = handleTopMenu(
|
||||
usePermissionStoreHook().wholeMenus[0]?.children[0]
|
||||
);
|
||||
tag && useMultiTagsStoreHook().handleTags("push", topMenu);
|
||||
return topMenu;
|
||||
}
|
||||
|
||||
@ -1,8 +1,12 @@
|
||||
import { store } from "@/store";
|
||||
import { defineStore } from "pinia";
|
||||
import type { appType } from "./types";
|
||||
import { getConfig, responsiveStorageNameSpace } from "@/config";
|
||||
import { deviceDetection, storageLocal } from "@pureadmin/utils";
|
||||
import {
|
||||
type appType,
|
||||
store,
|
||||
getConfig,
|
||||
defineStore,
|
||||
storageLocal,
|
||||
deviceDetection,
|
||||
responsiveStorageNameSpace
|
||||
} from "../utils";
|
||||
|
||||
export const useAppStore = defineStore({
|
||||
id: "pure-app",
|
||||
|
||||
@ -1,7 +1,10 @@
|
||||
import { store } from "@/store";
|
||||
import { defineStore } from "pinia";
|
||||
import { storageLocal } from "@pureadmin/utils";
|
||||
import { getConfig, responsiveStorageNameSpace } from "@/config";
|
||||
import {
|
||||
store,
|
||||
getConfig,
|
||||
defineStore,
|
||||
storageLocal,
|
||||
responsiveStorageNameSpace
|
||||
} from "../utils";
|
||||
|
||||
export const useEpThemeStore = defineStore({
|
||||
id: "pure-epTheme",
|
||||
|
||||
@ -1,9 +1,18 @@
|
||||
import { defineStore } from "pinia";
|
||||
import { store } from "@/store";
|
||||
import { routerArrays } from "@/layout/types";
|
||||
import { responsiveStorageNameSpace } from "@/config";
|
||||
import type { multiType, positionType } from "./types";
|
||||
import { isEqual, isBoolean, isUrl, storageLocal } from "@pureadmin/utils";
|
||||
import {
|
||||
type multiType,
|
||||
type positionType,
|
||||
store,
|
||||
isUrl,
|
||||
isEqual,
|
||||
isNumber,
|
||||
isBoolean,
|
||||
getConfig,
|
||||
defineStore,
|
||||
routerArrays,
|
||||
storageLocal,
|
||||
responsiveStorageNameSpace
|
||||
} from "../utils";
|
||||
import { usePermissionStoreHook } from "./permission";
|
||||
|
||||
export const useMultiTagsStore = defineStore({
|
||||
id: "pure-multiTags",
|
||||
@ -15,7 +24,12 @@ export const useMultiTagsStore = defineStore({
|
||||
? storageLocal().getItem<StorageConfigs>(
|
||||
`${responsiveStorageNameSpace()}tags`
|
||||
)
|
||||
: [...routerArrays],
|
||||
: [
|
||||
...routerArrays,
|
||||
...usePermissionStoreHook().flatteningRoutes.filter(
|
||||
v => v?.meta?.fixedTag
|
||||
)
|
||||
],
|
||||
multiTagsCache: storageLocal().getItem<StorageConfigs>(
|
||||
`${responsiveStorageNameSpace()}configure`
|
||||
)?.multiTagsCache
|
||||
@ -100,6 +114,14 @@ export const useMultiTagsStore = defineStore({
|
||||
}
|
||||
this.multiTags.push(value);
|
||||
this.tagsCache(this.multiTags);
|
||||
if (
|
||||
getConfig()?.MaxTagsLevel &&
|
||||
isNumber(getConfig().MaxTagsLevel)
|
||||
) {
|
||||
if (this.multiTags.length > getConfig().MaxTagsLevel) {
|
||||
this.multiTags.splice(1, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "splice":
|
||||
|
||||
@ -1,10 +1,16 @@
|
||||
import { defineStore } from "pinia";
|
||||
import { store } from "@/store";
|
||||
import type { cacheType } from "./types";
|
||||
import { constantMenus } from "@/router";
|
||||
import {
|
||||
type cacheType,
|
||||
store,
|
||||
debounce,
|
||||
ascending,
|
||||
getKeyList,
|
||||
filterTree,
|
||||
defineStore,
|
||||
constantMenus,
|
||||
filterNoPermissionTree,
|
||||
formatFlatteningRoutes
|
||||
} from "../utils";
|
||||
import { useMultiTagsStoreHook } from "./multiTags";
|
||||
import { debounce, getKeyList } from "@pureadmin/utils";
|
||||
import { ascending, filterTree, filterNoPermissionTree } from "@/router/utils";
|
||||
|
||||
export const usePermissionStore = defineStore({
|
||||
id: "pure-permission",
|
||||
@ -13,6 +19,8 @@ export const usePermissionStore = defineStore({
|
||||
constantMenus,
|
||||
// 整体路由生成的菜单（静态、动态）
|
||||
wholeMenus: [],
|
||||
// 整体路由（一维数组格式）
|
||||
flatteningRoutes: [],
|
||||
// 缓存页面keepAlive
|
||||
cachePageList: []
|
||||
}),
|
||||
@ -22,6 +30,9 @@ export const usePermissionStore = defineStore({
|
||||
this.wholeMenus = filterNoPermissionTree(
|
||||
filterTree(ascending(this.constantMenus.concat(routes)))
|
||||
);
|
||||
this.flatteningRoutes = formatFlatteningRoutes(
|
||||
this.constantMenus.concat(routes)
|
||||
);
|
||||
},
|
||||
cacheOperate({ mode, name }: cacheType) {
|
||||
const delIndex = this.cachePageList.findIndex(v => v === name);
|
||||
|
||||
@ -1,7 +1,4 @@
|
||||
import { defineStore } from "pinia";
|
||||
import { store } from "@/store";
|
||||
import { getConfig } from "@/config";
|
||||
import type { setType } from "./types";
|
||||
import { type setType, store, defineStore, getConfig } from "../utils";
|
||||
|
||||
export const useSettingStore = defineStore({
|
||||
id: "pure-setting",
|
||||
|
||||
@ -1,19 +1,30 @@
|
||||
import { defineStore } from "pinia";
|
||||
import { store } from "@/store";
|
||||
import type { userType } from "./types";
|
||||
import { routerArrays } from "@/layout/types";
|
||||
import { router, resetRouter } from "@/router";
|
||||
import { storageLocal } from "@pureadmin/utils";
|
||||
import { getLogin, refreshTokenApi } from "@/api/user";
|
||||
import type { UserResult, RefreshTokenResult } from "@/api/user";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
import {
|
||||
type userType,
|
||||
store,
|
||||
router,
|
||||
defineStore,
|
||||
resetRouter,
|
||||
routerArrays,
|
||||
storageLocal
|
||||
} from "../utils";
|
||||
import {
|
||||
type UserResult,
|
||||
type RefreshTokenResult,
|
||||
getLogin,
|
||||
refreshTokenApi
|
||||
} from "@/api/user";
|
||||
import { useMultiTagsStoreHook } from "./multiTags";
|
||||
import { type DataInfo, setToken, removeToken, userKey } from "@/utils/auth";
|
||||
|
||||
export const useUserStore = defineStore({
|
||||
id: "pure-user",
|
||||
state: (): userType => ({
|
||||
// 头像
|
||||
avatar: storageLocal().getItem<DataInfo<number>>(userKey)?.avatar ?? "",
|
||||
// 用户名
|
||||
username: storageLocal().getItem<DataInfo<number>>(userKey)?.username ?? "",
|
||||
// 昵称
|
||||
nickname: storageLocal().getItem<DataInfo<number>>(userKey)?.nickname ?? "",
|
||||
// 页面级别权限
|
||||
roles: storageLocal().getItem<DataInfo<number>>(userKey)?.roles ?? [],
|
||||
// 是否勾选了登录页的免登录
|
||||
@ -22,10 +33,18 @@ export const useUserStore = defineStore({
|
||||
loginDay: 7
|
||||
}),
|
||||
actions: {
|
||||
/** 存储头像 */
|
||||
SET_AVATAR(avatar: string) {
|
||||
this.avatar = avatar;
|
||||
},
|
||||
/** 存储用户名 */
|
||||
SET_USERNAME(username: string) {
|
||||
this.username = username;
|
||||
},
|
||||
/** 存储昵称 */
|
||||
SET_NICKNAME(nickname: string) {
|
||||
this.nickname = nickname;
|
||||
},
|
||||
/** 存储角色 */
|
||||
SET_ROLES(roles: Array<string>) {
|
||||
this.roles = roles;
|
||||
@ -43,10 +62,8 @@ export const useUserStore = defineStore({
|
||||
return new Promise<UserResult>((resolve, reject) => {
|
||||
getLogin(data)
|
||||
.then(data => {
|
||||
if (data) {
|
||||
setToken(data.data);
|
||||
resolve(data);
|
||||
}
|
||||
if (data?.success) setToken(data.data);
|
||||
resolve(data);
|
||||
})
|
||||
.catch(error => {
|
||||
reject(error);
|
||||
|
||||
@ -37,7 +37,9 @@ export type setType = {
|
||||
};
|
||||
|
||||
export type userType = {
|
||||
avatar?: string;
|
||||
username?: string;
|
||||
nickname?: string;
|
||||
roles?: Array<string>;
|
||||
isRemembered?: boolean;
|
||||
loginDay?: number;
|
||||
29
src/store/utils.ts
Normal file
29
src/store/utils.ts
Normal file
@ -0,0 +1,29 @@
|
||||
export { store } from "@/store";
|
||||
export { defineStore } from "pinia";
|
||||
export { routerArrays } from "@/layout/types";
|
||||
export { router, resetRouter, constantMenus } from "@/router";
|
||||
export { getConfig, responsiveStorageNameSpace } from "@/config";
|
||||
export {
|
||||
ascending,
|
||||
filterTree,
|
||||
filterNoPermissionTree,
|
||||
formatFlatteningRoutes
|
||||
} from "@/router/utils";
|
||||
export {
|
||||
isUrl,
|
||||
isEqual,
|
||||
isNumber,
|
||||
debounce,
|
||||
isBoolean,
|
||||
getKeyList,
|
||||
storageLocal,
|
||||
deviceDetection
|
||||
} from "@pureadmin/utils";
|
||||
export type {
|
||||
setType,
|
||||
appType,
|
||||
userType,
|
||||
multiType,
|
||||
cacheType,
|
||||
positionType
|
||||
} from "./types";
|
||||
@ -51,7 +51,7 @@ html.dark {
|
||||
}
|
||||
}
|
||||
|
||||
/* 项目配置面板 */
|
||||
/* 系统配置面板 */
|
||||
.right-panel-items {
|
||||
.el-divider__text {
|
||||
--el-bg-color: var(--el-bg-color);
|
||||
|
||||
@ -263,8 +263,9 @@
|
||||
}
|
||||
|
||||
& > .el-menu {
|
||||
i {
|
||||
margin-right: 20px;
|
||||
i,
|
||||
svg {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -9,9 +9,13 @@ export interface DataInfo<T> {
|
||||
expires: T;
|
||||
/** 用于调用刷新accessToken的接口时所需的token */
|
||||
refreshToken: string;
|
||||
/** 头像 */
|
||||
avatar?: string;
|
||||
/** 用户名 */
|
||||
username?: string;
|
||||
/** 当前登陆用户的角色 */
|
||||
/** 昵称 */
|
||||
nickname?: string;
|
||||
/** 当前登录用户的角色 */
|
||||
roles?: Array<string>;
|
||||
}
|
||||
|
||||
@ -36,15 +40,15 @@ export function getToken(): DataInfo<number> {
|
||||
/**
|
||||
* @description 设置`token`以及一些必要信息并采用无感刷新`token`方案
|
||||
* 无感刷新：后端返回`accessToken`（访问接口使用的`token`）、`refreshToken`（用于调用刷新`accessToken`的接口时所需的`token`，`refreshToken`的过期时间（比如30天）应大于`accessToken`的过期时间（比如2小时））、`expires`（`accessToken`的过期时间）
|
||||
* 将`accessToken`、`expires`这两条信息放在key值为authorized-token的cookie里（过期自动销毁）
|
||||
* 将`username`、`roles`、`refreshToken`、`expires`这四条信息放在key值为`user-info`的localStorage里（利用`multipleTabsKey`当浏览器完全关闭后自动销毁）
|
||||
* 将`accessToken`、`expires`、`refreshToken`这三条信息放在key值为authorized-token的cookie里（过期自动销毁）
|
||||
* 将`avatar`、`username`、`nickname`、`roles`、`refreshToken`、`expires`这六条信息放在key值为`user-info`的localStorage里（利用`multipleTabsKey`当浏览器完全关闭后自动销毁）
|
||||
*/
|
||||
export function setToken(data: DataInfo<Date>) {
|
||||
let expires = 0;
|
||||
const { accessToken, refreshToken } = data;
|
||||
const { isRemembered, loginDay } = useUserStoreHook();
|
||||
expires = new Date(data.expires).getTime(); // 如果后端直接设置时间戳，将此处代码改为expires = data.expires，然后把上面的DataInfo<Date>改成DataInfo<number>即可
|
||||
const cookieString = JSON.stringify({ accessToken, expires });
|
||||
const cookieString = JSON.stringify({ accessToken, expires, refreshToken });
|
||||
|
||||
expires > 0
|
||||
? Cookies.set(TokenKey, cookieString, {
|
||||
@ -62,26 +66,44 @@ export function setToken(data: DataInfo<Date>) {
|
||||
: {}
|
||||
);
|
||||
|
||||
function setUserKey(username: string, roles: Array<string>) {
|
||||
function setUserKey({ avatar, username, nickname, roles }) {
|
||||
useUserStoreHook().SET_AVATAR(avatar);
|
||||
useUserStoreHook().SET_USERNAME(username);
|
||||
useUserStoreHook().SET_NICKNAME(nickname);
|
||||
useUserStoreHook().SET_ROLES(roles);
|
||||
storageLocal().setItem(userKey, {
|
||||
refreshToken,
|
||||
expires,
|
||||
avatar,
|
||||
username,
|
||||
nickname,
|
||||
roles
|
||||
});
|
||||
}
|
||||
|
||||
if (data.username && data.roles) {
|
||||
const { username, roles } = data;
|
||||
setUserKey(username, roles);
|
||||
setUserKey({
|
||||
avatar: data?.avatar ?? "",
|
||||
username,
|
||||
nickname: data?.nickname ?? "",
|
||||
roles
|
||||
});
|
||||
} else {
|
||||
const avatar =
|
||||
storageLocal().getItem<DataInfo<number>>(userKey)?.avatar ?? "";
|
||||
const username =
|
||||
storageLocal().getItem<DataInfo<number>>(userKey)?.username ?? "";
|
||||
const nickname =
|
||||
storageLocal().getItem<DataInfo<number>>(userKey)?.nickname ?? "";
|
||||
const roles =
|
||||
storageLocal().getItem<DataInfo<number>>(userKey)?.roles ?? [];
|
||||
setUserKey(username, roles);
|
||||
setUserKey({
|
||||
avatar,
|
||||
username,
|
||||
nickname,
|
||||
roles
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -35,16 +35,16 @@ class PureHttp {
|
||||
this.httpInterceptorsResponse();
|
||||
}
|
||||
|
||||
/** token过期后，暂存待执行的请求 */
|
||||
/** `token`过期后，暂存待执行的请求 */
|
||||
private static requests = [];
|
||||
|
||||
/** 防止重复刷新token */
|
||||
/** 防止重复刷新`token` */
|
||||
private static isRefreshing = false;
|
||||
|
||||
/** 初始化配置对象 */
|
||||
private static initConfig: PureHttpRequestConfig = {};
|
||||
|
||||
/** 保存当前Axios实例对象 */
|
||||
/** 保存当前`Axios`实例对象 */
|
||||
private static axiosInstance: AxiosInstance = Axios.create(defaultConfig);
|
||||
|
||||
/** 重连原始请求 */
|
||||
@ -72,9 +72,9 @@ class PureHttp {
|
||||
PureHttp.initConfig.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
/** 请求白名单，放置一些不需要token的接口（通过设置请求白名单，防止token过期后再请求造成的死循环问题） */
|
||||
/** 请求白名单，放置一些不需要`token`的接口（通过设置请求白名单，防止`token`过期后再请求造成的死循环问题） */
|
||||
const whiteList = ["/refresh-token", "/login"];
|
||||
return whiteList.find(url => url === config.url)
|
||||
return whiteList.some(url => config.url.endsWith(url))
|
||||
? config
|
||||
: new Promise(resolve => {
|
||||
const data = getToken();
|
||||
@ -172,22 +172,22 @@ class PureHttp {
|
||||
});
|
||||
}
|
||||
|
||||
/** 单独抽离的post工具函数 */
|
||||
/** 单独抽离的`post`工具函数 */
|
||||
public post<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<T>,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<P> {
|
||||
return this.request<P>("post", url, params, config);
|
||||
): Promise<T> {
|
||||
return this.request<T>("post", url, params, config);
|
||||
}
|
||||
|
||||
/** 单独抽离的get工具函数 */
|
||||
/** 单独抽离的`get`工具函数 */
|
||||
public get<T, P>(
|
||||
url: string,
|
||||
params?: AxiosRequestConfig<T>,
|
||||
params?: AxiosRequestConfig<P>,
|
||||
config?: PureHttpRequestConfig
|
||||
): Promise<P> {
|
||||
return this.request<P>("get", url, params, config);
|
||||
): Promise<T> {
|
||||
return this.request<T>("get", url, params, config);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -19,7 +19,6 @@ const Print = function (dom, options?: object): PrintFunction {
|
||||
printDoneCallBack: null
|
||||
};
|
||||
for (const key in this.conf) {
|
||||
// eslint-disable-next-line no-prototype-builtins
|
||||
if (key && options.hasOwnProperty(key)) {
|
||||
this.conf[key] = options[key];
|
||||
}
|
||||
@ -132,9 +131,9 @@ Print.prototype = {
|
||||
"style",
|
||||
"position:absolute;width:0;height:0;top:-10px;left:-10px;"
|
||||
);
|
||||
// eslint-disable-next-line prefer-const
|
||||
|
||||
w = f.contentWindow || f.contentDocument;
|
||||
// eslint-disable-next-line prefer-const
|
||||
|
||||
doc = f.contentDocument || f.contentWindow.document;
|
||||
doc.open();
|
||||
doc.write(content);
|
||||
|
||||
@ -15,10 +15,10 @@ export const injectResponsiveStorage = (app: App, config: PlatformConfigs) => {
|
||||
darkMode: config.DarkMode ?? false,
|
||||
sidebarStatus: config.SidebarStatus ?? true,
|
||||
epThemeColor: config.EpThemeColor ?? "#409EFF",
|
||||
themeColor: config.Theme ?? "light", // 主题色（对应项目配置中的主题色，与theme不同的是它不会受到浅色、深色整体风格切换的影响，只会在手动点击主题色时改变）
|
||||
themeColor: config.Theme ?? "light", // 主题色（对应系统配置中的主题色，与theme不同的是它不会受到浅色、深色整体风格切换的影响，只会在手动点击主题色时改变）
|
||||
overallStyle: config.OverallStyle ?? "light" // 整体风格（浅色：light、深色：dark、自动：system）
|
||||
},
|
||||
// 项目配置-界面显示
|
||||
// 系统配置-界面显示
|
||||
configure: Storage.getData("configure", nameSpace) ?? {
|
||||
grey: config.Grey ?? false,
|
||||
weak: config.Weak ?? false,
|
||||
|
||||
1
types/global.d.ts
vendored
1
types/global.d.ts
vendored
@ -87,6 +87,7 @@ declare global {
|
||||
FixedHeader?: boolean;
|
||||
HiddenSideBar?: boolean;
|
||||
MultiTagsCache?: boolean;
|
||||
MaxTagsLevel?: number;
|
||||
KeepAlive?: boolean;
|
||||
Locale?: string;
|
||||
Layout?: string;
|
||||
|
||||
4
types/router.d.ts
vendored
4
types/router.d.ts
vendored
@ -45,8 +45,10 @@ declare global {
|
||||
/** 离场动画 */
|
||||
leaveTransition?: string;
|
||||
};
|
||||
// 是否不添加信息到标签页，（默认`false`）
|
||||
/** 当前菜单名称或自定义信息禁止添加到标签页（默认`false`） */
|
||||
hiddenTag?: boolean;
|
||||
/** 当前菜单名称是否固定显示在标签页且不可关闭（默认`false`） */
|
||||
fixedTag?: boolean;
|
||||
/** 动态路由可打开的最大数量 `可选` */
|
||||
dynamicLevel?: number;
|
||||
/** 将某个菜单激活
|
||||
|
||||
2
types/shims-vue.d.ts
vendored
2
types/shims-vue.d.ts
vendored
@ -8,5 +8,3 @@ declare module "*.scss" {
|
||||
const scss: Record<string, string>;
|
||||
export default scss;
|
||||
}
|
||||
|
||||
declare module "element-plus/dist/locale/zh-cn.mjs";
|
||||
|
||||
Loading…
Reference in New Issue
Block a user