Merge pull request '3683-feat(monito_clients): smart-table and filter by date' (#904) from 3683-monitor_clients into dev
gitea/salix/pipeline/head Build queued...
Details
gitea/salix/pipeline/head Build queued...
Details
Reviewed-on: #904 Reviewed-by: Joan Sanchez <joan@verdnatura.es>
This commit is contained in:
commit
f74c80cf21
|
|
@ -40,7 +40,8 @@ module.exports = Self => {
|
|||
IFNULL(sc.workerSubstitute, c.salesPersonFk) AS salesPersonFk,
|
||||
c.id AS clientFk,
|
||||
c.name AS clientName,
|
||||
s.lastUpdate AS dated,
|
||||
TIME(v.stamp) AS hour,
|
||||
DATE(v.stamp) AS dated,
|
||||
wtc.workerFk
|
||||
FROM hedera.userSession s
|
||||
JOIN hedera.visitUser v ON v.id = s.userVisitFk
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@
|
|||
vn-id="model"
|
||||
url="SalesMonitors/clientsFilter"
|
||||
limit="6"
|
||||
order="dated DESC"
|
||||
filter="$ctrl.filter"
|
||||
order="dated DESC, hour DESC"
|
||||
auto-load="true">
|
||||
</vn-crud-model>
|
||||
<vn-horizontal class="header">
|
||||
|
|
@ -15,54 +16,81 @@
|
|||
vn-tooltip="Minimize/Maximize"
|
||||
ng-click="$ctrl.main.toggle()">
|
||||
</vn-icon>
|
||||
<vn-icon
|
||||
icon="refresh"
|
||||
vn-tooltip="Refresh"
|
||||
ng-click="model.refresh()">
|
||||
</vn-icon>
|
||||
</vn-none>
|
||||
</vn-horizontal>
|
||||
<vn-card vn-id="card">
|
||||
<vn-table model="model" class="scrollable sm">
|
||||
<vn-thead>
|
||||
<vn-tr>
|
||||
<vn-th field="dated">Hour</vn-th>
|
||||
<vn-th field="salesPersonFk" class="expendable">Salesperson</vn-th>
|
||||
<vn-th field="clientFk">Client</vn-th>
|
||||
</vn-tr>
|
||||
</vn-thead>
|
||||
<vn-tbody>
|
||||
<vn-tr ng-repeat="visit in model.data">
|
||||
<vn-td shrink-date>
|
||||
<smart-table
|
||||
model="model"
|
||||
options="$ctrl.smartTableOptions"
|
||||
expr-builder="$ctrl.exprBuilder(param, value)"
|
||||
class="scrollable sm">
|
||||
<slot-actions>
|
||||
<vn-horizontal>
|
||||
<vn-date-picker
|
||||
class="vn-pa-xs"
|
||||
label="From"
|
||||
ng-model="$ctrl.dateFrom"
|
||||
on-change="$ctrl.addFilterDate()">
|
||||
</vn-date-picker>
|
||||
<vn-date-picker
|
||||
class="vn-pa-xs"
|
||||
label="To"
|
||||
ng-model="$ctrl.dateTo"
|
||||
on-change="$ctrl.addFilterDate()">
|
||||
</vn-date-picker>
|
||||
</vn-horizontal>
|
||||
</slot-actions>
|
||||
<slot-table>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th field="dated">
|
||||
<span translate>Date</span>
|
||||
</th>
|
||||
<th field="hour">
|
||||
<span translate>Hour</span>
|
||||
</th>
|
||||
<th field="salesPersonFk" class="expendable">
|
||||
<span translate>Salesperson</span>
|
||||
</th>
|
||||
<th field="clientFk">
|
||||
<span translate>Client</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="visit in model.data">
|
||||
<td shrink-date>
|
||||
<span class="chip">
|
||||
{{::visit.dated | date: 'HH:mm'}}
|
||||
{{::visit.dated | date:'dd/MM/yy'}}
|
||||
</span>
|
||||
</vn-td>
|
||||
<vn-td class="shrink expendable">
|
||||
</td>
|
||||
<td shrink-date>
|
||||
<span class="chip">
|
||||
{{::visit.hour | date: 'HH:mm'}}
|
||||
</span>
|
||||
</td>
|
||||
<td class="shrink expendable">
|
||||
<span
|
||||
title="{{::visit.salesPerson}}"
|
||||
vn-click-stop="workerDescriptor.show($event, visit.salesPersonFk)"
|
||||
class="link">
|
||||
{{::visit.salesPerson | dashIfEmpty}}
|
||||
</span>
|
||||
</vn-td>
|
||||
<vn-td>
|
||||
</td>
|
||||
<td>
|
||||
<span
|
||||
title="{{::visit.clientName}}"
|
||||
vn-click-stop="clientDescriptor.show($event, visit.clientFk)"
|
||||
class="link">
|
||||
{{::visit.clientName}}
|
||||
</span>
|
||||
</vn-td>
|
||||
</vn-tr>
|
||||
</vn-tbody>
|
||||
</vn-table>
|
||||
<vn-pagination
|
||||
model="model"
|
||||
class="vn-pt-xs"
|
||||
scroll-selector="vn-monitor-sales-clients vn-table"
|
||||
scroll-offset="100">
|
||||
</vn-pagination>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<table>
|
||||
<slot-table>
|
||||
</smart-table>
|
||||
</vn-card>
|
||||
<vn-worker-descriptor-popover
|
||||
vn-id="workerDescriptor">
|
||||
|
|
@ -70,32 +98,3 @@
|
|||
<vn-client-descriptor-popover
|
||||
vn-id="clientDescriptor">
|
||||
</vn-client-descriptor-popover>
|
||||
<vn-contextmenu vn-id="contextmenu" targets="['vn-monitor-sales-clients vn-table']" model="model"
|
||||
expr-builder="$ctrl.exprBuilder(param, value)">
|
||||
<slot-menu>
|
||||
<vn-item translate
|
||||
ng-if="contextmenu.isFilterAllowed()"
|
||||
ng-click="contextmenu.filterBySelection()">
|
||||
Filter by selection
|
||||
</vn-item>
|
||||
<vn-item translate
|
||||
ng-if="contextmenu.isFilterAllowed()"
|
||||
ng-click="contextmenu.excludeSelection()">
|
||||
Exclude selection
|
||||
</vn-item>
|
||||
<vn-item translate
|
||||
ng-if="contextmenu.isFilterAllowed()"
|
||||
ng-click="contextmenu.removeFilter()">
|
||||
Remove filter
|
||||
</vn-item>
|
||||
<vn-item translate
|
||||
ng-click="contextmenu.removeAllFilters()">
|
||||
Remove all filters
|
||||
</vn-item>
|
||||
<vn-item translate
|
||||
ng-if="contextmenu.isActionAllowed()"
|
||||
ng-click="contextmenu.copyValue()">
|
||||
Copy value
|
||||
</vn-item>
|
||||
</slot-menu>
|
||||
</vn-contextmenu>
|
||||
|
|
@ -2,26 +2,89 @@ import ngModule from '../../module';
|
|||
import Section from 'salix/components/section';
|
||||
|
||||
export default class Controller extends Section {
|
||||
constructor($element, $) {
|
||||
super($element, $);
|
||||
|
||||
const date = new Date();
|
||||
this.dateFrom = date;
|
||||
this.dateTo = date;
|
||||
this.filter = {
|
||||
where: {
|
||||
'v.stamp': {
|
||||
between: this.dateRange()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.smartTableOptions = {
|
||||
activeButtons: {
|
||||
search: true
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
field: 'clientFk',
|
||||
autocomplete: {
|
||||
url: 'Clients',
|
||||
showField: 'name',
|
||||
valueField: 'id'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'salesPersonFk',
|
||||
autocomplete: {
|
||||
url: 'Workers/activeWithInheritedRole',
|
||||
where: `{role: 'salesPerson'}`,
|
||||
searchFunction: '{firstName: $search}',
|
||||
showField: 'nickname',
|
||||
valueField: 'id',
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'dated',
|
||||
searchable: false
|
||||
},
|
||||
{
|
||||
field: 'hour',
|
||||
searchable: false
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
|
||||
exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'dated':
|
||||
return {'s.lastUpdate': {
|
||||
between: this.dateRange(value)}
|
||||
};
|
||||
case 'clientFk':
|
||||
return {[`c.id`]: value};
|
||||
case 'salesPersonFk':
|
||||
return {[`c.${param}`]: value};
|
||||
}
|
||||
}
|
||||
|
||||
dateRange(value) {
|
||||
const minHour = new Date(value);
|
||||
dateRange() {
|
||||
let from = this.dateFrom;
|
||||
let to = this.dateTo;
|
||||
if (!from)
|
||||
from = new Date();
|
||||
if (!to)
|
||||
to = new Date();
|
||||
const minHour = new Date(from);
|
||||
minHour.setHours(0, 0, 0, 0);
|
||||
const maxHour = new Date(value);
|
||||
const maxHour = new Date(to);
|
||||
maxHour.setHours(23, 59, 59, 59);
|
||||
|
||||
return [minHour, maxHour];
|
||||
}
|
||||
|
||||
addFilterDate() {
|
||||
this.$.model.filter = {
|
||||
where: {
|
||||
'v.stamp': {
|
||||
between: this.dateRange()
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$.model.refresh();
|
||||
}
|
||||
}
|
||||
|
||||
ngModule.vnComponent('vnMonitorSalesClients', {
|
||||
|
|
|
|||
Loading…
Reference in New Issue