diff --git a/.eslintrc.js b/.eslintrc.js index 009f5bc..f9a02ff 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -5,116 +5,128 @@ module.exports = { }, globals: { // Ref sugar (take 2) - $: "readonly", - $$: "readonly", - $ref: "readonly", - $shallowRef: "readonly", - $computed: "readonly", + $: '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", + 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" + 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", + 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", + parser: '@typescript-eslint/parser', ecmaVersion: 2020, - sourceType: "module", - jsxPragma: "React", + sourceType: 'module', + jsxPragma: 'React', ecmaFeatures: { jsx: true } }, overrides: [ { - files: ["*.ts", "*.vue"], + files: ['*.ts', '*.vue'], rules: { - "no-undef": "off" + 'no-undef': 'off' } }, { - files: ["*.vue"], - parser: "vue-eslint-parser", + files: ['*.vue'], + parser: 'vue-eslint-parser', parserOptions: { - parser: "@typescript-eslint/parser", - extraFileExtensions: [".vue"], - ecmaVersion: "latest", + parser: '@typescript-eslint/parser', + extraFileExtensions: ['.vue'], + ecmaVersion: 'latest', ecmaFeatures: { jsx: true } }, rules: { - "no-undef": "off" + '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", + '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', + quotes: [ + 2, + 'single', + { + avoidEscape: true, + allowTemplateLiterals: true + } + ], + semi: [2, 'never'], + 'semi-spacing': [ + 2, + { + before: false, + after: true + } + ], + 'vue/html-self-closing': [ + 'error', { html: { - void: "always", - normal: "always", - component: "always" + void: 'always', + normal: 'always', + component: 'always' }, - svg: "always", - math: "always" + svg: 'always', + math: 'always' } ], - "@typescript-eslint/no-unused-vars": [ - "error", + '@typescript-eslint/no-unused-vars': [ + 'error', { - argsIgnorePattern: "^_", - varsIgnorePattern: "^_" + argsIgnorePattern: '^_', + varsIgnorePattern: '^_' } ], - "no-unused-vars": [ - "error", + 'no-unused-vars': [ + 'error', { - argsIgnorePattern: "^_", - varsIgnorePattern: "^_" + argsIgnorePattern: '^_', + varsIgnorePattern: '^_' } ], - "prettier/prettier": [ - "error", + 'prettier/prettier': [ + 'error', { - endOfLine: "auto" + endOfLine: 'auto', + singleQuote: true, + semi: false } ] } -}; +} diff --git a/.prettierrc.js b/.prettierrc.js index 16bb32c..430d804 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,6 +1,7 @@ module.exports = { - bracketSpacing: true, - singleQuote: false, - arrowParens: "avoid", - trailingComma: "none" -}; + // bracketSpacing: true, + singleQuote: true, + semi: false, + arrowParens: 'avoid', + trailingComma: 'none' +} diff --git a/.vscode/settings.json b/.vscode/settings.json index bb65d68..6042c15 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -7,7 +7,7 @@ "editor.tabSize": 2, "editor.formatOnPaste": true, "editor.guides.bracketPairs": "active", - "files.autoSave": "afterDelay", + "files.autoSave": "onFocusChange", "git.confirmSync": false, "workbench.startupEditor": "newUntitledFile", "editor.suggestSelection": "first", diff --git a/locales/en.yaml b/locales/en.yaml index 44bb70d..a62f1c1 100644 --- a/locales/en.yaml +++ b/locales/en.yaml @@ -29,6 +29,13 @@ menus: hsfourZeroFour: "404" hsfourZeroOne: "403" hsFive: "500" + basicData: Basic Data + liveData: Live Data + userData: User Data + searchUser: Search User + gameData: Game Data + clubData: Club Data + searchClub: Search Club permission: Permission Manage permissionPage: Page Permission permissionButton: Button Permission @@ -41,3 +48,6 @@ login: usernameReg: Please enter username passwordReg: Please enter password passwordRuleReg: The password format should be any combination of 8-18 digits +others: + backHome: Back Home + comingSoon: Coming soon. diff --git a/locales/zh-CN.yaml b/locales/zh-CN.yaml index de0a399..7b67622 100644 --- a/locales/zh-CN.yaml +++ b/locales/zh-CN.yaml @@ -29,6 +29,13 @@ menus: hsfourZeroFour: "404" hsfourZeroOne: "403" hsFive: "500" + basicData: "基础数据" + liveData: "实时数据" + userData: "用户数据" + searchUser: "搜索用户" + gameData: "牌局数据" + clubData: "俱乐部数据" + searchClub: "搜索俱乐部" permission: 权限管理 permissionPage: 页面权限 permissionButton: 按钮权限 @@ -41,3 +48,7 @@ login: usernameReg: 请输入账号 passwordReg: 请输入密码 passwordRuleReg: 密码格式应为8-18位数字、字母、符号的任意两种组合 +others: + backHome: 返回首页 + comingSoon: 敬请期待。 + diff --git a/mock/asyncRoutes.ts b/mock/asyncRoutes.ts index 9335735..b706f68 100644 --- a/mock/asyncRoutes.ts +++ b/mock/asyncRoutes.ts @@ -11,7 +11,7 @@ const permissionRouter = { path: "/permission", meta: { title: "menus.permission", - icon: "lollipop", + icon: "informationLine", rank: 10 }, children: [ diff --git a/src/App.vue b/src/App.vue index b299a9e..05c1653 100644 --- a/src/App.vue +++ b/src/App.vue @@ -5,19 +5,19 @@ diff --git a/src/api/routes.ts b/src/api/routes.ts index 277c5f3..ef72568 100644 --- a/src/api/routes.ts +++ b/src/api/routes.ts @@ -1,10 +1,10 @@ -import { http } from "@/utils/http"; +import { http } from '@/utils/http' type Result = { - success: boolean; - data: Array; -}; + success: boolean + data: Array +} export const getAsyncRoutes = () => { - return http.request("get", "/getAsyncRoutes"); -}; + return http.request('get', '/getAsyncRoutes') +} diff --git a/src/api/user.ts b/src/api/user.ts index 9f8125b..99100bd 100644 --- a/src/api/user.ts +++ b/src/api/user.ts @@ -1,39 +1,39 @@ -import { http } from "@/utils/http"; +import { http } from '@/utils/http' export type UserResult = { - success: boolean; + success: boolean data: { /** 用户名 */ - username: string; + username: string /** 当前登陆用户的角色 */ - roles: Array; + roles: Array /** `token` */ - accessToken: string; + accessToken: string /** 用于调用刷新`accessToken`的接口时所需的`token` */ - refreshToken: string; + refreshToken: string /** `accessToken`的过期时间(格式'xxxx/xx/xx xx:xx:xx') */ - expires: Date; - }; -}; + expires: Date + } +} export type RefreshTokenResult = { - success: boolean; + success: boolean data: { /** `token` */ - accessToken: string; + accessToken: string /** 用于调用刷新`accessToken`的接口时所需的`token` */ - refreshToken: string; + refreshToken: string /** `accessToken`的过期时间(格式'xxxx/xx/xx xx:xx:xx') */ - expires: Date; - }; -}; + expires: Date + } +} /** 登录 */ export const getLogin = (data?: object) => { - return http.request("post", "/login", { data }); -}; + return http.request('post', '/login', { data }) +} /** 刷新token */ export const refreshTokenApi = (data?: object) => { - return http.request("post", "/refreshToken", { data }); -}; + return http.request('post', '/refreshToken', { data }) +} diff --git a/src/assets/iconfont/iconfont.css b/src/assets/iconfont/iconfont.css index 3b54550..52eb7e9 100644 --- a/src/assets/iconfont/iconfont.css +++ b/src/assets/iconfont/iconfont.css @@ -1,12 +1,12 @@ @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"); + 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-family: 'iconfont' !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; @@ -14,13 +14,13 @@ } .pure-iconfont-tabs:before { - content: "\e63e"; + content: '\e63e'; } .pure-iconfont-logo:before { - content: "\e620"; + content: '\e620'; } .pure-iconfont-new:before { - content: "\e615"; + content: '\e615'; } diff --git a/src/assets/iconfont/iconfont.js b/src/assets/iconfont/iconfont.js index 64d8bd8..f9d299b 100644 --- a/src/assets/iconfont/iconfont.js +++ b/src/assets/iconfont/iconfont.js @@ -1,9 +1,9 @@ -(window._iconfont_svg_string_2208059 = +;(window._iconfont_svg_string_2208059 = ''), (function (e) { - var t = (t = document.getElementsByTagName("script"))[t.length - 1], - c = t.getAttribute("data-injectcss"), - t = t.getAttribute("data-disable-injectsvg"); + var t = (t = document.getElementsByTagName('script'))[t.length - 1], + c = t.getAttribute('data-injectcss'), + t = t.getAttribute('data-disable-injectsvg') if (!t) { var n, l, @@ -11,59 +11,58 @@ o, a, h = function (t, c) { - c.parentNode.insertBefore(t, c); - }; + c.parentNode.insertBefore(t, c) + } if (c && !e.__iconfont__svg__cssinject__) { - e.__iconfont__svg__cssinject__ = !0; + e.__iconfont__svg__cssinject__ = !0 try { document.write( - "" - ); + '' + ) } catch (t) { - console && console.log(t); + console && console.log(t) } } - (n = function () { + ;(n = function () { var t, - c = document.createElement("div"); - (c.innerHTML = e._iconfont_svg_string_2208059), - (c = c.getElementsByTagName("svg")[0]) && - (c.setAttribute("aria-hidden", "true"), - (c.style.position = "absolute"), + c = document.createElement('div') + ;(c.innerHTML = e._iconfont_svg_string_2208059), + (c = c.getElementsByTagName('svg')[0]) && + (c.setAttribute('aria-hidden', 'true'), + (c.style.position = 'absolute'), (c.style.width = 0), (c.style.height = 0), - (c.style.overflow = "hidden"), + (c.style.overflow = 'hidden'), (c = c), (t = document.body).firstChild ? h(c, t.firstChild) - : t.appendChild(c)); + : t.appendChild(c)) }), document.addEventListener - ? ~["complete", "loaded", "interactive"].indexOf(document.readyState) + ? ~['complete', 'loaded', 'interactive'].indexOf(document.readyState) ? setTimeout(n, 0) : ((l = function () { - document.removeEventListener("DOMContentLoaded", l, !1), n(); + document.removeEventListener('DOMContentLoaded', l, !1), n() }), - document.addEventListener("DOMContentLoaded", l, !1)) + document.addEventListener('DOMContentLoaded', l, !1)) : document.attachEvent && ((i = n), (o = e.document), (a = !1), v(), (o.onreadystatechange = function () { - "complete" == o.readyState && - ((o.onreadystatechange = null), d()); - })); + 'complete' == o.readyState && ((o.onreadystatechange = null), d()) + })) } function d() { - a || ((a = !0), i()); + a || ((a = !0), i()) } function v() { try { - o.documentElement.doScroll("left"); + o.documentElement.doScroll('left') } catch (t) { - return void setTimeout(v, 50); + return void setTimeout(v, 50) } - d(); + d() } - })(window); + })(window) diff --git a/src/components/ReAuth/index.ts b/src/components/ReAuth/index.ts index 975ed2c..dc569c0 100644 --- a/src/components/ReAuth/index.ts +++ b/src/components/ReAuth/index.ts @@ -1,5 +1,5 @@ -import auth from "./src/auth"; +import auth from './src/auth' -const Auth = auth; +const Auth = auth -export { Auth }; +export { Auth } diff --git a/src/components/ReAuth/src/auth.tsx b/src/components/ReAuth/src/auth.tsx index d2cf9b3..c1a6e0c 100644 --- a/src/components/ReAuth/src/auth.tsx +++ b/src/components/ReAuth/src/auth.tsx @@ -1,8 +1,8 @@ -import { defineComponent, Fragment } from "vue"; -import { hasAuth } from "@/router/utils"; +import { defineComponent, Fragment } from 'vue' +import { hasAuth } from '@/router/utils' export default defineComponent({ - name: "Auth", + name: 'Auth', props: { value: { type: undefined, @@ -11,10 +11,10 @@ export default defineComponent({ }, setup(props, { slots }) { return () => { - if (!slots) return null; + if (!slots) return null return hasAuth(props.value) ? ( {slots.default?.()} - ) : null; - }; + ) : null + } } -}); +}) diff --git a/src/components/ReIcon/index.ts b/src/components/ReIcon/index.ts index b9f8807..1b91f1d 100644 --- a/src/components/ReIcon/index.ts +++ b/src/components/ReIcon/index.ts @@ -1,12 +1,12 @@ -import iconifyIconOffline from "./src/iconifyIconOffline"; -import iconifyIconOnline from "./src/iconifyIconOnline"; -import fontIcon from "./src/iconfont"; +import iconifyIconOffline from './src/iconifyIconOffline' +import iconifyIconOnline from './src/iconifyIconOnline' +import fontIcon from './src/iconfont' /** 本地图标组件 */ -const IconifyIconOffline = iconifyIconOffline; +const IconifyIconOffline = iconifyIconOffline /** 在线图标组件 */ -const IconifyIconOnline = iconifyIconOnline; +const IconifyIconOnline = iconifyIconOnline /** iconfont组件 */ -const FontIcon = fontIcon; +const FontIcon = fontIcon -export { IconifyIconOffline, IconifyIconOnline, FontIcon }; +export { IconifyIconOffline, IconifyIconOnline, FontIcon } diff --git a/src/components/ReIcon/src/hooks.ts b/src/components/ReIcon/src/hooks.ts index 4f430a8..efd5239 100644 --- a/src/components/ReIcon/src/hooks.ts +++ b/src/components/ReIcon/src/hooks.ts @@ -1,6 +1,6 @@ -import { iconType } from "./types"; -import { h, defineComponent, Component } from "vue"; -import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index"; +import { iconType } from './types' +import { h, defineComponent, Component } from 'vue' +import { IconifyIconOnline, IconifyIconOffline, FontIcon } from '../index' /** * 支持 `iconfont`、自定义 `svg` 以及 `iconify` 中所有的图标 @@ -11,51 +11,51 @@ import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index"; */ export function useRenderIcon(icon: any, attrs?: iconType): Component { // iconfont - const ifReg = /^IF-/; + const ifReg = /^IF-/ // typeof icon === "function" 属于SVG if (ifReg.test(icon)) { // iconfont - const name = icon.split(ifReg)[1]; + const name = icon.split(ifReg)[1] const iconName = name.slice( 0, - name.indexOf(" ") == -1 ? name.length : name.indexOf(" ") - ); - const iconType = name.slice(name.indexOf(" ") + 1, name.length); + name.indexOf(' ') == -1 ? name.length : name.indexOf(' ') + ) + const iconType = name.slice(name.indexOf(' ') + 1, name.length) return defineComponent({ - name: "FontIcon", + name: 'FontIcon', render() { return h(FontIcon, { icon: iconName, iconType, ...attrs - }); + }) } - }); - } else if (typeof icon === "function" || typeof icon?.render === "function") { + }) + } else if (typeof icon === 'function' || typeof icon?.render === 'function') { // svg - return icon; - } else if (typeof icon === "object") { + return icon + } else if (typeof icon === 'object') { return defineComponent({ - name: "OfflineIcon", + name: 'OfflineIcon', render() { return h(IconifyIconOffline, { icon: icon, ...attrs - }); + }) } - }); + }) } else { // 通过是否存在 : 符号来判断是在线还是本地图标,存在即是在线图标,反之 return defineComponent({ - name: "Icon", + name: 'Icon', render() { const IconifyIcon = - icon && icon.includes(":") ? IconifyIconOnline : IconifyIconOffline; + icon && icon.includes(':') ? IconifyIconOnline : IconifyIconOffline return h(IconifyIcon, { icon: icon, ...attrs - }); + }) } - }); + }) } } diff --git a/src/components/ReIcon/src/iconfont.ts b/src/components/ReIcon/src/iconfont.ts index c110451..49f7ae8 100644 --- a/src/components/ReIcon/src/iconfont.ts +++ b/src/components/ReIcon/src/iconfont.ts @@ -1,48 +1,48 @@ -import { h, defineComponent } from "vue"; +import { h, defineComponent } from 'vue' // 封装iconfont组件,默认`font-class`引用模式,支持`unicode`引用、`font-class`引用、`symbol`引用 (https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.20&helptype=code) export default defineComponent({ - name: "FontIcon", + name: 'FontIcon', props: { icon: { type: String, - default: "" + default: '' } }, render() { - const attrs = this.$attrs; - if (Object.keys(attrs).includes("uni") || attrs?.iconType === "uni") { + const attrs = this.$attrs + if (Object.keys(attrs).includes('uni') || attrs?.iconType === 'uni') { return h( - "i", + 'i', { - class: "iconfont", + class: 'iconfont', ...attrs }, this.icon - ); + ) } else if ( - Object.keys(attrs).includes("svg") || - attrs?.iconType === "svg" + Object.keys(attrs).includes('svg') || + attrs?.iconType === 'svg' ) { return h( - "svg", + 'svg', { - class: "icon-svg", - "aria-hidden": true + class: 'icon-svg', + 'aria-hidden': true }, { default: () => [ - h("use", { - "xlink:href": `#${this.icon}` + h('use', { + 'xlink:href': `#${this.icon}` }) ] } - ); + ) } else { - return h("i", { + return h('i', { class: `iconfont ${this.icon}`, ...attrs - }); + }) } } -}); +}) diff --git a/src/components/ReIcon/src/iconifyIconOffline.ts b/src/components/ReIcon/src/iconifyIconOffline.ts index 06a2a7c..63890e6 100644 --- a/src/components/ReIcon/src/iconifyIconOffline.ts +++ b/src/components/ReIcon/src/iconifyIconOffline.ts @@ -1,9 +1,9 @@ -import { h, defineComponent } from "vue"; -import { Icon as IconifyIcon, addIcon } from "@iconify/vue/dist/offline"; +import { h, defineComponent } from 'vue' +import { Icon as IconifyIcon, addIcon } from '@iconify/vue/dist/offline' // Iconify Icon在Vue里本地使用(用于内网环境)https://docs.iconify.design/icon-components/vue/offline.html export default defineComponent({ - name: "IconifyIconOffline", + name: 'IconifyIconOffline', components: { IconifyIcon }, props: { icon: { @@ -11,20 +11,20 @@ export default defineComponent({ } }, render() { - if (typeof this.icon === "object") addIcon(this.icon, this.icon); - const attrs = this.$attrs; + if (typeof this.icon === 'object') addIcon(this.icon, this.icon) + const attrs = this.$attrs return h( IconifyIcon, { icon: this.icon, style: attrs?.style - ? Object.assign(attrs.style, { outline: "none" }) - : { outline: "none" }, + ? Object.assign(attrs.style, { outline: 'none' }) + : { outline: 'none' }, ...attrs }, { default: () => [] } - ); + ) } -}); +}) diff --git a/src/components/ReIcon/src/iconifyIconOnline.ts b/src/components/ReIcon/src/iconifyIconOnline.ts index a5f5822..6adb2f4 100644 --- a/src/components/ReIcon/src/iconifyIconOnline.ts +++ b/src/components/ReIcon/src/iconifyIconOnline.ts @@ -1,30 +1,30 @@ -import { h, defineComponent } from "vue"; -import { Icon as IconifyIcon } from "@iconify/vue"; +import { h, defineComponent } from 'vue' +import { Icon as IconifyIcon } from '@iconify/vue' // Iconify Icon在Vue里在线使用(用于外网环境) export default defineComponent({ - name: "IconifyIconOnline", + name: 'IconifyIconOnline', components: { IconifyIcon }, props: { icon: { type: String, - default: "" + default: '' } }, render() { - const attrs = this.$attrs; + const attrs = this.$attrs return h( IconifyIcon, { icon: `${this.icon}`, style: attrs?.style - ? Object.assign(attrs.style, { outline: "none" }) - : { outline: "none" }, + ? Object.assign(attrs.style, { outline: 'none' }) + : { outline: 'none' }, ...attrs }, { default: () => [] } - ); + ) } -}); +}) diff --git a/src/components/ReIcon/src/offlineIcon.ts b/src/components/ReIcon/src/offlineIcon.ts index bb0e020..37ceb44 100644 --- a/src/components/ReIcon/src/offlineIcon.ts +++ b/src/components/ReIcon/src/offlineIcon.ts @@ -1,14 +1,26 @@ -import { addIcon } from "@iconify/vue/dist/offline"; +import { addIcon } from '@iconify/vue/dist/offline' /** * 这里存放本地图标,在 src/layout/index.vue 文件中加载,避免在首启动加载 */ // 本地菜单图标,后端在路由的icon中返回对应的图标字符串并且前端在此处使用addIcon添加即可渲染菜单图标 -import HomeFilled from "@iconify-icons/ep/home-filled"; -import InformationLine from "@iconify-icons/ri/information-line"; -import Lollipop from "@iconify-icons/ep/lollipop"; +import homeSmileLine from '@iconify-icons/ri/home-smile-line' +import InformationLine from '@iconify-icons/ri/information-line' +import signalWifiErrorLine from '@iconify-icons/ri/signal-wifi-error-line' +import lineChartLine from '@iconify-icons/ri/line-chart-line' +import barChart2Line from '@iconify-icons/ri/bar-chart-2-line' +import volumeUpLine from '@iconify-icons/ri/volume-up-line' +import userFollowLine from '@iconify-icons/ri/user-follow-line' +import arrowUpCircleLine from '@iconify-icons/ri/arrow-up-circle-line' +import settings4Line from '@iconify-icons/ri/settings-4-line' -addIcon("homeFilled", HomeFilled); -addIcon("informationLine", InformationLine); -addIcon("lollipop", Lollipop); +addIcon('homeSmileLine', homeSmileLine) +addIcon('informationLine', InformationLine) +addIcon('signalWifiErrorLine', signalWifiErrorLine) +addIcon('lineChartLine', lineChartLine) +addIcon('barChart2Line', barChart2Line) +addIcon('volumeUpLine', volumeUpLine) +addIcon('userFollowLine', userFollowLine) +addIcon('arrowUpCircleLine', arrowUpCircleLine) +addIcon('settings4Line', settings4Line) diff --git a/src/components/ReIcon/src/types.ts b/src/components/ReIcon/src/types.ts index 8ae8a54..53b5930 100644 --- a/src/components/ReIcon/src/types.ts +++ b/src/components/ReIcon/src/types.ts @@ -1,19 +1,19 @@ export interface iconType { // iconify (https://docs.iconify.design/icon-components/vue/#properties) - inline?: boolean; - width?: string | number; - height?: string | number; - horizontalFlip?: boolean; - verticalFlip?: boolean; - flip?: string; - rotate?: number | string; - color?: string; - horizontalAlign?: boolean; - verticalAlign?: boolean; - align?: string; - onLoad?: Function; - includes?: Function; + inline?: boolean + width?: string | number + height?: string | number + horizontalFlip?: boolean + verticalFlip?: boolean + flip?: string + rotate?: number | string + color?: string + horizontalAlign?: boolean + verticalAlign?: boolean + align?: string + onLoad?: Function + includes?: Function // all icon - style?: object; + style?: object } diff --git a/src/config/index.ts b/src/config/index.ts index 9b0a372..cd1fe7f 100644 --- a/src/config/index.ts +++ b/src/config/index.ts @@ -1,52 +1,52 @@ -import { App } from "vue"; -import axios from "axios"; +import { App } from 'vue' +import axios from 'axios' -let config: object = {}; -const { VITE_PUBLIC_PATH } = import.meta.env; +let config: object = {} +const { VITE_PUBLIC_PATH } = import.meta.env const setConfig = (cfg?: unknown) => { - config = Object.assign(config, cfg); -}; + config = Object.assign(config, cfg) +} const getConfig = (key?: string): ServerConfigs => { - if (typeof key === "string") { - const arr = key.split("."); + if (typeof key === 'string') { + const arr = key.split('.') if (arr && arr.length) { - let data = config; + let data = config arr.forEach(v => { - if (data && typeof data[v] !== "undefined") { - data = data[v]; + if (data && typeof data[v] !== 'undefined') { + data = data[v] } else { - data = null; + data = null } - }); - return data; + }) + return data } } - return config; -}; + return config +} /** 获取项目动态全局配置 */ export const getServerConfig = async (app: App): Promise => { - app.config.globalProperties.$config = getConfig(); + app.config.globalProperties.$config = getConfig() return axios({ - method: "get", + method: 'get', url: `${VITE_PUBLIC_PATH}serverConfig.json` }) .then(({ data: config }) => { - let $config = app.config.globalProperties.$config; + let $config = app.config.globalProperties.$config // 自动注入项目配置 - if (app && $config && typeof config === "object") { - $config = Object.assign($config, config); - app.config.globalProperties.$config = $config; + if (app && $config && typeof config === 'object') { + $config = Object.assign($config, config) + app.config.globalProperties.$config = $config // 设置全局配置 - setConfig($config); + setConfig($config) } - return $config; + return $config }) .catch(() => { - throw "请在public文件夹下添加serverConfig.json配置文件"; - }); -}; + throw '请在public文件夹下添加serverConfig.json配置文件' + }) +} -export { getConfig, setConfig }; +export { getConfig, setConfig } diff --git a/src/directives/auth/index.ts b/src/directives/auth/index.ts index 627ea89..6706530 100644 --- a/src/directives/auth/index.ts +++ b/src/directives/auth/index.ts @@ -1,13 +1,13 @@ -import { hasAuth } from "@/router/utils"; -import { Directive, type DirectiveBinding } from "vue"; +import { hasAuth } from '@/router/utils' +import { Directive, type DirectiveBinding } from 'vue' export const auth: Directive = { mounted(el: HTMLElement, binding: DirectiveBinding) { - const { value } = binding; + const { value } = binding if (value) { - !hasAuth(value) && el.parentNode?.removeChild(el); + !hasAuth(value) && el.parentNode?.removeChild(el) } else { - throw new Error("need auths! Like v-auth=\"['btn.add','btn.edit']\""); + throw new Error("need auths! Like v-auth=\"['btn.add','btn.edit']\"") } } -}; +} diff --git a/src/directives/elResizeDetector/index.ts b/src/directives/elResizeDetector/index.ts index af089be..2bb55e5 100644 --- a/src/directives/elResizeDetector/index.ts +++ b/src/directives/elResizeDetector/index.ts @@ -1,27 +1,27 @@ -import { Directive, type DirectiveBinding, type VNode } from "vue"; -import elementResizeDetectorMaker from "element-resize-detector"; -import type { Erd } from "element-resize-detector"; -import { emitter } from "@/utils/mitt"; +import { Directive, type DirectiveBinding, type VNode } from 'vue' +import elementResizeDetectorMaker from 'element-resize-detector' +import type { Erd } from 'element-resize-detector' +import { emitter } from '@/utils/mitt' const erd: Erd = elementResizeDetectorMaker({ - strategy: "scroll" -}); + strategy: 'scroll' +}) export const resize: Directive = { mounted(el: HTMLElement, binding?: DirectiveBinding, vnode?: VNode) { erd.listenTo(el, elem => { - const width = elem.offsetWidth; - const height = elem.offsetHeight; + const width = elem.offsetWidth + const height = elem.offsetHeight if (binding?.instance) { - emitter.emit("resize", { detail: { width, height } }); + emitter.emit('resize', { detail: { width, height } }) } else { vnode.el.dispatchEvent( - new CustomEvent("resize", { detail: { width, height } }) - ); + new CustomEvent('resize', { detail: { width, height } }) + ) } - }); + }) }, unmounted(el: HTMLElement) { - erd.uninstall(el); + erd.uninstall(el) } -}; +} diff --git a/src/directives/index.ts b/src/directives/index.ts index d6d6592..d732554 100644 --- a/src/directives/index.ts +++ b/src/directives/index.ts @@ -1,2 +1,2 @@ -export * from "./auth"; -export * from "./elResizeDetector"; +export * from './auth' +export * from './elResizeDetector' diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue index e9b5450..c28ae39 100644 --- a/src/layout/components/appMain.vue +++ b/src/layout/components/appMain.vue @@ -1,42 +1,42 @@ diff --git a/src/layout/components/navbar.vue b/src/layout/components/navbar.vue index bbe0e25..ad4d200 100644 --- a/src/layout/components/navbar.vue +++ b/src/layout/components/navbar.vue @@ -1,15 +1,15 @@ @@ -98,7 +98,7 @@ const { t, locale, translationCh, translationEn } = useTranslationLang(); :icon="LogoutCircleRLine" style="margin: 5px" /> - {{ t("buttons.hsLoginOut") }} + {{ t('buttons.hsLoginOut') }} diff --git a/src/layout/components/notice/data.ts b/src/layout/components/notice/data.ts index 14c7560..d7bc48d 100644 --- a/src/layout/components/notice/data.ts +++ b/src/layout/components/notice/data.ts @@ -1,146 +1,146 @@ export interface ListItem { - avatar: string; - title: string; - datetime: string; - type: string; - description: string; - status?: "" | "success" | "warning" | "info" | "danger"; - extra?: string; + avatar: string + title: string + datetime: string + type: string + description: string + status?: '' | 'success' | 'warning' | 'info' | 'danger' + extra?: string } export interface TabItem { - key: string; - name: string; - list: ListItem[]; + key: string + name: string + list: ListItem[] } export const noticesData: TabItem[] = [ { - key: "1", - name: "通知", + key: '1', + name: '通知', list: [ { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - title: "你收到了 12 份新周报", - datetime: "一年前", - description: "", - type: "1" + 'https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png', + title: '你收到了 12 份新周报', + datetime: '一年前', + description: '', + type: '1' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", - title: "你推荐的 前端高手 已通过第三轮面试", - datetime: "一年前", - description: "", - type: "1" + 'https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png', + title: '你推荐的 前端高手 已通过第三轮面试', + datetime: '一年前', + description: '', + type: '1' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", - title: "这种模板可以区分多种通知类型", - datetime: "一年前", - description: "", - type: "1" + 'https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png', + title: '这种模板可以区分多种通知类型', + datetime: '一年前', + description: '', + type: '1' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", + 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png', title: - "展示标题内容超过一行后的处理方式,如果内容超过1行将自动截断并支持tooltip显示完整标题。", - datetime: "一年前", - description: "", - type: "1" + '展示标题内容超过一行后的处理方式,如果内容超过1行将自动截断并支持tooltip显示完整标题。', + datetime: '一年前', + description: '', + type: '1' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", - title: "左侧图标用于区分不同的类型", - datetime: "一年前", - description: "", - type: "1" + 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png', + title: '左侧图标用于区分不同的类型', + datetime: '一年前', + description: '', + type: '1' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", - title: "左侧图标用于区分不同的类型", - datetime: "一年前", - description: "", - type: "1" + 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png', + title: '左侧图标用于区分不同的类型', + datetime: '一年前', + description: '', + type: '1' } ] }, { - key: "2", - name: "消息", + key: '2', + name: '消息', list: [ { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg", - title: "李白 评论了你", - description: "长风破浪会有时,直挂云帆济沧海", - datetime: "一年前", - type: "2" + 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg', + title: '李白 评论了你', + description: '长风破浪会有时,直挂云帆济沧海', + datetime: '一年前', + type: '2' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg", - title: "李白 回复了你", - description: "行路难,行路难,多歧路,今安在。", - datetime: "一年前", - type: "2" + 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg', + title: '李白 回复了你', + description: '行路难,行路难,多歧路,今安在。', + datetime: '一年前', + type: '2' }, { avatar: - "https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg", - title: "标题", + 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg', + title: '标题', description: - "请将鼠标移动到此处,以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2,超过2行的描述内容将被省略并且可以通过tooltip查看完整内容", - datetime: "一年前", - type: "2" + '请将鼠标移动到此处,以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2,超过2行的描述内容将被省略并且可以通过tooltip查看完整内容', + datetime: '一年前', + type: '2' } ] }, { - key: "3", - name: "代办", + key: '3', + name: '代办', list: [ { - avatar: "", - title: "任务名称", - description: "任务需要在 2022-11-16 20:00 前启动", - datetime: "", - extra: "未开始", - status: "info", - type: "3" + avatar: '', + title: '任务名称', + description: '任务需要在 2022-11-16 20:00 前启动', + datetime: '', + extra: '未开始', + status: 'info', + type: '3' }, { - avatar: "", - title: "第三方紧急代码变更", + avatar: '', + title: '第三方紧急代码变更', description: - "一拳提交于 2022-11-16,需在 2022-11-18 前完成代码变更任务", - datetime: "", - extra: "马上到期", - status: "danger", - type: "3" + '一拳提交于 2022-11-16,需在 2022-11-18 前完成代码变更任务', + datetime: '', + extra: '马上到期', + status: 'danger', + type: '3' }, { - avatar: "", - title: "信息安全考试", - description: "指派小仙于 2022-12-12 前完成更新并发布", - datetime: "", - extra: "已耗时 8 天", - status: "warning", - type: "3" + avatar: '', + title: '信息安全考试', + description: '指派小仙于 2022-12-12 前完成更新并发布', + datetime: '', + extra: '已耗时 8 天', + status: 'warning', + type: '3' }, { - avatar: "", - title: "vue-pure-admin 版本发布", - description: "vue-pure-admin 版本发布", - datetime: "", - extra: "进行中", - type: "3" + avatar: '', + title: 'vue-pure-admin 版本发布', + description: 'vue-pure-admin 版本发布', + datetime: '', + extra: '进行中', + type: '3' } ] } -]; +] diff --git a/src/layout/components/notice/index.vue b/src/layout/components/notice/index.vue index ea0502f..7545b1a 100644 --- a/src/layout/components/notice/index.vue +++ b/src/layout/components/notice/index.vue @@ -1,14 +1,14 @@ diff --git a/src/layout/components/notice/noticeItem.vue b/src/layout/components/notice/noticeItem.vue index 032e6ac..ef8392a 100644 --- a/src/layout/components/notice/noticeItem.vue +++ b/src/layout/components/notice/noticeItem.vue @@ -1,49 +1,49 @@ diff --git a/src/layout/components/notice/noticeList.vue b/src/layout/components/notice/noticeList.vue index 109cd1a..98942f0 100644 --- a/src/layout/components/notice/noticeList.vue +++ b/src/layout/components/notice/noticeList.vue @@ -1,14 +1,14 @@ diff --git a/src/layout/components/panel/index.vue b/src/layout/components/panel/index.vue index 85241af..cb1c157 100644 --- a/src/layout/components/panel/index.vue +++ b/src/layout/components/panel/index.vue @@ -1,35 +1,35 @@ diff --git a/src/layout/components/search/components/SearchFooter.vue b/src/layout/components/search/components/SearchFooter.vue index 52cb512..5f7b3ed 100644 --- a/src/layout/components/search/components/SearchFooter.vue +++ b/src/layout/components/search/components/SearchFooter.vue @@ -17,10 +17,10 @@ diff --git a/src/layout/frameView.vue b/src/layout/frameView.vue index cc2ab18..360cb35 100644 --- a/src/layout/frameView.vue +++ b/src/layout/frameView.vue @@ -1,47 +1,47 @@ diff --git a/src/layout/hooks/useBoolean.ts b/src/layout/hooks/useBoolean.ts index 1d14031..bed8ada 100644 --- a/src/layout/hooks/useBoolean.ts +++ b/src/layout/hooks/useBoolean.ts @@ -1,19 +1,19 @@ -import { ref } from "vue"; +import { ref } from 'vue' export function useBoolean(initValue = false) { - const bool = ref(initValue); + const bool = ref(initValue) function setBool(value: boolean) { - bool.value = value; + bool.value = value } function setTrue() { - setBool(true); + setBool(true) } function setFalse() { - setBool(false); + setBool(false) } function toggle() { - setBool(!bool.value); + setBool(!bool.value) } return { @@ -22,5 +22,5 @@ export function useBoolean(initValue = false) { setTrue, setFalse, toggle - }; + } } diff --git a/src/layout/hooks/useDataThemeChange.ts b/src/layout/hooks/useDataThemeChange.ts index 6a08b6d..8036140 100644 --- a/src/layout/hooks/useDataThemeChange.ts +++ b/src/layout/hooks/useDataThemeChange.ts @@ -1,61 +1,61 @@ -import { ref } from "vue"; -import { getConfig } from "@/config"; -import { useLayout } from "./useLayout"; -import { themeColorsType } from "../types"; -import { useGlobal } from "@pureadmin/utils"; -import { useEpThemeStoreHook } from "@/store/modules/epTheme"; +import { ref } from 'vue' +import { getConfig } from '@/config' +import { useLayout } from './useLayout' +import { themeColorsType } from '../types' +import { useGlobal } from '@pureadmin/utils' +import { useEpThemeStoreHook } from '@/store/modules/epTheme' import { darken, lighten, toggleTheme -} from "@pureadmin/theme/dist/browser-utils"; +} from '@pureadmin/theme/dist/browser-utils' export function useDataThemeChange() { - const { layoutTheme, layout } = useLayout(); + const { layoutTheme, layout } = useLayout() const themeColors = ref>([ /* 道奇蓝(默认) */ - { color: "#1b2a47", themeColor: "default" }, + { color: '#1b2a47', themeColor: 'default' }, /* 亮白色 */ - { color: "#ffffff", themeColor: "light" }, + { color: '#ffffff', themeColor: 'light' }, /* 猩红色 */ - { color: "#f5222d", themeColor: "dusk" }, + { color: '#f5222d', themeColor: 'dusk' }, /* 橙红色 */ - { color: "#fa541c", themeColor: "volcano" }, + { color: '#fa541c', themeColor: 'volcano' }, /* 金色 */ - { color: "#fadb14", themeColor: "yellow" }, + { color: '#fadb14', themeColor: 'yellow' }, /* 绿宝石 */ - { color: "#13c2c2", themeColor: "mingQing" }, + { color: '#13c2c2', themeColor: 'mingQing' }, /* 酸橙绿 */ - { color: "#52c41a", themeColor: "auroraGreen" }, + { color: '#52c41a', themeColor: 'auroraGreen' }, /* 深粉色 */ - { color: "#eb2f96", themeColor: "pink" }, + { color: '#eb2f96', themeColor: 'pink' }, /* 深紫罗兰色 */ - { color: "#722ed1", themeColor: "saucePurple" } - ]); + { color: '#722ed1', themeColor: 'saucePurple' } + ]) - const { $storage } = useGlobal(); - const dataTheme = ref($storage?.layout?.darkMode); - const body = document.documentElement as HTMLElement; + const { $storage } = useGlobal() + const dataTheme = ref($storage?.layout?.darkMode) + const body = document.documentElement as HTMLElement /** 设置导航主题色 */ - function setLayoutThemeColor(theme = getConfig().Theme ?? "default") { - layoutTheme.value.theme = theme; + function setLayoutThemeColor(theme = getConfig().Theme ?? 'default') { + layoutTheme.value.theme = theme toggleTheme({ scopeName: `layout-theme-${theme}` - }); + }) $storage.layout = { layout: layout.value, theme, darkMode: dataTheme.value, sidebarStatus: $storage.layout?.sidebarStatus, epThemeColor: $storage.layout?.epThemeColor - }; + } - if (theme === "default" || theme === "light") { - setEpThemeColor(getConfig().EpThemeColor); + if (theme === 'default' || theme === 'light') { + setEpThemeColor(getConfig().EpThemeColor) } else { - const colors = themeColors.value.find(v => v.themeColor === theme); - setEpThemeColor(colors.color); + const colors = themeColors.value.find(v => v.themeColor === theme) + setEpThemeColor(colors.color) } } @@ -63,34 +63,34 @@ export function useDataThemeChange() { document.documentElement.style.setProperty( `--el-color-primary-${mode}-${i}`, dataTheme.value ? darken(color, i / 10) : lighten(color, i / 10) - ); + ) } /** 设置 `element-plus` 主题色 */ const setEpThemeColor = (color: string) => { - useEpThemeStoreHook().setEpThemeColor(color); - document.documentElement.style.setProperty("--el-color-primary", color); + useEpThemeStoreHook().setEpThemeColor(color) + document.documentElement.style.setProperty('--el-color-primary', color) for (let i = 1; i <= 2; i++) { - setPropertyPrimary("dark", i, color); + setPropertyPrimary('dark', i, color) } for (let i = 1; i <= 9; i++) { - setPropertyPrimary("light", i, color); + setPropertyPrimary('light', i, color) } - }; + } /** 日间、夜间主题切换 */ function dataThemeChange() { /* 如果当前是light夜间主题,默认切换到default主题 */ - if (useEpThemeStoreHook().epTheme === "light" && dataTheme.value) { - setLayoutThemeColor("default"); + if (useEpThemeStoreHook().epTheme === 'light' && dataTheme.value) { + setLayoutThemeColor('default') } else { - setLayoutThemeColor(useEpThemeStoreHook().epTheme); + setLayoutThemeColor(useEpThemeStoreHook().epTheme) } if (dataTheme.value) { - document.documentElement.classList.add("dark"); + document.documentElement.classList.add('dark') } else { - document.documentElement.classList.remove("dark"); + document.documentElement.classList.remove('dark') } } @@ -102,5 +102,5 @@ export function useDataThemeChange() { dataThemeChange, setEpThemeColor, setLayoutThemeColor - }; + } } diff --git a/src/layout/hooks/useLayout.ts b/src/layout/hooks/useLayout.ts index 159d072..3a9df76 100644 --- a/src/layout/hooks/useLayout.ts +++ b/src/layout/hooks/useLayout.ts @@ -1,11 +1,11 @@ -import { computed } from "vue"; -import { useI18n } from "vue-i18n"; -import { routerArrays } from "../types"; -import { useGlobal } from "@pureadmin/utils"; -import { useMultiTagsStore } from "@/store/modules/multiTags"; +import { computed } from 'vue' +import { useI18n } from 'vue-i18n' +import { routerArrays } from '../types' +import { useGlobal } from '@pureadmin/utils' +import { useMultiTagsStore } from '@/store/modules/multiTags' export function useLayout() { - const { $storage, $config } = useGlobal(); + const { $storage, $config } = useGlobal() const initStorage = () => { /** 路由 */ @@ -13,22 +13,22 @@ export function useLayout() { useMultiTagsStore().multiTagsCache && (!$storage.tags || $storage.tags.length === 0) ) { - $storage.tags = routerArrays; + $storage.tags = routerArrays } /** 国际化 */ if (!$storage.locale) { - $storage.locale = { locale: $config?.Locale ?? "zh" }; - useI18n().locale.value = $config?.Locale ?? "zh"; + $storage.locale = { locale: $config?.Locale ?? 'zh' } + useI18n().locale.value = $config?.Locale ?? 'zh' } /** 导航 */ if (!$storage.layout) { $storage.layout = { - layout: $config?.Layout ?? "vertical", - theme: $config?.Theme ?? "default", + layout: $config?.Layout ?? 'vertical', + theme: $config?.Theme ?? 'default', darkMode: $config?.DarkMode ?? false, sidebarStatus: $config?.SidebarStatus ?? true, - epThemeColor: $config?.EpThemeColor ?? "#409EFF" - }; + epThemeColor: $config?.EpThemeColor ?? '#409EFF' + } } /** 灰色模式、色弱模式、隐藏标签页 */ if (!$storage.configure) { @@ -37,24 +37,24 @@ export function useLayout() { weak: $config?.Weak ?? false, hideTabs: $config?.HideTabs ?? false, showLogo: $config?.ShowLogo ?? true, - showModel: $config?.ShowModel ?? "smart", + showModel: $config?.ShowModel ?? 'smart', multiTagsCache: $config?.MultiTagsCache ?? false - }; + } } - }; + } /** 清空缓存后从serverConfig.json读取默认配置并赋值到storage中 */ const layout = computed(() => { - return $storage?.layout.layout; - }); + return $storage?.layout.layout + }) const layoutTheme = computed(() => { - return $storage.layout; - }); + return $storage.layout + }) return { layout, layoutTheme, initStorage - }; + } } diff --git a/src/layout/hooks/useNav.ts b/src/layout/hooks/useNav.ts index 8d8ed7a..a43dabe 100644 --- a/src/layout/hooks/useNav.ts +++ b/src/layout/hooks/useNav.ts @@ -1,150 +1,150 @@ -import { storeToRefs } from "pinia"; -import { getConfig } from "@/config"; -import { useRouter } from "vue-router"; -import { emitter } from "@/utils/mitt"; -import { routeMetaType } from "../types"; -import { useGlobal } from "@pureadmin/utils"; -import { transformI18n } from "@/plugins/i18n"; -import { router, remainingPaths } from "@/router"; -import { computed, type CSSProperties } from "vue"; -import { useAppStoreHook } from "@/store/modules/app"; -import { useUserStoreHook } from "@/store/modules/user"; -import { useEpThemeStoreHook } from "@/store/modules/epTheme"; -import { usePermissionStoreHook } from "@/store/modules/permission"; +import { storeToRefs } from 'pinia' +import { getConfig } from '@/config' +import { useRouter } from 'vue-router' +import { emitter } from '@/utils/mitt' +import { routeMetaType } from '../types' +import { useGlobal } from '@pureadmin/utils' +import { transformI18n } from '@/plugins/i18n' +import { router, remainingPaths } from '@/router' +import { computed, type CSSProperties } from 'vue' +import { useAppStoreHook } from '@/store/modules/app' +import { useUserStoreHook } from '@/store/modules/user' +import { useEpThemeStoreHook } from '@/store/modules/epTheme' +import { usePermissionStoreHook } from '@/store/modules/permission' -const errorInfo = "当前路由配置不正确,请检查配置"; +const errorInfo = '当前路由配置不正确,请检查配置' export function useNav() { - const pureApp = useAppStoreHook(); - const routers = useRouter().options.routes; - const { wholeMenus } = storeToRefs(usePermissionStoreHook()); + const pureApp = useAppStoreHook() + const routers = useRouter().options.routes + const { wholeMenus } = storeToRefs(usePermissionStoreHook()) /** 平台`layout`中所有`el-tooltip`的`effect`配置,默认`light` */ - const tooltipEffect = getConfig()?.TooltipEffect ?? "light"; + const tooltipEffect = getConfig()?.TooltipEffect ?? 'light' const getDivStyle = computed((): CSSProperties => { return { - width: "100%", - display: "flex", - alignItems: "center", - justifyContent: "space-between", - overflow: "hidden" - }; - }); + width: '100%', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + overflow: 'hidden' + } + }) /** 用户名 */ const username = computed(() => { - return useUserStoreHook()?.username; - }); + return useUserStoreHook()?.username + }) /** 设置国际化选中后的样式 */ const getDropdownItemStyle = computed(() => { return (locale, t) => { return { - background: locale === t ? useEpThemeStoreHook().epThemeColor : "", - color: locale === t ? "#f4f4f5" : "#000" - }; - }; - }); + background: locale === t ? useEpThemeStoreHook().epThemeColor : '', + color: locale === t ? '#f4f4f5' : '#000' + } + } + }) const getDropdownItemClass = computed(() => { return (locale, t) => { - return locale === t ? "" : "dark:hover:!text-primary"; - }; - }); + return locale === t ? '' : 'dark:hover:!text-primary' + } + }) const avatarsStyle = computed(() => { - return username.value ? { marginRight: "10px" } : ""; - }); + return username.value ? { marginRight: '10px' } : '' + }) const isCollapse = computed(() => { - return !pureApp.getSidebarStatus; - }); + return !pureApp.getSidebarStatus + }) const device = computed(() => { - return pureApp.getDevice; - }); + return pureApp.getDevice + }) - const { $storage, $config } = useGlobal(); + const { $storage, $config } = useGlobal() const layout = computed(() => { - return $storage?.layout?.layout; - }); + return $storage?.layout?.layout + }) const title = computed(() => { - return $config.Title; - }); + return $config.Title + }) /** 动态title */ function changeTitle(meta: routeMetaType) { - const Title = getConfig().Title; - if (Title) document.title = `${transformI18n(meta.title)} | ${Title}`; - else document.title = transformI18n(meta.title); + const Title = getConfig().Title + if (Title) document.title = `${transformI18n(meta.title)} | ${Title}` + else document.title = transformI18n(meta.title) } /** 退出登录 */ function logout() { - useUserStoreHook().logOut(); + useUserStoreHook().logOut() } function backHome() { - router.push("/welcome"); + router.push('/welcome') } function onPanel() { - emitter.emit("openPanel"); + emitter.emit('openPanel') } function toggleSideBar() { - pureApp.toggleSideBar(); + pureApp.toggleSideBar() } function handleResize(menuRef) { - menuRef?.handleResize(); + menuRef?.handleResize() } function resolvePath(route) { - if (!route.children) return console.error(errorInfo); - const httpReg = /^http(s?):\/\//; - const routeChildPath = route.children[0]?.path; + if (!route.children) return console.error(errorInfo) + const httpReg = /^http(s?):\/\// + const routeChildPath = route.children[0]?.path if (httpReg.test(routeChildPath)) { - return route.path + "/" + routeChildPath; + return route.path + '/' + routeChildPath } else { - return routeChildPath; + return routeChildPath } } function menuSelect(indexPath: string, routers): void { - if (wholeMenus.value.length === 0) return; - if (isRemaining(indexPath)) return; - let parentPath = ""; - const parentPathIndex = indexPath.lastIndexOf("/"); + if (wholeMenus.value.length === 0) return + if (isRemaining(indexPath)) return + let parentPath = '' + const parentPathIndex = indexPath.lastIndexOf('/') if (parentPathIndex > 0) { - parentPath = indexPath.slice(0, parentPathIndex); + parentPath = indexPath.slice(0, parentPathIndex) } /** 找到当前路由的信息 */ function findCurrentRoute(indexPath: string, routes) { - if (!routes) return console.error(errorInfo); + if (!routes) return console.error(errorInfo) return routes.map(item => { if (item.path === indexPath) { if (item.redirect) { - findCurrentRoute(item.redirect, item.children); + findCurrentRoute(item.redirect, item.children) } else { /** 切换左侧菜单 通知标签页 */ - emitter.emit("changLayoutRoute", { + emitter.emit('changLayoutRoute', { indexPath, parentPath - }); + }) } } else { - if (item.children) findCurrentRoute(indexPath, item.children); + if (item.children) findCurrentRoute(indexPath, item.children) } - }); + }) } - findCurrentRoute(indexPath, routers); + findCurrentRoute(indexPath, routers) } /** 判断路径是否参与菜单 */ function isRemaining(path: string): boolean { - return remainingPaths.includes(path); + return remainingPaths.includes(path) } return { @@ -169,5 +169,5 @@ export function useNav() { tooltipEffect, getDropdownItemStyle, getDropdownItemClass - }; + } } diff --git a/src/layout/hooks/useTag.ts b/src/layout/hooks/useTag.ts index 40fb192..03a2f88 100644 --- a/src/layout/hooks/useTag.ts +++ b/src/layout/hooks/useTag.ts @@ -7,213 +7,213 @@ import { onMounted, CSSProperties, getCurrentInstance -} from "vue"; -import { tagsViewsType } from "../types"; -import { useEventListener } from "@vueuse/core"; -import { useRoute, useRouter } from "vue-router"; -import { transformI18n, $t } from "@/plugins/i18n"; -import { useSettingStoreHook } from "@/store/modules/settings"; -import { useMultiTagsStoreHook } from "@/store/modules/multiTags"; +} from 'vue' +import { tagsViewsType } from '../types' +import { useEventListener } from '@vueuse/core' +import { useRoute, useRouter } from 'vue-router' +import { transformI18n, $t } from '@/plugins/i18n' +import { useSettingStoreHook } from '@/store/modules/settings' +import { useMultiTagsStoreHook } from '@/store/modules/multiTags' import { isEqual, isBoolean, storageLocal, toggleClass, hasClass -} from "@pureadmin/utils"; +} from '@pureadmin/utils' -import Fullscreen from "@iconify-icons/ri/fullscreen-fill"; -import CloseAllTags from "@iconify-icons/ri/subtract-line"; -import CloseOtherTags from "@iconify-icons/ri/text-spacing"; -import CloseRightTags from "@iconify-icons/ri/text-direction-l"; -import CloseLeftTags from "@iconify-icons/ri/text-direction-r"; -import RefreshRight from "@iconify-icons/ep/refresh-right"; -import Close from "@iconify-icons/ep/close"; +import Fullscreen from '@iconify-icons/ri/fullscreen-fill' +import CloseAllTags from '@iconify-icons/ri/subtract-line' +import CloseOtherTags from '@iconify-icons/ri/text-spacing' +import CloseRightTags from '@iconify-icons/ri/text-direction-l' +import CloseLeftTags from '@iconify-icons/ri/text-direction-r' +import RefreshRight from '@iconify-icons/ep/refresh-right' +import Close from '@iconify-icons/ep/close' export function useTags() { - const route = useRoute(); - const router = useRouter(); - const instance = getCurrentInstance(); - const pureSetting = useSettingStoreHook(); + const route = useRoute() + const router = useRouter() + const instance = getCurrentInstance() + const pureSetting = useSettingStoreHook() - const buttonTop = ref(0); - const buttonLeft = ref(0); - const translateX = ref(0); - const visible = ref(false); - const activeIndex = ref(-1); + const buttonTop = ref(0) + const buttonLeft = ref(0) + const translateX = ref(0) + const visible = ref(false) + const activeIndex = ref(-1) // 当前右键选中的路由信息 - const currentSelect = ref({}); + const currentSelect = ref({}) /** 显示模式,默认灵动模式 */ const showModel = ref( - storageLocal().getItem("responsive-configure")?.showModel || - "smart" - ); + storageLocal().getItem('responsive-configure')?.showModel || + 'smart' + ) /** 是否隐藏标签页,默认显示 */ const showTags = ref( - storageLocal().getItem("responsive-configure").hideTabs - ) ?? ref("false"); + storageLocal().getItem('responsive-configure').hideTabs + ) ?? ref('false') const multiTags: any = computed(() => { - return useMultiTagsStoreHook().multiTags; - }); + return useMultiTagsStoreHook().multiTags + }) const tagsViews = reactive>([ { icon: RefreshRight, - text: $t("buttons.hsreload"), + text: $t('buttons.hsreload'), divided: false, disabled: false, show: true }, { icon: Close, - text: $t("buttons.hscloseCurrentTab"), + text: $t('buttons.hscloseCurrentTab'), divided: false, disabled: multiTags.value.length > 1 ? false : true, show: true }, { icon: CloseLeftTags, - text: $t("buttons.hscloseLeftTabs"), + text: $t('buttons.hscloseLeftTabs'), divided: true, disabled: multiTags.value.length > 1 ? false : true, show: true }, { icon: CloseRightTags, - text: $t("buttons.hscloseRightTabs"), + text: $t('buttons.hscloseRightTabs'), divided: false, disabled: multiTags.value.length > 1 ? false : true, show: true }, { icon: CloseOtherTags, - text: $t("buttons.hscloseOtherTabs"), + text: $t('buttons.hscloseOtherTabs'), divided: true, disabled: multiTags.value.length > 2 ? false : true, show: true }, { icon: CloseAllTags, - text: $t("buttons.hscloseAllTabs"), + text: $t('buttons.hscloseAllTabs'), divided: false, disabled: multiTags.value.length > 1 ? false : true, show: true }, { icon: Fullscreen, - text: $t("buttons.hswholeFullScreen"), + text: $t('buttons.hswholeFullScreen'), divided: true, disabled: false, show: true }, { icon: Fullscreen, - text: $t("buttons.hscontentFullScreen"), + text: $t('buttons.hscontentFullScreen'), divided: false, disabled: false, show: true } - ]); + ]) function conditionHandle(item, previous, next) { if (isBoolean(route?.meta?.showLink) && route?.meta?.showLink === false) { if (Object.keys(route.query).length > 0) { - return isEqual(route.query, item.query) ? previous : next; + return isEqual(route.query, item.query) ? previous : next } else { - return isEqual(route.params, item.params) ? previous : next; + return isEqual(route.params, item.params) ? previous : next } } else { - return route.path === item.path ? previous : next; + return route.path === item.path ? previous : next } } const iconIsActive = computed(() => { return (item, index) => { - if (index === 0) return; - return conditionHandle(item, true, false); - }; - }); + if (index === 0) return + return conditionHandle(item, true, false) + } + }) const linkIsActive = computed(() => { return item => { - return conditionHandle(item, "is-active", ""); - }; - }); + return conditionHandle(item, 'is-active', '') + } + }) const scheduleIsActive = computed(() => { return item => { - return conditionHandle(item, "schedule-active", ""); - }; - }); + return conditionHandle(item, 'schedule-active', '') + } + }) const getTabStyle = computed((): CSSProperties => { return { transform: `translateX(${translateX.value}px)` - }; - }); + } + }) const getContextMenuStyle = computed((): CSSProperties => { - return { left: buttonLeft.value + "px", top: buttonTop.value + "px" }; - }); + return { left: buttonLeft.value + 'px', top: buttonTop.value + 'px' } + }) const closeMenu = () => { - visible.value = false; - }; + visible.value = false + } /** 鼠标移入添加激活样式 */ function onMouseenter(index) { - if (index) activeIndex.value = index; - if (unref(showModel) === "smart") { - if (hasClass(instance.refs["schedule" + index][0], "schedule-active")) - return; - toggleClass(true, "schedule-in", instance.refs["schedule" + index][0]); - toggleClass(false, "schedule-out", instance.refs["schedule" + index][0]); + if (index) activeIndex.value = index + if (unref(showModel) === 'smart') { + if (hasClass(instance.refs['schedule' + index][0], 'schedule-active')) + return + toggleClass(true, 'schedule-in', instance.refs['schedule' + index][0]) + toggleClass(false, 'schedule-out', instance.refs['schedule' + index][0]) } else { - if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return; - toggleClass(true, "card-in", instance.refs["dynamic" + index][0]); - toggleClass(false, "card-out", instance.refs["dynamic" + index][0]); + if (hasClass(instance.refs['dynamic' + index][0], 'card-active')) return + toggleClass(true, 'card-in', instance.refs['dynamic' + index][0]) + toggleClass(false, 'card-out', instance.refs['dynamic' + index][0]) } } /** 鼠标移出恢复默认样式 */ function onMouseleave(index) { - activeIndex.value = -1; - if (unref(showModel) === "smart") { - if (hasClass(instance.refs["schedule" + index][0], "schedule-active")) - return; - toggleClass(false, "schedule-in", instance.refs["schedule" + index][0]); - toggleClass(true, "schedule-out", instance.refs["schedule" + index][0]); + activeIndex.value = -1 + if (unref(showModel) === 'smart') { + if (hasClass(instance.refs['schedule' + index][0], 'schedule-active')) + return + toggleClass(false, 'schedule-in', instance.refs['schedule' + index][0]) + toggleClass(true, 'schedule-out', instance.refs['schedule' + index][0]) } else { - if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return; - toggleClass(false, "card-in", instance.refs["dynamic" + index][0]); - toggleClass(true, "card-out", instance.refs["dynamic" + index][0]); + if (hasClass(instance.refs['dynamic' + index][0], 'card-active')) return + toggleClass(false, 'card-in', instance.refs['dynamic' + index][0]) + toggleClass(true, 'card-out', instance.refs['dynamic' + index][0]) } } function onContentFullScreen() { pureSetting.hiddenSideBar - ? pureSetting.changeSetting({ key: "hiddenSideBar", value: false }) - : pureSetting.changeSetting({ key: "hiddenSideBar", value: true }); + ? pureSetting.changeSetting({ key: 'hiddenSideBar', value: false }) + : pureSetting.changeSetting({ key: 'hiddenSideBar', value: true }) } onMounted(() => { if (!showModel.value) { const configure = storageLocal().getItem( - "responsive-configure" - ); - configure.showModel = "card"; - storageLocal().setItem("responsive-configure", configure); + 'responsive-configure' + ) + configure.showModel = 'card' + storageLocal().setItem('responsive-configure', configure) } - }); + }) watch( () => visible.value, () => { - useEventListener(document, "click", closeMenu); + useEventListener(document, 'click', closeMenu) } - ); + ) return { route, @@ -242,5 +242,5 @@ export function useTags() { onMouseleave, transformI18n, onContentFullScreen - }; + } } diff --git a/src/layout/hooks/useTranslationLang.ts b/src/layout/hooks/useTranslationLang.ts index 9d8374f..d4cf5af 100644 --- a/src/layout/hooks/useTranslationLang.ts +++ b/src/layout/hooks/useTranslationLang.ts @@ -1,31 +1,31 @@ -import { useNav } from "./useNav"; -import { useI18n } from "vue-i18n"; -import { useRoute } from "vue-router"; -import { watch, type Ref } from "vue"; +import { useNav } from './useNav' +import { useI18n } from 'vue-i18n' +import { useRoute } from 'vue-router' +import { watch, type Ref } from 'vue' export function useTranslationLang(ref?: Ref) { - const { $storage, changeTitle, handleResize } = useNav(); - const { locale, t } = useI18n(); - const route = useRoute(); + const { $storage, changeTitle, handleResize } = useNav() + const { locale, t } = useI18n() + const route = useRoute() function translationCh() { - $storage.locale = { locale: "zh" }; - locale.value = "zh"; - ref && handleResize(ref.value); + $storage.locale = { locale: 'zh' } + locale.value = 'zh' + ref && handleResize(ref.value) } function translationEn() { - $storage.locale = { locale: "en" }; - locale.value = "en"; - ref && handleResize(ref.value); + $storage.locale = { locale: 'en' } + locale.value = 'en' + ref && handleResize(ref.value) } watch( () => locale.value, () => { - changeTitle(route.meta); + changeTitle(route.meta) } - ); + ) return { t, @@ -33,5 +33,5 @@ export function useTranslationLang(ref?: Ref) { locale, translationCh, translationEn - }; + } } diff --git a/src/layout/index.vue b/src/layout/index.vue index 9d1944b..5da9d42 100644 --- a/src/layout/index.vue +++ b/src/layout/index.vue @@ -1,40 +1,40 @@ @@ -181,7 +181,7 @@ const layoutHeader = defineComponent({ `; - return str; + str += `` + return str }, // form assignment getHtml: function (): Element { - const inputs = document.querySelectorAll("input"); - const selects = document.querySelectorAll("select"); - const textareas = document.querySelectorAll("textarea"); - const canvass = document.querySelectorAll("canvas"); + const inputs = document.querySelectorAll('input') + const selects = document.querySelectorAll('select') + const textareas = document.querySelectorAll('textarea') + const canvass = document.querySelectorAll('canvas') for (let k = 0; k < inputs.length; k++) { - if (inputs[k].type == "checkbox" || inputs[k].type == "radio") { + if (inputs[k].type == 'checkbox' || inputs[k].type == 'radio') { if (inputs[k].checked == true) { - inputs[k].setAttribute("checked", "checked"); + inputs[k].setAttribute('checked', 'checked') } else { - inputs[k].removeAttribute("checked"); + inputs[k].removeAttribute('checked') } - } else if (inputs[k].type == "text") { - inputs[k].setAttribute("value", inputs[k].value); + } else if (inputs[k].type == 'text') { + inputs[k].setAttribute('value', inputs[k].value) } else { - inputs[k].setAttribute("value", inputs[k].value); + inputs[k].setAttribute('value', inputs[k].value) } } for (let k2 = 0; k2 < textareas.length; k2++) { - if (textareas[k2].type == "textarea") { - textareas[k2].innerHTML = textareas[k2].value; + if (textareas[k2].type == 'textarea') { + textareas[k2].innerHTML = textareas[k2].value } } for (let k3 = 0; k3 < selects.length; k3++) { - if (selects[k3].type == "select-one") { - const child = selects[k3].children; + if (selects[k3].type == 'select-one') { + const child = selects[k3].children for (const i in child) { - if (child[i].tagName == "OPTION") { + if (child[i].tagName == 'OPTION') { if ((child[i] as any).selected == true) { - child[i].setAttribute("selected", "selected"); + child[i].setAttribute('selected', 'selected') } else { - child[i].removeAttribute("selected"); + child[i].removeAttribute('selected') } } } @@ -109,58 +109,58 @@ Print.prototype = { } for (let k4 = 0; k4 < canvass.length; k4++) { - const imageURL = canvass[k4].toDataURL("image/png"); - const img = document.createElement("img"); - img.src = imageURL; - img.setAttribute("style", "max-width: 100%;"); - img.className = "isNeedRemove"; - canvass[k4].parentNode.insertBefore(img, canvass[k4].nextElementSibling); + const imageURL = canvass[k4].toDataURL('image/png') + const img = document.createElement('img') + img.src = imageURL + img.setAttribute('style', 'max-width: 100%;') + img.className = 'isNeedRemove' + canvass[k4].parentNode.insertBefore(img, canvass[k4].nextElementSibling) } - return this.dom.outerHTML; + return this.dom.outerHTML }, /** create iframe */ writeIframe: function (content) { - let w: Document | Window; - let doc: Document; - const iframe: HTMLIFrameElement = document.createElement("iframe"); - const f: HTMLIFrameElement = document.body.appendChild(iframe); - iframe.id = "myIframe"; + let w: Document | Window + let doc: Document + const iframe: HTMLIFrameElement = document.createElement('iframe') + const f: HTMLIFrameElement = document.body.appendChild(iframe) + iframe.id = 'myIframe' iframe.setAttribute( - "style", - "position:absolute;width:0;height:0;top:-10px;left:-10px;" - ); + 'style', + 'position:absolute;width:0;height:0;top:-10px;left:-10px;' + ) // eslint-disable-next-line prefer-const - w = f.contentWindow || f.contentDocument; + w = f.contentWindow || f.contentDocument // eslint-disable-next-line prefer-const - doc = f.contentDocument || f.contentWindow.document; - doc.open(); - doc.write(content); - doc.close(); + doc = f.contentDocument || f.contentWindow.document + doc.open() + doc.write(content) + doc.close() - const removes = document.querySelectorAll(".isNeedRemove"); + const removes = document.querySelectorAll('.isNeedRemove') for (let k = 0; k < removes.length; k++) { - removes[k].parentNode.removeChild(removes[k]); + removes[k].parentNode.removeChild(removes[k]) } // eslint-disable-next-line @typescript-eslint/no-this-alias - const _this = this; + const _this = this iframe.onload = function (): void { // Before popping, callback if (_this.conf.printBeforeFn) { - _this.conf.printBeforeFn({ doc }); + _this.conf.printBeforeFn({ doc }) } - _this.toPrint(w); + _this.toPrint(w) setTimeout(function () { - document.body.removeChild(iframe); + document.body.removeChild(iframe) // After popup, callback if (_this.conf.printDoneCallBack) { - _this.conf.printDoneCallBack(); + _this.conf.printDoneCallBack() } - }, 100); - }; + }, 100) + } }, /** Print @@ -168,32 +168,32 @@ Print.prototype = { toPrint: function (frameWindow): void { try { setTimeout(function () { - frameWindow.focus(); + frameWindow.focus() try { - if (!frameWindow.document.execCommand("print", false, null)) { - frameWindow.print(); + if (!frameWindow.document.execCommand('print', false, null)) { + frameWindow.print() } } catch (e) { - frameWindow.print(); + frameWindow.print() } - frameWindow.close(); - }, 10); + frameWindow.close() + }, 10) } catch (err) { - console.error(err); + console.error(err) } }, isDOM: - typeof HTMLElement === "object" + typeof HTMLElement === 'object' ? function (obj) { - return obj instanceof HTMLElement; + return obj instanceof HTMLElement } : function (obj) { return ( obj && - typeof obj === "object" && + typeof obj === 'object' && obj.nodeType === 1 && - typeof obj.nodeName === "string" - ); + typeof obj.nodeName === 'string' + ) }, /** * Set the height of the specified dom element by getting the existing height of the dom element and setting @@ -202,13 +202,13 @@ Print.prototype = { setDomHeight(arr) { if (arr && arr.length) { arr.forEach(name => { - const domArr = document.querySelectorAll(name); + const domArr = document.querySelectorAll(name) domArr.forEach(dom => { - dom.style.height = dom.offsetHeight + "px"; - }); - }); + dom.style.height = dom.offsetHeight + 'px' + }) + }) } } -}; +} -export default Print; +export default Print diff --git a/src/utils/progress/index.ts b/src/utils/progress/index.ts index d309862..28c9515 100644 --- a/src/utils/progress/index.ts +++ b/src/utils/progress/index.ts @@ -1,9 +1,9 @@ -import NProgress from "nprogress"; -import "nprogress/nprogress.css"; +import NProgress from 'nprogress' +import 'nprogress/nprogress.css' NProgress.configure({ // 动画方式 - easing: "ease", + easing: 'ease', // 递增进度条的速度 speed: 500, // 是否显示加载ico @@ -12,6 +12,6 @@ NProgress.configure({ trickleSpeed: 200, // 初始化时的最小百分比 minimum: 0.3 -}); +}) -export default NProgress; +export default NProgress diff --git a/src/utils/propTypes.ts b/src/utils/propTypes.ts index cc7b16f..84a1656 100644 --- a/src/utils/propTypes.ts +++ b/src/utils/propTypes.ts @@ -1,17 +1,17 @@ -import type { CSSProperties, VNodeChild } from "vue"; +import type { CSSProperties, VNodeChild } from 'vue' import { createTypes, toValidableType, VueTypesInterface, VueTypeValidableDef -} from "vue-types"; +} from 'vue-types' -export type VueNode = VNodeChild | JSX.Element; +export type VueNode = VNodeChild | JSX.Element type PropTypes = VueTypesInterface & { - readonly style: VueTypeValidableDef; - readonly VNodeChild: VueTypeValidableDef; -}; + readonly style: VueTypeValidableDef + readonly VNodeChild: VueTypeValidableDef +} const newPropTypes = createTypes({ func: undefined, @@ -20,20 +20,20 @@ const newPropTypes = createTypes({ number: undefined, object: undefined, integer: undefined -}) as PropTypes; +}) as PropTypes // 从 vue-types v5.0 开始,extend()方法已经废弃,当前已改为官方推荐的ES6+方法 https://dwightjack.github.io/vue-types/advanced/extending-vue-types.html#the-extend-method export default class propTypes extends newPropTypes { // a native-like validator that supports the `.validable` method static get style() { - return toValidableType("style", { + return toValidableType('style', { type: [String, Object] - }); + }) } static get VNodeChild() { - return toValidableType("VNodeChild", { + return toValidableType('VNodeChild', { type: undefined - }); + }) } } diff --git a/src/utils/responsive.ts b/src/utils/responsive.ts index 579f743..94d7d25 100644 --- a/src/utils/responsive.ts +++ b/src/utils/responsive.ts @@ -1,41 +1,41 @@ // 响应式storage -import { App } from "vue"; -import Storage from "responsive-storage"; -import { routerArrays } from "@/layout/types"; +import { App } from 'vue' +import Storage from 'responsive-storage' +import { routerArrays } from '@/layout/types' -const nameSpace = "responsive-"; +const nameSpace = 'responsive-' export const injectResponsiveStorage = (app: App, config: ServerConfigs) => { const configObj = Object.assign( { // 国际化 默认中文zh - locale: Storage.getData("locale", nameSpace) ?? { - locale: config.Locale ?? "zh" + locale: Storage.getData('locale', nameSpace) ?? { + locale: config.Locale ?? 'zh' }, // layout模式以及主题 - layout: Storage.getData("layout", nameSpace) ?? { - layout: config.Layout ?? "vertical", - theme: config.Theme ?? "default", + layout: Storage.getData('layout', nameSpace) ?? { + layout: config.Layout ?? 'vertical', + theme: config.Theme ?? 'default', darkMode: config.DarkMode ?? false, sidebarStatus: config.SidebarStatus ?? true, - epThemeColor: config.EpThemeColor ?? "#409EFF" + epThemeColor: config.EpThemeColor ?? '#409EFF' }, - configure: Storage.getData("configure", nameSpace) ?? { + configure: Storage.getData('configure', nameSpace) ?? { grey: config.Grey ?? false, weak: config.Weak ?? false, hideTabs: config.HideTabs ?? false, showLogo: config.ShowLogo ?? true, - showModel: config.ShowModel ?? "smart", + showModel: config.ShowModel ?? 'smart', multiTagsCache: config.MultiTagsCache ?? false } }, config.MultiTagsCache ? { // 默认显示首页tag - tags: Storage.getData("tags", nameSpace) ?? routerArrays + tags: Storage.getData('tags', nameSpace) ?? routerArrays } : {} - ); + ) - app.use(Storage, { nameSpace, memory: configObj }); -}; + app.use(Storage, { nameSpace, memory: configObj }) +} diff --git a/src/utils/sso.ts b/src/utils/sso.ts index 69b0509..86a36cc 100644 --- a/src/utils/sso.ts +++ b/src/utils/sso.ts @@ -1,5 +1,5 @@ -import { removeToken, setToken, type DataInfo } from "./auth"; -import { subBefore, getQueryMap } from "@pureadmin/utils"; +import { removeToken, setToken, type DataInfo } from './auth' +import { subBefore, getQueryMap } from '@pureadmin/utils' /** * 简版前端单点登录,根据实际业务自行编写 @@ -10,50 +10,50 @@ import { subBefore, getQueryMap } from "@pureadmin/utils"; * 3.删除不需要显示在 url 的参数 * 4.使用 window.location.replace 跳转正确页面 */ -(function () { +;(function () { // 获取 url 中的参数 - const params = getQueryMap(location.href) as DataInfo; - const must = ["username", "roles", "accessToken"]; - const mustLength = must.length; - if (Object.keys(params).length !== mustLength) return; + const params = getQueryMap(location.href) as DataInfo + const must = ['username', 'roles', 'accessToken'] + const mustLength = must.length + if (Object.keys(params).length !== mustLength) return // url 参数满足 must 里的全部值,才判定为单点登录,避免非单点登录时刷新页面无限循环 - let sso = []; - let start = 0; + let sso = [] + let start = 0 while (start < mustLength) { if (Object.keys(params).includes(must[start]) && sso.length <= mustLength) { - sso.push(must[start]); + sso.push(must[start]) } else { - sso = []; + sso = [] } - start++; + start++ } if (sso.length === mustLength) { // 判定为单点登录 // 清空本地旧信息 - removeToken(); + removeToken() // 保存新信息到本地 - setToken(params); + setToken(params) // 删除不需要显示在 url 的参数 - delete params["roles"]; - delete params["accessToken"]; + delete params['roles'] + delete params['accessToken'] const newUrl = `${location.origin}${location.pathname}${subBefore( location.hash, - "?" + '?' )}?${JSON.stringify(params) - .replace(/["{}]/g, "") - .replace(/:/g, "=") - .replace(/,/g, "&")}`; + .replace(/["{}]/g, '') + .replace(/:/g, '=') + .replace(/,/g, '&')}` // 替换历史记录项 - window.location.replace(newUrl); + window.location.replace(newUrl) } else { - return; + return } -})(); +})() diff --git a/src/utils/tree.ts b/src/utils/tree.ts index f8f3783..8d967c0 100644 --- a/src/utils/tree.ts +++ b/src/utils/tree.ts @@ -5,20 +5,20 @@ */ export const extractPathList = (tree: any[]): any => { if (!Array.isArray(tree)) { - console.warn("tree must be an array"); - return []; + console.warn('tree must be an array') + return [] } - if (!tree || tree.length === 0) return []; - const expandedPaths: Array = []; + if (!tree || tree.length === 0) return [] + const expandedPaths: Array = [] for (const node of tree) { - const hasChildren = node.children && node.children.length > 0; + const hasChildren = node.children && node.children.length > 0 if (hasChildren) { - extractPathList(node.children); + extractPathList(node.children) } - expandedPaths.push(node.uniqueId); + expandedPaths.push(node.uniqueId) } - return expandedPaths; -}; + return expandedPaths +} /** * @description 如果父级下children的length为1,删除children并自动组建唯一uniqueId @@ -28,24 +28,24 @@ export const extractPathList = (tree: any[]): any => { */ export const deleteChildren = (tree: any[], pathList = []): any => { if (!Array.isArray(tree)) { - console.warn("menuTree must be an array"); - return []; + console.warn('menuTree must be an array') + return [] } - if (!tree || tree.length === 0) return []; + if (!tree || tree.length === 0) return [] for (const [key, node] of tree.entries()) { - if (node.children && node.children.length === 1) delete node.children; - node.id = key; - node.parentId = pathList.length ? pathList[pathList.length - 1] : null; - node.pathList = [...pathList, node.id]; + if (node.children && node.children.length === 1) delete node.children + node.id = key + node.parentId = pathList.length ? pathList[pathList.length - 1] : null + node.pathList = [...pathList, node.id] node.uniqueId = - node.pathList.length > 1 ? node.pathList.join("-") : node.pathList[0]; - const hasChildren = node.children && node.children.length > 0; + node.pathList.length > 1 ? node.pathList.join('-') : node.pathList[0] + const hasChildren = node.children && node.children.length > 0 if (hasChildren) { - deleteChildren(node.children, node.pathList); + deleteChildren(node.children, node.pathList) } } - return tree; -}; + return tree +} /** * @description 创建层级关系 @@ -55,21 +55,21 @@ export const deleteChildren = (tree: any[], pathList = []): any => { */ export const buildHierarchyTree = (tree: any[], pathList = []): any => { if (!Array.isArray(tree)) { - console.warn("tree must be an array"); - return []; + console.warn('tree must be an array') + return [] } - if (!tree || tree.length === 0) return []; + if (!tree || tree.length === 0) return [] for (const [key, node] of tree.entries()) { - node.id = key; - node.parentId = pathList.length ? pathList[pathList.length - 1] : null; - node.pathList = [...pathList, node.id]; - const hasChildren = node.children && node.children.length > 0; + node.id = key + node.parentId = pathList.length ? pathList[pathList.length - 1] : null + node.pathList = [...pathList, node.id] + const hasChildren = node.children && node.children.length > 0 if (hasChildren) { - buildHierarchyTree(node.children, node.pathList); + buildHierarchyTree(node.children, node.pathList) } } - return tree; -}; + return tree +} /** * @description 广度优先遍历,根据唯一uniqueId找当前节点信息 @@ -82,18 +82,18 @@ export const getNodeByUniqueId = ( uniqueId: number | string ): any => { if (!Array.isArray(tree)) { - console.warn("menuTree must be an array"); - return []; + console.warn('menuTree must be an array') + return [] } - if (!tree || tree.length === 0) return []; - const item = tree.find(node => node.uniqueId === uniqueId); - if (item) return item; + if (!tree || tree.length === 0) return [] + const item = tree.find(node => node.uniqueId === uniqueId) + if (item) return item const childrenList = tree .filter(node => node.children) .map(i => i.children) - .flat(1) as unknown; - return getNodeByUniqueId(childrenList as any[], uniqueId); -}; + .flat(1) as unknown + return getNodeByUniqueId(childrenList as any[], uniqueId) +} /** * @description 向当前唯一uniqueId节点中追加字段 @@ -108,23 +108,23 @@ export const appendFieldByUniqueId = ( fields: object ): any => { if (!Array.isArray(tree)) { - console.warn("menuTree must be an array"); - return []; + console.warn('menuTree must be an array') + return [] } - if (!tree || tree.length === 0) return []; + if (!tree || tree.length === 0) return [] for (const node of tree) { - const hasChildren = node.children && node.children.length > 0; + const hasChildren = node.children && node.children.length > 0 if ( node.uniqueId === uniqueId && - Object.prototype.toString.call(fields) === "[object Object]" + Object.prototype.toString.call(fields) === '[object Object]' ) - Object.assign(node, fields); + Object.assign(node, fields) if (hasChildren) { - appendFieldByUniqueId(node.children, uniqueId, fields); + appendFieldByUniqueId(node.children, uniqueId, fields) } } - return tree; -}; + return tree +} /** * @description 构造树型结构数据 @@ -141,48 +141,48 @@ export const handleTree = ( children?: string ): any => { if (!Array.isArray(data)) { - console.warn("data must be an array"); - return []; + console.warn('data must be an array') + return [] } const config = { - id: id || "id", - parentId: parentId || "parentId", - childrenList: children || "children" - }; + id: id || 'id', + parentId: parentId || 'parentId', + childrenList: children || 'children' + } - const childrenListMap: any = {}; - const nodeIds: any = {}; - const tree = []; + const childrenListMap: any = {} + const nodeIds: any = {} + const tree = [] for (const d of data) { - const parentId = d[config.parentId]; + const parentId = d[config.parentId] if (childrenListMap[parentId] == null) { - childrenListMap[parentId] = []; + childrenListMap[parentId] = [] } - nodeIds[d[config.id]] = d; - childrenListMap[parentId].push(d); + nodeIds[d[config.id]] = d + childrenListMap[parentId].push(d) } for (const d of data) { - const parentId = d[config.parentId]; + const parentId = d[config.parentId] if (nodeIds[parentId] == null) { - tree.push(d); + tree.push(d) } } for (const t of tree) { - adaptToChildrenList(t); + adaptToChildrenList(t) } function adaptToChildrenList(o: Record) { if (childrenListMap[o[config.id]] !== null) { - o[config.childrenList] = childrenListMap[o[config.id]]; + o[config.childrenList] = childrenListMap[o[config.id]] } if (o[config.childrenList]) { for (const c of o[config.childrenList]) { - adaptToChildrenList(c); + adaptToChildrenList(c) } } } - return tree; -}; + return tree +} diff --git a/src/views/basicData/GameData.vue b/src/views/basicData/GameData.vue new file mode 100644 index 0000000..badfa82 --- /dev/null +++ b/src/views/basicData/GameData.vue @@ -0,0 +1,10 @@ + + + + 牌局数据 + diff --git a/src/views/basicData/LiveData.vue b/src/views/basicData/LiveData.vue new file mode 100644 index 0000000..31641f9 --- /dev/null +++ b/src/views/basicData/LiveData.vue @@ -0,0 +1,14 @@ + + + + + 实时数据 + + + diff --git a/src/views/basicData/queryClub/index.vue b/src/views/basicData/queryClub/index.vue new file mode 100644 index 0000000..ee9e277 --- /dev/null +++ b/src/views/basicData/queryClub/index.vue @@ -0,0 +1,10 @@ + + + + 俱乐部数据 + diff --git a/src/views/basicData/queryClub/queryClub.vue b/src/views/basicData/queryClub/queryClub.vue new file mode 100644 index 0000000..4ed2f36 --- /dev/null +++ b/src/views/basicData/queryClub/queryClub.vue @@ -0,0 +1,10 @@ + + + + 搜索俱乐部 + diff --git a/src/views/basicData/queryUser/index.vue b/src/views/basicData/queryUser/index.vue new file mode 100644 index 0000000..f7ee89e --- /dev/null +++ b/src/views/basicData/queryUser/index.vue @@ -0,0 +1,10 @@ + + + + 用户数据 + diff --git a/src/views/basicData/queryUser/queryUser.vue b/src/views/basicData/queryUser/queryUser.vue new file mode 100644 index 0000000..387c67c --- /dev/null +++ b/src/views/basicData/queryUser/queryUser.vue @@ -0,0 +1,10 @@ + + + + 查询用户 + diff --git a/src/views/error/403.vue b/src/views/error/403.vue index 2a763ac..958c4ba 100644 --- a/src/views/error/403.vue +++ b/src/views/error/403.vue @@ -1,9 +1,9 @@ diff --git a/src/views/error/404.vue b/src/views/error/404.vue index 1c20ed7..88c00fa 100644 --- a/src/views/error/404.vue +++ b/src/views/error/404.vue @@ -1,9 +1,9 @@ diff --git a/src/views/error/500.vue b/src/views/error/500.vue index f21944e..c7f21b4 100644 --- a/src/views/error/500.vue +++ b/src/views/error/500.vue @@ -1,9 +1,9 @@ diff --git a/src/views/error/fight.vue b/src/views/error/fight.vue new file mode 100644 index 0000000..f90a2ac --- /dev/null +++ b/src/views/error/fight.vue @@ -0,0 +1,67 @@ + + + + + + + + Sorry + + + {{ this.$t('others.comingSoon') }} + + + {{ this.$t('others.backHome') }} + + + + diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 8169f4b..b3cd4e7 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -1,86 +1,86 @@ @@ -185,7 +185,7 @@ onBeforeUnmount(() => { :loading="loading" @click="onLogin(ruleFormRef)" > - {{ t("login.login") }} + {{ t('login.login') }} @@ -196,7 +196,7 @@ onBeforeUnmount(() => {
+ Sorry +
+ {{ this.$t('others.comingSoon') }} +