Added .component syntax in ng-xos-lib
Change-Id: Icc6ff26cff1369038cc9684612f742af0a78c799
diff --git a/src/ui_components/smartComponents/smartPie/smartPie.component.js b/src/ui_components/smartComponents/smartPie/smartPie.component.js
index f8a3985..2276b5d 100644
--- a/src/ui_components/smartComponents/smartPie/smartPie.component.js
+++ b/src/ui_components/smartComponents/smartPie/smartPie.component.js
@@ -172,77 +172,75 @@
</file>
</example>
*/
- .directive('xosSmartPie', function(){
- return {
- restrict: 'E',
- scope: {
- config: '='
- },
- template: `
- <canvas
- class="chart chart-pie {{vm.config.classes}}"
- chart-data="vm.data" chart-labels="vm.labels"
- chart-legend="{{vm.config.legend}}">
- </canvas>
- `,
- bindToController: true,
- controllerAs: 'vm',
- controller: function($injector, $interval, $scope, $timeout, _){
+ .component('xosSmartPie', {
+ restrict: 'E',
+ bindings: {
+ config: '='
+ },
+ template: `
+ <canvas
+ class="chart chart-pie {{vm.config.classes}}"
+ chart-data="vm.data" chart-labels="vm.labels"
+ chart-legend="{{vm.config.legend}}">
+ </canvas>
+ `,
+ bindToController: true,
+ controllerAs: 'vm',
+ controller: function($injector, $interval, $scope, $timeout, _){
- if(!this.config.resource && !this.config.data){
- throw new Error('[xosSmartPie] Please provide a resource or an array of data in the configuration');
- }
-
- const groupData = (data) => _.groupBy(data, this.config.groupBy);
- const formatData = (data) => _.reduce(Object.keys(data), (list, group) => list.concat(data[group].length), []);
- const formatLabels = (data) => angular.isFunction(this.config.labelFormatter) ? this.config.labelFormatter(Object.keys(data)) : Object.keys(data);
-
- const prepareData = (data) => {
- // group data
- let grouped = groupData(data);
- this.data = formatData(grouped);
- // create labels
- this.labels = formatLabels(grouped);
- }
-
- if(this.config.resource){
-
- this.Resource = $injector.get(this.config.resource);
- const getData = () => {
- this.Resource.query().$promise
- .then((res) => {
-
- if(!res[0]){
- return;
- }
-
- prepareData(res);
- });
- }
-
- getData();
-
- if(this.config.poll){
- $interval(() => {getData()}, this.config.poll * 1000)
- }
- }
- else {
- $scope.$watch(() => this.config.data, (data) => {
- if(data){
- prepareData(this.config.data);
- }
- }, true);
- }
-
- $scope.$on('create', function (event, chart) {
- console.log(`create: ${chart.id}`);
- });
-
- $scope.$on('destroy', function (event, chart) {
- console.log(`destroy: ${chart.id}`);
- });
-
+ if(!this.config.resource && !this.config.data){
+ throw new Error('[xosSmartPie] Please provide a resource or an array of data in the configuration');
}
- };
+
+ const groupData = (data) => _.groupBy(data, this.config.groupBy);
+ const formatData = (data) => _.reduce(Object.keys(data), (list, group) => list.concat(data[group].length), []);
+ const formatLabels = (data) => angular.isFunction(this.config.labelFormatter) ? this.config.labelFormatter(Object.keys(data)) : Object.keys(data);
+
+ const prepareData = (data) => {
+ // group data
+ let grouped = groupData(data);
+ this.data = formatData(grouped);
+ // create labels
+ this.labels = formatLabels(grouped);
+ }
+
+ if(this.config.resource){
+
+ this.Resource = $injector.get(this.config.resource);
+ const getData = () => {
+ this.Resource.query().$promise
+ .then((res) => {
+
+ if(!res[0]){
+ return;
+ }
+
+ prepareData(res);
+ });
+ }
+
+ getData();
+
+ if(this.config.poll){
+ $interval(() => {getData()}, this.config.poll * 1000)
+ }
+ }
+ else {
+ $scope.$watch(() => this.config.data, (data) => {
+ if(data){
+ prepareData(this.config.data);
+ }
+ }, true);
+ }
+
+ $scope.$on('create', function (event, chart) {
+ console.log(`create: ${chart.id}`);
+ });
+
+ $scope.$on('destroy', function (event, chart) {
+ console.log(`destroy: ${chart.id}`);
+ });
+
+ }
});
})();