blob: 1ed258dc3b1fc082bdf5ee61770e2532dbaabc95 [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 {
Matteo Scandolod62ea792016-12-22 14:02:28 -080025 reverse?: boolean;
Matteo Scandolo9f87f302016-12-13 18:11:10 -080026 field: string;
27}
28
29export interface IXosTableCfg {
30 columns: any[];
Matteo Scandolod62ea792016-12-22 14:02:28 -080031 order?: IXosTableCgfOrder;
32 filter?: string;
33 actions?: any[]; // TODO create interface
Matteo Scandolo9f87f302016-12-13 18:11:10 -080034}
35
36class TableCtrl {
37 $inject = ['$onInit'];
38
39 public columns: any[];
40 public orderBy: string;
41 public reverse: boolean;
Matteo Scandolo266907e2016-12-20 13:41:42 -080042 public classes: string;
Matteo Scandolo9f87f302016-12-13 18:11:10 -080043 private config: IXosTableCfg;
44
45
46 $onInit() {
Matteo Scandolo266907e2016-12-20 13:41:42 -080047
48 this.classes = 'table table-striped'; // table-bordered
49
Matteo Scandolo9f87f302016-12-13 18:11:10 -080050 if (!this.config) {
51 throw new Error('[xosTable] Please provide a configuration via the "config" attribute');
52 }
53
54 if (!this.config.columns) {
55 throw new Error('[xosTable] Please provide a columns list in the configuration');
56 }
57
58 // handle default ordering
Matteo Scandolo035c5932016-12-14 09:55:15 -080059 if (this.config.order && angular.isObject(this.config.order)) {
Matteo Scandolo9f87f302016-12-13 18:11:10 -080060 this.reverse = this.config.order.reverse || false;
61 this.orderBy = this.config.order.field || 'id';
62 }
63
64 // if columns with type 'custom' are provided
Matteo Scandolo035c5932016-12-14 09:55:15 -080065 // check that a custom formatter is provided too
Matteo Scandolo9f87f302016-12-13 18:11:10 -080066 let customCols = _.filter(this.config.columns, {type: 'custom'});
67 if (angular.isArray(customCols) && customCols.length > 0) {
68 _.forEach(customCols, (col) => {
69 if (!col.formatter || !angular.isFunction(col.formatter)) {
70 throw new Error('[xosTable] You have provided a custom field type, a formatter function should provided too.');
71 }
72 });
73 }
74
75 // if columns with type 'icon' are provided
Matteo Scandolo035c5932016-12-14 09:55:15 -080076 // check that a custom formatter is provided too
Matteo Scandolo9f87f302016-12-13 18:11:10 -080077 let iconCols = _.filter(this.config.columns, {type: 'icon'});
78 if (angular.isArray(iconCols) && iconCols.length > 0) {
79 _.forEach(iconCols, (col) => {
80 if (!col.formatter || !angular.isFunction(col.formatter)) {
81 throw new Error('[xosTable] You have provided an icon field type, a formatter function should provided too.');
82 }
83 });
84 }
85
86 // if a link property is passed,
87 // it should be a function
88 let linkedColumns = _.filter(this.config.columns, col => angular.isDefined(col.link));
89 if (angular.isArray(linkedColumns) && linkedColumns.length > 0) {
90 _.forEach(linkedColumns, (col) => {
91 if (!angular.isFunction(col.link)) {
92 throw new Error('[xosTable] The link property should be a function.');
93 }
94 });
95 }
96
97 this.columns = this.config.columns;
98
99 }
100}
101
102export const xosTable: angular.IComponentOptions = {
103 template: require('./table.html'),
104 controllerAs: 'vm',
105 controller: TableCtrl,
106 bindings: {
107 data: '=',
108 config: '='
109 }
110};