Merge pull request '2617-add_scope_days_on_travel_index' (#530) from 2617-add_scope_days_on_travel_index into dev

Reviewed-on: #530
Reviewed-by: Carlos Jimenez Ruiz <carlosjr@verdnatura.es>

modules/route/front/main/index.spec.js

@@ -38,20 +38,12 @@ describe('Route Component vnRoute', () => {
             expect(params.scopeDays).toEqual(1);
         });
 
-        it('should return a number value in scope days', () => {
+        it('should return the given scope days', () => {
             let params = controller.fetchParams({
                 scopeDays: 2
             });
 
             expect(params.scopeDays).toEqual(2);
         });
-
-        it('should throw an error when scope days is not equal a number', () => {
-            let params = controller.fetchParams({
-                scopeDays: 'ScopeDayNoNumber'
-            });
-
-            expect(params.scopeDays).toBe('ScopeDayNoNumber');
-        });
     });
 });

modules/travel/front/main/index.spec.js

@@ -12,29 +12,38 @@ describe('Travel Component vnTravel', () => {
 
     describe('fetchParams()', () => {
         it('should return a range of dates with passed scope days', () => {
-            /**
-             * Calculates the difference in days between two dates, it also
-             * accounts for cases where the two dates in question span a
-             * daylight saving time (DST) change.
-             *
-             * @param {Date} a The start date
-             * @param {Date} b The end date
-             * @return {Number} The difference in days
-             */
-            function diffInDays(a, b) {
-                const utc1 = Date.UTC(a.getFullYear(), a.getMonth(), a.getDate());
-                const utc2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
-                const msInDay = 86400 * 1000;
-                return Math.floor((utc2 - utc1) / msInDay);
-            }
+            let params = controller.fetchParams({
+                scopeDays: 2
+            });
+            const shippedFrom = new Date();
+            shippedFrom.setHours(0, 0, 0, 0);
+            const shippedTo = new Date(shippedFrom.getTime());
+            shippedTo.setDate(shippedTo.getDate() + params.scopeDays);
+            shippedTo.setHours(23, 59, 59, 999);
 
-            let params = controller.fetchParams({scopeDays: 2});
-            const diff = diffInDays(
-                params.shippedFrom,
-                new Date(params.shippedTo.getTime() + 1)
-            );
+            const expectedParams = {
+                shippedFrom,
+                scopeDays: params.scopeDays,
+                shippedTo
+            };
 
-            expect(diff).toEqual(3);
+            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);
         });
     });
 });

modules/travel/front/search-panel/index.html

@@ -1,6 +1,6 @@
 <div class="search-panel">
-    <form ng-submit="$ctrl.onSearch()">
-        <vn-horizontal>
+    <form ng-submit="$ctrl.onSearch()" id="manifold-form">
+        <vn-horizontal class="vn-px-lg vn-pt-lg">
             <vn-textfield
                 vn-one
                 label="General search"
@@ -9,7 +9,7 @@
                 vn-focus>
             </vn-textfield>
         </vn-horizontal>
-        <vn-horizontal>
+        <vn-horizontal class="vn-px-lg">
             <vn-textfield
                 vn-one
                 label="Reference"
@@ -21,7 +21,7 @@
                 ng-model="filter.totalEntries">
             </vn-textfield>
         </vn-horizontal>
-        <vn-horizontal>
+        <vn-horizontal class="vn-px-lg">
             <vn-textfield
                 vn-one
                 label="Travel id"
@@ -35,19 +35,37 @@
                 value-field="id">
             </vn-autocomplete>
         </vn-horizontal>
-        <vn-horizontal>
-            <vn-date-picker
-                vn-one
-                label="Shipped from"
-                ng-model="filter.shippedFrom">
-            </vn-date-picker>
-            <vn-date-picker
-                vn-one
-                label="Shipped to"
-                ng-model="filter.shippedTo">
-            </vn-date-picker>
-        </vn-horizontal>
-        <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"
@@ -59,7 +77,7 @@
                 ng-model="filter.landedTo">
             </vn-date-picker>
         </vn-horizontal>
-        <vn-horizontal>
+        <vn-horizontal class="vn-px-lg">
             <vn-autocomplete vn-one
                 label="Warehouse Out"
                 ng-model="filter.warehouseOutFk"
@@ -75,7 +93,7 @@
                 value-field="id">
             </vn-autocomplete>
         </vn-horizontal>
-        <vn-horizontal class="vn-mt-lg">
+        <vn-horizontal class="vn-px-lg vn-pb-lg vn-mt-lg">
             <vn-submit label="Search"></vn-submit>
         </vn-horizontal>
     </form>

modules/travel/front/search-panel/index.js

@@ -1,7 +1,43 @@
 import ngModule from '../module';
 import SearchPanel from 'core/components/searchbar/search-panel';
 
+class Controller extends SearchPanel {
+    constructor($, $element) {
+        super($, $element);
+        this.filter = this.$.filter;
+    }
+
+    get shippedFrom() {
+        return this._shippedFrom;
+    }
+
+    set shippedFrom(value) {
+        this._shippedFrom = value;
+        this.filter.scopeDays = null;
+    }
+
+    get shippedTo() {
+        return this._shippedTo;
+    }
+
+    set shippedTo(value) {
+        this._shippedTo = value;
+        this.filter.scopeDays = null;
+    }
+
+    get scopeDays() {
+        return this._scopeDays;
+    }
+
+    set scopeDays(value) {
+        this._scopeDays = value;
+
+        this.filter.shippedFrom = null;
+        this.filter.shippedTo = null;
+    }
+}
+
 ngModule.vnComponent('vnTravelSearchPanel', {
     template: require('./index.html'),
-    controller: SearchPanel
+    controller: Controller
 });

modules/travel/front/search-panel/index.spec.js

@@ -0,0 +1,48 @@
+import './index';
+
+describe('Travel Component vnTravelSearchPanel', () => {
+    let controller;
+
+    beforeEach(ngModule('travel'));
+
+    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;
+
+            controller.shippedFrom = new Date();
+
+            expect(controller.filter.scopeDays).toBeNull();
+            expect(controller.shippedFrom).toBeDefined();
+        });
+    });
+
+    describe('shippedTo() setter', () => {
+        it('should clear the scope days when setting the to property', () => {
+            controller.filter.scopeDays = 1;
+
+            controller.shippedTo = new Date();
+
+            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 = new Date();
+            controller.filter.shippedTo = new Date();
+
+            controller.scopeDays = 1;
+
+            expect(controller.filter.shippedFrom).toBeNull();
+            expect(controller.filter.shippedTo).toBeNull();
+            expect(controller.scopeDays).toBeDefined();
+        });
+    });
+});