updated RegionSchoolsSelect Component with appropriate Modal pop-ups, added...

updated RegionSchoolsSelect Component with appropriate Modal pop-ups, added new chart in school report
parent a811d76e
......@@ -23,7 +23,7 @@ import { API_ENDPOINT } from '../../app.settings';
<div id="emaiSentNotice" (onHidden)="onHidden()" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header {{modalHeader}}" >
<div class="modal-header {{modalHeader | async}}" >
<h3 class="modal-title pull-left"><i class="fa fa-check-square-o"></i>&nbsp;&nbsp;{{ modalTitle | async }}</h3>
<button type="button" class="close pull-right" aria-label="Close" (click)="hideModal()">
<span aria-hidden="true"><i class="fa fa-times"></i></span>
......@@ -54,8 +54,8 @@ import { API_ENDPOINT } from '../../app.settings';
loginInfo$: BehaviorSubject<ILoginInfo>;
private modalTitle: BehaviorSubject<string>;
private modalText: BehaviorSubject<string>;
//public isModalShown: BehaviorSubject<boolean>;
public modalHeader: string;
private modalHeader: BehaviorSubject<string>;
//public modalHeader: string;
loginInfoSub: Subscription;
private numSuccessMails:number;
private numFailMails:number;
......@@ -74,6 +74,7 @@ import { API_ENDPOINT } from '../../app.settings';
//this.isModalShown = new BehaviorSubject(false);
this.modalTitle = new BehaviorSubject("");
this.modalText = new BehaviorSubject("");
this.modalHeader = new BehaviorSubject("");
}
......@@ -140,18 +141,21 @@ import { API_ENDPOINT } from '../../app.settings';
this.modalTitle.next("Κατανομή Μαθητών");
this.modalText.next("Αποτυχία αποστολής e-mails!");
this.modalHeader = "modal-header-warning";
//this.modalHeader = "modal-header-warning";
this.modalHeader.next("modal-header-warning");
this.showModal();
},
() => {
console.log("Success");
this.successSending = 1;
this.modalHeader = "modal-header-success";
//this.modalHeader = "modal-header-success";
this.modalHeader.next("modal-header-success");
this.modalTitle.next("Κατανομή Μαθητών");
let txtModal = "Έγινε αποστολή " + this.numSuccessMails + " e-mails! ";
if (this.numFailMails != 0) {
this.modalHeader = "modal-header-warning";
//this.modalHeader = "modal-header-warning";
this.modalHeader.next("modal-header-warning");
txtModal += "Κάποια e-mail δεν έχουν σταλεί. Δεν ήταν δυνατή η αποστολή " + this.numFailMails + " e-mails!";
}
this.modalText.next(txtModal);
......
......@@ -120,7 +120,7 @@ import { API_ENDPOINT } from '../../app.settings';
<i class="fa fa-download"></i>
<br>Εξαγωγή σε csv
</button>
<button type="button" class="alert alert-info pull-left" (click)="createDiagram()" [hidden]="validCreator != 1 || schSelected == 0 || reportId != 2 ">
<button type="button" class="alert alert-info pull-left" (click)="createDiagram()" [hidden]="validCreator != 1 || schSelected == 0 || (reportId != 2 ) ">
<i class="fa fa-bar-chart"></i>
Διάγραμμα
</button>
......@@ -617,6 +617,35 @@ generateGraphData() {
]);
}
/*
else if (this.reportId === 3) {
let labelsX = [];
labelsX.push("1η Προτίμηση");
labelsX.push("2η Προτίμηση");
labelsX.push("3η Προτίμηση");
labelsX.push("Μη τοποθετημένοι");
console.log("Length:");
console.log(this.data.length);
for (let i = 0; i < this.data.length ; i++) {
this.d3data.push([
//labelsX[i-1],
this.data[i].section,
this.data[i].percentage,
]);
// }
}
}
*/
}
......
......@@ -34,13 +34,34 @@ import {AppSettings} from '../../app.settings';
<div class = "loading" *ngIf="(regions$ | async).size === 0">
</div>
<!-- <div class="row equal">
<!-- <div class="row equal">
<div class="col-md-12"> -->
<div id="choiceSentNotice" (onHidden)="onHidden()" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header {{modalHeader | async}}" >
<h3 class="modal-title pull-left"><i class="fa fa-check-square-o"></i>&nbsp;&nbsp;{{ modalTitle | async }}</h3>
<button type="button" class="close pull-right" aria-label="Close" (click)="hideModal()">
<span aria-hidden="true"><i class="fa fa-times"></i></span>
</button>
</div>
<div class="modal-body">
<p>{{ modalText | async }}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Κλείσιμο</button>
</div>
</div>
</div>
</div>
<h4> Επιλογή Σχολείου</h4>
<form [formGroup]="formGroup">
<div formArrayName="formArray">
<p style="margin-top: 20px; line-height: 2em;"> Παρακαλώ επιλέξτε <strong>τρία </strong> ΕΠΑΛ στα οποία θα ήθελε να φοιτήσει ο μαθητής. Επιλέξτε πρώτα την Περιφερειακή Διεύθυνση που ανήκει το κάθε σχολείο της επιλογής σας, επιλέξτε τα σχολεία και στη συνέχεια επιλέξτε <i>Συνέχεια</i>.
Μπορείτε να επιλέξετε σχολεία που ανήκουν σε περισσότερες απο μια Περιφερειακές Διευθύνσεις. <strong> Προσοχή!</strong> Σε ειδικές περιπτώσεις σχολείων μπορείτε να επιλέξετε και λιγότερα απο τρία σχολεία</p>
Μπορείτε να επιλέξετε σχολεία που ανήκουν σε περισσότερες απο μια Περιφερειακές Διευθύνσεις. <strong> Προσοχή!</strong> Σε ειδικές περιπτώσεις απομακρυσμένων σχολείων, ή
σε περίπτωση που επιλέξετε σχολείο που ανήκει σε Περιφερειακή Διεύθυνση Εκπαίδευσης που διαθέτει λιγότερα από τρία σχολεία, μπορείτε να επιλέξετε και λιγότερα απο τρία σχολεία.</p>
<ul class="list-group main-view">
<div *ngFor="let region$ of regions$ | async; let i=index; let isOdd=odd; let isEven=even" >
<li class="list-group-item isclickable" (click)="setActiveRegion(i)" [class.oddout]="isOdd" [class.evenout]="isEven" [class.selectedout]="regionActive === i">
......@@ -73,11 +94,17 @@ import {AppSettings} from '../../app.settings';
</button>
</div>
<div class="col-md-6">
<!--
<button type="button" class="btn-primary btn-lg pull-right isclickable" style="width: 9em;" (click)="navigateToApplication()"
[disabled] = " ( (selectionLimitOptional | async) === false && (classNight | async) === false && (numSelected | async) < (selectionLimit | async) )
|| ( (numSelected | async) === 0)">
<span style="font-size: 0.9em; font-weight: bold;">Συνέχεια&nbsp;&nbsp;&nbsp;</span><i class="fa fa-forward"></i>
</button>
-->
<button type="button" class="btn-primary btn-lg pull-right isclickable" style="width: 9em;" (click)="navigateToApplication()" >
<span style="font-size: 0.9em; font-weight: bold;">Συνέχεια&nbsp;&nbsp;&nbsp;</span><i class="fa fa-forward"></i>
</button>
</div>
</div>
</form>
......@@ -105,6 +132,11 @@ import {AppSettings} from '../../app.settings';
private regionSizeLimit = <number>3;
private classNight: BehaviorSubject<boolean>;
private modalTitle: BehaviorSubject<string>;
private modalText: BehaviorSubject<string>;
//private modalHeader: string;
private modalHeader: BehaviorSubject<string>;
constructor(private fb: FormBuilder,
private _rsa: RegionSchoolsActions,
......@@ -127,16 +159,25 @@ import {AppSettings} from '../../app.settings';
this.selectionLimitOptional = new BehaviorSubject(false);
this.classNight = new BehaviorSubject(false);
this.modalTitle = new BehaviorSubject("");
this.modalText = new BehaviorSubject("");
this.modalHeader = new BehaviorSubject("");
};
ngOnInit() {
(<any>$('#choiceSentNotice')).appendTo("body");
this.selectEpalClasses();
this.selectRegionSchools();
}
ngOnDestroy() {
(<any>$('#choiceSentNotice')).remove();
if (this.epalclassesSub) {
this.epalclassesSub.unsubscribe();
}
......@@ -155,6 +196,19 @@ import {AppSettings} from '../../app.settings';
if (this.epalclasses$) this.epalclasses$.unsubscribe();
}
public showModal():void {
console.log("about to show modal");
(<any>$('#choiceSentNotice')).modal('show');
}
public hideModal():void {
(<any>$('#choiceSentNotice')).modal('hide');
}
public onHidden():void {
//this.isModalShown.next(false);
}
selectEpalClasses() {
this.epalclassesSub = this._ngRedux.select(state => {
if (state.epalclasses.size > 0) {
......@@ -274,7 +328,26 @@ import {AppSettings} from '../../app.settings';
}
navigateToApplication() {
this.router.navigate(['/schools-order-select']);
//[disabled] = " ( (selectionLimitOptional | async) === false && (classNight | async) === false && (numSelected | async) < (selectionLimit | async) )
// || ( (numSelected | async) === 0)"
if ( (this.selectionLimitOptional.value === false && this.classNight.value === false && this.numSelected.value < this.selectionLimit.value )
|| (this.numSelected.value === 0) ) {
console.log("check Behaviours..");
//this.modalHeader = "modal-header-success";
this.modalHeader.next("modal-header-success");
this.modalTitle.next("Επιλογή αριθμού σχολείων");
if (this.numSelected.value === 0)
this.modalText.next("Δεν έχετε επιλέξει κανένα σχολείο!");
else
this.modalText.next("Παρακαλώ επιλέξτε ΤΡΙΑ σχολεία. "
+ "Μπορείτε να επιλέξετε ή να αφαιρέσετε μια επιλογή, κάνωντας κλικ στο αντίστοιχο κουτάκι που βρίσκεται μπροστά στο όνομα κάθε σχολείου. "
+ "Θα έχετε τη δυνατότητα να καθορίσετε την επιθυμητή σειρά προτίμησής των επιλεγμένων σχολείων στην επόμενη οθόνη.");
this.showModal();
}
else
this.router.navigate(['/schools-order-select']);
}
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment