source: Farmatiko/ClientApp/src/app/dashboard/dashboard.component.html@ c406ae5

Last change on this file since c406ae5 was de18858, checked in by Mile Jankuloski <mile.jankuloski@…>, 4 years ago

Prepared and improved components for data flows

  • Property mode set to 100644
File size: 6.5 KB
Line 
1<header>
2 <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
3 <div class="container">
4 <a class="navbar-brand" [routerLink]="['/dashboard']"><img src="../../assets/logo.png"></a>
5 <button class="navbar-toggler"
6 type="button"
7 data-toggle="collapse"
8 data-target=".navbar-collapse"
9 aria-label="Toggle navigation">
10 <span class="navbar-toggler-icon"></span>
11 </button>
12 <div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
13 <ul class="navbar-nav flex-grow">
14 <li>Logged as <!--{{head.Name}}--> </li>
15 </ul>
16 </div>
17
18 <button mat-button [matMenuTriggerFor]="menu"><mat-icon>more_vert</mat-icon></button>
19 <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>
22 </mat-menu>
23 </div>
24 </nav>
25</header>
26
27<mat-tab-group mat-stretch-tabs>
28 <mat-tab class="tab" label="Мои аптеки">
29 <div class="wrapper">
30 <div class="header">
31 <h2>Мои аптеки</h2>
32 <p *ngIf="!mypharmacies"><em>Loading...</em></p>
33 </div>
34 <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="true">
35 <thead>
36 <tr>
37 <th>Име</th>
38 <th>Локација</th>
39 <th>Адреса</th>
40 <th>Работи 24/7</th>
41 <th>Actions</th>
42 </tr>
43 </thead>
44 <tbody>
45 <tr *ngFor="let pharmacies of mypharmacies">
46 <td>{{pharmacies.name}}</td>
47 <td>{{pharmacies.location}}</td>
48 <td>{{pharmacies.address}}</td>
49 <td>{{pharmacies.workAllTime}}</td>
50 <td><a (click)="works24hrs(pharmacies)">Работи 24/7</a> | <a (click)="doesntWork24hrs(pharmacies)">Не работи 24/7</a></td>
51 </tr>
52 </tbody>
53 </table>
54 </div>
55 </mat-tab>
56 <mat-tab class="tab" label="Сите аптеки">
57 <div class="wrapper">
58 <div class="header">
59 <h2>Сите аптеки</h2>
60 <mat-form-field>
61 <input matInput (keyup)="applyFilterPharmacies($event.target.value)" placeholder="Пронајди аптека">
62 </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>
89 </div>
90 </mat-tab>
91 </mat-tab-group>
92
93 <div class="statusbar">{{status}}</div>
94
95<div class="wrapper">
96 <div class="header">
97 <h2>Достапни лекови</h2>
98 <mat-form-field>
99 <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди лек">
100 </mat-form-field>
101 </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>
147</div>
Note: See TracBrowser for help on using the repository browser.