diff --git a/static/js/PadForm.js b/static/js/PadForm.js index 2414e08..fd23647 100644 --- a/static/js/PadForm.js +++ b/static/js/PadForm.js @@ -1,3 +1,5 @@ +import { PadStore } from "./PadStore.js"; + export default { setup() { const { ref, computed } = Vue; @@ -25,16 +27,21 @@ export default { link.value = newPad(); } + const pad = { + title: title.value.trim(), + link: link.value, + overview: overview.value, + categories: categories.value, + date: date.value, + }; + PadStore.value.unshift(pad); + + pad.categories.join(", "); + fetch("api", { method: "POST", headers: { "Content-Type": "application/json" }, - body: JSON.stringify({ - title: title.value.trim(), - link: link.value, - overview: overview.value, - categories: categories.value.join(", "), - date: date.value, - }), + body: JSON.stringify(pad), }); sent.value = true; @@ -45,7 +52,18 @@ export default { date.value = null; }; - return { title, link, overview, categories, date, submit, newPad, sent, disabled }; + return { + title, + link, + overview, + categories, + date, + submit, + newPad, + sent, + disabled, + PadStore, + }; }, template: ` @@ -61,6 +79,7 @@ export default { + diff --git a/static/js/PadStore.js b/static/js/PadStore.js new file mode 100644 index 0000000..7327dfe --- /dev/null +++ b/static/js/PadStore.js @@ -0,0 +1,3 @@ +const { ref } = Vue; + +export const PadStore = ref([]); diff --git a/static/js/PadTable.js b/static/js/PadTable.js index 481b95a..cc80a22 100644 --- a/static/js/PadTable.js +++ b/static/js/PadTable.js @@ -1,3 +1,5 @@ +import { PadStore } from "./PadStore.js"; + export default { setup() { const { ref, computed } = Vue; @@ -61,13 +63,17 @@ export default { }; const filteredPads = computed(() => { - if (selected.value.size == 0) return pads.value; + if (selected.value.size == 0) return storedPads.value; else - return pads.value.filter((pad) => { + return storedPads.value.filter((pad) => { return pad.categories.some((category) => selected.value.has(category)); }); }); + const storedPads = computed(() => { + return [...PadStore.value, ...pads.value]; + }); + const formatDate = function (date) { return `${String(date.getDate()).padStart(2, "0")}-${String( date.getMonth() + 1 @@ -88,6 +94,8 @@ export default { toggle, sort, formatDate, + PadStore, + storedPads, }; }, template: ` @@ -112,6 +120,7 @@ export default {

+