update employee pdf export

Author: Mirazyzz

CheckDrive.Web/CheckDrive.Web/Views/Employees/Index.cshtml

@@ -41,6 +41,8 @@
                 </div>
             </div>
             <div class="d-flex col-md justify-content-end create-btn">
+                <button class="btn btn-primary" onclick="exportToPdf()">Export to PDF</button>
+                <button class="btn btn-success" onclick="exportToExcel()">Export to Excel</button>
                 <button id="openModalButton" class="btn btn-success open-modal" type="button" style="width: 15%">
                     <i class="fa fa-plus"></i> Yangi
                 </button>
@@ -55,14 +57,17 @@
                       gridLines="Both"
                       allowSorting="true"
                       allowPaging="true"
-                      allowFiltering="true">
+                      allowFiltering="true"
+                      allowPdfExport="true"
+                      allowExcelExport="true"
+                      toolbarClick="onToolbarClick">
                 <e-grid-selectionsettings mode="Row" type="Single"></e-grid-selectionsettings>
                 <e-grid-pagesettings pageSize="10"></e-grid-pagesettings>
                 <e-grid-columns>
-                    <e-grid-column field="AccountId" headerText="Account ID" textAlign="Center" headerTextAlign="Center"></e-grid-column>
                     <e-grid-column headerText="Ism" field="FirstName" textAlign="Center" headerTextAlign="Center" typeof="text"></e-grid-column>
                     <e-grid-column headerText="Familiya" field="LastName" textAlign="Center" headerTextAlign="Center" typeof="text"></e-grid-column>
                     <e-grid-column headerText="Sharfi" field="Patronymic" textAlign="Center" headerTextAlign="Center" typeof="text"></e-grid-column>
+                    <e-grid-column headerText="Passport" field="Passport" textAlign="Center" headerTextAlign="Center"></e-grid-column>
                     <e-grid-column headerText="Telefon raqam" field="PhoneNumber" textAlign="Center" headerTextAlign="Center" typeof="text"></e-grid-column>
                     <e-grid-column headerText="Kasb" field="FormattedPosition" textAlign="Center" headerTextAlign="Center" typeof="text"></e-grid-column>
                     <e-grid-column width="180" type="text" textAlign="Center" template="#actionTemplate"></e-grid-column>

CheckDrive.Web/CheckDrive.Web/wwwroot/js/employees.js

@@ -92,6 +92,15 @@ function onDetailsClick(id) {
     });
 }
 
+function onToolbarClick(args) {
+    let grid = document.getElementById('employees-list').ej2_instances[0];
+    if (args.item.id === 'employees-list_pdfexport') {
+        grid.pdfExport();
+    } else if (args.item.id === 'employees-list_excelexport') {
+        grid.excelExport();
+    }
+}
+
 $('#detailsModal').on('hidden.bs.modal', function () {
     $(this).find('#detailsContent').empty();
 });
@@ -135,3 +144,80 @@ $('#createModal').on('hidden.bs.modal', function () {
     $(this).find('#accountModalContent').empty();
     $(this).off('hidden.bs.modal');
 });
+
+function exportToPdf() {
+    let grid = document.getElementById('employees-list').ej2_instances[0];
+    grid.pdfExport({
+        includeHiddenColumn: true,
+        fileName: 'xodimlar.pdf',
+        theme: {
+            header: {
+                fontName: 'Arial',
+                fontSize: 14,
+                size: 16,
+                bold: true,
+                italic: false,
+                color: '#FFFFFF',
+                background: '#4CAF50' // Header background color
+            },
+            record: {
+                fontName: 'Arial',
+                fontSize: 12,
+                size: 14,
+                color: '#000000'
+            },
+            caption: {
+                fontName: 'Arial',
+                fontSize: 12,
+                size: 14,
+                bold: true,
+                color: '#333333',
+                background: '#f8f8f8'
+            }
+        },
+        header: {
+            fromTop: 0,
+            height: 130,
+            contents: [
+                {
+                    width: 100,
+                    height: 50,
+                    type: 'Text',
+                    value: 'ATP Garaj xodimlari',
+                    position: { x: 250, y: 50 },
+                    style: { textBrushColor: '#3d3d3d', fontSize: 24, bold: true }
+                },
+                {
+                    type: 'Text',
+                    value: new Date().toLocaleDateString(),
+                    position: { x: 600, y: 100 },
+                    style: { textBrushColor: '#1f1f1f', fontSize: 16 }
+                }
+            ]
+        },
+        footer: {
+            fromBottom: 0,
+            height: 40,
+            contents: [
+                {
+                    type: 'Text',
+                    value: '© 2025 Silk Route Connect',
+                    position: { x: 250, y: 20 },
+                    style: { textBrushColor: '#333333', fontSize: 12 }
+                }
+            ]
+        },
+        columns: grid.getColumns().filter(col => col.field !== null && col.field !== undefined)
+    });
+
+    grid.addEventListener('pdfQueryCellInfo', function (args) {
+        if (args.cell) {
+            args.style = {
+                padding: { top: 5, right: 10, bottom: 5, left: 10 }
+            };
+        }
+    });
+}
+
+function exportToExcel() {
+}