https://ops.iris.edu.gr/_content/Argus.Web.Shared/js/excel-viewer.…1BwQxUkWvY4uu59BcMnjQbF2rDDUJ85pduwUfd6K_Rg

1(function () {
2    let xlsxLoaded = false;
3
4    function loadScript(url) {
5        return new Promise((resolve, reject) => {
6            // Check if already loaded
7            const existingScript = document.querySelector(`script[src="${url}"]`);
8            if (existingScript) {
9                resolve();
10                return;
11            }
12
13            const script = document.createElement('script');
14            script.src = url;
15            script.onload = () => resolve();
16            script.onerror = () => reject(new Error(`Failed to load script: ${url}`));
17            document.head.appendChild(script);
18        });
19    }
20
21    // Main render function
22    window.argusRenderExcel = async function (base64Data, containerId) {
23        try {
24            const container = document.getElementById(containerId);
25            if (!container) {
26                console.error(`Container with id "${containerId}" not found`);
27                return;
28            }
29
30            // Show loading state
31            container.innerHTML = '<div class="text-center text-muted p-4"><i class="fa fa-spinner fa-spin"></i> Loading spreadsheet...</div>';
32
33            // Lazy-load xlsx library if not already loaded
34            if (!xlsxLoaded) {
35                await loadScript('https://cdn.sheetjs.com/xlsx-0.20.3/package/dist/xlsx.full.min.js');
36                xlsxLoaded = true;
37            }
38
39            // Parse Excel file from base64
40            const workbook = XLSX.read(base64Data, { type: 'base64' });
41
42            if (!workbook.SheetNames || workbook.SheetNames.length === 0) {
43                container.innerHTML = '<div class="alert alert-warning m-3">No sheets found in the spreadsheet.</div>';
44                return;
45            }
46
47            // Build Bootstrap nav-tabs for multiple sheets
48            let tabsHtml = '';
49            let contentHtml = '';
50
51            workbook.SheetNames.forEach((sheetName, index) => {
52                const sheet = workbook.Sheets[sheetName];
53                const isActive = index === 0 ? 'active' : '';
54                const tabId = `sheet-tab-${index}`;
55                const paneId = `sheet-pane-${index}`;
56
57                // Tab button
58                tabsHtml += `
59                    <li class="nav-item" role="presentation">
60                        <button class="nav-link ${isActive}" 
61                                id="${tabId}" 
62                                data-bs-toggle="tab" 
63                                data-bs-target="#${paneId}" 
64                                type="button" 
65                                role="tab" 
66                                aria-controls="${paneId}" 
67                                aria-selected="${index === 0}">
68                            ${escapeHtml(sheetName)}
69                        </button>
70                    </li>
71                `;
72
73                // Tab content with rendered sheet as HTML table
74                const tableHtml = XLSX.utils.sheet_to_html(sheet, { id: `table-${index}` });
75                contentHtml += `
76                    <div class="tab-pane fade ${isActive} show" 
77                         id="${paneId}" 
78                         role="tabpanel" 
79                         aria-labelledby="${tabId}">
80                        <div class="excel-sheet-container">
81                            ${tableHtml}
82                        </div>
83                    </div>
84                `;
85            });
86
87            // Inject tabs and content
88            container.innerHTML = `
89                <style>
90                    .excel-sheet-container {
91                        overflow-x: auto;
92                    }
93                    .excel-sheet-container table {
94                        font-size: 13px;
95                        border-collapse: collapse;
96                        width: auto;
97                        margin: 0;
98                    }
99                    .excel-sheet-container table td,
100                    .excel-sheet-container table th {
101                        border: 1px solid #ddd;
102                        padding: 6px 10px;
103                        white-space: nowrap;
104                    }
105                    .excel-sheet-container table tr:nth-child(even) {
106                        background-color: #f9f9f9;
107                    }
108                    .excel-sheet-container table tr:hover {
109                        background-color: #f1f1f1;
110                    }
111                </style>
112                <ul class="nav nav-tabs mb-3" role="tablist">
113                    ${tabsHtml}
114                </ul>
115                <div class="tab-content">
116                    ${contentHtml}
117                </div>
118            `;
119
120        } catch (error) {
121            console.error('Error rendering Excel:', error);
122            const container = document.getElementById(containerId);
123            if (container) {
124                container.innerHTML = `<div class="alert alert-danger m-3">Failed to render spreadsheet: ${error.message}</div>`;
125            }
126        }
127    };
128
129    // Helper: Escape HTML to prevent XSS
130    function escapeHtml(text) {
131        const div = document.createElement('div');
132        div.textContent = text;
133        return div.innerHTML;
134    }
135})();