Skip to content
Snippets Groups Projects
Commit 88e6dbf2 authored by VIktorGrev's avatar VIktorGrev
Browse files

fix: views fixed

parent db86e85c
Branches
No related tags found
1 merge request!44Fix/pipeline
Show whitespace changes
Inline Side-by-side
Showing
with 68 additions and 77 deletions
package-lock.json
+ 7
− 0
View file @ 88e6dbf2
......@@ -25,6 +25,7 @@
"@testing-library/user-event": "^14.5.2",
"@testing-library/vue": "^8.0.3",
"@tsconfig/node20": "^20.1.4",
"@types/js-cookie": "^3.0.6",
"@types/jsdom": "^21.1.6",
"@types/node": "^20.12.5",
"@vitejs/plugin-vue": "^5.0.4",
......@@ -1844,6 +1845,12 @@
"integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
"dev": true
},
"node_modules/@types/js-cookie": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-3.0.6.tgz",
"integrity": "sha512-wkw9yd1kEXOPnvEeEV1Go1MmxtBJL0RR79aOTAApecWFVu7w0NNXNqhcWgvw2YgZDYadliXkl14pa3WXw5jlCQ==",
"dev": true
},
"node_modules/@types/jsdom": {
"version": "21.1.6",
"resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-21.1.6.tgz",
......
......
package.json
+ 1
− 0
View file @ 88e6dbf2
......@@ -33,6 +33,7 @@
"@testing-library/user-event": "^14.5.2",
"@testing-library/vue": "^8.0.3",
"@tsconfig/node20": "^20.1.4",
"@types/js-cookie": "^3.0.6",
"@types/jsdom": "^21.1.6",
"@types/node": "^20.12.5",
"@vitejs/plugin-vue": "^5.0.4",
......
......
src/components/Buttons/Button1.vue
+ 1
− 3
View file @ 88e6dbf2
......@@ -3,9 +3,7 @@
</template>
<script setup lang="ts">
export default {
props: ['buttonText']
}
defineProps<{ buttonText: string }>();
</script>
<style scoped>
......
......
src/components/Buttons/ShopButton.vue
+ 1
− 3
View file @ 88e6dbf2
......@@ -3,9 +3,7 @@
</template>
<script setup lang="ts">
export default {
props: ['buttonText']
}
defineProps<{ buttonText: string }>();
</script>
<style scoped>
......
......
src/components/Configuration/ConfigurationSteps/SuitableChallenges.vue
+ 1
− 1
View file @ 88e6dbf2
......@@ -28,7 +28,7 @@ const challenges = ['Make packed lunch', 'Stop shopping', 'Drop coffee',
* The first element is the challenge value, and the second element
* indicates whether the challenge is checked (true) or unchecked (false).
*/
const onChangedChallengeEvent = (value) => {
const onChangedChallengeEvent = (value: any) => {
// if challenge is checked then add it to the chosenChallenges variable
if (value[1]) {
chosenChallenges.value.push(value[0])
......
......
src/components/Exceptions/ErrorBoundaryCatcher.vue
+ 1
− 1
View file @ 88e6dbf2
<template>
<error-box :error-message="errorStore.getFirstError" @update:errorMessage="errorStore.removeCurrentError" />
<slot />
<slot></slot>
</template>
<script setup lang="ts">
......
......
src/views/BasePageView.vue
+ 2
− 2
View file @ 88e6dbf2
......@@ -8,13 +8,13 @@ import Menu from '@/components/BaseComponents/Menu.vue'
<Menu></Menu>
<div style="display: flex; flex-direction: row;">
<img v-for="item in 7" src="@/assets/coca.webp" style="width: 100%; height: 100px; margin: 5px; border-radius: 1rem;">
<img v-for="item in 7" src="@/assets/coca.webp" style="width: 100%; height: 100px; margin: 5px; border-radius: 1rem;" alt="picture">
</div>
<div>
<RouterView />
</div>
<div style="display: flex; flex-direction: row;">
<img v-for="item in 7" src="@/assets/coca.webp" style="width: 100%; height: 100px; margin: 5px; border-radius: 1rem;">
<img v-for="item in 7" src="@/assets/coca.webp" style="width: 100%; height: 100px; margin: 5px; border-radius: 1rem;" alt="picture">
</div>
<Footer></Footer>
</template>
\ No newline at end of file
src/views/BudgetOverview.vue
+ 12
− 9
View file @ 88e6dbf2
<script setup lang="ts">
import Button1 from '@/components/Buttons/Button1.vue'
import BudgetBox from '@/components/Budget/BudgetBox.vue'
const budget = 1000;
const expenses = 95600;
</script>
<template>
......@@ -19,15 +22,15 @@ import BudgetBox from '@/components/Budget/BudgetBox.vue'
<!--TODO make this more generic-->
<ul class="budgetContainer">
<li><budget-box title="April 2024" budget="1000" expenses="908700"></budget-box></li>
<li><budget-box title="Mai 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="Juni 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="Juli 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="August 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="September 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="Oktober 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="November 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="Desember 2024" budget="1000" expenses="87"></budget-box></li>
<li><budget-box title="April 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="Mai 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="Juni 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="Juli 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="August 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="September 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="Oktober 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="November 2024" :budget=budget :expenses=expenses></budget-box></li>
<li><budget-box title="Desember 2024" :budget=budget :expenses=expenses></budget-box></li>
</ul>
<nav id="navbar" aria-label="Page navigation example">
......
......
src/views/BudgetView.vue
+ 5
− 5
View file @ 88e6dbf2
......@@ -153,7 +153,7 @@ const onDeleteBudgetPressed = () => {
<button class="btn btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<button id="importButton" class="btn btn-primary"><img src="../assets/icons/import.svg" height="20" width="20">Import budget</button>
<button id="importButton" class="btn btn-primary"><img src="../assets/icons/import.svg" height="20" width="20" alt="picture">Import budget</button>
<button id="editBudget" class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#editBudgetCollapse" aria-expanded="false" aria-controls="editBudgetCollapse"><img src="../assets/icons/edit-button.svg" alt="editButton">Rename budget</button>
<div class="collapse" id="editBudgetCollapse">
<div class="container collapse-container">
......@@ -165,7 +165,7 @@ const onDeleteBudgetPressed = () => {
</form>
</div>
</div>
<button id="deleteButton" class="btn btn-primary" data-bs-toggle="modal" @click="onDeleteBudgetPressed"><img src="../assets/icons/trash-can.svg" height="20" width="20">Delete budget</button>
<button id="deleteButton" class="btn btn-primary" data-bs-toggle="modal" @click="onDeleteBudgetPressed"><img src="../assets/icons/trash-can.svg" height="20" width="20" alt="picture">Delete budget</button>
</div>
</div>
</div>
......@@ -173,7 +173,7 @@ const onDeleteBudgetPressed = () => {
<div class="budget-info-container">
<div class="info budget-container">
<i><img src="../assets/icons/money2.svg" width="48px" height="48px"></i>
<i><img src="../assets/icons/money2.svg" width="48px" height="48px" alt="picture"></i>
<div class="budget-text-container">
<h5>{{budget}} kr</h5>
<p>Budget</p>
......@@ -181,7 +181,7 @@ const onDeleteBudgetPressed = () => {
</div>
<div class="info expenses-container">
<i><img src="../assets/icons/credit-card.svg" width="48px" height="48px"></i>
<i><img src="../assets/icons/credit-card.svg" width="48px" height="48px" alt="picture"></i>
<div class="expenses-text-container">
<h5>{{expenses}} kr</h5>
<p>Expenses</p>
......@@ -189,7 +189,7 @@ const onDeleteBudgetPressed = () => {
</div>
<div class="info balance-container">
<i ref="iRef"><img src="../assets/icons/scale.svg" width="48px" height="48px"></i>
<i ref="iRef"><img src="../assets/icons/scale.svg" width="48px" height="48px" alt="picture"></i>
<div class="balance-text-container">
<h5>{{balance}} kr</h5>
<p>Balance</p>
......
......
src/views/ConfigurationView.vue
+ 0
− 2
View file @ 88e6dbf2
<script setup lang="ts">
import Configuration from '@/components/Configuration/Configuration.vue'
import Menu from '@/components/BaseComponents/Menu.vue'
import Footer from '@/components/BaseComponents/Footer.vue'
</script>
<template>
......
......
src/views/LeaderboardView.vue
+ 9
− 17
View file @ 88e6dbf2
......@@ -9,40 +9,38 @@
<div class="btn-group-vertical" id="radioContainer" role="group"
aria-label="Vertical radio toggle button group">
<input type="radio" class="btn-check" name="vbtn-radio" id="vbtn-radio1" autocomplete="off" checked>
<label class="btn btn-outline-primary" for="vbtn-radio1" @click="global"><img src="@/assets/globe.png" style="width: 60px"> Global</label>
<label class="btn btn-outline-primary" for="vbtn-radio1" @click="global"><img src="@/assets/globe.png" style="width: 60px" alt="globe"> Global</label>
<input type="radio" class="btn-check" name="vbtn-radio" id="vbtn-radio2" autocomplete="off">
<label class="btn btn-outline-primary" for="vbtn-radio2" @click="friends"><img src="@/assets/friends.png" style="width: 60px"> Friends</label>
<label class="btn btn-outline-primary" for="vbtn-radio2" @click="friends"><img src="@/assets/friends.png" style="width: 60px" alt="friends"> Friends</label>
</div>
</div>
</div>
<main>
<div id="leaderboard">
<h1><img src="@/assets/items/pigcoin.png" style="width: 2rem"> Total points</h1>
<h1><img src="@/assets/items/pigcoin.png" style="width: 2rem" alt="pig coin"> Total points</h1>
<Leaderboard :leaderboard="pointsLeaderboardData" :leaderboardExtra="pointsLeaderboardDataExtra" @navigateToUserProfile="navigateToUserProfile" />
</div>
<div id="leaderboard">
<h1><img src="@/assets/icons/fire.png" style="width: 2rem"> Current streak</h1>
<h1><img src="@/assets/icons/fire.png" style="width: 2rem" alt="fire"> Current streak</h1>
<Leaderboard :leaderboard="currentLeaderboardData" :leaderboardExtra="currentLeaderboardDataExtra" @navigateToUserProfile="navigateToUserProfile" />
</div>
<div id="leaderboard">
<h1><img src="@/assets/icons/fire.png" style="width: 2rem"> Highest streak</h1>
<h1><img src="@/assets/icons/fire.png" style="width: 2rem" alt="fire"> Highest streak</h1>
<Leaderboard :leaderboard="streakLeaderboardData" :leaderboardExtra="streakLeaderboardDataExtra" @navigateToUserProfile="navigateToUserProfile" />
</div>
</main>
</div>
<div id="communityContainer">
<h1>Total points earned as a community</h1>
<h2>1000000 <img src="@/assets/items/v-buck.png" style="width: 2rem"></h2>
<h2>1000000 <img src="@/assets/items/v-buck.png" style="width: 2rem" alt="alt"></h2>
</div>
</template>
<script setup lang="ts">
import { onMounted, ref, type PropType } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import Leaderboard from '@/components/LeaderboardComponents/Leaderboard.vue';
import { on } from 'events';
import { LeaderboardService } from '@/api';
import type { LeaderboardEntryDTO } from '@/api/models/LeaderboardEntryDTO';
let streakLeaderboardData = ref([] as any);
let currentLeaderboardData = ref([] as any);
......@@ -55,7 +53,7 @@ let pointsLeaderboardDataExtra = ref([] as any);
const router = useRouter();
async function fetchQuizData() {
global();
await global();
}
onMounted(() => {
......@@ -202,10 +200,4 @@ h1 {
margin-bottom: 5rem;
}
.leaderBoardButton {
padding: 1rem 4rem;
font-weight: 700;
border-radius: 2rem;
margin: 1rem;
}
</style>
\ No newline at end of file
src/views/Settings/SettingsAccountView.vue
+ 8
− 0
View file @ 88e6dbf2
......@@ -11,6 +11,14 @@ const confirmPasswordRef = ref('')
const formRef = ref()
let samePasswords = ref(true)
const handleFirstNameInputEvent = (newValue: any) => {
firstNameRef.value = newValue
}
const handleEmailInputEvent = (newValue: any) => {
emailRef.value = newValue
}
</script>
<template>
......
......
src/views/Settings/SettingsProfileView.vue
+ 9
− 0
View file @ 88e6dbf2
......@@ -11,6 +11,15 @@ const confirmPasswordRef = ref('')
const formRef = ref()
let samePasswords = ref(true)
const handleFirstNameInputEvent = (newValue: any) => {
firstNameRef.value = newValue
}
const handleSurnameInputEvent = (newValue: any) => {
surnameRef.value = newValue
}
</script>
......
......
src/views/SettingsView.vue
+ 8
− 30
View file @ 88e6dbf2
......@@ -116,7 +116,7 @@ function toBilling() {
<div class="card-header border-bottom mb-3 d-flex d-md-none">
<ul class="nav nav-tabs card-header-tabs nav-gap-x-1" role="tablist">
<li class="nav-item">
<a href="#profile" data-toggle="tab" class="nav-link has-icon active"><svg
<a href="#" data-toggle="tab" class="nav-link has-icon active"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-user">
......@@ -125,7 +125,7 @@ function toBilling() {
</svg></a>
</li>
<li class="nav-item">
<a href="#account" data-toggle="tab" class="nav-link has-icon"><svg
<a href="#" data-toggle="tab" class="nav-link has-icon"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-settings">
......@@ -136,7 +136,7 @@ function toBilling() {
</svg></a>
</li>
<li class="nav-item">
<a href="#security" data-toggle="tab" class="nav-link has-icon"><svg
<a href="#" data-toggle="tab" class="nav-link has-icon"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-shield">
......@@ -144,7 +144,7 @@ function toBilling() {
</svg></a>
</li>
<li class="nav-item">
<a href="#notification" data-toggle="tab" class="nav-link has-icon"><svg
<a href="#" data-toggle="tab" class="nav-link has-icon"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-bell">
......@@ -153,7 +153,7 @@ function toBilling() {
</svg></a>
</li>
<li class="nav-item">
<a href="#billing" data-toggle="tab" class="nav-link has-icon"><svg
<a href="#" data-toggle="tab" class="nav-link has-icon"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-credit-card">
......@@ -180,10 +180,6 @@ function toBilling() {
margin-bottom: 4rem;
}
.main-body {
padding: 15px;
}
.nav-link {
color: #4a5568;
}
......@@ -215,31 +211,13 @@ function toBilling() {
margin-left: -8px;
}
.gutters-sm>.col,
.gutters-sm>[class*=col-] {
.gutters-sm>,
.gutters-sm> {
padding-right: 8px;
padding-left: 8px;
}
.mb-3,
.my-3 {
.mb-3 {
margin-bottom: 1rem !important;
}
.bg-gray-300 {
background-color: #e2e8f0;
}
.h-100 {
height: 100% !important;
}
.shadow-none {
box-shadow: none !important;
}
.routerLink {
text-decoration: none;
color: #4a5568;
}
</style>
\ No newline at end of file
src/views/UnauthorizedView.vue
+ 1
− 2
View file @ 88e6dbf2
......@@ -3,7 +3,7 @@
<div class="container py-5">
<div class="row">
<div class="col-md-2 text-center">
<p><img src="@/assets/icons/danger.svg"> <br/>Status Code: 403</p>
<p><img src="@/assets/icons/danger.svg" alt="danger"> <br/>Status Code: 403</p>
</div>
<div class="col-md-10">
<h3>OPPSSS!!!! Sorry...</h3>
......@@ -16,7 +16,6 @@
</template>
<script setup lang="ts">
import { defineComponent } from 'vue';
import { useRouter } from 'vue-router';
import Button1 from '@/components/Buttons/Button1.vue';
......
......
src/views/User/UserFriendsView.vue
+ 2
− 2
View file @ 88e6dbf2
......@@ -360,11 +360,11 @@ function addFriend() {
}
// Define the navigateToQuiz method
const navigateToFriend = (friendID :string) => {
const navigateToFriend = (friendID :number) => {
router.push('/profile/' + friendID)
};
const removeFriend = (friendID) => {
const removeFriend = (friendID: number) => {
};
......
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment