Skip to content

Commit

Permalink
TimeTable component complete.
Browse files Browse the repository at this point in the history
  • Loading branch information
@RbkGh
RbkGh committed Mar 20, 2017
1 parent b8ff677 commit 0b36000
Show file tree
Hide file tree
Showing 2 changed files with 195 additions and 107 deletions.
230 changes: 158 additions & 72 deletions src/app/components/main-content/time-table/time-table.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,82 +33,168 @@ <h3>Select Type of TimeTable: Class/Tutor TimeTable.</h3>
</div>
</div>

<div *ngIf="isTutorsTimeTablesVisible">
<div *ngFor="let tutorPersonalTimeTableEntity of tutorPersonalTimeTableDocsList;">
<div class="pull-in panel panel-blue m-t-10">
<div class="panel panel-info">
<div class="panel-heading">
Tutor Name : {{tutorPersonalTimeTableEntity.tutorDoc.firstName + ' '+tutorPersonalTimeTableEntity.tutorDoc.surName}}
<div class="row">
<div class="col-sm-12">

<div *ngIf="isTutorsTimeTablesVisible">
<div *ngFor="let tutorPersonalTimeTableEntity of tutorPersonalTimeTableDocsList;">
<div class="panel panel-blue m-t-10">
<div class="panel panel-info">
<div class="panel-heading">
Tutor Name : {{tutorPersonalTimeTableEntity.tutorDoc.firstName + ' '+tutorPersonalTimeTableEntity.tutorDoc.surName}}
</div>
</div>
</div>

<div>
<div class="table-responsive">
<table class="table color-table primary-table">
<thead>
<tr>
<th>DayName</th>
<th>Period1</th>
<th>Period2</th>
<th>Period3</th>
<th>Period4</th>
<th>Period5</th>
<th>Period6</th>
<th>Period7</th>
<th>Period8</th>
<th>Period9</th>
<th>Period10</th>
</tr>
</thead>

<tr *ngFor="let programmeDay of tutorPersonalTimeTableEntity.programmeDaysList">
<td>
{{programmeDay.dayName}}
</td>
<td>
<div>{{programmeDay.periodList[0].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[0].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[1].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[1].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[2].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[2].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[3].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[3].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[4].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[4].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[5].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[5].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[6].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[6].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[7].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[7].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[8].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[8].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[9].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[9].tutorFullName||'No tutor'}}</div>
</td>

</tr>
</table>
</div>
</div>
</div>
</div>

<div>
<div class="table-responsive">
<table class="table color-table primary-table">
<thead>
<tr>
<th>DayName</th>
<th>Period1</th>
<th>Period2</th>
<th>Period3</th>
<th>Period4</th>
<th>Period5</th>
<th>Period6</th>
<th>Period7</th>
<th>Period8</th>
<th>Period9</th>
<th>Period10</th>
</tr>
</thead>

<tr *ngFor="let programmeDay of tutorPersonalTimeTableEntity.programmeDaysList">
<td>
{{programmeDay.dayName}}
</td>
<td>
<div>{{programmeDay.periodList[0].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[0].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[1].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[1].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[2].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[2].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[3].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[3].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[4].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[4].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[5].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[5].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[6].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[6].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[7].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[7].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[8].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[8].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[9].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[9].tutorFullName||'No tutor'}}</div>
</td>

</tr>
</table>
<div *ngIf="isProgrammeGroupTimeTablesVisible">
<div *ngFor="let programmeGroupPersonalTimeTableEntity of programmeGroupPersonalTimeTableDocsList;">
<div class="panel panel-blue m-t-10">
<div class="panel panel-info">
<div class="panel-heading">
Programme Code : {{programmeGroupPersonalTimeTableEntity.programmeCode}}
</div>
</div>
</div>

<div>
<div class="table-responsive">
<table class="table color-table primary-table">
<thead>
<tr>
<th>DayName</th>
<th>Period1</th>
<th>Period2</th>
<th>Period3</th>
<th>Period4</th>
<th>Period5</th>
<th>Period6</th>
<th>Period7</th>
<th>Period8</th>
<th>Period9</th>
<th>Period10</th>
</tr>
</thead>

<tr *ngFor="let programmeDay of programmeGroupPersonalTimeTableEntity.programmeDaysList">
<td>
{{programmeDay.dayName}}
</td>
<td>
<div>{{programmeDay.periodList[0].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[0].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[1].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[1].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[2].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[2].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[3].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[3].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[4].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[4].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[5].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[5].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[6].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[6].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[7].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[7].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[8].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[8].tutorFullName||'No tutor'}}</div>
</td>
<td>
<div>{{programmeDay.periodList[9].subjectFullName||'No subject'}}</div>
<div>{{programmeDay.periodList[9].tutorFullName||'No tutor'}}</div>
</td>

</tr>
</table>
</div>
</div>
</div>
</div>
</div>
Expand Down
72 changes: 37 additions & 35 deletions src/app/components/main-content/time-table/time-table.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,16 +23,18 @@ export class TimeTableComponent implements OnInit {
@ViewChild('modalGenerateTimeTableDialog')
modalGenerateTimeTableDialog: ModalComponent;
generateTimeTableForm: FormGroup;

formIsValid: boolean = false;
accessingService: boolean = false;
isGenerateButtonWandVisible: boolean = true;
isTutorsTimeTablesVisible: boolean = false;
isProgrammeGroupTimeTablesVisible: boolean = false;

successfullyGeneratedTimeTableMainEntity: TimeTableMainEntity;
programmeGroupPersonalTimeTableDocsList: Array<ProgrammeGroupPersonalTimeTableEntity>;
tutorPersonalTimeTableDocsList: Array<TutorPersonalTimeTableEntity>;

timeTableTypeItems: Array<any>;
timeTableTypeItems: Array<any> = [];

constructor(private timeTableGenerationService: TimeTableGenerationService,
private formBuilder: FormBuilder) {
Expand All @@ -55,58 +57,50 @@ export class TimeTableComponent implements OnInit {
new TimeTableGenerationRequest(timeTableName, timeTableYear);

console.log("TimeTable Generation Request ==>", timeTableGenerationRequest);
this.isGenerateButtonWandVisible = false;

this.successfullyGeneratedTimeTableMainEntity = this.generateFakeDataForTesting();
this.isTutorsTimeTablesVisible = true;
this.timeTableTypeItems = this.getTimeTableTypesItems();
this.modalGenerateTimeTableDialog.dismiss();

// this.timeTableGenerationService.generateTimeTable(timeTableGenerationRequest).subscribe(
// (response: TimeTableMainEntityResponsePayload) => {
// this.accessingService = false;
// console.info("response status = " + response.status);
// if (response.status === 0) {
// this.isGenerateButtonWandVisible = false;//once the response status is 0,we can hide the generate button.
// response.responseObject = this.successfullyGeneratedTimeTableMainEntity;
// this.isTutorsTimeTablesVisible = true;
// this.modalGenerateTimeTableDialog.dismiss();
// swal("Success", "Timetable generated successfuly", "success");
// } else {
// swal("Error", response.message || "Error", "error");
// }
// },
// (error: any) => {
// this.accessingService = false;
// swal("Error", "Something went wrong,Try Again", "error");
// console.log(error);
// }
// );

this.timeTableGenerationService.generateTimeTable(timeTableGenerationRequest).subscribe(
(response: TimeTableMainEntityResponsePayload) => {
this.accessingService = false;
console.info("response status = " + response.status);
if (response.status === 0) {
this.isGenerateButtonWandVisible = false;//once the response status is 0,we can hide the generate button.
response.responseObject = this.successfullyGeneratedTimeTableMainEntity;
this.isTutorsTimeTablesVisible = true;
this.modalGenerateTimeTableDialog.dismiss();
swal("Success", "Timetable generated successfuly", "success");
} else {
swal("Error", response.message || "Error", "error");
}
},
(error: any) => {
this.accessingService = false;
swal("Error", "Something went wrong,Try Again", "error");
console.log(error);
}
);
}

/**
* ID of programmeGroup Type of timetable used in ng-select library
* @type {number}
*/
TIMETABLE_TYPE_PROGRAMMEGROUP: number = 0;
TIMETABLE_TYPE_TUTOR: number = 1;
TIMETABLE_TYPE_PROGRAMMEGROUP: number = 1;
TIMETABLE_TYPE_TUTOR: number = 2;

/**
* ng-select library takes data in the form of {id,text} objects.
*
* @returns {Array<any>}
*/
public getTimeTableTypesItems(): Array<any> {
let timeTableTypes: Array<any> = [];

timeTableTypes.push({
let timeTableTypes: Array<any> = [{
id: this.TIMETABLE_TYPE_PROGRAMMEGROUP,
text: 'Classes/ProgrammeGroups TimeTable'
}, {
id: this.TIMETABLE_TYPE_TUTOR,
text: 'Tutors TimeTable'
});

}];

console.info('TimeTable Type Objects to be populated in dropdown: ', timeTableTypes);
return timeTableTypes;
Expand Down Expand Up @@ -196,11 +190,16 @@ export class TimeTableComponent implements OnInit {
*/
getProgrammeGroupsTimeTables(programmeGroupPersonalTimeTableDocs: Array<ProgrammeGroupPersonalTimeTableEntity>) {
this.programmeGroupPersonalTimeTableDocsList = programmeGroupPersonalTimeTableDocs;
//show programmeGroups timetables and hide tutors timetable.
this.isProgrammeGroupTimeTablesVisible = true;//show programmeGroup timetable
this.isTutorsTimeTablesVisible = false;//hide tutors timetable
}

getTutorsTimeTables(tutorPersonalTimeTableDocs: Array<TutorPersonalTimeTableEntity>) {
this.tutorPersonalTimeTableDocsList = tutorPersonalTimeTableDocs;
//show tutors timetables and hide programeGroups timetables.
this.isTutorsTimeTablesVisible = true;
this.isProgrammeGroupTimeTablesVisible = false;
}

refreshTimeTableTypeData(value: any): void {
Expand All @@ -218,6 +217,7 @@ export class TimeTableComponent implements OnInit {
*/
generateFakeDataForTesting(): TimeTableMainEntity {
let tutorPersonalTimeTableEntities: Array<TutorPersonalTimeTableEntity> = [];
let programmeGroupPersonalTimeTableEntities: Array<ProgrammeGroupPersonalTimeTableEntity> = [];
let tutor: Tutor = new Tutor("", "Ace", "Rbk", "", "", "", "", 0, 0, "", "", "", []);
let programmeDays: Array<ProgrammeDay> = [];
for (let i: number = 0; i < 5; i++) {
Expand All @@ -231,10 +231,12 @@ export class TimeTableComponent implements OnInit {
programmeDays.push(programmeDay);
}
let tutorPersonalTimeTable: TutorPersonalTimeTableEntity = new TutorPersonalTimeTableEntity("", tutor, programmeDays);
let programmeGroupPersonalTimeTable: ProgrammeGroupPersonalTimeTableEntity = new ProgrammeGroupPersonalTimeTableEntity("HELLO", programmeDays);

tutorPersonalTimeTableEntities.push(tutorPersonalTimeTable);
programmeGroupPersonalTimeTableEntities.push(programmeGroupPersonalTimeTable);

let timeTableMainEntity: TimeTableMainEntity = new TimeTableMainEntity(2017, "Term1", tutorPersonalTimeTableEntities, []);
let timeTableMainEntity: TimeTableMainEntity = new TimeTableMainEntity(2017, "Term1", tutorPersonalTimeTableEntities, programmeGroupPersonalTimeTableEntities);

return timeTableMainEntity;
}
Expand Down

0 comments on commit 0b36000

Please sign in to comment.