side front address observations
This commit is contained in:
parent
cd027a3e12
commit
51cc783521
|
@ -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>
|
||||
|
|
|
@ -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'),
|
||||
|
|
|
@ -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];
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -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();
|
||||
|
|
|
@ -36,7 +36,8 @@ module.exports = function(Self) {
|
|||
scope: {
|
||||
fields: ["id", "name"]
|
||||
}
|
||||
}
|
||||
},
|
||||
{observations: "observationType"}
|
||||
]
|
||||
};
|
||||
next();
|
||||
|
|
Loading…
Reference in New Issue