Changeset ee137aa


Ignore:
Timestamp:
08/07/20 10:59:56 (4 years ago)
Author:
Mile Jankuloski <mile.jankuloski@…>
Branches:
master
Children:
63d885e
Parents:
c73269d
Message:

Added DataService and dialogs, all bindings needed implemented

Location:
Farmatiko/ClientApp
Files:
23 added
7 deleted
15 edited

Legend:

Unmodified
Added
Removed

  • Farmatiko/ClientApp/angular.json

    rc73269d ree137aa  
    5454          "builder": "@angular-devkit/build-angular:dev-server",
    5555          "options": {
    56             "browserTarget": "Farmatiko:build"
     56            "browserTarget": "Farmatiko:build",
     57            "port": 80
    5758          },
    5859          "configurations": {

  • Farmatiko/ClientApp/src/app/admin/admin.component.css

    rc73269d ree137aa  
    1111    width: 30vh;
    1212}
     13
     14h2 {
     15    text-align: center;
     16    padding: 50px;
     17}

  • Farmatiko/ClientApp/src/app/admin/admin.component.html

    rc73269d ree137aa  
    2222        <div class="wrapper">
    2323          <div>
    24             <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="true">
     24            <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="requests">
    2525              <thead>
    2626                <tr>
    … …  
    3131              </thead>
    3232              <tbody>
    33                 <tr *ngFor="let head of heads">
    34                   <td>{{head.Name}} | {{head.Email}}</td>
    35                   <td>{{head.Pharmacy[0].name}}</td>
    36                   <td><a (click)="Approve()">Approve</a> | <a (click)="Reject()">Reject</a></td>
     33                <tr *ngFor="let request of requests">
     34                  <td>{{request.PharmacyHead.Name}} | {{request.PharmacyHead.Email}}</td>
     35                  <td><a (click)="openPharmacyDialog(request.Pharmacy)">{{request.Pharmacy.name}}</a></td>
     36                  <td><a (click)="approveRequest(request)">Approve</a> | <a (click)="rejectRequest(request)">Reject</a></td>
    3737                </tr>
    3838              </tbody>
    … …  
    4444        <div class="wrapper">
    4545          <div>
    46             <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="true">
     46            <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="heads">
    4747              <thead>
    4848                <tr>
    … …  
    5353              <tbody>
    5454                <tr *ngFor="let head of heads">
    55                   <td>{{head.Name}} | {{head.Email}}</td>
    56                   <td><a (click)="Del(head)">Delete</a> | <a (click)="ChangeDialog(head)">Change</a></td>
     55                  <td><a (click)="openPharmacyHeadDialog(head)">{{head.Name}}</a> | {{head.Email}}</td>
     56                  <td><a (click)="deletePharmacyHead(head)">Delete</a> | <a (click)="openEditPharmacyHeadDialog(head)">Change</a></td>
    5757                </tr>
    5858              </tbody>
    … …  
    6262      </mat-tab>
    6363        <mat-tab label="Create new account">
    64           <div class="createform">
     64          <h2 *ngIf="!this.head">Loading form...</h2>
     65          <div class="createform" *ngIf="this.head">
    6566          <mat-form-field appearance="fill">
    6667            <mat-label>Name</mat-label>
    67             <input matInput [(ngModel)]="head.Name">
     68            <input matInput [(ngModel)]="this.head.Name">
    6869          </mat-form-field><br>
    6970          <mat-form-field appearance="fill">
    7071            <mat-label>Email</mat-label>
    71             <input matInput [(ngModel)]="head.Email">
     72            <input matInput [(ngModel)]="this.head.Email">
    7273          </mat-form-field><br>
    7374          <mat-form-field appearance="fill">
    7475            <mat-label>Password</mat-label>
    75             <input matInput [(ngModel)]="head.Passwd">
     76            <input matInput [(ngModel)]="this.head.Passwd">
    7677          </mat-form-field><br>
    7778            <button onclick="createHead()" mat-raised-button color="primary">Create</button>
    … …  
    7980        </mat-tab>
    8081</mat-tab-group>
    81 
    82 <div class="status">{{status}}</div>

  • Farmatiko/ClientApp/src/app/admin/admin.component.ts

    rc73269d ree137aa  
    1 import { Component, OnInit, Inject, Output, EventEmitter } from '@angular/core';
    2 import { Pharmacy } from '../models/Pharmacy';
    3 import { HttpClient } from '@angular/common/http';
     1import { Component, OnInit } from '@angular/core';
    42import { MatDialog } from '@angular/material/dialog';
    53import { MatSnackBar, MatSnackBarRef, SimpleSnackBar } from '@angular/material/snack-bar';
    6 import { Router, RouterModule } from '@angular/router';
    7 import { PharmacyHead } from '../models/PharmacyHead';
    8 import { FormControl } from '@angular/forms';
     4import { Router } from '@angular/router';
     5import { IPharmacyHead, IPharmacyHeadRequest, IPharmacy } from '../shared/interfaces';
     6import { DataService } from '../shared/data.service';
     7import { EditPharmacyHeadDialogComponent } from '../dialogs/edit-pharmacy-head-dialog/edit-pharmacy-head-dialog.component';
     8import { PharmacyDialogComponent } from '../dialogs/pharmacy-dialog/pharmacy-dialog.component';
     9import { PharmacyHeadDialogComponent } from '../nav-menu/dialogs/pharmacy-head-dialog/pharmacy-head-dialog.component';
    910
    1011
    … …  
    1516})
    1617export class AdminComponent implements OnInit {
    17   public heads: PharmacyHead[];
    18   public head: PharmacyHead;
    19   public status: string;
     18  public heads: IPharmacyHead[] = [];
     19  public requests: IPharmacyHeadRequest[] = [];
     20  public head: IPharmacyHead;
    2021
    21   constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string, private dialog: MatDialog, private _snackBar: MatSnackBar, private router: Router) {
    22     http.get<PharmacyHead[]>(baseUrl + 'PharmacyHead/Get?').subscribe(result => {
    23       this.heads = result;
    24       console.log(this.heads);
    25     }, error => console.error(error));
     22  constructor(private dataService: DataService, private dialog: MatDialog, private snackBar: MatSnackBar, private router: Router) {
     23
    2624  }
    2725
    2826  ngOnInit(): void {
    29     this.head = new PharmacyHead();
     27    this.dataService.getPharmacyHeads()
     28        .subscribe((pHeads: IPharmacyHead[]) => {
     29          this.heads = pHeads;
     30        },
     31        (err: any) => console.log(err),
     32        () => console.log("PharmacyHead data retrieved"));
     33
     34    this.dataService.getClaimingRequests()
     35    .subscribe((pRequests: IPharmacyHeadRequest[]) => {
     36      this.requests = pRequests;
     37    },
     38    (err: any) => console.log(err),
     39    () => console.log("PharmacyHead data retrieved"));
    3040  }
    3141
    3242  createHead() {
    33     console.log(this.head);
    34     // post request vo prodolzenie
    35 
    36     this.status="Status bar createHead";
    37     //window.location.reload();
     43    this.dataService.insertPharmacyHead(this.head)
     44        .subscribe((cHead: IPharmacyHead) => {
     45          if(cHead) {
     46            this.heads.push(cHead);
     47            this.openSnackBar("New head created!","OK");
     48          }
     49        },
     50        (err: any) => console.log(err),
     51        () => console.log("PharmacyHead inserted"));
     52    this.head = null;
    3853  }
    3954
    40   Del(head: PharmacyHead) {
    41     console.log(this.head);
    42     // post request vo prodolzenie
    43 
    44     this.status="Status bar Del";
     55  deletePharmacyHead(dHead: IPharmacyHead) {
     56    this.dataService.deletePharmacyHead(dHead.id)
     57        .subscribe((status: boolean) => {
     58          if(status) {
     59            this.openSnackBar("Head deleted!","OK");
     60          }
     61        },
     62        (err: any) => console.log(err),
     63        () => console.log("PharmacyHead deleted"));
    4564  }
    4665
    47   ChangeDialog(head: PharmacyHead) {
    48     console.log(this.head);
    49 
     66  openEditPharmacyHeadDialog(eHead: IPharmacyHead) {
     67    let dialogRef = this.dialog.open(EditPharmacyHeadDialogComponent, {
     68      width: '450px',
     69      data: eHead
     70    });
     71    dialogRef.afterClosed().subscribe((editedHead: IPharmacyHead) => {
     72      if(editedHead){
     73        this.heads = this.heads.filter(x => x !== eHead);
     74        this.heads.push(editedHead);
     75        this.dataService.updatePharmacyHead(editedHead)
     76            .subscribe((hd: IPharmacyHead) => {
     77              if(hd) {
     78                this.openSnackBar("Success! PharmacyHead edited", "OK").onAction().subscribe(() => {
     79                  window.location.reload();
     80                });
     81              }
     82              else {
     83                this.openSnackBar("PharmacyHead edit failed", "Try again");
     84              }
     85            },
     86            (err: any) => console.log(err),
     87            () => console.log('PharmacyHead data updated'));
     88      }
     89    });
    5090  }
    5191
    52   Reject() {
    53     console.log('Rejected');
    54     // post request vo prodolzenie
    55 
     92  openPharmacyDialog(pharmacy: IPharmacy): void {
     93    this.dialog.open(PharmacyDialogComponent, {
     94      width: '450px',
     95      data: pharmacy
     96    });
    5697  }
    5798
    58   Approve() {
    59     console.log('Approved');
    60     // post request vo prodolzenie
     99  openPharmacyHeadDialog(hd: IPharmacyHead): void {
     100    this.dialog.open(PharmacyHeadDialogComponent, {
     101      width: '450px',
     102      data: hd
     103    });
     104  }
    61105
     106  rejectRequest(req: IPharmacyHeadRequest) {
     107    this.dataService.deleteClaimingRequest(req.id)
     108        .subscribe((status: boolean) => {
     109          if(status) {
     110            this.openSnackBar("Request rejected!","OK");
     111          }
     112          else {
     113            this.openSnackBar("Something went wrong","Try again");
     114          }
     115        },
     116        (err: any) => console.log(err),
     117        () => console.log("PharmacyHeadRequest deleted"));
     118  }
     119
     120  approveRequest(req: IPharmacyHeadRequest) {
     121    if(req) {
     122    req.PharmacyHead.Pharmacy.push(req.Pharmacy);
     123    this.dataService.updatePharmacyHead(req.PharmacyHead)
     124        .subscribe(() => {
     125         
     126        },
     127        (err: any) => console.log(err),
     128        () => console.log("PharmacyHead updated"))
     129    }
     130  }
     131
     132  openSnackBar(message: string, action: string) : MatSnackBarRef<SimpleSnackBar> {
     133    return this.snackBar.open(message, action, {
     134      duration: 5000,
     135    });
    62136  }
    63137

  • Farmatiko/ClientApp/src/app/app.module.ts

    rc73269d ree137aa  
    66import { MaterialModule } from './shared/material.module';
    77import { ReactiveFormsModule } from '@angular/forms';
     8
     9import { DataService } from './shared/data.service';
    810
    911import { AppComponent } from './app.component';
    … …  
    1618import { DashboardComponent } from './dashboard/dashboard.component';
    1719import { LoginComponent } from './login/login.component';
     20import { MedicineDialogComponent } from './dialogs/medicine-dialog/medicine-dialog.component';
     21import { PharmacyDialogComponent } from './dialogs/pharmacy-dialog/pharmacy-dialog.component';
     22import { FacilityDialogComponent } from './dialogs/facility-dialog/facility-dialog.component';
     23import { WorkerDialogComponent } from './dialogs/worker-dialog/worker-dialog.component';
     24import { EditPharmacyDialogComponent } from './dialogs/edit-pharmacy-dialog/edit-pharmacy-dialog.component';
     25import { EditPharmacyHeadDialogComponent } from './dialogs/edit-pharmacy-head-dialog/edit-pharmacy-head-dialog.component';
     26import { PharmacyHeadDialogComponent } from './nav-menu/dialogs/pharmacy-head-dialog/pharmacy-head-dialog.component';
    1827
    1928@NgModule({
    … …  
    2635    AdminComponent,
    2736    DashboardComponent,
    28     LoginComponent
     37    LoginComponent,
     38    MedicineDialogComponent,
     39    PharmacyDialogComponent,
     40    FacilityDialogComponent,
     41    WorkerDialogComponent,
     42    EditPharmacyDialogComponent,
     43    EditPharmacyHeadDialogComponent,
     44    PharmacyHeadDialogComponent
    2945  ],
    3046  imports: [
    … …  
    3854      { path: 'admin', component: AdminComponent },
    3955      { path: 'dashboard', component: DashboardComponent },
     56      { path: 'dashboard/:token', component: DashboardComponent },
    4057      { path: 'login', component: LoginComponent }
    4158    ]),
    … …  
    4461    ReactiveFormsModule
    4562  ],
    46   providers: [],
     63  providers: [
     64    DataService
     65  ],
    4766  bootstrap: [AppComponent]
    4867})

  • Farmatiko/ClientApp/src/app/counter/counter.component.html

    rc73269d ree137aa  
    88    <h2>Здравствени установи</h2>
    99  <mat-form-field>
    10     <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди установа">
     10    <input matInput (keyup)="applyFilterFacilities($event.target.value)" placeholder="Пронајди установа">
    1111  </mat-form-field>
    1212    </div>   
    13   <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
    14       <ng-container matColumnDef="id">
    15         <th mat-header-cell *matHeaderCellDef mat-sort-header> id </th>
    16         <td mat-cell *matCellDef="let facilities"> {{facilities.id}} </td>
    17       </ng-container>
    18 
    19       <ng-container matColumnDef="createdOn">
    20         <th mat-header-cell *matHeaderCellDef mat-sort-header> createdOn </th>
    21         <td mat-cell *matCellDef="let facilities"> {{facilities.createdOn}} </td>
    22       </ng-container>
    23      
    24       <ng-container matColumnDef="deletedOn">
    25         <th mat-header-cell *matHeaderCellDef mat-sort-header> deletedOn </th>
    26         <td mat-cell *matCellDef="let facilities"> {{facilities.deletedOn}} </td>
    27       </ng-container>
    28 
    29       <ng-container matColumnDef="Име">
    30         <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    31         <td mat-cell *matCellDef="let facilities"> {{facilities.name}} </td>
    32       </ng-container>
    33 
    34       <ng-container matColumnDef="Општина">
    35         <th mat-header-cell *matHeaderCellDef mat-sort-header> Општина </th>
    36         <td mat-cell *matCellDef="let facilities"> {{facilities.municipality}} </td>
    37       </ng-container>
    38 
    39       <ng-container matColumnDef="Адреса">
    40         <th mat-header-cell *matHeaderCellDef mat-sort-header> Адреса </th>
    41         <td mat-cell *matCellDef="let facilities"> {{facilities.address}} </td>
    42       </ng-container>
    43 
    44       <ng-container matColumnDef="Тип">
    45         <th mat-header-cell *matHeaderCellDef mat-sort-header> Тип </th>
    46         <td mat-cell *matCellDef="let facilities"> {{facilities.type}} </td>
    47       </ng-container>
    48 
    49       <ng-container matColumnDef="Е-пошта">
    50         <th mat-header-cell *matHeaderCellDef mat-sort-header> Е-пошта </th>
    51         <td mat-cell *matCellDef="let facilities"> {{facilities.email}} </td>
    52       </ng-container>
    53 
    54       <ng-container matColumnDef="Телефон">
    55         <th mat-header-cell *matHeaderCellDef mat-sort-header> Телефон </th>
    56         <td mat-cell *matCellDef="let facilities"> {{facilities.phone}} </td>
    57       </ng-container>
    58 
    59         <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    60         <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    61     </table>
    62     <mat-paginator #paginator [pageSize]="100" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     13    <table class='table table-striped' aria-labelledby="tableLabel" *ngIf="true">
     14      <thead>
     15        <tr>
     16          <th>Име</th>
     17          <th>Општина</th>
     18          <th>Адреса</th>
     19          <th>Тип</th>
     20          <th>Е-пошта</th>
     21          <th>Телефон</th>
     22        </tr>
     23      </thead>
     24      <tbody>
     25        <tr *ngFor="let facility of filteredFacilities">
     26          <td><a (click)="openFacilityDialog(facility)">{{ facility.name }}</a></td>
     27          <td>{{ facility.municipality }}</td>
     28          <td>{{ facility.address }}</td>
     29          <td>{{ facility.type }}</td>
     30          <td>{{ facility.email }}</td>
     31          <td>{{ facility.phone }}</td>
     32        </tr>
     33    </tbody>
     34  </table>
    6335  </div>
    6436  </mat-tab>
    … …  
    7143    </mat-form-field>
    7244    </div>
    73       <table [dataSource]="dataSourceWorkers" mat-table matSort class="mat-elevation-z8">
    74         <ng-container matColumnDef="Име">
    75           <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    76           <td mat-cell *matCellDef="let workers"> {{workers.name}} </td>
    77         </ng-container>
    78 
    79         <ng-container matColumnDef="Гранка">
    80           <th mat-header-cell *matHeaderCellDef mat-sort-header> Гранка </th>
    81           <td mat-cell *matCellDef="let workers"> {{workers.branch}} </td>
    82         </ng-container>
    83 
    84         <ng-container matColumnDef="Установа">
    85           <th mat-header-cell *matHeaderCellDef mat-sort-header> Установа </th>
    86           <td mat-cell *matCellDef="let workers"> {{workers.facility}} </td>
    87         </ng-container>
    88 
    89         <ng-container matColumnDef="Назив">
    90           <th mat-header-cell *matHeaderCellDef mat-sort-header> Назив </th>
    91           <td mat-cell *matCellDef="let workers"> {{workers.title}} </td>
    92         </ng-container>
    93 
    94           <tr mat-header-row *matHeaderRowDef="displayedColumnsWorkers"></tr>
    95           <tr mat-row *matRowDef="let row; columns: displayedColumnsWorkers;"></tr>
    96       </table>
    97       <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     45    <table class='table table-striped' aria-labelledby="tableLabel" *ngIf="true">
     46      <thead>
     47        <tr>
     48          <th>Име</th>
     49          <th>Гранка</th>
     50          <th>Установа</th>
     51          <th>Назив</th>
     52        </tr>
     53      </thead>
     54      <tbody>
     55        <tr *ngFor="let worker of filteredWorkers">
     56          <td><a (click)="openWorkerDialog(worker)">{{ worker.name }}</a></td>
     57          <td>{{ worker.branch }}</td>
     58          <td>{{ worker.facility }}</td>
     59          <td>{{ worker.title }}</td>
     60        </tr>
     61    </tbody>
     62  </table>
    9863    </div>
    9964    </mat-tab>

  • Farmatiko/ClientApp/src/app/counter/counter.component.ts

    rc73269d ree137aa  
    1 import { Component, OnInit, ViewChild, Inject, Input } from '@angular/core';
    2 import { HttpClient } from '@angular/common/http';
    3 import { HealthFacilities } from '../models/HealthFacilities';
    4 import { MatTableDataSource } from '@angular/material/table';
    5 import { MatPaginator } from '@angular/material/paginator';
    6 import { MatSort } from '@angular/material/sort';
    7 import { HealthcareWorkers } from '../models/HealthcareWorkers';
     1import { Component, OnInit } from '@angular/core';
     2import { IHealthFacilities, IHealthcareWorkers } from '../shared/interfaces';
     3import { DataService } from '../shared/data.service';
     4import { MatDialog } from '@angular/material/dialog';
     5import { FacilityDialogComponent } from '../dialogs/facility-dialog/facility-dialog.component';
     6import { WorkerDialogComponent } from '../dialogs/worker-dialog/worker-dialog.component';
    87
    98@Component({
    … …  
    1312})
    1413export class CounterComponent implements OnInit {
    15   @Input() facilities: HealthFacilities[];
    16   public workers: HealthcareWorkers[];
    17   displayedColumns = ['id','createdOn','deletedOn','Име','Општина','Адреса', 'Тип', 'Е-пошта', 'Телефон'];
    18   displayedColumnsWorkers = ['Име','Гранка','Установа', 'Назив'];
    19   dataSource = new MatTableDataSource<HealthFacilities>();
    20   dataSourceWorkers = new MatTableDataSource<HealthcareWorkers>();
     14  public facilities: IHealthFacilities[] = [];
     15  public workers: IHealthcareWorkers[] = [];
     16  public filteredFacilities: IHealthFacilities[] = [];
     17  public filteredWorkers: IHealthcareWorkers[] = [];
    2118
    22   @ViewChild(MatPaginator, {static: false}) paginator: MatPaginator;
    23   @ViewChild(MatSort) sort: MatSort;
    24 
    25   constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
    26     http.get<HealthFacilities[]>(baseUrl + 'HealthFacilities/Get?').subscribe(result => {
    27       this.facilities = result;
    28       console.log(this.facilities);
    29       this.dataSource = new MatTableDataSource<HealthFacilities>(this.facilities);
    30     }, error => console.error(error));
    31     http.get<HealthcareWorkers[]>(baseUrl + 'HealthcareWorker/Get?').subscribe(result => {
    32       this.workers = result;
    33       console.log(this.workers);
    34       this.dataSourceWorkers = new MatTableDataSource<HealthcareWorkers>(this.workers);
    35     }, error => console.error(error));
    36   }
    37   ngOnInit(): void {
     19  constructor(private dataService: DataService, private dialog: MatDialog) {
     20   
    3821  }
    3922
    40   ngAfterViewInit(): void {
    41     this.dataSource.paginator = this.paginator;
    42     this.dataSource.sort = this.sort;
     23  ngOnInit(): void {
     24    this.dataService.getFacilities()
     25        .subscribe((facility: IHealthFacilities[]) => {
     26          this.facilities = this.filteredFacilities = facility;
     27        },
     28        (err: any) => console.log(err),
     29        () => console.log('Facility data retrieved!'));
     30
     31    this.dataService.getWorkers()
     32        .subscribe((worker: IHealthcareWorkers[]) => {
     33          this.workers = this.filteredWorkers = worker;
     34        },
     35        (err: any) => console.log(err),
     36        () => console.log('Facility data retrieved!'));
    4337  }
    4438
    45   applyFilter(filterValue: string) {
    46     filterValue = filterValue.trim();
    47     filterValue = filterValue.toLowerCase();
    48     this.dataSource.filter = filterValue;
     39  applyFilterFacilities(filterValue: string) {
     40    console.log("applyFilterFacilities works!")
     41    if(filterValue) {
     42      this.dataService.searchFacilities(filterValue)
     43          .subscribe((facility: IHealthFacilities[]) => {
     44            this.filteredFacilities = facility;
     45          },
     46          (err: any) => console.log(err),
     47          () => console.log('Facility data retrieved!'));
     48    }
     49    else {
     50      this.filteredFacilities = this.facilities;
     51    }
    4952  }
    5053
    5154  applyFilterWorkers(filterValue: string) {
    52     filterValue = filterValue.trim();
    53     filterValue = filterValue.toLowerCase();
    54     this.dataSourceWorkers.filter = filterValue;
     55    console.log("applyFilterWorkers works!")
     56    if(filterValue) {
     57      this.dataService.searchWorkers(filterValue)
     58          .subscribe((worker: IHealthcareWorkers[]) => {
     59            this.filteredWorkers = worker;
     60          },
     61          (err: any) => console.log(err),
     62          () => console.log('Worker data retrieved!'));
     63    }
     64    else {
     65      this.filteredWorkers = this.workers;
     66    }
     67  }
     68
     69  openFacilityDialog(facility: IHealthFacilities): void {
     70    this.dialog.open(FacilityDialogComponent, {
     71      width: '450px',
     72      data: facility
     73    });
     74  }
     75 
     76  openWorkerDialog(worker: IHealthcareWorkers): void {
     77    this.dialog.open(WorkerDialogComponent, {
     78      width: '450px',
     79      data: worker
     80    });
    5581  }
    5682}

  • Farmatiko/ClientApp/src/app/dashboard/dashboard.component.html

    rc73269d ree137aa  
    1212        <div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
    1313          <ul class="navbar-nav flex-grow">
    14             <li>Logged as  <!--{{head.Name}}--> </li>
     14            <li>Logged as ...<p *ngIf="head">{{head.Name}}</p> </li>
    1515          </ul>
    1616        </div>
    … …  
    1818        <button mat-button [matMenuTriggerFor]="menu"><mat-icon>more_vert</mat-icon></button>
    1919        <mat-menu #menu="matMenu">
    20           <button mat-menu-item (click)="openDialog()"><mat-icon>person_add</mat-icon>View homepage</button>
    21           <button mat-menu-item (click)="test()"><mat-icon>directions</mat-icon>Go to homepage</button>
     20          <button mat-menu-item [routerLink]="['/']"><mat-icon>directions</mat-icon>Почетна</button>
    2221        </mat-menu>
    2322      </div>
    … …  
    3029    <div class="header">
    3130    <h2>Мои аптеки</h2>
    32     <p *ngIf="!mypharmacies"><em>Loading...</em></p>
     31    <p *ngIf="!head"><em>Loading...</em></p>
    3332    </div>
    34     <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="true">
     33    <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="head">
    3534      <thead>
    3635        <tr>
    … …  
    4342      </thead>
    4443      <tbody>
    45         <tr *ngFor="let pharmacies of mypharmacies">
     44        <tr *ngFor="let pharmacies of head.Pharmacy">
    4645          <td>{{pharmacies.name}}</td>
    4746          <td>{{pharmacies.location}}</td>
    4847          <td>{{pharmacies.address}}</td>
    4948          <td>{{pharmacies.workAllTime}}</td>
    50           <td><a (click)="works24hrs(pharmacies)">Работи 24/7</a> | <a (click)="doesntWork24hrs(pharmacies)">Не работи 24/7</a></td>
     49          <td><a (click)="openEditPharmacyDialog(pharmacies)">Edit</a></td>
    5150        </tr>
    5251      </tbody>
    … …  
    6160      <input matInput (keyup)="applyFilterPharmacies($event.target.value)" placeholder="Пронајди аптека">
    6261    </mat-form-field>
    63     </div>
    64       <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
    65         <ng-container matColumnDef="Име">a
    66           <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    67           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.name}} </td>
    68         </ng-container>
    69    
    70         <ng-container matColumnDef="Локација">
    71           <th mat-header-cell *matHeaderCellDef mat-sort-header> Локација </th>
    72           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.location}} </td>
    73         </ng-container>
    74      
    75         <ng-container matColumnDef="Адреса">
    76           <th mat-header-cell *matHeaderCellDef mat-sort-header> Адреса </th>
    77           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.address}} </td>
    78         </ng-container>
    79 
    80         <ng-container matColumnDef="Actions">
    81           <th mat-header-cell *matHeaderCellDef mat-sort-header> Actions </th>
    82           <td mat-cell *matCellDef="let pharmacies"> <a (click)="claimPharmacy(pharmacies)">Claim Pharmacy</a> </td>
    83         </ng-container>
    84  
    85           <tr mat-header-row *matHeaderRowDef="displayedColumnsPharmacies"></tr>
    86           <tr mat-row *matRowDef="let row; columns: displayedColumnsPharmacies;"></tr>
    87       </table>
    88       <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     62  </div>
     63    <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="pharmacies">
     64      <thead>
     65        <tr>
     66          <th>Име</th>
     67          <th>Локација</th>
     68          <th>Адреса</th>
     69          <th>Работи 27/7?</th>
     70        </tr>
     71      </thead>
     72      <tbody>
     73        <tr *ngFor="let pharmacy of pharmacies">
     74          <td><a (click)="openPharmacyDialog(pharmacy)">{{ pharmacy.name }}</a></td>
     75          <td>{{ pharmacy.location }}</td>
     76          <td>{{ pharmacy.address }}</td>
     77          <td>{{ pharmacy.workAllTime }}</td>
     78          <td><a (click)="claimPharmacy(pharmacy)">Claim</a></td>
     79        </tr>
     80    </tbody>
     81  </table>
    8982    </div>
    9083    </mat-tab>
    9184  </mat-tab-group>
    92 
    93   <div class="statusbar">{{status}}</div>
    9485
    9586<div class="wrapper">
    … …  
    9788    <h2>Достапни лекови</h2>
    9889    <mat-form-field>
    99       <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди лек">
     90      <input matInput (keyup)="applyFilterMedicines($event.target.value)" placeholder="Пронајди лек">
    10091    </mat-form-field>
    10192      </div>
    102       <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
    103         <ng-container matColumnDef="Име">
    104           <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    105           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.name}} </td>
    106         </ng-container>
    107    
    108         <ng-container matColumnDef="Јачина">
    109           <th mat-header-cell *matHeaderCellDef mat-sort-header> Јачина </th>
    110           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.strength}} </td>
    111         </ng-container>
    112      
    113         <ng-container matColumnDef="Форма">
    114           <th mat-header-cell *matHeaderCellDef mat-sort-header> Форма </th>
    115           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.form}} </td>
    116         </ng-container>
    117        
    118         <ng-container matColumnDef="Начин на издавање">
    119           <th mat-header-cell *matHeaderCellDef mat-sort-header> Начин на издавање </th>
    120           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.wayOfIssuing}} </td>
    121         </ng-container>
    122    
    123         <ng-container matColumnDef="Производител">
    124           <th mat-header-cell *matHeaderCellDef mat-sort-header> Производител </th>
    125           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.manufacturer}} </td>
    126         </ng-container>
    127      
    128         <ng-container matColumnDef="Цена">
    129           <th mat-header-cell *matHeaderCellDef mat-sort-header> Цена </th>
    130           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.price}} </td>
    131         </ng-container>
    132  
    133         <ng-container matColumnDef="Пакување">
    134           <th mat-header-cell *matHeaderCellDef mat-sort-header> Пакување </th>
    135           <td mat-cell *matCellDef="let mymedicines"> {{mymedicines.packaging}} </td>
    136         </ng-container>
    137  
    138         <ng-container matColumnDef="Actions">
    139           <th mat-header-cell *matHeaderCellDef mat-sort-header> Actions </th>
    140           <td mat-cell *matCellDef="let mymedicines"> <a (click)="medicineExists(mymedicines)">Exists</a> | <a (click)="medicineDoesntSell(mymedicines)">Doesnt sell</a> </td>
    141         </ng-container>
    142  
    143           <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    144           <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    145       </table>
    146       <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     93      <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="head">
     94        <thead>
     95          <tr>
     96            <th>Име</th>
     97            <th>Јачина</th>
     98            <th>Форма</th>
     99            <th>Начин на издавање</th>
     100            <th>Производител</th>
     101            <th>Цена</th>
     102            <th>Пакување</th>
     103          </tr>
     104        </thead>
     105        <tbody>
     106          <tr *ngFor="let medicine of head.PharmacyMedicines">
     107            <td><a (click)="openMedicineDialog(medicine)">{{ medicine.name }}</a></td>
     108            <td>{{ medicine.strength }}</td>
     109            <td>{{ medicine.form }}</td>
     110            <td>{{ medicine.wayOfIssuing }}</td>
     111            <td>{{ medicine.manufacturer }}</td>
     112            <td>{{ medicine.price }}</td>
     113            <td>{{ medicine.packaging }}</td>
     114            <td><a (click)="deleteMedicine(medicine)">Delete</a></td>
     115          </tr>
     116      </tbody>
     117    </table>
    147118</div>

  • Farmatiko/ClientApp/src/app/dashboard/dashboard.component.ts

    rc73269d ree137aa  
    1 import { Component, OnInit, ViewChild, Inject, Output, EventEmitter } from '@angular/core';
    2 import { Pharmacy } from '../models/Pharmacy';
    3 import { MatTableDataSource } from '@angular/material/table';
    4 import { MatPaginator } from '@angular/material/paginator';
    5 import { MatSort } from '@angular/material/sort';
    6 import { HttpClient } from '@angular/common/http';
     1import { Component, OnInit} from '@angular/core';
    72import { MatDialog } from '@angular/material/dialog';
    83import { MatSnackBar, MatSnackBarRef, SimpleSnackBar } from '@angular/material/snack-bar';
    9 import { Router, RouterModule } from '@angular/router';
    10 import { HomeComponent } from '../home/home.component';
    11 import { Medicine } from '../models/Medicine';
    12 import { PharmacyHead } from '../models/PharmacyHead';
    13 import { MedicineList } from '../models/MedicineList';
     4import { IPharmacy, IMedicine, IPharmacyHead, IPharmacyHeadRequest } from '../shared/interfaces';
     5import { DataService } from '../shared/data.service';
     6import { PharmacyDialogComponent } from '../dialogs/pharmacy-dialog/pharmacy-dialog.component';
     7import { EditPharmacyDialogComponent } from '../dialogs/edit-pharmacy-dialog/edit-pharmacy-dialog.component';
     8import { MedicineDialogComponent } from '../dialogs/medicine-dialog/medicine-dialog.component';
     9import { ActivatedRoute, Router } from '@angular/router';
    1410
    1511@Component({
    … …  
    1915})
    2016export class DashboardComponent implements OnInit {
    21   public mymedicines: Medicine[];
    22   public hasmymedicines: boolean[];
    23   public pharmacies: Pharmacy[];
    24   public mypharmacies: Pharmacy[];
    25   public head: PharmacyHead;
    26   public status: string;
    27   displayedColumns = ['Име','Јачина','Форма', 'Начин на издавање', 'Производител', 'Цена', 'Пакување', 'Actions'];
    28   displayedColumnsPharmacies = ['Име','Локација','Адреса', 'Actions'];
    29   dataSource = new MatTableDataSource<Medicine>();
    30   dataSourcePharmacies = new MatTableDataSource<Pharmacy>();
     17  public pharmacies: IPharmacy[] = [];
     18  public head: IPharmacyHead;
     19  public filteredPharmacies: IPharmacy[] = [];
     20  public filteredMedicines: IMedicine[] = [];
     21  public request: IPharmacyHeadRequest;
     22  public token: string;
    3123
    32   @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
    33   @ViewChild(MatSort) sort: MatSort;
     24  constructor(private dataService: DataService, private dialog: MatDialog, private snackBar: MatSnackBar, private router: Router, private route: ActivatedRoute) {
    3425
    35   constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string, private dialog: MatDialog, private _snackBar: MatSnackBar, private router: Router) {
    36     http.get<PharmacyHead>(baseUrl + 'PharmacyHead/GetLoggedHead?').subscribe(result => {
    37       this.head = result;
    38       console.log(this.head);
    39       this.mymedicines = this.head.PharmacyMedicines.Medicines;
    40       console.log(this.mymedicines);
    41       this.mypharmacies = this.head.Pharmacy;
    42       console.log(this.mypharmacies);
    43       this.dataSource = new MatTableDataSource<Medicine>(this.mymedicines);
    44     }, error => console.error(error));
    45     http.get<Pharmacy[]>(baseUrl + 'Pharmacy/Get?').subscribe(result => {
    46       this.pharmacies = result;
    47       console.log(this.pharmacies);
    48       this.dataSourcePharmacies = new MatTableDataSource<Pharmacy>(this.pharmacies);
    49     }, error => console.error(error));
    5026  }
    5127
    5228  ngOnInit(): void {
     29    this.token = this.route.snapshot.params['token'];
     30    this.dataService.getPharmacyHead(this.token)
     31        .subscribe((hd: IPharmacyHead) => {
     32          this.head = hd;
     33        },
     34        (err: any) => console.log(err),
     35        () => console.log('Head data retrieved'));
     36
     37    this.dataService.getPharmacies()
     38        .subscribe((pharmacy: IPharmacy[]) => {
     39          this.pharmacies = pharmacy;
     40        },
     41        (err: any) => console.log(err),
     42        () => console.log('Pharmacy data retrieved'));
     43  }
     44 
     45  claimPharmacy(pharmacy: IPharmacy) {
     46    if(pharmacy && !this.head.Pharmacy.find(x => x === pharmacy)) {
     47      this.request = null;
     48      this.request.Pharmacy = pharmacy;
     49      this.request.PharmacyHead = this.head;
     50      this.dataService.claimPharmacy(this.request)
     51          .subscribe((req: IPharmacyHeadRequest) => {
     52            if(req) {
     53              this.openSnackBar("Claiming request sent!", "OK");
     54            }
     55            else {
     56              this.openSnackBar("Unable to send a request", "Try again");
     57            }
     58          },
     59          (err: any) => console.log(err),
     60          () => console.log('Claiming request sent!'));
     61    }
    5362  }
    5463
    55   ngAfterViewInit(): void {
    56     this.dataSource.paginator = this.paginator;
    57     this.dataSource.sort = this.sort;
    58     this.dataSourcePharmacies.paginator = this.paginator;
    59     this.dataSourcePharmacies.sort = this.sort;
     64  deleteMedicine(medicine: IMedicine){
     65    this.head.PharmacyMedicines = this.head.PharmacyMedicines.filter(x => x !== medicine);
     66    this.dataService.updatePharmacyHead(this.head)
     67        .subscribe((hd: IPharmacyHead) => {
     68          if(hd) {
     69            this.openSnackBar("Success! Medicine deleted", "OK");
     70          }
     71          else {
     72            this.openSnackBar("Unable to delete Medicine", "Try again");
     73          }
     74        },
     75        (err: any) => console.log(err),
     76        () => console.log('Update sent!'));
    6077  }
    6178
    62   works24hrs(pharmacy: Pharmacy) {
    63     console.log(pharmacy);
    64     // post request vo prodolzenie
    65 
    66     this.status="Status bar works24hrs";
    67   }
    68 
    69   doesntWork24hrs(pharmacy: Pharmacy) {
    70     console.log(pharmacy);
    71     // post request vo prodolzenie
    72 
    73     this.status="Status bar doesntWork24hrs";
    74   }
    75 
    76   claimPharmacy(pharmacy: Pharmacy) {
    77     console.log(pharmacy);
    78     // post request vo prodolzenie
    79 
    80     this.status="Status bar claimPharmacy";
    81   }
    82 
    83   medicineExists(mymedicine: Medicine) {
    84     console.log(mymedicine);
    85     // post request vo prodolzenie
    86 
    87     this.status="Status bar medicineexists";
    88   }
    89 
    90   medicineDoesntSell(mymedicine: Medicine) {
    91     console.log(mymedicine);
    92     // post request vo prodolzenie
    93 
    94     this.status="Status bar medicineDoesntSell";
    95   }
    96 
    97   applyFilter(filterValue: string) {
    98     filterValue = filterValue.trim();
    99     filterValue = filterValue.toLowerCase();
    100     this.dataSource.filter = filterValue;
     79  applyFilterMedicines(filterValue: string) {
     80    console.log("applyFilterMedicines works!")
     81    if(filterValue) {
     82      this.dataService.searchMedicines(filterValue)
     83          .subscribe((medicine: IMedicine[]) => {
     84            this.filteredMedicines = medicine;
     85          },
     86          (err: any) => console.log(err),
     87          () => console.log('Medicine data retrieved'));
     88    }
     89    else {
     90      this.filteredMedicines = this.head.PharmacyMedicines;
     91    }
    10192  }
    10293 
    10394  applyFilterPharmacies(filterValue: string) {
    104     filterValue = filterValue.trim();
    105     filterValue = filterValue.toLowerCase();
    106     this.dataSourcePharmacies.filter = filterValue;
     95    console.log("applyFilterPharmacies works!")
     96    if(filterValue) {
     97      this.dataService.searchPharmacies(filterValue)
     98          .subscribe((pharmacy: IPharmacy[]) => {
     99            this.filteredPharmacies = pharmacy;
     100          },
     101          (err: any) => console.log(err),
     102          () => console.log('Pharmacy data retrieved'));
     103    }
     104    else {
     105      this.filteredPharmacies = this.pharmacies;
     106    }   
    107107  }
    108108
    109   test(): void {
    110     console.log('Snackbar works!');
    111     this.openSnackBar("Are you sure?", "Yes").onAction().subscribe(() => {
    112       this.router.navigate(['/']);
     109  openPharmacyDialog(pharmacy: IPharmacy): void {
     110    this.dialog.open(PharmacyDialogComponent, {
     111      width: '450px',
     112      data: pharmacy
    113113    });
    114114  }
    115115
    116   openDialog():void {
    117     let dialogRef = this.dialog.open(HomeComponent, {
    118       width: '70%'
     116  openEditPharmacyDialog(pharmacy: IPharmacy): void {
     117    let dialogRef = this.dialog.open(EditPharmacyDialogComponent, {
     118      width: '450px',
     119      data: pharmacy
    119120    });
    120     dialogRef.afterClosed().subscribe(result => {
    121       if(result) {
    122         this.openSnackBar("Success", "OK");
    123       }
     121    dialogRef.afterClosed().subscribe((editedPharmacy: IPharmacy) => {
     122      if(editedPharmacy) {
     123        this.head.Pharmacy = this.head.Pharmacy.filter(x => x !== pharmacy);
     124        this.head.Pharmacy.push(editedPharmacy);
     125        this.dataService.updatePharmacyHead(this.head)
     126            .subscribe((hd: IPharmacyHead) => {
     127              if(hd) {
     128                this.openSnackBar("Success! Pharmacy edited", "OK").onAction().subscribe(() => {
     129                  window.location.reload();
     130                });
     131              }
     132              else {
     133                this.openSnackBar("Pharmacy edit failed", "Try again");
     134              }
     135            },
     136            (err: any) => console.log(err),
     137            () => console.log('PharmacyHead data updated'));
     138      };
     139    });
     140  }
     141
     142  openMedicineDialog(medicine: IMedicine): void {
     143    this.dialog.open(MedicineDialogComponent, {
     144      width: '450px',
     145      data: medicine
    124146    });
    125147  }
    126148
    127149  openSnackBar(message: string, action: string) : MatSnackBarRef<SimpleSnackBar> {
    128     return this._snackBar.open(message, action, {
    129       duration: 10000,
     150    return this.snackBar.open(message, action, {
     151      duration: 5000,
    130152    });
    131153  }

  • Farmatiko/ClientApp/src/app/home/home.component.html

    rc73269d ree137aa  
    77    <h2>Лекови</h2>
    88  <mat-form-field>
    9     <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди лек">
     9    <input matInput (keyup)="applyFilterMedicines($event.target.value)" placeholder="Пронајди лек">
    1010  </mat-form-field>
    1111    </div>
    12     <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
    13       <ng-container matColumnDef="Име">
    14         <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    15         <td mat-cell *matCellDef="let medicines"> {{medicines.name}} </td>
    16       </ng-container>
    17 
    18       <ng-container matColumnDef="Јачина">
    19         <th mat-header-cell *matHeaderCellDef mat-sort-header> Јачина </th>
    20         <td mat-cell *matCellDef="let medicines"> {{medicines.strength}} </td>
    21       </ng-container>
    22 
    23       <ng-container matColumnDef="Форма">
    24         <th mat-header-cell *matHeaderCellDef mat-sort-header> Форма </th>
    25         <td mat-cell *matCellDef="let medicines"> {{medicines.form}} </td>
    26       </ng-container>
    27 
    28       <ng-container matColumnDef="Начин на издавање">
    29         <th mat-header-cell *matHeaderCellDef mat-sort-header> Начин на издавање </th>
    30         <td mat-cell *matCellDef="let medicines"> {{medicines.wayOfIssuing}} </td>
    31       </ng-container>
    32 
    33       <ng-container matColumnDef="Производител">
    34         <th mat-header-cell *matHeaderCellDef mat-sort-header> Производител </th>
    35         <td mat-cell *matCellDef="let medicines"> {{medicines.manufacturer}} </td>
    36       </ng-container>
    37 
    38       <ng-container matColumnDef="Цена">
    39         <th mat-header-cell *matHeaderCellDef mat-sort-header> Цена </th>
    40         <td mat-cell *matCellDef="let medicines"> {{medicines.price}} </td>
    41       </ng-container>
    42 
    43       <ng-container matColumnDef="Пакување">
    44         <th mat-header-cell *matHeaderCellDef mat-sort-header> Пакување </th>
    45         <td mat-cell *matCellDef="let medicines"> {{medicines.packaging}} </td>
    46       </ng-container>
    47 
    48         <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    49         <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    50     </table>
    51     <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     12  <table class='table table-striped' aria-labelledby="tableLabel" *ngIf="true">
     13      <thead>
     14        <tr>
     15          <th>Име</th>
     16          <th>Јачина</th>
     17          <th>Форма</th>
     18          <th>Начин на издавање</th>
     19          <th>Производител</th>
     20          <th>Цена</th>
     21          <th>Пакување</th>
     22        </tr>
     23      </thead>
     24      <tbody>
     25        <tr *ngFor="let medicine of filteredMedicines">
     26          <td><a (click)="openMedicineDialog(medicine)">{{ medicine.name }}</a></td>
     27          <td>{{ medicine.strength }}</td>
     28          <td>{{ medicine.form }}</td>
     29          <td>{{ medicine.wayOfIssuing }}</td>
     30          <td>{{ medicine.manufacturer }}</td>
     31          <td>{{ medicine.price }}</td>
     32          <td>{{ medicine.packaging }}</td>
     33        </tr>
     34    </tbody>
     35  </table>
    5236  </div>
    5337  </mat-tab>
    … …  
    6044    </mat-form-field>
    6145    </div>
    62       <table [dataSource]="dataSourcePharmacies" mat-table matSort class="mat-elevation-z8">
    63         <ng-container matColumnDef="Име">
    64           <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
    65           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.name}} </td>
    66         </ng-container>
    67 
    68         <ng-container matColumnDef="Локација">
    69           <th mat-header-cell *matHeaderCellDef mat-sort-header> Локација </th>
    70           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.location}} </td>
    71         </ng-container>
    72 
    73         <ng-container matColumnDef="Адреса">
    74           <th mat-header-cell *matHeaderCellDef mat-sort-header> Адреса </th>
    75           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.address}} </td>
    76         </ng-container>
    77 
    78         <ng-container matColumnDef="Работи 27/7?">
    79           <th mat-header-cell *matHeaderCellDef mat-sort-header> Работи 27/7? </th>
    80           <td mat-cell *matCellDef="let pharmacies"> {{pharmacies.workAllTime}} </td>
    81         </ng-container>
    82 
    83           <tr mat-header-row *matHeaderRowDef="displayedColumnsPharmacies"></tr>
    84           <tr mat-row *matRowDef="let row; columns: displayedColumnsPharmacies;"></tr>
    85       </table>
    86       <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
     46    <table class='table table-striped' aria-labelledby="tableLabel" *ngIf="true">
     47      <thead>
     48        <tr>
     49          <th>Име</th>
     50          <th>Локација</th>
     51          <th>Адреса</th>
     52          <th>Работи 27/7?</th>
     53        </tr>
     54      </thead>
     55      <tbody>
     56        <tr *ngFor="let pharmacy of filteredPharmacies">
     57          <td><a (click)="openPharmacyDialog(pharmacy)">{{ pharmacy.name }}</a></td>
     58          <td>{{ pharmacy.location }}</td>
     59          <td>{{ pharmacy.address }}</td>
     60          <td>{{ pharmacy.workAllTime }}</td>
     61        </tr>
     62    </tbody>
     63  </table>
    8764    </div>
    8865    </mat-tab>

  • Farmatiko/ClientApp/src/app/home/home.component.ts

    rc73269d ree137aa  
    1 import { Component, OnInit, ViewChild, Inject } from '@angular/core';
    2 import { HttpClient } from '@angular/common/http';
    3 import { Medicine } from '../models/Medicine';
    4 import { Pharmacy } from '../models/Pharmacy';
    5 import { MatTableDataSource } from '@angular/material/table';
    6 import { MatPaginator } from '@angular/material/paginator';
    7 import { MatSort } from '@angular/material/sort';
     1import { Component, OnInit } from '@angular/core';
     2import { IMedicine, IPharmacy } from '../shared/interfaces';
     3import { DataService } from '../shared/data.service';
     4import { MatDialog } from '@angular/material/dialog';
     5import { MedicineDialogComponent } from '../dialogs/medicine-dialog/medicine-dialog.component';
     6import { PharmacyDialogComponent } from '../dialogs/pharmacy-dialog/pharmacy-dialog.component';
    87
    98@Component({
    … …  
    1312})
    1413export class HomeComponent implements OnInit {
    15   public medicines: Medicine[];
    16   public pharmacies: Pharmacy[];
    17   displayedColumns = ['Име','Јачина','Форма', 'Начин на издавање', 'Производител', 'Цена', 'Пакување'];
    18   displayedColumnsPharmacies = ['Име','Локација','Адреса', 'Работи 27/7?'];
    19   dataSource = new MatTableDataSource<Medicine>();
    20   dataSourcePharmacies = new MatTableDataSource<Pharmacy>();
     14  public medicines: IMedicine[] = [];
     15  public pharmacies: IPharmacy[] = [];
     16  public filteredMedicines: IMedicine[] = [];
     17  public filteredPharmacies: IPharmacy[] = [];
    2118
    22   @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
    23   @ViewChild(MatSort) sort: MatSort;
     19  constructor(private dataService: DataService, private dialog: MatDialog) {
    2420
    25   constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
    26     http.get<Medicine[]>(baseUrl + 'Medicine/Get?').subscribe(result => {
    27       this.medicines = result;
    28       console.log(this.medicines);
    29       this.dataSource = new MatTableDataSource<Medicine>(this.medicines);
    30     }, error => console.error(error));
    31     http.get<Pharmacy[]>(baseUrl + 'Pharmacy/Get?').subscribe(result => {
    32       this.pharmacies = result;
    33       console.log(this.pharmacies);
    34       this.dataSourcePharmacies = new MatTableDataSource<Pharmacy>(this.pharmacies);
    35     }, error => console.error(error));
    36   }
    37   ngOnInit(): void {
    3821  }
    3922
    40   ngAfterViewInit(): void {
    41     this.dataSource.paginator = this.paginator;
    42     this.dataSource.sort = this.sort;
    43     this.dataSourcePharmacies.paginator = this.paginator;
    44     this.dataSourcePharmacies.sort = this.sort;
     23  ngOnInit(): void {
     24    this.dataService.getMedicines()
     25        .subscribe((medicine: IMedicine[]) => {
     26          this.medicines = this.filteredMedicines = medicine;
     27        },
     28        (err: any) => console.log(err),
     29        () => console.log('Medicine data retrieved'));
     30
     31    this.dataService.getPharmacies()
     32        .subscribe((pharmacy: IPharmacy[]) => {
     33          this.pharmacies = this.filteredPharmacies = pharmacy;
     34        },
     35        (err: any) => console.log(err),
     36        () => console.log('Pharmacy data retrieved'));
    4537  }
    4638
    47   applyFilter(filterValue: string) {
    48     filterValue = filterValue.trim();
    49     filterValue = filterValue.toLowerCase();
    50     this.dataSource.filter = filterValue;
     39  applyFilterMedicines(filterValue: string) {
     40    console.log("applyFilterMedicines works!")
     41    if(filterValue) {
     42      this.dataService.searchMedicines(filterValue)
     43          .subscribe((medicine: IMedicine[]) => {
     44            this.filteredMedicines = medicine;
     45          },
     46          (err: any) => console.log(err),
     47          () => console.log('Medicine data retrieved'));
     48    }
     49    else {
     50      this.filteredMedicines = this.medicines;
     51    }
    5152  }
    5253 
    5354  applyFilterPharmacies(filterValue: string) {
    54     filterValue = filterValue.trim();
    55     filterValue = filterValue.toLowerCase();
    56     this.dataSourcePharmacies.filter = filterValue;
     55    console.log("applyFilterPharmacies works!")
     56    if(filterValue) {
     57      this.dataService.searchPharmacies(filterValue)
     58          .subscribe((pharmacy: IPharmacy[]) => {
     59            this.filteredPharmacies = pharmacy;
     60          },
     61          (err: any) => console.log(err),
     62          () => console.log('Pharmacy data retrieved'));
     63    }
     64    else {
     65      this.filteredPharmacies = this.pharmacies;
     66    }
     67  }
     68
     69  openMedicineDialog(medicine: IMedicine): void {
     70    this.dialog.open(MedicineDialogComponent, {
     71      width: '450px',
     72      data: medicine
     73    });
     74  }
     75
     76  openPharmacyDialog(pharmacy: IPharmacy): void {
     77    this.dialog.open(PharmacyDialogComponent, {
     78      width: '450px',
     79      data: pharmacy
     80    });
    5781  }
    5882}

  • Farmatiko/ClientApp/src/app/korona/korona.component.html

    rc73269d ree137aa  
    1212    <div class="col">
    1313      <div class="counter">
    14         <i class="fa fa-code fa-2x" *ngIf="korona">{{korona[0].totalMK}}</i>
     14        <i class="fa fa-code fa-2x" *ngIf="korona">{{korona.totalMK}}</i>
    1515        <h2 class="timer count-title count-number"></h2>
    1616        <p class="count-text ">Вкупно случаи во земјата</p>
    … …  
    1919    <div class="col">
    2020      <div class="counter">
    21         <i class="fa fa-coffee fa-2x" *ngIf="korona">{{korona[0].activeMK}}</i>
     21        <i class="fa fa-coffee fa-2x" *ngIf="korona">{{korona.activeMK}}</i>
    2222        <h2 class="timer count-title count-number"></h2>
    2323        <p class="count-text ">Активни случаи во земјата</p>
    … …  
    2626    <div class="col">
    2727      <div class="counter">
    28         <i class="fa fa-lightbulb-o fa-2x" *ngIf="korona">{{korona[0].deathsMK}}</i>
     28        <i class="fa fa-lightbulb-o fa-2x" *ngIf="korona">{{korona.deathsMK}}</i>
    2929        <h2 class="timer count-title count-number"></h2>
    3030        <p class="count-text ">Смртни случаи во земјата</p>
    … …  
    3333    <div class="col">
    3434      <div class="counter">
    35         <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona[0].newMK}}</i>
     35        <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona.newMK}}</i>
    3636        <h2 class="timer count-title count-number"></h2>
    3737        <p class="count-text ">Нови случаи во земјата</p>
    … …  
    4242    <div class="col">
    4343      <div class="counter">
    44         <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona[0].totalGlobal}}</i>
     44        <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona.totalGlobal}}</i>
    4545        <h2 class="timer count-title count-number"></h2>
    4646        <p class="count-text ">Вкупно случаи глобално</p>
    … …  
    4949    <div class="col">
    5050      <div class="counter">
    51         <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona[0].activeGlobal}}</i>
     51        <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona.activeGlobal}}</i>
    5252        <h2 class="timer count-title count-number"></h2>
    5353        <p class="count-text ">Активни случаи глобално</p>
    … …  
    5656    <div class="col">
    5757      <div class="counter">
    58         <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona[0].deathsGlobal}}</i>
     58        <i class="fa fa-bug fa-2x" *ngIf="korona">{{korona.deathsGlobal}}</i>
    5959        <h2 class="timer count-title count-number"></h2>
    6060        <p class="count-text ">Смртни случаи глобално</p>

  • Farmatiko/ClientApp/src/app/korona/korona.component.ts

    rc73269d ree137aa  
    1 import { Component, OnInit, Inject } from '@angular/core';
    2 import { Pandemic } from '../models/Pandemic';
    3 import { MatTableDataSource } from '@angular/material/table';
    4 import { HttpClient } from '@angular/common/http';
     1import { Component, OnInit } from '@angular/core';
     2import { DataService } from '../shared/data.service';
     3import { IPandemic } from '../shared/interfaces';
    54
    65@Component({
    … …  
    109})
    1110export class KoronaComponent implements OnInit {
    12   public korona: Pandemic[];
     11  public korona: IPandemic;
    1312
    14   constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
    15     http.get<Pandemic[]>(baseUrl + 'Pandemic/Get?').subscribe(result => {
    16       this.korona = result;
    17       console.log(this.korona);
    18     }, error => console.error(error));
     13  constructor(private dataService: DataService) {
     14
    1915  }
    2016
    2117  ngOnInit(): void {
     18    this.dataService.getPandemic()
     19        .subscribe((res: IPandemic) => {
     20          this.korona = res;
     21        },
     22        (err: any) => console.log(err),
     23        () => console.log('Pandemic data retrieved'));
    2224  }
    2325

  • Farmatiko/ClientApp/src/app/login/login.component.html

    rc73269d ree137aa  
    66  <div class="example-container">
    77    <mat-form-field>
    8       <input matInput placeholder="Email" formControlName="email">
     8      <input matInput placeholder="Email" [(ngModel)]="this.email" formControlName="email">
    99    </mat-form-field>
    1010
    1111    <mat-form-field>
    12       <input matInput type="password" placeholder="Password" formControlName="password">   
     12      <input matInput type="password" placeholder="Password" [(ngModel)]="this.passwd" formControlName="password">   
    1313    </mat-form-field>
    1414
    15     <button [disabled]="!loginForm.valid" mat-raised-button color="primary" [routerLink]="['/dashboard']" mat-button>Најави се</button>
     15    <button [disabled]="!loginForm.valid" mat-raised-button color="primary" (click)="loginPharmacyHead()" mat-button>Најави се</button>
    1616  </div>
    1717</form>

  • Farmatiko/ClientApp/src/app/login/login.component.ts

    rc73269d ree137aa  
    11import { Component, OnInit } from '@angular/core';
    2 import { FormBuilder, FormGroup, FormControl, Validators, FormArray } from '@angular/forms';
     2import { FormGroup, FormControl, Validators } from '@angular/forms';
     3import { Router, ActivatedRoute } from '@angular/router';
     4import { DataService } from '../shared/data.service';
    35
    46@Component({
    … …  
    911export class LoginComponent implements OnInit {
    1012  loginForm: FormGroup;
     13  email: string;
     14  passwd: string;
     15  errorMessage: string;
    1116
    12   constructor() {
     17  constructor(private dataService: DataService,private router: Router, private route: ActivatedRoute) {
    1318    this.loginForm = new FormGroup({
    1419      email: new FormControl('', [Validators.required, Validators.email]),
    … …  
    2025  }
    2126
     27  loginPharmacyHead() {
     28    this.dataService.loginPharmacyHead(this.email, this.passwd)
     29                .subscribe((id: Number) => {
     30                  if(id) {
     31                    this.router.navigate(['/dashboard/' + id]);
     32                  }
     33                  else {
     34                    this.errorMessage = 'There was a problem signing in!';
     35                    console.log(this.errorMessage);
     36                  }
     37                },
     38                (err: any) => console.log(err));
     39  }
    2240}
Note: See TracChangeset for help on using the changeset viewer.