side front address observations

client/client/src/address-edit/address-edit.html

@@ -1,4 +1,4 @@
-<mg-ajax path="/client/api/Addresses/{{edit.params.addressId}}" actions="$ctrl.address=edit.model" options="mgEdit"></mg-ajax>
+<mg-ajax path="/client/api/Addresses/{{edit.params.addressId}}" actions="$ctrl.address=edit.model;$ctrl._setIconAdd();" options="mgEdit"></mg-ajax>
 <vn-watcher
     vn-id="watcher"
     url="/client/api/Addresses"
@@ -6,7 +6,7 @@
     data="$ctrl.address"
     form="form">
 </vn-watcher>
-<form name="form" ng-submit="watcher.submitBack()" pad-medium>
+<form name="form" ng-submit="$ctrl.submit()" pad-medium>
     <vn-card>
         <vn-vertical pad-large>
             <vn-title>Address</vn-title>
@@ -50,11 +50,11 @@
             <vn-one margin-medium-top>
                 <vn-title>Notes</vn-title>
                 <mg-ajax path="/client/api/ObservationTypes" options="mgIndex as observationsTypes"></mg-ajax>
-                <vn-horizontal ng-repeat="note in $ctrl.notes track by note.id">
+                <vn-horizontal ng-repeat="observation in $ctrl.observations track by $index">
                     <vn-autocomplete
                         vn-one
-                        initial-data = "note.observationType"
+                        initial-data = "observation.observationType"
-                        field = "note.observationTypeFk"
+                        field = "observation.observationTypeFk"
                         data = "observationsTypes.model"
                         show-field = "description"
                         label = "Observation type"
@@ -63,14 +63,13 @@
                     >
                         <tpl-item>{{$parent.$parent.item.description}}</tpl-item>
                     </vn-autocomplete>
-                    <vn-textfield vn-three label="Description" model="note.description"></vn-textfield>
+                    <vn-textfield vn-three label="Description" model="observation.description"></vn-textfield>
                     <vn-one pad-medium-top>
                         <vn-icon
                             pointer 
                             medium-grey
                             icon="remove_circle_outline"
-                            ng-if = "note.showRemoveIcon" 
+                            ng-click="$ctrl.removeObservation($index)"
-                            ng-click="$ctrl.removeNote(note.id)"
                             >
                         </vn-icon>
                         <vn-icon
@@ -78,8 +77,8 @@
                             margin-medium-left
                             orange
                             icon="add_circle"
-                            ng-if = "note.showAddIcon" 
+                            ng-if = "observation.showAddIcon" 
-                            ng-click="$ctrl.addNote()"
+                            ng-click="$ctrl.addObservation()"
                         ></vn-icon>  
                     </vn-one>
                 </vn-horizontal>

client/client/src/address-edit/address-edit.js

@@ -1,76 +1,137 @@
 import ngModule from '../module';
 
 export default class Controller {
-    constructor($state, $http) {
+    constructor($state, $scope, $http, $q, $translate, vnApp) {
+        this.$state = $state;
+        this.$scope = $scope;
+        this.$http = $http;
+        this.$q = $q;
+        this.$translate = $translate;
+        this.vnApp = vnApp;
+
         this.address = {
             id: parseInt($state.params.addressId)
         };
-        this.$http = $http;
+        this.observations = [];
-        this.notes = [];
+        this.observationsDictionary = {};
+        this.observationsRemoved = [];
     }
 
     _setIconAdd() {
-        if (this.notes.length) {
+        if (this.observations.length) {
-            this.notes.forEach(element => {
+            this.observations.map(element => {
                 element.showAddIcon = false;
+                return true;
             });
-            this.notes[this.notes.length - 1].showAddIcon = true;
+            this.observations[this.observations.length - 1].showAddIcon = true;
-        }
-    }
-    _setRemoveAdd() {
-        if (this.notes.length) {
-            this.notes.forEach(element => {
-                element.showRemoveIcon = true;
-            });
         } else {
-            this.notes = [this._createEmptyNote()];
+            this.addObservation();
         }
     }
-    _createEmptyNote() {
+
-        return {id: this._createFakeId(), observationTypeFk: null, description: null, showRemoveIcon: true, showAddIcon: true};
+    _setDirtyForm() {
+        if (this.$scope.form) {
+            this.$scope.form.$setDirty();
+        }
     }
-    _createFakeId() {
+    _unsetDirtyForm() {
-        let now = Date.now();
+        if (this.$scope.form) {
-        let random = Math.ceil((Math.random() * 100000) + 1);
+            this.$scope.form.$setPristine();
-        return `fakeId${now}${random}`;
+        }
     }
-    addNote() {
+
-        this.notes.push(this._createEmptyNote());
+    addObservation() {
+        this.observations.push({observationTypeFk: null, description: null, showAddIcon: true});
         this._setIconAdd();
-        this._setRemoveAdd();
     }
-    removeNote(id) {
+
-        let found = false;
+    removeObservation(index) {
-        for (let i = 0; i < this.notes.length; i++) {
+        let item = this.observations[index];
-            if (this.notes[i].id === id) {
+        if (item) {
-                this.notes.splice(i, 1);
+            this.observations.splice(index, 1);
-                found = true;
+            this._setIconAdd();
+            if (item.id) {
+                this.observationsRemoved.push(item.id);
+                this._setDirtyForm();
+            }
+        }
+    }
+    _submitObservations(objectObservations) {
+        return this.$http.post('/client/api/crudAddressObservations', objectObservations);
+    }
+
+    submit() {
+        this._unsetDirtyForm();
+        let submitWatcher = this.$scope.watcher.dataChanged();
+        let submitObservations;
+        let repeatedTypes = false;
+        let observationsObj = {
+            remove: this.observationsRemoved,
+            news: [],
+            modified: []
+        };
+
+        for (let i = 0; i < this.observations.length; i++) {
+            let observation = this.observations[i];
+            // only one observation is allowed for each of its types
+            if (this.observationsDictionary[observation.observationTypeFk] !== undefined && // IF the dictionary contains the type
+                    (
+                    // AND (is a new Observation OR is old but with distinct Id) --> repeated
+                    !observation.id || (observation.id && this.observationsDictionary[observation.observationTypeFk].id !== observation.id)
+                    )
+                ) {
+                repeatedTypes = true;
                 break;
             }
+
+            this.observationsDictionary[observation.observationTypeFk] = observation;
+
+            if (!observation.id && observation.observationTypeFk && observation.description) {
+                observationsObj.news.push(observation);
+            } else if (observation.id && this.observationsDictionary[observation.observationTypeFk].description !== observation.description) {
+                observationsObj.modified.push(observation);
+            }
         }
 
-        if (found) {
+        submitObservations = observationsObj.modified.length > 0 || observationsObj.news.length > 0 || observationsObj.remove.length > 0;
-            this._setIconAdd();
+
-            this._setRemoveAdd();
+        if (repeatedTypes) {
+            this.vnApp.showMessage(
+                this.$translate.instant('you can not repeat the types of observations')
+            );
+        } else if (submitWatcher && !submitObservations) {
+            this.$scope.watcher.submit().then(() => {
+                this.$state.go('clientCard.addresses.list', {id: this.$state.params.id});
+            });
+        } else if (!submitWatcher && submitObservations) {
+            this._submitObservations(observationsObj).then(() => {
+                this.$state.go('clientCard.addresses.list', {id: this.$state.params.id});
+            });
+        } else if (submitWatcher && submitObservations) {
+            this.$q.all([this.$scope.watcher.submit(), this._submitObservations(observationsObj)]).then(() => {
+                this.$state.go('clientCard.addresses.list', {id: this.$state.params.id});
+            });
+        } else {
+            this.vnApp.showMessage(
+                this.$translate.instant('No changes to save')
+            );
         }
     }
+
     $onInit() {
         let filter = {
-            where: {
+            where: {addressFk: this.address.id},
-                addressFk: this.address.id
+            include: {relation: 'observationType'}
-            },
-            include: [
-                {relation: 'observationType'}
-            ]
         };
         this.$http.get(`/client/api/AddressObservations?filter=${JSON.stringify(filter)}`).then(res => {
-            this.notes = (res.data && res.data.length) ? res.data : [this._createEmptyNote()];
+            this.observations = res.data;
-            this._setIconAdd();
+            this.observations.forEach(item => {
-            this._setRemoveAdd();
+                this.observationsDictionary[item.observationTypeFk] = {id: item.id, description: item.description};
+            });
         });
     }
 }
-Controller.$inject = ['$state', '$http'];
+Controller.$inject = ['$state', '$scope', '$http', '$q', '$translate', 'vnApp'];
 
 ngModule.component('vnAddressEdit', {
     template: require('./address-edit.html'),

client/core/src/lib/modified.js

@@ -3,6 +3,9 @@ import isEqual from './equals';
 
 export default function getModifiedData(object, objectOld) {
     var newObject = {};
+    if (objectOld === null) {
+        return object;
+    }
     for (var k in object) {
         var val = object[k];
         var valOld = objectOld[k] === undefined ? null : objectOld[k];

client/core/src/watcher/watcher.js

@@ -96,7 +96,7 @@ export default class Watcher extends Component {
         }
         let changedData = (this.$attrs.save && this.$attrs.save.toLowerCase() === 'post') ? this.copyInNewObject(this.data) : getModifiedData(this.data, this.orgData);
 
-        if (this.save) {
+        if (this.save && this.save.accept) {
             this.save.model = changedData; // this.copyInNewObject(changedData);
             return new Promise((resolve, reject) => {
                 this.save.accept().then(
@@ -108,7 +108,7 @@ export default class Watcher extends Component {
 
         // XXX: Alternative when mgCrud is not used
 
-        let id = this.orgData[this.idField];
+        let id = this.idField ? this.orgData[this.idField] : null;
 
         if (id) {
             return new Promise((resolve, reject) => {
@@ -120,7 +120,7 @@ export default class Watcher extends Component {
         }
 
         return new Promise((resolve, reject) => {
-            this.$http.post(this.url, this.data).then(
+            this.$http.post(this.url, changedData).then(
                 json => this.writeData(json, resolve),
                 json => reject(json)
             );
@@ -181,7 +181,7 @@ export default class Watcher extends Component {
     }
 
     dataChanged() {
-        if (this.form && !this.form.$dirty) return false;
+        if (this.form && this.form.$dirty) return true;
         let newData = this.copyInNewObject(this.data);
         return !isEqual(newData, this.orgData);
     }

client/core/src/watcher/watcher.spec.js

@@ -144,7 +144,7 @@ describe('Component vnWatcher', () => {
 
         describe('when controller.save()', () => {
             it(`should set controller.save.model property`, () => {
-                controller.save = {};
+                controller.save = {accept: () => {}};
                 controller.data = {originalInfo: 'original data', info: 'new data'};
                 controller.orgData = {originalInfo: 'original data'};
                 controller.submit();

services/client/common/models/address.js

@@ -36,7 +36,8 @@ module.exports = function(Self) {
                 scope: {
                     fields: ["id", "name"]
                 }
-            }
+            },
+            {observations: "observationType"}
             ]
         };
         next();