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

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

Handled REST API calls, searchbars and paginators implemented, overall frontend improvment
  • Property mode set to 100644
File size: 5.9 KB
RevLine 
[785b8bd]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">
[ef1219a]4 <a class="navbar-brand" [routerLink]="['/dashboard']"><img src="../../assets/logo.png"></a>
[785b8bd]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 ...</li>
15 </ul>
16 </div>
[ef1219a]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>
[785b8bd]23 </div>
24 </nav>
25</header>
26
[ef1219a]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 </div>
[785b8bd]33 <table class='table table-striped table-bordered table-sm' cellspacing="0" width="100%" aria-labelledby="tableLabel" *ngIf="true">
34 <thead>
35 <tr>
36 <th>Placeholder1</th>
37 <th>Placeholder2</th>
38 <th>Placeholder3</th>
39 <th>Placeholder4</th>
40 </tr>
41 </thead>
42 <tbody>
[ef1219a]43 <tr *ngFor="let facility of facilities">
[785b8bd]44 <td>data1</td>
45 <td>data2</td>
46 <td>data3</td>
47 <td>data4</td>
48 </tr>
49 </tbody>
50 </table>
51 </div>
[ef1219a]52 </mat-tab>
53 <mat-tab class="tab" label="Сите аптеки">
54 <div class="wrapper">
55 <div class="header">
56 <h2>Сите аптеки</h2>
57 <mat-form-field>
58 <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди аптека">
59 </mat-form-field>
60 </div>
61 <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
62 <ng-container matColumnDef="Име">
63 <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
64 <td mat-cell *matCellDef="let facilities"> {{facilities.name}} </td>
65 </ng-container>
66
67 <ng-container matColumnDef="Општина">
68 <th mat-header-cell *matHeaderCellDef mat-sort-header> Општина </th>
69 <td mat-cell *matCellDef="let facilities"> {{facilities.municipality}} </td>
70 </ng-container>
71
72 <ng-container matColumnDef="Адреса">
73 <th mat-header-cell *matHeaderCellDef mat-sort-header> Адреса </th>
74 <td mat-cell *matCellDef="let facilities"> {{facilities.address}} </td>
75 </ng-container>
76
77 <ng-container matColumnDef="Тип">
78 <th mat-header-cell *matHeaderCellDef mat-sort-header> Тип </th>
79 <td mat-cell *matCellDef="let facilities"> {{facilities.type}} </td>
80 </ng-container>
81
82 <ng-container matColumnDef="Е-пошта">
83 <th mat-header-cell *matHeaderCellDef mat-sort-header> Е-пошта </th>
84 <td mat-cell *matCellDef="let facilities"> {{facilities.email}} </td>
85 </ng-container>
86
87 <ng-container matColumnDef="Телефон">
88 <th mat-header-cell *matHeaderCellDef mat-sort-header> Телефон </th>
89 <td mat-cell *matCellDef="let facilities"> {{facilities.phone}} </td>
90 </ng-container>
91
92 <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
93 <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
94 </table>
95 <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
96 </div>
97 </mat-tab>
98 </mat-tab-group>
99
100<div class="wrapper">
101 <div class="header">
102 <h2>Достапни лекови</h2>
103 <mat-form-field>
104 <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди лек">
105 </mat-form-field>
106 </div>
107 <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
108 <ng-container matColumnDef="Име">
109 <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
110 <td mat-cell *matCellDef="let facilities"> {{facilities.name}} </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 facilities"> {{facilities.municipality}} </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 facilities"> {{facilities.address}} </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 facilities"> {{facilities.type}} </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 facilities"> {{facilities.email}} </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 facilities"> {{facilities.phone}} </td>
136 </ng-container>
137
138 <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
139 <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
140 </table>
141 <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
142</div>
Note: See TracBrowser for help on using the repository browser.