merge
This commit is contained in:
commit
2e141f062b
|
@ -21,6 +21,12 @@ export default class ColumnHeader {
|
||||||
}
|
}
|
||||||
return showArrow;
|
return showArrow;
|
||||||
}
|
}
|
||||||
|
$onInit() {
|
||||||
|
if (this.defaultOrder) {
|
||||||
|
this.order = this.defaultOrder;
|
||||||
|
this.onClick();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
ColumnHeader.$inject = [];
|
ColumnHeader.$inject = [];
|
||||||
|
|
||||||
|
@ -29,7 +35,8 @@ module.component('vnColumnHeader', {
|
||||||
bindings: {
|
bindings: {
|
||||||
field: '@?',
|
field: '@?',
|
||||||
text: '@?',
|
text: '@?',
|
||||||
className: '@?'
|
className: '@?',
|
||||||
|
defaultOrder: '@?'
|
||||||
},
|
},
|
||||||
require: {
|
require: {
|
||||||
gridHeader: '^^vnGridHeader'
|
gridHeader: '^^vnGridHeader'
|
||||||
|
|
|
@ -67,4 +67,22 @@ describe('Component vnColumnHeader', () => {
|
||||||
expect(result).toEqual(false);
|
expect(result).toEqual(false);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('onInit()', () => {
|
||||||
|
it(`should never call onClick()`, () => {
|
||||||
|
spyOn(controller, 'onClick');
|
||||||
|
controller.$onInit();
|
||||||
|
|
||||||
|
expect(controller.onClick).not.toHaveBeenCalledWith();
|
||||||
|
});
|
||||||
|
|
||||||
|
it(`should define controllers order as per defaultOrder then call onClick()`, () => {
|
||||||
|
controller.defaultOrder = 'ASC';
|
||||||
|
spyOn(controller, 'onClick');
|
||||||
|
controller.$onInit();
|
||||||
|
|
||||||
|
expect(controller.order).toEqual('ASC');
|
||||||
|
expect(controller.onClick).toHaveBeenCalledWith();
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -64,12 +64,12 @@ export default class MultiCheck {
|
||||||
if (this.type.id && this.type.id !== 'all' && this.type.id !== 'any') {
|
if (this.type.id && this.type.id !== 'all' && this.type.id !== 'any') {
|
||||||
if (this.type.id.length > 3 && this.type.id.substr(0, 3) === 'no-') {
|
if (this.type.id.length > 3 && this.type.id.substr(0, 3) === 'no-') {
|
||||||
let label = this.type.id.replace('no-', '');
|
let label = this.type.id.replace('no-', '');
|
||||||
checked = el[label] == null;
|
checked = Boolean(el[label]) === false;
|
||||||
} else if (this.type.id.length > 6 && this.type.id.substr(0, 6) === 'equal-') {
|
} else if (this.type.id.length > 6 && this.type.id.substr(0, 6) === 'equal-') {
|
||||||
let label = this.type.id.replace('equal-', '');
|
let label = this.type.id.replace('equal-', '');
|
||||||
checked = (el[label] && el[label] === this.type.name);
|
checked = (el[label] && el[label] === this.type.name);
|
||||||
} else {
|
} else {
|
||||||
checked = el[this.type.id] != null;
|
checked = Boolean(el[this.type.id]) === true;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
checked = this.checkAll === 1;
|
checked = this.checkAll === 1;
|
||||||
|
|
|
@ -3,10 +3,26 @@ import ngModule from '../module';
|
||||||
class LocatorIndex {
|
class LocatorIndex {
|
||||||
constructor($state) {
|
constructor($state) {
|
||||||
this.$state = $state;
|
this.$state = $state;
|
||||||
this.routes = [
|
this.routes = [];
|
||||||
{id: 1, zoneFk: 1, postalcode: 46006, order: 1, preparado: '25/08', entrada: '26/08', ticket: 1547892, routeFk: 9999, alias: 'Flores Vendrell', bultos: 12, m3: 0.23},
|
|
||||||
{id: 2, zoneFk: 1, postalcode: 46006, order: 1, preparado: '25/08', entrada: '26/08', ticket: 1547892, routeFk: 9999, alias: 'Flores Vendrell', bultos: 12, m3: 0.23}
|
for (let i = 1; i < 100; i++) {
|
||||||
];
|
let route = {
|
||||||
|
id: i,
|
||||||
|
zoneFk: Math.floor(Math.random() * 6) + 1,
|
||||||
|
postalcode: 46006,
|
||||||
|
order: Math.floor(Math.random() * 3) + 1,
|
||||||
|
preparado: '25/08',
|
||||||
|
entrada: '26/08',
|
||||||
|
ticket: 1547890 + i,
|
||||||
|
routeFk: Math.floor(Math.random() * 9999) + 1000,
|
||||||
|
alias: `Flores X${Math.floor(Math.random() * 3) + 1}`,
|
||||||
|
bultos: Math.floor(Math.random() * 20) + 10,
|
||||||
|
m3: (Math.random()).toFixed(2),
|
||||||
|
error: (Math.floor(Math.random() * 3) + 1) === 1
|
||||||
|
};
|
||||||
|
route.success = (!route.error && (Math.floor(Math.random() * 3) + 1) === 1);
|
||||||
|
this.routes.push(route);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
LocatorIndex.$inject = ['$state'];
|
LocatorIndex.$inject = ['$state'];
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
{
|
{
|
||||||
"Routes locator": "Localizador de rutas",
|
"Routes locator": "Localizador de rutas",
|
||||||
"Filter": "Filtro",
|
"Filter": "Filtro",
|
||||||
"Store": "Almacén"
|
"Store": "Almacén",
|
||||||
|
"Address": "Dirección"
|
||||||
}
|
}
|
|
@ -1,41 +1,60 @@
|
||||||
<vn-vertical>
|
<vn-vertical>
|
||||||
<vn-grid-header on-order="$ctrl.onOrder(field, order)">
|
<vn-grid-header on-order="$ctrl.onOrder(field, order)">
|
||||||
<vn-column-header vn-none min-none>
|
<vn-column-header vn-one pad-medium-h>
|
||||||
<vn-multi-check check-all="$ctrl.checkAll" models="$ctrl.routes" options="[{id:'all',name:'Todos'},{id:'any',name:'Ninguno'}]"></vn-multi-check>
|
<vn-multi-check
|
||||||
|
check-all="$ctrl.checkAll"
|
||||||
|
models="$ctrl.routes"
|
||||||
|
options="[{id:'all',name:'Todos'},{id:'any',name:'Ninguno'}, {id:'error', name:'Con problema'}, {id:'no-error', name:'Sin problema'}]"
|
||||||
|
></vn-multi-check>
|
||||||
</vn-column-header>
|
</vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="zoneFk" text="Zona"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="zoneFk" text="Zona"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="postalcode" text="Postal Code"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="postalcode" text="Postal Code"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="order" text="Order"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="order" text="Order" default-order="DESC"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="preparado" text="Preparado"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="preparado" text="Preparado"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="entrada" text="Entrada"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="entrada" text="Entrada"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="ticket" text="Ticket"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="ticket" text="Ticket"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="routeFk" text="ID de ruta"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="routeFk" text="ID de ruta"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="alias" text="Alias"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="alias" text="Alias"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="bultos" text="Bultos"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="bultos" text="Bultos"></vn-column-header>
|
||||||
<vn-column-header vn-one pad-medium-h field="m3" text="m3"></vn-column-header>
|
<vn-column-header vn-two pad-medium-h field="m3" text="m3"></vn-column-header>
|
||||||
</vn-grid-header>
|
</vn-grid-header>
|
||||||
<vn-twoe class="list list-content">
|
<vn-one class="list list-content">
|
||||||
<vn-vertical class="list list-element text-center" ng-repeat="route in $ctrl.routes">
|
<vn-vertical
|
||||||
|
class="list list-element text-center"
|
||||||
|
ng-repeat="route in $ctrl.pageTable.model track by route.id"
|
||||||
|
ng-class="{warning: route.error, success: route.success}"
|
||||||
|
>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-none pad-medium-h></vn-none>
|
<vn-one pad-medium-h></vn-one>
|
||||||
<vn-one pad-medium-h>{{::route.zoneFk}}</vn-one>
|
<vn-two pad-medium-h>{{::route.zoneFk}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.postalcode}}</vn-one>
|
<vn-two pad-medium-h>{{::route.postalcode}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.order}}</vn-one>
|
<vn-two pad-medium-h>{{::route.order}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.preparado}}</vn-one>
|
<vn-two pad-medium-h>{{::route.preparado}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.entrada}}</vn-one>
|
<vn-two pad-medium-h>{{::route.entrada}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.ticket}}</vn-one>
|
<vn-two pad-medium-h>{{::route.ticket}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.routeFk}}</vn-one>
|
<vn-two pad-medium-h>{{::route.routeFk}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.alias}}</vn-one>
|
<vn-two pad-medium-h>{{::route.alias}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.bultos}}</vn-one>
|
<vn-two pad-medium-h>{{::route.bultos}}</vn-two>
|
||||||
<vn-one pad-medium-h>{{::route.m3}}</vn-one>
|
<vn-two pad-medium-h>{{::route.m3}}</vn-two>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal margin-small-top>
|
<vn-horizontal margin-small-top>
|
||||||
<vn-none>
|
<vn-none pad-medium-h margin--small-top>
|
||||||
<vn-check model="route.checked"></vn-check>
|
<vn-check model="route.checked"></vn-check>
|
||||||
</vn-none>
|
</vn-none>
|
||||||
<vn-one></vn-one>
|
<vn-none pad-medium-h></vn-none>
|
||||||
<vn-six text-left pad-small border-solid>Direccion: </vn-twoe>
|
<vn-one text-left pad-small border-solid>
|
||||||
|
<strong translate>Address</strong>: {{::route.address}}
|
||||||
|
</vn-one>
|
||||||
|
<vn-none pad-medium-h>
|
||||||
|
<vn-icon icon="more" vn-tooltip tooltip-template="/static/templates/tooltip.routes.tpl.html" tooltip-position="left"></vn-icon>
|
||||||
|
</vn-none>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
</vn-vertical>
|
</vn-vertical>
|
||||||
</vn-one>
|
</vn-one>
|
||||||
|
<vn-horizontal vn-one class="list list-footer">
|
||||||
|
|
||||||
|
</vn-horizontal>
|
||||||
|
<vn-one>
|
||||||
|
<vn-paging page-change="$ctrl.paginate()" index="$ctrl.pageTable" total="$ctrl.totalFilter"></vn-paging>
|
||||||
|
</vn-one>
|
||||||
</vn-vertical>
|
</vn-vertical>
|
|
@ -1,11 +1,41 @@
|
||||||
import ngModule from '../module';
|
import ngModule from '../module';
|
||||||
|
|
||||||
class LocatorTable {
|
class LocatorTable {
|
||||||
constructor($state) {
|
constructor($filter) {
|
||||||
this.$state = $state;
|
this.$filter = $filter;
|
||||||
|
this.itemsDisplayedInList = 7;
|
||||||
|
this.pageTable = {
|
||||||
|
filter: {
|
||||||
|
page: 1,
|
||||||
|
size: this.itemsDisplayedInList
|
||||||
|
},
|
||||||
|
model: []
|
||||||
|
};
|
||||||
|
this._routes = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
set routes(value) {
|
||||||
|
this._routes = value;
|
||||||
|
this.totalFilter = this._routes.length;
|
||||||
|
this.pageTable.filter.page = 1;
|
||||||
|
this.paginate();
|
||||||
|
}
|
||||||
|
get routes() {
|
||||||
|
return this._routes;
|
||||||
|
}
|
||||||
|
|
||||||
|
onOrder(field, order) {
|
||||||
|
let reverse = order === 'DESC';
|
||||||
|
this.routes = this.$filter('orderBy')(this.routes, field, reverse);
|
||||||
|
this.paginate();
|
||||||
|
}
|
||||||
|
paginate() {
|
||||||
|
let init = (this.pageTable.filter.page - 1) * this.itemsDisplayedInList;
|
||||||
|
let fin = this.pageTable.filter.page * this.itemsDisplayedInList;
|
||||||
|
this.pageTable.model = this.routes.slice(init, fin);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
LocatorTable.$inject = ['$state'];
|
LocatorTable.$inject = ['$filter'];
|
||||||
|
|
||||||
ngModule.component('vnLocatorTable', {
|
ngModule.component('vnLocatorTable', {
|
||||||
template: require('./locator-table.html'),
|
template: require('./locator-table.html'),
|
||||||
|
|
|
@ -5,4 +5,8 @@ $color-white: white;
|
||||||
$color-dark: #3c393b;
|
$color-dark: #3c393b;
|
||||||
$color-dark-grey: #424242;
|
$color-dark-grey: #424242;
|
||||||
$color-light-grey: #e6e6e6;
|
$color-light-grey: #e6e6e6;
|
||||||
$color-medium-grey: #9D9D9D;
|
$color-medium-grey: #9D9D9D;
|
||||||
|
$color-medium-green: #CCEC9E;
|
||||||
|
$color-medium-orange: #FFD29C;
|
||||||
|
$color-light-green: #D7F1BD;
|
||||||
|
$color-light-orange: #FFDEBB;
|
|
@ -87,3 +87,30 @@ html [margin-large-h], .margin-large-h {
|
||||||
margin-left: $margin-large;
|
margin-left: $margin-large;
|
||||||
margin-right: $margin-large;
|
margin-right: $margin-large;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Minus Small */
|
||||||
|
|
||||||
|
html [margin--small], .margin--small {
|
||||||
|
margin: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-top], .margin--small-top {
|
||||||
|
margin-top: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-left], .margin--small-left {
|
||||||
|
margin-left: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-right], .margin--small-right {
|
||||||
|
margin-right: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-bottom], .margin--small-bottom {
|
||||||
|
margin-bottom: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-v], .margin--small-v {
|
||||||
|
margin-top: -$margin-small;
|
||||||
|
margin-bottom: -$margin-small;
|
||||||
|
}
|
||||||
|
html [margin--small-h], .margin--small-h {
|
||||||
|
margin-left: -$margin-small;
|
||||||
|
margin-right: -$margin-small;
|
||||||
|
}
|
|
@ -76,21 +76,17 @@ html [vn-center], .vn-center{
|
||||||
border-top: 3px solid $color-medium-grey;
|
border-top: 3px solid $color-medium-grey;
|
||||||
}
|
}
|
||||||
.list-element.warning{
|
.list-element.warning{
|
||||||
background-color: $color-orange;
|
background-color: $color-medium-orange;
|
||||||
color:$color-white;
|
}
|
||||||
font-weight: bold;
|
.list-element.success{
|
||||||
i {
|
background-color: $color-medium-green;
|
||||||
color: $color-white;
|
|
||||||
}
|
}
|
||||||
.mdl-checkbox.is-checked .mdl-checkbox__box-outline{
|
.list-element.success:hover{
|
||||||
border-color: $color-white;
|
background-color: $color-light-green;
|
||||||
}
|
}
|
||||||
.mdl-checkbox.is-checked .mdl-checkbox__tick-outline{
|
.list-element.warning:hover{
|
||||||
background-color: $color-white;
|
background-color: $color-light-orange;
|
||||||
}
|
|
||||||
&:hover{
|
|
||||||
opacity: 0.7;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.flatpickr-month, .flatpickr-weekdays, span.flatpickr-weekday {
|
.flatpickr-month, .flatpickr-weekdays, span.flatpickr-weekday {
|
||||||
background-color: $color-orange;
|
background-color: $color-orange;
|
||||||
|
|
|
@ -0,0 +1,14 @@
|
||||||
|
<vn-vertical>
|
||||||
|
<vn-horizontal class="list list-header">
|
||||||
|
<vn-one margin-medium-right>Población</vn-one>
|
||||||
|
<vn-one margin-medium-right>Provincia</vn-one>
|
||||||
|
<vn-two margin-medium-right>ID_Cliente</vn-two>
|
||||||
|
<vn-two>Comercial</vn-two>
|
||||||
|
</vn-horizontal>
|
||||||
|
<vn-horizontal class="list list-element">
|
||||||
|
<vn-one margin-medium-right>{{::ticket.city | ucwords}}</vn-one>
|
||||||
|
<vn-one margin-medium-right>{{::ticket.province | ucwords}}</vn-one>
|
||||||
|
<vn-two margin-medium-right>{{::ticket.client | ucwords}}</vn-two>
|
||||||
|
<vn-two>{{::ticket.worker | ucwords}}</vn-two>
|
||||||
|
</vn-horizontal>
|
||||||
|
</vn-vertical>
|
Loading…
Reference in New Issue