@colijnit/sharedcomponents 1.0.67 → 1.0.69

package/fesm2015/colijnit-sharedcomponents.js

@@ -1259,8 +1259,8 @@ const IconSvg = {
     "arrow_down": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 30 30\"><g ><polygon points=\"17.06 21.14 17.06 2.5 12.94 2.5 12.94 21.14 12.94 21.14 8.64 21.14 15 27.5 21.36 21.14 17.06 21.14\" fill=\"#484f60\"/></g></svg>",
     "arrow_down_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\"><path d=\"M174.6 472.6c4.5 4.7 10.8 7.4 17.4 7.4s12.8-2.7 17.4-7.4l168-176c9.2-9.6 8.8-24.8-.8-33.9s-24.8-8.8-33.9 .8L216 396.1 216 56c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 340.1L41.4 263.4c-9.2-9.6-24.3-9.9-33.9-.8s-9.9 24.3-.8 33.9l168 176z\"/></svg>",
     "arrow_fat_right": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"37.5 25 25.2 12.7 25.2 20.35 12.5 20.35 12.5 29.66 25.2 29.66 25.2 37.3 37.5 25\" fill=\"#484f60\"/></svg>",
-    "arrow_point_left": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M31.9,36.7l-14.7-9.6C17.1,27,17,26.9,17,26.7v-2.4c0-0.2,0.1-0.3,0.2-0.4l14.7-9.6c0.2-0.2,0.5-0.1,0.7,0.1l1.4,2.1c0.2,0.2,0.1,0.5-0.1,0.7l-12,7.8c-0.3,0.2-0.3,0.6,0,0.8l12,7.8c0.2,0.2,0.3,0.5,0.1,0.7l-1.4,2.1C32.4,36.8,32.1,36.8,31.9,36.7z\"/></svg>",
-    "arrow_point_right": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\"><path fill=\"#484F5F\" d=\"M19.1,14.3l14.7,9.6c0.1,0.1,0.2,0.2,0.2,0.4v2.4c0,0.2-0.1,0.3-0.2,0.4l-14.7,9.6c-0.2,0.2-0.5,0.1-0.7-0.1l-1.4-2.1c-0.2-0.2-0.1-0.5,0.1-0.7l12-7.8c0.3-0.2,0.3-0.6,0-0.8l-12-7.8c-0.2-0.2-0.3-0.5-0.1-0.7l1.4-2.1C18.6,14.2,18.9,14.2,19.1,14.3z\"/></svg>",
+    "arrow_point_left": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\"><path d=\"M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z\"/></svg>",
+    "arrow_point_right": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\"><path d=\"M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z\"/></svg>",
     "at_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M207.8 20.73c-93.45 18.32-168.7 93.66-187 187.1c-27.64 140.9 68.65 266.2 199.1 285.1c19.01 2.888 36.17-12.26 36.17-31.49l.0001-.6631c0-15.74-11.44-28.88-26.84-31.24c-84.35-12.98-149.2-86.13-149.2-174.2c0-102.9 88.61-185.5 193.4-175.4c91.54 8.869 158.6 91.25 158.6 183.2l0 16.16c0 22.09-17.94 40.05-40 40.05s-40.01-17.96-40.01-40.05v-120.1c0-8.847-7.161-16.02-16.01-16.02l-31.98 .0036c-7.299 0-13.2 4.992-15.12 11.68c-24.85-12.15-54.24-16.38-86.06-5.106c-38.75 13.73-68.12 48.91-73.72 89.64c-9.483 69.01 43.81 128 110.9 128c26.44 0 50.43-9.544 69.59-24.88c24 31.3 65.23 48.69 109.4 37.49C465.2 369.3 496 324.1 495.1 277.2V256.3C495.1 107.1 361.2-9.332 207.8 20.73zM239.1 304.3c-26.47 0-48-21.56-48-48.05s21.53-48.05 48-48.05s48 21.56 48 48.05S266.5 304.3 239.1 304.3z\"/></svg>",
     "barcode_read_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\"><path d=\"M56 48c-4.4 0-8 3.6-8 8v80c0 13.3-10.7 24-24 24s-24-10.7-24-24V56C0 25.1 25.1 0 56 0h80c13.3 0 24 10.7 24 24s-10.7 24-24 24H56zm64 80c13.3 0 24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm56 16c0-8.8 7.2-16 16-16s16 7.2 16 16V368c0 8.8-7.2 16-16 16s-16-7.2-16-16V144zm272 0c0-8.8 7.2-16 16-16s16 7.2 16 16V368c0 8.8-7.2 16-16 16s-16-7.2-16-16V144zm-208 8c0-13.3 10.7-24 24-24s24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152zm152-24c13.3 0 24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM528 56c0-4.4-3.6-8-8-8H440c-13.3 0-24-10.7-24-24s10.7-24 24-24h80c30.9 0 56 25.1 56 56v80c0 13.3-10.7 24-24 24s-24-10.7-24-24V56zM56 464h80c13.3 0 24 10.7 24 24s-10.7 24-24 24H56c-30.9 0-56-25.1-56-56V376c0-13.3 10.7-24 24-24s24 10.7 24 24v80c0 4.4 3.6 8 8 8zm472-8V376c0-13.3 10.7-24 24-24s24 10.7 24 24v80c0 30.9-25.1 56-56 56H440c-13.3 0-24-10.7-24-24s10.7-24 24-24h80c4.4 0 8-3.6 8-8z\"/></svg>",
     "bring_forward_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"#183153\" d=\"M224 464H448C456.8 464 464 456.8 464 448V224C464 215.2 456.8 208 448 208H384V160H448C483.3 160 512 188.7 512 224V448C512 483.3 483.3 512 448 512H224C188.7 512 160 483.3 160 448V384H208V448C208 456.8 215.2 464 224 464zM64 352C28.65 352 0 323.3 0 288V64C0 28.65 28.65 0 64 0H288C323.3 0 352 28.65 352 64V288C352 323.3 323.3 352 288 352H64z\"/></svg>",
@@ -4702,10 +4702,10 @@ StockLocationPopupComponent.decorators = [
                            (modelChange)="handleStockStatusRemarkChange($event)"></co-input-text>
           </div>
           <co-input-number-picker
-                         [(model)]="selectedArticleDetailsData.amountInStock"
-                         [label]="'STOCK' | localize"
-                         (modelChange)="amountInStockChanged($event)"
-                         [min]="1"
+            [(model)]="selectedArticleDetailsData.amountInStock"
+            [label]="'STOCK' | localize"
+            (modelChange)="amountInStockChanged($event)"
+            [min]="1"
           ></co-input-number-picker>
         </div>
         <ng-template #footerTemplate>
@@ -5210,6 +5210,7 @@ LayoutSwitcherModule.decorators = [
 var CalendarView;
 (function (CalendarView) {
     CalendarView["DayView"] = "DAY";
+    CalendarView["DaysAround"] = "DAYS_AROUND";
     CalendarView["WeekView"] = "WEEK";
     CalendarView["WeekSelectView"] = "WEEK_SELECT";
     CalendarView["WeekPlanningView"] = "WEEK_PLANNING";
@@ -5226,6 +5227,7 @@ class DatePlanningComponent {
         this.buttonLabel = "";
         this.eventsPerDay = [];
         this.view = CalendarView.WeekView;
+        this.viewSelection = false;
         this.eventChecked = new EventEmitter();
         this.selectedDateChange = new EventEmitter();
         this.rangeChange = new EventEmitter();
@@ -5277,6 +5279,7 @@ DatePlanningComponent.decorators = [
                            [eventsPerDay]="eventsPerDay"
                            [selectedDate]="selectedDate"
                            (selectedDateChange)="doChangeSelectedDate($event)"
+                           [viewSelection]="viewSelection"
                            (rangeChange)="doChangeSelectedDate($event, true)"></agenda-header>
             <agenda-view [view]="view"
                          [customEventObject]="customEventObject"
@@ -5318,6 +5321,7 @@ DatePlanningComponent.propDecorators = {
     buttonLabel: [{ type: Input }],
     eventsPerDay: [{ type: Input }],
     view: [{ type: Input }],
+    viewSelection: [{ type: Input }],
     eventChecked: [{ type: Output }],
     selectedDateChange: [{ type: Output }],
     rangeChange: [{ type: Output }],
@@ -6070,7 +6074,13 @@ class CalendarUtils {
         return datesByTheHour;
     }
     static GetDaysOfWeek(date) {
-        let day = new Date();
+        let day;
+        if (!date) {
+            day = new Date();
+        }
+        else {
+            day = date;
+        }
         const daysOfWeek = [];
         let options;
         let month;
@@ -6100,6 +6110,39 @@ class CalendarUtils {
         week.weekDays = daysOfWeek;
         return week;
     }
+    static GetDaysAround(date) {
+        const daysAround = [];
+        const currentDate = date ? new Date(date) : new Date();
+        currentDate.setHours(0, 0, 0, 0);
+        // Get the current day and go two days back
+        let day = new Date(currentDate);
+        day.setDate(day.getDate() - 2);
+        // Loop to get the two days before and four days after the current day
+        for (let i = 0; i < 7; i++) {
+            const dayPerWeek = new Weekday();
+            const dayHours = CalendarUtils.GetDayHours(day);
+            dayPerWeek.newMonth = day.getMonth() !== currentDate.getMonth();
+            dayPerWeek.weekdaySelected = day.getDate() === currentDate.getDate();
+            dayPerWeek.weekdayDay = day.getDate();
+            let options = { weekday: "short" };
+            dayPerWeek.weekdayShort = day.toLocaleDateString(CalendarUtils.Locale, options);
+            options = { weekday: "long" };
+            dayPerWeek.weekdayLong = day.toLocaleDateString(CalendarUtils.Locale, options);
+            options = { month: "short" };
+            dayPerWeek.weekdayMonthShort = day.toLocaleDateString(CalendarUtils.Locale, options);
+            options = { month: "long" };
+            dayPerWeek.weekdayMonthLong = day.toLocaleDateString(CalendarUtils.Locale, options);
+            dayPerWeek.weekdayYear = day.getFullYear();
+            dayPerWeek.date = new Date(day);
+            dayPerWeek.datesByTheHour = dayHours;
+            daysAround.push(dayPerWeek);
+            // Move to the next day
+            day.setDate(day.getDate() + 1);
+        }
+        const week = new Week();
+        week.weekDays = daysAround;
+        return week;
+    }
 }
 CalendarUtils.Locale = undefined;
 CalendarUtils.Now = new Date();
@@ -6206,8 +6249,11 @@ class AgendaHeaderComponent {
                 case CalendarView.DayView:
                     newDate.setDate(this.selectedDate.getDate() - 1);
                     break;
+                case CalendarView.DaysAround:
+                    newDate.setDate(this.selectedDate.getDate() - 1);
+                    break;
                 case CalendarView.WeekView:
-                    newDate.setDate(this.selectedDate.getDate() - 7);
+                    newDate.setDate(this.selectedDate.getDate() - 3);
                     break;
                 case CalendarView.WeekSelectView:
                     newDate.setDate(this.selectedDate.getDate() - 7);
@@ -6227,8 +6273,11 @@ class AgendaHeaderComponent {
                 case CalendarView.DayView:
                     newDate.setDate(this.selectedDate.getDate() + 1);
                     break;
+                case CalendarView.DaysAround:
+                    newDate.setDate(this.selectedDate.getDate() + 1);
+                    break;
                 case CalendarView.WeekView:
-                    newDate.setDate(this.selectedDate.getDate() + 7);
+                    newDate.setDate(this.selectedDate.getDate() + 3);
                     break;
                 case CalendarView.WeekSelectView:
                     newDate.setDate(this.selectedDate.getDate() + 7);
@@ -6268,6 +6317,13 @@ class AgendaHeaderComponent {
                     day.description = this.selectedDate.toLocaleDateString(this._locale, options);
                     this.day = day;
                     break;
+                case CalendarView.DaysAround:
+                    const weekAroundView = CalendarUtils.GetDaysAround(this.selectedDate);
+                    this.weekDays = weekAroundView.weekDays;
+                    if (this.firstAvailableDate) {
+                        this.showBackButton = this.weekDays.find(wd => DateUtils.DatesEqual(this.firstAvailableDate, wd.date)) === undefined;
+                    }
+                    break;
                 case CalendarView.WeekView:
                     const weekView = CalendarUtils.GetDaysOfWeek(this.selectedDate);
                     this.weekDays = weekView.weekDays;
@@ -6301,62 +6357,86 @@ class AgendaHeaderComponent {
             }
         }
     }
+    capitalizeString(label) {
+        return label[0].toUpperCase() + label.slice(1);
+    }
 }
 AgendaHeaderComponent.decorators = [
     { type: Component, args: [{
                 selector: "agenda-header",
                 template: `
-        <div class="agenda-header-wrapper" *ngIf="view === viewTypes.DayView">
-            <div class="hour-label-placeholder">
-                <view-select [selectedView]="view" (selectedViewChange)="changeTheView($event)"></view-select>
-            </div>
-            <div class="week-day-label">
-                <co-icon class="pointer-hover no-user-select sub-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
-                <div class="day-description" [textContent]="day.description"></div>
-                <co-icon class="pointer-hover no-user-select add-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
-            </div>
+      <div class="agenda-header-wrapper" *ngIf="view === viewTypes.DayView">
+        <div class="hour-label-placeholder" *ngIf="viewSelection">
+          <view-select [selectedView]="view" (selectedViewChange)="changeTheView($event)"></view-select>
+        </div>
+        <div class="week-day-label">
+          <co-icon class="pointer-hover no-user-select sub-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
+          <div class="day-description" [textContent]="day.description"></div>
+          <co-icon class="pointer-hover no-user-select add-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
         </div>
-        <div class="agenda-header-wrapper" *ngIf="view === viewTypes.WeekView">
+      </div>
+      <div class="agenda-header-wrapper days-around" *ngIf="view === viewTypes.DaysAround">
+        <div class="hour-label-placeholder" *ngIf="viewSelection">
+          <view-select [selectedView]="view" (selectedViewChange)="changeTheView($event)"></view-select>
+        </div>
+        <div class="week-day-label days-around" *ngFor="let weekDay of weekDays; let index = index"
+             [class.selected]="weekDay.weekdaySelected" (click)="setUnit(weekDay)">
+          <co-icon *ngIf="showBackButton && index === 0" class="pointer-hover no-user-select sub-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
+          <div *ngIf="weekDay.newMonth" [textContent]="weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear"
+               class="month-description"></div>
+          <div class="weekday-value day"
+               [textContent]="capitalizeString(weekDay.weekdayShort)"></div>
+          <div class="weekday-value date"
+               [textContent]="weekDay.weekdayDay"></div>
+          <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
+        </div>
+      </div>
+      <div class="agenda-header-wrapper" *ngIf="view === viewTypes.WeekView">
+        <div class="hour-label-placeholder" *ngIf="viewSelection">
+          <view-select [selectedView]="view" (selectedViewChange)="changeTheView($event)"></view-select>
+        </div>
+        <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index"
+             [class.selected]="weekDay.weekdaySelected" (click)="setUnit(weekDay)">
+          <co-icon *ngIf="showBackButton && index === 0" class="pointer-hover no-user-select sub-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
+          <div *ngIf="weekDay.newMonth" [textContent]="weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear"
+               class="month-description"></div>
+          <div class="weekday-value"
+               [textContent]="capitalizeString(weekDay.weekdayLong) + ' ' + weekDay.weekdayDay + ' ' + capitalizeString(weekDay.weekdayMonthLong) + ' ' + weekDay.weekdayYear "></div>
+          <co-icon *ngIf="index === 2" class="pointer-hover no-user-select add-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
 
-            <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index"
-                 [class.selected]="weekDay.weekdaySelected" (click)="setUnit(weekDay)">
-                <co-icon *ngIf="index === 0 && showBackButton" class="pointer-hover no-user-select sub-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
-                <div *ngIf="weekDay.newMonth" [textContent]="weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear"
-                     class="month-description"></div>
-                <div class="weekday-value"
-                     [textContent]="weekDay.weekdayLong + ' ' + weekDay.weekdayDay + ' ' + weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear "></div>
-                <!--                <div class="weekday-description" [textContent]="weekDay.weekdayYear"></div>-->
-                <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
-            </div>
         </div>
 
+      </div>
 
-        <div class="agenda-header-wrapper" *ngIf="view === viewTypes.WeekSelectView">
-            <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index"
-                 [class.selected]="weekDay.weekdaySelected"
-                 [class.selectable]="weekDay.events && weekDay.events.length > 0"
-                 (click)="setUnit(weekDay)">
-                <co-icon *ngIf="index === 0 && showBackButton" class="pointer-hover no-user-select sub-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
-                <div class="weekday-description" [textContent]="weekDay.weekdayShort"></div>
-                <div class="weekday-value" [textContent]="weekDay.weekdayDay + ' ' + weekDay.weekdayMonthShort"></div>
-                <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
-            </div>
+
+      <div class="agenda-header-wrapper" *ngIf="view === viewTypes.WeekSelectView">
+        <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index"
+             [class.selected]="weekDay.weekdaySelected"
+             [class.selectable]="weekDay.events && weekDay.events.length > 0"
+             (click)="setUnit(weekDay)">
+          <co-icon *ngIf="index === 0 && showBackButton" class="pointer-hover no-user-select sub-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
+          <div class="weekday-description" [textContent]="weekDay.weekdayShort"></div>
+          <div class="weekday-value" [textContent]="weekDay.weekdayDay + ' ' + weekDay.weekdayMonthShort"></div>
+          <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
         </div>
-        <div class="agenda-header-wrapper" *ngIf="view === viewTypes.MonthView">
-            <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index">
-                <co-icon *ngIf="index === 0 && showBackButton" class="pointer-hover no-user-select sub-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
-                <div class="weekday-description" [textContent]="weekDay.weekdayShort"></div>
-                <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
-                         [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
-            </div>
+      </div>
+      <div class="agenda-header-wrapper" *ngIf="view === viewTypes.MonthView">
+        <div class="week-day-label" *ngFor="let weekDay of weekDays; let index = index">
+          <co-icon *ngIf="index === 0 && showBackButton" class="pointer-hover no-user-select sub-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointLeft)" (click)="subUnit()"></co-icon>
+          <div class="weekday-description" [textContent]="weekDay.weekdayShort"></div>
+          <co-icon *ngIf="index === 6" class="pointer-hover no-user-select add-unit-icon dark"
+                   [iconData]="iconCacheService.getIcon(icons.ArrowPointRight)" (click)="addUnit()"></co-icon>
         </div>
+      </div>
     `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -6373,6 +6453,7 @@ AgendaHeaderComponent.propDecorators = {
     view: [{ type: Input }],
     firstAvailableDate: [{ type: Input }],
     eventsPerDay: [{ type: Input }],
+    viewSelection: [{ type: Input }],
     viewChange: [{ type: Output }],
     selectedDateChange: [{ type: Output }],
     rangeChange: [{ type: Output }]