This commit is contained in:
dap 2024-08-13 22:12:15 +08:00
commit abf863dcda
44 changed files with 150 additions and 187 deletions

View File

@ -1,4 +1,4 @@
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp"> </a> <br> <br> <div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp"> </a> <br> <br>
[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE) [![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
@ -127,7 +127,7 @@ pnpm build
このプロジェクトが役に立つと思われた場合、作者にコーヒーを一杯おごってサポートを示すことができます! このプロジェクトが役に立つと思われた場合、作者にコーヒーを一杯おごってサポートを示すことができます!
![donate](https://unpkg.com/@vbenjs/static-source@0.1.5/source/sponsor.png) ![donate](https://unpkg.com/@vbenjs/static-source@0.1.6/source/sponsor.png)
<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a> <a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>

View File

@ -1,4 +1,4 @@
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp"> </a> <br> <br> <div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp"> </a> <br> <br>
[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE) [![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
@ -126,7 +126,7 @@ Support modern browsers, not IE
If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support! If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support!
![donate](https://unpkg.com/@vbenjs/static-source@0.1.5/source/sponsor.png) ![donate](https://unpkg.com/@vbenjs/static-source@0.1.6/source/sponsor.png)
<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a> <a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>

View File

@ -1,4 +1,4 @@
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp"> </a> <br> <br> <div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp"> </a> <br> <br>
[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE) [![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
@ -122,7 +122,7 @@ pnpm build
如果你觉得这个项目对你有帮助,你可以帮作者买一杯咖啡表示支持! 如果你觉得这个项目对你有帮助,你可以帮作者买一杯咖啡表示支持!
![donate](https://unpkg.com/@vbenjs/static-source@0.1.5/source/sponsor.png) ![donate](https://unpkg.com/@vbenjs/static-source@0.1.6/source/sponsor.png)
<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a> <a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>

View File

@ -9,19 +9,19 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
}); });
// 有需要可以自行打开注释,并创建文件夹 // 有需要可以自行打开注释,并创建文件夹
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
/** 动态路由 */ /** 动态路由 */
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
/** 静态路由列表,访问这些页面可以不需要权限 */ /** 外部路由列表访问这些页面可以不需要Layout可能用于内嵌在别的系统 */
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
const staticRoutes: RouteRecordRaw[] = []; const externalRoutes: RouteRecordRaw[] = [];
/** 路由列表,由基本路由+静态路由组成 */ /** 路由列表,由基本路由+静态路由组成 */
const routes: RouteRecordRaw[] = [ const routes: RouteRecordRaw[] = [
...coreRoutes, ...coreRoutes,
...staticRoutes, ...externalRoutes,
fallbackNotFoundRoute, fallbackNotFoundRoute,
]; ];

View File

@ -9,19 +9,19 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
}); });
// 有需要可以自行打开注释,并创建文件夹 // 有需要可以自行打开注释,并创建文件夹
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
/** 动态路由 */ /** 动态路由 */
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
/** 静态路由列表,访问这些页面可以不需要权限 */ /** 外部路由列表访问这些页面可以不需要Layout可能用于内嵌在别的系统 */
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
const staticRoutes: RouteRecordRaw[] = []; const externalRoutes: RouteRecordRaw[] = [];
/** 路由列表,由基本路由+静态路由组成 */ /** 路由列表,由基本路由+静态路由组成 */
const routes: RouteRecordRaw[] = [ const routes: RouteRecordRaw[] = [
...coreRoutes, ...coreRoutes,
...staticRoutes, ...externalRoutes,
fallbackNotFoundRoute, fallbackNotFoundRoute,
]; ];

View File

@ -9,19 +9,19 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
}); });
// 有需要可以自行打开注释,并创建文件夹 // 有需要可以自行打开注释,并创建文件夹
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
/** 动态路由 */ /** 动态路由 */
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
/** 静态路由列表,访问这些页面可以不需要权限 */ /** 外部路由列表访问这些页面可以不需要Layout可能用于内嵌在别的系统 */
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
const staticRoutes: RouteRecordRaw[] = []; const externalRoutes: RouteRecordRaw[] = [];
/** 路由列表,由基本路由+静态路由组成 */ /** 路由列表,由基本路由+静态路由组成 */
const routes: RouteRecordRaw[] = [ const routes: RouteRecordRaw[] = [
...coreRoutes, ...coreRoutes,
...staticRoutes, ...externalRoutes,
fallbackNotFoundRoute, fallbackNotFoundRoute,
]; ];

View File

@ -50,7 +50,7 @@ export default withPwa(
text: '最后更新于', text: '最后更新于',
}, },
lightModeSwitchTitle: '切换到浅色模式', lightModeSwitchTitle: '切换到浅色模式',
logo: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp', logo: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp',
nav: nav(), nav: nav(),
outline: { outline: {
label: '页面导航', label: '页面导航',
@ -362,12 +362,12 @@ function pwa(): PwaOptions {
icons: [ icons: [
{ {
sizes: '192x192', sizes: '192x192',
src: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/pwa-icon-192.png', src: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/pwa-icon-192.png',
type: 'image/png', type: 'image/png',
}, },
{ {
sizes: '512x512', sizes: '512x512',
src: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/pwa-icon-512.png', src: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/pwa-icon-512.png',
type: 'image/png', type: 'image/png',
}, },
], ],

View File

@ -18,4 +18,4 @@
通过微信联系作者,注明加群来意: 通过微信联系作者,注明加群来意:
<img src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/wechat.jpg" style="width: 300px;"/> <img src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/wechat.jpg" style="width: 300px;"/>

View File

@ -7,6 +7,6 @@
- 通过邮箱联系开发者: [ann.vben@gmail.com](mailto:ann.vben@gmail.com) - 通过邮箱联系开发者: [ann.vben@gmail.com](mailto:ann.vben@gmail.com)
- 通过微信联系开发者: - 通过微信联系开发者:
<img src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/wechat.jpg" style="width: 300px;"/> <img src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/wechat.jpg" style="width: 300px;"/>
我们会在第一时间回复您,定制费用根据需求而定。 我们会在第一时间回复您,定制费用根据需求而定。

View File

@ -8,7 +8,7 @@ hero:
text: 企业级管理系统框架 text: 企业级管理系统框架
tagline: 全新升级,开箱即用,简单高效 tagline: 全新升级,开箱即用,简单高效
image: image:
src: https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp src: https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp
alt: Vben Admin alt: Vben Admin
actions: actions:
- theme: brand - theme: brand

View File

@ -9,7 +9,7 @@
- 通过邮箱联系作者: [ann.vben@gmail.com](mailto:ann.vben@gmail.com) - 通过邮箱联系作者: [ann.vben@gmail.com](mailto:ann.vben@gmail.com)
- 通过微信联系作者: - 通过微信联系作者:
<img src="https://unpkg.com/@vbenjs/static-source@0.1.5/source/wechat.jpg" style="width: 300px;"/> <img src="https://unpkg.com/@vbenjs/static-source@0.1.6/source/wechat.jpg" style="width: 300px;"/>
### 提供资料 ### 提供资料
@ -22,6 +22,6 @@
- 名称Vben Admin - 名称Vben Admin
- 链接https://www.vben.pro - 链接https://www.vben.pro
- 描述Vben Admin 企业级开箱即用的中后台前端解决方案 - 描述Vben Admin 企业级开箱即用的中后台前端解决方案
- Logohttps://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp - Logohttps://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp
我们将定期的检查友情链接,如果发现您的网站已经删除了我们的友情链接以及链接地址是否正确。 我们将定期的检查友情链接,如果发现您的网站已经删除了我们的友情链接以及链接地址是否正确。

View File

@ -16,15 +16,15 @@ outline: deep
```ts ```ts
// 有需要可以自行打开注释,并创建文件夹 // 有需要可以自行打开注释,并创建文件夹
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // [!code --] // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true }); // [!code --]
const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // [!code ++] const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // [!code ++]
/** 动态路由 */ /** 动态路由 */
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
/** 静态路由列表,访问这些页面可以不需要权限 */ /** 外部路由列表访问这些页面可以不需要Layout可能用于内嵌在别的系统 */
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // [!code --] // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles) // [!code --]
const staticRoutes: RouteRecordRaw[] = []; // [!code --] const externalRoutes: RouteRecordRaw[] = []; // [!code --]
const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // [!code ++] const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles); // [!code ++]
``` ```
### 动态路由 ### 动态路由

View File

@ -180,7 +180,7 @@ const defaultPreferences: Preferences = {
compact: false, compact: false,
contentCompact: 'wide', contentCompact: 'wide',
defaultAvatar: defaultAvatar:
'https://unpkg.com/@vbenjs/static-source@0.1.5/source/avatar-v1.webp', 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/avatar-v1.webp',
dynamicTitle: true, dynamicTitle: true,
enableCheckUpdates: true, enableCheckUpdates: true,
enablePreferences: true, enablePreferences: true,
@ -217,7 +217,7 @@ const defaultPreferences: Preferences = {
}, },
logo: { logo: {
enable: true, enable: true,
source: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp', source: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp',
}, },
navigation: { navigation: {
accordion: true, accordion: true,

View File

@ -110,9 +110,6 @@ css 变量内的颜色,必须使用 `hsl` 格式,如 `0 0% 100%`,不需要
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 231deg 61% 44%;
/* =============component & UI============= */ /* =============component & UI============= */
/* menu */ /* menu */
@ -212,9 +209,6 @@ css 变量内的颜色,必须使用 `hsl` 格式,如 `0 0% 100%`,不需要
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 220deg 13.06% 3.04%;
/* =============component & UI============= */ /* =============component & UI============= */
--sidebar: 222.34deg 10.43% 12.27%; --sidebar: 222.34deg 10.43% 12.27%;
@ -412,9 +406,6 @@ type BuiltinThemeType =
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 231deg 61% 44%;
/* =============component & UI============= */ /* =============component & UI============= */
/* menu */ /* menu */
@ -787,9 +778,6 @@ type BuiltinThemeType =
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 220deg 13.06% 3.04%;
/* =============component & UI============= */ /* =============component & UI============= */
--sidebar: 222.34deg 10.43% 12.27%; --sidebar: 222.34deg 10.43% 12.27%;

View File

@ -8,7 +8,7 @@ hero:
text: 企业级管理系统框架 text: 企业级管理系统框架
tagline: 全新升级,开箱即用,简单高效 tagline: 全新升级,开箱即用,简单高效
image: image:
src: https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp src: https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp
alt: Vben Admin alt: Vben Admin
actions: actions:
- theme: brand - theme: brand

View File

@ -2,7 +2,7 @@
如果你觉得这个项目对你有帮助,你可以帮作者买一杯咖啡表示支持! 如果你觉得这个项目对你有帮助,你可以帮作者买一杯咖啡表示支持!
![](https://unpkg.com/@vbenjs/static-source@0.1.5/source/sponsor.png) ![](https://unpkg.com/@vbenjs/static-source@0.1.6/source/sponsor.png)
您的赞助将帮助我们: 您的赞助将帮助我们:

View File

@ -76,9 +76,6 @@ const shadcnUiColors = {
}; };
const customColors = { const customColors = {
authentication: {
DEFAULT: 'hsl(var(--authentication))',
},
green: { green: {
...createColorsPalette('green'), ...createColorsPalette('green'),
foreground: 'hsl(var(--success-foreground))', foreground: 'hsl(var(--success-foreground))',
@ -145,6 +142,7 @@ export default {
'collapsible-up': 'collapsible-up 0.2s ease-in-out', 'collapsible-up': 'collapsible-up 0.2s ease-in-out',
float: 'float 5s linear 0ms infinite', float: 'float 5s linear 0ms infinite',
}, },
animationDuration: { animationDuration: {
'2000': '2000ms', '2000': '2000ms',
'3000': '3000ms', '3000': '3000ms',
@ -155,6 +153,11 @@ export default {
sm: 'calc(var(--radius) - 4px)', sm: 'calc(var(--radius) - 4px)',
xl: 'calc(var(--radius) + 4px)', xl: 'calc(var(--radius) + 4px)',
}, },
boxShadow: {
float: `0 6px 16px 0 rgb(0 0 0 / 8%),
0 3px 6px -4px rgb(0 0 0 / 12%),
0 9px 28px 8px rgb(0 0 0 / 5%)`,
},
colors: { colors: {
...customColors, ...customColors,
...shadcnUiColors, ...shadcnUiColors,

View File

@ -11,12 +11,12 @@ const getDefaultPwaOptions = (name: string): Partial<PwaPluginOptions> => ({
icons: [ icons: [
{ {
sizes: '192x192', sizes: '192x192',
src: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/pwa-icon-192.png', src: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/pwa-icon-192.png',
type: 'image/png', type: 'image/png',
}, },
{ {
sizes: '512x512', sizes: '512x512',
src: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/pwa-icon-512.png', src: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/pwa-icon-512.png',
type: 'image/png', type: 'image/png',
}, },
], ],

View File

@ -25,7 +25,7 @@
pointer-events: none; pointer-events: none;
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
transition: all 1s ease-out; transition: all 0.8s ease-out;
} }
.dark .loading { .dark .loading {

View File

@ -36,8 +36,9 @@
/* overflow: overlay; */ /* overflow: overlay; */
-webkit-font-smoothing: antialiased; /* -webkit-font-smoothing: antialiased; */
-moz-osx-font-smoothing: grayscale;
/* -moz-osx-font-smoothing: grayscale; */
} }
a, a,

View File

@ -52,12 +52,12 @@
--secondary-foreground: 0 0% 98%; --secondary-foreground: 0 0% 98%;
/* Used for accents such as hover effects on <DropdownMenuItem>, <SelectItem>...etc */ /* Used for accents such as hover effects on <DropdownMenuItem>, <SelectItem>...etc */
--accent: 0deg 0% 100% / 8%; --accent: 240 3.7% 15.9%;
--accent-hover: 0deg 0% 100% / 12%; --accent-hover: 240 3.7% 20.9%;
--accent-foreground: 0 0% 98%; --accent-foreground: 0 0% 98%;
/* Darker color */ /* Darker color */
--heavy: 0deg 0% 100% / 12%; --heavy: 240 3.7% 20.9%;
--heavy-foreground: var(--accent-foreground); --heavy-foreground: var(--accent-foreground);
/* Default border color */ /* Default border color */
@ -85,9 +85,6 @@
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 220deg 13.06% 3.04%;
/* =============component & UI============= */ /* =============component & UI============= */
--sidebar: 222.34deg 10.43% 12.27%; --sidebar: 222.34deg 10.43% 12.27%;

View File

@ -85,9 +85,6 @@
/* 主体内容背景色 */ /* 主体内容背景色 */
--content: 240 11% 96%; --content: 240 11% 96%;
/* 登录背景色 */
--authentication: 231deg 61% 44%;
/* =============component & UI============= */ /* =============component & UI============= */
/* menu */ /* menu */

View File

@ -38,6 +38,7 @@ export {
RotateCw, RotateCw,
Search, Search,
SearchX, SearchX,
Settings2,
Sun, Sun,
SunMoon, SunMoon,
SwatchBook, SwatchBook,

View File

@ -12,7 +12,7 @@ export const VBEN_DOC_URL = 'https://doc.vben.pro';
* @zh_CN Vben Logo * @zh_CN Vben Logo
*/ */
export const VBEN_LOGO_URL = export const VBEN_LOGO_URL =
'https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp'; 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp';
/** /**
* @zh_CN Vben Admin * @zh_CN Vben Admin

View File

@ -1,5 +1,7 @@
import type { RouteRecordRaw } from 'vue-router'; import type { RouteRecordRaw } from 'vue-router';
import type { Component } from 'vue';
/** /**
* *
*/ */
@ -44,7 +46,7 @@ interface MenuRecordRaw extends MenuRecordBadgeRaw {
/** /**
* *
*/ */
icon?: string; icon?: Component | string;
/** /**
* *
*/ */

View File

@ -68,7 +68,7 @@ interface RouteMeta {
/** /**
* /tab * /tab
*/ */
icon?: string; icon?: Component | string;
/** /**
* iframe * iframe
*/ */

View File

@ -10,7 +10,7 @@ const defaultPreferences: Preferences = {
compact: false, compact: false,
contentCompact: 'wide', contentCompact: 'wide',
defaultAvatar: defaultAvatar:
'https://unpkg.com/@vbenjs/static-source@0.1.5/source/avatar-v1.webp', 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/avatar-v1.webp',
dynamicTitle: true, dynamicTitle: true,
enableCheckUpdates: true, enableCheckUpdates: true,
enablePreferences: true, enablePreferences: true,
@ -47,7 +47,7 @@ const defaultPreferences: Preferences = {
}, },
logo: { logo: {
enable: true, enable: true,
source: 'https://unpkg.com/@vbenjs/static-source@0.1.5/source/logo-v1.webp', source: 'https://unpkg.com/@vbenjs/static-source@0.1.6/source/logo-v1.webp',
}, },
navigation: { navigation: {
accordion: true, accordion: true,

View File

@ -21,39 +21,42 @@ const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[] = [
type: 'pink', type: 'pink',
}, },
{ {
color: 'hsl(0 75% 42%)', color: 'hsl(42 84% 61%)',
type: 'rose', type: 'yellow',
}, },
{ {
color: 'hsl(212 100% 45%)', color: 'hsl(212 100% 45%)',
type: 'sky-blue', type: 'sky-blue',
}, },
{
color: 'hsl(211 91% 39%)',
type: 'deep-blue',
},
{ {
color: 'hsl(161 90% 43%)', color: 'hsl(161 90% 43%)',
type: 'green', type: 'green',
}, },
{
color: 'hsl(181 84% 32%)',
type: 'deep-green',
},
{
color: 'hsl(18 89% 40%)',
type: 'orange',
},
{
color: 'hsl(42 84% 61%)',
type: 'yellow',
},
{ {
color: 'hsl(240 5% 26%)', color: 'hsl(240 5% 26%)',
darkPrimaryColor: 'hsl(0 0% 98%)', darkPrimaryColor: 'hsl(0 0% 98%)',
primaryColor: 'hsl(240 5.9% 10%)', primaryColor: 'hsl(240 5.9% 10%)',
type: 'zinc', type: 'zinc',
}, },
{
color: 'hsl(181 84% 32%)',
type: 'deep-green',
},
{
color: 'hsl(211 91% 39%)',
type: 'deep-blue',
},
{
color: 'hsl(18 89% 40%)',
type: 'orange',
},
{
color: 'hsl(0 75% 42%)',
type: 'rose',
},
{ {
color: 'hsl(0 0% 25%)', color: 'hsl(0 0% 25%)',
darkPrimaryColor: 'hsl(0 0% 98%)', darkPrimaryColor: 'hsl(0 0% 98%)',

View File

@ -59,6 +59,11 @@ const sidebarExtraCollapse = defineModel<boolean>('sidebarExtraCollapse');
const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover'); const sidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
const sidebarEnable = defineModel<boolean>('sidebarEnable', { default: true }); const sidebarEnable = defineModel<boolean>('sidebarEnable', { default: true });
// sidehover
const sidebarExpandOnHovering = ref(false);
const headerIsHidden = ref(false);
const contentRef = ref();
const { const {
arrivedState, arrivedState,
directions, directions,
@ -66,11 +71,7 @@ const {
y: scrollY, y: scrollY,
} = useScroll(document); } = useScroll(document);
const { y: mouseY } = useMouse({ type: 'client' }); const { y: mouseY } = useMouse({ target: contentRef, type: 'client' });
// sidehover
const sidebarExpandOnHovering = ref(false);
const headerIsHidden = ref(false);
const realLayout = computed(() => const realLayout = computed(() =>
props.isMobile ? 'sidebar-nav' : props.layout, props.isMobile ? 'sidebar-nav' : props.layout,
@ -507,6 +508,7 @@ function handleOpenMenu() {
</LayoutSidebar> </LayoutSidebar>
<div <div
ref="contentRef"
class="flex flex-1 flex-col overflow-hidden transition-all duration-300 ease-in" class="flex flex-1 flex-col overflow-hidden transition-all duration-300 ease-in"
> >
<div <div

View File

@ -542,15 +542,6 @@ $namespace: vben;
} }
& > .#{$namespace}-sub-menu { & > .#{$namespace}-sub-menu {
// .#{$namespace}-menu {
// background: var(--menu-submenu-opened-background-color);
// .#{$namespace}-sub-menu,
// .#{$namespace}-menu-item:not(.is-active),
// .#{$namespace}-sub-menu-content:not(.is-active) {
// background: var(--menu-submenu-opened-background-color);
// }
// }
& > .#{$namespace}-menu { & > .#{$namespace}-menu {
& > .#{$namespace}-menu-item { & > .#{$namespace}-menu-item {
padding-left: calc( padding-left: calc(
@ -713,13 +704,11 @@ $namespace: vben;
.#{$namespace}-menu-item { .#{$namespace}-menu-item {
fill: var(--menu-item-color); fill: var(--menu-item-color);
stroke: var(--menu-item-color);
@include menu-item; @include menu-item;
&.is-active { &.is-active {
fill: var(--menu-item-active-color); fill: var(--menu-item-active-color);
stroke: var(--menu-item-active-color);
@include menu-item-active; @include menu-item-active;
} }
@ -783,7 +772,6 @@ $namespace: vben;
list-style: none; list-style: none;
background: var(--menu-submenu-background-color); background: var(--menu-submenu-background-color);
fill: var(--menu-item-color); fill: var(--menu-item-color);
stroke: var(--menu-item-color);
&.is-active { &.is-active {
div[data-state='open'] > .#{$namespace}-sub-menu-content, div[data-state='open'] > .#{$namespace}-sub-menu-content,
@ -794,7 +782,6 @@ $namespace: vben;
cursor: pointer; cursor: pointer;
background: var(--menu-submenu-active-background-color); background: var(--menu-submenu-active-background-color);
fill: var(--menu-submenu-active-color); fill: var(--menu-submenu-active-color);
stroke: var(--menu-submenu-active-color);
} }
} }
} }

View File

@ -1,6 +1,6 @@
import type { MenuRecordBadgeRaw, ThemeModeType } from '@vben-core/typings'; import type { MenuRecordBadgeRaw, ThemeModeType } from '@vben-core/typings';
import type { Ref } from 'vue'; import type { Component, Ref } from 'vue';
interface MenuProps { interface MenuProps {
/** /**
@ -61,7 +61,7 @@ interface SubMenuProps extends MenuRecordBadgeRaw {
/** /**
* @zh_CN * @zh_CN
*/ */
icon?: string; icon?: Component | string;
/** /**
* @zh_CN submenu * @zh_CN submenu
*/ */
@ -80,7 +80,7 @@ interface MenuItemProps extends MenuRecordBadgeRaw {
/** /**
* @zh_CN * @zh_CN
*/ */
icon?: string; icon?: Component | string;
/** /**
* @zh_CN menuitem * @zh_CN menuitem
*/ */
@ -93,10 +93,6 @@ interface MenuItemRegistered {
path: string; path: string;
} }
// export interface MenuItemClicked {
// name: string;
// }
interface MenuItemClicked { interface MenuItemClicked {
parentPaths: string[]; parentPaths: string[];
path: string; path: string;

View File

@ -31,12 +31,6 @@ const hasChildren = computed(() => {
Reflect.has(menu, 'children') && !!menu.children && menu.children.length > 0 Reflect.has(menu, 'children') && !!menu.children && menu.children.length > 0
); );
}); });
// function menuIcon(menu: MenuRecordRaw) {
// return props.activePath === menu.path
// ? menu.activeIcon || menu.icon
// : menu.icon;
// }
</script> </script>
<template> <template>

View File

@ -13,9 +13,9 @@ interface Props extends BacktopProps {}
defineOptions({ name: 'BackTop' }); defineOptions({ name: 'BackTop' });
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
bottom: 24, bottom: 20,
isGroup: false, isGroup: false,
right: 40, right: 24,
target: '', target: '',
visibilityHeight: 200, visibilityHeight: 200,
}); });
@ -32,7 +32,7 @@ const { handleClick, visible } = useBackTop(props);
<VbenButton <VbenButton
v-if="visible" v-if="visible"
:style="backTopStyle" :style="backTopStyle"
class="bg-accent hover:bg-heavy data fixed bottom-10 right-5 z-[1000] h-10 w-10 rounded-full" class="dark:bg-accent dark:hover:bg-heavy bg-background hover:bg-heavy data shadow-float fixed bottom-10 z-[1000] h-10 w-10 rounded-full duration-500"
size="icon" size="icon"
variant="icon" variant="icon"
@click="handleClick" @click="handleClick"

View File

@ -1,5 +1,7 @@
import type { Component } from 'vue';
interface IBreadcrumb { interface IBreadcrumb {
icon?: string; icon?: Component | string;
isHome?: boolean; isHome?: boolean;
items?: IBreadcrumb[]; items?: IBreadcrumb[];
path?: string; path?: string;

View File

@ -33,7 +33,7 @@ const inputClass = computed(() => {
v-model="modelValue" v-model="modelValue"
:class="[props.class, inputClass]" :class="[props.class, inputClass]"
autocomplete="off" autocomplete="off"
class="border-input bg-input-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring focus:border-primary flex h-10 w-full rounded-md border p-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50" class="border-input bg-input-background ring-offset-background placeholder:text-muted-foreground/60 focus-visible:ring-ring focus:border-primary flex h-10 w-full rounded-md border p-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
required required
type="text" type="text"
v-bind="$attrs" v-bind="$attrs"

View File

@ -108,9 +108,6 @@ function scrollIntoView() {
<div <div
class="absolute right-1.5 top-1/2 z-[3] translate-y-[-50%] overflow-hidden" class="absolute right-1.5 top-1/2 z-[3] translate-y-[-50%] overflow-hidden"
> >
<!-- <div
class="absolute right-1.5 top-1/2 z-[3] translate-y-[-50%] overflow-hidden opacity-0 transition-opacity group-hover:opacity-100 group-[.is-active]:opacity-100"
> -->
<!-- close-icon --> <!-- close-icon -->
<X <X
v-show=" v-show="
@ -130,9 +127,6 @@ function scrollIntoView() {
<div <div
class="text-accent-foreground group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground mx-3 mr-4 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pr-3 transition-all duration-300" class="text-accent-foreground group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground mx-3 mr-4 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] pr-3 transition-all duration-300"
> >
<!-- <div
class="mx-3 ml-3 mr-2 flex h-full items-center overflow-hidden rounded-tl-[5px] rounded-tr-[5px] transition-all duration-300 group-hover:mr-2 group-hover:pr-4 group-[.is-active]:pr-4"
> -->
<VbenIcon <VbenIcon
v-if="showIcon" v-if="showIcon"
:icon="tab.icon" :icon="tab.icon"

View File

@ -31,9 +31,16 @@ describe('ellipsis-text.vue', () => {
default: 'This is a very long text that should be truncated.', default: 'This is a very long text that should be truncated.',
}, },
}); });
const ellipsis = wrapper.find('.truncate'); const ellipsis = wrapper.find('.truncate');
// 点击 ellipsis应该触发 expandChange参数为 false
await ellipsis.trigger('click'); await ellipsis.trigger('click');
expect(wrapper.emitted('expandChange')).toBeTruthy(); expect(wrapper.emitted('expandChange')).toBeTruthy();
expect(wrapper.emitted('expandChange')?.[0]).toEqual([true]);
// 再次点击,应该触发 expandChange参数为 false
await ellipsis.trigger('click');
expect(wrapper.emitted('expandChange')?.length).toBe(2);
expect(wrapper.emitted('expandChange')?.[1]).toEqual([false]);
}); });
}); });

View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, type CSSProperties, nextTick, ref, watchEffect } from 'vue'; import { computed, type CSSProperties, ref, watchEffect } from 'vue';
import { VbenTooltip } from '@vben-core/shadcn-ui'; import { VbenTooltip } from '@vben-core/shadcn-ui';
@ -72,12 +72,10 @@ const textMaxWidth = computed(() => {
} }
return props.maxWidth; return props.maxWidth;
}); });
const showTooltip = ref(false);
const ellipsis = ref(); const ellipsis = ref();
const isExpand = ref(false);
const defaultTooltipMaxWidth = ref(); const defaultTooltipMaxWidth = ref();
watchEffect(() => {
showTooltip.value = props.tooltip;
});
watchEffect( watchEffect(
() => { () => {
if (props.tooltip && ellipsis.value) { if (props.tooltip && ellipsis.value) {
@ -88,25 +86,12 @@ watchEffect(
{ flush: 'post' }, { flush: 'post' },
); );
function onExpand() { function onExpand() {
const { style } = ellipsis.value; isExpand.value = !isExpand.value;
const isExpanded = !style['-webkit-line-clamp']; emit('expandChange', isExpand.value);
if (props.tooltip) {
showTooltip.value = !isExpanded;
}
nextTick(() => {
style['-webkit-line-clamp'] = isExpanded ? props.line : '';
});
emit('expandChange', !isExpanded);
} }
function handleExpand() { function handleExpand() {
if (props.expand) { props.expand && onExpand();
onExpand();
} else {
return false;
}
} }
</script> </script>
<template> <template>
@ -118,7 +103,7 @@ function handleExpand() {
color: tooltipColor, color: tooltipColor,
backgroundColor: tooltipBackgroundColor, backgroundColor: tooltipBackgroundColor,
}" }"
:disabled="!showTooltip" :disabled="!props.tooltip || isExpand"
:side="placement" :side="placement"
> >
<slot name="tooltip"> <slot name="tooltip">
@ -133,7 +118,10 @@ function handleExpand() {
['inline-block truncate']: line === 1, ['inline-block truncate']: line === 1,
[$style.ellipsisMultiLine]: line > 1, [$style.ellipsisMultiLine]: line > 1,
}" }"
:style="`-webkit-line-clamp: ${line}; max-width: ${textMaxWidth};`" :style="{
'-webkit-line-clamp': isExpand ? '' : line,
'max-width': textMaxWidth,
}"
class="cursor-text overflow-hidden" class="cursor-text overflow-hidden"
@click="handleExpand" @click="handleExpand"
v-bind="$attrs" v-bind="$attrs"

View File

@ -26,7 +26,7 @@ const logoSource = computed(() => preferences.logo.source);
<!-- 头部 Logo 和应用名称 --> <!-- 头部 Logo 和应用名称 -->
<div class="absolute left-0 top-0 z-10 flex flex-1"> <div class="absolute left-0 top-0 z-10 flex flex-1">
<div <div
:class="authPanelLeft ? 'lg:text-foreground' : 'lg:text-white'" :class="authPanelRight ? 'lg:text-white' : 'lg:text-foreground'"
class="text-foreground ml-4 mt-4 flex flex-1 items-center sm:left-6 sm:top-6" class="text-foreground ml-4 mt-4 flex flex-1 items-center sm:left-6 sm:top-6"
> >
<img :alt="appName" :src="logoSource" class="mr-2" width="42" /> <img :alt="appName" :src="logoSource" class="mr-2" width="42" />
@ -38,7 +38,8 @@ const logoSource = computed(() => preferences.logo.source);
<!-- 中间内容 --> <!-- 中间内容 -->
<div v-if="!authPanelCenter" class="relative hidden w-0 flex-1 lg:block"> <div v-if="!authPanelCenter" class="relative hidden w-0 flex-1 lg:block">
<div class="bg-authentication absolute inset-0 h-full w-full"> <div class="absolute inset-0 h-full w-full bg-[#070709]">
<div class="login-background absolute left-0 top-0 size-full"></div>
<div class="flex-col-center -enter-x mr-20 h-full"> <div class="flex-col-center -enter-x mr-20 h-full">
<SloganIcon :alt="appName" class="animate-float h-64 w-2/5" /> <SloganIcon :alt="appName" class="animate-float h-64 w-2/5" />
<div class="text-1xl mt-6 font-sans text-white lg:text-2xl"> <div class="text-1xl mt-6 font-sans text-white lg:text-2xl">
@ -52,9 +53,10 @@ const logoSource = computed(() => preferences.logo.source);
</div> </div>
<!-- 中心认证面板 --> <!-- 中心认证面板 -->
<div v-if="authPanelCenter" class="flex-center bg-authentication w-full"> <div v-if="authPanelCenter" class="flex-center relative w-full">
<div class="login-background absolute left-0 top-0 size-full"></div>
<AuthenticationFormView <AuthenticationFormView
class="md:bg-background w-full rounded-3xl pb-20 shadow-2xl md:w-2/3 lg:w-1/2 xl:w-2/5" class="md:bg-background shadow-primary/10 w-full rounded-3xl pb-20 shadow-2xl md:w-2/3 lg:w-1/2 xl:w-[36%]"
/> />
</div> </div>
@ -65,3 +67,15 @@ const logoSource = computed(() => preferences.logo.source);
/> />
</div> </div>
</template> </template>
<style scoped>
.login-background {
background: linear-gradient(
154deg,
#07070915 30%,
hsl(var(--primary) / 15%) 48%,
#07070915 64%
);
filter: blur(100px);
}
</style>

View File

@ -30,11 +30,7 @@ const breadcrumbs = computed((): IBreadcrumb[] => {
const resultBreadcrumb: IBreadcrumb[] = []; const resultBreadcrumb: IBreadcrumb[] = [];
for (const match of matched) { for (const match of matched) {
const { const { meta, path } = match;
meta,
path,
// children = []
} = match;
const { hideChildrenInMenu, hideInBreadcrumb, icon, name, title } = const { hideChildrenInMenu, hideInBreadcrumb, icon, name, title } =
meta || {}; meta || {};
if (hideInBreadcrumb || hideChildrenInMenu || !path) { if (hideInBreadcrumb || hideChildrenInMenu || !path) {
@ -45,13 +41,6 @@ const breadcrumbs = computed((): IBreadcrumb[] => {
icon, icon,
path: path || route.path, path: path || route.path,
title: title ? $t((title || name) as string) : '', title: title ? $t((title || name) as string) : '',
// items: children.map((child) => {
// return {
// icon: child?.meta?.icon as string,
// path: child.path,
// title: child?.meta?.title as string,
// };
// }),
}); });
} }
if (props.showHome) { if (props.showHome) {

View File

@ -13,7 +13,7 @@ import type { SegmentedItem } from '@vben-core/shadcn-ui';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { Copy, RotateCw, SwatchBook } from '@vben/icons'; import { Copy, RotateCw, Settings2 } from '@vben/icons';
import { $t, loadLocaleMessages } from '@vben/locales'; import { $t, loadLocaleMessages } from '@vben/locales';
import { import {
clearPreferencesCache, clearPreferencesCache,
@ -230,7 +230,7 @@ async function handleReset() {
:title="$t('preferences.title')" :title="$t('preferences.title')"
class="bg-primary flex-col-center h-10 w-10 cursor-pointer rounded-l-lg rounded-r-none border-none" class="bg-primary flex-col-center h-10 w-10 cursor-pointer rounded-l-lg rounded-r-none border-none"
> >
<SwatchBook class="size-5" /> <Settings2 class="size-5" />
</VbenButton> </VbenButton>
</template> </template>
<template #extra> <template #extra>

View File

@ -5,7 +5,7 @@ import { loadLocaleMessages } from '@vben/locales';
import { preferences, updatePreferences } from '@vben/preferences'; import { preferences, updatePreferences } from '@vben/preferences';
import { capitalizeFirstLetter } from '@vben/utils'; import { capitalizeFirstLetter } from '@vben/utils';
import Preferences from './preferences-sheet.vue'; import PreferencesSheet from './preferences-sheet.vue';
/** /**
* preferences 转成 vue props * preferences 转成 vue props
@ -47,5 +47,5 @@ const listen = computed(() => {
}); });
</script> </script>
<template> <template>
<Preferences v-bind="attrs" v-on="listen" /> <PreferencesSheet v-bind="attrs" v-on="listen" />
</template> </template>

View File

@ -9,19 +9,19 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
}); });
// 有需要可以自行打开注释,并创建文件夹 // 有需要可以自行打开注释,并创建文件夹
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
/** 动态路由 */ /** 动态路由 */
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
/** 静态路由列表,访问这些页面可以不需要权限 */ /** 外部路由列表访问这些页面可以不需要Layout可能用于内嵌在别的系统 */
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
const staticRoutes: RouteRecordRaw[] = []; const externalRoutes: RouteRecordRaw[] = [];
/** 路由列表,由基本路由+静态路由组成 */ /** 路由列表,由基本路由+静态路由组成 */
const routes: RouteRecordRaw[] = [ const routes: RouteRecordRaw[] = [
...coreRoutes, ...coreRoutes,
...staticRoutes, ...externalRoutes,
fallbackNotFoundRoute, fallbackNotFoundRoute,
]; ];

View File

@ -41,7 +41,7 @@ function reset() {
<template> <template>
<Page description="用于需要操作标签页的场景" title="标签页"> <Page description="用于需要操作标签页的场景" title="标签页">
<Card class="mb-5" title="打开/关闭标签页"> <Card class="mb-5" title="打开/关闭标签页">
<div class="text-foreground/80 my-3"> <div class="text-foreground/80 mb-3">
如果标签页存在直接跳转切换如果标签页不存在则打开新的标签页 如果标签页存在直接跳转切换如果标签页不存在则打开新的标签页
</div> </div>
<div class="flex flex-wrap gap-3"> <div class="flex flex-wrap gap-3">
@ -53,7 +53,7 @@ function reset() {
</Card> </Card>
<Card class="mb-5" title="标签页操作"> <Card class="mb-5" title="标签页操作">
<div class="text-foreground/80 my-3">用于动态控制标签页的各种操作</div> <div class="text-foreground/80 mb-3">用于动态控制标签页的各种操作</div>
<div class="flex flex-wrap gap-3"> <div class="flex flex-wrap gap-3">
<Button type="primary" @click="closeCurrentTab()"> <Button type="primary" @click="closeCurrentTab()">
关闭当前标签页 关闭当前标签页
@ -73,8 +73,7 @@ function reset() {
</Card> </Card>
<Card class="mb-5" title="动态标题"> <Card class="mb-5" title="动态标题">
<div class="text-lg font-semibold">动态标题</div> <div class="text-foreground/80 mb-3">
<div class="text-foreground/80 my-3">
该操作不会影响页面标题仅修改Tab标题 该操作不会影响页面标题仅修改Tab标题
</div> </div>
<div class="flex flex-wrap items-center gap-3"> <div class="flex flex-wrap items-center gap-3">
@ -91,8 +90,7 @@ function reset() {
</Card> </Card>
<Card class="mb-5" title="最大打开数量"> <Card class="mb-5" title="最大打开数量">
<div class="text-lg font-semibold">最大打开数量</div> <div class="text-foreground/80 mb-3">
<div class="text-foreground/80 my-3">
限制带参数的tab打开的最大数量 `route.meta.maxNumOfOpenTab` 控制 限制带参数的tab打开的最大数量 `route.meta.maxNumOfOpenTab` 控制
</div> </div>
<div class="flex flex-wrap items-center gap-3"> <div class="flex flex-wrap items-center gap-3">