1window.angular && (function(angular) { 2 'use strict'; 3 4 /** 5 * 6 * Controller for bmcTable Component 7 * 8 * To use: 9 * The <bmc-table> component expects a 'model' attribute 10 * that will contain all the data needed to render the table. 11 * 12 * The model object should contain 'header', 'data', and 'actions' 13 * properties. 14 * 15 * model: { 16 * header: <string>[], // Array of header labels 17 * data: <any>[], // Array of each row object 18 * actions: <string>[] // Array of action labels 19 * } 20 * 21 * The header property will render each label as a <th> in the table. 22 * 23 * The data property will render each item as a <tr> in the table. 24 * Each row object in the model.data array should also have a 'uiData' 25 * property that should be an array of the properties that will render 26 * as each table cell <td>. 27 * 28 * The actions property will render into clickable buttons at the end 29 * of each row. 30 * When a user clicks an action button, the component 31 * will emit the action label with the associated row object. 32 * 33 */ 34 const TableController = function() { 35 /** 36 * Init model data 37 * @param {any} model : table model object 38 * @returns : table model object with defaults 39 */ 40 const setModel = (model) => { 41 model.header = model.header === undefined ? [] : model.header; 42 model.data = model.data === undefined ? [] : model.data; 43 model.data = model.data.map((row) => { 44 if (row.uiData === undefined) { 45 row.uiData = []; 46 } 47 return row; 48 }) 49 model.actions = model.actions === undefined ? [] : model.actions; 50 51 if (model.actions.length > 0) { 52 // If table actions were provided, push an empty 53 // string to the header array to account for additional 54 // table actions cell 55 model.header.push(''); 56 } 57 return model; 58 }; 59 60 /** 61 * Callback when table row action clicked 62 * Emits user desired action and associated row data to 63 * parent controller 64 * @param {string} action : action type 65 * @param {any} row : user object 66 */ 67 this.onClickAction = (action, row) => { 68 if (action !== undefined && row !== undefined) { 69 const value = {action, row}; 70 this.emitAction({value}); 71 } 72 }; 73 74 /** 75 * onInit Component lifecycle hooked 76 */ 77 this.$onInit = () => { 78 this.model = setModel(this.model); 79 }; 80 }; 81 82 /** 83 * Register bmcTable component 84 */ 85 angular.module('app.common.components').component('bmcTable', { 86 template: require('./table.html'), 87 controller: TableController, 88 bindings: {model: '<', emitAction: '&'} 89 }) 90})(window.angular); 91