side front address observations

This commit is contained in:
Daniel Herrero 2018-02-01 13:28:45 +01:00
parent cd027a3e12
commit 51cc783521
6 changed files with 122 additions and 58 deletions

View File

@ -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"
field = "note.observationTypeFk"
initial-data = "observation.observationType"
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.removeNote(note.id)"
ng-click="$ctrl.removeObservation($index)"
>
</vn-icon>
<vn-icon
@ -78,8 +77,8 @@
margin-medium-left
orange
icon="add_circle"
ng-if = "note.showAddIcon"
ng-click="$ctrl.addNote()"
ng-if = "observation.showAddIcon"
ng-click="$ctrl.addObservation()"
></vn-icon>
</vn-one>
</vn-horizontal>

View File

@ -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.notes = [];
this.observations = [];
this.observationsDictionary = {};
this.observationsRemoved = [];
}
_setIconAdd() {
if (this.notes.length) {
this.notes.forEach(element => {
if (this.observations.length) {
this.observations.map(element => {
element.showAddIcon = false;
return true;
});
this.notes[this.notes.length - 1].showAddIcon = true;
}
}
_setRemoveAdd() {
if (this.notes.length) {
this.notes.forEach(element => {
element.showRemoveIcon = true;
});
this.observations[this.observations.length - 1].showAddIcon = 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() {
let now = Date.now();
let random = Math.ceil((Math.random() * 100000) + 1);
return `fakeId${now}${random}`;
_unsetDirtyForm() {
if (this.$scope.form) {
this.$scope.form.$setPristine();
}
}
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;
for (let i = 0; i < this.notes.length; i++) {
if (this.notes[i].id === id) {
this.notes.splice(i, 1);
found = true;
removeObservation(index) {
let item = this.observations[index];
if (item) {
this.observations.splice(index, 1);
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) {
this._setIconAdd();
this._setRemoveAdd();
submitObservations = observationsObj.modified.length > 0 || observationsObj.news.length > 0 || observationsObj.remove.length > 0;
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: {
addressFk: this.address.id
},
include: [
{relation: 'observationType'}
]
where: {addressFk: this.address.id},
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._setIconAdd();
this._setRemoveAdd();
this.observations = res.data;
this.observations.forEach(item => {
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'),

View File

@ -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];

View File

@ -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);
}

View File

@ -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();

View File

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