blackteay/ray-template
1
0
Fork 0
mirror of https://github.com/XiaoDaiGua-Ray/ray-template.git synced 2025-04-05 19:42:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

version: 4.6.2-beta1.1

Browse Source
This commit is contained in:
XiaoDaiGua-Ray 2024-01-26 23:32:53 +08:00
parent af1eeac035
commit 8ced024a94
19 changed files with 143 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
CHANGELOG.md
View File

@ -1,6 +1,37 @@
# CHANGE LOG
## 4.6.2-beta
## 4.6.2-beta1.1
## Feats
- `cache` 工具包相关
- 优化 `removeStorage` 方法类型推导，当 `key` 为预留字关键字时，强制绑定 `storageType` 为对应的类型值
```ts
import { removeStorage } from '@/utils'
// 正确
removeStorage('__all__', 'all')
removeStorage('__all_sessionStorage__', 'sessionStorage')
removeStorage('__all_localStorage__', 'localStorage')
remove('your key', 'sessionStorage' || 'localStorage')
// 错误
removeStorage('__all__', 'sessionStorage')
removeStorage('__all_sessionStorage__', 'localStorage')
removeStorage('__all_localStorage__', 'all')
removeStorage('__all_localStorage__', 'sessionStorage')
remove('your key', 'all')
```
- 优化 `Layout` 布局样式，移除 `border` 边框，添加 `box-shadow` 阴影
## Fixes
- 修复 `copy` 指令复制的时候不能正确的提示的问题
- 修复 `AppVersionProvider` 组件不能正确的注入 `appVersion` 的问题
## 4.6.2-beta1.0
为了支持同域名下同时部署多套系统，重构了 `cache` 工具包支持前缀配置。并且暴露重构所有的缓存 `key` 配置项，为了便捷的进行私有数据缓存。

2
README-ZH.md
View File

@ -4,7 +4,7 @@
alt="Ray Template"
width="200"
height="200"
src="https://r2chevereto.yka.moe/longmao.navigator.th.png"
src="https://avatars.githubusercontent.com/u/51957438?v=4"
/>
</a>
<br />

2
README.md
View File

@ -4,7 +4,7 @@
alt="Ray Template"
width="200"
height="200"
src="https://r2chevereto.yka.moe/longmao.navigator.th.png"
src="https://avatars.githubusercontent.com/u/51957438?v=4"
/>
</a>
<br />

2
package.json
View File

@ -1,7 +1,7 @@
{
"name": "ray-template",
"private": false,
"version": "4.6.2-beta",
"version": "4.6.2-beta1.1",
"type": "module",
"engines": {
"node": "^18.0.0 || >=20.0.0",

14
src/app-components/app/AppAvatar/index.tsx
View File

@ -63,22 +63,24 @@ const AppAvatar = defineComponent({
}
},
render() {
const { signing, cssVars, spaceSize, avatarSize, $props } = this
return (
<NFlex
class="app-avatar"
{...this.$props}
style={this.cssVars}
size={this.spaceSize}
style={cssVars}
size={spaceSize}
>
<NAvatar
// eslint-disable-next-line prettier/prettier, @typescript-eslint/no-explicit-any
{...(this.$props as any)}
src={this.signing?.avatar}
{...($props as any)}
src={signing?.avatar}
objectFit="cover"
round
size={this.avatarSize}
size={avatarSize}
/>
<div class="app-avatar__name">{this.signing?.name}</div>
<div class="app-avatar__name">{signing?.name}</div>
</NFlex>
)
},

32
src/app-components/app/RayLink/index.tsx
View File

@ -16,41 +16,41 @@ export default defineComponent({
name: 'RayLink',
setup() {
const avatarOptions: AvatarOptions[] = [
{
key: 'yunhome',
src: 'https://yunkuangao.me/',
tooltip: '云之家',
icon: 'https://r2chevereto.yka.moe/avatar.jpeg',
},
{
key: 'yun-cloud-images',
src: 'https://yunkuangao.com/',
tooltip: '云图床',
icon: 'https://r2chevereto.yka.moe/avatar.jpeg',
},
// {
// key: 'yunhome',
// src: 'https://yunkuangao.me/',
// tooltip: '云之家',
// icon: 'https://r2chevereto.yka.moe/avatar.jpeg',
// },
// {
// key: 'yun-cloud-images',
// src: 'https://yunkuangao.com/',
// tooltip: '云图床',
// icon: 'https://r2chevereto.yka.moe/avatar.jpeg',
// },
{
key: 'ray-js-note',
src: 'https://note.youdao.com/s/ObWEe2BB',
tooltip: 'Ray的前端学习笔记',
icon: 'https://r2chevereto.yka.moe/longmao.navigator.png',
icon: 'https://avatars.githubusercontent.com/u/51957438?v=4',
},
{
key: 'ray-js-cover',
src: 'https://note.youdao.com/s/IC8xKPdB',
tooltip: 'Ray的面试题总结',
icon: 'https://r2chevereto.yka.moe/longmao.navigator.png',
icon: 'https://avatars.githubusercontent.com/u/51957438?v=4',
},
{
key: 'ray-template-doc',
src: 'https://xiaodaigua-ray.github.io/ray-template-doc/',
tooltip: 'Ray Template Doc',
icon: 'https://r2chevereto.yka.moe/longmao.navigator.png',
icon: 'https://avatars.githubusercontent.com/u/51957438?v=4',
},
{
key: 'ray-template-doc-out',
src: 'https://ray-template.yunkuangao.com/',
tooltip: 'Ray Template Doc (国内地址)',
icon: 'https://r2chevereto.yka.moe/longmao.navigator.png',
icon: 'https://avatars.githubusercontent.com/u/51957438?v=4',
},
]

6
src/app-components/provider/AppVersionProvider/index.tsx
View File

@ -45,6 +45,12 @@ export default defineComponent({
'localStorage',
)
}
} else {
setStorage<string>(
APP_CATCH_KEY.appVersionProvider,
version,
'localStorage',
)
}
return {

32
src/directives/modules/copy/index.ts
View File

@ -19,29 +19,31 @@ import ClipboardJS from 'clipboard'
import type { CopyElement } from './type'
import type { CustomDirectiveFC } from '@/directives/type'
const createClipboard = (el: CopyElement, value: string) => {
const clipboard = new ClipboardJS(el, {
text: () => value,
})
el.$$clipboard = clipboard
el.$$clipboard.on('success', () => {
window.$message.success('复制成功')
})
el.$$clipboard.on('error', () => {
window.$message.error('复制失败')
})
}
const copyDirective: CustomDirectiveFC<CopyElement, string> = () => {
return {
mounted: (el, { value }) => {
const clipboard = new ClipboardJS(el, {
text: () => String(value),
})
clipboard.on('success', () => {
window.$message.success('复制成功')
})
clipboard.on('error', () => {
window.$message.error('复制失败')
})
el.$$clipboard = clipboard
createClipboard(el, value)
},
updated: (el, { value, oldValue }) => {
if (value !== oldValue) {
el.$$clipboard?.destroy()
el.$$clipboard = new ClipboardJS(el, {
text: () => String(value),
})
createClipboard(el, value)
}
},
beforeUnmount: (el: CopyElement) => {

1
src/layout/components/Menu/components/SiderBarLogo/index.scss
View File

@ -19,7 +19,6 @@
gap: 8px 12px;
font-weight: 600;
overflow: hidden;
border-right: solid 1px var(--n-border-color);
&.ray-menu__logo-url {
position: sticky;

8
src/layout/components/Menu/index.scss
View File

@ -5,3 +5,11 @@
height: 100%;
}
}
.ray-template--light .app-menu__sider {
box-shadow: 2px 0 8px $layoutShadowColorLight;
}
.ray-template--dark .app-menu__sider {
box-shadow: 2px 0 8px $layoutShadowColorDark;
}

4
src/layout/components/Menu/index.tsx
View File

@ -67,7 +67,7 @@ export default defineComponent({
const BasicMenu = () => (
<NLayoutSider
bordered
class="app-menu__sider"
showTrigger={!isTabletOrSmaller.value}
collapseMode={APP_MENU_CONFIG.menuCollapsedMode}
collapsedWidth={APP_MENU_CONFIG.menuCollapsedWidth}
@ -95,7 +95,7 @@ export default defineComponent({
return {
isTabletOrSmaller,
BasicMenu: BasicMenu,
BasicMenu,
modelGlobalDrawerValue,
}
},

9
src/layout/components/MenuTag/index.scss
View File

@ -3,7 +3,6 @@ $menuTagWrapperWidth: 76px;
.menu-tag {
height: $layoutMenuHeight;
border-bottom: solid 1px var(--n-border-color);
display: flex;
align-items: center;
padding: 6px 0;
@ -87,3 +86,11 @@ $menuTagWrapperWidth: 76px;
.menu-tag__right-setting--spinning {
animation: elementRotate 0.8s linear infinite;
}
.ray-template--light .menu-tag {
box-shadow: 0 2px 2px $layoutShadowColorLight;
}
.ray-template--dark .menu-tag {
box-shadow: 0 2px 2px $layoutShadowColorDark;
}

8
src/layout/components/SiderBar/index.scss
View File

@ -8,3 +8,11 @@
width: 100%;
}
}
.ray-template--light .layout-header {
box-shadow: 0 1px 2px $layoutShadowColorLight;
}
.ray-template--dark .layout-header {
box-shadow: 0 1px 2px $layoutShadowColorDark;
}

2
src/layout/components/SiderBar/index.tsx
View File

@ -140,7 +140,7 @@ export default defineComponent({
const { toolIconClick, updateLocale, isRenderVNode } = this
return (
<NLayoutHeader class="layout-header" bordered>
<NLayoutHeader class="layout-header">
<GlobalSearch v-model:show={this.globalSearchShown} />
<NFlex
class="layout-header__method"

8
src/layout/index.scss
View File

@ -21,3 +21,11 @@
}
}
}
.ray-template--light .r-layout-full__viewer-content {
box-shadow: 0 -1px 2px $layoutShadowColorLight;
}
.ray-template--dark .r-layout-full__viewer-content {
box-shadow: 0 -1px 2px $layoutShadowColorDark;
}

4
src/store/modules/signing/index.ts
View File

@ -54,7 +54,7 @@ export const piniaSigningStore = defineStore(
state.signingCallback = {
role: 'admin',
name: SigningForm.name,
avatar: 'https://r2chevereto.yka.moe/longmao.navigator.png',
avatar: 'https://avatars.githubusercontent.com/u/51957438?v=4',
}
resolve({
@ -79,7 +79,7 @@ export const piniaSigningStore = defineStore(
*/
const logout = () => {
window.$message.info('账号退出中...')
removeStorage('__all_sessionStorage__')
removeStorage('__all_sessionStorage__', 'sessionStorage')
setTimeout(() => window.location.reload())
}

3
src/styles/setting.scss
View File

@ -9,3 +9,6 @@ $layoutContentBackgroundColorLight: #f7f9f8;
$layoutFooterBackgroundColorDark: rgba(24, 24, 28, 1);
// 底部区域背景色（light）
$layoutFooterBackgroundColorLight: rgba(255, 255, 255, 1);
// 区域阴影
$layoutShadowColorLight: #0000001f;
$layoutShadowColorDark: #000000b8;

12
src/types/modules/utils.ts
View File

@ -9,7 +9,17 @@ export type RemoveStorageKey =
| '__all_sessionStorage__'
| '__all_localStorage__'
export type RemoveStorageType = StorageLike
export type RemoveStorageFC = <T extends RemoveStorageKey>(
key: T,
storageType: T extends '__all__'
? 'all'
: T extends '__all_sessionStorage__'
? 'sessionStorage'
: T extends '__all_localStorage__'
? 'localStorage'
: StorageLike,
options?: StorageOptions,
) => void
export type ValidateValueType =
| 'BigUint64Array'

27
src/utils/cache.ts
View File

@ -11,12 +11,7 @@
import { APP_CATCH_KEY_PREFIX } from '@/app-config'
import type {
StorageLike,
RemoveStorageKey,
StorageOptions,
RemoveStorageType,
} from '@/types'
import type { StorageLike, StorageOptions, RemoveStorageFC } from '@/types'
/**
*
@ -24,6 +19,7 @@ import type {
* @param storageType 需要删除的缓存类型
* @param options 配置项
*
* @description
* 查找当前缓存中是否含有某个 key
* 默认查找 sessionStorage
*/
@ -46,6 +42,7 @@ function hasStorage(
* @param type 需要删除的缓存类型
* @param options 配置项
*
* @description
* 设置缓存值，默认设置 sessionStorage
*/
function setStorage<T = unknown>(
@ -97,6 +94,7 @@ function getStorage<T = unknown>(
* @param type 需要删除的缓存类型
* @param options 配置项
*
* @description
* 获取缓存值，默认获取 sessionStorage
*/
function getStorage<T = unknown>(
@ -134,27 +132,23 @@ function getStorage<T = unknown>(
* @param type 需要删除的缓存类型
* @param options 配置项
*
* @description
* 删除缓存值，默认删除 sessionStorage
*
* 预保留了 __all__、__all_sessionStorage__、__all_localStorage__ 三个 key
* 分别代表清空所有缓存、清空 sessionStorage 缓存、清空 localStorage 缓存
*
* @example
* removeStorage('__all__') // 清空所有缓存
* removeStorage('__all_sessionStorage__') // 清空 sessionStorage 缓存
* removeStorage('__all_localStorage__') // 清空 localStorage 缓存
* removeStorage('signing') // 清空 session 中 signing 缓存字段
* removeStorage('__all__', 'all') // 清空所有缓存
* removeStorage('__all_sessionStorage__', 'sessionStorage') // 清空 sessionStorage 缓存
* removeStorage('__all_localStorage__', 'localStorage') // 清空 localStorage 缓存
* removeStorage('signing', 'sessionStorage' || 'localStorage') // 清空 session 中 signing 缓存字段
*/
function removeStorage(
key: RemoveStorageKey,
storageType: RemoveStorageType = 'sessionStorage',
options?: StorageOptions,
) {
const removeStorage: RemoveStorageFC = (key, storageType, options) => {
if (!key) {
console.error(
`[removeStorage]: Failed to remove stored data: key ${key} is empty or undefined`,
)
return
}
@ -169,7 +163,6 @@ function removeStorage(
: removeType === 'localStorage'
? localStorageKeys
: sessionStorageKeys
keys.forEach((curr) => {
if (key === '__all__') {
window.sessionStorage.removeItem(_prefix + curr)