@colijnit/corecomponents_v12 258.1.9 → 258.1.11

package/fesm2015/colijnit-corecomponents_v12.js

@@ -9894,13 +9894,60 @@ class SimpleGridComponent extends BaseSimpleGridComponent {
     }
     exportToExcel() {
         this.isSettingsMenuOpen = false;
+        const exportData = this._filterSelectedOrReturnAll(this.data);
         const columns = this.headerColumnsCopy.map(column => {
             return ({
                 key: column.field,
                 header: column.headerText
             });
         });
-        this.excelExportService.exportToExcel(this.data, columns, 'ExcelSheet', 'Sheet1');
+        const headers = columns.map(col => col.header);
+        const rows = exportData.map(row => columns.map(col => {
+            const value = row[col.key];
+            if (value instanceof Date) {
+                const formattedDate = value.toISOString().split('T')[0];
+                const [year, month, day] = formattedDate.split('-');
+                return `${day}-${month}-${year}`;
+            }
+            else if (typeof value === 'number') {
+                const hasDecimal = (num) => !Number.isInteger(num);
+                return hasDecimal ? value.toFixed(2) : value.toFixed(0);
+            }
+            else if (Array.isArray(value)) {
+                return value.join(', ');
+            }
+            else if (typeof value === 'object' && value !== null) {
+                return JSON.stringify(value);
+            }
+            else {
+                if (!value)
+                    return '';
+                if (value.includes('T00:00:00')) {
+                    const [year, month, day] = value.replace('T00:00:00', '').split('-');
+                    return `${day}-${month}-${year}`;
+                }
+                return String(value);
+            }
+        }));
+        const csvContent = [headers, ...rows].map(row => row.map(cell => `"${cell.replace(/"/g, '""')}"`).join(',')).join('\r\n');
+        const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
+        const link = document.createElement('a');
+        const url = URL.createObjectURL(blob);
+        link.href = url;
+        link.setAttribute('download', 'ExcelSheet');
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        // this.excelExportService.exportToExcel(
+        //   this.data,
+        //   columns,
+        //   'ExcelSheet',
+        //   'Sheet1'
+        // );
+    }
+    _filterSelectedOrReturnAll(items) {
+        const hasSelectedTrue = items.some(item => item.selected === true);
+        return hasSelectedTrue ? items.filter(item => item.selected === true) : items;
     }
     prepareDataRow(row, index) {
         this.isRowDisabled(row, index);
@@ -10050,175 +10097,175 @@ SimpleGridComponent.decorators = [
     { type: Component, args: [{
                 selector: 'co-simple-grid',
                 template: `
-    <co-grid-toolbar
-      *ngIf="showToolbar" [class.right]="rightToolbar"
-      [showEdit]="showEdit"
-      [showAdd]="showAdd"
-      [showDelete]="showDelete"
-      [deleteEnabled]="selectedRowIndex > -1"
-      (addClick)="addNewRow()"
-      (editClick)="editRow($event)"
-      (saveClick)="validateAndSave()"
-      (cancelClick)="cancelEditRow()"
-      (deleteClick)="removeRow()">
-    </co-grid-toolbar>
+      <co-grid-toolbar
+              *ngIf="showToolbar" [class.right]="rightToolbar"
+              [showEdit]="showEdit"
+              [showAdd]="showAdd"
+              [showDelete]="showDelete"
+              [deleteEnabled]="selectedRowIndex > -1"
+              (addClick)="addNewRow()"
+              (editClick)="editRow($event)"
+              (saveClick)="validateAndSave()"
+              (cancelClick)="cancelEditRow()"
+              (deleteClick)="removeRow()">
+      </co-grid-toolbar>
 
-    <table
-      id="simple-grid-table"
-      class="simple-grid-table"
-      [clickOutside]="editing"
-      (clickOutside)="handleClickOutsideRow()">
-      <colgroup>
-        <col
-          *ngFor="let column of headerColumnsCopy; let index = index"
-          [class.simple-grid-column-auto-fit]="column.autoFit"
-          [style.width.px]="column.width"
-          [style.min-width.px]="MIN_COLUMN_WIDTH">
-      </colgroup>
-      <thead>
-      <tr>
-        <th
-          scope="col"
-          #headerCell
-          class="simple-grid-column-header"
-          *ngFor="let column of headerColumnsCopy; let index = index">
-          <div
-            class="simple-grid-column-header-wrapper"
-            [class.resizable]="resizable"
-            [class.selected]="column.isSelected"
-            [ngClass]="column.textAlign ? column.textAlign : defaultTextAlign">
-            <ng-container *ngIf="column.headerTemplate; else noHeaderTemplate">
-              <ng-container [ngTemplateOutlet]="column.headerTemplate"></ng-container>
-            </ng-container>
-            <ng-template #noHeaderTemplate>
-              <div
-                class="simple-grid-column-header-label"
-                [ngClass]="column.textAlign ? column.textAlign : defaultTextAlign"
-                [class.with-menu]="showGridSettings"
-                [class.with-sort]="showColumnSort"
-                [textContent]="column.headerText || '&nbsp;'"
-                (click)="showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)">
-              </div>
+      <table
+              id="simple-grid-table"
+              class="simple-grid-table"
+              [clickOutside]="editing"
+              (clickOutside)="handleClickOutsideRow()">
+          <colgroup>
+              <col
+                      *ngFor="let column of headerColumnsCopy; let index = index"
+                      [class.simple-grid-column-auto-fit]="column.autoFit"
+                      [style.width.px]="column.width"
+                      [style.min-width.px]="MIN_COLUMN_WIDTH">
+          </colgroup>
+          <thead>
+          <tr>
+              <th
+                      scope="col"
+                      #headerCell
+                      class="simple-grid-column-header"
+                      *ngFor="let column of headerColumnsCopy; let index = index">
+                  <div
+                          class="simple-grid-column-header-wrapper"
+                          [class.resizable]="resizable"
+                          [class.selected]="column.isSelected"
+                          [ngClass]="column.textAlign ? column.textAlign : defaultTextAlign">
+                      <ng-container *ngIf="column.headerTemplate; else noHeaderTemplate">
+                          <ng-container [ngTemplateOutlet]="column.headerTemplate"></ng-container>
+                      </ng-container>
+                      <ng-template #noHeaderTemplate>
+                          <div
+                                  class="simple-grid-column-header-label"
+                                  [ngClass]="column.textAlign ? column.textAlign : defaultTextAlign"
+                                  [class.with-menu]="showGridSettings"
+                                  [class.with-sort]="showColumnSort"
+                                  [textContent]="column.headerText || '&nbsp;'"
+                                  (click)="showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)">
+                          </div>
 
-              <div class="sort-column" *ngIf="showColumnSort">
-                <co-button
-                  (click)="sortColumn(column, column?.field)"
-                  [iconData]="icons.getIcon(Icons.ArrowUpArrowDown)">
-                </co-button>
-              </div>
+                          <div class="sort-column" *ngIf="showColumnSort">
+                              <co-button
+                                      (click)="sortColumn(column, column?.field)"
+                                      [iconData]="icons.getIcon(Icons.ArrowUpArrowDown)">
+                              </co-button>
+                          </div>
 
-              <div class="column-menu" *ngIf="column.isSelected">
-                <h3 [textContent]="'COLUMN_OPTIONS' | coreLocalize"></h3>
-                <ul>
-                  <li (click)="hideColumn(column)">Hide Column</li>
-                  <li (click)="sortColumn(column, column.field)">Sort Column</li>
-                </ul>
-              </div>
-            </ng-template>
-            <div
-              *ngIf="resizable && column.resizable"
-              class="simple-grid-column-sizer"
-              (mousedown)="handleSizerMouseDown($event, column)">
-            </div>
-          </div>
-        </th>
-      </tr>
+                          <div class="column-menu" *ngIf="column.isSelected">
+                              <h3 [textContent]="'COLUMN_OPTIONS' | coreLocalize"></h3>
+                              <ul>
+                                  <li (click)="hideColumn(column)">Hide Column</li>
+                                  <li (click)="sortColumn(column, column.field)">Sort Column</li>
+                              </ul>
+                          </div>
+                      </ng-template>
+                      <div
+                              *ngIf="resizable && column.resizable"
+                              class="simple-grid-column-sizer"
+                              (mousedown)="handleSizerMouseDown($event, column)">
+                      </div>
+                  </div>
+              </th>
+          </tr>
 
-      <div *ngIf="showGridSettings" class="grid-settings">
-        <co-button
-          [class.selected]="isSettingsMenuOpen"
-          [iconData]="icons.getIcon(Icons.CogWheels)"
-          (click)="toggleSettingsMenu()">
-        </co-button>
+          <div *ngIf="showGridSettings" class="grid-settings">
+              <co-button
+                      [class.selected]="isSettingsMenuOpen"
+                      [iconData]="icons.getIcon(Icons.CogWheels)"
+                      (click)="toggleSettingsMenu()">
+              </co-button>
 
-        <div class="settings-menu" *ngIf="isSettingsMenuOpen">
-          <h3 [textContent]="'GRID_OPTIONS' | coreLocalize"></h3>
-          <ul>
-            <li (click)="exportToExcel()">Export to Excel</li>
-            <li *ngIf="headerColumnsCopy.length !== headerColumns.length" (click)="showAllColumns()">
-              Show All Columns
-            </li>
-          </ul>
-        </div>
-      </div>
-      </thead>
-      <tbody
-        #dropList cdkDropList cdkDropListOrientation="vertical"
-        class="simple-grid-drag-drop-list"
-        [cdkDropListDisabled]="!dragDropEnabled || editing"
-        [cdkDropListData]="data"
-        [cdkDropListEnterPredicate]="handleCanDragDrop"
-        (cdkDropListDropped)="handleDrop($event)">
-      <co-form class="simple-grid-row-form">
-        <tr
-          class="simple-grid-row"
-          [class.selected]="rowIndex === selectedRowIndex && !editing" observeVisibility
-          [class.disabled]="getIsRowDisabled(rowIndex)"
-          [class.editing]="rowIndex === editRowIndex"
-          *ngFor="let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index"
-          cdkDrag
-          (click)="handleClickRow($event, rowIndex, row)" (dblclick)="handleDblClickRow($event, rowIndex, row)"
-          (visibilityChange)="rowVisible.next(row)"
-          (mouseenter)="hoveredRowIndex = rowIndex"
-          (mouseleave)="hoveredRowIndex = -1"
-        >
-          <ng-container *ngIf="isSingleColumnRow(row)">
-            <td class="simple-grid-single-column-cell" [attr.colspan]="headerColumnsCopy.length">
-              <co-simple-grid-cell
-                [column]="columns[singleColumnIndex(row)]"
-                [row]="row"
-                [editMode]="false">
-              </co-simple-grid-cell>
-            </td>
-          </ng-container>
-          <ng-container *ngIf="!isSingleColumnRow(row)">
-            <ng-container *ngFor="let column of headerColumnsCopy; let columnIndex = index">
-              <td class="simple-grid-column-cell" *ngIf="columnIndex !== singleColumnIndex(row)">
-                <co-simple-grid-cell
-                  [column]="column"
-                  [row]="row"
-                  [editMode]="inlineEdit && editing && rowIndex === editRowIndex"
-                  [fieldEditMode]="editCellIndex === columnIndex && rowIndex === editRowIndex"
-                  (cellClick)="handleCellClick($event, row, rowIndex, columnIndex)">
-                </co-simple-grid-cell>
-                <div *ngIf="column.resizable" class="simple-grid-column-sizer-placeholder"></div>
-              </td>
-            </ng-container>
-            <ng-container *ngIf="inlineEdit">
-              <div class="icons-container" *ngIf="!editing">
-                <co-icon class="icon-item icon-edit"
-                         [iconData]="icons.getIcon(Icons.PenToSquareSolid)" *ngIf="hoveredRowIndex === rowIndex"
-                         (click)="editRow($event, true, rowIndex); $event.stopPropagation()"></co-icon>
-                <co-icon class="icon-item icon-delete"
-                         [iconData]="icons.getIcon(Icons.TrashBin)" *ngIf="hoveredRowIndex === rowIndex"
-                         (click)="removeRow()"></co-icon>
-              </div>
-              <div class="icons-container">
-                <co-button class="save-button"
-                           *ngIf="editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))"
-                           [iconData]="icons.getIcon(Icons.CheckDuotone)"
-                           (click)="validateAndSave(); $event.stopPropagation()"></co-button>
-                <co-button class="close-button"
-                           *ngIf="editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))"
-                           [iconData]="icons.getIcon(Icons.CrossSkinny)"
-                           (click)="cancelEditRow(); $event.stopPropagation() "></co-button>
+              <div class="settings-menu" *ngIf="isSettingsMenuOpen">
+                  <h3 [textContent]="'GRID_OPTIONS' | coreLocalize"></h3>
+                  <ul>
+                      <li (click)="exportToExcel()">Export to Excel</li>
+                      <li *ngIf="headerColumnsCopy.length !== headerColumns.length" (click)="showAllColumns()">
+                          Show All Columns
+                      </li>
+                  </ul>
               </div>
-            </ng-container>
-          </ng-container>
-        </tr>
-      </co-form>
-      </tbody>
-    </table>
-    <co-pagination-bar
-      *ngIf="data?.length > rowsPerPage" class="pagination-bar"
-      [itemsPerPage]="rowsPerPage"
-      [currentPage]="currentPage"
-      [totalItems]="data.length"
-      [autoHide]="true"
-      (previousClick)="goToPreviousPage()"
-      (nextClick)="goToNextPage()"
-      (pageClick)="setCurrentPage($event)">
-    </co-pagination-bar>
+          </div>
+          </thead>
+          <tbody
+                  #dropList cdkDropList cdkDropListOrientation="vertical"
+                  class="simple-grid-drag-drop-list"
+                  [cdkDropListDisabled]="!dragDropEnabled || editing"
+                  [cdkDropListData]="data"
+                  [cdkDropListEnterPredicate]="handleCanDragDrop"
+                  (cdkDropListDropped)="handleDrop($event)">
+          <co-form class="simple-grid-row-form">
+              <tr
+                      class="simple-grid-row"
+                      [class.selected]="rowIndex === selectedRowIndex && !editing" observeVisibility
+                      [class.disabled]="getIsRowDisabled(rowIndex)"
+                      [class.editing]="rowIndex === editRowIndex"
+                      *ngFor="let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index"
+                      cdkDrag
+                      (click)="handleClickRow($event, rowIndex, row)" (dblclick)="handleDblClickRow($event, rowIndex, row)"
+                      (visibilityChange)="rowVisible.next(row)"
+                      (mouseenter)="hoveredRowIndex = rowIndex"
+                      (mouseleave)="hoveredRowIndex = -1"
+              >
+                  <ng-container *ngIf="isSingleColumnRow(row)">
+                      <td class="simple-grid-single-column-cell" [attr.colspan]="headerColumnsCopy.length">
+                          <co-simple-grid-cell
+                                  [column]="columns[singleColumnIndex(row)]"
+                                  [row]="row"
+                                  [editMode]="false">
+                          </co-simple-grid-cell>
+                      </td>
+                  </ng-container>
+                  <ng-container *ngIf="!isSingleColumnRow(row)">
+                      <ng-container *ngFor="let column of headerColumnsCopy; let columnIndex = index">
+                          <td class="simple-grid-column-cell" *ngIf="columnIndex !== singleColumnIndex(row)">
+                              <co-simple-grid-cell
+                                      [column]="column"
+                                      [row]="row"
+                                      [editMode]="inlineEdit && editing && rowIndex === editRowIndex"
+                                      [fieldEditMode]="editCellIndex === columnIndex && rowIndex === editRowIndex"
+                                      (cellClick)="handleCellClick($event, row, rowIndex, columnIndex)">
+                              </co-simple-grid-cell>
+                              <div *ngIf="column.resizable" class="simple-grid-column-sizer-placeholder"></div>
+                          </td>
+                      </ng-container>
+                      <ng-container *ngIf="inlineEdit">
+                          <div class="icons-container" *ngIf="!editing">
+                              <co-icon class="icon-item icon-edit"
+                                       [iconData]="icons.getIcon(Icons.PenToSquareSolid)" *ngIf="hoveredRowIndex === rowIndex"
+                                       (click)="editRow($event, true, rowIndex); $event.stopPropagation()"></co-icon>
+                              <co-icon class="icon-item icon-delete"
+                                       [iconData]="icons.getIcon(Icons.TrashBin)" *ngIf="hoveredRowIndex === rowIndex"
+                                       (click)="removeRow()"></co-icon>
+                          </div>
+                          <div class="icons-container">
+                              <co-button class="save-button"
+                                         *ngIf="editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))"
+                                         [iconData]="icons.getIcon(Icons.CheckDuotone)"
+                                         (click)="validateAndSave(); $event.stopPropagation()"></co-button>
+                              <co-button class="close-button"
+                                         *ngIf="editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))"
+                                         [iconData]="icons.getIcon(Icons.CrossSkinny)"
+                                         (click)="cancelEditRow(); $event.stopPropagation() "></co-button>
+                          </div>
+                      </ng-container>
+                  </ng-container>
+              </tr>
+          </co-form>
+          </tbody>
+      </table>
+      <co-pagination-bar
+              *ngIf="data?.length > rowsPerPage" class="pagination-bar"
+              [itemsPerPage]="rowsPerPage"
+              [currentPage]="currentPage"
+              [totalItems]="data.length"
+              [autoHide]="true"
+              (previousClick)="goToPreviousPage()"
+              (nextClick)="goToNextPage()"
+              (pageClick)="setCurrentPage($event)">
+      </co-pagination-bar>
   `,
                 providers: [FormMasterService],
                 changeDetection: ChangeDetectionStrategy.OnPush,