From 25e6a6b2b7fa9f68fb9fe285938190c40a221d04 Mon Sep 17 00:00:00 2001
From: GVE Devnet Admin <gve-devnet.gen@cisco.com>
Date: Fri, 21 Jun 2024 16:37:27 +0000
Subject: [PATCH] Baselined from internal Repository
 last_commit:1b9704a37f0668b998bd3981ccfe9de29f962a96

---
 flask_app/app.py               |  2 +
 flask_app/templates/index.html | 98 +++++++++++++++++++++++++++++++++-
 2 files changed, 99 insertions(+), 1 deletion(-)

diff --git a/flask_app/app.py b/flask_app/app.py
index 1c460ae..458724f 100644
--- a/flask_app/app.py
+++ b/flask_app/app.py
@@ -770,6 +770,8 @@ def download_excel():
 
     if download_type == "active":
         filename = f"active_calls_{current_datetime}.xlsx"
+    elif download_type == "device":
+        filename = f"device_list_{current_datetime}.xlsx"
     else:
         filename = f"call_history_{current_datetime}.xlsx"
 
diff --git a/flask_app/templates/index.html b/flask_app/templates/index.html
index 47e44e0..94c27c5 100644
--- a/flask_app/templates/index.html
+++ b/flask_app/templates/index.html
@@ -7,6 +7,15 @@
         <div class="col-md-8">
             <h5 class="display-5 text-center text-bold">Cisco Collaboration Endpoints - Summary</h5>
         </div>
+        <div class="col-md-2">
+            <div class="row">
+                <div class="col-md-4"></div>
+                <div id="excel-export-btn" class="col-md-8 text-right" style="cursor: pointer;">
+                    <span class="text-size-14 text-success text-center">Excel Export</span>
+                    <span class="icon-file-excel-o text-success icon-size-24"></span>
+                </div>
+            </div>
+        </div>
     </div>
     <hr>
     <div class="section">
@@ -62,7 +71,7 @@ <h5 class="text-size-16 text-left dbl-margin-bottom"><b>Device List</b></h5>
 
 <script>
     $(document).ready(function () {
-        $('#device_list_table').DataTable({
+        var table = $('#device_list_table').DataTable({
             responsive: true, // Enable responsive behavior
             columnDefs: [
                 {targets: [0,1], width: "10%"},
@@ -81,6 +90,93 @@ <h5 class="text-size-16 text-left dbl-margin-bottom"><b>Device List</b></h5>
                 }
             ]
         });
+
+        // Initially disable the export button
+        $('#excel-export-btn').addClass('disabled');
+
+        // Check if DataTable has any data
+        if (table.rows().count() !== 0) {
+            // Enable the export button
+            $('#excel-export-btn').removeClass('disabled');
+        }
+    })
+
+    $('#excel-export-btn').on('click', function () {
+        // Gather data from active calls
+        var data = [];
+        $('#device_list_table').DataTable().rows().every(function (rowIdx, tableLoop, rowLoop) {
+            // Extract endpoint name (remove anchor tags)
+            let raw_endpoint = this.node().cells[0];
+            let endpoint = $(raw_endpoint).find('a').html();
+
+            let email = this.data()[1];
+            let connected = this.data()[2];
+            let product = this.data()[3];
+            let serial = this.data()[4];
+            let ip = this.data()[5];
+            let mac = this.data()[6];
+            let software = this.data()[7];
+            let mode = this.data()[8];
+            let region = this.data()[9];
+            let site = this.data()[10];
+            let room = this.data()[11];
+            let uptime = this.data()[12];
+
+            data.push({
+                endpoint: endpoint,
+                email: email,
+                connected: connected,
+                product: product,
+                serial: serial,
+                ip: ip,
+                mac: mac,
+                software: software,
+                mode: mode,
+                region: region,
+                site: site,
+                room: room,
+                uptime: uptime
+            });
+        });
+
+        // Send data to the Flask route using AJAX
+        $.ajax({
+            url: '/download/excel',
+            type: 'POST',
+            data: {
+                download_type: "device",
+                data: JSON.stringify(data)
+            },
+            xhrFields: {
+                responseType: 'blob' // Ensure response type is treated as binary data
+            },
+            success: function (response, status, xhr) {
+                // Extract filename from Content-Disposition header
+                var filename = "";
+                var disposition = xhr.getResponseHeader('Content-Disposition');
+                if (disposition && disposition.indexOf('attachment') !== -1) {
+                    var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
+                    var matches = filenameRegex.exec(disposition);
+                    if (matches != null && matches[1]) {
+                        filename = matches[1].replace(/['"]/g, '');
+                    }
+                }
+
+                // Create a temporary anchor element to trigger the download
+                var anchor = document.createElement('a');
+                var url = window.URL.createObjectURL(response);
+                anchor.href = url;
+                anchor.download = filename || 'device_list.xlsx'; // Use extracted filename or default name
+                document.body.appendChild(anchor);
+                anchor.click();
+                window.URL.revokeObjectURL(url);
+                document.body.removeChild(anchor);
+            },
+            error: function (response) {
+                console.log('Unable to download Device List Excel Document, got the following response:')
+                console.log(response)
+            }
+        });
     })
 </script>
 {%  endblock %}
\ No newline at end of file