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
| | import { TdDataTableService, TdDataTableSortingOrder, ITdDataTableSortChangeEvent, ITdDataTableColumn } from '@covalent/core';
| | import { IPageChangeEvent } from '@covalent/core';
| | import { Component, AfterViewInit } from '@angular/core';
| | import { TdMediaService } from '@covalent/core';
| | import { PacksService } from './resources/packs';
| |
| | var pack_example = {
| | id: 7,
| | code: 'DX250000',
| | status: 'AC',
| | application_name: 'Doxr',
| | created_by_id: 'admin',
| | created_by_name: 'Administrator (admin)',
| | creation_timestamp: 1440597540000,
| | end_valid_date: 2051222400000,
| | init_valid_date: 1440547200000,
| | license_preactivation: true,
| | license_type_id: 5,
| | licensetype_code: 'DXL3',
| | metadata:
| | [ { key: 'max_docs',
| | value: '250000',
| | readonly: true,
| | mandatory: true,
| | pack_id: 7 } ],
| | num_activations: 7,
| | num_available: -2,
| | num_creations: 7,
| | num_licenses: 5,
| | organization_id: 2,
| | organization_name: 'CurisTec',
| | preactivation_valid_period: 70,
| | renew_valid_period: 0,
| | }
| |
| | @Component({
| | selector: 'pack-list',
| | templateUrl: 'src/app/pack.list.component.html'
| | })
| | export class PackListComponent implements AfterViewInit {
| | data: any[] = [];
| | columns: ITdDataTableColumn[] = [
| | { name: 'code', label: 'Code', tooltip: 'License pack code' },
| | { name: 'application_name', label: 'App name' },
| | { name: 'licensetype_code', label: 'License type' },
| | { name: 'organization_name', label: 'Organization' },
| | { name: 'num_licenses', label: 'Lic', numeric: true, tooltip: 'Initial pack licenses' },
| | { name: 'num_available', label: 'Ava', numeric: true, tooltip: 'Available licenses' },
| | ];
| |
| | filteredData: any[] = this.data;
| | filteredTotal: number = this.data.length;
| |
| | searchTerm: string = '';
| | fromRow: number = 1;
| | currentPage: number = 1;
| | pageSize: number = 10;
| | sortBy: string = 'application_name';
| | sortOrder: TdDataTableSortingOrder = TdDataTableSortingOrder.Descending;
| | filteredItems = this.data.length;
| |
| | constructor(private _dataTableService: TdDataTableService,
| | private media: TdMediaService,
| | private packs: PacksService) {
| | this.packs.get().subscribe(
| | list => {
| | this.data = list;
| | this.filter();
| | },
| | err => console.error(err)
| | );
| | }
| |
| | ngOnInit(): void {
| | this.filter();
| | }
| |
| | createPack() : void {
| |
| | }
| |
| | sort(sortEvent: ITdDataTableSortChangeEvent): void {
| | this.sortBy = sortEvent.name;
| | this.sortOrder = sortEvent.order;
| | this.filter();
| | }
| |
| | search(searchTerm: string): void {
| | this.searchTerm = searchTerm;
| | this.filter();
| | }
| |
| | page(pagingEvent: IPageChangeEvent): void {
| | this.fromRow = pagingEvent.fromRow;
| | this.currentPage = pagingEvent.page;
| | this.pageSize = pagingEvent.pageSize;
| | this.filter();
| | }
| |
| | loadData() {
| |
| | }
| |
| | filter(): void {
| | let newData: any[] = this.data;
| | newData = this._dataTableService.filterData(newData, this.searchTerm, true);
| | this.filteredTotal = newData.length;
| | this.filteredItems = newData.length;
| | newData = this._dataTableService.sortData(newData, this.sortBy, this.sortOrder);
| | newData = this._dataTableService.pageData(newData, this.fromRow, this.currentPage * this.pageSize);
| | this.filteredData = newData;
| | }
| |
| | ngAfterViewInit(): void {
| | this.media.broadcast();
| |
| | }
| | }
|
|
