EasyFlow-Tech-Dev/EasyFlow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: 重构并美化整体UI

Browse Source
This commit is contained in:
陈子默
2026-03-07 21:04:54 +08:00
parent 887718d255
commit 6dcc6ce893
14 changed files with 290 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
easyflow-ui-admin/packages/effects/layouts/src/basic/header/header.vue
View File

@@ -1,14 +1,13 @@
<script lang="ts" setup>
import type { CSSProperties } from 'vue';
import type {CSSProperties} from 'vue';
import {computed, useSlots} from 'vue';
import { computed, useSlots } from 'vue';
import {useRefresh} from '@easyflow/hooks';
import {RotateCw} from '@easyflow/icons';
import {preferences, usePreferences} from '@easyflow/preferences';
import {useAccessStore} from '@easyflow/stores';
import { useRefresh } from '@easyflow/hooks';
import { RotateCw } from '@easyflow/icons';
import { preferences, usePreferences } from '@easyflow/preferences';
import { useAccessStore } from '@easyflow/stores';
import { EasyFlowFullScreen, EasyFlowIconButton } from '@easyflow-core/shadcn-ui';
import {EasyFlowFullScreen, EasyFlowIconButton} from '@easyflow-core/shadcn-ui';
import {
GlobalSearch,
@@ -45,17 +44,6 @@ const toolbarButtonStyle: CSSProperties = {
border: '1px solid transparent',
boxShadow: '0 18px 36px -28px hsl(var(--primary) / 0.24)',
};
const breadcrumbShellStyle: CSSProperties = {
backgroundColor: 'hsl(var(--glass-tint) / 0.66)',
backgroundImage:
'linear-gradient(180deg, hsl(var(--glass-tint) / 0.8), hsl(var(--nav-surface-subtle) / 0.58))',
border: '1px solid transparent',
boxShadow:
'inset 0 1px 0 hsl(var(--nav-sheen) / 0.42), 0 18px 36px -30px hsl(var(--primary) / 0.14)',
};
const rightShellStyle: CSSProperties = {
backgroundColor: 'hsl(var(--glass-tint) / 0.28)',
};
const accessStore = useAccessStore();
const { globalSearchShortcutKey, preferencesButtonPosition } = usePreferences();
@@ -144,8 +132,7 @@ function clearPreferencesAndLogout() {
<template>
<div
v-if="$slots.breadcrumb"
:style="breadcrumbShellStyle"
class="hidden min-w-0 max-w-[min(520px,46vw)] items-center rounded-full px-3 py-1.5 lg:flex"
class="hidden min-w-0 max-w-[min(520px,46vw)] items-center px-2 py-1 lg:flex"
>
<slot name="breadcrumb"></slot>
</div>
@@ -164,11 +151,11 @@ function clearPreferencesAndLogout() {
</template>
<div
:class="`menu-align-${preferences.header.menuAlign}`"
class="flex h-full min-w-0 flex-1 items-center px-3"
class="flex h-full min-w-0 flex-1 items-center px-2"
>
<slot name="menu"></slot>
</div>
<div :style="rightShellStyle" class="flex h-full min-w-0 flex-shrink-0 items-center gap-1 rounded-full px-2 py-1 pl-2">
<div class="flex h-full min-w-0 flex-shrink-0 items-center gap-1 px-1 py-1">
<template v-for="slot in rightSlots" :key="slot.name">
<slot :name="slot.name">
<template v-if="slot.name === 'global-search'">