Update projects

Author: AlisherAmonulloev

Angular/angular.json

@@ -21,7 +21,9 @@
               "devextreme-quill",
               "jszip",
               "devexpress-diagram",
-              "devexpress-gantt"
+              "devexpress-gantt",
+              "file-saver",
+              "devextreme-exceljs-fork"
             ],
             "outputPath": "dist/Angular",
             "index": "src/index.html",

Angular/package.json

@@ -24,8 +24,9 @@
     "@angular/router": "^18.0.3",
     "devextreme": "25.1.3",
     "devextreme-angular": "25.1.3",
-    "exceljs": "^4.4.0",
+    "devextreme-exceljs-fork": "^4.4.3",
     "file-saver": "^2.0.5",
+    "jspdf": "^3.0.3",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.14.7"
@@ -34,6 +35,7 @@
     "@angular-devkit/build-angular": "^18.0.4",
     "@angular/cli": "~18.0.4",
     "@angular/compiler-cli": "^18.0.3",
+    "@types/events": "^3.0.3",
     "@types/file-saver": "^2.0.7",
     "@types/jasmine": "~4.3.0",
     "@types/node": "^24.7.0",

Angular/src/app/app.component.ts

@@ -1,4 +1,7 @@
 import { Component } from '@angular/core';
+import { exportPivotGrid } from 'devextreme/excel_exporter';
+import { Workbook } from 'devextreme-exceljs-fork';
+import { saveAs } from 'file-saver';
 import { AdventureWorksService } from './adventureworks.service';
 import type { PivotGridDataSource } from './app.types';
 
@@ -18,10 +21,15 @@ export class AppComponent {
   }
 
   exportGrid(e: any): void {
-    // Export functionality can be implemented here
-    // For this example, we'll just prevent the default export
+    const workbook = new Workbook();
+    const worksheet = workbook.addWorksheet('Sales');
+
+    exportPivotGrid({
+      component: e.component,
+      worksheet,
+    }).then(() => workbook.xlsx.writeBuffer().then((buffer: ArrayBuffer) => {
+      saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'Sales.xlsx');
+    })).catch(() => undefined);
     e.cancel = true;
-    // eslint-disable-next-line no-console
-    console.log('Export functionality can be implemented using DevExtreme export capabilities');
   }
 }

Angular/tsconfig.json

@@ -23,7 +23,8 @@
       "ES2022",
       "dom"
     ],
-    "types": ["node"]
+    "types": ["node"],
+    "skipLibCheck": true
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false,

React/package.json

@@ -15,9 +15,10 @@
   },
   "dependencies": {
     "devextreme": "25.1.3",
+    "devextreme-exceljs-fork": "^4.4.3",
     "devextreme-react": "25.1.3",
-    "exceljs": "^4.4.0",
     "file-saver": "^2.0.5",
+    "jspdf": "^3.0.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

React/src/App.tsx

@@ -8,7 +8,7 @@ import PivotGrid, {
 } from 'devextreme-react/pivot-grid';
 import type { PivotGridTypes } from 'devextreme-react/pivot-grid';
 import { exportPivotGrid } from 'devextreme/excel_exporter';
-import { Workbook } from 'exceljs';
+import { Workbook } from 'devextreme-exceljs-fork';
 import { saveAs } from 'file-saver';
 import AdventureWorksService from './adventureworks.service';
 
@@ -22,9 +22,8 @@ function App(): JSX.Element {
     exportPivotGrid({
       component: e.component,
       worksheet,
-    }).then(() => workbook.xlsx.writeBuffer().then((buffer) => {
+    }).then(() => workbook.xlsx.writeBuffer().then((buffer: ArrayBuffer) => {
       saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'Sales.xlsx');
-      return buffer;
     })).catch(() => undefined);
     e.cancel = true;
   }, []);

Vue/package.json

@@ -13,9 +13,10 @@
   },
   "dependencies": {
     "devextreme": "25.1.3",
+    "devextreme-exceljs-fork": "^4.4.3",
     "devextreme-vue": "25.1.3",
-    "exceljs": "^4.4.0",
     "file-saver": "^2.0.5",
+    "jspdf": "^3.0.3",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6"
   },

Vue/src/components/PivotGridContent.vue

@@ -8,7 +8,7 @@ import {
 import type { DxPivotGridTypes } from 'devextreme-vue/pivot-grid';
 import AdventureWorksService from '../adventureworks.service';
 import { exportPivotGrid } from 'devextreme/excel_exporter';
-import { Workbook } from 'exceljs';
+import { Workbook } from 'devextreme-exceljs-fork';
 import { saveAs } from 'file-saver';
 
 const dataSource = AdventureWorksService.getPivotGridDataSource() as any;

jQuery/package.json

@@ -27,6 +27,9 @@
     "browser-sync": "^3.0.2",
     "devextreme": "25.1.3",
     "devextreme-dist": "25.1.3",
-    "jquery": "^3.7.1"
+    "devextreme-exceljs-fork": "^4.4.3",
+    "file-saver": "^2.0.5",
+    "jquery": "^3.7.1",
+    "jspdf": "^3.0.3"
   }
 }

jQuery/src/index.html

@@ -8,8 +8,8 @@
     <link rel="icon" href="/favicon.ico" />
     <link rel="stylesheet" type="text/css" href="../node_modules/devextreme-dist/css/dx.material.blue.light.compact.css" />
     <link rel="stylesheet" type="text/css" href="index.css" />
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/exceljs/3.8.0/exceljs.min.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
+    <script src="../node_modules/devextreme-exceljs-fork/dist/dx-exceljs-fork.min.js"></script>
+    <script src="../node_modules/file-saver/dist/FileSaver.min.js"></script>
     <script type="text/javascript" src="../node_modules/jquery/dist/jquery.js"></script>
     <script type="text/javascript" src="../node_modules/devextreme-dist/js/dx.all.js"></script>
     <script type="text/javascript" src="index.js"></script>