diff --git a/AngularApp/src/app/app.module.ts b/AngularApp/src/app/app.module.ts
index 03932ba451693c3f0911bad4cc4f36f7553cbf02..f332ae98754c4fcedbbe1b730b64deb59cd7e788 100644
--- a/AngularApp/src/app/app.module.ts
+++ b/AngularApp/src/app/app.module.ts
@@ -7,7 +7,8 @@ import { AppRoutingModule } from './app.routing';
import { ComponentsModule } from './components/components.module';
import { AppComponent } from './app.component';
import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.component';
-// import { ExercisePageComponent } from './exercise-page/exercise-page.component';
+import { ExerciseStudentComponent } from './exercise-student/exercise-student.component';
+import { MaterialComponentsModule } from './material-components/material-components.module';
@NgModule({
imports: [
@@ -18,10 +19,12 @@ import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.compon
ComponentsModule,
RouterModule,
AppRoutingModule,
+ MaterialComponentsModule
],
declarations: [
AppComponent,
AdminLayoutComponent,
+ ExerciseStudentComponent,
],
providers: [],
bootstrap: [AppComponent]
diff --git a/AngularApp/src/app/components/sidebar/sidebar.component.ts b/AngularApp/src/app/components/sidebar/sidebar.component.ts
index d5df9ccdda1a13929478e0d90a3e03dcfa9853b8..8a09e04ac01d3baa8ab353ebaa82252675e60f10 100644
--- a/AngularApp/src/app/components/sidebar/sidebar.component.ts
+++ b/AngularApp/src/app/components/sidebar/sidebar.component.ts
@@ -16,6 +16,7 @@ export const ROUTES: RouteInfo[] = [
// { path: '/icons', title: 'Icons', icon:'bubble_chart', class: '' },
// { path: '/maps', title: 'Maps', icon:'location_on', class: '' },
{ path: '/notifications', title: 'Notifications', icon:'notifications', class: '' },
+ { path: '/exercise-student', title: 'Exercise for Student', icon:'unarchive', class: '' },
{ path: '/upgrade', title: 'Upgrade to PRO', icon:'unarchive', class: 'active-pro' },
];
diff --git a/AngularApp/src/app/exercise-student/exercise-student.component.html b/AngularApp/src/app/exercise-student/exercise-student.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..c7eb79c49857f0002e54632f217efac8c2618f50
--- /dev/null
+++ b/AngularApp/src/app/exercise-student/exercise-student.component.html
@@ -0,0 +1,25 @@
+<div class="main-content">
+ <div class="container-fluid">
+ <div class="card">
+ <div class="card-header card-header-danger">
+ <h4 class="card-title ">TCP</h4>
+ <p class="card-category"> Technique de compilation</p>
+ </div>
+ <div class="card-body">
+ <mat-form-field appearance="standard">
+ <mat-label>Filter</mat-label>
+ <input matInput (keyup)="applyFilter($event)" placeholder="Search columns" #input>
+ </mat-form-field>
+ <table mat-table [dataSource]="dataSource" class="table">
+ <ng-container [matColumnDef]="column" *ngFor="let column of displayedColumns">
+ <th mat-header-cell *matHeaderCellDef>{{ column }}</th>
+ <td mat-cell *matCellDef="let emp">{{ emp[column] }}</td>
+ </ng-container>
+
+ <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+ <tr mat-row *matRowDef="let emprow; columns: displayedColumns"></tr>
+ </table>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/AngularApp/src/app/exercise-student/exercise-student.component.scss b/AngularApp/src/app/exercise-student/exercise-student.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/AngularApp/src/app/exercise-student/exercise-student.component.spec.ts b/AngularApp/src/app/exercise-student/exercise-student.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..7346c2b10fdb9873c7f304d96f5399563d14b8b2
--- /dev/null
+++ b/AngularApp/src/app/exercise-student/exercise-student.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ExerciseStudentComponent } from './exercise-student.component';
+
+describe('ExerciseStudentComponent', () => {
+ let component: ExerciseStudentComponent;
+ let fixture: ComponentFixture<ExerciseStudentComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ ExerciseStudentComponent ]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(ExerciseStudentComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/AngularApp/src/app/exercise-student/exercise-student.component.ts b/AngularApp/src/app/exercise-student/exercise-student.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5251f3d743deff73b26f2542bfdb4a6ea22cff9f
--- /dev/null
+++ b/AngularApp/src/app/exercise-student/exercise-student.component.ts
@@ -0,0 +1,108 @@
+import { Component, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table'
+import { Employee, EmpFilter } from '../model/employees'
+
+
+@Component({
+ selector: 'app-exercise-student',
+ templateUrl: './exercise-student.component.html',
+ styleUrls: ['./exercise-student.component.scss']
+})
+
+export class ExerciseStudentComponent implements OnInit {
+
+ constructor() { }
+ displayedColumns: string[] = ['Id', 'FirstName', 'LastName', 'Email','Gender','JobTitle'];
+ genders: string[]=['All','Male','Female'];
+ jobtitles: string[]=['All','Support Analyst','Project Manager','Senior officer','Software Engineer'];
+ departments: string[]=['All','Support','Human Resources','Marketing','Engineering'];
+ empFilters: EmpFilter[]=[];
+ defaultValue = "All";
+ EmpData : Employee[] =[{
+ "Id": 1,
+ "FirstName": "Johannah",
+ "LastName": "Kiffin",
+ "Email": "jkiffin0@google.pl",
+ "Gender": "F",
+ "JobTitle": "Administrative Assistant I"
+ }, {
+ "Id": 2,
+ "FirstName": "Eldin",
+ "LastName": "Astbery",
+ "Email": "eastbery1@geocities.jp",
+ "Gender": "M",
+ "JobTitle": "Senior Editor"
+ }, {
+ "Id": 3,
+ "FirstName": "Nahum",
+ "LastName": "Mounce",
+ "Email": "nmounce2@vk.com",
+ "Gender": "M",
+ "JobTitle": "Programmer II"
+ }, {
+ "Id": 4,
+ "FirstName": "Gallard",
+ "LastName": "Standell",
+ "Email": "gstandell3@europa.eu",
+ "Gender": "M",
+ "JobTitle": "Account Representative II"
+ }, {
+ "Id": 5,
+ "FirstName": "Koenraad",
+ "LastName": "Domleo",
+ "Email": "kdomleo4@cornell.edu",
+ "Gender": "M",
+ "JobTitle": "Quality Control Specialist"
+ }, {
+ "Id": 6,
+ "FirstName": "Uriah",
+ "LastName": "Turbat",
+ "Email": "uturbat5@aol.com",
+ "Gender": "M",
+ "JobTitle": "Accounting Assistant II"
+ }, {
+ "Id": 7,
+ "FirstName": "Waldemar",
+ "LastName": "Fowley",
+ "Email": "wfowley6@sun.com",
+ "Gender": "M",
+ "JobTitle": "Account Coordinator"
+ }, {
+ "Id": 8,
+ "FirstName": "Rodolfo",
+ "LastName": "Trenchard",
+ "Email": "rtrenchard7@yandex.ru",
+ "Gender": "M",
+ "JobTitle": "Data Coordiator"
+ }, {
+ "Id": 9,
+ "FirstName": "Konstance",
+ "LastName": "Dudek",
+ "Email": "kdudek8@techcrunch.com",
+ "Gender": "F",
+ "JobTitle": "Administrative Assistant I"
+ }, {
+ "Id": 10,
+ "FirstName": "Monti",
+ "LastName": "Perton",
+ "Email": "mperton9@youtube.com",
+ "Gender": "M",
+ "JobTitle": "Operator"
+ }];
+
+ dataSource = new MatTableDataSource(this.EmpData);
+
+ applyFilter(event: Event) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+ }
+
+ ngOnInit(): void {
+ this.dataSource.filterPredicate = function (record,filter) {
+ return record.Gender.toLocaleLowerCase() == filter.toLocaleLowerCase();
+ }
+ this.empFilters.push({name:'gender',options:this.genders,defaultValue:this.defaultValue});
+ this.empFilters.push({name:'jobtitle',options:this.jobtitles,defaultValue:this.defaultValue});
+ this.empFilters.push({name:'department',options:this.departments,defaultValue:this.defaultValue});
+ }
+}
diff --git a/AngularApp/src/app/layouts/admin-layout/admin-layout.routing.ts b/AngularApp/src/app/layouts/admin-layout/admin-layout.routing.ts
index a4f97e7f2b5d9f1d71dd78f8547848f8ef643791..f28dadb13f60eed736970b6644ee6b1fb79cc5ea 100644
--- a/AngularApp/src/app/layouts/admin-layout/admin-layout.routing.ts
+++ b/AngularApp/src/app/layouts/admin-layout/admin-layout.routing.ts
@@ -9,6 +9,7 @@ import { MapsComponent } from '../../maps/maps.component';
import { NotificationsComponent } from '../../notifications/notifications.component';
import { UpgradeComponent } from '../../upgrade/upgrade.component';
import { ExercisePageComponent } from '../../exercise-page/exercise-page.component';
+import { ExerciseStudentComponent } from 'app/exercise-student/exercise-student.component';
export const AdminLayoutRoutes: Routes = [
{ path: 'dashboard', component: DashboardComponent },
@@ -19,5 +20,6 @@ export const AdminLayoutRoutes: Routes = [
{ path: 'maps', component: MapsComponent },
{ path: 'notifications', component: NotificationsComponent },
{ path: 'exercise-page', component: ExercisePageComponent },
+ { path: 'exercise-student', component: ExerciseStudentComponent },
{ path: 'upgrade', component: UpgradeComponent },
];
diff --git a/AngularApp/src/app/material-components/material-components.module.ts b/AngularApp/src/app/material-components/material-components.module.ts
new file mode 100644
index 0000000000000000000000000000000000000000..647c67248b2934ab7336dcb7daea24cc43669a65
--- /dev/null
+++ b/AngularApp/src/app/material-components/material-components.module.ts
@@ -0,0 +1,25 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import {MatTableModule} from '@angular/material/table';
+import {MatInputModule} from '@angular/material/input';
+import {MatSelectModule} from '@angular/material/select';
+import {MatCardModule} from '@angular/material/card';
+
+@NgModule({
+ declarations: [],
+ imports: [
+ MatTableModule,
+ CommonModule,
+ MatInputModule,
+ MatSelectModule,
+ MatCardModule
+ ],
+ exports:[
+ MatTableModule,
+ MatInputModule,
+ MatSelectModule,
+ MatCardModule
+ ]
+})
+export class MaterialComponentsModule { }
diff --git a/AngularApp/src/app/model/employees.ts b/AngularApp/src/app/model/employees.ts
new file mode 100644
index 0000000000000000000000000000000000000000..21108866f5d5474d05735196565c00020fc655e0
--- /dev/null
+++ b/AngularApp/src/app/model/employees.ts
@@ -0,0 +1,14 @@
+export interface Employee {
+ Id : number,
+ FirstName:string,
+ LastName:string,
+ Email:string,
+ Gender:string,
+ JobTitle:string
+}
+
+export interface EmpFilter {
+ name:string;
+ options:string[];
+ defaultValue:string;
+}
\ No newline at end of file