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

Open Source Developer's avatar
Open Source Developer committed
15 16 17 18

import {
    FormBuilder,
    FormGroup,
19
    FormControl,
Open Source Developer's avatar
Open Source Developer committed
20 21
    FormArray,
    Validators,
22
} from "@angular/forms";
Open Source Developer's avatar
Open Source Developer committed
23
@Component({
24
    selector: "director-classcapacity",
Open Source Developer's avatar
Open Source Developer committed
25
    template: `
Open Source Developer's avatar
Open Source Developer committed
26
    <div class = "loading" *ngIf="(showLoader | async) === true"></div>
27
    <div style="min-height: 500px;">
Open Source Developer's avatar
Open Source Developer committed
28
    <form [formGroup]="formGroup">
29

30

Open Source Developer's avatar
UI  
Open Source Developer committed
31
       <p style="margin-top: 20px; line-height: 2em;"> Στην παρακάτω λίστα βλέπετε τα τμήματα του σχολείου σας με την αντίστοιχη δυναμίκη τους σε αίθουσες. Παρακαλώ για να τροποποποιήσετε τη δυναμικήαυτή κάντε κλικ στον αντίστοιχο σύμβολο,
Open Source Developer's avatar
Open Source Developer committed
32
       επιλέξτε τη νέα δυναμική και πατήστε το σύμβολο <i>ok</i>. Προσοχή! Κανένα τμήμα δεν πρέπει να έχει δυναμική 0.</p>
33
      <div class="row" style="margin-top: 20px; line-height: 2em;" > <b> Οι δηλώσεις σας </b></div>
Open Source Developer's avatar
Open Source Developer committed
34
      <div *ngFor="let CapacityPerCourses$  of CapacityPerCourse$ | async; let i=index; let isOdd=odd; let isEven=even" >
Open Source Developer's avatar
Open Source Developer committed
35
                <li class="list-group-item " [class.oddout]="isOdd" [class.evenout]="isEven" >
Open Source Developer's avatar
Open Source Developer committed
36 37
                <div class="row">
                <div class="col-md-5">
Open Source Developer's avatar
UI  
Open Source Developer committed
38
                   <h5 [class.changelistcolor]= "CapacityPerCourses$.capacity === null" >{{CapacityPerCourses$.taxi}}&nbsp; <b></b></h5>
Open Source Developer's avatar
Open Source Developer committed
39
                 </div>
Open Source Developer's avatar
UI  
Open Source Developer committed
40 41 42 43
                 <div class="col-md-4" col-md-offset-1>
                  <label style="font-weight:bold!important" *ngIf="!isEdit || CapacityPerCourses$.globalindex !== courseActive" > {{CapacityPerCourses$.capacity}} </label>

                   <i *ngIf="!isEdit || CapacityPerCourses$.globalindex !== courseActive" (click)= "modifycapc(i,$event)" class="fa fa-pencil isclickable pull-right" style="font-size: 1.5em;"></i>
44

Open Source Developer's avatar
Open Source Developer committed
45
                   <input *ngIf="isEdit && CapacityPerCourses$.globalindex === courseActive"
Open Source Developer's avatar
Open Source Developer committed
46

47
                     id="{{CapacityPerCourses$.globalindex}}" type="number"
Open Source Developer's avatar
UI  
Open Source Developer committed
48
                   name="{{CapacityPerCourses$.globalindex}}" value ={{CapacityPerCourses$.capacity}}               (change)="handleChange($event)">
Open Source Developer's avatar
Open Source Developer committed
49
                   </div>
50 51

                 <div class="col-md-1">
Open Source Developer's avatar
UI  
Open Source Developer committed
52 53
            <i *ngIf="isEdit && CapacityPerCourses$.globalindex === courseActive" (click)= "isEdit = false" class="fa fa-ban isclickable" style="font-size: 1.5em;"></i>
            </div>
54
            <div class="col-md-2">
Open Source Developer's avatar
Open Source Developer committed
55

Open Source Developer's avatar
Open Source Developer committed
56
            <button *ngIf="isEdit && CapacityPerCourses$.globalindex === courseActive" type="button" class="btn-primary pull-right"
Open Source Developer's avatar
UI  
Open Source Developer committed
57
             (click)="isEdit=false" (click) ="saveCapacity(CapacityPerCourses$.newspecialit, CapacityPerCourses$.newsector, CapacityPerCourses$.class, CapacityPerCourses$.capacity, CapacityPerCourses$.globalindex )">
Open Source Developer's avatar
Open Source Developer committed
58 59 60 61
               <i class="fa fa-check" aria-hidden="true"></i>
             </button>
             </div>
             </div>
Open Source Developer's avatar
Open Source Developer committed
62
                </li>
63
       </div>
64

Open Source Developer's avatar
Open Source Developer committed
65 66
      </form>
    </div>
Open Source Developer's avatar
trans  
Open Source Developer committed
67

Open Source Developer's avatar
pull  
Open Source Developer committed
68
  <div id="checksaved1" (onHidden)="onHidden('#checksaved1')"
Open Source Developer's avatar
Open Source Developer committed
69 70 71 72
    class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="modal-header modal-header-danger">
Open Source Developer's avatar
Open Source Developer committed
73
            <h3 class="modal-title pull-left"><i class="fa fa-check-square-o"></i>&nbsp;&nbsp;Πρέπει να συπληρώσετε σωστά τη δυναμική</h3>
Open Source Developer's avatar
pull  
Open Source Developer committed
74
            <button type="button" class="close pull-right" aria-label="Close" (click)="hideModal('#checksaved1')">
Open Source Developer's avatar
Open Source Developer committed
75 76 77 78
              <span aria-hidden="true"><i class="fa fa-times"></i></span>
            </button>
          </div>
          <div class="modal-body">
Open Source Developer's avatar
Open Source Developer committed
79
            <p>Η αποθήκευση δε μπορεί να γίνει αν δεν συμπληρώσετε έναν αριθμό μεταξυ 1 και 10!</p>
Open Source Developer's avatar
Open Source Developer committed
80 81 82 83 84 85 86 87
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Κλείσιμο</button>
          </div>
        </div>
      </div>
    </div>

Open Source Developer's avatar
Open Source Developer committed
88 89 90
   `
})

91
@Injectable() export default class DirectorClassCapacity implements OnInit, OnDestroy {
Open Source Developer's avatar
Open Source Developer committed
92

93
    private formGroup: FormGroup;
94

Open Source Developer's avatar
Open Source Developer committed
95 96
    private CapacityPerCourse$: BehaviorSubject<any>;
    private CapacityPerCourseSub: Subscription;
Open Source Developer's avatar
trans  
Open Source Developer committed
97
    private saveCapacitySub: Subscription;
98
    private newvalue: number;
Open Source Developer's avatar
Open Source Developer committed
99 100 101
    private isEdit: boolean;
    private courseActive = <number>-1;
    private showLoader: BehaviorSubject<boolean>;
102

103 104 105 106
    constructor(private fb: FormBuilder,
        private _hds: HelperDataService,
        private activatedRoute: ActivatedRoute,
        private router: Router) {
107

Open Source Developer's avatar
Open Source Developer committed
108 109
        this.CapacityPerCourse$ = new BehaviorSubject([{}]);
        this.showLoader = new BehaviorSubject(false);
Open Source Developer's avatar
Open Source Developer committed
110
        this.isEdit = false;
111

112
        this.formGroup = this.fb.group({
113

114
        });
Open Source Developer's avatar
trans  
Open Source Developer committed
115 116 117

    }

118
    public showModal(popupMsgId): void {
119
        (<any>$(popupMsgId)).modal("show");
Open Source Developer's avatar
trans  
Open Source Developer committed
120 121
    }

122
    public hideModal(popupMsgId): void {
123
        (<any>$(popupMsgId)).modal("hide");
Open Source Developer's avatar
trans  
Open Source Developer committed
124 125
    }

126
    public onHidden(popupMsgId): void {
127

Open Source Developer's avatar
Open Source Developer committed
128 129
    }

130
    ngOnDestroy() {
131

Open Source Developer's avatar
Open Source Developer committed
132
    }
133

Open Source Developer's avatar
Open Source Developer committed
134
    ngOnInit() {
135
        (<any>$("#checksaved1")).appendTo("body");
Open Source Developer's avatar
Open Source Developer committed
136

137 138
        this.CapacityPerCourseSub = this._hds.FindCapacityPerSchool().subscribe(x => {
            this.CapacityPerCourse$.next(x);
Open Source Developer's avatar
Open Source Developer committed
139

140 141 142 143 144
        },
            error => {
                this.CapacityPerCourse$.next([{}]);
                console.log("Error Getting Capacity perSchool");
            });
Open Source Developer's avatar
Open Source Developer committed
145 146
    }

147
    handleChange(e: Event) {
148
        this.newvalue = e.target["value"];
Open Source Developer's avatar
Open Source Developer committed
149 150
    }

151 152 153 154 155 156 157 158 159 160 161
    saveCapacity(spec, sect, taxi, oldvalue, ind) {
        if (this.newvalue != null) {
            if (this.newvalue <= 0 || this.newvalue > 10) {
                this.showModal("#checksaved1");
            }
            else {
                this.showLoader.next(true);

                let std = this.CapacityPerCourse$.getValue();
                std[ind].capacity = this.newvalue;
                this.saveCapacitySub = this._hds.saveCapacity(taxi, sect, spec, this.newvalue).subscribe(data => {
Open Source Developer's avatar
Open Source Developer committed
162
                    this.showLoader.next(false);
163
                    this.CapacityPerCourse$.next(std);
Open Source Developer's avatar
trans  
Open Source Developer committed
164
                },
165 166 167 168 169
                    error => {
                        std[ind].capacity = oldvalue;
                        this.CapacityPerCourse$.next(std);
                        this.showLoader.next(false);
                        console.log("Error Saving Capacity");
Open Source Developer's avatar
Open Source Developer committed
170
                    });
171
            }
Open Source Developer's avatar
Open Source Developer committed
172
        }
173 174 175 176 177
        else {
            if (oldvalue === null)
                this.showModal("#checksaved1");
        }
    }
Open Source Developer's avatar
Open Source Developer committed
178

179 180
    setActive(ind) {
        this.courseActive = ind;
Open Source Developer's avatar
Open Source Developer committed
181 182
    }

Open Source Developer's avatar
trans  
Open Source Developer committed
183

184 185 186 187 188 189
    modifycapc(ind, e: Event) {
        this.isEdit = true;
        this.setActive(ind);
        this.handleChange(e);
    }

190
}