Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
routes working
  • Loading branch information
daros10 committed Mar 11, 2020
commit 47ee4f375e1daa4a2457d75e6e6dfa3f30e82f6b
17 changes: 15 additions & 2 deletions src/app/app-routing.module.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,24 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { GettingStartedComponent } from './components/optionsSidebar/getting-started/getting-started.component';
import { ReportsComponent } from './components/optionsSidebar/reports/reports.component';
import { TimeClockComponent } from './components/optionsSidebar/time-clock/time-clock.component';
import { TimeEntriesComponent } from './components/optionsSidebar/time-entries/time-entries.component';
import { TimeOffComponent } from './components/optionsSidebar/time-off/time-off.component';


const routes: Routes = [];
const routes: Routes = [
{path: 'gettingStarted', component: GettingStartedComponent},
{path: 'reports', component: ReportsComponent},
{path: 'timeClock', component: TimeClockComponent},
{path: 'timeEntries', component: TimeEntriesComponent},
{path: 'timeOff', component: TimeOffComponent},
{path: '', pathMatch: 'full', redirectTo: 'gettingStarted'},
{path: '**', pathMatch: 'full', redirectTo: 'gettingStarted'},
];

@NgModule({
imports: [RouterModule.forRoot(routes)],
imports: [RouterModule.forRoot(routes, { useHash: true })],
exports: [RouterModule]
})
export class AppRoutingModule { }
4 changes: 3 additions & 1 deletion src/app/app.component.html
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
<app-navbar></app-navbar>

<app-sidebar></app-sidebar>
<app-sidebar>
<router-outlet></router-outlet>
</app-sidebar>
12 changes: 0 additions & 12 deletions src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,6 @@ import { NavbarComponent } from './components/shared/navbar/navbar.component';
import { UserComponent } from './components/shared/user/user.component';
import { SidebarComponent } from './components/shared/sidebar/sidebar.component';
import { ClockComponent } from './components/shared/clock/clock.component';
import { OptionsSidebarComponent } from './components/options-sidebar/options-sidebar.component';
import { GettingStartedComponent } from './components/optionsSidebar/getting-started/getting-started.component';
import { TimeClockComponent } from './components/optionsSidebar/time-clock/time-clock.component';
import { TimeEntriesComponent } from './components/optionsSidebar/time-entries/time-entries.component';
import { TimeOffComponent } from './components/optionsSidebar/time-off/time-off.component';
import { ReportsComponent } from './components/optionsSidebar/reports/reports.component';

@NgModule({
declarations: [
Expand All @@ -21,12 +15,6 @@ import { ReportsComponent } from './components/optionsSidebar/reports/reports.co
UserComponent,
SidebarComponent,
ClockComponent,
OptionsSidebarComponent,
GettingStartedComponent,
TimeClockComponent,
TimeEntriesComponent,
TimeOffComponent,
ReportsComponent,
],
imports: [
BrowserModule,
Expand Down
18 changes: 6 additions & 12 deletions src/app/components/shared/sidebar/sidebar.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,24 +3,18 @@
<!-- Sidebar -->
<div class="bg-light border-right" id="sidebar-wrapper">
<div class="list-group list-group-flush">
<a href="#" class="list-group-item list-group-item-action bg-light"><i class="fas fa-flag"></i> Getting Started</a>
<a href="#" class="list-group-item list-group-item-action bg-light"><i class="far fa-clock"></i> Time Clock</a>
<a href="#" class="list-group-item list-group-item-action bg-light"><i class="far fa-list-alt"></i> Time Entries</a>
<a href="#" class="list-group-item list-group-item-action bg-light"><i class="far fa-paper-plane"></i> Time Off</a>
<a href="#" class="list-group-item list-group-item-action bg-light"><i class="fas fa-chart-pie"></i> Reports</a>
<a [routerLink]="['/gettingStarted']" routerLinkActive="dark" class="list-group-item list-group-item-action bg-light"><i class="fas fa-flag"></i> Getting Started</a>
<a [routerLink]="['/timeClock']" routerLinkActive="dark" class="list-group-item list-group-item-action bg-light"><i class="far fa-clock"></i> Time Clock</a>
<a [routerLink]="['/timeEntries']" routerLinkActive="dark" class="list-group-item list-group-item-action bg-light"><i class="far fa-list-alt"></i> Time Entries</a>
<a [routerLink]="['/timeOff']" routerLinkActive="dark" class="list-group-item list-group-item-action bg-light"><i class="far fa-paper-plane"></i> Time Off</a>
<a [routerLink]="['/reports']" routerLinkActive="dark" class="list-group-item list-group-item-action bg-light"><i class="fas fa-chart-pie"></i> Reports</a>

</div>
</div>
<!-- /#sidebar-wrapper -->

<!-- Page Content -->
<div id="page-content-wrapper">
<div class="container-fluid">
<h1 class="mt-4">Simple Sidebar</h1>
<p>The starting state of the menu will appear collapsed on smaller screens, and will appear non-collapsed on larger screens. When toggled using the button below, the menu will change.</p>
<p>Make sure to keep all page content within the <code>#page-content-wrapper</code>. The top navbar is optional, and just for demonstration. Just create an element with the <code>#menu-toggle</code> ID which will toggle the menu when clicked.</p>
</div>
</div>
<router-outlet></router-outlet>
<!-- /#page-content-wrapper -->

</div>
Expand Down