application.preview.ts 13.3 KB
Newer Older
1
import { Component, OnInit, OnDestroy } from '@angular/core';
2
import { Router } from '@angular/router';
3
import { BehaviorSubject, Subscription } from 'rxjs/Rx';
4
5
6
7
8
9
import { Injectable } from "@angular/core";
import { NgRedux, select } from 'ng2-redux';
import { IAppState } from '../../store/store';
import { SectorFieldsActions } from '../../actions/sectorfields.actions';
import { SectorCoursesActions } from '../../actions/sectorcourses.actions';
import { RegionSchoolsActions } from '../../actions/regionschools.actions';
Open Source Developer's avatar
Open Source Developer committed
10
import { EpalClassesActions } from '../../actions/epalclass.actions';
11
12
import { ISectorFields } from '../../store/sectorfields/sectorfields.types';
import { ISectors } from '../../store/sectorcourses/sectorcourses.types';
13
import { IRegions, IRegionSchool } from '../../store/regionschools/regionschools.types';
Open Source Developer's avatar
Open Source Developer committed
14
import { IEpalClasses } from '../../store/epalclasses/epalclasses.types';
15
import {AppSettings} from '../../app.settings';
16
17
18
19
import { REGION_SCHOOLS_INITIAL_STATE } from '../../store/regionschools/regionschools.initial-state';
import { EPALCLASSES_INITIAL_STATE } from '../../store/epalclasses/epalclasses.initial-state';
import { SECTOR_COURSES_INITIAL_STATE } from '../../store/sectorcourses/sectorcourses.initial-state';
import { SECTOR_FIELDS_INITIAL_STATE } from '../../store/sectorfields/sectorfields.initial-state';
20
import { IStudentDataFields } from '../../store/studentdatafields/studentdatafields.types';
21
import { STUDENT_DATA_FIELDS_INITIAL_STATE } from '../../store/studentdatafields/studentdatafields.initial-state';
Open Source Developer's avatar
preview    
Open Source Developer committed
22
23
24
import { ICriteria, ICriter } from '../../store/criteria/criteria.types';
import { CRITERIA_INITIAL_STATE } from '../../store/criteria/criteria.initial-state';

25

26
27
28
@Component({
    selector: 'application-preview-select',
    template: `
29
        <div *ngFor="let epalclass$ of epalclasses$ | async;">
30
        <h4 style="margin-top: 20px; line-height: 2em; ">Οι επιλογές μου</h4>
31
32
33
34
        <ul class="list-group left-side-view" style="margin-bottom: 20px;">
                <li class="list-group-item active">
                    Τάξη εισαγωγής
                </li>
Open Source Developer's avatar
trans    
Open Source Developer committed
35
                <li class="list-group-item" *ngIf="epalclass$.name === '1'">
36
                    Α’ Λυκείου
Open Source Developer's avatar
trans    
Open Source Developer committed
37
38
                </li>
                <li class="list-group-item" *ngIf="epalclass$.name === '2'">
39
                    Β’ Λυκείου
Open Source Developer's avatar
trans    
Open Source Developer committed
40
41
                </li>
                <li class="list-group-item" *ngIf="epalclass$.name === '3'">
42
                    Γ’ Λυκείου
Open Source Developer's avatar
Open Source Developer committed
43
                </li>
44

Open Source Developer's avatar
Open Source Developer committed
45
        </ul>
46
        </div>
Open Source Developer's avatar
Open Source Developer committed
47

48
49
50
51
52
53
        <div *ngFor="let sectorField$ of sectorFields$ | async">
        <ul class="list-group left-side-view">
            <li class="list-group-item active" *ngIf="sectorField$.selected === true" >
                {{sectorField$.name}}
            </li>
            </ul>
54
        </div>
55

56
57
58
59
60
    <div *ngFor="let sector$ of sectors$  | async;">
            <ul class="list-group left-side-view" style="margin-bottom: 20px;" *ngIf="sector$.sector_selected === true">
                <li class="list-group-item active" *ngIf="sector$.sector_selected === true" >
                    {{sector$.sector_name }}
                </li>
61
        <div *ngFor="let course$ of sector$.courses;" >
62

63
                <li class="list-group-item" *ngIf="course$.selected === true">
Open Source Developer's avatar
UI    
Open Source Developer committed
64
                    {{course$.course_name   }}
65
                </li>
66
67

        </div>
68
            </ul>
69
        </div>
70

71
72


73
        <ul *ngIf="(regions$ | async).size > 0" class="list-group left-side-view" style="margin-bottom: 20px;">
74

75
                <div *ngFor="let epal$ of selectedSchools$ | async; let i=index; let isOdd=odd; let isEven=even" >
76

77
                <li class="list-group-item" [class.oddout]="isOdd" [class.evenout]="isEven">
78
                    <span class="roundedNumber">{{(i+1)}}</span>&nbsp;&nbsp;{{epal$.epal_name}}
79
80
                </li>
              </div>
81
        </ul>
82

Open Source Developer's avatar
preview    
Open Source Developer committed
83
        <div *ngIf="currentUrl === '/submited-preview'">
84
              <div *ngFor="let studentDataField$ of studentDataFields$ | async;">
85
86
87
88
              <ul class="list-group left-side-view" style="margin-bottom: 20px;">
              <li class="list-group-item active">
                  Στοιχεία μαθητή
              </li>
Open Source Developer's avatar
preview    
Open Source Developer committed
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
              </ul>
              <div><label for="name">Όνομα μαθητή</label> <p class="form-control" id="name" style="border:1px solid #eceeef;">   {{studentDataField$.name}} </p> </div>
              <div><label for="studentsurname">Επώνυμο μαθητή</label> <p class="form-control" id = "studentsurname" style="border:1px solid #eceeef;"> {{studentDataField$.studentsurname}} </p></div>
              <div><label for="fatherfirstname">Όνομα Πατέρα</label> <p class="form-control" id = "fatherfirstname" style="border:1px solid #eceeef;"> {{studentDataField$.fatherfirstname}} </p></div>
              <div><label for="fathersurname">Επώνυμο Πατέρα</label> <p class="form-control" id = "fathersurname" style="border:1px solid #eceeef;"> {{studentDataField$.fathersurname}} </p></div>
              <div><label for="motherfirstname">Όνομα Μητέρας</label> <p class="form-control" id = "motherfirstname" style="border:1px solid #eceeef;"> {{studentDataField$.motherfirstname}} </p></div>
              <div><label for="mothersurname">Επώνυμο Μητέρας</label> <p class="form-control" id = "mothersurname" style="border:1px solid #eceeef;"> {{studentDataField$.mothersurname}} </p></div>
              <div><label for="birthdate">Ημερομηνία Γέννησης</label> <p class="form-control" id = "birthdate" style="border:1px solid #eceeef;"> {{studentDataField$.studentbirthdate}} </p></div>
                      <table>
                              <tr>
                                  <td>
                                      <div class="form-group">
                                          <label for="regionaddress">Διεύθυνση κατοικίας</label><p class="form-control" id = "regionaddress" style="border:1px solid #eceeef;"> {{studentDataField$.regionaddress}} </p>
                                      </div>
                                  </td>
                                  <td>
                                      <div class="form-group">
                                          <label for="regiontk">TK </label><p class="form-control" id = "regiontk" style="border:1px solid #eceeef;"> {{studentDataField$.regiontk}} </p>
                                      </div>
                                  </td>
                                  <td>
                                      <div class="form-group">
                                          <label for="regionarea">Πόλη/Περιοχή</label><p class="form-control" id = "regionarea" style="border:1px solid #eceeef;"> {{studentDataField$.regionarea}} </p>
                                      </div>
                                  </td>
                             </tr>
                      </table>
                      <div><label for="certificatetype">Τύπος απολυτηρίου</label> <p class="form-control" id = "certificatetype" style="border:1px solid #eceeef;"> {{studentDataField$.certificatetype}} </p></div>
                      <div><label for="telnum">Τηλέφωνο επικοινωνίας</label> <p class="form-control" id = "telnum" style="border:1px solid #eceeef;"> {{studentDataField$.telnum}} </p></div>
                      <div><label for="relationtostudent">Η αίτηση γίνεται από</label> <p class="form-control" id = "relationtostudent" style="border:1px solid #eceeef;"> {{studentDataField$.relationtostudent}} </p></div>

                      <ul class="list-group left-side-view" style="margin-bottom: 20px;">
                      <li class="list-group-item active">
                                  <div *ngIf="currentUrl === '/submited-preview'">
                                         Κοινωνικά/Εισοδηματικά Κριτήρια
                                  </div>
                      </li>
                      </ul>
127
128
              </div>

129
            </div>
Open Source Developer's avatar
preview    
Open Source Developer committed
130
131
132
            <div *ngIf="currentUrl === '/submited-preview'">
                  <div *ngFor="let criteriaField$ of criteriaFields$ | async;">
                  <div *ngIf="criteriaField$.selected === true">
133
                        {{criteriaField$.name}}
Open Source Developer's avatar
preview    
Open Source Developer committed
134
135
136
137
                  </div>
                  </div>
             </div>

138
139
140
141
  `
})

@Injectable() export default class ApplicationPreview implements OnInit {
142
143
    private sectors$: BehaviorSubject<ISectors>;
    private regions$: BehaviorSubject<IRegions>;
144
    private selectedSchools$: BehaviorSubject<Array<IRegionSchool>> = new BehaviorSubject(Array());
145
    private sectorFields$: BehaviorSubject<ISectorFields>;
Open Source Developer's avatar
preview    
Open Source Developer committed
146
    private criteriaFields$: BehaviorSubject<ICriter>;
147
148
149
150
151
    private studentDataFields$: BehaviorSubject<IStudentDataFields>;
    private epalclasses$: BehaviorSubject<IEpalClasses>;
    private sectorsSub: Subscription;
    private regionsSub: Subscription;
    private sectorFieldsSub: Subscription;
Open Source Developer's avatar
preview    
Open Source Developer committed
152
    private criteriaFieldsSub: Subscription;
153
    private studentDataFieldsSub: Subscription;
154
155
    private courseActive = "-1";
    private numSelectedSchools = <number>0;
156
157
    private numSelectedOrder = <number>0;
    private classSelected = 0;
Open Source Developer's avatar
preview    
Open Source Developer committed
158
    public currentUrl: string;
159
160

    constructor(private _ngRedux: NgRedux<IAppState>,
161
162
        private router: Router
    ) {
163
164
165

        this.regions$ = new BehaviorSubject(REGION_SCHOOLS_INITIAL_STATE);
        this.epalclasses$ = new BehaviorSubject(EPALCLASSES_INITIAL_STATE);
166

167
168
        this.sectors$ = new BehaviorSubject(SECTOR_COURSES_INITIAL_STATE);
        this.sectorFields$ = new BehaviorSubject(SECTOR_FIELDS_INITIAL_STATE);
Open Source Developer's avatar
preview    
Open Source Developer committed
169
        this.criteriaFields$ = new BehaviorSubject(CRITERIA_INITIAL_STATE);
170
        this.studentDataFields$ = new BehaviorSubject(STUDENT_DATA_FIELDS_INITIAL_STATE);
171
    };
172
173

    ngOnInit() {
Open Source Developer's avatar
preview    
Open Source Developer committed
174
        this.currentUrl = this.router.url;
175
        this.sectorsSub = this._ngRedux.select(state => {
176
177
            state.sectors.reduce((prevSector, sector) => {
                sector.courses.reduce((prevCourse, course) => {
178
179
180
181
                    if (course.selected === true) {
                        this.courseActive = course.course_id;
                    }

182
183
184
185
                    return course;
                }, {});
                return sector;
            }, {});
186
            //this.numSelectedCourses = numsel;
187
            return state.sectors;
188
        }).subscribe(this.sectors$);
189

190
        this.regionsSub = this._ngRedux.select(state => {
191
            let numsel = 0, numsel2 = 0;
192
            let selectedSchools = Array<IRegionSchool>();
193
194
            state.regions.reduce((prevRegion, region) => {
                region.epals.reduce((prevEpal, epal) => {
195
                    if (epal.selected === true) {
196
                        numsel++;
197
                        selectedSchools.push(epal);
198
199
200
201
                    }
                    if (epal.order_id !== 0) {
                        numsel2++;
                    }
202
                    return epal;
203
204
205
206
207
                }, {});
                return region;
            }, {});
            this.numSelectedSchools = numsel;
            this.numSelectedOrder = numsel2;
208
            this.selectedSchools$.next(selectedSchools.sort(this.compareSchools));
209
//            this.selectedSchools$.next(selectedSchools);
210
            return state.regions;
211
        }).subscribe(this.regions$);
212

213
        this.sectorFieldsSub = this._ngRedux.select(state => {
214
            state.sectorFields.reduce(({}, sectorField) => {
215
216
217
                return sectorField;
            }, {});
            return state.sectorFields;
218
        }).subscribe(this.sectorFields$);
219

220
        this.studentDataFieldsSub = this._ngRedux.select(state => {
221
            state.studentDataFields.reduce(({}, studentDataField) => {
222
223
224
                return studentDataField;
            }, {});
            return state.studentDataFields;
225
        }).subscribe(this.studentDataFields$);
226

Open Source Developer's avatar
preview    
Open Source Developer committed
227
228
229
230
231
232
233
234

        this.criteriaFieldsSub = this._ngRedux.select(state => {
            state.criter.reduce(({}, criteriaField) => {
                return criteriaField;
            }, {});
            return state.criter;
        }).subscribe(this.criteriaFields$);

235
        this._ngRedux.select(state => {
236
237
238
239
240
241
            state.epalclasses.reduce(({}, epalclass) => {
                if (epalclass.name === "Α' Λυκείου")
                    this.classSelected = 1;
                else if (epalclass.name === "Β' Λυκείου")
                    this.classSelected = 2;
                else if (epalclass.name === "Γ' Λυκείου")
242
                    this.classSelected = 3;
243
                return epalclass;
Open Source Developer's avatar
Open Source Developer committed
244
245
            }, {});
            return state.epalclasses;
246
        }).subscribe(this.epalclasses$);
Open Source Developer's avatar
Open Source Developer committed
247

248
249
    }

250
251
252
253
254
255
256
257
    compareSchools(a: IRegionSchool,b: IRegionSchool) {
        if (a.order_id < b.order_id)
            return -1;
        if (a.order_id > b.order_id)
            return 1;
        return 0;
    }

258
    ngOnDestroy() {
259
260
261
262
263
264
        if (this.regionsSub)
            this.regionsSub.unsubscribe();
        if (this.sectorsSub)
            this.sectorsSub.unsubscribe();
        if (this.sectorFieldsSub)
            this.sectorFieldsSub.unsubscribe();
265
266
267
268
        this.regions$.unsubscribe();
        this.epalclasses$.unsubscribe();
        this.sectors$.unsubscribe();
        this.sectorFields$.unsubscribe();
269
    }
270

271
}