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

View File

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

View File

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

View File

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

View File

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

View File

@@ -12,7 +12,7 @@ export const VBEN_DOC_URL = 'https://doc.vben.pro';
* @zh_CN Vben Logo
*/
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 首页地址

View File

@@ -1,5 +1,7 @@
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
*/
icon?: string;
icon?: Component | string;
/**
* iframe 地址
*/

View File

@@ -10,7 +10,7 @@ const defaultPreferences: Preferences = {
compact: false,
contentCompact: 'wide',
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,
enableCheckUpdates: true,
enablePreferences: true,
@@ -47,7 +47,7 @@ const defaultPreferences: Preferences = {
},
logo: {
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: {
accordion: true,

View File

@@ -21,39 +21,42 @@ const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[] = [
type: 'pink',
},
{
color: 'hsl(0 75% 42%)',
type: 'rose',
color: 'hsl(42 84% 61%)',
type: 'yellow',
},
{
color: 'hsl(212 100% 45%)',
type: 'sky-blue',
},
{
color: 'hsl(211 91% 39%)',
type: 'deep-blue',
},
{
color: 'hsl(161 90% 43%)',
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%)',
darkPrimaryColor: 'hsl(0 0% 98%)',
primaryColor: 'hsl(240 5.9% 10%)',
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%)',
darkPrimaryColor: 'hsl(0 0% 98%)',

View File

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

View File

@@ -542,15 +542,6 @@ $namespace: vben;
}
& > .#{$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-item {
padding-left: calc(
@@ -713,13 +704,11 @@ $namespace: vben;
.#{$namespace}-menu-item {
fill: var(--menu-item-color);
stroke: var(--menu-item-color);
@include menu-item;
&.is-active {
fill: var(--menu-item-active-color);
stroke: var(--menu-item-active-color);
@include menu-item-active;
}
@@ -783,7 +772,6 @@ $namespace: vben;
list-style: none;
background: var(--menu-submenu-background-color);
fill: var(--menu-item-color);
stroke: var(--menu-item-color);
&.is-active {
div[data-state='open'] > .#{$namespace}-sub-menu-content,
@@ -794,7 +782,6 @@ $namespace: vben;
cursor: pointer;
background: var(--menu-submenu-active-background-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 { Ref } from 'vue';
import type { Component, Ref } from 'vue';
interface MenuProps {
/**
@@ -61,7 +61,7 @@ interface SubMenuProps extends MenuRecordBadgeRaw {
/**
* @zh_CN 图标
*/
icon?: string;
icon?: Component | string;
/**
* @zh_CN submenu 名称
*/
@@ -80,7 +80,7 @@ interface MenuItemProps extends MenuRecordBadgeRaw {
/**
* @zh_CN 图标
*/
icon?: string;
icon?: Component | string;
/**
* @zh_CN menuitem 名称
*/
@@ -93,10 +93,6 @@ interface MenuItemRegistered {
path: string;
}
// export interface MenuItemClicked {
// name: string;
// }
interface MenuItemClicked {
parentPaths: string[];
path: string;

View File

@@ -31,12 +31,6 @@ const hasChildren = computed(() => {
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>
<template>

View File

@@ -13,9 +13,9 @@ interface Props extends BacktopProps {}
defineOptions({ name: 'BackTop' });
const props = withDefaults(defineProps<Props>(), {
bottom: 24,
bottom: 20,
isGroup: false,
right: 40,
right: 24,
target: '',
visibilityHeight: 200,
});
@@ -32,7 +32,7 @@ const { handleClick, visible } = useBackTop(props);
<VbenButton
v-if="visible"
: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"
variant="icon"
@click="handleClick"

View File

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

View File

@@ -33,7 +33,7 @@ const inputClass = computed(() => {
v-model="modelValue"
:class="[props.class, inputClass]"
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
type="text"
v-bind="$attrs"

View File

@@ -108,9 +108,6 @@ function scrollIntoView() {
<div
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 -->
<X
v-show="
@@ -130,9 +127,6 @@ function scrollIntoView() {
<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"
>
<!-- <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
v-if="showIcon"
:icon="tab.icon"