Browse Source

fix: fix content style error when footer is not fixed

pull/3993/head
vben 2 years ago
parent
commit
826907f6c3
  1. 2
      .github/workflows/changeset-version.yml
  2. 2
      apps/web-antd/src/store/modules/app.ts
  3. 8
      packages/@core/forward/preferences/src/config.ts
  4. 4
      packages/@core/forward/preferences/src/types.ts
  5. 3
      packages/@core/ui-kit/layout-ui/src/vben-layout.vue
  6. 2
      packages/@core/ui-kit/tabs-ui/src/widgets/tool-more.vue
  7. 2
      packages/business/layouts/src/basic/layout.vue
  8. 1
      packages/business/widgets/src/preferences/preferences.vue

2
.github/workflows/changeset-version.yml

@ -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

2
apps/web-antd/src/store/modules/app.ts

@ -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();

8
packages/@core/forward/preferences/src/config.ts

@ -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,

4
packages/@core/forward/preferences/src/types.ts

@ -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 {

3
packages/@core/ui-kit/layout-ui/src/vben-layout.vue

@ -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`,
}; };
}); });

2
packages/@core/ui-kit/tabs-ui/src/widgets/tool-more.vue

@ -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"
> >

2
packages/business/layouts/src/basic/layout.vue

@ -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"
/> />

1
packages/business/widgets/src/preferences/preferences.vue

@ -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"

Loading…
Cancel
Save