From fefcc5eec69bf00539e647753e0c739f9d964b36 Mon Sep 17 00:00:00 2001 From: vben Date: Thu, 18 Feb 2021 06:31:16 +0800 Subject: [PATCH 01/11] chore: update deps --- package.json | 4 ++-- yarn.lock | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 701f2fc0a72..8a35f8a3a9c 100644 --- a/package.json +++ b/package.json @@ -98,7 +98,7 @@ "stylelint-order": "^4.1.0", "ts-node": "^9.1.1", "typescript": "^4.1.5", - "vite": "2.0.0", + "vite": "2.0.1", "vite-plugin-compression": "^0.2.1", "vite-plugin-html": "^2.0.0", "vite-plugin-imagemin": "^0.2.6", @@ -107,7 +107,7 @@ "vite-plugin-pwa": "^0.4.7", "vite-plugin-style-import": "^0.7.2", "vite-plugin-theme": "^0.4.3", - "vite-plugin-windicss": "^0.2.2", + "vite-plugin-windicss": "0.2.2", "vue-eslint-parser": "^7.5.0", "yargs": "^16.2.0" }, diff --git a/yarn.lock b/yarn.lock index 744864e741e..321ddbb8cbb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9370,7 +9370,7 @@ vite-plugin-theme@^0.4.3: es-module-lexer "^0.3.26" tinycolor2 "^1.4.2" -vite-plugin-windicss@^0.2.2: +vite-plugin-windicss@0.2.2: version "0.2.2" resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.2.2.tgz#2abf1533153f5dc214a9e1a06fb58274e5892c19" integrity sha512-P+iyrcuLjLfjiYP+bBisfKbg9bmeQMUBpjsTFJ9kWWX2fyqo968CHmS3euz+MzRcK5ZECccpOxx60ZXzc12VAw== @@ -9378,10 +9378,10 @@ vite-plugin-windicss@^0.2.2: fast-glob "^3.2.5" windicss "^2.1.11" -vite@2.0.0: - version "2.0.0" - resolved "https://registry.npmjs.org/vite/-/vite-2.0.0.tgz#156f35eadaa7947629aa8a24eb23129b07116ee3" - integrity sha512-rNli5g0DaQ6+btlRqkmaR06neWaJGApmt40gocqrYDNi2XoEXYQgKiHSWzMeUgc1Cdva2HduqazaE+RaKjBpdQ== +vite@2.0.1: + version "2.0.1" + resolved "https://registry.npmjs.org/vite/-/vite-2.0.1.tgz#348fc5c0de510aa90bd01ecf87df210ce741b38e" + integrity sha512-x7ZfikjNs+6n4cdvwb9L5r5xBCdjmtmHFHaI4JVR3nAkJbMCK/dynfDWky8/NseZ9Ncz1jVxTQ/Bcf+n1ps1Ww== dependencies: esbuild "^0.8.34" postcss "^8.2.1" From 7d9b521c693b59da5fa28130b5753afa0914e598 Mon Sep 17 00:00:00 2001 From: Leon Date: Thu, 18 Feb 2021 21:00:28 +0800 Subject: [PATCH 02/11] fix(dashboard): fix workbench page style (#280) --- src/views/dashboard/workbench/components/ShortCuts.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/views/dashboard/workbench/components/ShortCuts.vue b/src/views/dashboard/workbench/components/ShortCuts.vue index aaed82b682d..eef7d81f5fe 100644 --- a/src/views/dashboard/workbench/components/ShortCuts.vue +++ b/src/views/dashboard/workbench/components/ShortCuts.vue @@ -7,7 +7,6 @@ @@ -84,6 +83,8 @@ &-img { width: 36px; + margin-left: auto; + margin-right: auto; } &-all { From da04913ef324fff122732b445c1b1d1d662b87a3 Mon Sep 17 00:00:00 2001 From: vben Date: Thu, 18 Feb 2021 21:02:56 +0800 Subject: [PATCH 03/11] feat: added settingButtonPosition configuration close #275 --- CHANGELOG.zh_CN.md | 6 ++ build/vite/plugin/compress.ts | 1 + build/vite/plugin/imagemin.ts | 1 + build/vite/plugin/index.ts | 6 +- build/vite/plugin/windicss.ts | 12 ++++ package.json | 2 +- src/enums/appEnum.ts | 6 ++ src/hooks/event/useKeyPress.ts | 10 +-- src/hooks/setting/useRootSetting.ts | 3 + src/hooks/web/useFullScreen.ts | 7 +- src/layouts/default/feature/index.vue | 68 +++++++++++++++++-- .../header/components/user-dropdown/index.vue | 6 +- src/layouts/default/header/index.vue | 23 ++++++- src/layouts/default/setting/index.vue | 5 +- src/locales/lang/en/sys/app.ts | 4 +- src/locales/lang/zh_CN/sys/app.ts | 4 +- src/settings/projectSetting.ts | 11 ++- src/store/modules/permission.ts | 8 +-- src/store/modules/user.ts | 10 +-- src/types/config.d.ts | 9 ++- src/utils/helper/treeHelper.ts | 8 +-- src/utils/http/axios/checkStatus.ts | 2 +- src/utils/index.ts | 12 +--- src/views/sys/lock/LockPage.vue | 3 +- yarn.lock | 9 +-- 25 files changed, 168 insertions(+), 68 deletions(-) create mode 100644 build/vite/plugin/windicss.ts diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md index 77587746c0b..4537a9ae359 100644 --- a/CHANGELOG.zh_CN.md +++ b/CHANGELOG.zh_CN.md @@ -1,3 +1,9 @@ +## Wip + +### ✨ Features + +- 新增 `settingButtonPosition`配置项,用于配置`设置`按钮位置 + ## 2.0.0 (2021-02-18) ## (破坏性更新) Breaking changes diff --git a/build/vite/plugin/compress.ts b/build/vite/plugin/compress.ts index 3ad6c63f2f4..be17fa0d957 100644 --- a/build/vite/plugin/compress.ts +++ b/build/vite/plugin/compress.ts @@ -1,5 +1,6 @@ /** * Used to package and output gzip. Note that this does not work properly in Vite, the specific reason is still being investigated + * https://github.com/anncwb/vite-plugin-compression */ import type { Plugin } from 'vite'; diff --git a/build/vite/plugin/imagemin.ts b/build/vite/plugin/imagemin.ts index 1aa083cb749..a3a0144d834 100644 --- a/build/vite/plugin/imagemin.ts +++ b/build/vite/plugin/imagemin.ts @@ -1,4 +1,5 @@ // Image resource files used to compress the output of the production environment +// https://github.com/anncwb/vite-plugin-imagemin import viteImagemin from 'vite-plugin-imagemin'; diff --git a/build/vite/plugin/index.ts b/build/vite/plugin/index.ts index 9c1bd96d760..f1e5a1460a0 100644 --- a/build/vite/plugin/index.ts +++ b/build/vite/plugin/index.ts @@ -4,7 +4,6 @@ import vue from '@vitejs/plugin-vue'; import vueJsx from '@vitejs/plugin-vue-jsx'; import legacy from '@vitejs/plugin-legacy'; -import windiCSS from 'vite-plugin-windicss'; import PurgeIcons from 'vite-plugin-purge-icons'; import { ViteEnv } from '../../utils'; @@ -16,6 +15,7 @@ import { configStyleImportPlugin } from './styleImport'; import { configVisualizerConfig } from './visualizer'; import { configThemePlugin } from './theme'; import { configImageminPlugin } from './imagemin'; +import { configWindiCssPlugin } from './windicss'; export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) { const { VITE_USE_IMAGEMIN, VITE_USE_MOCK, VITE_LEGACY, VITE_BUILD_COMPRESS } = viteEnv; @@ -25,7 +25,6 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) { vue(), // have to vueJsx(), - ...windiCSS(), ]; // @vitejs/plugin-legacy @@ -34,6 +33,9 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) { // vite-plugin-html vitePlugins.push(configHtmlPlugin(viteEnv, isBuild)); + // vite-plugin-windicss + vitePlugins.push(configWindiCssPlugin()); + // vite-plugin-mock VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild)); diff --git a/build/vite/plugin/windicss.ts b/build/vite/plugin/windicss.ts new file mode 100644 index 00000000000..b8c99ed64d0 --- /dev/null +++ b/build/vite/plugin/windicss.ts @@ -0,0 +1,12 @@ +import windiCSS from 'vite-plugin-windicss'; + +import type { Plugin } from 'vite'; + +export function configWindiCssPlugin(): Plugin[] { + return windiCSS({ + safelist: 'shadow shadow-xl', + preflight: { + enableAll: true, + }, + }); +} diff --git a/package.json b/package.json index 8a35f8a3a9c..d143db57a89 100644 --- a/package.json +++ b/package.json @@ -107,7 +107,7 @@ "vite-plugin-pwa": "^0.4.7", "vite-plugin-style-import": "^0.7.2", "vite-plugin-theme": "^0.4.3", - "vite-plugin-windicss": "0.2.2", + "vite-plugin-windicss": "0.3.3", "vue-eslint-parser": "^7.5.0", "yargs": "^16.2.0" }, diff --git a/src/enums/appEnum.ts b/src/enums/appEnum.ts index 4ff0ed83aec..afdeb0dd527 100644 --- a/src/enums/appEnum.ts +++ b/src/enums/appEnum.ts @@ -22,6 +22,12 @@ export enum ThemeEnum { LIGHT = 'light', } +export enum SettingButtonPositionEnum { + AUTO = 'auto', + HEADER = 'header', + FIXED = 'fixed', +} + /** * 权限模式 */ diff --git a/src/hooks/event/useKeyPress.ts b/src/hooks/event/useKeyPress.ts index 2cabbbeb62e..d86a14971cf 100644 --- a/src/hooks/event/useKeyPress.ts +++ b/src/hooks/event/useKeyPress.ts @@ -160,13 +160,5 @@ export function getTargetElement( if (!target) { return defaultElement; } - - let targetElement: TargetElement | undefined | null; - - if (isFunction(target)) { - targetElement = target(); - } else { - targetElement = unref(target); - } - return targetElement; + return isFunction(target) ? target() : unref(target); } diff --git a/src/hooks/setting/useRootSetting.ts b/src/hooks/setting/useRootSetting.ts index abd2ca2e3dd..cb126f6ba2c 100644 --- a/src/hooks/setting/useRootSetting.ts +++ b/src/hooks/setting/useRootSetting.ts @@ -16,6 +16,8 @@ const getPageLoading = computed(() => appStore.getPageLoading); const getOpenKeepAlive = computed(() => unref(getRootSetting).openKeepAlive); +const getSettingButtonPosition = computed(() => unref(getRootSetting).settingButtonPosition); + const getCanEmbedIFramePage = computed(() => unref(getRootSetting).canEmbedIFramePage); const getPermissionMode = computed(() => unref(getRootSetting).permissionMode); @@ -58,6 +60,7 @@ export function useRootSetting() { return { setRootSetting, + getSettingButtonPosition, getFullContent, getColorWeak, getGrayMode, diff --git a/src/hooks/web/useFullScreen.ts b/src/hooks/web/useFullScreen.ts index e52cbd11964..0e5bef5ea99 100644 --- a/src/hooks/web/useFullScreen.ts +++ b/src/hooks/web/useFullScreen.ts @@ -57,12 +57,7 @@ export function useFullscreen( async function toggleFullscreen(): Promise { if (!unref(target)) return; - - if (isFullscreen()) { - return exitFullscreen(); - } else { - return enterFullscreen(); - } + return isFullscreen() ? exitFullscreen() : enterFullscreen(); } return { diff --git a/src/layouts/default/feature/index.vue b/src/layouts/default/feature/index.vue index 16b53b19249..562e6fc8de2 100644 --- a/src/layouts/default/feature/index.vue +++ b/src/layouts/default/feature/index.vue @@ -1,26 +1,80 @@ - + + + + diff --git a/src/layouts/default/header/components/user-dropdown/index.vue b/src/layouts/default/header/components/user-dropdown/index.vue index 72ebbf0f93f..d00d1eccf58 100644 --- a/src/layouts/default/header/components/user-dropdown/index.vue +++ b/src/layouts/default/header/components/user-dropdown/index.vue @@ -22,7 +22,7 @@ icon="ion:lock-closed-outline" /> @@ -51,7 +51,7 @@ import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'; - type MenuEvent = 'loginOut' | 'doc' | 'lock'; + type MenuEvent = 'logout' | 'doc' | 'lock'; export default defineComponent({ name: 'UserDropdown', @@ -93,7 +93,7 @@ function handleMenuClick(e: { key: MenuEvent }) { switch (e.key) { - case 'loginOut': + case 'logout': handleLoginOut(); break; case 'doc': diff --git a/src/layouts/default/header/index.vue b/src/layouts/default/header/index.vue index c84bf1e7875..dc615cbe338 100644 --- a/src/layouts/default/header/index.vue +++ b/src/layouts/default/header/index.vue @@ -50,7 +50,7 @@ - + @@ -72,6 +72,7 @@ import { useLocaleSetting } from '/@/hooks/setting/useLocaleSetting'; import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum'; + import { SettingButtonPositionEnum } from '/@/enums/appEnum'; import { AppLocalePicker } from '/@/components/Application'; import { UserDropDown, LayoutBreadcrumb, FullScreen, Notify, ErrorAction } from './components'; @@ -112,7 +113,11 @@ getIsMixSidebar, } = useMenuSetting(); const { getShowLocale } = useLocaleSetting(); - const { getUseErrorHandle, getShowSettingButton } = useRootSetting(); + const { + getUseErrorHandle, + getShowSettingButton, + getSettingButtonPosition, + } = useRootSetting(); const { getHeaderTheme, @@ -122,6 +127,7 @@ getShowContent, getShowBread, getShowHeaderLogo, + getShowHeader, } = useHeaderSetting(); const { getIsMobile } = useAppInject(); @@ -138,6 +144,18 @@ ]; }); + const getShowSetting = computed(() => { + if (!unref(getShowSettingButton)) { + return false; + } + const settingButtonPosition = unref(getSettingButtonPosition); + + if (settingButtonPosition === SettingButtonPositionEnum.AUTO) { + return unref(getShowHeader); + } + return settingButtonPosition === SettingButtonPositionEnum.HEADER; + }); + const getLogoWidth = computed(() => { if (!unref(getIsMixMode) || unref(getIsMobile)) { return {}; @@ -175,6 +193,7 @@ getLogoWidth, getIsMixSidebar, getShowSettingButton, + getShowSetting, }; }, }); diff --git a/src/layouts/default/setting/index.vue b/src/layouts/default/setting/index.vue index 68dd3acfd30..fe0402d2850 100644 --- a/src/layouts/default/setting/index.vue +++ b/src/layouts/default/setting/index.vue @@ -1,5 +1,5 @@ diff --git a/src/components/CountDown/src/CountdownInput.vue b/src/components/CountDown/src/CountdownInput.vue new file mode 100644 index 00000000000..1a0f11675f7 --- /dev/null +++ b/src/components/CountDown/src/CountdownInput.vue @@ -0,0 +1,55 @@ + + + diff --git a/src/components/CountDown/src/useCountdown.ts b/src/components/CountDown/src/useCountdown.ts new file mode 100644 index 00000000000..f6ed67dc11c --- /dev/null +++ b/src/components/CountDown/src/useCountdown.ts @@ -0,0 +1,51 @@ +import { ref, unref } from 'vue'; +import { tryOnUnmounted } from '/@/utils/helper/vueHelper'; + +export function useCountdown(count: number) { + const currentCount = ref(count); + + const isStart = ref(false); + + let timerId: ReturnType | null; + + function clear() { + timerId && window.clearInterval(timerId); + } + + function stop() { + isStart.value = false; + timerId = null; + clear(); + } + + function start() { + if (unref(isStart) || !!timerId) { + return; + } + isStart.value = true; + timerId = setInterval(() => { + if (unref(currentCount) === 1) { + stop(); + currentCount.value = count; + } else { + currentCount.value -= 1; + } + }, 1000); + } + + function reset() { + currentCount.value = count; + stop(); + } + + function restart() { + reset(); + start(); + } + + tryOnUnmounted(() => { + reset(); + }); + + return { start, reset, restart, clear, stop, currentCount, isStart }; +} diff --git a/src/components/StrengthMeter/src/index.vue b/src/components/StrengthMeter/src/index.vue index 8265b2b17c2..1f98e37261e 100644 --- a/src/components/StrengthMeter/src/index.vue +++ b/src/components/StrengthMeter/src/index.vue @@ -1,5 +1,5 @@