Add admin page

2020-12-19 19:24:35 +05:30
parent e055e70778
commit 46fc7a7a63
2 changed files with 74 additions and 3 deletions
--- a/templates/admin.html
+++ b/templates/admin.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Mock Car API Admin</title>
+	<style type="text/css" media="screen">
+body {
+	margin: 5em;
+}
+h1 {
+	text-align: center;
+}
+
+table {
+	width: 100%;
+	text-align: center;
+	margin-top: 1em;
+}
+
+table, tr, td {
+	border: black 1px solid;
+	border-collapse: collapse;
+}
+
+.change {
+	width: 100%;
+	display: flex;
+	justify-content: space-evenly;
+}
+
+	</style>
+</head>
+<body>
+	<h1>Mock Data API</h1>
+	<div class="change">
+		<input type="text" name="key" id="key" placeholder="Key">
+		<input type="text" name="value" id="value" placeholder="Valid JSON values">
+		<button type="submit" id="#submit" onclick="updateData()">Change / Add</button>
+	</div>
+	<table>
+		<tr>
+			<td>Key</td>
+			<td>Value</td>
+		</tr>
+		{% for key, value in data.items() %}
+			<tr>
+				<td>{{ key }}</td>
+				<td>{{ value }}</td>
+			</tr>
+		{% endfor %}
+	</table>
+	<script charset="utf-8">
+function updateData() {
+	const key = document.querySelector("#key").value;
+	const value = document.querySelector("#value").value;
+	fetch(`/data/${key}`, {
+		method: "POST",
+		headers: {
+			'Content-Type': 'application/json'
+		},
+		body: JSON.stringify({value: JSON.parse(value)})
+	}).then(() => window.location.reload(true));
+}
+	</script>
+</body>
+</html>