fix: fix content style error when footer is not fixed

pull/48/MERGE
vben 2024-07-06 15:49:21 +08:00
parent 19b57fa4f7
commit 826907f6c3
8 changed files with 13 additions and 11 deletions

View File

@ -43,7 +43,7 @@ jobs:
cache: "pnpm" cache: "pnpm"
- name: Install dependencies - name: Install dependencies
run: pnpm install run: pnpm install --frozen-lockfile
- name: Create Release Pull Request - name: Create Release Pull Request
uses: changesets/action@v1 uses: changesets/action@v1

View File

@ -7,7 +7,7 @@ export const useAppStore = defineStore('app', () => {
const coreTabbarStore = useCoreTabbarStore(); const coreTabbarStore = useCoreTabbarStore();
/** /**
* *
*/ */
async function resetAppState() { async function resetAppState() {
coreStoreAccess.$reset(); coreStoreAccess.$reset();

View File

@ -9,16 +9,16 @@ const defaultPreferences: Preferences = {
colorWeakMode: false, colorWeakMode: false,
compact: false, compact: false,
contentCompact: 'wide', contentCompact: 'wide',
copyright: 'Copyright © 2024 Vben Admin PRO', copyright: 'Copyright © 2024 Vben Admin Pro',
defaultAvatar: defaultAvatar:
'https://cdn.jsdelivr.net/npm/@vbenjs/static-source@0.1.0/source/avatar-v1.webp', 'https://cdn.jsdelivr.net/npm/@vbenjs/static-source@0.1.0/source/avatar-v1.webp',
dynamicTitle: true, dynamicTitle: true,
enablePreferences: true,
isMobile: false, isMobile: false,
layout: 'sidebar-nav', layout: 'sidebar-nav',
locale: 'zh-CN', locale: 'zh-CN',
name: 'Vben Admin Pro', name: 'Vben Admin Pro',
semiDarkMenu: true, semiDarkMenu: true,
showPreference: true,
}, },
breadcrumb: { breadcrumb: {
enable: true, enable: true,
@ -28,8 +28,8 @@ const defaultPreferences: Preferences = {
styleType: 'normal', styleType: 'normal',
}, },
footer: { footer: {
enable: false, enable: true,
fixed: true, fixed: false,
}, },
header: { header: {
enable: true, enable: true,

View File

@ -38,6 +38,8 @@ interface AppPreferences {
defaultAvatar: string; defaultAvatar: string;
// /** 开启动态标题 */ // /** 开启动态标题 */
dynamicTitle: boolean; dynamicTitle: boolean;
/** 是否显示偏好设置 */
enablePreferences: boolean;
/** 是否移动端 */ /** 是否移动端 */
isMobile: boolean; isMobile: boolean;
/** 布局方式 */ /** 布局方式 */
@ -48,8 +50,6 @@ interface AppPreferences {
name: string; name: string;
/** 是否开启半深色菜单只在theme='light'时生效) */ /** 是否开启半深色菜单只在theme='light'时生效) */
semiDarkMenu: boolean; semiDarkMenu: boolean;
/** 是否显示偏好设置 */
showPreference: boolean;
} }
interface BreadcrumbPreferences { interface BreadcrumbPreferences {

View File

@ -307,6 +307,7 @@ const tabbarStyle = computed((): CSSProperties => {
const contentStyle = computed((): CSSProperties => { const contentStyle = computed((): CSSProperties => {
const fixed = headerFixed.value; const fixed = headerFixed.value;
const { footerEnable, footerFixed, footerHeight } = props;
return { return {
marginTop: marginTop:
fixed && fixed &&
@ -315,7 +316,7 @@ const contentStyle = computed((): CSSProperties => {
(!isHeaderAuto.value || scrollY.value < headerWrapperHeight.value) (!isHeaderAuto.value || scrollY.value < headerWrapperHeight.value)
? `${headerWrapperHeight.value}px` ? `${headerWrapperHeight.value}px`
: 0, : 0,
paddingBottom: `${props.footerEnable ? props.footerHeight : 0}px`, paddingBottom: `${footerEnable && footerFixed ? footerHeight : 0}px`,
}; };
}); });

View File

@ -8,7 +8,7 @@ defineProps<DropdownMenuProps>();
</script> </script>
<template> <template>
<VbenDropdownMenu :menus="menus"> <VbenDropdownMenu :menus="menus" :modal="false">
<div <div
class="flex-center hover:bg-accent hover:text-foreground text-muted-foreground border-border h-full cursor-pointer border-l px-2 text-lg font-semibold" class="flex-center hover:bg-accent hover:text-foreground text-muted-foreground border-border h-full cursor-pointer border-l px-2 text-lg font-semibold"
> >

View File

@ -152,7 +152,7 @@ function clearPreferencesAndLogout() {
updatePreferences({ sidebar: { extraCollapse: value } }) updatePreferences({ sidebar: { extraCollapse: value } })
" "
> >
<template v-if="preferences.app.showPreference" #preferences> <template v-if="preferences.app.enablePreferences" #preferences>
<PreferencesWidget <PreferencesWidget
@clear-preferences-and-logout="clearPreferencesAndLogout" @clear-preferences-and-logout="clearPreferencesAndLogout"
/> />

View File

@ -340,6 +340,7 @@ async function handleReset() {
<template #footer> <template #footer>
<VbenButton <VbenButton
:disabled="!diffPreference"
class="mx-4 w-full" class="mx-4 w-full"
size="sm" size="sm"
variant="outline" variant="outline"