| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>JSON Data Display</title>
- <style>
- body {
- font-family: Arial, sans-serif;
- margin: 20px;
- }
- #data-container {
- margin-top: 20px;
- }
- .data-item {
- margin-bottom: 10px;
- }
- </style>
- </head>
- <body>
- <h1>JSON Data Display</h1>
- <div id="data-container">
- <!-- Data will be inserted here -->
- </div>
- <script>
- const url = 'http://localhost:8080/json'; // Replace with your actual URL
- const dataContainer = document.getElementById('data-container');
- async function fetchData() {
- try {
- const response = await fetch(url);
- if (!response.ok) {
- throw new Error('Network response was not ok');
- }
- const data = await response.json();
- updateData(data);
- } catch (error) {
- console.error('There was a problem with the fetch operation:', error);
- }
- }
- function updateData(data) {
- const agent = data.Agents.blackbox;
- dataContainer.innerHTML = `
- <div class="data-item"><strong>Name:</strong> ${agent.Name}</div>
- <div class="data-item"><strong>Registration Time:</strong> ${agent.Reg}</div>
- <div class="data-item"><strong>Cores:</strong> ${agent.Cores}</div>
- <div class="data-item"><strong>CPU Usage:</strong> ${agent.Cpu.join(', ')}</div>
- <div class="data-item"><strong>Max Memory:</strong> ${agent.Mem_max}</div>
- <div class="data-item"><strong>Memory Usage:</strong> ${agent.Mem_usg.join(', ')}</div>
- <div class="data-item"><strong>Task ID:</strong> ${agent.TaskId}</div>
- `;
- }
- // Fetch data initially
- fetchData();
- // Fetch data every second
- setInterval(fetchData, 1000);
- </script>
- <hr/>
- <form action="http://localhost:8080/addTask" method="post">
- <table border="0">
- <tr><td>Row1</td><td>:</td><td><input type="text" value="769104802" name="rows"></td></tr>
- <tr><td>Row2</td><td>:</td><td><input type="text" value="154800060" name="rows"></td></tr>
- <tr><td>Row3</td><td>:</td><td><input type="text" value="832700154" name="rows"></td></tr>
- <tr><td>Row4</td><td>:</td><td><input type="text" value="600900328" name="rows"></td></tr>
- <tr><td>Row5</td><td>:</td><td><input type="text" value="045328670" name="rows"></td></tr>
- <tr><td>Row6</td><td>:</td><td><input type="text" value="328670945" name="rows"></td></tr>
- <tr><td>Row7</td><td>:</td><td><input type="text" value="597410280" name="rows"></td></tr>
- <tr><td>Row8</td><td>:</td><td><input type="text" value="006283090" name="rows"></td></tr>
- <tr><td>Row9</td><td>:</td><td><input type="text" value="200590006" name="rows"></td></tr>
- <tr><td colspan="3" align="right"><input type="submit"></td></tr>
-
- </table>
- </form>
- <hr/>
- </body>
- </html>
|