application.preview.ts 13.6 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
45
46
                <li class="list-group-item" *ngIf="epalclass$.name === '4'">
                    Δ’ Λυκείου
                </li>
47

Open Source Developer's avatar
Open Source Developer committed
48
        </ul>
49
        </div>
Open Source Developer's avatar
Open Source Developer committed
50

51
52
53
54
55
56
        <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>
57
        </div>
58

59
60
61
62
63
    <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>
64
        <div *ngFor="let course$ of sector$.courses;" >
65

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

        </div>
71
            </ul>
72
        </div>
73

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

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

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

Open Source Developer's avatar
Open Source Developer committed
84
        <div *ngIf="currentUrl === '/application-submit'">
85
              <div *ngFor="let studentDataField$ of studentDataFields$ | async;">
86
87
88
89
              <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
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
              </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">
Open Source Developer's avatar
Open Source Developer committed
123
                                  <div *ngIf="currentUrl === '/application-submit'">
Open Source Developer's avatar
preview    
Open Source Developer committed
124
125
126
127
                                         Κοινωνικά/Εισοδηματικά Κριτήρια
                                  </div>
                      </li>
                      </ul>
128
129
              </div>

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

139
140
141
142
  `
})

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

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

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

168
169
        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
170
        this.criteriaFields$ = new BehaviorSubject(CRITERIA_INITIAL_STATE);
171
        this.studentDataFields$ = new BehaviorSubject(STUDENT_DATA_FIELDS_INITIAL_STATE);
172
    };
173
174

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

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

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

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

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

Open Source Developer's avatar
preview    
Open Source Developer committed
229
230
231
232
233
234
235
236

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

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

252
253
    }

254
255
256
257
258
259
260
261
    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;
    }

262
    ngOnDestroy() {
263
264
265
266
267
268
        if (this.regionsSub)
            this.regionsSub.unsubscribe();
        if (this.sectorsSub)
            this.sectorsSub.unsubscribe();
        if (this.sectorFieldsSub)
            this.sectorFieldsSub.unsubscribe();
269
270
271
272
        this.regions$.unsubscribe();
        this.epalclasses$.unsubscribe();
        this.sectors$.unsubscribe();
        this.sectorFields$.unsubscribe();
273
    }
274

275
}