2908-logs_no_ellipsize #625
|
@ -1,8 +1,5 @@
|
||||||
<h6>Debug info</h6>
|
<h6>Debug info</h6>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
|
||||||
{{$ctrl.env}}
|
|
||||||
</li>
|
|
||||||
<li>
|
<li>
|
||||||
<span ng-class="{alert: $root.$$watchersCount > 500}">{{$root.$$watchersCount}}</span> watchers
|
<span ng-class="{alert: $root.$$watchersCount > 500}">{{$root.$$watchersCount}}</span> watchers
|
||||||
</li>
|
</li>
|
||||||
|
|
|
@ -2,10 +2,10 @@
|
||||||
|
|
||||||
.vn-debug-info {
|
.vn-debug-info {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 16px;
|
top: 3px;
|
||||||
left: 16px;
|
left: 300px;
|
||||||
padding: 16px;
|
padding: 5px;
|
||||||
min-width: 128px;
|
min-width: 100px;
|
||||||
background-color: #3f51b5;
|
background-color: #3f51b5;
|
||||||
color: $color-font-dark;
|
color: $color-font-dark;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
|
@ -15,7 +15,7 @@
|
||||||
|
|
||||||
&.right {
|
&.right {
|
||||||
left: auto;
|
left: auto;
|
||||||
right: 16px;
|
right: 160px;
|
||||||
}
|
}
|
||||||
& > h6 {
|
& > h6 {
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
|
|
|
@ -15,3 +15,4 @@ import './topbar/topbar';
|
||||||
import './user-popover';
|
import './user-popover';
|
||||||
import './upload-photo';
|
import './upload-photo';
|
||||||
import './bank-entity';
|
import './bank-entity';
|
||||||
|
import './log';
|
||||||
|
|
|
@ -0,0 +1,93 @@
|
||||||
|
<vn-crud-model vn-id="model" url="{{$ctrl.url}}" filter="$ctrl.filter" link="{originFk: $ctrl.originId}"
|
||||||
|
data="$ctrl.logs" limit="20" auto-load="true">
|
||||||
|
</vn-crud-model>
|
||||||
|
<vn-data-viewer model="model" class="vn-w-xl">
|
||||||
|
<vn-card>
|
||||||
|
<vn-table model="model">
|
||||||
|
<vn-thead>
|
||||||
|
<vn-tr>
|
||||||
|
<vn-th field="creationDate">Date</vn-th>
|
||||||
|
<vn-th field="userFk" class="expendable" shrink>Author</vn-th>
|
||||||
|
<vn-th field="changedModel" class="expendable" shrink>Model</vn-th>
|
||||||
|
<vn-th field="action" class="expendable" shrink>Action</vn-th>
|
||||||
|
<vn-th field="changedModelValue" class="expendable">Name</vn-th>
|
||||||
|
<vn-th expand>Before</vn-th>
|
||||||
|
<vn-th expand>After</vn-th>
|
||||||
|
</vn-tr>
|
||||||
|
</vn-thead>
|
||||||
|
<vn-tbody>
|
||||||
|
<vn-tr ng-repeat="log in $ctrl.logs">
|
||||||
|
<vn-td expand>
|
||||||
|
{{::log.creationDate | date:'dd/MM/yyyy HH:mm'}}
|
||||||
|
<div class="changes">
|
||||||
|
<div>
|
||||||
|
<span translate class="label">Changed by</span><span class="label">: </span>
|
||||||
|
<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>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span translate class="label">Model</span><span class="label">: </span>
|
||||||
|
<span translate class="value">{{::log.changedModel | dashIfEmpty}}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span translate class="label">Action</span><span class="label">: </span>
|
||||||
|
<span translate class="value">{{::$ctrl.actionsText[log.action] | dashIfEmpty}}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span translate class="label">Name</span><span class="label">: </span>
|
||||||
|
<span translate class="value">{{::log.changedModelValue | dashIfEmpty}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</vn-td>
|
||||||
|
<vn-td class="expendable">
|
||||||
|
<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 class="expendable">
|
||||||
|
{{::log.changedModel}}
|
||||||
|
</vn-td>
|
||||||
|
<vn-td translate class="expendable">
|
||||||
|
{{::$ctrl.actionsText[log.action]}}
|
||||||
|
</vn-td>
|
||||||
|
<vn-td class="expendable" expand>
|
||||||
|
{{::log.changedModelValue}}
|
||||||
|
</vn-td>
|
||||||
|
<vn-td expand class="before">
|
||||||
|
<vn-one ng-repeat="old in log.oldProperties">
|
||||||
|
<div>
|
||||||
|
<vn-label-value
|
||||||
|
no-ellipsize
|
||||||
|
label="{{::old.key}}"
|
||||||
|
value="{{::old.value}}">
|
||||||
|
</vn-label-value>
|
||||||
|
</div>
|
||||||
|
</vn-one>
|
||||||
|
</vn-td>
|
||||||
|
<vn-td expand class="after">
|
||||||
|
<vn-one ng-repeat="new in log.newProperties" ng-if="!log.description" id="newInstance">
|
||||||
|
<div>
|
||||||
|
<vn-label-value
|
||||||
|
no-ellipsize
|
||||||
|
label="{{::new.key}}"
|
||||||
|
value="{{::new.value}}">
|
||||||
|
</vn-label-value>
|
||||||
|
</div>
|
||||||
|
</vn-one>
|
||||||
|
<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-card>
|
||||||
|
</vn-data-viewer>
|
||||||
|
<vn-worker-descriptor-popover vn-id="workerDescriptor">
|
||||||
|
</vn-worker-descriptor-popover>
|
|
@ -0,0 +1,75 @@
|
||||||
|
import ngModule from '../../module';
|
||||||
|
import Section from '../section';
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
|
export default class Controller extends Section {
|
||||||
|
constructor($element, $) {
|
||||||
|
super($element, $);
|
||||||
|
this.actionsText = {
|
||||||
|
'insert': 'Creates',
|
||||||
|
'update': 'Updates',
|
||||||
|
'delete': 'Deletes',
|
||||||
|
'select': 'Views'
|
||||||
|
}; ``;
|
||||||
|
this.filter = {
|
||||||
|
include: [{
|
||||||
|
relation: 'user',
|
||||||
|
scope: {
|
||||||
|
fields: ['name'],
|
||||||
|
include: {
|
||||||
|
relation: 'worker',
|
||||||
|
scope: {
|
||||||
|
fields: ['id']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}],
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
get logs() {
|
||||||
|
return this._logs;
|
||||||
|
}
|
||||||
|
|
||||||
|
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) {
|
||||||
|
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');
|
||||||
|
|
||||||
|
properties.push({key: property, value: instance[property]});
|
||||||
|
});
|
||||||
|
return properties;
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
showWorkerDescriptor(event, workerId) {
|
||||||
|
if (!workerId) return;
|
||||||
|
this.$.workerDescriptor.show(event.target, workerId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ngModule.vnComponent('vnLog', {
|
||||||
|
controller: Controller,
|
||||||
|
template: require('./index.html'),
|
||||||
|
bindings: {
|
||||||
|
model: '<',
|
||||||
|
originId: '<',
|
||||||
|
url: '@'
|
||||||
|
}
|
||||||
|
});
|
|
@ -31,6 +31,12 @@ vn-log {
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
.no-ellipsize,
|
||||||
|
[no-ellipsize] {
|
||||||
|
text-overflow: '';
|
||||||
|
white-space: normal;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
.alignSpan {
|
.alignSpan {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
display: inline-block;
|
display: inline-block;
|
|
@ -13,7 +13,6 @@ import './department';
|
||||||
import './calendar';
|
import './calendar';
|
||||||
import './time-control';
|
import './time-control';
|
||||||
import './log';
|
import './log';
|
||||||
import './worker-log';
|
|
||||||
import './dms/index';
|
import './dms/index';
|
||||||
import './dms/create';
|
import './dms/create';
|
||||||
import './dms/edit';
|
import './dms/edit';
|
||||||
|
|
|
@ -1,113 +1 @@
|
||||||
<vn-crud-model
|
<vn-log url="WorkerLogs" origin-id="$ctrl.$params.id"></vn-log>
|
||||||
vn-id="model"
|
|
||||||
url="{{$ctrl.url}}"
|
|
||||||
filter="$ctrl.filter"
|
|
||||||
link="{originFk: $ctrl.originId}"
|
|
||||||
data="$ctrl.logs"
|
|
||||||
limit="20"
|
|
||||||
auto-load="true">
|
|
||||||
</vn-crud-model>
|
|
||||||
<vn-data-viewer
|
|
||||||
model="model"
|
|
||||||
class="vn-w-xl">
|
|
||||||
<vn-card>
|
|
||||||
<vn-table model="model">
|
|
||||||
<vn-thead>
|
|
||||||
<vn-tr>
|
|
||||||
<vn-th field="creationDate">Date</vn-th>
|
|
||||||
<vn-th field="userFk" class="expendable" shrink>Author</vn-th>
|
|
||||||
<vn-th field="changedModel" class="expendable" shrink>Model</vn-th>
|
|
||||||
<vn-th field="action" class="expendable" shrink>Action</vn-th>
|
|
||||||
<vn-th field="changedModelValue" class="expendable">Name</vn-th>
|
|
||||||
<vn-th expand>Before</vn-th>
|
|
||||||
<vn-th expand>After</vn-th>
|
|
||||||
</vn-tr>
|
|
||||||
</vn-thead>
|
|
||||||
<vn-tbody>
|
|
||||||
<vn-tr ng-repeat="log in $ctrl.logs">
|
|
||||||
<vn-td expand>
|
|
||||||
{{::log.creationDate | date:'dd/MM/yyyy HH:mm'}}
|
|
||||||
<div class="changes">
|
|
||||||
<div>
|
|
||||||
<span translate class="label">Changed by</span><span class="label">: </span>
|
|
||||||
<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>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span translate class="label">Model</span><span class="label">: </span>
|
|
||||||
<span translate class="value">{{::log.changedModel | dashIfEmpty}}</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span translate class="label">Action</span><span class="label">: </span>
|
|
||||||
<span translate class="value">{{::$ctrl.actionsText[log.action] | dashIfEmpty}}</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span translate class="label">Name</span><span class="label">: </span>
|
|
||||||
<span translate class="value">{{::log.changedModelValue | dashIfEmpty}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</vn-td>
|
|
||||||
<vn-td class="expendable">
|
|
||||||
<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 class="expendable">
|
|
||||||
{{::log.changedModel}}
|
|
||||||
</vn-td>
|
|
||||||
<vn-td translate class="expendable">
|
|
||||||
{{::$ctrl.actionsText[log.action]}}
|
|
||||||
</vn-td>
|
|
||||||
<vn-td class="expendable" expand>
|
|
||||||
{{::log.changedModelValue}}
|
|
||||||
</vn-td>
|
|
||||||
<vn-td expand class="before">
|
|
||||||
<vn-one ng-repeat="old in log.oldProperties">
|
|
||||||
<div>
|
|
||||||
<span translate class="label alignSpan">{{::old.key}}</span><span class="label alignSpan">: </span>
|
|
||||||
<span
|
|
||||||
translate
|
|
||||||
class="value ellipsis"
|
|
||||||
vn-tooltip="{{::old.value | dashIfEmpty}}">
|
|
||||||
{{::old.value | dashIfEmpty}}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</vn-one>
|
|
||||||
</vn-td>
|
|
||||||
<vn-td expand class="after">
|
|
||||||
<vn-one
|
|
||||||
ng-repeat="new in log.newProperties"
|
|
||||||
ng-if="!log.description"
|
|
||||||
id="newInstance">
|
|
||||||
<div>
|
|
||||||
<span translate class="label alignSpan">{{::new.key}}</span><span class="label alignSpan">: </span>
|
|
||||||
<span
|
|
||||||
translate
|
|
||||||
class="value ellipsis"
|
|
||||||
vn-tooltip="{{::new.value | dashIfEmpty}}">
|
|
||||||
{{::new.value | dashIfEmpty}}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</vn-one>
|
|
||||||
<vn-one
|
|
||||||
ng-if="!log.newProperties"
|
|
||||||
id="description">
|
|
||||||
<div>
|
|
||||||
<span>{{::log.description}}</span>
|
|
||||||
</div>
|
|
||||||
</vn-one>
|
|
||||||
</vn-td>
|
|
||||||
</vn-tr>
|
|
||||||
</vn-tbody>
|
|
||||||
</vn-table>
|
|
||||||
<vn-pagination model="model"></vn-pagination>
|
|
||||||
</vn-card>
|
|
||||||
</vn-data-viewer>
|
|
||||||
<vn-worker-descriptor-popover
|
|
||||||
vn-id="workerDescriptor">
|
|
||||||
</vn-worker-descriptor-popover>
|
|
|
@ -1,75 +1,7 @@
|
||||||
import ngModule from '../module';
|
import ngModule from '../module';
|
||||||
import Section from 'salix/components/section';
|
import Section from 'salix/components/section';
|
||||||
import './style.scss';
|
|
||||||
|
|
||||||
export default class Controller extends Section {
|
ngModule.vnComponent('vnWorkerLog', {
|
||||||
constructor($element, $) {
|
|
||||||
super($element, $);
|
|
||||||
this.actionsText = {
|
|
||||||
'insert': 'Creates',
|
|
||||||
'update': 'Updates',
|
|
||||||
'delete': 'Deletes',
|
|
||||||
'select': 'Views'
|
|
||||||
};
|
|
||||||
this.filter = {
|
|
||||||
include: [{
|
|
||||||
relation: 'user',
|
|
||||||
scope: {
|
|
||||||
fields: ['name'],
|
|
||||||
include: {
|
|
||||||
relation: 'worker',
|
|
||||||
scope: {
|
|
||||||
fields: ['id']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
get logs() {
|
|
||||||
return this._logs;
|
|
||||||
}
|
|
||||||
|
|
||||||
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) {
|
|
||||||
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');
|
|
||||||
|
|
||||||
properties.push({key: property, value: instance[property]});
|
|
||||||
});
|
|
||||||
return properties;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
showWorkerDescriptor(event, workerId) {
|
|
||||||
if (!workerId) return;
|
|
||||||
this.$.workerDescriptor.show(event.target, workerId);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngModule.vnComponent('vnLog', {
|
|
||||||
controller: Controller,
|
|
||||||
template: require('./index.html'),
|
template: require('./index.html'),
|
||||||
bindings: {
|
controller: Section,
|
||||||
model: '<',
|
|
||||||
originId: '<',
|
|
||||||
url: '@'
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -1 +0,0 @@
|
||||||
<vn-log url="WorkerLogs" origin-id="$ctrl.$params.id"></vn-log>
|
|
|
@ -1,7 +0,0 @@
|
||||||
import ngModule from '../module';
|
|
||||||
import Section from 'salix/components/section';
|
|
||||||
|
|
||||||
ngModule.vnComponent('vnWorkerLog', {
|
|
||||||
template: require('./index.html'),
|
|
||||||
controller: Section,
|
|
||||||
});
|
|
Loading…
Reference in New Issue