ok/view-packages.component.html at main · akshatchhangani/ok · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<app-customer-layout></app-customer-layout>
<div style="text-align:center;">
  <h1>Packages</h1>
  <br />
  <div class="row">
    <div class="col-md-8" style="text-align:right">
      <label>Filter Packages Based On Package Category:</label>
    </div>
    <div class="col-md-2">
      <select class="form-control" #categorydrop (change)="searchPackageByCategory(categorydrop.value)">
        <option value="100">All Categoreies</option>
        <option *ngFor="let c of category" value={{c.pkgCategoryId}}>
          {{c.pkgCategoryName}}
        </option>
      </select>
    </div>
  </div>
</div>
<br />
<div class="container container-fluid" style="border: 4px solid #b0c4de;font-family:'Times New Roman', Times, serif">
  <div class="table-responsive">
    <table class="table table-striped"  *ngIf="filteredPackages && filteredPackages.length">
      <tbody>
        <tr style="background-color:rgba(220,230,242,1); font-size:12pt">
        </tr>
        <tr *ngFor="let package of filteredPackages" style="background-color:white">
          <td><div class="col"><button style="border:none" (click)="viewPackageDetails(package.pkgId,package.pkgName)" ><img title="Book Package" src="assets/leh.jpg"></button></div></td>
          <td style="text-align:left"><button class="btn btn-link" (click)="viewPackageDetails(package.pkgId,package.pkgName)" ><h4 style="color:black;font-weight:bold;">{{package.pkgName}}</h4></button><br /><p style="color:cornflowerblue;">&nbsp;&nbsp;&nbsp;{{package.pkgDescription}}</p> </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
<div *ngIf="showMsg" style="">
  <h4 class="jumbotron" style="text-align:center;">No packages available</h4>
</div>