diff --git a/front/core/components/calendar/index.js b/front/core/components/calendar/index.js index d473b60d5..3778d64d2 100644 --- a/front/core/components/calendar/index.js +++ b/front/core/components/calendar/index.js @@ -262,10 +262,12 @@ export default class Calendar extends Component { */ select(index) { if (this.disabled) return; - let day = this.days[index]; - day.index = index; + let day = this.days[index].dated; - this.emit('selection', {values: [day]}); + this.emit('selection', { + $days: [day], + $type: 'day' + }); } /** @@ -276,15 +278,17 @@ export default class Calendar extends Component { selectAll(weekday) { if (this.disabled) return; - let selected = []; + let days = []; for (let i in this.days) { - const day = this.days[i]; - const date = day.dated; - day.index = i; - if (date.getDay() === weekday && date.getMonth() == this.defaultDate.getMonth()) - selected.push(day); + const day = this.days[i].dated; + if (day.getDay() === weekday && day.getMonth() == this.defaultDate.getMonth()) + days.push(day); } - this.emit('selection', {values: selected}); + this.emit('selection', { + $days: days, + $type: 'weekday', + $weekday: weekday + }); } renderStyle(style) { diff --git a/front/core/components/calendar/index.spec.js b/front/core/components/calendar/index.spec.js index 174bc7997..21915eed4 100644 --- a/front/core/components/calendar/index.spec.js +++ b/front/core/components/calendar/index.spec.js @@ -60,12 +60,17 @@ describe('Component vnCalendar', () => { describe('select()', () => { it(`should return the selected element, then emit a 'selection' event`, () => { spyOn(controller, 'emit'); - const days = [{dated: new Date()}]; + const dated = new Date(); + const days = [{dated}]; controller.days = days; - controller.select(0); - expect(controller.emit).toHaveBeenCalledWith('selection', {values: days}); + let res = { + $days: [dated], + $type: 'day' + }; + + expect(controller.emit).toHaveBeenCalledWith('selection', res); }); }); diff --git a/front/core/lib/section.js b/front/core/lib/section.js new file mode 100644 index 000000000..7e59bb8b3 --- /dev/null +++ b/front/core/lib/section.js @@ -0,0 +1,34 @@ +import Component from './component'; + +/** + * Class with commonly injected services assigned as properties. It also has + * abbreviations for commonly used methods like tranlation. + * + * @property {Object} $translate Angular tranlation service + * @property {Object} $http Angular HTTP service + * @property {Object} $state Router state service + * @property {Object} $stateParams Router state parameters + */ +export default class Section extends Component { + constructor($element, $scope, $translate, $http, $state) { + super($element, $scope); + Object.assign(this, { + $translate, + $http, + $state, + $stateParams: $state.params + }); + } + + /** + * Translates an string. + * + * @param {String} string String to translate + * @param {Array} params Translate parameters + * @return {String} The translated string + */ + _(string, params) { + return this.$translate.instant(string, params, ); + } +} +Section.$inject = ['$element', '$scope', '$translate', '$http', '$state']; diff --git a/front/salix/styles/index.js b/front/salix/styles/index.js index 969793a32..d4c026f9f 100644 --- a/front/salix/styles/index.js +++ b/front/salix/styles/index.js @@ -15,3 +15,4 @@ import './descriptor.scss'; import './list.scss'; import './modal-form.scss'; import './photo-list.scss'; +import './width.scss'; diff --git a/front/salix/styles/misc.scss b/front/salix/styles/misc.scss index 1eef5af2b..9ebc53342 100644 --- a/front/salix/styles/misc.scss +++ b/front/salix/styles/misc.scss @@ -99,11 +99,6 @@ html [pointer], .pointer{ html [noDrop], .noDrop{ cursor: no-drop; } -html [compact], .compact{ - max-width: $width-compact; - margin-left: auto; - margin-right: auto; -} button { @extend %clickable; } @@ -147,6 +142,12 @@ fieldset[disabled] .mdl-textfield .mdl-textfield__label, font-size: 0.7em } } +[compact], .compact { + margin-left: auto; + margin-right: auto; + max-width: $width-md; +} + .vn-grid { border-collapse: collapse; width: 100%; diff --git a/front/salix/styles/variables.scss b/front/salix/styles/variables.scss index 5eccf0418..be4b94d70 100644 --- a/front/salix/styles/variables.scss +++ b/front/salix/styles/variables.scss @@ -5,9 +5,11 @@ $mobile-width: 800px; // Width -$width-small: 36em; -$width-compact: 60em; -$width-large: 80em; +$width-xs: 25em; +$width-sm: 32em; +$width-md: 60em; +$width-lg: 80em; +$width-xl: 100em; // Padding diff --git a/front/salix/styles/width.scss b/front/salix/styles/width.scss new file mode 100644 index 000000000..e017de3ea --- /dev/null +++ b/front/salix/styles/width.scss @@ -0,0 +1,26 @@ +@import "./variables"; + +%margin-auto { + margin-left: auto; + margin-right: auto; +} +.vn-w-xs { + @extend %margin-auto; + max-width: $width-xs; +} +.vn-w-sm { + @extend %margin-auto; + max-width: $width-sm; +} +.vn-w-md { + @extend %margin-auto; + max-width: $width-md; +} +.vn-w-lg { + @extend %margin-auto; + max-width: $width-lg; +} +.vn-w-xl { + @extend %margin-auto; + max-width: $width-xl; +} diff --git a/modules/agency/front/calendar/index.html b/modules/agency/front/calendar/index.html index 9172ec4a3..6cf521065 100644 --- a/modules/agency/front/calendar/index.html +++ b/modules/agency/front/calendar/index.html @@ -3,6 +3,7 @@ skip="2" has-events="$ctrl.hasEvents($day)" get-class="$ctrl.getClass($day)" + on-selection="$ctrl.onSelection($days, $type, $weekday)" on-move-next="ndMonth.moveNext(2)" on-move-previous="ndMonth.movePrevious(2)" vn-acl="deliveryBoss" @@ -13,6 +14,7 @@ skip="2" has-events="$ctrl.hasEvents($day)" get-class="$ctrl.getClass($day)" + on-selection="$ctrl.onSelection($days, $type, $weekday)" default-date="$ctrl.ndMonthDate" vn-acl="deliveryBoss" display-controls="false" diff --git a/modules/agency/front/calendar/index.js b/modules/agency/front/calendar/index.js index 5b99264c7..74588d9ef 100644 --- a/modules/agency/front/calendar/index.js +++ b/modules/agency/front/calendar/index.js @@ -1,12 +1,10 @@ import ngModule from '../module'; +import Section from 'core/lib/section'; import './style.scss'; -class Controller { - constructor($, $stateParams) { - Object.assign(this, { - $, - $stateParams - }); +class Controller extends Section { + constructor($el, $, $t, $http, $state) { + super($el, $, $t, $http, $state); this.excls = {}; this.resetEvents(); @@ -14,6 +12,10 @@ class Controller { this.ndMonthDate.setMonth(this.ndMonthDate.getMonth() + 1); } + onSelection($days, $type, $weekday) { + this.emit('selection', {$days, $type, $weekday}); + } + resetEvents() { this.wdays = []; this.days = {}; @@ -96,8 +98,6 @@ class Controller { } } -Controller.$inject = ['$scope', '$stateParams']; - ngModule.component('vnZoneCalendar', { template: require('./index.html'), controller: Controller, diff --git a/modules/agency/front/card/index.html b/modules/agency/front/card/index.html index 1a1763916..1fd22809a 100644 --- a/modules/agency/front/card/index.html +++ b/modules/agency/front/card/index.html @@ -2,4 +2,4 @@ -
+
diff --git a/modules/agency/front/events/index.html b/modules/agency/front/events/index.html index fa114b9bc..93132501d 100644 --- a/modules/agency/front/events/index.html +++ b/modules/agency/front/events/index.html @@ -1,5 +1,5 @@
-
+
+ exclusions="exclusions" + on-selection="$ctrl.onCreate($days, $type, $weekday)"> - - - + + label="Indefinitely" + val="indefinitely"> + label="Range of dates" + val="range">
this.$.exclusions = res.data); - this.path = `/api/Zones/${$stateParams.id}/events`; + this.path = `/api/Zones/${this.$stateParams.id}/events`; this.refresh(); } @@ -89,10 +86,19 @@ class Controller { this.$.dialog.show(); } - onCreate() { + onCreate($day, $type, $weekday) { this.isNew = true; - this.eventType = 'day'; - this.selected = {}; + this.eventType = $type == 'day' ? 'day' : 'indefinitely'; + + if ($type == 'weekday') { + let wdays = []; + let index = $weekday - 1; + if (index < 0) index = 7 - index; + wdays[this.wdays[index].code] = true; + this.selected = {wdays}; + } else + this.selected = {from: $day[0]}; + this.$.dialog.show(); } @@ -153,7 +159,6 @@ class Controller { }); } } -Controller.$inject = ['$scope', '$translate', '$http', '$stateParams']; ngModule.component('vnZoneEvents', { template: require('./index.html'), diff --git a/modules/agency/front/exclusions/index.html b/modules/agency/front/exclusions/index.html index 47d2cba4c..05866c86d 100644 --- a/modules/agency/front/exclusions/index.html +++ b/modules/agency/front/exclusions/index.html @@ -1,34 +1,34 @@ - - - - - {{::row.day | dateTime:'dd/MM/yyyy'}} - - - - - - - - - - - - - No records found - - - +
+ + + + + {{::row.day | dateTime:'dd/MM/yyyy'}} + + + + + + + + + + + + + No records found + +
+ + + + diff --git a/modules/agency/front/exclusions/index.js b/modules/agency/front/exclusions/index.js index 04806eddf..ed935be7f 100644 --- a/modules/agency/front/exclusions/index.js +++ b/modules/agency/front/exclusions/index.js @@ -1,13 +1,14 @@ import ngModule from '../module'; +import Section from 'core/lib/section'; -class Controller { - constructor($, $http, $stateParams) { - Object.assign(this, { - $, - $http - }); +class Controller extends Section { + constructor($el, $, $t, $http, $state) { + super($el, $, $t, $http, $state); - this.path = `/api/Zones/${$stateParams.id}/exclusions`; + this.$http.get(`/api/Zones/${this.$stateParams.id}/events`) + .then(res => this.$.events = res.data); + + this.path = `/api/Zones/${this.$stateParams.id}/exclusions`; this.refresh(); } @@ -16,9 +17,9 @@ class Controller { .then(res => this.$.data = res.data); } - onCreate() { + onCreate($days) { this.isNew = true; - this.selected = {}; + this.selected = {day: $days[0]}; this.$.dialog.show(); } @@ -36,23 +37,21 @@ class Controller { return false; } - onDelete(index) { + onDelete(id) { this.$.confirm.show(); - this.deleteIndex = index; + this.deleteId = id; } delete(response) { if (response != 'ACCEPT') return; - let id = this.$.data[this.deleteIndex].id; - if (!id) return; - this.$http.delete(`${this.path}/${id}`) + if (!this.deleteId) return; + this.$http.delete(`${this.path}/${this.deleteId}`) .then(() => { - this.$.data.splice(this.deleteIndex, 1); - this.deleteIndex = null; + this.refresh(); + this.deleteId = null; }); } } -Controller.$inject = ['$scope', '$http', '$stateParams']; ngModule.component('vnZoneExclusions', { template: require('./index.html'), diff --git a/modules/agency/front/location/index.js b/modules/agency/front/location/index.js index 3e3decf23..02dbeb71b 100644 --- a/modules/agency/front/location/index.js +++ b/modules/agency/front/location/index.js @@ -1,12 +1,7 @@ import ngModule from '../module'; +import Section from 'core/lib/section'; -class Controller { - constructor($, $http, $stateParams) { - this.$ = $; - this.$http = $http; - this.$stateParams = $stateParams; - } - +class Controller extends Section { onSearch(params) { this.$.model.applyFilter(null, params); this.$.$applyAsync(() => this.$.treeview.refresh()); @@ -30,8 +25,6 @@ class Controller { } } -Controller.$inject = ['$scope', '$http', '$stateParams']; - ngModule.component('vnZoneLocation', { template: require('./index.html'), controller: Controller, diff --git a/modules/agency/front/warehouses/index.html b/modules/agency/front/warehouses/index.html index 71baa9b3c..6c3642cec 100644 --- a/modules/agency/front/warehouses/index.html +++ b/modules/agency/front/warehouses/index.html @@ -1,6 +1,4 @@ - + diff --git a/modules/agency/front/warehouses/index.js b/modules/agency/front/warehouses/index.js index 6f371680e..51178efa9 100644 --- a/modules/agency/front/warehouses/index.js +++ b/modules/agency/front/warehouses/index.js @@ -1,13 +1,11 @@ import ngModule from '../module'; +import Section from 'core/lib/section'; -class Controller { - constructor($, _, $http, $stateParams) { - Object.assign(this, { - $, - $http - }); +class Controller extends Section { + constructor($el, $, $t, $http, $state) { + super($el, $, $t, $http, $state); - this.path = `/api/Zones/${$stateParams.id}/warehouses`; + this.path = `/api/Zones/${this.$stateParams.id}/warehouses`; this.refresh(); } @@ -52,7 +50,6 @@ class Controller { }); } } -Controller.$inject = ['$scope', '$translate', '$http', '$stateParams']; ngModule.component('vnZoneWarehouses', { template: require('./index.html'), diff --git a/modules/invoiceOut/front/summary/style.scss b/modules/invoiceOut/front/summary/style.scss index f2cf53381..dcad44362 100644 --- a/modules/invoiceOut/front/summary/style.scss +++ b/modules/invoiceOut/front/summary/style.scss @@ -2,7 +2,7 @@ vn-invoice-out-summary .summary { - max-width: $width-large; + max-width: $width-lg; vn-icon[icon=insert_drive_file]{ color: $color-font-secondary; diff --git a/modules/order/front/summary/style.scss b/modules/order/front/summary/style.scss index bc8017a0c..c225b4b49 100644 --- a/modules/order/front/summary/style.scss +++ b/modules/order/front/summary/style.scss @@ -1,7 +1,8 @@ @import "./variables"; vn-order-summary .summary{ - max-width: $width-large; + max-width: $width-lg; + & > div > vn-horizontal > vn-one { min-width: 10em !important; diff --git a/modules/route/front/index/style.scss b/modules/route/front/index/style.scss index bbf7d6fa8..d8c24a482 100644 --- a/modules/route/front/index/style.scss +++ b/modules/route/front/index/style.scss @@ -1,5 +1,5 @@ @import "./variables"; vn-route-index .index { - max-width: $width-large; + max-width: $width-lg; } \ No newline at end of file diff --git a/modules/route/front/summary/style.scss b/modules/route/front/summary/style.scss index aef44fbf9..b41512f32 100644 --- a/modules/route/front/summary/style.scss +++ b/modules/route/front/summary/style.scss @@ -2,7 +2,7 @@ vn-route-summary .summary { - max-width: $width-large; + max-width: $width-lg; vn-icon[icon=insert_drive_file]{ color: $color-font-secondary; diff --git a/modules/route/front/tickets/style.scss b/modules/route/front/tickets/style.scss index 55a57fd24..2c287ed9d 100644 --- a/modules/route/front/tickets/style.scss +++ b/modules/route/front/tickets/style.scss @@ -2,5 +2,5 @@ vn-route-tickets form{ margin: 0 auto; - max-width: $width-large; + max-width: $width-lg; } \ No newline at end of file diff --git a/modules/ticket/front/summary/style.scss b/modules/ticket/front/summary/style.scss index d0165f63f..f19a361c5 100644 --- a/modules/ticket/front/summary/style.scss +++ b/modules/ticket/front/summary/style.scss @@ -1,7 +1,7 @@ @import "./variables"; vn-ticket-summary .summary { - max-width: $width-large; + max-width: $width-lg; vn-button { max-height: 27px; diff --git a/modules/worker/front/time-control/index.html b/modules/worker/front/time-control/index.html index 1aeb70304..f8915542b 100644 --- a/modules/worker/front/time-control/index.html +++ b/modules/worker/front/time-control/index.html @@ -63,7 +63,7 @@ diff --git a/modules/worker/front/time-control/index.js b/modules/worker/front/time-control/index.js index a82fdc63d..551d5531d 100644 --- a/modules/worker/front/time-control/index.js +++ b/modules/worker/front/time-control/index.js @@ -208,12 +208,9 @@ class Controller { this.refresh(); } - onSelection(value) { - const selected = value[0].dated; - - this.defaultDate.setMonth(selected.getMonth()); - this.defaultDate.setDate(selected.getDate()); - + onSelection($days) { + this.defaultDate.setMonth($days[0].getMonth()); + this.defaultDate.setDate($days[0].getDate()); this.refresh(); }