diff --git a/.gitignore b/.gitignore index f4df7b70..caa21a49 100644 --- a/.gitignore +++ b/.gitignore @@ -15,6 +15,7 @@ dist/ *.local visualizer.* .eslintcache +.history # Editor directories and files .idea diff --git a/CHANGELOG.md b/CHANGELOG.md index 73104994..b58e80b8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,15 @@ # CHANGE LOG +## 4.8.6 + +## Fixes + +- 修复动态路由的情况下，始终会被跳转到 `404` 页面的问题 +- 修复 `RIcon` 组件 `color` 配置项无效的问题 +- 修复 `svg-icon` 页面可能会在更新 `icon` 后出现报错的问题 +- 修复 `updateDocumentTitle` 方法可能会更新标题出错的问题 +- 修复菜单的折叠问题 + ## 4.8.5 ## Feats diff --git a/package.json b/package.json index 6108107d..8d0b56aa 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ray-template", "private": false, - "version": "4.8.5", + "version": "4.8.6", "type": "module", "engines": { "node": "^18.0.0 || >=20.0.0", @@ -25,7 +25,7 @@ } }, "lint-staged": { - "/src/**/*.{ts,tsx,vue}": [ + "./src/**/*.{ts,tsx,vue}": [ "vue-tsc --noEmit" ], "*.{ts,tsx,json}": [ diff --git a/src/components/RIcon/src/index.scss b/src/components/RIcon/src/index.scss index 69b046fe..c05db01d 100644 --- a/src/components/RIcon/src/index.scss +++ b/src/components/RIcon/src/index.scss @@ -8,12 +8,12 @@ display: inline-flex; justify-content: center; align-items: center; - fill: currentColor; + color: var(--ray-icon-color); transform: translateZ(0); opacity: var(--ray-icon-depth); cursor: var(--ray-icon-cursor); - & svg[RayIconAttribute="ray-icon"] { + & svg[RayIconAttribute='ray-icon'] { width: var(--ray-icon-width); height: var(--ray-icon-height); fill: currentColor; diff --git a/src/components/RIcon/src/index.tsx b/src/components/RIcon/src/index.tsx index 549a08a0..06fcaf4f 100644 --- a/src/components/RIcon/src/index.tsx +++ b/src/components/RIcon/src/index.tsx @@ -29,6 +29,7 @@ export default defineComponent({ : completeSize(props.size), '--ray-icon-depth': props.depth, '--ray-icon-cursor': props.cursor, + '--ray-icon-color': props.color, } return cssVar diff --git a/src/layout/components/Menu/index.tsx b/src/layout/components/Menu/index.tsx index 84308965..fc952f52 100644 --- a/src/layout/components/Menu/index.tsx +++ b/src/layout/components/Menu/index.tsx @@ -28,7 +28,8 @@ export default defineComponent({ setup() { const menuRef = ref(null) - const { changeMenuModelValue, collapsedMenu } = useMenuActions() + const { changeMenuModelValue, collapsedMenu, updateMenuState } = + useMenuActions() const { getMenuOptions, getCollapsed, getMenuKey } = useMenuGetters() const modelMenuKey = computed({ @@ -84,6 +85,13 @@ export default defineComponent({ onUpdateCollapsed={collapsedMenu.bind(this)} nativeScrollbar={false} ref={LAYOUT_SIDER_REF} + collapsed={getCollapsed.value} + onExpand={() => { + updateMenuState('collapsed', false) + }} + onCollapse={() => { + updateMenuState('collapsed', true) + }} > orderRoutes(combineRawRouteModules()) diff --git a/src/router/modules/error-404.ts b/src/router/modules/error-404.ts deleted file mode 100644 index aae71a62..00000000 --- a/src/router/modules/error-404.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { t } from '@/hooks/web/useI18n' -import { LAYOUT } from '@/router/constant' - -import type { AppRouteRecordRaw } from '@/router/types' - -const error404: AppRouteRecordRaw = { - path: '/:catchAll(.*)', - component: () => import('@/views/error/views/Error404'), - meta: { - i18nKey: t('menu.Error'), - icon: 'error', - hidden: true, - sameLevel: true, - }, -} - -export default error404 diff --git a/src/router/routes.ts b/src/router/routes.ts index 00e10df4..de2bef60 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -1,5 +1,6 @@ import Layout from '@/layout' import { appExpandRoutes } from './app-route-modules' +import { t } from '@/hooks/web/useI18n' export default [ /** @@ -20,6 +21,23 @@ export default [ path: '/', name: 'RLayout', component: Layout, - children: appExpandRoutes(), + children: [ + ...appExpandRoutes(), + /** + * + * @description + * 404 页面一定要放在最后面，避免奇奇怪怪的问题。 + */ + { + path: '/:catchAll(.*)', + component: () => import('@/views/error/views/Error404'), + meta: { + i18nKey: t('menu.Error'), + icon: 'error', + hidden: true, + sameLevel: true, + }, + }, + ], }, ] diff --git a/src/store/hooks/useMenuStore.ts b/src/store/hooks/useMenuStore.ts index 743a1dda..dc54d752 100644 --- a/src/store/hooks/useMenuStore.ts +++ b/src/store/hooks/useMenuStore.ts @@ -83,6 +83,7 @@ export const useMenuActions = () => { spliceMenTagOptions, setMenuTagOptions, resolveOption, + updateMenuState, } = piniaMenuStore() return { @@ -91,5 +92,6 @@ export const useMenuActions = () => { spliceMenTagOptions, setMenuTagOptions, resolveOption, + updateMenuState, } } diff --git a/src/store/modules/menu/index.ts b/src/store/modules/menu/index.ts index 3c85ae22..f7648d6e 100644 --- a/src/store/modules/menu/index.ts +++ b/src/store/modules/menu/index.ts @@ -46,6 +46,7 @@ import { pick } from 'lodash-es' import type { AppMenuOption, MenuTagOptions } from '@/types' import type { MenuState } from '@/store/modules/menu/types' import type { LocationQuery } from 'vue-router' +import type { UpdateMenuState } from './types' let cachePreNormal: AppMenuOption | undefined = void 0 @@ -106,6 +107,20 @@ export const piniaMenuStore = defineStore( }) const isSetupAppMenuLock = ref(true) + /** + * + * @param key menu state key + * @param value updated value + * + * @description + * 更新 menu state 指定 key 的值。 + */ + const updateMenuState: UpdateMenuState = (key, value) => { + if (Object.hasOwn(menuState, key as string)) { + menuState[key] = value + } + } + /** * * @param option 菜单项（类似于菜单项的数据结构也可以） @@ -426,6 +441,7 @@ export const piniaMenuStore = defineStore( spliceMenTagOptions, setMenuTagOptions, resolveOption, + updateMenuState, } }, { diff --git a/src/store/modules/menu/types.ts b/src/store/modules/menu/types.ts index 7d574c3b..a6f3880c 100644 --- a/src/store/modules/menu/types.ts +++ b/src/store/modules/menu/types.ts @@ -8,3 +8,10 @@ export interface MenuState { breadcrumbOptions: AppMenuOption[] currentMenuOption: AppMenuOption | null } + +type PickUpdateKeys = 'collapsed' | 'currentMenuOption' + +export type UpdateMenuState = >( + key: T, + value: MenuState[T], +) => void diff --git a/src/store/modules/menu/utils.ts b/src/store/modules/menu/utils.ts index 638a107a..02c3c06e 100644 --- a/src/store/modules/menu/utils.ts +++ b/src/store/modules/menu/utils.ts @@ -119,6 +119,11 @@ export const parseAndFindMatchingNodes = ( */ export const updateDocumentTitle = (option: AppMenuOption) => { const { breadcrumbLabel } = option + + if (!breadcrumbLabel) { + return + } + const { layout: { sideBarLogo }, } = __APP_CFG__ diff --git a/src/views/demo/svg-icons/index.tsx b/src/views/demo/svg-icons/index.tsx index 4529acec..6683ac1a 100644 --- a/src/views/demo/svg-icons/index.tsx +++ b/src/views/demo/svg-icons/index.tsx @@ -21,7 +21,7 @@ const PreviewSVGIcons = defineComponent({ const iconsModules = import.meta.glob('@/icons/**/**.svg') Object.keys(iconsModules).forEach((curr) => { - const iconName = curr.match(/\/(\w+)\.svg/)![1] + const iconName = curr.match(/\/(\w+)\.svg/)?.[1] if (iconName) { icons.value.push(iconName)