#707 Loggable
This commit is contained in:
Gerard
parent
f2d5e6afee
commit
86f6253ed7
|
|
@ -1,10 +1,9 @@
|
|||
<vn-crud-model
|
||||
vn-id="model"
|
||||
url="/client/api/ClientLogs"
|
||||
filter="$ctrl.filter"
|
||||
link="{originFk: $ctrl.$stateParams.id}"
|
||||
limit="20"
|
||||
data="logs" on-data-change="$ctrl.onDataChange()">
|
||||
data="$ctrl.logs">
|
||||
</vn-crud-model>
|
||||
|
||||
<vn-vertical>
|
||||
|
|
@ -15,39 +14,63 @@
|
|||
<vn-thead>
|
||||
<vn-tr>
|
||||
<vn-th field="creationDate" default-order="DESC">Date</vn-th>
|
||||
<vn-th field="model">Model</vn-th>
|
||||
<vn-th field="action">Action</vn-th>
|
||||
<vn-th field="userFk">Changed by</vn-th>
|
||||
<vn-th field="before">Before</vn-th>
|
||||
<vn-th field="after">After</vn-th>
|
||||
<vn-th field="userFk" class="expendable">Changed by</vn-th>
|
||||
<vn-th field="changedModel" class="expendable">Model</vn-th>
|
||||
<vn-th field="action" class="expendable">Action</vn-th>
|
||||
<vn-th field="changedModelValue" class="expendable">Instance</vn-th>
|
||||
<vn-th>Before</vn-th>
|
||||
<vn-th>After</vn-th>
|
||||
</vn-tr>
|
||||
</vn-thead>
|
||||
<vn-tbody>
|
||||
<vn-tr ng-repeat="clientLog in logs">
|
||||
<vn-tr ng-repeat="clientLog in $ctrl.logs">
|
||||
<vn-td>
|
||||
{{::clientLog.creationDate | date:'dd/MM/yyyy HH:mm'}}
|
||||
<div class="changes">
|
||||
<div>
|
||||
<span translate class="label">Changed by</span><span class="label">: </span>
|
||||
<span translate class="value">{{::clientLog.user.name}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span translate class="label">Model</span><span class="label">: </span>
|
||||
<span translate class="value">{{::clientLog.changedModel}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span translate class="label">Action</span><span class="label">: </span>
|
||||
<span translate class="value">{{::clientLog.action}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span translate class="label">Instance</span><span class="label">: </span>
|
||||
<span translate class="value">{{::clientLog.changedModelValue}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</vn-td>
|
||||
<vn-td>
|
||||
{{::clientLog.model}}
|
||||
</vn-td>
|
||||
<vn-td translate>
|
||||
{{::clientLog.action}}
|
||||
</vn-td>
|
||||
<vn-td>
|
||||
<vn-td class="expendable">
|
||||
{{::clientLog.user.name}}
|
||||
</vn-td>
|
||||
<vn-td>
|
||||
<vn-td class="expendable">
|
||||
{{::clientLog.changedModel}}
|
||||
</vn-td>
|
||||
<vn-td translate class="expendable">
|
||||
{{::clientLog.action}}
|
||||
</vn-td>
|
||||
<vn-td class="expendable">
|
||||
{{::clientLog.changedModelValue}}
|
||||
</vn-td>
|
||||
<vn-td class="before">
|
||||
<vn-one ng-repeat="old in clientLog.oldProperties">
|
||||
<vn-label-value label="{{old.key}}"
|
||||
value="{{old.value}}">
|
||||
</vn-label-value>
|
||||
<div>
|
||||
<span translate class="label">{{::old.key}}</span><span class="label">: </span>
|
||||
<span translate class="value">{{::old.value}}</span>
|
||||
</div>
|
||||
</vn-one>
|
||||
</vn-td>
|
||||
<vn-td>
|
||||
<vn-td class="after">
|
||||
<vn-one ng-repeat="new in clientLog.newProperties">
|
||||
<vn-label-value label="{{new.key}}"
|
||||
value="{{new.value}}">
|
||||
</vn-label-value>
|
||||
<div>
|
||||
<span translate class="label">{{::new.key}}</span><span class="label">: </span>
|
||||
<span translate class="value">{{::new.value}}</span>
|
||||
</div>
|
||||
</vn-one>
|
||||
</vn-td>
|
||||
</vn-tr>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import ngModule from '../module';
|
||||
import './style.scss';
|
||||
|
||||
class Controller {
|
||||
constructor($scope, $stateParams) {
|
||||
|
|
@ -14,13 +15,18 @@ class Controller {
|
|||
};
|
||||
}
|
||||
|
||||
onDataChange() {
|
||||
let logs = this.$scope.model.data;
|
||||
get logs() {
|
||||
return this._logs;
|
||||
}
|
||||
|
||||
logs.forEach(log => {
|
||||
log.oldProperties = this.getInstance(log.oldInstance);
|
||||
log.newProperties = this.getInstance(log.newInstance);
|
||||
});
|
||||
set logs(value) {
|
||||
this._logs = value;
|
||||
|
||||
if (this.logs)
|
||||
this.logs.forEach(log => {
|
||||
log.oldProperties = this.getInstance(log.oldInstance);
|
||||
log.newProperties = this.getInstance(log.newInstance);
|
||||
});
|
||||
}
|
||||
|
||||
getInstance(instance) {
|
||||
|
|
|
|||
|
|
@ -7,20 +7,20 @@ describe('Client', () => {
|
|||
let controller;
|
||||
|
||||
beforeEach(() => {
|
||||
angular.mock.module('client');
|
||||
ngModule('client');
|
||||
});
|
||||
|
||||
beforeEach(angular.mock.inject((_$componentController_, $rootScope) => {
|
||||
$componentController = _$componentController_;
|
||||
$scope = $rootScope.$new();
|
||||
controller = $componentController('vnClientHistory', {$scope: $scope});
|
||||
controller.$scope.model = {data: [{newInstance: {id: 1}, oldInstance: {id: 2}}]}
|
||||
controller.$scope.model = {data: [{newInstance: {id: 1}, oldInstance: {id: 2}}]};
|
||||
}));
|
||||
|
||||
describe('onDataChange()', () => {
|
||||
describe('logs setter', () => {
|
||||
it('should call the function getInstance() twice', () => {
|
||||
spyOn(controller, 'getInstance').and.callFake(() => {});
|
||||
controller.onDataChange();
|
||||
spyOn(controller, 'getInstance');
|
||||
controller.logs = [{newInstance: {id: 1}, oldInstance: {id: 2}}];
|
||||
|
||||
expect(controller.getInstance.calls.count()).toBe(2);
|
||||
expect(controller.getInstance).toHaveBeenCalledWith({id: 1});
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ Action: Acción
|
|||
Changed by: Cambiado por
|
||||
Before: Antes
|
||||
After: Despues
|
||||
update: Actualizar
|
||||
Create: Crear
|
||||
History: Historial
|
||||
insert: Crear
|
||||
insert: Crear
|
||||
delete: Eliminar
|
||||
update: Actualizar
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
@import 'colors';
|
||||
|
||||
vn-client-history {
|
||||
vn-td {
|
||||
vertical-align: initial !important;
|
||||
}
|
||||
.changes {
|
||||
display: none;
|
||||
}
|
||||
.label {
|
||||
color: $secondary-font-color;
|
||||
}
|
||||
.value {
|
||||
color: $main-font-color;
|
||||
}
|
||||
|
||||
.after, .before {
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1570px) {
|
||||
.expendable {
|
||||
display: none;
|
||||
}
|
||||
.changes {
|
||||
padding-top: 10px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue