diff options
Diffstat (limited to 'fe/src/lib/DataView.svelte')
-rw-r--r-- | fe/src/lib/DataView.svelte | 67 |
1 files changed, 67 insertions, 0 deletions
diff --git a/fe/src/lib/DataView.svelte b/fe/src/lib/DataView.svelte new file mode 100644 index 0000000..cd7b042 --- /dev/null +++ b/fe/src/lib/DataView.svelte | |||
@@ -0,0 +1,67 @@ | |||
1 | <script lang='ts'> | ||
2 | import { onMount } from 'svelte'; | ||
3 | import { token } from '../stores/auth' | ||
4 | import Table from './Table.svelte'; | ||
5 | |||
6 | let json; | ||
7 | let showAddForm: boolean = false; | ||
8 | |||
9 | async function fetchData() { | ||
10 | const res = await fetch('http://localhost:8080/api/v1/stats/', { | ||
11 | method: "GET", | ||
12 | headers: { | ||
13 | 'Authorization': `Bearer ${$token}` | ||
14 | } | ||
15 | }); | ||
16 | if (res.ok) { | ||
17 | json = res.json(); | ||
18 | } else { | ||
19 | throw new Error('There was a problem with your request'); | ||
20 | } | ||
21 | } | ||
22 | |||
23 | async function submitStat() { | ||
24 | const response = await fetch('http://localhost:8080/api/v1/stats/', { | ||
25 | method: "POST", | ||
26 | headers: { | ||
27 | 'Authorization': `Bearer ${$token}` | ||
28 | }, | ||
29 | body: JSON.stringify({ | ||
30 | date: new Date, | ||
31 | user_id: 1, | ||
32 | quantity: 3 | ||
33 | }) | ||
34 | }); | ||
35 | fetchData(); | ||
36 | } | ||
37 | |||
38 | function handleClick() { | ||
39 | showAddForm = true; | ||
40 | } | ||
41 | |||
42 | function handleAddDialogSubmit (e) { | ||
43 | console.log(e.keyCode) | ||
44 | } | ||
45 | |||
46 | onMount(() => { | ||
47 | fetchData(); | ||
48 | }); | ||
49 | |||
50 | </script> | ||
51 | <div> | ||
52 | <button on:click={submitStat}>Add Stat Test</button> | ||
53 | <dialog open={showAddForm} on:submit={handleAddDialogSubmit}> | ||
54 | <form method="dialog"> | ||
55 | <input name="date" type="date" /> | ||
56 | <input name="quantity" type="number" min="0" autocomplete="off"/> | ||
57 | <button type="submit">Submit</button> | ||
58 | </form> | ||
59 | </dialog> | ||
60 | <button on:click={handleClick}>Add</button> | ||
61 | {#await json then data} | ||
62 | <Table {data} nofooter /> | ||
63 | {:catch error} | ||
64 | <p>{error}</p> | ||
65 | {/await} | ||
66 | <!-- <Chart /> --> | ||
67 | </div> | ||