modules/worker/front/calendar/index.html

@@ -29,6 +29,15 @@
                 {{'of' | translate}} {{$ctrl.calendar.totalHolidays}} {{'days' | translate}}
             </div>
         </div>
+        <div class="vn-pt-md">
+            <vn-autocomplete label="Year"
+                data="$ctrl.yearFilter"
+                ng-model="$ctrl.year"
+                show-field="year"
+                value-field="year"
+                order="DESC">
+            </vn-autocomplete>
+        </div>
         <div class="vn-pt-md" style="overflow: hidden;">
             <vn-chip ng-repeat="absenceType in absenceTypes" ng-class="::{'selectable': $ctrl.isSubordinate}"
                 ng-click="$ctrl.pick(absenceType)">

modules/worker/front/calendar/index.js

@@ -7,6 +7,18 @@ class Controller extends Section {
         super($element, $);
         this.date = new Date();
         this.events = {};
+        this.buildYearFilter();
+    }
+
+    get year() {
+        return this.date.getFullYear();
+    }
+
+    set year(value) {
+        const newYear = new Date();
+        newYear.setFullYear(value);
+
+        this.date = newYear;
     }
 
     get date() {
@@ -50,6 +62,17 @@ class Controller extends Section {
         }
     }
 
+    buildYearFilter() {
+        const currentYear = new Date().getFullYear();
+        const minRange = currentYear - 5;
+
+        const years = [];
+        for (let i = currentYear; i > minRange; i--)
+            years.push({year: i});
+
+        this.yearFilter = years;
+    }
+
     getIsSubordinate() {
         this.$http.get(`Workers/${this.worker.id}/isSubordinate`).then(res =>
             this.isSubordinate = res.data

modules/worker/front/calendar/locale/es.yml

@@ -1,6 +1,7 @@
 Calendar: Calendario
 Holidays: Vacaciones
 Used: Utilizados
+Year: Año
 of: de
 days: días
 Choose an absence type from the right menu: Elige un tipo de ausencia desde el menú de la derecha