diff --git a/frontend/src/layout/AppTopbar.vue b/frontend/src/layout/AppTopbar.vue index 61d22ec..154c613 100644 --- a/frontend/src/layout/AppTopbar.vue +++ b/frontend/src/layout/AppTopbar.vue @@ -76,7 +76,12 @@ async function savePassword(pass) { } catch (error) { - console.error(error); + if (error.response.status === 400) { + toast.add({ severity: 'error', summary: 'Error', detail: 'Current password is incorrect', life: 3000 }); + } + else { + console.log(error); + } } } @@ -139,8 +144,8 @@ const isOutsideClicked = (event) => { - +
@@ -171,6 +176,4 @@ const isOutsideClicked = (event) => {
- + diff --git a/frontend/src/utils/Auth.js b/frontend/src/utils/Auth.js index 6cb4483..dd0e7cd 100644 --- a/frontend/src/utils/Auth.js +++ b/frontend/src/utils/Auth.js @@ -40,7 +40,8 @@ var auth = { if (callback !== null) { callback(false); } - router.replace("/"); + localStorage.removeItem("token"); + router.replace("/login"); } else { if (callback !== null) { diff --git a/frontend/src/views/Chart.vue b/frontend/src/views/Chart.vue index 9f1a86a..90bb26a 100644 --- a/frontend/src/views/Chart.vue +++ b/frontend/src/views/Chart.vue @@ -2,11 +2,9 @@ import { ref, watch, onMounted } from 'vue'; import { useLayout } from '@/layout/composables/layout'; import auth from '../utils/Auth'; -import { useToast } from 'primevue/usetoast'; import axios from 'axios'; const { layoutConfig } = useLayout(); -const toast = useToast(); let documentStyle = getComputedStyle(document.documentElement); let textColor = documentStyle.getPropertyValue('--text-color'); let textColorSecondary = documentStyle.getPropertyValue('--text-color-secondary'); @@ -14,7 +12,8 @@ let surfaceBorder = documentStyle.getPropertyValue('--surface-border'); const time_elapsed = ref([]); const coins = ref([]); const games = ref([]); -const selectedGames = ref(); +const ms = ref(true); +const selectedGame = ref(); const lineData = ref(null); const lineOptions = ref(null); @@ -26,10 +25,6 @@ const setColorOptions = () => { surfaceBorder = documentStyle.getPropertyValue('--surface-border'); }; -const probando = () => { - console.log(selectedGames.value) -} - async function getGames() { try { const response = await axios.get(`http://localhost:3001/game?limit=5000`); @@ -42,14 +37,20 @@ async function getGames() { } } -async function setChart() { +async function getFrames() { try { - if (selectedGames.value === undefined) { + if (selectedGame.value === undefined) { return; } - const response = await axios.get(`http://localhost:3001/frame?limit=5000&game_id=` + selectedGames.value); + const response = await axios.get(`http://localhost:3001/frame?limit=5000&game_id=` + selectedGame.value); + if (response.data[response.data.length - 1].elapsed_time >= 10000) { + ms.value = false; + } + else { + ms.value = true; + } time_elapsed.value = response.data.map(frame => { - return Math.floor(frame.elapsed_time / 1000); + return (ms.value == true) ? (Math.round(frame.elapsed_time * 10) / 10).toFixed(1) : (Math.floor(frame.elapsed_time / 1000 * 10) / 10).toFixed(1); }); coins.value = response.data.map(frame => { return frame.coins; @@ -59,13 +60,20 @@ async function setChart() { console.error(error); } + lineData.value.labels = time_elapsed.value; + lineData.value.datasets[0].label = 'Game ' + selectedGame.value; + lineData.value.datasets[0].data = coins.value; - ///////////////////////////////// + lineOptions.value.scales.x.title.text = (ms.value) ? "Time(ms)" : "Time(s)"; + +} + +async function setChart() { lineData.value = { labels: time_elapsed.value, datasets: [ { - label: 'Game 4', + label: 'Game ' + selectedGame.value, data: coins.value, fill: false, backgroundColor: documentStyle.getPropertyValue('--primary-500'), @@ -76,6 +84,7 @@ async function setChart() { }; lineOptions.value = { + reponsive: true, plugins: { legend: { labels: { @@ -84,11 +93,10 @@ async function setChart() { } }, scales: { - x: { title: { display: true, - text: "Time(s)" + text: (ms.value) ? "Time(ms)" : "Time(s)" }, ticks: { color: textColorSecondary @@ -118,14 +126,13 @@ watch( layoutConfig.theme, () => { setColorOptions(); - //setChart(); }, { immediate: true } ); onMounted(() => { - checkAuth(); setChart(); + checkAuth(); getGames(); }) @@ -139,8 +146,8 @@ const checkAuth = () => {
- + +
@@ -148,11 +155,15 @@ const checkAuth = () => {
-
-
Linear Chart
- -
+
- \ No newline at end of file + + + \ No newline at end of file