- Introduced a new `BrandMark` component for branding purposes. - Created a `DashboardPage` component with a responsive layout, including sections for user profile, apartment management, and API demo. - Added styles for the dashboard page to enhance user experience. - Implemented a settings page with theme preferences and session management features. - Developed a sign-in page with branding and user-friendly design. - Established a workspace navigation component for easy access to different sections of the application. - Implemented an `ApartmentService` for managing apartment data with corresponding unit tests. - Created a `ConfigService` for loading application configuration. - Added a `ThemeService` to manage user theme preferences dynamically.
55 lines
1.7 KiB
HTML
55 lines
1.7 KiB
HTML
@if (!isLoggedIn) {
|
|
<app-sign-in-page (loginRequested)="login()" />
|
|
} @else {
|
|
<div class="workspace-shell">
|
|
<app-workspace-navigation
|
|
[activeTab]="activeTab()"
|
|
[username]="username"
|
|
[email]="email"
|
|
[userInitial]="userInitial()"
|
|
(tabSelected)="activeTab.set($event)"
|
|
(logoutRequested)="logout()"
|
|
/>
|
|
|
|
<main class="workspace-main">
|
|
<header class="mobile-header">
|
|
<div class="mobile-brand">
|
|
<app-brand-mark class="brand-mark" />
|
|
<strong>LMNP Organizer</strong>
|
|
</div>
|
|
<div class="compact-avatar">{{ userInitial() }}</div>
|
|
</header>
|
|
|
|
<div class="page-container">
|
|
@if (activeTab() === 'dashboard') {
|
|
<app-dashboard-page
|
|
[username]="username"
|
|
[email]="email"
|
|
[userInitial]="userInitial()"
|
|
[apartmentCount]="apartments().length"
|
|
[helloMessage]="helloMessage()"
|
|
(apartmentsRequested)="activeTab.set('apartments')"
|
|
(connectionCheckRequested)="callHelloApi()"
|
|
/>
|
|
}
|
|
@if (activeTab() === 'apartments') {
|
|
<app-apartments-page
|
|
[apartments]="apartments()"
|
|
(deleteRequested)="deleteApartment($event)"
|
|
(apartmentSaved)="saveApartment($event)"
|
|
/>
|
|
}
|
|
@if (activeTab() === 'settings') {
|
|
<app-settings-page
|
|
[username]="username"
|
|
[email]="email"
|
|
[themePreference]="themePreference()"
|
|
(themePreferenceChanged)="themeService.setPreference($event)"
|
|
(logoutRequested)="logout()"
|
|
/>
|
|
}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
}
|