框架
Frontend CI/CD / build (web-office) (push) Failing after 7s
Details
Frontend CI/CD / build (web-office) (push) Failing after 7s
Details
This commit is contained in:
parent
201ec0e895
commit
fe47552c5a
|
@ -120,7 +120,6 @@ const sidebarEnableState = computed(() => {
|
|||
*/
|
||||
const sidebarMarginTop = computed(() => {
|
||||
const { headerHeight, isMobile } = props;
|
||||
console.log(props);
|
||||
return (isMixedNav.value && !isMobile) ||
|
||||
currentLayout.value === 'sidebar-topbar'
|
||||
? headerHeight
|
||||
|
@ -245,7 +244,7 @@ const tabbarStyle = computed((): CSSProperties => {
|
|||
let marginLeft = 0;
|
||||
|
||||
// 如果不是混合导航,tabbar 的宽度为 100%
|
||||
if (!isMixedNav.value || props.sidebarHidden) {
|
||||
if ((!isMixedNav.value || props.sidebarHidden) && currentLayout.value !== 'sidebar-topbar') {
|
||||
width = '100%';
|
||||
} else if (sidebarEnable.value ) {
|
||||
// 鼠标在侧边栏上时,且侧边栏展开时的宽度
|
||||
|
@ -448,31 +447,15 @@ function handleHeaderToggle() {
|
|||
|
||||
<template>
|
||||
<div class="relative flex min-h-full w-full">
|
||||
<LayoutSidebar
|
||||
v-if="sidebarEnableState"
|
||||
v-model:collapse="sidebarCollapse"
|
||||
v-model:expand-on-hover="sidebarExpandOnHover"
|
||||
v-model:expand-on-hovering="sidebarExpandOnHovering"
|
||||
v-model:extra-collapse="sidebarExtraCollapse"
|
||||
v-model:extra-visible="sidebarExtraVisible"
|
||||
:collapse-width="getSideCollapseWidth"
|
||||
:dom-visible="!isMobile"
|
||||
:extra-width="sidebarExtraWidth"
|
||||
:fixed-extra="sidebarExpandOnHover"
|
||||
:header-height="isMixedNav ? 0 : headerHeight"
|
||||
:is-sidebar-mixed="isSidebarMixedNav"
|
||||
:margin-top="sidebarMarginTop"
|
||||
:mixed-width="sidebarMixedWidth"
|
||||
:show="showSidebar"
|
||||
:theme="sidebarTheme"
|
||||
:width="getSidebarWidth"
|
||||
:z-index="sidebarZIndex"
|
||||
@leave="() => emit('sideMouseLeave')"
|
||||
>
|
||||
<template
|
||||
v-if="isSideMode && !isMixedNav && currentLayout !== 'sidebar-topbar'"
|
||||
#logo
|
||||
>
|
||||
<LayoutSidebar v-if="sidebarEnableState" v-model:collapse="sidebarCollapse"
|
||||
v-model:expand-on-hover="sidebarExpandOnHover" v-model:expand-on-hovering="sidebarExpandOnHovering"
|
||||
v-model:extra-collapse="sidebarExtraCollapse" v-model:extra-visible="sidebarExtraVisible"
|
||||
:collapse-width="getSideCollapseWidth" :dom-visible="!isMobile" :extra-width="sidebarExtraWidth"
|
||||
:fixed-extra="sidebarExpandOnHover" :header-height="isMixedNav ? 0 : headerHeight"
|
||||
:is-sidebar-mixed="isSidebarMixedNav" :margin-top="sidebarMarginTop" :mixed-width="sidebarMixedWidth"
|
||||
:show="showSidebar" :theme="sidebarTheme" :width="getSidebarWidth" :z-index="sidebarZIndex"
|
||||
@leave="() => emit('sideMouseLeave')">
|
||||
<template v-if="isSideMode && !isMixedNav && currentLayout !== 'sidebar-topbar'" #logo>
|
||||
<slot name="logo"></slot>
|
||||
</template>
|
||||
|
||||
|
@ -491,65 +474,35 @@ function handleHeaderToggle() {
|
|||
</template>
|
||||
</LayoutSidebar>
|
||||
|
||||
<div
|
||||
ref="contentRef"
|
||||
class="flex flex-1 flex-col overflow-hidden transition-all duration-300 ease-in"
|
||||
>
|
||||
<div
|
||||
:class="{
|
||||
<div ref="contentRef" class="flex flex-1 flex-col overflow-hidden transition-all duration-300 ease-in">
|
||||
<div :class="{
|
||||
'shadow-[0_16px_24px_hsl(var(--background))]': scrollY > 20,
|
||||
}"
|
||||
:style="headerWrapperStyle"
|
||||
class="overflow-hidden transition-all duration-200"
|
||||
>
|
||||
<LayoutHeader
|
||||
v-if="headerVisible"
|
||||
:full-width="!isSideMode"
|
||||
:height="headerHeight"
|
||||
:is-mobile="isMobile"
|
||||
:show="!isFullContent && !headerHidden"
|
||||
:sidebar-width="sidebarWidth"
|
||||
:theme="headerTheme"
|
||||
:width="mainStyle.width"
|
||||
:z-index="headerZIndex"
|
||||
>
|
||||
}" :style="headerWrapperStyle" class="overflow-hidden transition-all duration-200">
|
||||
<LayoutHeader v-if="headerVisible" :full-width="!isSideMode" :height="headerHeight" :is-mobile="isMobile"
|
||||
:show="!isFullContent && !headerHidden" :sidebar-width="sidebarWidth" :theme="headerTheme"
|
||||
:width="mainStyle.width" :z-index="headerZIndex">
|
||||
<template v-if="showHeaderLogo" #logo>
|
||||
<slot name="logo"></slot>
|
||||
</template>
|
||||
|
||||
<template #toggle-button>
|
||||
<VbenIconButton
|
||||
v-if="showHeaderToggleButton"
|
||||
class="my-0 ml-2 mr-1 rounded-md"
|
||||
@click="handleHeaderToggle"
|
||||
>
|
||||
<VbenIconButton v-if="showHeaderToggleButton" class="my-0 ml-2 mr-1 rounded-md" @click="handleHeaderToggle">
|
||||
<Menu class="size-4" />
|
||||
</VbenIconButton>
|
||||
</template>
|
||||
<slot name="header"></slot>
|
||||
</LayoutHeader>
|
||||
|
||||
<LayoutTabbar
|
||||
v-if="tabbarEnable"
|
||||
:height="tabbarHeight"
|
||||
:style="tabbarStyle"
|
||||
>
|
||||
<LayoutTabbar v-if="tabbarEnable" :height="tabbarHeight" :style="tabbarStyle">
|
||||
<slot name="tabbar"></slot>
|
||||
</LayoutTabbar>
|
||||
</div>
|
||||
|
||||
<!-- </div> -->
|
||||
<LayoutContent
|
||||
:content-compact="contentCompact"
|
||||
:content-compact-width="contentCompactWidth"
|
||||
:padding="contentPadding"
|
||||
:padding-bottom="contentPaddingBottom"
|
||||
:padding-left="contentPaddingLeft"
|
||||
:padding-right="contentPaddingRight"
|
||||
:padding-top="contentPaddingTop"
|
||||
:style="contentStyle"
|
||||
class="transition-[margin-top] duration-200"
|
||||
>
|
||||
<LayoutContent :content-compact="contentCompact" :content-compact-width="contentCompactWidth"
|
||||
:padding="contentPadding" :padding-bottom="contentPaddingBottom" :padding-left="contentPaddingLeft"
|
||||
:padding-right="contentPaddingRight" :padding-top="contentPaddingTop" :style="contentStyle"
|
||||
class="transition-[margin-top] duration-200">
|
||||
<slot name="content"></slot>
|
||||
|
||||
<template #overlay>
|
||||
|
@ -557,23 +510,14 @@ function handleHeaderToggle() {
|
|||
</template>
|
||||
</LayoutContent>
|
||||
|
||||
<LayoutFooter
|
||||
v-if="footerEnable"
|
||||
:fixed="footerFixed"
|
||||
:height="footerHeight"
|
||||
:show="!isFullContent"
|
||||
:width="footerWidth"
|
||||
:z-index="zIndex"
|
||||
>
|
||||
<LayoutFooter v-if="footerEnable" :fixed="footerFixed" :height="footerHeight" :show="!isFullContent"
|
||||
:width="footerWidth" :z-index="zIndex">
|
||||
<slot name="footer"></slot>
|
||||
</LayoutFooter>
|
||||
</div>
|
||||
<slot name="extra"></slot>
|
||||
<div
|
||||
v-if="maskVisible"
|
||||
:style="maskStyle"
|
||||
<div v-if="maskVisible" :style="maskStyle"
|
||||
class="bg-overlay fixed left-0 top-0 h-full w-full transition-[background-color] duration-200"
|
||||
@click="handleClickMask"
|
||||
></div>
|
||||
@click="handleClickMask"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -26,6 +26,10 @@ interface Props {
|
|||
* @zh_CN Logo 主题
|
||||
*/
|
||||
theme?: string;
|
||||
/**
|
||||
* logo字体颜色
|
||||
*/
|
||||
textClass?: string;
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
|
@ -43,21 +47,10 @@ withDefaults(defineProps<Props>(), {
|
|||
|
||||
<template>
|
||||
<div :class="theme" class="flex h-full items-center text-lg">
|
||||
<a
|
||||
:class="$attrs.class"
|
||||
:href="href"
|
||||
class="flex h-full items-center gap-2 overflow-hidden px-3 text-lg leading-normal transition-all duration-500"
|
||||
>
|
||||
<VbenAvatar
|
||||
v-if="src"
|
||||
:alt="text"
|
||||
:src="src"
|
||||
class="relative w-8 rounded-none bg-transparent"
|
||||
/>
|
||||
<span
|
||||
v-if="!collapsed"
|
||||
class="text-foreground truncate text-nowrap font-semibold"
|
||||
>
|
||||
<a :class="$attrs.class" :href="href"
|
||||
class="flex h-full items-center gap-2 overflow-hidden px-3 text-lg leading-normal transition-all duration-500">
|
||||
<VbenAvatar v-if="src" :alt="text" :src="src" class="relative w-8 rounded-none bg-transparent" />
|
||||
<span v-if="!collapsed" class="text-foreground truncate text-nowrap font-semibold" :class="textClass">
|
||||
{{ text }}
|
||||
</span>
|
||||
</a>
|
||||
|
|
|
@ -21,6 +21,10 @@ interface Props {
|
|||
* 消息列表
|
||||
*/
|
||||
notifications?: NotificationItem[];
|
||||
/**
|
||||
* 图标颜色
|
||||
*/
|
||||
icColor?:string;
|
||||
}
|
||||
|
||||
defineOptions({ name: 'NotificationPopup' });
|
||||
|
@ -70,9 +74,9 @@ function handleClick(item: NotificationItem) {
|
|||
<VbenIconButton class="bell-button text-foreground relative">
|
||||
<span
|
||||
v-if="dot"
|
||||
class="bg-primary absolute right-0.5 top-0.5 h-2 w-2 rounded"
|
||||
class="bg-[#ef4444] absolute right-0.5 top-0.5 h-2 w-2 rounded"
|
||||
></span>
|
||||
<Bell class="size-4" />
|
||||
<Bell class="size-4" :style="{ color: icColor}" />
|
||||
</VbenIconButton>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -53,6 +53,10 @@ interface Props {
|
|||
* 文本
|
||||
*/
|
||||
text?: string;
|
||||
/**
|
||||
* 是否隐藏锁定屏幕
|
||||
*/
|
||||
hideLockLcreen?: boolean
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
|
@ -196,6 +200,7 @@ if (enableShortcutKey.value) {
|
|||
<VbenIcon :icon="menu.icon" class="mr-2 size-4" />
|
||||
{{ menu.text }}
|
||||
</DropdownMenuItem>
|
||||
<template v-if="!hideLockLcreen">
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem
|
||||
v-if="preferences.widget.lockScreen"
|
||||
|
@ -208,6 +213,7 @@ if (enableShortcutKey.value) {
|
|||
{{ altView }} L
|
||||
</DropdownMenuShortcut>
|
||||
</DropdownMenuItem>
|
||||
</template>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem
|
||||
class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
|
||||
|
|
Loading…
Reference in New Issue