This commit is contained in:
parent
57440d003d
commit
762e39f7be
|
|
@ -2,68 +2,11 @@
|
||||||
<vn-dialog
|
<vn-dialog
|
||||||
vn-id="instanceLog">
|
vn-id="instanceLog">
|
||||||
<tpl-body>
|
<tpl-body>
|
||||||
<vn-crud-model
|
<vn-log
|
||||||
vn-id="model"
|
|
||||||
url="{{$ctrl.url}}"
|
url="{{$ctrl.url}}"
|
||||||
filter="$ctrl.filter"
|
origin-id="$ctrl.originId"
|
||||||
link="{originFk: $ctrl.originId}"
|
changed-model="$ctrl.changedModel"
|
||||||
data="$ctrl.logs"
|
changed-model-id="$ctrl.changedModelId">
|
||||||
limit="20"
|
</vn-log>
|
||||||
auto-load="true">
|
|
||||||
</vn-crud-model>
|
|
||||||
<vn-data-viewer model="model">
|
|
||||||
<vn-table model="model">
|
|
||||||
<vn-thead>
|
|
||||||
<vn-tr>
|
|
||||||
<vn-th field="creationDate">Date</vn-th>
|
|
||||||
<vn-th field="userFk">User</vn-th>
|
|
||||||
<vn-th field="action">Action</vn-th>
|
|
||||||
<vn-th expand>Changes</vn-th>
|
|
||||||
</vn-tr>
|
|
||||||
</vn-thead>
|
|
||||||
<vn-tbody>
|
|
||||||
<vn-tr ng-repeat="log in $ctrl.logs">
|
|
||||||
<vn-td shrink-datetime>
|
|
||||||
{{::log.creationDate | date:'dd/MM/yyyy HH:mm'}}
|
|
||||||
</vn-td>
|
|
||||||
<vn-td>
|
|
||||||
<span ng-class="{'link': log.user.worker.id, 'value': !log.user.worker.id}"
|
|
||||||
ng-click="$ctrl.showWorkerDescriptor($event, log.user.worker.id)"
|
|
||||||
translate>{{::log.user.name || 'System' | translate}}
|
|
||||||
</span>
|
|
||||||
</vn-td>
|
|
||||||
<vn-td translate>
|
|
||||||
{{::$ctrl.actionsText[log.action]}}
|
|
||||||
</vn-td>
|
|
||||||
<vn-td expand>
|
|
||||||
<table class="attributes">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th translate class="field">Field</th>
|
|
||||||
<th translate>Before</th>
|
|
||||||
<th translate>After</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr ng-repeat="prop in ::log.props">
|
|
||||||
<td class="field">{{prop.name}}</td>
|
|
||||||
<td class="before" vn-tooltip="{{::$ctrl.formatValue(prop.old)}}">{{::$ctrl.formatValue(prop.old)}}</td>
|
|
||||||
<td class="after" vn-tooltip="{{::$ctrl.formatValue(prop.new)}}">{{::$ctrl.formatValue(prop.new)}}</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<vn-one ng-if="!log.newProperties" id="description">
|
|
||||||
<div>
|
|
||||||
<span no-ellipsize>{{::log.description}}</span>
|
|
||||||
</div>
|
|
||||||
</vn-one>
|
|
||||||
</vn-td>
|
|
||||||
</vn-tr>
|
|
||||||
</vn-tbody>
|
|
||||||
</vn-table>
|
|
||||||
<vn-pagination model="model"></vn-pagination>
|
|
||||||
</vn-data-viewer>
|
|
||||||
</tpl-body>
|
</tpl-body>
|
||||||
</vn-dialog>
|
</vn-dialog>
|
||||||
<vn-worker-descriptor-popover vn-id="workerDescriptor">
|
|
||||||
</vn-worker-descriptor-popover>
|
|
||||||
|
|
|
||||||
|
|
@ -1,96 +1,11 @@
|
||||||
import ngModule from '../../module';
|
import ngModule from '../../module';
|
||||||
import './style.scss';
|
|
||||||
import Section from '../section';
|
import Section from '../section';
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
export default class Controller extends Section {
|
export default class Controller extends Section {
|
||||||
constructor($element, $) {
|
|
||||||
super($element, $);
|
|
||||||
this.actionsText = {
|
|
||||||
'insert': 'Creates',
|
|
||||||
'update': 'Updates',
|
|
||||||
'delete': 'Deletes',
|
|
||||||
'select': 'Views'
|
|
||||||
}; ``;
|
|
||||||
}
|
|
||||||
|
|
||||||
open() {
|
open() {
|
||||||
this.filter = {
|
|
||||||
where:
|
|
||||||
{changedModel: this.changedModel,
|
|
||||||
changedModelId: this.changedModelId},
|
|
||||||
include: [{
|
|
||||||
relation: 'user',
|
|
||||||
scope: {
|
|
||||||
fields: ['name'],
|
|
||||||
include: {
|
|
||||||
relation: 'worker',
|
|
||||||
scope: {
|
|
||||||
fields: ['id']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}],
|
|
||||||
};
|
|
||||||
this.$.instanceLog.show();
|
this.$.instanceLog.show();
|
||||||
}
|
}
|
||||||
|
|
||||||
get logs() {
|
|
||||||
return this._logs;
|
|
||||||
}
|
|
||||||
|
|
||||||
set logs(value) {
|
|
||||||
this._logs = value;
|
|
||||||
if (!this.logs) return;
|
|
||||||
const validations = window.validations;
|
|
||||||
for (const log of value) {
|
|
||||||
const locale = validations[log.changedModel] && validations[log.changedModel].locale
|
|
||||||
? validations[log.changedModel].locale : {};
|
|
||||||
log.oldProperties = this.getInstance(log.oldInstance, locale);
|
|
||||||
log.newProperties = this.getInstance(log.newInstance, locale);
|
|
||||||
let props = [].concat(log.oldProperties.map(p => p.key), log.newProperties.map(p => p.key));
|
|
||||||
props = [...new Set(props)];
|
|
||||||
log.props = [];
|
|
||||||
for (const prop of props) {
|
|
||||||
const matchOldProp = log.oldProperties.find(p => p.key === prop);
|
|
||||||
const matchNewProp = log.newProperties.find(p => p.key === prop);
|
|
||||||
log.props.push({
|
|
||||||
name: prop,
|
|
||||||
old: matchOldProp ? matchOldProp.value : null,
|
|
||||||
new: matchNewProp ? matchNewProp.value : null,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
formatValue(value) {
|
|
||||||
switch (typeof value) {
|
|
||||||
case 'boolean':
|
|
||||||
return value ? '✓' : '✗';
|
|
||||||
default:
|
|
||||||
return value;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getInstance(instance, locale) {
|
|
||||||
const properties = [];
|
|
||||||
let validDate = /^(-?(?:[1-9][0-9]*)?[0-9]{4})-(1[0-2]|0[1-9])-(3[01]|0[1-9]|[12][0-9])T(2[0-3]|[01][0-9]):([0-5][0-9]):([0-5][0-9])(.[0-9]+)?(Z)?$/;
|
|
||||||
|
|
||||||
if (typeof instance == 'object' && instance != null) {
|
|
||||||
Object.keys(instance).forEach(property => {
|
|
||||||
if (validDate.test(instance[property]))
|
|
||||||
instance[property] = new Date(instance[property]).toLocaleString('es-ES');
|
|
||||||
const key = locale[property] || property;
|
|
||||||
properties.push({key, value: instance[property]});
|
|
||||||
});
|
|
||||||
return properties;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
showWorkerDescriptor(event, workerId) {
|
|
||||||
if (!workerId) return;
|
|
||||||
this.$.workerDescriptor.show(event.target, workerId);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ngModule.vnComponent('vnInstanceLog', {
|
ngModule.vnComponent('vnInstanceLog', {
|
||||||
|
|
@ -99,8 +14,8 @@ ngModule.vnComponent('vnInstanceLog', {
|
||||||
bindings: {
|
bindings: {
|
||||||
model: '<',
|
model: '<',
|
||||||
originId: '<',
|
originId: '<',
|
||||||
changedModel: '<',
|
|
||||||
changedModelId: '<',
|
changedModelId: '<',
|
||||||
|
changedModel: '@',
|
||||||
url: '@'
|
url: '@'
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
Date: Fecha
|
|
||||||
Model: Modelo
|
|
||||||
Action: Acción
|
|
||||||
Author: Autor
|
|
||||||
Before: Antes
|
|
||||||
After: Despues
|
|
||||||
History: Historial
|
|
||||||
Name: Nombre
|
|
||||||
Creates: Crea
|
|
||||||
Updates: Actualiza
|
|
||||||
Deletes: Elimina
|
|
||||||
Views: Visualiza
|
|
||||||
System: Sistema
|
|
||||||
note: nota
|
|
||||||
Changes: Cambios
|
|
||||||
|
|
@ -1,18 +1,12 @@
|
||||||
.vn-dialog .window {
|
.vn-dialog {
|
||||||
width: max-content;
|
& > .window:not(:has(.empty-rows)) {
|
||||||
vn-td {
|
width:60%;
|
||||||
vertical-align: initial;
|
vn-log {
|
||||||
|
vn-card {
|
||||||
|
visibility: hidden;
|
||||||
|
& > * {
|
||||||
|
visibility: visible;
|
||||||
}
|
}
|
||||||
.attributes {
|
|
||||||
width: 100%;
|
|
||||||
tr {
|
|
||||||
height: 10px;
|
|
||||||
& > td {
|
|
||||||
width: 33%;
|
|
||||||
}
|
|
||||||
& > td.field,
|
|
||||||
& > th.field {
|
|
||||||
color: gray;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue