From a00e3ca55780438d68299b0f2304db656e666a54 Mon Sep 17 00:00:00 2001 From: XiaoDaiGua-Ray <443547225@qq.com> Date: Sun, 28 Jan 2024 15:40:04 +0800 Subject: [PATCH] version: 4.6.2-beta1.2 --- CHANGELOG.md | 11 ++++++++ package.json | 2 +- src/components/RQRCode/src/index.scss | 11 ++++++-- src/components/RQRCode/src/index.tsx | 35 +++++++++++++++----------- src/hooks/template/index.ts | 1 + src/hooks/template/useAppNavigation.ts | 6 ++--- src/hooks/template/useBadge.ts | 22 ++++++++++++++++ src/hooks/template/useSiderBar.ts | 4 +++ src/router/type.ts | 2 +- src/styles/naive.scss | 11 ++++++++ src/views/dashboard/index.tsx | 8 +++--- 11 files changed, 88 insertions(+), 25 deletions(-) create mode 100644 src/hooks/template/useBadge.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 0b182dcc..d3f82be1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,16 @@ # CHANGE LOG +## 4.6.2-beta1.2 + +## Feats + +- 优化 `AppMenu Extra` 标记样式，现在不会因为菜单标题过长将标记挤出去 +- 优化 `RQRCode` 组件样式，在 `error` 状态下会模糊显示二维码 + +## Fixes + +- 修复 `close` 方法会关闭最后一个标签的问题，现在如果当前的 `getMenuTagOptions` 长度为 `1`，则不会关闭标签页 + ## 4.6.2-beta1.1 ## Feats diff --git a/package.json b/package.json index 1c1f0724..a58c50fc 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ray-template", "private": false, - "version": "4.6.2-beta1.1", + "version": "4.6.2-beta1.2", "type": "module", "engines": { "node": "^18.0.0 || >=20.0.0", diff --git a/src/components/RQRCode/src/index.scss b/src/components/RQRCode/src/index.scss index 4c97667a..d2faefad 100644 --- a/src/components/RQRCode/src/index.scss +++ b/src/components/RQRCode/src/index.scss @@ -15,6 +15,7 @@ @include flexCenter; flex-direction: column; gap: 18px 0; + border-radius: 3px; & .ray-qrcode__error-content { text-align: center; @@ -23,8 +24,14 @@ color: #ffffff; } } +} - & .n-spin-content--spinning img { - filter: blur(6px); +.ray-qrcode { + &.ray-qrcode--loading img { + filter: blur(4px); + } + + &.ray-qrcode--error img { + filter: blur(4px); } } diff --git a/src/components/RQRCode/src/index.tsx b/src/components/RQRCode/src/index.tsx index fce8c31e..2adfd018 100644 --- a/src/components/RQRCode/src/index.tsx +++ b/src/components/RQRCode/src/index.tsx @@ -154,32 +154,39 @@ export default defineComponent({ } }, render() { + const { + qrcodeURL, + status, + loadingDescription, + errorDescription, + $slots, + errorActionDescription, + } = this + const { errorActionClick } = this + return ( -
- - +
+ + - {this.status === 'error' ? ( + {status === 'error' ? (
- {isValueType(this.errorDescription, 'String') - ? this.errorDescription - : () => this.errorDescription} + {isValueType(errorDescription, 'String') + ? errorDescription + : () => errorDescription}
- {this.$slots.errorAction ? ( - this.$slots.errorAction() + {$slots.errorAction ? ( + $slots.errorAction() ) : ( <> {{ - default: () => this.errorActionDescription, + default: () => errorActionDescription, icon: () => ( ), diff --git a/src/hooks/template/index.ts b/src/hooks/template/index.ts index 124a40ba..e282e74a 100644 --- a/src/hooks/template/index.ts +++ b/src/hooks/template/index.ts @@ -5,3 +5,4 @@ export * from './useTheme' export * from './useSiderBar' export * from './useAppNavigation' export * from './useAppRoot' +export * from './useBadge' diff --git a/src/hooks/template/useAppNavigation.ts b/src/hooks/template/useAppNavigation.ts index 447067e1..985c09c9 100644 --- a/src/hooks/template/useAppNavigation.ts +++ b/src/hooks/template/useAppNavigation.ts @@ -76,7 +76,7 @@ export function useAppNavigation() { if (typeof target === 'number') { // 校验是否为 NaN if (isNaN(target)) { - console.warn(`navigationTo: The ${target} is NaN, expect number.`) + console.warn(`[navigationTo]: The ${target} is NaN, expect number.`) return } @@ -86,7 +86,7 @@ export function useAppNavigation() { // 校验是否超出最大菜单长度 if (target > getMenuOptions.value.length) { console.warn( - `navigationTo: The current ${target} exceeds the maximum number of menus.`, + `[navigationTo]: The current ${target} exceeds the maximum number of menus.`, ) return @@ -116,7 +116,7 @@ export function useAppNavigation() { if (fd) { isPushNavigation(fd.path) } else { - console.warn(`navigationTo: The path "${target}" is not found.`) + console.warn(`[navigationTo]: The path "${target}" is not found.`) } } else { isPushNavigation(target.fullPath) diff --git a/src/hooks/template/useBadge.ts b/src/hooks/template/useBadge.ts new file mode 100644 index 00000000..a60984b9 --- /dev/null +++ b/src/hooks/template/useBadge.ts @@ -0,0 +1,22 @@ +import { useMenuGetters } from '@/store' + +export function useBadge() { + const { getMenuOptions } = useMenuGetters() + + const hidden = () => {} + + const show = () => {} + + const toggle = () => {} + + const updateLabel = () => {} + + return { + hidden, + show, + toggle, + updateLabel, + } +} + +export type UseBadgeReturnType = ReturnType diff --git a/src/hooks/template/useSiderBar.ts b/src/hooks/template/useSiderBar.ts index 6a16eb94..7b321367 100644 --- a/src/hooks/template/useSiderBar.ts +++ b/src/hooks/template/useSiderBar.ts @@ -170,6 +170,10 @@ export function useSiderBar() { const close = (target: CloseMenuTag) => { const normal = normalMenuTagOption(target, 'close') + if (getMenuTagOptions.value.length === 1) { + return + } + if (normal) { const { index, option } = normal diff --git a/src/router/type.ts b/src/router/type.ts index cfdefa60..79b5d43a 100644 --- a/src/router/type.ts +++ b/src/router/type.ts @@ -11,7 +11,7 @@ export type Component = | (() => Promise) export interface AppMenuExtraOptions { - extraLabel?: string + extraLabel?: string | number extraIcon?: string | VNode extraType?: TagProps['type'] } diff --git a/src/styles/naive.scss b/src/styles/naive.scss index 1e830510..0b4c57d4 100644 --- a/src/styles/naive.scss +++ b/src/styles/naive.scss @@ -21,3 +21,14 @@ display: flex; gap: 0 6px; } + +.r-menu--app { + // 手动设置 label 宽度，兼容 extra 的情况 + .n-menu-item-content-header .n-ellipsis { + width: calc(100% - 41px); + } + + .n-menu-item-content-header__extra { + margin-right: 8px; + } +} diff --git a/src/views/dashboard/index.tsx b/src/views/dashboard/index.tsx index c250d42a..9de03fae 100644 --- a/src/views/dashboard/index.tsx +++ b/src/views/dashboard/index.tsx @@ -66,16 +66,16 @@ const Dashboard = defineComponent({ value: 'Vue3.x', }, { - label: 'Vite4.0', - value: 'Vite4.0', + label: 'Vite5.x', + value: 'Vite5.x', }, { label: 'Pinia', value: 'Pinia', }, { - label: 'TSX', - value: 'TSX', + label: 'TS(X)', + value: 'TS(X)', }, ]