aboutsummaryrefslogtreecommitdiff
path: root/fe
diff options
context:
space:
mode:
authorZach Berwaldt <zberwaldt@tutamail.com>2024-03-06 21:53:07 -0500
committerZach Berwaldt <zberwaldt@tutamail.com>2024-03-06 21:53:07 -0500
commit5fa57845052655883120ba4d19a85d8756fb8d8c (patch)
treed2d5ad1dd3fd8d9acaca9ced09612b50218f06b0 /fe
parentcf2113e77edabf8e3a632c7b76c769752039ba88 (diff)
[FEAT] Refactor API main file and models
This commit refactors the `main.go` file in the API directory, as well as the related models in the `models.go` file. The changes include: - Reordering imports and removing unnecessary imports - Fixing error messages to be more descriptive - Handling database connections more efficiently with deferred closures - Handling errors and returning appropriate error responses - Adding proper JSON bindings for POST requests - Adding new views in the database scripts for aggregated statistics and daily user statistics No changes were made to imports and requires.
Diffstat (limited to 'fe')
-rw-r--r--fe/src/lib/DataView.svelte130
-rw-r--r--fe/src/lib/forms/AddForm.svelte13
2 files changed, 77 insertions, 66 deletions
diff --git a/fe/src/lib/DataView.svelte b/fe/src/lib/DataView.svelte
index 2b1b8b9..7d62a43 100644
--- a/fe/src/lib/DataView.svelte
+++ b/fe/src/lib/DataView.svelte
@@ -9,8 +9,6 @@
9 import AddForm from "./forms/AddForm.svelte"; 9 import AddForm from "./forms/AddForm.svelte";
10 10
11 let json: Promise<any>; 11 let json: Promise<any>;
12 let totals: Promise<any>;
13 let userStats: Promise<any>;
14 12
15 let barCanvasRef: HTMLCanvasElement; 13 let barCanvasRef: HTMLCanvasElement;
16 let lineCanvasRef: HTMLCanvasElement; 14 let lineCanvasRef: HTMLCanvasElement;
@@ -18,6 +16,10 @@
18 let lineChart: any; 16 let lineChart: any;
19 17
20 let lastSevenDays: string[]; 18 let lastSevenDays: string[];
19 let lastSevenDaysData: number[];
20
21 let userTotalsLabels: string[];
22 let userTotalsData: number[];
21 23
22 async function fetchData() { 24 async function fetchData() {
23 const res = await fetch("http://localhost:8080/api/v1/stats/", { 25 const res = await fetch("http://localhost:8080/api/v1/stats/", {
@@ -33,24 +35,27 @@
33 } 35 }
34 } 36 }
35 37
36 async function fetchTotals() { 38 async function fetchDailyUserStatistics() {
37 const res = await fetch("http://localhost:8080/api/v1/stats/totals/", { 39 const res = await fetch("http://localhost:8080/api/v1/stats/totals/", {
38 method: 'GET', 40 method: "GET",
39 mode: 'no-cors',
40 headers: { 41 headers: {
41 Authorization: `Bearer ${$token}` 42 Authorization: `Bearer ${$token}`
42 } 43 }
43 }); 44 });
44 45
45 if (res.ok) { 46 if (res.ok) {
46 totals = res.json(); 47 const json = await res.json();
48 let labels = json.map(d => d.name);
49 let data = json.map(d => d.total);
50 return [labels, data];
47 } else { 51 } else {
48 throw new Error("There was a problem with your request"); 52 throw new Error("There was a problem with your request");
49 } 53 }
54
50 } 55 }
51 56
52 async function fetchStatsForUser() { 57 async function fetchWeeklyTotals() {
53 const res = await fetch("http://localhost:8080/api/v1/stats/user/1aa668f3-7527-4a67-9c24-fdf307542eeb", { 58 const res = await fetch("http://localhost:8080/api/v1/stats/weekly/", {
54 method: "GET", 59 method: "GET",
55 headers: { 60 headers: {
56 Authorization: `Bearer ${$token}` 61 Authorization: `Bearer ${$token}`
@@ -58,22 +63,15 @@
58 }); 63 });
59 64
60 if (res.ok) { 65 if (res.ok) {
61 userStats = res.json(); 66 const json = await res.json();
67 let labels = json.map(d => d.date);
68 let data = json.map(d => d.total);
69 return [labels, data];
62 } else { 70 } else {
63 throw new Error("There was a problem with your request"); 71 throw new Error("There was a problem with your request");
64 } 72 }
65 } 73 }
66 74
67 function getLastSevenDays() {
68 const result = [];
69 for (let i = 0; i < 7; i++) {
70 let d = new Date();
71 d.setDate(d.getDate() - i);
72 result.push(d.toISOString().substring(0, 10));
73 }
74 return result;
75 }
76
77 function closeDialog() { 75 function closeDialog() {
78 addFormOpen.set(false); 76 addFormOpen.set(false);
79 } 77 }
@@ -81,61 +79,79 @@
81 function onStatisticAdd() { 79 function onStatisticAdd() {
82 closeDialog(); 80 closeDialog();
83 fetchData(); 81 fetchData();
82 fetchWeeklyTotals().then(updateWeeklyTotalsChart).catch(err => console.error(err));
83 fetchDailyUserStatistics().then(updateDailyUserTotalsChart).catch(err => console.error(err));
84 } 84 }
85 85
86 onMount(() => { 86 function setupWeeklyTotalsChart(result) {
87 fetchData(); 87 [lastSevenDays, lastSevenDaysData] = result;
88// fetchTotals(); 88 lineChart = new Chart(lineCanvasRef, {
89 fetchStatsForUser(); 89 type: "line",
90 lastSevenDays = getLastSevenDays();
91 barChart = new Chart(barCanvasRef, {
92 type: "bar",
93 data: { 90 data: {
94 labels: lastSevenDays, 91 labels: lastSevenDays,
95 datasets: [ 92 datasets: [
96 { 93 {
97 label: "Zach", 94 label: "Totals",
98 data: [1, 2, 8, 2, 5, 5, 1], 95 data: lastSevenDaysData,
99 backgroundColor: "rgba(255, 192, 192, 0.2)", 96 backgroundColor: "rgba(255, 192, 192, 0.2)"
100 borderColor: "rgba(75, 192, 192, 1)",
101 borderWidth: 1
102 }, {
103 label: "Parker",
104 data: [6, 1, 1, 4, 3, 5, 1],
105 backgroundColor: "rgba(75, 192, 192, 0.2)",
106 borderColor: "rgba(75, 192, 192, 1)",
107 borderWidth: 1
108 } 97 }
109 ] 98 ]
110 }, 99 },
111 options: { 100 options: {
112 responsive: true 101 responsive: true,
102 plugins: {
103 legend: {
104 display: false
105 }
106 }
113 } 107 }
114 }); 108 });
115 lineChart = new Chart(lineCanvasRef, { 109 }
116 type: "line", 110
111 function setupDailyUserTotalsChart(result) {
112 [userTotalsLabels, userTotalsData] = result;
113
114 barChart = new Chart(barCanvasRef, {
115 type: "bar",
117 data: { 116 data: {
118 labels: lastSevenDays, 117 labels: userTotalsLabels,
119 datasets: [ 118 datasets: [
120 { 119 {
121 label: "Zach", 120 data: userTotalsData,
122 data: [1, 2, 8, 2, 5, 5, 1], 121 backgroundColor: [
123 backgroundColor: "rgba(255, 192, 192, 0.2)", 122 "#330000",
124 borderColor: "rgba(75, 192, 192, 1)", 123 "rgba(100, 200, 192, 0.2)"
125 borderWidth: 1 124 ]
126 }, {
127 label: "Parker",
128 data: [6, 1, 1, 4, 3, 5, 1],
129 backgroundColor: "rgba(75, 192, 192, 0.2)",
130 borderColor: "rgba(75, 192, 192, 1)",
131 borderWidth: 1
132 } 125 }
133 ] 126 ]
134 }, 127 },
135 options: { 128 options: {
136 responsive: true 129 responsive: true,
130 plugins: {
131 legend: {
132 display: false
133 }
134 }
137 } 135 }
138 }); 136 });
137 }
138
139 function updateWeeklyTotalsChart(result) {
140 [,lastSevenDaysData] = result;
141 lineChart.data.datasets[0].data = lastSevenDaysData;
142 lineChart.update();
143 }
144
145 function updateDailyUserTotalsChart(result) {
146 [,userTotalsData] = result;
147 barChart.data.datasets[0].data = userTotalsData;
148 barChart.update();
149 }
150
151 onMount(() => {
152 fetchData();
153 fetchWeeklyTotals().then(setupWeeklyTotalsChart);
154 fetchDailyUserStatistics().then(setupDailyUserTotalsChart);
139 }); 155 });
140 156
141 onDestroy(() => { 157 onDestroy(() => {
@@ -164,14 +180,6 @@
164 <p>{error}</p> 180 <p>{error}</p>
165 {/await} 181 {/await}
166 </Card> 182 </Card>
167 <Card>
168 <button on:click={() => fetchTotals()}>Get totals</button>
169 {#await totals then data}
170 {JSON.stringify(data)}
171 {:catch error}
172 <p>{error}</p>
173 {/await}
174 </Card>
175</Column> 183</Column>
176<!-- <Chart /> --> 184<!-- <Chart /> -->
177 185
diff --git a/fe/src/lib/forms/AddForm.svelte b/fe/src/lib/forms/AddForm.svelte
index f22e5f4..4520b1b 100644
--- a/fe/src/lib/forms/AddForm.svelte
+++ b/fe/src/lib/forms/AddForm.svelte
@@ -34,20 +34,23 @@
34 dispatch("close"); 34 dispatch("close");
35 } 35 }
36 36
37 async function handleSubmitStat() { 37 async function handleSubmitStat()
38 const response = await fetch("http://localhost:8080/api/v1/stats/", { 38 {
39 const { date, quantity } = statistic;
40 await fetch("http://localhost:8080/api/v1/stats/", {
39 method: "POST", 41 method: "POST",
40 headers: { 42 headers: {
41 Authorization: `Bearer ${$token}` 43 Authorization: `Bearer ${$token}`
42 }, 44 },
43 body: JSON.stringify({ 45 body: JSON.stringify({
44 date: new Date(), 46 date: new Date(date),
45 user_id: 1, 47 user_id: 2,
46 quantity: 3 48 quantity
47 }) 49 })
48 }); 50 });
49 dispatch("submit"); 51 dispatch("submit");
50 } 52 }
53
51</script> 54</script>
52 55
53<dialog {open} on:submit={handleSubmitStat}> 56<dialog {open} on:submit={handleSubmitStat}>