by2025/admin-vben5
9
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin into dev

Browse Source
This commit is contained in:
dap 2024-12-28 19:08:49 +08:00
commit 5234f2ef54
12 changed files with 93 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -99,7 +99,7 @@
"node": ">=20.10.0",
"pnpm": ">=9.12.0"
},
"packageManager": "pnpm@9.15.0",
"packageManager": "pnpm@9.15.1",
"pnpm": {
"peerDependencyRules": {
"allowedVersions": {

2
packages/@core/base/typings/src/app.d.ts vendored
View File

@ -38,6 +38,7 @@ type BuiltinThemeType =
type ContentCompactType = 'compact' | 'wide';
type LayoutHeaderModeType = 'auto' | 'auto-scroll' | 'fixed' | 'static';
type LayoutHeaderMenuAlignType = 'center' | 'end' | 'start';
/**
* 登录过期模式
@ -95,6 +96,7 @@ export type {
BreadcrumbStyleType,
BuiltinThemeType,
ContentCompactType,
LayoutHeaderMenuAlignType,
LayoutHeaderModeType,
LayoutType,
LoginExpiredModeType,

1
packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap
View File

@ -46,6 +46,7 @@ exports[`defaultPreferences immutability test > should not modify the config obj
"header": {
"enable": true,
"hidden": false,
"menuAlign": "start",
"mode": "fixed",
},
"logo": {

1
packages/@core/preferences/src/config.ts
View File

@ -46,6 +46,7 @@ const defaultPreferences: Preferences = {
header: {
enable: true,
hidden: false,
menuAlign: 'start',
mode: 'fixed',
},
logo: {

3
packages/@core/preferences/src/types.ts
View File

@ -5,6 +5,7 @@ import type {
BuiltinThemeType,
ContentCompactType,
DeepPartial,
LayoutHeaderMenuAlignType,
LayoutHeaderModeType,
LayoutType,
LoginExpiredModeType,
@ -104,6 +105,8 @@ interface HeaderPreferences {
enable: boolean;
/** 顶栏是否隐藏,css-隐藏 */
hidden: boolean;
/** 顶栏菜单位置 */
menuAlign: LayoutHeaderMenuAlignType;
/** header显示模式 */
mode: LayoutHeaderModeType;
}

5
packages/@core/ui-kit/menu-ui/src/components/menu.vue
View File

@ -332,6 +332,7 @@ function removeMenuItem(item: MenuItemRegistered) {
is(theme, true),
is('rounded', rounded),
is('collapse', collapse),
is('menu-align', mode === 'horizontal'),
]"
:style="menuStyle"
role="menu"
@ -423,6 +424,10 @@ $namespace: vben;
opacity: 1;
}
.is-menu-align {
justify-content: var(--menu-align, start);
}
.#{$namespace}-menu__popup-container,
.#{$namespace}-menu {
--menu-title-width: 140px;

18
packages/effects/layouts/src/basic/header/header.vue
View File

@ -133,7 +133,10 @@ function clearPreferencesAndLogout() {
>
<slot :name="slot.name"></slot>
</template>
<div class="flex h-full min-w-0 flex-1 items-center">
<div
:class="`menu-align-${preferences.header.menuAlign}`"
class="flex h-full min-w-0 flex-1 items-center"
>
<slot name="menu"></slot>
</div>
<div class="flex h-full min-w-0 flex-shrink-0 items-center">
@ -166,3 +169,16 @@ function clearPreferencesAndLogout() {
</template>
</div>
</template>
<style lang="scss" scoped>
.menu-align-start {
--menu-align: start;
}
.menu-align-center {
--menu-align: center;
}
.menu-align-end {
--menu-align: end;
}
</style>

31
packages/effects/layouts/src/widgets/preferences/blocks/layout/header.vue
View File

@ -1,15 +1,22 @@
<script setup lang="ts">
import type { LayoutHeaderModeType, SelectOption } from '@vben/types';
import type {
LayoutHeaderMenuAlignType,
LayoutHeaderModeType,
SelectOption,
} from '@vben/types';
import { $t } from '@vben/locales';
import SelectItem from '../select-item.vue';
import SwitchItem from '../switch-item.vue';
import ToggleItem from '../toggle-item.vue';
defineProps<{ disabled: boolean }>();
const headerEnable = defineModel<boolean>('headerEnable');
const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
const headerMenuAlign =
defineModel<LayoutHeaderMenuAlignType>('headerMenuAlign');
const localeItems: SelectOption[] = [
{
@ -29,6 +36,21 @@ const localeItems: SelectOption[] = [
value: 'auto-scroll',
},
];
const headerMenuAlignItems: SelectOption[] = [
{
label: $t('preferences.header.menuAlignStart'),
value: 'start',
},
{
label: $t('preferences.header.menuAlignCenter'),
value: 'center',
},
{
label: $t('preferences.header.menuAlignEnd'),
value: 'end',
},
];
</script>
<template>
@ -42,4 +64,11 @@ const localeItems: SelectOption[] = [
>
{{ $t('preferences.mode') }}
</SelectItem>
<ToggleItem
v-model="headerMenuAlign"
:disabled="!headerEnable"
:items="headerMenuAlignItems"
>
{{ $t('preferences.header.menuAlign') }}
</ToggleItem>
</template>

4
packages/effects/layouts/src/widgets/preferences/preferences-drawer.vue
View File

@ -4,6 +4,7 @@ import type {
BreadcrumbStyleType,
BuiltinThemeType,
ContentCompactType,
LayoutHeaderMenuAlignType,
LayoutHeaderModeType,
LayoutType,
NavigationStyleType,
@ -94,6 +95,8 @@ const SidebarExpandOnHover = defineModel<boolean>('sidebarExpandOnHover');
const headerEnable = defineModel<boolean>('headerEnable');
const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
const headerMenuAlign =
defineModel<LayoutHeaderMenuAlignType>('headerMenuAlign');
const breadcrumbEnable = defineModel<boolean>('breadcrumbEnable');
const breadcrumbShowIcon = defineModel<boolean>('breadcrumbShowIcon');
@ -317,6 +320,7 @@ async function handleReset() {
<Block :title="$t('preferences.header.title')">
<Header
v-model:header-enable="headerEnable"
v-model:header-menu-align="headerMenuAlign"
v-model:header-mode="headerMode"
:disabled="isFullContent"
/>

6
packages/locales/src/langs/en-US/preferences.json
View File

@ -138,7 +138,11 @@
"modeStatic": "Static",
"modeFixed": "Fixed",
"modeAuto": "Auto hide & Show",
"modeAutoScroll": "Scroll to Hide & Show"
"modeAutoScroll": "Scroll to Hide & Show",
"menuAlign": "Menu Align",
"menuAlignStart": "Start",
"menuAlignEnd": "End",
"menuAlignCenter": "Center"
},
"footer": {
"title": "Footer",

6
packages/locales/src/langs/zh-CN/preferences.json
View File

@ -138,7 +138,11 @@
"modeFixed": "固定",
"modeAuto": "自动隐藏和显示",
"modeAutoScroll": "滚动隐藏和显示",
"visible": "显示顶栏"
"visible": "显示顶栏",
"menuAlign": "菜单位置",
"menuAlignStart": "左侧",
"menuAlignEnd": "右侧",
"menuAlignCenter": "居中"
},
"footer": {
"title": "底栏",

38
pnpm-workspace.yaml
View File

@ -23,20 +23,20 @@ catalog:
'@ctrl/tinycolor': ^4.1.0
'@eslint/js': ^9.17.0
'@faker-js/faker': ^9.3.0
'@iconify/json': ^2.2.286
'@iconify/json': ^2.2.289
'@iconify/tailwind': ^1.2.0
'@iconify/vue': ^4.2.0
'@intlify/core-base': ^10.0.5
'@intlify/unplugin-vue-i18n': ^6.0.1
'@intlify/unplugin-vue-i18n': ^6.0.2
'@jspm/generator': ^2.4.1
'@manypkg/get-packages': ^2.2.2
'@nolebase/vitepress-plugin-git-changelog': ^2.11.1
'@nolebase/vitepress-plugin-git-changelog': ^2.12.0
'@playwright/test': ^1.49.1
'@pnpm/workspace.read-manifest': ^1000.0.1
'@stylistic/stylelint-plugin': ^3.1.1
'@tailwindcss/nesting': 0.0.0-insiders.565cd3e
'@tailwindcss/typography': ^0.5.15
'@tanstack/vue-query': ^5.62.8
'@tanstack/vue-query': ^5.62.9
'@tanstack/vue-store': ^0.6.0
'@types/archiver': ^6.0.3
'@types/eslint': ^9.6.1
@ -51,29 +51,29 @@ catalog:
'@types/qrcode': ^1.5.5
'@types/sortablejs': ^1.15.8
'@typescript-eslint/eslint-plugin': ^8.18.1
'@typescript-eslint/parser': ^8.18.1
'@vee-validate/zod': ^4.14.7
'@typescript-eslint/parser': ^8.18.2
'@vee-validate/zod': ^4.15.0
'@vite-pwa/vitepress': ^0.5.3
'@vitejs/plugin-vue': ^5.2.1
'@vitejs/plugin-vue-jsx': ^4.1.1
'@vue/reactivity': ^3.5.13
'@vue/shared': ^3.5.13
'@vue/test-utils': ^2.4.6
'@vueuse/core': ^12.0.0
'@vueuse/integrations': ^12.0.0
'@vueuse/core': ^12.2.0
'@vueuse/integrations': ^12.2.0
ant-design-vue: ^4.2.6
archiver: ^7.0.1
autoprefixer: ^10.4.20
axios: ^1.7.9
axios-mock-adapter: ^2.1.0
cac: ^6.7.14
chalk: ^5.4.0
chalk: ^5.4.1
cheerio: 1.0.0
circular-dependency-scanner: ^2.3.0
class-variance-authority: ^0.7.1
clsx: ^2.1.1
commitlint-plugin-function-rules: ^4.0.1
consola: ^3.3.0
consola: ^3.3.3
cross-env: ^7.0.3
cspell: ^8.17.1
cssnano: ^7.0.6
@ -83,7 +83,7 @@ catalog:
defu: ^6.1.4
depcheck: ^1.4.7
dotenv: ^16.4.7
echarts: ^5.5.1
echarts: ^5.6.0
element-plus: ^2.9.1
eslint: ^9.17.0
eslint-config-turbo: ^2.3.3
@ -124,13 +124,13 @@ catalog:
ora: ^8.1.1
pinia: 2.2.2
pinia-plugin-persistedstate: ^4.2.0
pkg-types: ^1.2.1
pkg-types: ^1.3.0
playwright: ^1.49.1
postcss: ^8.4.49
postcss-antd-fixes: ^0.2.0
postcss-html: ^1.7.0
postcss-import: ^16.1.0
postcss-preset-env: ^10.1.2
postcss-preset-env: ^10.1.3
postcss-scss: ^4.0.9
prettier: ^3.4.2
prettier-plugin-tailwindcss: ^0.6.9
@ -139,8 +139,8 @@ catalog:
radix-vue: ^1.9.11
resolve.exports: ^2.0.3
rimraf: ^6.0.1
rollup: ^4.28.1
rollup-plugin-visualizer: ^5.12.0
rollup: ^4.29.1
rollup-plugin-visualizer: ^5.13.1
sass: 1.80.6
sortablejs: ^1.15.6
stylelint: ^16.12.0
@ -152,16 +152,16 @@ catalog:
stylelint-order: ^6.0.4
stylelint-prettier: ^5.0.2
stylelint-scss: ^6.10.0
tailwind-merge: ^2.5.5
tailwind-merge: ^2.6.0
tailwindcss: ^3.4.17
tailwindcss-animate: ^1.0.7
theme-colors: ^0.1.0
turbo: ^2.3.3
typescript: 5.6.3
unbuild: ^3.0.1
unbuild: ^3.1.0
unplugin-element-plus: ^0.8.0
vee-validate: ^4.14.7
vite: ^6.0.5
vee-validate: ^4.15.0
vite: ^6.0.6
vite-plugin-compression: ^0.5.1
vite-plugin-dts: 4.2.1
vite-plugin-html: ^3.2.2