107 lines
		
	
	
		
			3.7 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			107 lines
		
	
	
		
			3.7 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
|   <head>
 | |
|     <meta charset="UTF-8" />
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 | |
|     <title>Temperature-Alarm-Web</title>
 | |
|     <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script>
 | |
|     <link rel="stylesheet" href="/styles/auth.css">
 | |
|     <link rel="stylesheet" href="/styles/devices.css" />
 | |
|     <script defer type="module" src="/scripts/devices.js"></script>
 | |
|   </head>
 | |
| 
 | |
|   <body>
 | |
|     <div id="container">
 | |
|       <div class="topnav">
 | |
|         <a href="/home/index.html">Home</a>
 | |
|         <div style="display: flex; justify-content: flex-end;">
 | |
|             <a class="active" href="/devices">Devices</a>
 | |
|           <a href="/profile">Profile</a>
 | |
|           <span class="logout-container">
 | |
|             <img class="logout" src="/img/logout.png">
 | |
|           </span>
 | |
|         </div>
 | |
|       </div>
 | |
|           <div class="addDeviceContainer">
 | |
|             <button id="addDevice">Add Device</button>
 | |
|           </div>
 | |
|           <div class="tableConatiner">
 | |
|             <table>
 | |
|               <tr>
 | |
|                 <th>Id</th>
 | |
|                 <th>Placement(name)</th>
 | |
|                 <th>Set Temp High</th>
 | |
|                 <th>Set Temp Low</th>
 | |
|                 <th>Latest Meassurement</th>
 | |
|                 <th></th>
 | |
|               </tr>
 | |
|               <tbody id="deviceTable"></tbody>
 | |
|             </table>
 | |
|           </div>
 | |
|     </div>
 | |
| 
 | |
| 
 | |
|     <div id="deleteModal" class="modal">
 | |
|       <form class="modal-content">
 | |
|         <div class="container">
 | |
|           <h1 class="deviceHeader" id="deleteDeviceHeader"></h1>
 | |
|           <p>Are you sure you want to delete this device from your account?</p>
 | |
|         
 | |
|           <div class="clearfix">
 | |
|             <button type="button" class="cancelbtn">Cancel</button>
 | |
|             <button type="button" id="deletebtn">Delete</button>
 | |
|           </div>
 | |
|         </div>
 | |
|       </form>
 | |
|     </div>
 | |
| 
 | |
|     <div id="editModal" class="modal">
 | |
|       <div class="modal-content">
 | |
|         <div class="container">
 | |
|           <h1 class="deviceHeader" id="editDeviceHeader"></h1>
 | |
|           <form id="editForm">
 | |
|                 <div class="form-container">
 | |
|                     <label for="name"><b>Name</b></label>
 | |
|                     <input type="text" placeholder="Enter a name for the placement" id="name" required>
 | |
|   
 | |
|                     <label for="tempHigh"><b>High Temperature</b></label>
 | |
|                     <input type="number" placeholder="Edit the high temperature" id="tempHigh" required>
 | |
|     
 | |
|                     <label for="tempLow"><b>Low Temperature</b></label>
 | |
|                     <input type="number" placeholder="Edit the low temperature" id="tempLow" required>
 | |
|     
 | |
|                     <div class="clearfix">
 | |
|                       <button type="button" class="cancelbtn">Cancel</button>
 | |
|                       <button type="button" id="editbtn">Save Changes</button>
 | |
|                     </div>
 | |
|     
 | |
|                     <div id="form-error"></div>
 | |
|                 </div>
 | |
|             </form>
 | |
|         </div>
 | |
|       </div>
 | |
|   </div>
 | |
| 
 | |
|   <div id="addModal" class="modal">
 | |
|     <div class="modal-content">
 | |
|       <div class="container">
 | |
|         <h1 class="deviceHeader">Add Device</h1>
 | |
|         <form id="editForm">
 | |
|               <div class="form-container">
 | |
|                   <label for="referenceId"><b>Device Id</b></label>
 | |
|                   <input type="text" placeholder="Enter the device Id" id="referenceId" required>  
 | |
|                   <div id="form-error"></div>
 | |
|               </div>
 | |
|               <div class="clearfix">
 | |
|                 <button type="button" class="cancelbtn">Cancel</button>
 | |
|                 <button type="button" id="addbtn">Add</button>
 | |
|               </div>
 | |
| 
 | |
|               <div id="form-error"></div>
 | |
|           </form>
 | |
|       </div>
 | |
|     </div>
 | |
| </div>
 | |
|   </body>
 | |
| </html>
 |