blob: dba740e51817f7496f6e323fcc8f7a8367006e83 [file] [log] [blame]
Matteo Scandolo9f87f302016-12-13 18:11:10 -08001// TODO fininsh to import all methods from https://github.com/opencord/ng-xos-lib/blob/master/src/ui_components/dumbComponents/table/table.component.js
2// TODO import tests
3
Matteo Scandolo035c5932016-12-14 09:55:15 -08004import './table.scss';
Matteo Scandolo9f87f302016-12-13 18:11:10 -08005import * as _ from 'lodash';
6
Matteo Scandolod58d5042016-12-16 16:59:21 -08007enum EXosTableColType {
8 'boolean',
9 'array',
10 'object',
11 'custom',
12 'date' ,
13 'icon'
14}
15
16export interface IXosTableColumn {
17 label: string;
18 prop: string;
19 type?: string; // understand why enum does not work
20 formatter?(item: any): string;
21 link?(item: any): string;
22}
23
Matteo Scandolo9f87f302016-12-13 18:11:10 -080024interface IXosTableCgfOrder {
25 reverse: boolean;
26 field: string;
27}
28
29export interface IXosTableCfg {
30 columns: any[];
Matteo Scandolof2c3ed62016-12-15 14:32:50 -080031 order?: IXosTableCgfOrder; // | boolean;
Matteo Scandolo9f87f302016-12-13 18:11:10 -080032}
33
34class TableCtrl {
35 $inject = ['$onInit'];
36
37 public columns: any[];
38 public orderBy: string;
39 public reverse: boolean;
Matteo Scandolo266907e2016-12-20 13:41:42 -080040 public classes: string;
Matteo Scandolo9f87f302016-12-13 18:11:10 -080041 private config: IXosTableCfg;
42
43
44 $onInit() {
Matteo Scandolo266907e2016-12-20 13:41:42 -080045
46 this.classes = 'table table-striped'; // table-bordered
47
Matteo Scandolo9f87f302016-12-13 18:11:10 -080048 if (!this.config) {
49 throw new Error('[xosTable] Please provide a configuration via the "config" attribute');
50 }
51
52 if (!this.config.columns) {
53 throw new Error('[xosTable] Please provide a columns list in the configuration');
54 }
55
56 // handle default ordering
Matteo Scandolo035c5932016-12-14 09:55:15 -080057 if (this.config.order && angular.isObject(this.config.order)) {
Matteo Scandolo9f87f302016-12-13 18:11:10 -080058 this.reverse = this.config.order.reverse || false;
59 this.orderBy = this.config.order.field || 'id';
60 }
61
62 // if columns with type 'custom' are provided
Matteo Scandolo035c5932016-12-14 09:55:15 -080063 // check that a custom formatter is provided too
Matteo Scandolo9f87f302016-12-13 18:11:10 -080064 let customCols = _.filter(this.config.columns, {type: 'custom'});
65 if (angular.isArray(customCols) && customCols.length > 0) {
66 _.forEach(customCols, (col) => {
67 if (!col.formatter || !angular.isFunction(col.formatter)) {
68 throw new Error('[xosTable] You have provided a custom field type, a formatter function should provided too.');
69 }
70 });
71 }
72
73 // if columns with type 'icon' are provided
Matteo Scandolo035c5932016-12-14 09:55:15 -080074 // check that a custom formatter is provided too
Matteo Scandolo9f87f302016-12-13 18:11:10 -080075 let iconCols = _.filter(this.config.columns, {type: 'icon'});
76 if (angular.isArray(iconCols) && iconCols.length > 0) {
77 _.forEach(iconCols, (col) => {
78 if (!col.formatter || !angular.isFunction(col.formatter)) {
79 throw new Error('[xosTable] You have provided an icon field type, a formatter function should provided too.');
80 }
81 });
82 }
83
84 // if a link property is passed,
85 // it should be a function
86 let linkedColumns = _.filter(this.config.columns, col => angular.isDefined(col.link));
87 if (angular.isArray(linkedColumns) && linkedColumns.length > 0) {
88 _.forEach(linkedColumns, (col) => {
89 if (!angular.isFunction(col.link)) {
90 throw new Error('[xosTable] The link property should be a function.');
91 }
92 });
93 }
94
95 this.columns = this.config.columns;
96
97 }
98}
99
100export const xosTable: angular.IComponentOptions = {
101 template: require('./table.html'),
102 controllerAs: 'vm',
103 controller: TableCtrl,
104 bindings: {
105 data: '=',
106 config: '='
107 }
108};