From 6e3d9489fb91cb9196c88cbca993d475eb8c9360 Mon Sep 17 00:00:00 2001
From: zifan <1461978311@qq.com>
Date: Thu, 21 Sep 2023 10:47:57 +0800
Subject: [PATCH] =?UTF-8?q?arp=E5=88=97=E8=A1=A8=E7=BB=88=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 www/arp.html | 74 ++++++++++++++++++++++++++++++++++------------------
 1 file changed, 49 insertions(+), 25 deletions(-)
diff --git a/www/arp.html b/www/arp.html
index 3f9bde3..2b39223 100755
--- a/www/arp.html
+++ b/www/arp.html
@@ -6,39 +6,63 @@
     <meta name="author" content="zifan">
     <meta name="keywords" content="物联网">
     <title>ARP列表</title>
+
+    <style>
+        html,
+        body {
+            height: 100%;
+            margin: 0;
+            padding: 0;
+        }
+
+        body {
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+        }
+
+        #arpTable {
+            background-color: rgba(41, 117, 117, 0.667);
+            box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.5);
+        }
+    </style>
 </head>
 
 <body>
-    <table id="arpTable" width="700" align="center" border="1">
-        <thead>
-            <th>ID</th>
-            <th>ip地址</th>
-            <th>mac地址</th>
-        </thead>
-        <tbody id="arpTableBody" align="center">
+    <div></div>
+    <div class="tablecenter">
+        <table id="arpTable" width="700" align="center" border="1" cellspacing="0">
+            <thead>
+                <th>ID</th>
+                <th>ip地址</th>
+                <th>mac地址</th>
+            </thead>
+            <tbody id="arpTableBody" align="center">
 
-        </tbody>
-    </table>
+            </tbody>
+        </table>
+    </div>
+    <div></div>
+    <div></div>
     <script>
         window.onload = function () {
-            fetch("/cgi-bin/ip.cgi").then(resp => resp.json()).then(data => {
-                if (data.code == 0) {
-                    arpTableBody.innerText = "";
-                    data.data.forEach(rowData => {
-                        let tr = document.createElement("tr");
-                        let td1 = document.createElement("td");
-                        let td2 = document.createElement("td");
-                        let td3 = document.createElement("td");
+            fetch("/cgi-bin/arp.cgi").then(resp => resp.json()).then(data => {
+                arpTableBody.innerText = "";
+                data.forEach(rowData => {
+                    let tr = document.createElement("tr");
+                    let td1 = document.createElement("td");
+                    let td2 = document.createElement("td");
+                    let td3 = document.createElement("td");
 
-                        td1.innerText = rowData.id;
-                        td2.innerText = rowData.ip;
-                        td3.innerText = rowData.mac;
+                    td1.innerText = rowData.id;
+                    td2.innerText = rowData.ip;
+                    td3.innerText = rowData.mac;
 
-                        tr.append(td1, td2, td3);
-                        arpTableBody.append(tr);
-                    });
-                }
-            })
+                    tr.append(td1, td2, td3);
+                    arpTableBody.append(tr);
+                });
+            }
+            )
         }
     </script>
 </body>
