Merge pull request 'fixes #5206 travel buscador en el lateral' (!1384) from 5206-travel-buscadorLateral into dev
Reviewed-on: #1384 Reviewed-by: Javi Gallego <jgallego@verdnatura.es> Reviewed-by: Joan Sanchez <joan@verdnatura.es>
This commit is contained in:
commit
cafb21d90b
|
|
@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
### Changed
|
||||
- (Monitor tickets) Cuando se filtra por 'Pendiente' ya no muestra los estados de 'Previa'
|
||||
- (Envíos -> Extra comunitarios) Se agrupan las entradas del mismo travel. Añadidos campos Referencia y Importe.
|
||||
- (Envíos -> Índice) Cambiado el buscador superior por uno lateral
|
||||
|
||||
### Fixed
|
||||
-
|
||||
|
|
|
|||
|
|
@ -1147,7 +1147,16 @@ export default {
|
|||
landingDate: 'vn-travel-create vn-date-picker[ng-model="$ctrl.travel.landed"]',
|
||||
warehouseOut: 'vn-travel-create vn-autocomplete[ng-model="$ctrl.travel.warehouseOutFk"]',
|
||||
warehouseIn: 'vn-travel-create vn-autocomplete[ng-model="$ctrl.travel.warehouseInFk"]',
|
||||
save: 'vn-travel-create vn-submit > button'
|
||||
save: 'vn-travel-create vn-submit > button',
|
||||
generalSearchFilter: 'vn-travel-search-panel vn-textfield[ng-model="$ctrl.search"]',
|
||||
agencyFilter: 'vn-travel-search-panel vn-autocomplete[ng-model="$ctrl.filter.agencyModeFk"]',
|
||||
warehouseOutFilter: 'vn-travel-search-panel vn-autocomplete[ng-model="$ctrl.filter.warehouseOutFk"]',
|
||||
warehouseInFilter: 'vn-travel-search-panel vn-autocomplete[ng-model="$ctrl.filter.warehouseInFk"]',
|
||||
scopeDaysFilter: 'vn-travel-search-panel vn-input-number[ng-model="$ctrl.filter.scopeDays"]',
|
||||
continentFilter: 'vn-travel-search-panel vn-autocomplete[ng-model="$ctrl.filter.continent"]',
|
||||
totalEntriesFilter: 'vn-travel-search-panel vn-input-number[ng-model="$ctrl.totalEntries"]',
|
||||
chip: 'vn-travel-search-panel vn-chip > vn-icon',
|
||||
|
||||
},
|
||||
travelExtraCommunity: {
|
||||
anySearchResult: 'vn-travel-extra-community > vn-card div > tbody > tr[ng-attr-id="{{::travel.id}}"]',
|
||||
|
|
|
|||
|
|
@ -9,7 +9,8 @@ describe('Travel basic data path', () => {
|
|||
browser = await getBrowser();
|
||||
page = browser.page;
|
||||
await page.loginAndModule('buyer', 'travel');
|
||||
await page.accessToSearchResult('3');
|
||||
await page.write(selectors.travelIndex.generalSearchFilter, '3');
|
||||
await page.keyboard.press('Enter');
|
||||
await page.accessToSection('travel.card.basicData');
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,8 @@ describe('Travel descriptor path', () => {
|
|||
browser = await getBrowser();
|
||||
page = browser.page;
|
||||
await page.loginAndModule('buyer', 'travel');
|
||||
await page.accessToSearchResult('1');
|
||||
await page.write(selectors.travelIndex.generalSearchFilter, '1');
|
||||
await page.keyboard.press('Enter');
|
||||
await page.waitForState('travel.card.summary');
|
||||
});
|
||||
|
||||
|
|
@ -81,7 +82,8 @@ describe('Travel descriptor path', () => {
|
|||
await page.waitToClick('.cancel');
|
||||
await page.waitToClick(selectors.globalItems.homeButton);
|
||||
await page.selectModule('travel');
|
||||
await page.accessToSearchResult('3');
|
||||
await page.write(selectors.travelIndex.generalSearchFilter, '3');
|
||||
await page.keyboard.press('Enter');
|
||||
await page.waitForState('travel.card.summary');
|
||||
const state = await page.getState();
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,8 @@ describe('Travel thermograph path', () => {
|
|||
browser = await getBrowser();
|
||||
page = browser.page;
|
||||
await page.loginAndModule('buyer', 'travel');
|
||||
await page.accessToSearchResult('3');
|
||||
await page.write(selectors.travelIndex.generalSearchFilter, '3');
|
||||
await page.keyboard.press('Enter');
|
||||
await page.accessToSection('travel.card.thermograph.index');
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,62 @@
|
|||
import selectors from '../../helpers/selectors.js';
|
||||
import getBrowser from '../../helpers/puppeteer';
|
||||
|
||||
describe('Travel search panel path', () => {
|
||||
let browser;
|
||||
let page;
|
||||
let httpRequest;
|
||||
|
||||
beforeAll(async() => {
|
||||
browser = await getBrowser();
|
||||
page = browser.page;
|
||||
await page.loginAndModule('buyer', 'travel');
|
||||
page.on('request', req => {
|
||||
if (req.url().includes(`Travels/filter`))
|
||||
httpRequest = req.url();
|
||||
});
|
||||
});
|
||||
|
||||
afterAll(async() => {
|
||||
await browser.close();
|
||||
});
|
||||
|
||||
it('should filter using all the fields', async() => {
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.write(selectors.travelIndex.generalSearchFilter, 'travel');
|
||||
await page.keyboard.press('Enter');
|
||||
|
||||
expect(httpRequest).toContain('search=travel');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.autocompleteSearch(selectors.travelIndex.agencyFilter, 'Entanglement');
|
||||
|
||||
expect(httpRequest).toContain('agencyModeFk');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.autocompleteSearch(selectors.travelIndex.warehouseOutFilter, 'Warehouse One');
|
||||
|
||||
expect(httpRequest).toContain('warehouseOutFk');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.autocompleteSearch(selectors.travelIndex.warehouseInFilter, 'Warehouse Two');
|
||||
|
||||
expect(httpRequest).toContain('warehouseInFk');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.overwrite(selectors.travelIndex.scopeDaysFilter, '15');
|
||||
await page.keyboard.press('Enter');
|
||||
|
||||
expect(httpRequest).toContain('scopeDays=15');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.autocompleteSearch(selectors.travelIndex.continentFilter, 'Asia');
|
||||
|
||||
expect(httpRequest).toContain('continent');
|
||||
|
||||
await page.click(selectors.travelIndex.chip);
|
||||
await page.write(selectors.travelIndex.totalEntriesFilter, '1');
|
||||
await page.keyboard.press('Enter');
|
||||
|
||||
expect(httpRequest).toContain('totalEntries=1');
|
||||
});
|
||||
});
|
||||
|
|
@ -26,7 +26,7 @@ Value should have at most %s characters: El valor debe tener un máximo de %s ca
|
|||
Enter a new search: Introduce una nueva búsqueda
|
||||
No results: Sin resultados
|
||||
Ups! It seems there was an error: ¡Vaya! Parece que ha habido un error
|
||||
General search: Busqueda general
|
||||
General search: Búsqueda general
|
||||
January: Enero
|
||||
February: Febrero
|
||||
March: Marzo
|
||||
|
|
@ -42,9 +42,9 @@ December: Diciembre
|
|||
Monday: Lunes
|
||||
Tuesday: Martes
|
||||
Wednesday: Miércoles
|
||||
Thursday: Jueves
|
||||
Friday: Viernes
|
||||
Saturday: Sábado
|
||||
Thursday: Jueves
|
||||
Friday: Viernes
|
||||
Saturday: Sábado
|
||||
Sunday: Domingo
|
||||
Has delivery: Hay reparto
|
||||
Loading: Cargando
|
||||
|
|
@ -63,4 +63,4 @@ Loading...: Cargando...
|
|||
No results found: Sin resultados
|
||||
No data: Sin datos
|
||||
Undo changes: Deshacer cambios
|
||||
Load more results: Cargar más resultados
|
||||
Load more results: Cargar más resultados
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
$font-size: 11pt;
|
||||
$menu-width: 256px;
|
||||
$right-menu-width: 318px;
|
||||
$topbar-height: 56px;
|
||||
$mobile-width: 800px;
|
||||
$float-spacing: 20px;
|
||||
|
|
|
|||
|
|
@ -88,13 +88,13 @@ vn-layout {
|
|||
}
|
||||
&.right-menu {
|
||||
& > vn-topbar > .end {
|
||||
width: 80px + $menu-width;
|
||||
width: 80px + $right-menu-width;
|
||||
}
|
||||
& > .main-view {
|
||||
padding-right: $menu-width;
|
||||
padding-right: $right-menu-width;
|
||||
}
|
||||
[fixed-bottom-right] {
|
||||
right: $menu-width;
|
||||
right: $right-menu-width;
|
||||
}
|
||||
}
|
||||
& > .main-view {
|
||||
|
|
|
|||
|
|
@ -6,6 +6,6 @@ Phy. KG: KG físico
|
|||
Vol. KG: KG Vol.
|
||||
Search by travel id or reference: Buscar por id de travel o referencia
|
||||
Search by extra community travel: Buscar por envío extra comunitario
|
||||
Continent Out: Continente salida
|
||||
Continent Out: Cont. salida
|
||||
W. Shipped: F. envío
|
||||
W. Landed: F. llegada
|
||||
W. Landed: F. llegada
|
||||
|
|
|
|||
|
|
@ -2,6 +2,15 @@
|
|||
<vn-auto-search
|
||||
model="model">
|
||||
</vn-auto-search>
|
||||
<vn-travel-search-panel
|
||||
model="model">
|
||||
</vn-travel-search-panel>
|
||||
<vn-crud-model
|
||||
vn-id="model"
|
||||
url="Travels/filter"
|
||||
limit="20"
|
||||
order="shipped DESC, landed DESC">
|
||||
</vn-crud-model>
|
||||
<vn-data-viewer
|
||||
model="model"
|
||||
class="vn-mb-xl vn-w-xl">
|
||||
|
|
@ -9,23 +18,22 @@
|
|||
<vn-table model="model">
|
||||
<vn-thead>
|
||||
<vn-tr>
|
||||
<vn-th field="id" number filter-enabled="false">Id</vn-th>
|
||||
<vn-th field="ref">Reference</vn-th>
|
||||
<vn-th field="agencyModeFk">Agency</vn-th>
|
||||
<vn-th field="warehouseOutFk">Warehouse Out</vn-th>
|
||||
<vn-th field="shipped" center shrink-date>Shipped</vn-th>
|
||||
<vn-th field="isDelivered" center>Delivered</vn-th>
|
||||
<vn-th shrink></vn-th>
|
||||
<vn-th field="warehouseInFk">Warehouse In</vn-th>
|
||||
<vn-th field="landed" center shrink-date>Landed</vn-th>
|
||||
<vn-th field="isReceived" center>Received</vn-th>
|
||||
<vn-th shrink></vn-th>
|
||||
<vn-th shrink field="totalEntries">Total entries</vn-th>
|
||||
<vn-th shrink></vn-th>
|
||||
</vn-tr>
|
||||
</vn-thead>
|
||||
<vn-tbody>
|
||||
<a ng-repeat="travel in model.data"
|
||||
<a ng-repeat="travel in model.data"
|
||||
class="clickable vn-tr search-result"
|
||||
ui-sref="travel.card.summary({id: {{::travel.id}}})">
|
||||
<vn-td number>{{::travel.id}}</vn-td>
|
||||
<vn-td>{{::travel.ref}}</vn-td>
|
||||
<vn-td>{{::travel.agencyModeName}}</vn-td>
|
||||
<vn-td>{{::travel.warehouseOutName}}</vn-td>
|
||||
|
|
@ -34,14 +42,27 @@
|
|||
{{::travel.shipped | date:'dd/MM/yyyy'}}
|
||||
</span>
|
||||
</vn-td>
|
||||
<vn-td center><vn-check ng-model="travel.isDelivered" disabled="true"></vn-check></vn-td>
|
||||
<vn-td shrink>
|
||||
<vn-icon
|
||||
icon="flight_takeoff"
|
||||
translate-attr="{title: 'Delivered'}"
|
||||
ng-class="{active: travel.isDelivered}">
|
||||
</vn-icon>
|
||||
</vn-td>
|
||||
<vn-td expand>{{::travel.warehouseInName}}</vn-td>
|
||||
<vn-td center shrink-date>
|
||||
<span class="chip {{$ctrl.compareDate(travel.landed)}}">
|
||||
{{::travel.landed | date:'dd/MM/yyyy'}}
|
||||
</span>
|
||||
</vn-td>
|
||||
<vn-td center><vn-check ng-model="travel.isReceived" disabled="true"></vn-check></vn-td>
|
||||
<vn-td shrink>
|
||||
<vn-icon
|
||||
icon="flight_land"
|
||||
translate-attr="{title: 'Received'}"
|
||||
ng-class="{active: travel.isReceived}">
|
||||
</vn-icon>
|
||||
</vn-td>
|
||||
<vn-td shrink>{{::travel.totalEntries}}</vn-td>
|
||||
<vn-td shrink>
|
||||
<vn-horizontal class="buttons">
|
||||
<vn-icon-button
|
||||
|
|
@ -49,7 +70,7 @@
|
|||
vn-tooltip="Clone"
|
||||
icon="icon-clone">
|
||||
</vn-icon-button>
|
||||
<vn-icon-button
|
||||
<vn-icon-button
|
||||
vn-anchor="::{state: 'entry.create', params: {travelFk: travel.id}}"
|
||||
vn-tooltip="Add entry"
|
||||
icon="icon-ticket">
|
||||
|
|
@ -78,38 +99,9 @@
|
|||
fixed-bottom-right>
|
||||
<vn-float-button icon="add"></vn-float-button>
|
||||
</a>
|
||||
<vn-confirm
|
||||
<vn-confirm
|
||||
vn-id="clone"
|
||||
on-accept="$ctrl.onCloneAccept($data)"
|
||||
question="Do you want to clone this travel?"
|
||||
message="All it's properties will be copied">
|
||||
</vn-confirm>
|
||||
<vn-contextmenu vn-id="contextmenu" targets="['vn-data-viewer']" 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>
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
import ngModule from '../module';
|
||||
import Section from 'salix/components/section';
|
||||
import './style.scss';
|
||||
|
||||
export default class Controller extends Section {
|
||||
preview(travel) {
|
||||
|
|
@ -30,37 +31,6 @@ export default class Controller extends Section {
|
|||
if (timeDifference == 0) return 'warning';
|
||||
if (timeDifference < 0) return 'success';
|
||||
}
|
||||
|
||||
exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'search':
|
||||
return /^\d+$/.test(value)
|
||||
? {'t.id': value}
|
||||
: {'t.ref': {like: `%${value}%`}};
|
||||
case 'ref':
|
||||
return {'t.ref': {like: `%${value}%`}};
|
||||
case 'shipped':
|
||||
return {'t.shipped': {between: this.dateRange(value)}};
|
||||
case 'landed':
|
||||
return {'t.landed': {between: this.dateRange(value)}};
|
||||
case 'id':
|
||||
case 'agencyModeFk':
|
||||
case 'warehouseOutFk':
|
||||
case 'warehouseInFk':
|
||||
case 'totalEntries':
|
||||
param = `t.${param}`;
|
||||
return {[param]: value};
|
||||
}
|
||||
}
|
||||
|
||||
dateRange(value) {
|
||||
const minHour = new Date(value);
|
||||
minHour.setHours(0, 0, 0, 0);
|
||||
const maxHour = new Date(value);
|
||||
maxHour.setHours(23, 59, 59, 59);
|
||||
|
||||
return [minHour, maxHour];
|
||||
}
|
||||
}
|
||||
|
||||
ngModule.vnComponent('vnTravelIndex', {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,11 @@
|
|||
@import "variables";
|
||||
|
||||
vn-travel-index {
|
||||
vn-icon {
|
||||
color: $color-font-secondary
|
||||
}
|
||||
|
||||
vn-icon.active {
|
||||
color: $color-success
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
#Ordenar alfabeticamente
|
||||
Reference: Referencia
|
||||
Warehouse Out: Almacén salida
|
||||
Warehouse In: Almacén llegada
|
||||
Warehouse Out: Alm salida
|
||||
Warehouse In: Alm llegada
|
||||
Shipped from: Salida desde
|
||||
Shipped to: Salida hasta
|
||||
Landed from: Llegada desde
|
||||
|
|
@ -10,12 +10,12 @@ Shipped: F. salida
|
|||
Landed: F. llegada
|
||||
Delivered: Enviado
|
||||
Received: Recibido
|
||||
Travel id: Id envío
|
||||
Search travels by id: Buscar envíos por identificador
|
||||
Travel id: Id
|
||||
Search travels by id: Buscar envíos por identificador o referencia
|
||||
New travel: Nuevo envío
|
||||
travel: envío
|
||||
|
||||
# Sections
|
||||
Travels: Envíos
|
||||
Log: Historial
|
||||
Thermographs: Termógrafos
|
||||
Thermographs: Termógrafos
|
||||
|
|
|
|||
|
|
@ -1,20 +1,6 @@
|
|||
<vn-crud-model
|
||||
vn-id="model"
|
||||
url="Travels/filter"
|
||||
limit="20"
|
||||
order="shipped DESC, landed DESC">
|
||||
</vn-crud-model>
|
||||
<vn-portal slot="topbar">
|
||||
<vn-searchbar
|
||||
vn-focus
|
||||
panel="vn-travel-search-panel"
|
||||
info="Search travels by id"
|
||||
model="model"
|
||||
fetch-params="$ctrl.fetchParams($params)"
|
||||
suggested-filter="$ctrl.filterParams">
|
||||
</vn-searchbar>
|
||||
</vn-portal>
|
||||
<vn-portal slot="menu">
|
||||
<vn-left-menu></vn-left-menu>
|
||||
</vn-portal>
|
||||
<ui-view></ui-view>
|
||||
<ui-view></ui-view>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,6 @@ import ModuleMain from 'salix/components/module-main';
|
|||
export default class Travel extends ModuleMain {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
this.filterParams = {
|
||||
scopeDays: 1
|
||||
};
|
||||
}
|
||||
|
||||
fetchParams($params) {
|
||||
if (!Object.entries($params).length)
|
||||
$params.scopeDays = 1;
|
||||
|
||||
if (typeof $params.scopeDays === 'number') {
|
||||
const shippedFrom = Date.vnNew();
|
||||
shippedFrom.setHours(0, 0, 0, 0);
|
||||
|
||||
const shippedTo = new Date(shippedFrom.getTime());
|
||||
shippedTo.setDate(shippedTo.getDate() + $params.scopeDays);
|
||||
shippedTo.setHours(23, 59, 59, 999);
|
||||
|
||||
Object.assign($params, {shippedFrom, shippedTo});
|
||||
}
|
||||
|
||||
return $params;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,49 +0,0 @@
|
|||
import './index.js';
|
||||
|
||||
describe('Travel Component vnTravel', () => {
|
||||
let controller;
|
||||
|
||||
beforeEach(ngModule('travel'));
|
||||
|
||||
beforeEach(inject($componentController => {
|
||||
let $element = angular.element(`<div></div>`);
|
||||
controller = $componentController('vnTravel', {$element});
|
||||
}));
|
||||
|
||||
describe('fetchParams()', () => {
|
||||
it('should return a range of dates with passed scope days', () => {
|
||||
let params = controller.fetchParams({
|
||||
scopeDays: 2
|
||||
});
|
||||
const shippedFrom = Date.vnNew();
|
||||
shippedFrom.setHours(0, 0, 0, 0);
|
||||
const shippedTo = new Date(shippedFrom.getTime());
|
||||
shippedTo.setDate(shippedTo.getDate() + params.scopeDays);
|
||||
shippedTo.setHours(23, 59, 59, 999);
|
||||
|
||||
const expectedParams = {
|
||||
shippedFrom,
|
||||
scopeDays: params.scopeDays,
|
||||
shippedTo
|
||||
};
|
||||
|
||||
expect(params).toEqual(expectedParams);
|
||||
});
|
||||
|
||||
it('should return default value for scope days', () => {
|
||||
let params = controller.fetchParams({
|
||||
scopeDays: 1
|
||||
});
|
||||
|
||||
expect(params.scopeDays).toEqual(1);
|
||||
});
|
||||
|
||||
it('should return the given scope days', () => {
|
||||
let params = controller.fetchParams({
|
||||
scopeDays: 2
|
||||
});
|
||||
|
||||
expect(params.scopeDays).toEqual(2);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -1,109 +1,146 @@
|
|||
<div class="search-panel">
|
||||
<form ng-submit="$ctrl.onSearch()" id="manifold-form">
|
||||
<vn-horizontal class="vn-px-lg vn-pt-lg">
|
||||
<vn-textfield
|
||||
vn-one
|
||||
label="General search"
|
||||
ng-model="filter.search"
|
||||
info="Search travels by id"
|
||||
vn-focus>
|
||||
</vn-textfield>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="vn-px-lg">
|
||||
<vn-textfield
|
||||
vn-one
|
||||
label="Reference"
|
||||
ng-model="filter.ref">
|
||||
</vn-textfield>
|
||||
<vn-textfield
|
||||
vn-one
|
||||
label="Total entries"
|
||||
ng-model="filter.totalEntries">
|
||||
</vn-textfield>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="vn-px-lg">
|
||||
<vn-textfield
|
||||
vn-one
|
||||
label="Travel id"
|
||||
ng-model="filter.id">
|
||||
</vn-textfield>
|
||||
<vn-autocomplete vn-one
|
||||
label="Agency"
|
||||
ng-model="filter.agencyModeFk"
|
||||
url="AgencyModes"
|
||||
show-field="name"
|
||||
value-field="id">
|
||||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<section class="vn-px-md">
|
||||
<vn-horizontal class="manifold-panel vn-pa-md">
|
||||
<vn-date-picker
|
||||
vn-one
|
||||
label="Shipped from"
|
||||
ng-model="filter.shippedFrom"
|
||||
on-change="$ctrl.shippedFrom = value">
|
||||
</vn-date-picker>
|
||||
<vn-date-picker
|
||||
vn-one
|
||||
label="Shipped to"
|
||||
ng-model="filter.shippedTo"
|
||||
on-change="$ctrl.shippedTo = value">
|
||||
</vn-date-picker>
|
||||
<vn-none class="or vn-px-md" translate>Or</vn-none>
|
||||
<vn-input-number
|
||||
vn-one
|
||||
min="0"
|
||||
step="1"
|
||||
label="Days onward"
|
||||
ng-model="filter.scopeDays"
|
||||
on-change="$ctrl.scopeDays = value"
|
||||
display-controls="true">
|
||||
</vn-input-number>
|
||||
<vn-icon color-marginal
|
||||
icon="info"
|
||||
vn-tooltip="Cannot choose a range of dates and days onward at the same time">
|
||||
</vn-icon>
|
||||
</vn-horizontal>
|
||||
</section>
|
||||
<vn-horizontal class="vn-px-lg">
|
||||
<vn-date-picker
|
||||
vn-one
|
||||
label="Landed from"
|
||||
ng-model="filter.landedFrom">
|
||||
</vn-date-picker>
|
||||
<vn-date-picker
|
||||
vn-one
|
||||
label="Landed to"
|
||||
ng-model="filter.landedTo">
|
||||
</vn-date-picker>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="vn-px-lg">
|
||||
<vn-autocomplete vn-one
|
||||
label="Warehouse Out"
|
||||
ng-model="filter.warehouseOutFk"
|
||||
url="Warehouses"
|
||||
show-field="name"
|
||||
value-field="id">
|
||||
</vn-autocomplete>
|
||||
<vn-autocomplete vn-one
|
||||
label="Warehouse In"
|
||||
ng-model="filter.warehouseInFk"
|
||||
url="Warehouses"
|
||||
show-field="name"
|
||||
value-field="id">
|
||||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="vn-px-lg">
|
||||
<vn-autocomplete vn-one
|
||||
label="Continent Out"
|
||||
ng-model="filter.continent"
|
||||
url="Continents"
|
||||
show-field="name"
|
||||
value-field="code">
|
||||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="vn-px-lg vn-pb-lg vn-mt-lg">
|
||||
<vn-submit label="Search"></vn-submit>
|
||||
</vn-horizontal>
|
||||
</form>
|
||||
</div>
|
||||
<vn-side-menu side="right">
|
||||
<vn-horizontal class="input">
|
||||
<vn-textfield
|
||||
label="General search"
|
||||
info="Search travels by id"
|
||||
ng-model="$ctrl.search"
|
||||
ng-keydown="$ctrl.onKeyPress($event, 'search')">
|
||||
</vn-textfield>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="input horizontal">
|
||||
<vn-autocomplete
|
||||
vn-id="agency"
|
||||
label="Agency"
|
||||
ng-model="$ctrl.filter.agencyModeFk"
|
||||
data="$ctrl.agencyModes"
|
||||
show-field="name"
|
||||
value-field="id"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="input horizontal">
|
||||
<vn-autocomplete
|
||||
vn-id="warehouseOut"
|
||||
label="Warehouse Out"
|
||||
ng-model="$ctrl.filter.warehouseOutFk"
|
||||
data="$ctrl.warehouses"
|
||||
show-field="name"
|
||||
value-field="id"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-autocomplete>
|
||||
<vn-autocomplete
|
||||
vn-id="warehouseIn"
|
||||
label="Warehouse In"
|
||||
ng-model="$ctrl.filter.warehouseInFk"
|
||||
data="$ctrl.warehouses"
|
||||
show-field="name"
|
||||
value-field="id"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="input horizontal">
|
||||
<vn-input-number
|
||||
min="0"
|
||||
step="1"
|
||||
label="Days onward"
|
||||
ng-model="$ctrl.filter.scopeDays"
|
||||
on-change="$ctrl.applyFilters()"
|
||||
display-controls="true"
|
||||
info="Cannot choose a range of dates and days onward at the same time">
|
||||
</vn-input-number>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="input horizontal">
|
||||
<vn-date-picker
|
||||
label="Landed from"
|
||||
ng-model="$ctrl.filter.landedFrom"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-date-picker>
|
||||
<vn-date-picker
|
||||
label="Landed to"
|
||||
ng-model="$ctrl.filter.landedTo"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-date-picker>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal class="input horizontal">
|
||||
<vn-autocomplete
|
||||
vn-id="continent"
|
||||
label="Continent Out"
|
||||
ng-model="$ctrl.filter.continent"
|
||||
data="$ctrl.continents"
|
||||
show-field="name"
|
||||
value-field="code"
|
||||
on-change="$ctrl.applyFilters()">
|
||||
</vn-autocomplete>
|
||||
<vn-input-number
|
||||
min="0"
|
||||
label="Total entries"
|
||||
ng-model="$ctrl.totalEntries"
|
||||
ng-keydown="$ctrl.onKeyPress($event, 'totalEntries')">
|
||||
</vn-input-number>
|
||||
</vn-horizontal>
|
||||
<div class="chips">
|
||||
<vn-chip
|
||||
ng-if="$ctrl.filter.search"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('search')"
|
||||
class="colored">
|
||||
<span>Id/{{$ctrl.$t('Reference')}}: {{$ctrl.filter.search}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="agency.selection"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('agencyModeFk')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Agency')}}: {{agency.selection.name}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="warehouseOut.selection"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('warehouseOutFk')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Warehouse Out')}}: {{warehouseOut.selection.name}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="warehouseIn.selection"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('warehouseInFk')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Warehouse In')}}: {{warehouseIn.selection.name}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="$ctrl.filter.scopeDays"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('scopeDays')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Days onward')}}: {{$ctrl.filter.scopeDays}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="$ctrl.filter.landedFrom"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('landedFrom')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Landed from')}}: {{$ctrl.filter.landedFrom | date:'dd/MM/yyyy'}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="$ctrl.filter.landedTo"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('landedTo')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Landed to')}}: {{$ctrl.filter.landedTo | date:'dd/MM/yyyy'}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="continent.selection"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('continent')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Continent Out')}}: {{continent.selection.name}}</span>
|
||||
</vn-chip>
|
||||
<vn-chip
|
||||
ng-if="$ctrl.filter.totalEntries"
|
||||
removable="true"
|
||||
on-remove="$ctrl.removeParamFilter('totalEntries')"
|
||||
class="colored">
|
||||
<span>{{$ctrl.$t('Total entries')}}: {{$ctrl.filter.totalEntries}}</span>
|
||||
</vn-chip>
|
||||
</div>
|
||||
</vn-side-menu>
|
||||
|
|
|
|||
|
|
@ -1,43 +1,69 @@
|
|||
import ngModule from '../module';
|
||||
import SearchPanel from 'core/components/searchbar/search-panel';
|
||||
import './style.scss';
|
||||
|
||||
class Controller extends SearchPanel {
|
||||
constructor($, $element) {
|
||||
super($, $element);
|
||||
this.filter = this.$.filter;
|
||||
this.initFilter();
|
||||
this.fetchData();
|
||||
}
|
||||
|
||||
get shippedFrom() {
|
||||
return this._shippedFrom;
|
||||
$onChanges() {
|
||||
if (this.model)
|
||||
this.applyFilters();
|
||||
}
|
||||
|
||||
set shippedFrom(value) {
|
||||
this._shippedFrom = value;
|
||||
this.filter.scopeDays = null;
|
||||
fetchData() {
|
||||
this.$http.get('AgencyModes').then(res => {
|
||||
this.agencyModes = res.data;
|
||||
});
|
||||
this.$http.get('Warehouses').then(res => {
|
||||
this.warehouses = res.data;
|
||||
});
|
||||
this.$http.get('Continents').then(res => {
|
||||
this.continents = res.data;
|
||||
});
|
||||
}
|
||||
|
||||
get shippedTo() {
|
||||
return this._shippedTo;
|
||||
initFilter() {
|
||||
this.filter = {};
|
||||
if (this.$params.q) {
|
||||
this.filter = JSON.parse(this.$params.q);
|
||||
this.search = this.filter.search;
|
||||
this.totalEntries = this.filter.totalEntries;
|
||||
}
|
||||
if (!this.filter.scopeDays) this.filter.scopeDays = 7;
|
||||
}
|
||||
|
||||
set shippedTo(value) {
|
||||
this._shippedTo = value;
|
||||
this.filter.scopeDays = null;
|
||||
applyFilters(param) {
|
||||
this.model.applyFilter({}, this.filter)
|
||||
.then(() => {
|
||||
if (param && this.model._orgData.length === 1)
|
||||
this.$state.go('travel.card.summary', {id: this.model._orgData[0].id});
|
||||
else
|
||||
this.$state.go(this.$state.current.name, {q: JSON.stringify(this.filter)}, {location: 'replace'});
|
||||
});
|
||||
}
|
||||
|
||||
get scopeDays() {
|
||||
return this._scopeDays;
|
||||
removeParamFilter(param) {
|
||||
if (this[param]) delete this[param];
|
||||
delete this.filter[param];
|
||||
this.applyFilters();
|
||||
}
|
||||
|
||||
set scopeDays(value) {
|
||||
this._scopeDays = value;
|
||||
|
||||
this.filter.shippedFrom = null;
|
||||
this.filter.shippedTo = null;
|
||||
onKeyPress($event, param) {
|
||||
if ($event.key === 'Enter') {
|
||||
this.filter[param] = this[param];
|
||||
this.applyFilters(param === 'search');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ngModule.vnComponent('vnTravelSearchPanel', {
|
||||
template: require('./index.html'),
|
||||
controller: Controller
|
||||
controller: Controller,
|
||||
bindings: {
|
||||
model: '<'
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -8,41 +8,31 @@ describe('Travel Component vnTravelSearchPanel', () => {
|
|||
beforeEach(inject($componentController => {
|
||||
controller = $componentController('vnTravelSearchPanel', {$element: null});
|
||||
controller.$t = () => {};
|
||||
controller.filter = {};
|
||||
}));
|
||||
|
||||
describe('shippedFrom() setter', () => {
|
||||
it('should clear the scope days when setting the from property', () => {
|
||||
controller.filter.scopeDays = 1;
|
||||
describe('applyFilters()', () => {
|
||||
it('should apply filters', async() => {
|
||||
controller.filter = {foo: 'bar'};
|
||||
controller.model = {
|
||||
applyFilter: jest.fn().mockResolvedValue(),
|
||||
_orgData: [{id: 1}]
|
||||
};
|
||||
controller.$state = {
|
||||
current: {
|
||||
name: 'foo'
|
||||
},
|
||||
go: jest.fn()
|
||||
};
|
||||
|
||||
controller.shippedFrom = Date.vnNew();
|
||||
await controller.applyFilters(true);
|
||||
|
||||
expect(controller.filter.scopeDays).toBeNull();
|
||||
expect(controller.shippedFrom).toBeDefined();
|
||||
});
|
||||
});
|
||||
expect(controller.model.applyFilter).toHaveBeenCalledWith({}, controller.filter);
|
||||
expect(controller.$state.go).toHaveBeenCalledWith('travel.card.summary', {id: 1});
|
||||
|
||||
describe('shippedTo() setter', () => {
|
||||
it('should clear the scope days when setting the to property', () => {
|
||||
controller.filter.scopeDays = 1;
|
||||
await controller.applyFilters(false);
|
||||
|
||||
controller.shippedTo = Date.vnNew();
|
||||
|
||||
expect(controller.filter.scopeDays).toBeNull();
|
||||
expect(controller.shippedTo).toBeDefined();
|
||||
});
|
||||
});
|
||||
|
||||
describe('scopeDays() setter', () => {
|
||||
it('should clear the date range when setting the scopeDays property', () => {
|
||||
controller.filter.shippedFrom = Date.vnNew();
|
||||
controller.filter.shippedTo = Date.vnNew();
|
||||
|
||||
controller.scopeDays = 1;
|
||||
|
||||
expect(controller.filter.shippedFrom).toBeNull();
|
||||
expect(controller.filter.shippedTo).toBeNull();
|
||||
expect(controller.scopeDays).toBeDefined();
|
||||
expect(controller.$state.go).toHaveBeenCalledWith(controller.$state.current.name,
|
||||
{q: JSON.stringify(controller.filter)}, {location: 'replace'});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,37 @@
|
|||
@import "variables";
|
||||
|
||||
vn-travel-search-panel vn-side-menu {
|
||||
.menu {
|
||||
min-width: $right-menu-width;
|
||||
}
|
||||
& > div {
|
||||
.input {
|
||||
padding-left: $spacing-md;
|
||||
padding-right: $spacing-md;
|
||||
border-color: $color-spacer;
|
||||
border-bottom: $border-thin;
|
||||
}
|
||||
.horizontal {
|
||||
padding-left: $spacing-md;
|
||||
padding-right: $spacing-md;
|
||||
grid-auto-flow: column;
|
||||
grid-column-gap: $spacing-sm;
|
||||
align-items: center;
|
||||
}
|
||||
.chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: $spacing-md;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
border-color: $color-spacer;
|
||||
}
|
||||
|
||||
.or {
|
||||
align-self: center;
|
||||
font-weight: bold;
|
||||
font-size: 26px;
|
||||
color: $color-font-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
Reference: Referencia
|
||||
Warehouse In: Almacén entrada
|
||||
Warehouse Out: Almacén salida
|
||||
Warehouse In: Alm. entrada
|
||||
Warehouse Out: Alm. salida
|
||||
Shipped: F. envío
|
||||
Landed: F. entrega
|
||||
Total entries: Entradas totales
|
||||
Total entries: Ent. totales
|
||||
Delivered: Enviada
|
||||
Received: Recibida
|
||||
Agency: Agencia
|
||||
|
|
|
|||
Loading…
Reference in New Issue