Merge branch 'develop' of https://github.com/ita-social-projects/OoS-…

…Frontend into develop

src/app/shared/models/application.model.ts

@@ -0,0 +1,20 @@
+import { Child } from "./child.model";
+import { Workshop } from "./workshop.model";
+
+export class Application {
+  id: number;
+  status: string;
+  message: string;
+  date: Date;
+  workshop: Workshop;
+  child: Child;
+
+  constructor(info) {
+    this.id = null;
+    this.status = info.status;
+    this.message = info.message;
+    this.date = info.date;
+    this.child = info.child;
+    this.workshop = info.workshop;
+  }
+}

src/app/shared/models/workshop.model.ts

@@ -38,7 +38,7 @@ export class Workshop {
   rate: string;
   votes: string;
 
-  constructor(about, description, address, teachers) {
+  constructor(about, description, addr, tchrs) {
     this.title = about.title;
     //this.image = about.image;
     this.phone = about.phone;
@@ -49,13 +49,13 @@ export class Workshop {
     this.head = description.head;
     this.daysPerWeek = about.daysPerWeek;
     this.description = description.description;
-    this.address = address;
-    this.teachers = teachers;
+    this.address = addr;
+    this.teachers = tchrs;
     this.website = about.website;
     this.facebook = about.facebook;
     this.instagram = about.instagram;
     this.withDisabilityOptions = description.withDisabilityOptions;
     this.disabilityOptionsDesc = description.disabilityOptionsDesc;
-    this.category = description.category;
+    //this.category = description.category;
   }
 }

src/app/shared/pipes/application-filter.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { ApplicationFilterPipe } from "./application-filter.pipe";
+
+describe('ApplicationFilterPipe', () => {
+  it('create an instance', () => {
+    const pipe = new ApplicationFilterPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/shared/pipes/application-filter.pipe.ts

@@ -0,0 +1,14 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Application } from '../models/application.model';
+
+@Pipe({
+  name: 'applicationFilter',
+  pure: false
+})
+export class ApplicationFilterPipe implements PipeTransform {
+
+  transform(array: Application[], status: string): Application[] {
+    return array.filter(card => card.status === status);
+  }
+
+}

src/app/shared/pipes/application-sort.pipe.spec.ts

@@ -0,0 +1,9 @@
+import { ApplicationSortPipe } from "./application-sort.pipe";
+
+
+describe('ApplicationSortPipe', () => {
+  it('create an instance', () => {
+    const pipe = new ApplicationSortPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/shared/pipes/application-sort.pipe.ts

@@ -0,0 +1,28 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Application } from '../models/application.model';
+
+@Pipe({
+  name: 'applicationSort',
+  pure: false
+})
+export class ApplicationSortPipe implements PipeTransform {
+  transform(array: Application[], status?: string, date?: string): Application[] {
+
+    return array.sort((a, b) => {
+      // firstly sort according to the property status 'new'
+      if (a.status === 'new' && b.status !== 'new')
+        return -1;
+
+      if (a.status !== 'new' && b.status === 'new')
+        return 1;
+
+      // if both objects has the same status sort according to the title
+      if (a.status === 'new' && b.status === 'new')
+        return (a.date < b.date) ? -1 : 1;
+
+      //the rest sorts according to the last date
+      return (a.date < b.date) ? -1 : 1;
+    });
+  }
+
+}

src/app/shared/services/applications/applications.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ApplicationsService } from './applications.service';
+
+describe('Applications', () => {
+  let service: ApplicationsService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(ApplicationsService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/shared/services/applications/applications.service.ts

@@ -0,0 +1,19 @@
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { Application } from '../../models/application.model';
+import { HttpClient } from '@angular/common/http';
+@Injectable({
+  providedIn: 'root'
+})
+
+export class ApplicationsService {
+
+  dataUrl = '/assets/mock-applications.json';
+
+  constructor(private http: HttpClient) {
+  }
+
+  getApplications(): Observable<Application[]> {
+    return this.http.get<Application[]>(this.dataUrl);
+  }
+}

src/app/shared/services/provider-activities/provider-activities.service.ts

@@ -1,7 +1,7 @@
 import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
-import { actCard } from '../../models/activities-card.model';
+import { Workshop } from '../../models/workshop.model';
 
 @Injectable({
   providedIn: 'root'
@@ -10,11 +10,11 @@ export class ProviderActivitiesService {
 
   constructor(private http: HttpClient) { }
 
-  getCards(): Observable<actCard[]> {
-    return this.http.get<actCard[]>('/Workshop/Get')
+  getCards(): Observable<Workshop[]> {
+    return this.http.get<Workshop[]>('/Workshop/Get');
   }
 
-  createWorkshop( workshop ): void {
+  createWorkshop(workshop): void {
     this.http.post('/Workshop/Create', workshop).subscribe(workshop => console.log(workshop));
   }
 }

src/app/shared/shared.module.ts

@@ -19,7 +19,8 @@ import { HobbySelectComponent } from './components/hobby-select/hobby-select.com
 import { CityAutocompleteComponent } from './components/city-autocomplete/city-autocomplete.component';
 import { MinMaxDirective } from './directives/min-max.directive';
 import { ImageFormControlComponent } from './components/image-form-control/image-form-control.component';
-
+import { ApplicationFilterPipe } from './pipes/application-filter.pipe';
+import { ApplicationSortPipe } from './pipes/application-sort.pipe';
 @NgModule({
   declarations: [
     FiltersListComponent,
@@ -36,7 +37,9 @@ import { ImageFormControlComponent } from './components/image-form-control/image
     TeacherFormComponent,
     CityAutocompleteComponent,
     MinMaxDirective,
-    ImageFormControlComponent
+    ImageFormControlComponent,
+    ApplicationFilterPipe,
+    ApplicationSortPipe
   ],
   imports: [
     MaterialModule,
@@ -60,7 +63,9 @@ import { ImageFormControlComponent } from './components/image-form-control/image
     CreateTeacherComponent,
     CityAutocompleteComponent,
     MinMaxDirective,
-    ImageFormControlComponent
+    ImageFormControlComponent,
+    ApplicationFilterPipe,
+    ApplicationSortPipe
   ]
 })
 export class SharedModule { }

src/app/shared/store/provider.actions.ts

@@ -1,17 +1,21 @@
 import { FormArray, FormGroup } from "@angular/forms";
 export class GetActivitiesCards {
   static readonly type = '[provider] gets activities cards';
-  constructor() {}
+  constructor() { }
+}
+export class GetApplications {
+  static readonly type = '[provider] gets applications';
+  constructor() { }
 }
 export class CreateWorkshop {
   static readonly type = '[provider] create Workshop';
-  constructor( public about: FormGroup,  public description: FormGroup, public address: FormGroup, public teachers: FormArray ) {}
+  constructor(public about: FormGroup, public description: FormGroup, public address: FormGroup, public teachers: FormArray) { }
 }
 export class CreateAddress {
   static readonly type = '[provider] create Address';
-  constructor( public payload: FormGroup ) {}
+  constructor(public payload: FormGroup) { }
 }
 export class CreateTeachers {
   static readonly type = '[provider] create Teachers';
-  constructor( public payload: FormArray ) {}
+  constructor(public payload: FormArray) { }
 }

src/app/shared/store/provider.state.ts

@@ -1,22 +1,25 @@
 import { Injectable } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { State, Action, StateContext, Selector } from '@ngxs/store';
-import { actCard } from '../models/activities-card.model';
 import { Address } from '../models/address.model';
+import { Application } from '../models/application.model';
 import { Teacher } from '../models/teacher.model';
 import { Workshop } from '../models/workshop.model';
+import { ApplicationsService } from '../services/applications/applications.service';
 import { ChildCardService } from '../services/child-cards/child-cards.service';
 import { ProviderActivitiesService } from '../services/provider-activities/provider-activities.service';
-import { CreateAddress, CreateTeachers, CreateWorkshop, GetActivitiesCards } from './provider.actions';
+import { CreateAddress, CreateTeachers, CreateWorkshop, GetActivitiesCards, GetApplications } from './provider.actions';
 
 export interface ProviderStateModel {
-  activitiesList: actCard[];
+  activitiesList: Workshop[];
+  applicationsList: Application[];
 }
 
 @State<ProviderStateModel>({
   name: 'provider',
   defaults: {
-    activitiesList: []
+    activitiesList: Workshop[''],
+    applicationsList: Application['']
   }
 })
 @Injectable()
@@ -27,28 +30,39 @@ export class ProviderState {
   static activitiesList(state: ProviderStateModel) {
     return state.activitiesList
   }
+  @Selector()
+  static applicationsList(state: ProviderStateModel) {
+    return state.applicationsList
+  }
 
   constructor(
     private providerActivititesService: ProviderActivitiesService,
     private childCardsService: ChildCardService,
-    private router: Router,
-    private route: ActivatedRoute
+    private applicationService: ApplicationsService,
   ) { }
 
   @Action(GetActivitiesCards)
-  GetActivitiesCards({ patchState }: StateContext<ProviderStateModel>) {
+  getActivitiesCards({ patchState }: StateContext<ProviderStateModel>) {
     return this.providerActivititesService.getCards().subscribe(
-      (activitiesList: actCard[]) => patchState({ activitiesList })
+      (activitiesList: Workshop[]) => patchState({ activitiesList })
+    )
+  }
+  @Action(GetApplications)
+  getApplications({ patchState }: StateContext<ProviderStateModel>) {
+    return this.applicationService.getApplications().subscribe(
+      (applicationsList: Application[]) =>
+        patchState({ applicationsList })
     )
   }
 
   @Action(CreateWorkshop)
   createWorkshop({ dispatch }: StateContext<ProviderStateModel>, { about, description, address, teachers }: CreateWorkshop): void {
-    let adr, tchrs;
-    dispatch(new CreateAddress(address)).subscribe(data => adr = data);
+    let addr, tchrs;
+    dispatch(new CreateAddress(address)).subscribe(data => addr = data);
     dispatch(new CreateTeachers(teachers)).subscribe(data => tchrs = data);
 
-    const workshop = new Workshop(about.value, description.value, adr, tchrs);
+    const workshop = new Workshop(about.value, description.value, addr, tchrs);
+    console.log(workshop)
 
     this.providerActivititesService.createWorkshop(workshop);
   }

src/app/shell/provider/personal-cabinet/personal-cabinet.component.html

@@ -1,9 +1,12 @@
-<div class="container">
-  <h1 class="title">КАБІНЕТ КОРИСТУВАЧА</h1>
-<nav class="nav" mat-tab-nav-bar>
-  <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./config'">ОСОБИСТА ІНФОРМАЦІЯ</a>
-  <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./org-info'">ІНФОРМАЦІЯ ПРО ЗАКЛАД</a>
-  <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./activities'">ГУРТКИ</a>
-  <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./requests'">ЗАЯВКИ</a>
-</nav>
-<router-outlet></router-outlet>
+<div>
+  <div class="container">
+    <h1 class="title">КАБІНЕТ КОРИСТУВАЧА</h1>
+    <nav class="nav" mat-tab-nav-bar>
+      <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./config'">ОСОБИСТА ІНФОРМАЦІЯ</a>
+      <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./org-info'">ІНФОРМАЦІЯ ПРО ЗАКЛАД</a>
+      <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./activities'">ГУРТКИ</a>
+      <a mat-tab-link [routerLinkActive]="['active']" [routerLink]="'./applications'">ЗАЯВКИ</a>
+    </nav>
+  </div>
+  <router-outlet></router-outlet>
+</div>

src/app/shell/provider/personal-cabinet/personal-cabinet.component.scss

@@ -2,7 +2,7 @@
   background: #FFFFFF;
   box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.08);
   padding: 24px;
-  margin:80px;
+  margin-top:80px;
 }
 .title, .nav{
   margin:10px;

src/app/shell/provider/personal-cabinet/personal-cabinet.component.ts

@@ -1,4 +1,6 @@
 import { Component, OnInit } from '@angular/core';
+import { Store } from '@ngxs/store';
+import { ChangePage } from '../../../shared/store/app.actions';
 
 @Component({
   selector: 'app-personal-cabinet',
@@ -7,11 +9,11 @@ import { Component, OnInit } from '@angular/core';
 })
 export class PersonalCabinetComponent implements OnInit {
 
-  constructor() {
+  constructor(private store: Store) {
   }
 
   ngOnInit(): void {
+    this.store.dispatch(new ChangePage(false));
   }
 
 }
-

src/app/shell/provider/provider-activities/create-activity/create-about-form/create-about-form.component.html

@@ -44,23 +44,23 @@
     <mat-form-field>
       <div fxLayout='row' fxLayoutAlign='start'>
         <p class="step-text">Від</p>
-        <input matInput class="step-input step-input-age" ng-model="number" formControlName="minAge" required
-          appDigitOnly appMinMax [min]="1" [max]="16">
+        <input matInput class="step-input step-input-age" type="number" ng-model="number" formControlName="minAge"
+          required appDigitOnly maxlength="2" appMinMax [min]="1" [max]="16">
       </div>
     </mat-form-field>
     <mat-form-field>
       <div fxLayout='row' fxLayoutAlign='start'>
         <p class="step-text">До</p>
-        <input matInput class="step-input step-input-age" ng-model="number" formControlName="maxAge" required
-          #minAgeInput appDigitOnly maxlength="2" appMinMax [min]="1" [max]="16">
+        <input matInput class="step-input step-input-age" type="number" ng-model="number" formControlName="maxAge"
+          required appDigitOnly maxlength="2" appMinMax [min]="1" [max]="16">
       </div>
     </mat-form-field>
   </div>
   <label class="step-label">Кількість занять<span class="step-required">*</span></label>
   <mat-form-field>
     <div fxLayout='row' fxLayoutAlign='start'>
-      <input matInput class="step-input step-input-age" ng-model="number" formControlName="daysPerWeek" required
-        #maxAgeInput appDigitOnly maxlength="1" appMinMax [min]="1" [max]="7">
+      <input matInput class="step-input step-input-age" type="number" ng-model="number" formControlName="daysPerWeek"
+        required #maxAgeInput appDigitOnly maxlength="1" appMinMax [min]="1" [max]="7">
       <p class="step-text">в тиждень</p>
     </div>
   </mat-form-field>