s.esmaeiliandClaude Sonnet 5
a6d8993d01
- VerticalNavMenu.vue now renders the icon: values that navMenuItems.ts already carried on 33 nodes but were never displayed, via the shared resolveIcon() map. Sub-menus and leaf items get a #icon slot each; ADV4's Menu shows icons only (labels hidden) once :inline-collapsed is true, which is now wired to the collapsed prop. - Fixed openKeys: it previously started at [] and was only ever updated by user clicks, so a direct link or page refresh landed with the active item's parent submenu collapsed. It's now derived from the current route on load and on every navigation. - Sidebar collapse state moves from a local ref in Main.vue to stores/layout.ts's existing (previously unused) sidebarCollapsed, persisted to localStorage so it survives a reload. Verified: pnpm build passes. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
59 lines
2.1 KiB
TypeScript
59 lines
2.1 KiB
TypeScript
// Pinia replacement for the parts of legacy henza_admin/src/store/state.js +
|
|
// mutations.js that the app shell actually uses: window width, scroll position,
|
|
// and the active theme. The Vuexy customizer state (sidebar width, theme tour,
|
|
// footer type, ...) is carried in themeConfig.ts instead, as in legacy.
|
|
import { defineStore } from 'pinia';
|
|
import themeConfig, { type ThemeMode } from '../themeConfig';
|
|
|
|
const SIDEBAR_COLLAPSED_KEY = 'admin-panel:sidebarCollapsed';
|
|
|
|
/** Reads the persisted collapse state, falling back to themeConfig's default
|
|
* when localStorage is unavailable or has never been set. */
|
|
function readPersistedCollapsed(): boolean {
|
|
if (typeof window === 'undefined') return themeConfig.sidebarCollapsed;
|
|
try {
|
|
const raw = window.localStorage.getItem(SIDEBAR_COLLAPSED_KEY);
|
|
return raw === null ? themeConfig.sidebarCollapsed : raw === '1';
|
|
} catch {
|
|
return themeConfig.sidebarCollapsed;
|
|
}
|
|
}
|
|
|
|
export const useLayoutStore = defineStore('layout', {
|
|
state: () => ({
|
|
windowWidth: typeof window !== 'undefined' ? window.innerWidth : 0,
|
|
scrollY: 0,
|
|
theme: themeConfig.theme as ThemeMode,
|
|
// legacy state.js: sidebar visibility for the vertical nav menu
|
|
isSidebarActive: true,
|
|
sidebarCollapsed: readPersistedCollapsed(),
|
|
}),
|
|
getters: {
|
|
// legacy used breakpoints of 1200 (theme tour) and 992 (nav menu collapse)
|
|
isSmallScreen: (s) => s.windowWidth < 992,
|
|
},
|
|
actions: {
|
|
// legacy mutation: UPDATE_WINDOW_WIDTH
|
|
updateWindowWidth(width: number) {
|
|
this.windowWidth = width;
|
|
},
|
|
// legacy mutation: UPDATE_WINDOW_SCROLL_Y
|
|
updateWindowScrollY(y: number) {
|
|
this.scrollY = y;
|
|
},
|
|
toggleSidebar(value?: boolean) {
|
|
this.isSidebarActive = value ?? !this.isSidebarActive;
|
|
},
|
|
setSidebarCollapsed(value: boolean) {
|
|
this.sidebarCollapsed = value;
|
|
if (typeof window === 'undefined') return;
|
|
try {
|
|
window.localStorage.setItem(SIDEBAR_COLLAPSED_KEY, value ? '1' : '0');
|
|
} catch {
|
|
// localStorage unavailable (private mode, disabled site data, ...) —
|
|
// collapse state just won't persist across reloads.
|
|
}
|
|
},
|
|
},
|
|
});
|