portal/src/app/components/questionset-list/questionset-list.component.html at 13c524afa30b65842c7a7e4531143ff256913b68 · Sunbird-inQuiry/portal · 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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<div class="px-30 mt-20" *ngIf="showLoader">
  <app-loader></app-loader>
</div>
<div class="d-flex dc-space-evenly mt-20 filter-panel">
  <div>
    <button mat-button [matMenuTriggerFor]="menu1">Show Filters: <mat-icon>keyboard_arrow_down</mat-icon>
    </button>
    <mat-menu #menu1="matMenu">
      <mat-grid-list cols="4" rowHeight="2:1">
        <mat-grid-tile>
          <mat-form-field appearance="fill">
            <mat-label>Board</mat-label>
            <mat-select>
              <mat-option value="one">CBSE</mat-option>
              <mat-option value="two">ICSE</mat-option>
            </mat-select>
          </mat-form-field>
        </mat-grid-tile>
    <mat-grid-tile>
      <mat-form-field appearance="fill">
        <mat-label>Medium</mat-label>
        <mat-select>
          <mat-option value="one">English</mat-option>
          <mat-option value="two">Hindi</mat-option>
        </mat-select>
      </mat-form-field>
    </mat-grid-tile>
    <mat-grid-tile>
      <mat-form-field appearance="fill">
        <mat-label>Grade</mat-label>
        <mat-select>
          <mat-option value="one">1st</mat-option>
          <mat-option value="two">2nd</mat-option>
        </mat-select>
      </mat-form-field>
    </mat-grid-tile>
    <mat-grid-tile>
      <mat-form-field appearance="fill">
        <mat-label>Subject</mat-label>
        <mat-select>
          <mat-option value="one">Hindi</mat-option>
          <mat-option value="two">Sanskrit</mat-option>
        </mat-select>
      </mat-form-field>
    </mat-grid-tile>
    <mat-grid-tile>
      <mat-form-field appearance="fill">
        <mat-label>Status</mat-label>
        <mat-select>
          <mat-option value="one">Live Draft</mat-option>
          <mat-option value="two">Sanskrit</mat-option>
        </mat-select>
      </mat-form-field>
      </mat-grid-tile>
      <mat-grid-tile>
        <mat-form-field appearance="fill">
          <mat-label>Content Type</mat-label>
          <mat-select>
            <mat-option value="one">Course</mat-option>
            <mat-option value="two">E-textbook</mat-option>
          </mat-select>
        </mat-form-field>
        </mat-grid-tile>
        <button mat-button color="Basic">Reset</button>
        <button mat-button color="primary">Apply</button>

    </mat-grid-list>

    </mat-menu>
  </div>
  <div>
    <button mat-button [matMenuTriggerFor]="menu">Sort by: <mat-icon>keyboard_arrow_down</mat-icon>
    </button>
    <mat-menu #menu="matMenu">
      <button mat-menu-item>Modified On</button>
      <button mat-menu-item>Created On</button>
    </mat-menu>
  </div>

</div>

<div class="px-30 mt-20" *ngIf="!showLoader">
  <div class="sb-table-container" *ngIf="questionsetList?.length">
    <table class="sb-table sb-table-hover">
      <thead>
        <tr>
          <th>Questionset Name</th>
          <th>Status</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let questionset of questionsetList let i = index" [id]="i"
          (click)="navigateToQuestionset(questionset.identifier, questionset.status)">
          <td>{{questionset?.name}}</td>
          <td>{{questionset?.status}}</td>
        </tr>
      </tbody>
    </table>
    <div class="py-30 ui grid">
      <div class="two wide column"></div>
      <div class="ten wide column">
        <div *ngIf="questionsetList && totalCount > PAGE_LIMIT">
          <div class="ui pagination menu my-30 right-floated" *ngIf="pager.pages.length ">
            <a [ngClass]="{disabled:pager.currentPage===1 }" class="item " tabindex="0"
              (click)="navigateToPage(1) ">First</a>
            <a [ngClass]="{disabled:pager.currentPage===1 }" class="item " tabindex="0"
              (click)="navigateToPage(pager.currentPage - 1)">Previous</a>
            <a *ngFor="let page of pager.pages" [ngClass]="{active:pager.currentPage===page}" tabindex="0"
              (click)="navigateToPage(page)" class="item">{{page}}</a>
            <a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" tabindex="0"
              (click)="navigateToPage(pager.currentPage + 1)" class="item">Next</a>
            <a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" tabindex="0"
              (click)="navigateToPage(pager.totalPages)" class="item ">Last</a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="ui grid" *ngIf="!questionsetList?.length">
    <div class="ten wide column">
      <div class="ui two column centered grid">
        <div class="d-flex flex-dc flex-jc-center flex-ai-center column">
          <img alt="" src="{{'assets/images/image/erroricon.png'}}">
          <div class="mt-16">Questionset not available</div>
        </div>
      </div>
    </div>
  </div>
</div>