Claim refactor

modules/claim/front/action/index.js

@@ -1,16 +1,12 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+export default class Controller extends Section {
-    constructor($stateParams, $scope, $http, $translate, vnApp, $httpParamSerializer) {
+    constructor($element, $) {
-        this.$stateParams = $stateParams;
+        super($element, $);
-        this.$ = $scope;
-        this.$http = $http;
-        this.$translate = $translate;
-        this.vnApp = vnApp;
-        this.$httpParamSerializer = $httpParamSerializer;
         this.filter = {
-            where: {claimFk: $stateParams.id},
+            where: {claimFk: this.$params.id},
             include: [
                 {relation: 'sale',
                     scope: {
@@ -34,9 +30,7 @@ class Controller {
     }
 
     getClaimedSales() {
-        let json = encodeURIComponent(JSON.stringify(this.claim.id));
+        let query = `ClaimBeginnings/${this.claim.id}`;
-
-        let query = `ClaimBeginnings/${json}`;
         this.$http.get(query).then(res => {
             if (res.data)
                 this.claimedSales = res.data;
@@ -54,8 +48,7 @@ class Controller {
     }
 
     deleteClaimedSale(id) {
-        let json = encodeURIComponent(JSON.stringify(id));
+        let query = `ClaimEnds/${id}`;
-        let query = `ClaimEnds/${json}`;
         this.$http.delete(query).then(() => {
             this.$.model.refresh();
             this.vnApp.showSuccess(this.$translate.instant('Data saved!'));
@@ -63,7 +56,7 @@ class Controller {
     }
 
     importToNewRefundTicket() {
-        let query = `ClaimBeginnings/${this.$stateParams.id}/importToNewRefundTicket`;
+        let query = `ClaimBeginnings/${this.$params.id}/importToNewRefundTicket`;
         return this.$http.post(query).then(() => {
             this.$.model.refresh();
             this.vnApp.showSuccess(this.$translate.instant('Data saved!'));
@@ -112,7 +105,7 @@ class Controller {
     }
 
     importTicketLines(ticketFk) {
-        let data = {claimFk: this.$stateParams.id, ticketFk: ticketFk};
+        let data = {claimFk: this.$params.id, ticketFk: ticketFk};
 
         let query = `ClaimEnds/importTicketSales`;
         this.$http.post(query, data).then(() => {
@@ -123,7 +116,7 @@ class Controller {
     }
 
     regularize() {
-        let data = {claimFk: this.$stateParams.id};
+        let data = {claimFk: this.$params.id};
         let query = `Claims/regularizeClaim`;
         return this.$http.post(query, data).then(() => {
             if (this.claim.responsibility >= Math.ceil(this.maxResponsibility) / 2)
@@ -137,9 +130,8 @@ class Controller {
 
     getGreugeTypeId() {
         const params = {filter: {where: {code: 'freightPickUp'}}};
-        const serializedParams = this.$httpParamSerializer(params);
+        const query = `GreugeTypes/findOne`;
-        const query = `GreugeTypes/findOne?${serializedParams}`;
+        return this.$http.get(query, {params}).then(res => {
-        return this.$http.get(query).then(res => {
             this.greugeTypeFreightId = res.data.id;
 
             return res;
@@ -188,7 +180,7 @@ class Controller {
     }
 
     saveResponsibility(value) {
-        let query = `Claims/${this.$stateParams.id}/updateClaimAction`;
+        let query = `Claims/${this.$params.id}/updateClaimAction`;
 
         this.$http.post(query, {responsibility: value}).then(() => {
             this.vnApp.showSuccess(this.$translate.instant('Data saved!'));
@@ -196,7 +188,7 @@ class Controller {
     }
 
     saveMana(value) {
-        let query = `Claims/${this.$stateParams.id}/updateClaimAction`;
+        let query = `Claims/${this.$params.id}/updateClaimAction`;
 
         this.$http.post(query, {isChargedToMana: value}).then(() => {
             this.vnApp.showSuccess(this.$translate.instant('Data saved!'));
@@ -208,7 +200,7 @@ class Controller {
     }
 }
 
-Controller.$inject = ['$stateParams', '$scope', '$http', '$translate', 'vnApp', '$httpParamSerializer'];
+Controller.$inject = ['$element', '$scope'];
 
 ngModule.component('vnClaimAction', {
     template: require('./index.html'),

modules/claim/front/action/index.spec.js

@@ -18,7 +18,8 @@ describe('claim', () => {
             $state = _$state_;
             $state.params.id = 1;
 
-            controller = $componentController('vnClaimAction', {$state, $scope});
+            const $element = angular.element('<vn-claim-action></vn-claim-action>');
+            controller = $componentController('vnClaimAction', {$element, $scope});
             controller.claim = {ticketFk: 1};
             controller.$.model = {refresh: () => {}};
             controller.$.addSales = {

modules/claim/front/basic-data/index.html

@@ -2,7 +2,7 @@
     vn-id="watcher"
     data="$ctrl.claim"
     form="form"
-    url="Claims/{{$ctrl.$stateParams.id}}/updateClaim"
+    url="Claims/{{$ctrl.$params.id}}/updateClaim"
     save="post">
 </vn-watcher>
 <form name="form" ng-submit="$ctrl.onSubmit()" class="vn-w-md">
@@ -55,6 +55,9 @@
     </vn-card>
     <vn-button-bar>
         <vn-submit label="Save"></vn-submit>
-        <vn-button label="Undo changes" ng-if="$ctrl.$scope.form.$dirty" ng-click="watcher.loadOriginalData()"></vn-button>
+        <vn-button label="Undo changes" 
+            ng-if="$ctrl.$.form.$dirty" 
+            ng-click="watcher.loadOriginalData()">
+        </vn-button>
     </vn-button-bar>
 </form>

modules/claim/front/basic-data/index.js

@@ -1,24 +1,16 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+class Controller extends Section {
-    constructor($scope, $state, aclService) {
-        this.$scope = $scope;
-        this.$state = $state;
-        this.$stateParams = $state.params;
-        this.aclService = aclService;
-    }
-
     onSubmit() {
-        this.$scope.watcher.submit().then(() => {
+        this.$.watcher.submit().then(() => {
             if (this.aclService.hasAny(['salesAssistant']))
                 this.$state.go('claim.card.detail');
         });
     }
 }
 
-Controller.$inject = ['$scope', '$state', 'aclService'];
-
 ngModule.component('vnClaimBasicData', {
     template: require('./index.html'),
     controller: Controller,

modules/claim/front/basic-data/index.spec.js

@@ -11,12 +11,13 @@ describe('Claim', () => {
         beforeEach(angular.mock.inject(($componentController, $rootScope) => {
             $scope = $rootScope.$new();
             $scope.watcher = watcher;
-            let aclService = {hasAny: () => true};
+            const $element = angular.element('<vn-claim-basic-data></vn-claim-basic-data>');
-            controller = $componentController('vnClaimBasicData', {$scope, aclService});
+            controller = $componentController('vnClaimBasicData', {$element, $scope});
         }));
 
         describe('onSubmit()', () => {
             it(`should redirect to 'claim.card.detail' state`, () => {
+                jest.spyOn(controller.aclService, 'hasAny').mockReturnValue(true);
                 jest.spyOn(controller.$state, 'go');
                 controller.onSubmit();
 

modules/claim/front/detail/index.js

@@ -1,17 +1,13 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+class Controller extends Section {
-    constructor($state, $, $http, $translate, vnApp, aclService) {
+    constructor($element, $) {
-        this.$state = $state;
+        super($element, $);
-        this.$ = $;
-        this.$http = $http;
-        this.$translate = $translate;
-        this.vnApp = vnApp;
-        this.aclService = aclService;
         this.edit = {};
         this.filter = {
-            where: {claimFk: $state.params.id},
+            where: {claimFk: this.$params.id},
             include: [
                 {
                     relation: 'sale',
@@ -173,7 +169,7 @@ class Controller {
     }
 }
 
-Controller.$inject = ['$state', '$scope', '$http', '$translate', 'vnApp', 'aclService'];
+Controller.$inject = ['$element', '$scope'];
 
 ngModule.component('vnClaimDetail', {
     template: require('./index.html'),

modules/claim/front/detail/index.spec.js

@@ -6,12 +6,10 @@ describe('claim', () => {
         let $scope;
         let controller;
         let $httpBackend;
-        let $state;
-        let aclService;
 
         beforeEach(ngModule('claim'));
 
-        beforeEach(angular.mock.inject(($componentController, _$state_, _$httpBackend_, $rootScope) => {
+        beforeEach(angular.mock.inject(($componentController, _$httpBackend_, $rootScope) => {
             $scope = $rootScope.$new();
             $scope.descriptor = {
                 show: () => {}
@@ -19,9 +17,8 @@ describe('claim', () => {
             $httpBackend = _$httpBackend_;
             $httpBackend.whenGET('Claims/ClaimBeginnings').respond({});
             $httpBackend.whenGET(`Tickets/1/isEditable`).respond(true);
-            $state = _$state_;
+            const $element = angular.element('<vn-claim-detail></vn-claim-detail>');
-            aclService = {hasAny: () => true};
+            controller = $componentController('vnClaimDetail', {$element, $scope});
-            controller = $componentController('vnClaimDetail', {$state, aclService, $scope});
             controller.claim = {ticketFk: 1};
             controller.salesToClaim = [{saleFk: 1}, {saleFk: 2}];
             controller.salesClaimed = [{id: 1, sale: {}}];
@@ -33,6 +30,7 @@ describe('claim', () => {
             controller.$.editPopover = {
                 hide: () => {}
             };
+            jest.spyOn(controller.aclService, 'hasAny').mockReturnValue(true);
         }));
 
         describe('openAddSalesDialog()', () => {
@@ -111,7 +109,6 @@ describe('claim', () => {
                     quantity: 10}};
                 controller.newDiscount = 10;
 
-
                 jest.spyOn(controller.vnApp, 'showSuccess');
                 jest.spyOn(controller, 'calculateTotals');
                 jest.spyOn(controller, 'clearDiscount');

modules/claim/front/development/index.html

@@ -2,7 +2,7 @@
     vn-id="model"
     url="ClaimDevelopments"
     fields="['id', 'claimFk', 'claimReasonFk', 'claimResultFk', 'claimResponsibleFk', 'workerFk', 'claimRedeliveryFk']"
-    link="{claimFk: $ctrl.$state.params.id}"
+    link="{claimFk: $ctrl.$params.id}"
     filter="$ctrl.filter"
     data="claimDevelopments"
     auto-load="true">

modules/claim/front/development/index.js

@@ -1,18 +1,13 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+class Controller extends Section {
-    constructor($state, $scope, aclService) {
-        this.$state = $state;
-        this.$scope = $scope;
-        this.aclService = aclService;
-    }
-
     onSubmit() {
-        this.$scope.watcher.check();
+        this.$.watcher.check();
-        this.$scope.model.save().then(() => {
+        this.$.model.save().then(() => {
-            this.$scope.watcher.notifySaved();
+            this.$.watcher.notifySaved();
-            this.$scope.watcher.updateOriginalData();
+            this.$.watcher.updateOriginalData();
 
             if (this.aclService.hasAny(['salesAssistant']))
                 this.$state.go('claim.card.action');
@@ -20,8 +15,6 @@ class Controller {
     }
 }
 
-Controller.$inject = ['$state', '$scope', 'aclService'];
-
 ngModule.component('vnClaimDevelopment', {
     template: require('./index.html'),
     controller: Controller,

modules/claim/front/development/index.spec.js

@@ -6,7 +6,6 @@ describe('Claim', () => {
     describe('Component vnClaimDevelopment', () => {
         let controller;
         let $scope;
-        let aclService;
 
         beforeEach(ngModule('claim'));
 
@@ -14,13 +13,15 @@ describe('Claim', () => {
             $scope = $rootScope.$new();
             $scope.watcher = watcher;
             $scope.model = crudModel;
-            aclService = {hasAny: () => true};
+            const $element = angular.element('<vn-claim-development></vn-claim-development>');
-            controller = $componentController('vnClaimDevelopment', {$scope, aclService});
+            controller = $componentController('vnClaimDevelopment', {$element, $scope});
         }));
 
         describe('onSubmit()', () => {
             it(`should redirect to 'claim.card.action' state`, () => {
+                jest.spyOn(controller.aclService, 'hasAny').mockReturnValue(true);
                 jest.spyOn(controller.$state, 'go');
+
                 controller.onSubmit();
 
                 expect(controller.$state.go).toHaveBeenCalledWith('claim.card.action');

modules/claim/front/dms/style.scss

@@ -1,31 +0,0 @@
-@import "./variables";
-
-vn-claim-dms-index {
-    .drop-zone {
-        color: $color-font-secondary;
-        box-sizing: border-box;
-        border-radius: 0.5em;
-        text-align: center;
-        min-height: 100%;
-        
-        .empty-rows {
-            padding: 5em $spacing-md;
-            font-size: 1.4em
-        }
-
-        vn-icon {
-            font-size: 3em
-        }
-    }
-
-    .photo-list {
-        
-        padding: $spacing-md;
-        min-height: 100%;
-
-        .photo {
-            width: 32em;
-            height: 18em;
-        }
-    }
-}

modules/claim/front/index/index.js

@@ -1,11 +1,7 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 
-export default class Controller {
+export default class Controller extends Section {
-    constructor($scope) {
-        this.$ = $scope;
-        this.ticketSelected = null;
-    }
-
     stateColor(claim) {
         switch (claim.description) {
         case 'Pendiente':
@@ -52,8 +48,6 @@ export default class Controller {
     }
 }
 
-Controller.$inject = ['$scope'];
-
 ngModule.component('vnClaimIndex', {
     template: require('./index.html'),
     controller: Controller

modules/claim/front/photos/index.html

@@ -1,10 +1,9 @@
 <vn-crud-model vn-id="model" auto-load="true"
     url="ClaimDms"
-    link="{claimFk: $ctrl.$stateParams.id}"
+    link="{claimFk: $ctrl.$params.id}"
     limit="20"
     data="$ctrl.photos">
 </vn-crud-model>
-
 <vn-horizontal class="photo-list drop-zone" vn-droppable="$ctrl.onDrop($event)">
     <section class="empty-rows" ng-if="!$ctrl.photos.length">
         <section><vn-icon icon="image"></vn-icon></section>
@@ -12,8 +11,8 @@
     </section>
     <section class="photo" ng-repeat="photo in $ctrl.photos">
         <section class="image vn-shadow" on-error-src 
-            ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.accessToken + ')'}"
+            ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.vnToken.token + ')'}"
-            zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.accessToken}}">
+            zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.vnToken.token}}">
         </section>
         <section class="actions">
             <vn-button

modules/claim/front/photos/index.js

@@ -1,17 +1,8 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+class Controller extends Section {
-    constructor($stateParams, $scope, $http, $translate, vnToken, vnApp, vnConfig) {
-        this.$stateParams = $stateParams;
-        this.$ = $scope;
-        this.$http = $http;
-        this.$translate = $translate;
-        this.accessToken = vnToken.token;
-        this.vnApp = vnApp;
-        this.vnConfig = vnConfig;
-    }
-
     showWorkerDescriptor(event, workerFk) {
         event.preventDefault();
         event.stopImmediatePropagation();
@@ -106,8 +97,6 @@ class Controller {
     }
 }
 
-Controller.$inject = ['$stateParams', '$scope', '$http', '$translate', 'vnToken', 'vnApp', 'vnConfig'];
-
 ngModule.component('vnClaimPhotos', {
     template: require('./index.html'),
     controller: Controller,

modules/claim/front/photos/index.spec.js

@@ -16,7 +16,8 @@ describe('Claim', () => {
             $httpParamSerializer = _$httpParamSerializer_;
             $httpBackend = _$httpBackend_;
             $scope = $rootScope.$new();
-            controller = $componentController('vnClaimPhotos', {$: $scope});
+            const $element = angular.element('<vn-claim-photos></vn-claim-photos>');
+            controller = $componentController('vnClaimPhotos', {$element, $scope});
             controller.$.model = crudModel;
             controller.claim = {
                 id: 1,

modules/claim/front/summary/index.html

@@ -86,8 +86,8 @@
             <vn-horizontal class="photo-list">
                 <section class="photo" ng-repeat="photo in photos">
                     <section class="image" on-error-src 
-                        ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.accessToken + ')'}"
+                        ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.vnToken.token + ')'}"
-                        zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.accessToken}}">
+                        zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.vnToken.token}}">
                     </section>
                 </section>
             </vn-horizontal>

modules/claim/front/summary/index.js

@@ -1,34 +1,8 @@
 import ngModule from '../module';
+import Section from 'salix/components/section';
 import './style.scss';
 
-class Controller {
+class Controller extends Section {
-    constructor($scope, $http, $stateParams, vnToken) {
-        this.$http = $http;
-        this.$ = $scope;
-        this.$stateParams = $stateParams;
-        this.accessToken = vnToken.token;
-    }
-
-    get claim() {
-        return this._claim;
-    }
-
-
-    set claim(value) {
-        this._claim = value;
-
-        // Get DMS on summary load
-        if (value)
-            this.$.$applyAsync(() => this.loadDms());
-    }
-
-    loadDms() {
-        this.$.model.where = {
-            claimFk: this.claim.id
-        };
-        this.$.model.refresh();
-    }
-
     getSummary() {
         this.$http.get(`Claims/${this.claim.id}/getSummary`).then(response => {
             this.summary = response.data;
@@ -36,8 +10,13 @@ class Controller {
     }
 
     $onChanges() {
-        if (this.claim && this.claim.id)
+        if (this.claim && this.claim.id) {
             this.getSummary();
+            this.$.model.where = {
+                claimFk: this.claim.id
+            };
+            this.$.model.refresh();
+        }
     }
 
     showItemDescriptor(event, itemFk) {
@@ -59,8 +38,6 @@ class Controller {
     }
 }
 
-Controller.$inject = ['$scope', '$http', '$stateParams', 'vnToken'];
-
 ngModule.component('vnClaimSummary', {
     template: require('./index.html'),
     controller: Controller,

modules/claim/front/summary/index.spec.js

@@ -5,13 +5,16 @@ describe('Claim', () => {
     describe('Component summary', () => {
         let controller;
         let $httpBackend;
+        let $scope;
 
         beforeEach(ngModule('claim'));
 
-        beforeEach(angular.mock.inject(($componentController, _$httpBackend_) => {
+        beforeEach(angular.mock.inject(($componentController, _$httpBackend_, $rootScope) => {
+            $scope = $rootScope.$new();
             $httpBackend = _$httpBackend_;
-            controller = $componentController('vnClaimSummary');
+            const $element = angular.element('<vn-claim-summary></vn-claim-summary>');
-            controller.claim = {id: 1};
+            controller = $componentController('vnClaimSummary', {$element, $scope});
+            controller._claim = {id: 1};
             controller.$.model = crudModel;
         }));
 
@@ -29,6 +32,7 @@ describe('Claim', () => {
         describe('$onChanges()', () => {
             it('should call getSummary when item.id is defined', () => {
                 jest.spyOn(controller, 'getSummary');
+
                 controller.$onChanges();
 
                 expect(controller.getSummary).toHaveBeenCalledWith();