1 files changed, 67 insertions, 0 deletions
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..c4b616b
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,67 @@
+import './style.css'
+
+function edit(e: PointerEvent) {
+  e.preventDefault();
+  const tar = e.target as HTMLInputElement;
+  const form = tar.parentNode as HTMLFormElement
+  form.onseeked
+  const id = tar.dataset.id;
+  const tds = document.querySelectorAll(`[data-id="${id}"]`) as NodeListOf<HTMLElement>
+  const names = ["name", "thumbnail", "author", "magazine",]
+  tds.forEach((el, i) => {
+    if (el.tagName === "TD") {
+      const v = el.innerHTML;
+      el.innerHTML = `<input name="${names[i]}" value="${v}">`
+    } else if (el === tar) {
+      el.style.display = "none"
+    } else {
+      const iel = (el as HTMLInputElement)
+      if (iel.type !== "hidden") {
+        iel.value = "Save"
+        el.onclick = e => save(e, tds);
+      }
+    }
+  })
+}
+//@ts-expect-error
+window.edit = edit;
+
+async function save(e: MouseEvent, tds: NodeListOf<HTMLElement>) {
+  console.log(tds)
+  const tar = e.target as HTMLInputElement
+  const body = new FormData();
+  e.preventDefault();
+  let i = 0;
+  tds.forEach((el) => {
+    if (el.tagName === "TD") {
+      const v = (el.firstChild as HTMLInputElement).value;
+      el.innerHTML = v
+      switch (i) {
+        case 0: body.append("name", v); break;
+        case 1: body.append("thumbnail", v); break;
+        case 2: body.append("author", v); break;
+        case 3: body.append("magazine", v); break;
+      }
+      i++;
+    } else if (el === tar) {
+      const iel = (el as HTMLInputElement)
+      iel.value = "Remove"
+      iel.onclick = null;
+    } else {
+      const iel = (el as HTMLInputElement)
+      if (iel.type === "hidden") {
+        body.append(iel.name, iel.value);
+      } else {
+        iel.style.display = ""
+      }
+    }
+  })
+  await fetch("api/add.php", {
+    method: "POST",
+    headers: {
+      "Content-Type": "multipart/form-data",
+    },
+    body
+  });
+}
+