eduadmin-view.ts 8.17 KB
Newer Older
1 2 3 4 5
import { Component, OnInit, OnDestroy, ElementRef, ViewChild, Injectable } from "@angular/core";
import { AppSettings } from "../../app.settings";
import { HelperDataService } from "../../services/helper-data-service";
import { Observable } from "rxjs/Observable";
import { Http, Headers, RequestOptions } from "@angular/http";
6
import { NgRedux, select } from "@angular-redux/store";
7 8 9 10
import { IAppState } from "../../store/store";
import { Router, ActivatedRoute, Params } from "@angular/router";
import { BehaviorSubject, Subscription } from "rxjs/Rx";
import { ILoginInfo } from "../../store/logininfo/logininfo.types";
Open Source Developer's avatar
Open Source Developer committed
11 12 13

import {
    FormBuilder,
14
    FormGroup,
Open Source Developer's avatar
Open Source Developer committed
15 16 17
    FormControl,
    FormArray,
    Validators,
18
} from "@angular/forms";
Open Source Developer's avatar
Open Source Developer committed
19
@Component({
20
    selector: "eduadmin-view",
Open Source Developer's avatar
Open Source Developer committed
21
    template: `
Open Source Developer's avatar
changes  
Open Source Developer committed
22
      <div class = "loading" *ngIf="(showLoader | async) === true"></div>
23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
      <div id="informationfeedback" class="modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
        <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" (click)="hideModal()">Κλείσιμο</button>
                </div>
            </div>
        </div>
      </div>
Open Source Developer's avatar
changes  
Open Source Developer committed
39 40
      <div style="min-height: 500px;">
        <form [formGroup]="formGroup">
41 42 43 44 45
            <p style="margin-top: 20px; line-height: 2em;">Στην παρακάτω λίστα βλέπετε τα σχολεία ευθύνης σας.
            <br/>Επιλέξτε σχολείο για να εμφανιστούν τα τμήματα του σχολείου.</p>
            <div class="row" style="margin-top: 20px; line-height: 2em;"><p><strong>Τα τμήματα</strong></p></div>
            <div *ngFor="let SchoolNames$  of SchoolsPerPerf$  | async; let i=index; let isOdd=odd; let isEven=even" style="font-size: 0.8em; font-weight: bold;">
                <li class="list-group-item isclickable" (click)="setActiveRegion(SchoolNames$.id)"
Open Source Developer's avatar
Open Source Developer committed
46
                     [class.oddout]="isOdd"
47
                    [class.evenout]="isEven" [class.selectedout]="regionActive === SchoolNames$.id" >
Open Source Developer's avatar
Open Source Developer committed
48
                    <div [class.changelistcolor]= "SchoolNames$.status === false" class="col-md-12">{{SchoolNames$.name}}</div>
Open Source Developer's avatar
Open Source Developer committed
49 50 51 52 53
                    <div class = "row" [hidden]="SchoolNames$.id !== regionActive" style="margin: 0px 2px 0px 2px;">
                        <div class="col-md-8">Τμήματα</div>
                        <div class="col-md-2">Επιλεχθέντες</div>
                        <div class="col-md-2">Χωρητικότητα</div>
                    </div> 
54
                    <div class = "row" *ngFor="let CoursesNames$  of CoursesPerPerf$  | async; let j=index; let isOdd2=odd; let isEven2=even"
Open Source Developer's avatar
Open Source Developer committed
55 56
                        [class.oddin]="isOdd2" [class.evenin]="isEven2" [class.changecolor]="calccolor(CoursesNames$.size,CoursesNames$.limitdown)" 
                        [class.changecolorbalck]="calccolor(CoursesNames$.limitdown, CoursesNames$.size)"    
57 58
                        [class.selectedappout]="regionActive === j"
                        [hidden]="SchoolNames$.id !== regionActive" style="margin: 0px 2px 0px 2px;">
Open Source Developer's avatar
Open Source Developer committed
59 60 61
                        <div class="col-md-8">{{CoursesNames$.name}}</div>
                        <div class="col-md-2">{{CoursesNames$.size}}</div>
                        <div class="col-md-2">{{CoursesNames$.capc}}</div>
62 63
                    </div>
                </li>
Open Source Developer's avatar
Open Source Developer committed
64
            </div>
Open Source Developer's avatar
changes  
Open Source Developer committed
65 66
        </form>
     </div>
Open Source Developer's avatar
Open Source Developer committed
67 68 69 70 71 72 73 74 75 76 77 78 79 80 81

   `
})

@Injectable() export default class EduadminView implements OnInit, OnDestroy {

    public formGroup: FormGroup;
    private SchoolsPerPerf$: BehaviorSubject<any>;
    private SchoolPerPerfSub: Subscription;
    private LimitPerCateg$: BehaviorSubject<any>;
    private LimitPerCategSub: Subscription;
    private CoursesPerPerf$: BehaviorSubject<any>;
    private CoursesPerPerfSub: Subscription;
    private StudentsSize$: BehaviorSubject<any>;
    private StudentsSizeSub: Subscription;
Open Source Developer's avatar
changes  
Open Source Developer committed
82
    private showLoader: BehaviorSubject<boolean>;
83
    public perfecture;
Open Source Developer's avatar
Open Source Developer committed
84 85 86
    private regionActive = <number>-1;
    private School$: BehaviorSubject<any>;
    private SchoolSub: Subscription;
87 88 89
    private modalTitle: BehaviorSubject<string>;
    private modalText: BehaviorSubject<string>;
    private modalHeader: BehaviorSubject<string>;
Open Source Developer's avatar
Open Source Developer committed
90 91

    constructor(private fb: FormBuilder,
92 93 94
        private router: Router,
        private _hds: HelperDataService,
    ) {
Open Source Developer's avatar
Open Source Developer committed
95 96 97 98 99
        this.SchoolsPerPerf$ = new BehaviorSubject([{}]);
        this.LimitPerCateg$ = new BehaviorSubject([{}]);
        this.CoursesPerPerf$ = new BehaviorSubject([{}]);
        this.StudentsSize$ = new BehaviorSubject({});
        this.School$ = new BehaviorSubject([{}]);
Open Source Developer's avatar
changes  
Open Source Developer committed
100
        this.showLoader = new BehaviorSubject(false);
Open Source Developer's avatar
Open Source Developer committed
101 102
        this.formGroup = this.fb.group({
        });
103 104 105
        this.modalTitle = new BehaviorSubject("");
        this.modalText = new BehaviorSubject("");
        this.modalHeader = new BehaviorSubject("");
Open Source Developer's avatar
Open Source Developer committed
106 107 108
    }

    ngOnDestroy() {
109
        (<any>$("#informationfeedback")).remove();
110
    }
Open Source Developer's avatar
Open Source Developer committed
111 112

    ngOnInit() {
113
        (<any>$("#informationfeedback")).appendTo("body");
114
        this.showLoader.next(true);
115 116 117 118 119
        this.SchoolPerPerfSub = this._hds.getSchools()
            .subscribe(data => {
                this.SchoolsPerPerf$.next(data);
                this.showLoader.next(false);
            },
120 121 122
            error => {
                this.SchoolsPerPerf$.next([{}]);
                console.log("Error Getting Schools");
123 124 125 126 127
                this.modalHeader.next("modal-header-danger");
                this.modalTitle.next("Αδυναμία άντλησης στοιχείων");
                this.modalText.next("Προέκυψε σφάλμα κατά την άντληση των στοιχείων. Παρακαλώ δοκιμάστε ξανά. Εφόσον το πρόβλημα συνεχίσει να υφίσταται, επικοινωνήστε με την ομάδα υποστήριξης.");
                this.showModal();
                this.showLoader.next(false);
128
            });
Open Source Developer's avatar
Open Source Developer committed
129 130 131

    }

132
    calccolor(size, limit) {
133
        if (size < limit) {
134
            return true;
135
        } else {
136
            return false;
137
        }
Open Source Developer's avatar
changes  
Open Source Developer committed
138
    }
Open Source Developer's avatar
Open Source Developer committed
139

Open Source Developer's avatar
changes  
Open Source Developer committed
140
    setActiveRegion(ind) {
141
        this.CoursesPerPerf$.next([{}]);
142 143 144 145 146 147 148
        if (ind === this.regionActive) {
            ind = -1;
            this.regionActive = ind;
        }
        else {
            this.regionActive = ind;
            this.showLoader.next(true);
149 150 151 152 153
            this.CoursesPerPerfSub = this._hds.getCoursePerPerfecture(this.regionActive)
                .subscribe(data => {
                    this.CoursesPerPerf$.next(data);
                    this.showLoader.next(false);
                },
154 155 156
                error => {
                    this.CoursesPerPerf$.next([{}]);
                    console.log("Error Getting Courses");
157 158 159 160
                    this.modalHeader.next("modal-header-danger");
                    this.modalTitle.next("Αδυναμία άντλησης στοιχείων");
                    this.modalText.next("Προέκυψε σφάλμα κατά την άντληση των στοιχείων. Παρακαλώ δοκιμάστε ξανά. Εφόσον το πρόβλημα συνεχίσει να υφίσταται, επικοινωνήστε με την ομάδα υποστήριξης.");
                    this.showModal();
161 162 163
                    this.showLoader.next(false);
                });
        }
164
    }
Open Source Developer's avatar
Open Source Developer committed
165

166 167
    public showModal(): void {
        (<any>$("#informationfeedback")).modal("show");
Open Source Developer's avatar
Open Source Developer committed
168 169
    }

170 171 172
    public hideModal(): void {
        (<any>$("#informationfeedback")).modal("hide");
    }
Open Source Developer's avatar
Open Source Developer committed
173 174

}