diff --git a/src/components/BaseComponents/NavBar.vue b/src/components/BaseComponents/NavBar.vue index 56bef37c1e9db83f78f09316b7de6ed2324523e4..f12e691777c15a59e01ec4b1eec9d3002c621556 100644 --- a/src/components/BaseComponents/NavBar.vue +++ b/src/components/BaseComponents/NavBar.vue @@ -53,9 +53,7 @@ export default { async loadProfile() { if (this.$store.state.user.token !== null) { let user = parseUserFromToken(this.$store.state.user.token); - //console.log(user); let id = user.accountId; - //console.log(id); await this.$router.push("/profile/" + id); } else { await this.$router.push("/login"); diff --git a/src/components/BaseComponents/RatingModal.vue b/src/components/BaseComponents/RatingModal.vue index 7710716f0ad69f69663b859c165a5455153cb8d7..ee6efd60754b44dedaca4ab525ed53dd3750dd40 100644 --- a/src/components/BaseComponents/RatingModal.vue +++ b/src/components/BaseComponents/RatingModal.vue @@ -1,89 +1,130 @@ <template> <!-- Main modal --> <div - v-if="visible" - class="fixed grid place-items-center bg-gray-600 bg-opacity-50 top-0 left-0 right-0 z-50 w-full overflow-x-hidden overflow-y-auto inset-0 h-full" + v-if="visible" + class="fixed grid place-items-center bg-gray-600 bg-opacity-50 top-0 left-0 right-0 z-50 w-full overflow-x-hidden overflow-y-auto inset-0 h-full" > <div class="relative w-full h-full max-w-2xl p-4 md:h-auto"> <!-- Modal content --> <div class="relative bg-white rounded-lg shadow dark:bg-gray-700"> <!-- Modal header --> - <div - class="flex p-4 border-b rounded-t dark:border-gray-600" - > + <div class="flex p-4 border-b rounded-t dark:border-gray-600"> <h3 class="text-xl font-semibold text-gray-900 dark:text-white"> {{ name }} </h3> <button - @click="close()" - class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white" + @click="close()" + class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white" > <svg - class="w-5 h-5" - fill="currentColor" - viewBox="0 0 20 20" - xmlns="http://www.w3.org/2000/svg" + class="w-5 h-5" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" > <path - fill-rule="evenodd" - d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" - clip-rule="evenodd" + fill-rule="evenodd" + d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" + clip-rule="evenodd" ></path> </svg> </button> </div> <!-- Modal body --> <div class="p-6 space-y-6"> - <p class="text-lg text-base leading-relaxed text-gray-500 dark:text-gray-400"> + <p + class="text-lg text-base leading-relaxed text-gray-500 dark:text-gray-400" + > {{ title }} </p> </div> <div class="ml-6 mt-4"> - <p class=" text-base leading-relaxed text-gray-500 dark:text-gray-400" v-show="renterIsReceiverOfRating"> + <p + class="text-base leading-relaxed text-gray-500 dark:text-gray-400" + v-show="renterIsReceiverOfRating" + > Gi en vurdering til utleieren </p> - <p class="text-base leading-relaxed text-gray-500 dark:text-gray-400" v-show="!renterIsReceiverOfRating"> + <p + class="text-base leading-relaxed text-gray-500 dark:text-gray-400" + v-show="!renterIsReceiverOfRating" + > Gi en vurdering til leietakeren </p> </div> - <div class= "flex justify-center px-4"> - <textarea class="w-full h-40 bg-gray-200 mb-4 ring-1 ring-gray-400 rounded-xl"/> + <div class="flex justify-center px-4"> + <textarea + class="w-full h-40 bg-gray-200 mb-4 ring-1 ring-gray-400 rounded-xl" + /> </div> <div class="flex items-center justify-center mb-8"> - <svg class="w-10 h-10 text-warn cursor-pointer" :class="rating[0]" @click="setRating(1)" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <svg + class="w-10 h-10 text-warn cursor-pointer" + :class="rating[0]" + @click="setRating(1)" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" + > <path - d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"> - </path> + d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" + ></path> </svg> - <svg class="w-10 h-10 text-warn cursor-pointer" :class="rating[1]" @click="setRating(2)" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <svg + class="w-10 h-10 text-warn cursor-pointer" + :class="rating[1]" + @click="setRating(2)" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" + > <path - d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"> - </path> + d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" + ></path> </svg> - <svg class="w-10 h-10 text-warn cursor-pointer" :class="rating[2]" @click="setRating(3)" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <svg + class="w-10 h-10 text-warn cursor-pointer" + :class="rating[2]" + @click="setRating(3)" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" + > <path - d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"> - </path> + d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" + ></path> </svg> - <svg class="w-10 h-10 text-warn cursor-pointer" :class="rating[3]" @click="setRating(4)" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <svg + class="w-10 h-10 text-warn cursor-pointer" + :class="rating[3]" + @click="setRating(4)" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" + > <path - d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"> - </path> + d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" + ></path> </svg> - <svg class="w-10 h-10 text-warn cursor-pointer" :class="rating[4]" @click="setRating(5)" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <svg + class="w-10 h-10 text-warn cursor-pointer" + :class="rating[4]" + @click="setRating(5)" + fill="currentColor" + viewBox="0 0 20 20" + xmlns="http://www.w3.org/2000/svg" + > <path - d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"> - </path> + d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" + ></path> </svg> </div> <div class="flex justify-center mb-4"> - <Button - :text="'Send en vurdering'" - @click="sendRating"></Button> + <Button :text="'Send en vurdering'" @click="sendRating"></Button> </div> <!-- Modal footer --> @@ -98,15 +139,21 @@ <script> import Button from "@/components/BaseComponents/ColoredButton"; -import { postNewRating} from "@/utils/apiutil"; +import { postNewRating } from "@/utils/apiutil"; export default { name: "RatingModal", - data(){ - return{ + data() { + return { score: 3, comment: "", - rating:["text-warn", "text-warn", "text-warn", "text-gray-300", "text-gray-300"], + rating: [ + "text-warn", + "text-warn", + "text-warn", + "text-gray-300", + "text-gray-300", + ], }; }, props: { @@ -115,42 +162,35 @@ export default { title: String, rentID: Number, renterIsReceiverOfRating: Boolean, - }, components: { Button, }, methods: { - setRating(ratingNumber){ + setRating(ratingNumber) { this.score = ratingNumber; - for(let i = 0; i < 5; i++ ){ - if(i < ratingNumber) { - this.rating[i] = "text-warn" - } - else { - this.rating[i] = "text-gray-300" + for (let i = 0; i < 5; i++) { + if (i < ratingNumber) { + this.rating[i] = "text-warn"; + } else { + this.rating[i] = "text-gray-300"; } } }, close() { this.$emit("close"); }, - async sendRating(){ - + async sendRating() { const ratingInfo = { score: this.score, comment: this.comment, renterIsReceiverOfRating: this.renterIsReceiverOfRating, - rentID: this.rentID - } - - const postResponse = await postNewRating(ratingInfo); - - console.log("posted: " + postResponse); + rentID: this.rentID, + }; + await postNewRating(ratingInfo); this.$router.push("/"); - }, }, }; diff --git a/src/components/ChatComponents/ChatMessage.vue b/src/components/ChatComponents/ChatMessage.vue index 3a69ca3c3237be6ec7ccae999e136a482f2b4c3f..73ded12cc8407dddc21f12614e01b2b8eac71b07 100644 --- a/src/components/ChatComponents/ChatMessage.vue +++ b/src/components/ChatComponents/ChatMessage.vue @@ -33,7 +33,6 @@ export default { }, methods: { color() { - //console.log(this.userID); return this?.message.from == this.userID ? "bg-gray-300" : "bg-primary-medium"; diff --git a/src/components/ChatComponents/ChatProfile.vue b/src/components/ChatComponents/ChatProfile.vue index 136db539f851d668d7e435b3fdd9cccabaec9768..60c544f802a2384cf9e665c986d2fc24711ab197 100644 --- a/src/components/ChatComponents/ChatProfile.vue +++ b/src/components/ChatComponents/ChatProfile.vue @@ -52,7 +52,6 @@ export default { }, methods: { selectUser() { - //console.log(this.conversation.recipient.userId); this.$emit("recipient", this.conversation.recipient.userId); }, }, diff --git a/src/components/CommunityComponents/CommunityHamburger.vue b/src/components/CommunityComponents/CommunityHamburger.vue index f9d4b41f9ca426b890e492b28c169c080954d804..391a9ab232be3ec69eefd513b060f274e7dcd1b4 100644 --- a/src/components/CommunityComponents/CommunityHamburger.vue +++ b/src/components/CommunityComponents/CommunityHamburger.vue @@ -57,8 +57,8 @@ export default { this.$router.push("/"); }, }, - mounted() { - this.admin = CommunityAdminService.isUserAdmin( + async mounted() { + this.admin = await CommunityAdminService.isUserAdmin( this.$route.params.communityID ); }, diff --git a/src/components/CommunityComponents/CommunityHeader.vue b/src/components/CommunityComponents/CommunityHeader.vue index 7fa4ed118326044995dcf63b771b46cc0ba6ea30..4df062434b011c1515a9be2f159dc8ab200db754 100644 --- a/src/components/CommunityComponents/CommunityHeader.vue +++ b/src/components/CommunityComponents/CommunityHeader.vue @@ -123,11 +123,11 @@ export default { this.community = await CommunityService.getCommunity( this.$route.params.communityID ); - let members = await CommunityService.getCommunityMembers( + const members = await CommunityService.getCommunityMembers( this.$route.params.communityID ); - for (let mem in members) { - if (mem === this.userid) { + for (let i = 0; i < members.length; i++) { + if (members[i].userId == this.userid) { this.member = true; return; } diff --git a/src/components/CommunityComponents/CommunityHome.vue b/src/components/CommunityComponents/CommunityHome.vue index c3bf82cba6a7ea5ecaf82b2a0f33a2fa7534132a..53fb6047e7def08264fdf5e66d51bed172a93dee 100644 --- a/src/components/CommunityComponents/CommunityHome.vue +++ b/src/components/CommunityComponents/CommunityHome.vue @@ -116,7 +116,7 @@ export default { title: "", pricePerDay: 0, }, - search: "", + communityID: -1, community: {}, diff --git a/src/components/CommunityComponents/CommunityRequestForm.vue b/src/components/CommunityComponents/CommunityRequestForm.vue index 51a2e418c064f125ea349ae9141ba96f4c12b025..7c5f430106fee65e8a424de790f41ec1df7c4fc5 100644 --- a/src/components/CommunityComponents/CommunityRequestForm.vue +++ b/src/components/CommunityComponents/CommunityRequestForm.vue @@ -100,9 +100,7 @@ export default { getCommunityFromAPI: async function () { this.communityID = await this.$router.currentRoute.value.params .communityID; - console.log("Dette er community id =" + this.communityID); this.community = await GetCommunity(this.communityID); - console.log(this.community); }, }, async created() { diff --git a/src/components/CommunityComponents/CommunitySettings.vue b/src/components/CommunityComponents/CommunitySettings.vue index 0dd0328534c890eb348d4e02f6d16fb7da791762..8ea68e5261329fb85624ce68a201be8e02273416 100644 --- a/src/components/CommunityComponents/CommunitySettings.vue +++ b/src/components/CommunityComponents/CommunitySettings.vue @@ -9,7 +9,7 @@ </template> <script> -// import AdminService from "@/services/community-admin.service"; +// import CommunityAdminService from "@/services/community-admin.service"; import IconButton from "@/components/BaseComponents/IconButton.vue"; //TODO: OPEN CONFIRMATION DIALOG WHEN DELETING @@ -20,8 +20,8 @@ export default { }, methods: { deleteCommunity() { - //console.log("DELETED"); - // AdminService.deleteCommunity(this.$route.params.communityID); + console.log("DELETED"); + // CommunityAdminService.deleteCommunity(this.$route.params.communityID); }, }, }; diff --git a/src/components/FormComponents/LoginForm.vue b/src/components/FormComponents/LoginForm.vue index 03c6482b6272c6f1ffaa3461906e1260044c0ea1..c1b38f5d704d78d933a3c07173ff36dae2debd05 100644 --- a/src/components/FormComponents/LoginForm.vue +++ b/src/components/FormComponents/LoginForm.vue @@ -137,7 +137,6 @@ export default { this.v$.user.$touch(); if (this.v$.user.$invalid) { - //console.log("Ugyldig, avslutter..."); return; } @@ -153,8 +152,6 @@ export default { } else if (loginResponse.isLoggedIn === true) { this.$store.commit("saveToken", loginResponse.token); await this.$router.push("/"); - } else { - //console.log("Something went wrong"); } }, }, diff --git a/src/components/FormComponents/NewPasswordForm.vue b/src/components/FormComponents/NewPasswordForm.vue index 863a17d2ce1918c0e2bf86f124a150cc03446eea..4028053f7a5c7f4ed2ef7b47db1192c17b3a157a 100644 --- a/src/components/FormComponents/NewPasswordForm.vue +++ b/src/components/FormComponents/NewPasswordForm.vue @@ -168,7 +168,6 @@ export default { this.v$.user.$touch(); if (this.v$.user.$invalid) { - //console.log("Invalid, exiting..."); return; } diff --git a/src/components/FormComponents/ResetPasswordForm.vue b/src/components/FormComponents/ResetPasswordForm.vue index 9f5457d9569dcd1c4d0f8f0a1b1eda7d30cfb3b3..36fd9aae1f69396b55e2220439b0bb1c2d174eaf 100644 --- a/src/components/FormComponents/ResetPasswordForm.vue +++ b/src/components/FormComponents/ResetPasswordForm.vue @@ -83,7 +83,6 @@ export default { this.v$.email.$touch(); if (this.v$.email.$invalid) { - //console.log("Ugyldig, avslutter..."); return; } else { this.$router.push("/"); diff --git a/src/components/ItemComponents/NewItemForm.vue b/src/components/ItemComponents/NewItemForm.vue index d0ff2bde33b2ad7da50e1fe7ede41171c38cdbf2..ad87fd4358184719764cfcd3fc7a1b2f9e39222b 100644 --- a/src/components/ItemComponents/NewItemForm.vue +++ b/src/components/ItemComponents/NewItemForm.vue @@ -311,37 +311,19 @@ export default { }, methods: { checkValidation: function () { - //console.log("sjekker validering"); - this.v$.item.$touch(); if (this.v$.item.$invalid || this.item.selectedGroups.length === 0) { if (this.item.selectedGroups.length === 0) { this.groupErrorMessage = "Velg gruppe/grupper"; } - //console.log("Invalid, avslutter..."); return false; } - - //console.log("validert!"); return true; }, async saveClicked() { - //console.log("Attempting to save item"); - if (this.checkValidation()) { - //console.log("validert, videre..."); - this.checkUser(); - - //console.log("Tittel: " + this.item.title); - //console.log("Kategori: " + this.item.select); - //console.log("Beskrivelse: " + this.item.description); - //console.log("Addressen: " + this.item.address); - //console.log("Pris: " + this.item.price); - //console.log("bilder: " + this.item.images); - //console.log("gruppe: " + this.item.selectedGroups); - const itemInfo = { title: this.item.title, description: this.item.description, @@ -351,12 +333,7 @@ export default { categoryNames: [], communityIDs: this.item.selectedGroups, }; - - //console.log(itemInfo); - - /* const postRequest = */ await postNewItem(itemInfo); - - //console.log("posted: " + postRequest); + await postNewItem(itemInfo); this.$router.push("/"); } @@ -368,7 +345,6 @@ export default { }, addImage: function (event) { - //console.log(event.target.files); this.item.images.push(URL.createObjectURL(event.target.files[0])); }, @@ -379,7 +355,6 @@ export default { onChangeGroup: function (e) { this.selectedGroupId = e.target.value; let alreadyInGroupList = false; - //console.log("selected clicked"); for (let i = 0; i <= this.item.selectedGroups.length; i++) { if (this.selectedGroupId == this.item.selectedGroups[i]) { diff --git a/src/components/RentingComponents/ItemInfo.vue b/src/components/RentingComponents/ItemInfo.vue index 59308822724d89fc7749b0e1ed88afde4b316cea..18f8a558678bf4a038a8d05bcac2a39400a81326 100644 --- a/src/components/RentingComponents/ItemInfo.vue +++ b/src/components/RentingComponents/ItemInfo.vue @@ -51,7 +51,10 @@ </div> </div> <div class="mt-2"> - <UserListItemCard :user="userForId"></UserListItemCard> + <UserListItemCard + :buttons="['chat']" + :user="userForId" + ></UserListItemCard> </div> <div class="mt-4"> <h3 class="text-base font-base text-gray-900">Tidspunkter</h3> @@ -87,10 +90,11 @@ <script> import NewRent from "@/components/RentingComponents/NewRent.vue"; -import { getItem, getItemPictures, getUser } from "@/utils/apiutil"; +import { getItem, getItemPictures } from "@/utils/apiutil"; import ImageCarousel from "@/components/RentingComponents/ImageCarousel.vue"; import UserListItemCard from "@/components/UserProfileComponents/UserListItemCard.vue"; import DatepickerRange from "@/components/TimepickerComponents/DatepickerRange/DatepickerRange.vue"; +import UserService from "@/services/user.service"; export default { name: "ItemInfo", @@ -123,7 +127,7 @@ export default { ], pictures: [], noPicture: true, - userForId: Object, + userForId: {}, rentingStartDate: null, rentingEndDate: null, totPrice: 0, @@ -181,7 +185,7 @@ export default { //TODO fixs so each image get a correct alt text. }, async getUser(userId) { - this.userForId = await getUser(userId); + this.userForId = await UserService.getUserFromId(userId); }, setDate(dateOfsomthing) { if (dateOfsomthing.startDate == null || dateOfsomthing.endDate == null) { diff --git a/src/components/RentingComponents/NewRent.vue b/src/components/RentingComponents/NewRent.vue index 32073aa24a66328935b56876748e554e8dc00925..7ced0d6da6b8575e6fa37f287ddc3ae464fa0072 100644 --- a/src/components/RentingComponents/NewRent.vue +++ b/src/components/RentingComponents/NewRent.vue @@ -32,8 +32,12 @@ <button id="cancelButton" @click="cancelRent" class="text-primary-medium"> Tilbake </button> - <div id="confirmButton"> - <colored-button @click="sendRent" :text="'Send'"></colored-button> + <div id="confirm"> + <colored-button + id="confirmButton" + @click="sendRent" + :text="'Send'" + ></colored-button> </div> </div> <div> @@ -75,7 +79,6 @@ export default { newRentBox: { renterId: Number, title: String, - description: String, fromTime: Date, toTime: Date, listingID: Number, @@ -100,40 +103,40 @@ export default { let monthString = ""; //Gives the month the proper name switch (dateMonth) { - case 1: + case 0: monthString = "Januar"; break; - case 2: + case 1: monthString = "Februar"; break; - case 3: + case 2: monthString = "Mars"; break; - case 4: + case 3: monthString = "April"; break; - case 5: + case 4: monthString = "Mai"; break; - case 6: + case 5: monthString = "Juni"; break; - case 7: + case 6: monthString = "Juli"; break; - case 8: + case 7: monthString = "August"; break; - case 9: + case 8: monthString = "September"; break; - case 10: + case 9: monthString = "Oktober"; break; - case 11: + case 10: monthString = "November"; break; - case 12: + case 11: monthString = "Desember"; break; default: @@ -209,7 +212,7 @@ export default { grid-column: 1/3; grid-row: 6/7; } -#confirmButton { +#confirm { grid-column: 1/3; grid-row: 7/8; align-content: center; diff --git a/src/components/TimepickerComponents/DatepickerRange/MonthSelector.vue b/src/components/TimepickerComponents/DatepickerRange/MonthSelector.vue index bfcbaef6757e67706693a0680345aaf40f36b68a..6ed71add4bb27126ca6a8518b081d753063d89cc 100644 --- a/src/components/TimepickerComponents/DatepickerRange/MonthSelector.vue +++ b/src/components/TimepickerComponents/DatepickerRange/MonthSelector.vue @@ -81,7 +81,6 @@ export default { this.$emit("back", this.type); }, forward() { - //console.log(this.type); this.$emit("forward", this.type); }, }, diff --git a/src/components/UserProfileComponents/UserItems.vue b/src/components/UserProfileComponents/UserItems.vue new file mode 100644 index 0000000000000000000000000000000000000000..7b9a503d06a4b5d68f2b7b0af9dfca711d5edd8a --- /dev/null +++ b/src/components/UserProfileComponents/UserItems.vue @@ -0,0 +1,157 @@ +<template> + <div + id="headline" + class="text-xl md:text-2xl text-gray-600 font-medium w-full" + > + Dine gjenstander + </div> + <!-- Search field --> + <div class="relative" id="searchComponent"> + <span class="absolute inset-y-0 left-0 flex items-center pl-3"> + <svg class="w-5 h-5 text-gray-400" viewBox="0 0 24 24" fill="none"> + <path + d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + ></path> + </svg> + </span> + + <input + type="text" + id="searchInput" + class="w-full py-3 pl-10 pr-4 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-primary-medium dark:focus:border-primary-medium focus:outline-none focus:ring" + placeholder="Search" + v-model="search" + @change="searchWritten" + /> + </div> + + <div class="absolute inset-x-0 px-5 py-3"> + <!-- ItemCards --> + <div class="flex items-center justify-center w-screen"> + <!-- Shows items based on pagination --> + <div + class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full" + v-if="showItems" + > + <ItemCard v-for="item in visibleItems" :key="item" :item="item" /> + </div> + + <!-- Shows items based on search field input --> + <div + class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center" + v-if="showSearchedItems" + > + <ItemCard v-for="item in searchedItems" :key="item" :item="item" /> + </div> + </div> + <!-- pagination --> + <div class="flex justify-center" v-if="showItems"> + <PaginationTemplate + v-bind:items="items" + v-on:page:update="updatePage" + v-bind:currentPage="currentPage" + v-bind:pageSize="pageSize" + class="mt-10" + /> + </div> + </div> +</template> +<script> +import { GetUserListings, getItemPictures } from "@/utils/apiutil"; +import ItemCard from "@/components/ItemComponents/ItemCard.vue"; +import PaginationTemplate from "@/components/BaseComponents/PaginationTemplate"; + +export default { + name: "UserItems", + components: { + ItemCard, + PaginationTemplate, + }, + data() { + return { + items: [], + item: { + listingID: 0, + img: "", + address: "", + title: "", + pricePerDay: 0, + }, + showItems: true, + showSearchedItems: false, + search: "", + //Variables connected to pagination + currentPage: 0, + pageSize: 12, + visibleItems: [], + }; + }, + computed: { + searchedItems() { + let filteredItems = []; + + filteredItems = this.items.filter( + (p) => + p.title.toLowerCase().includes(this.search.toLowerCase()) || + p.address.toLowerCase().includes(this.search.toLowerCase()) || + p.pricePerDay === Number(this.search) + ); + + return filteredItems; + }, + }, + methods: { + getUserListingsFromAPI: async function () { + this.items = await GetUserListings(); + for (var i = 0; i < this.items.length; i++) { + let images = await getItemPictures(this.items[i].listingID); + if (images.length > 0) { + this.items[i].img = images[0].picture; + } + } + }, + //Pagination + updatePage(pageNumber) { + this.currentPage = pageNumber; + this.updateVisibleTodos(); + }, + updateVisibleTodos() { + this.visibleItems = this.items.slice( + this.currentPage * this.pageSize, + this.currentPage * this.pageSize + this.pageSize + ); + + // if we have 0 visible items, go back a page + if (this.visibleItems.length === 0 && this.currentPage > 0) { + this.updatePage(this.currentPage - 1); + } + }, + searchWritten: function () { + //This method triggers when search input field is changed + if (this.search.length > 0) { + this.showItems = false; + this.showSearchedItems = true; + } else { + this.showItems = true; + this.showSearchedItems = false; + } + }, + }, + async beforeMount() { + await this.getUserListingsFromAPI(); + this.updateVisibleTodos(); + }, +}; +</script> + +<style> +#headline { + display: block; + margin-top: 10px; + margin-bottom: 10px; +} +</style> diff --git a/src/components/UserProfileComponents/UserListItemCard.vue b/src/components/UserProfileComponents/UserListItemCard.vue index b60ef198a9c76157694f67bfe694bfbc24ee2f70..202c397d9889c534dcb860d878e2adafe59f6b90 100644 --- a/src/components/UserProfileComponents/UserListItemCard.vue +++ b/src/components/UserProfileComponents/UserListItemCard.vue @@ -110,6 +110,8 @@ export default { this.communityID, this.user.userId ); + //Find a better way to do this + window.location.reload(); }, acceptMemberRequest() { CommunityAdminService.acceptUserIntoCommunity( diff --git a/src/components/UserProfileComponents/UserProfile.vue b/src/components/UserProfileComponents/UserProfile.vue index 5735b15c4a562732106c2222d73abbf4d87779ef..9a877d2401a653468dfd56a6ccccb2afac735922 100644 --- a/src/components/UserProfileComponents/UserProfile.vue +++ b/src/components/UserProfileComponents/UserProfile.vue @@ -33,7 +33,7 @@ > <li> <router-link - to="" + to="/user/userItems" class="block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white" >Mine gjenstander</router-link > diff --git a/src/main.js b/src/main.js index 32764da4a55678ff6ed1fbf6e21819a55990f716..47d214cad941cb90ade7d2fdbd7b9c00cdedb8aa 100644 --- a/src/main.js +++ b/src/main.js @@ -2,7 +2,5 @@ import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; import store from "./store"; -import ws from "./services/ws"; createApp(App).use(router).use(store).mount("#app"); -console.log("WS", ws.test); diff --git a/src/router/index.js b/src/router/index.js index 2f0d2e5ac5f619305ebf5431e4c0267a20dbe201..348a23804a588b34073f754d15a3fad2a348c1fb 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -117,6 +117,11 @@ const routes = [ component: () => import("../views/RentingViews/ItemInfoPageView.vue"), beforeEnter: guardRoute, }, + { + path: "/user/userItems", + name: "UserItems", + component: () => import("../views/UserProfileViews/UserItemsView.vue"), + }, ]; const router = createRouter({ diff --git a/src/services/community-admin.service.js b/src/services/community-admin.service.js index 091fd94aa59808dd7919b3afc564cfc866312128..9a71b83ea37b434e8b0f2a54bb74b077c72094f7 100644 --- a/src/services/community-admin.service.js +++ b/src/services/community-admin.service.js @@ -46,7 +46,10 @@ class CommunityAdminService { API_URL + "communities/" + communityID + "/kick", null, { - params: { userId: userID }, + headers: tokenHeader(), + params: { + userId: userID, + }, } ); } diff --git a/src/services/user.service.js b/src/services/user.service.js index d7ae98a92cec8a73dd0c5194260566bd73cdde82..59de28f4c4e7bd21b5be1d26e8e5bcf3fa967ab9 100644 --- a/src/services/user.service.js +++ b/src/services/user.service.js @@ -1,4 +1,5 @@ // import { tokenHeader } from "@/utils/token-utils"; +import { tokenHeader } from "@/utils/token-utils"; import axios from "axios"; const API_URL = process.env.VUE_APP_BASEURL; @@ -6,20 +7,24 @@ const API_URL = process.env.VUE_APP_BASEURL; class UserService { async getUserFromId(userId) { return await axios - .get(API_URL + "/users/" + userId + "/profile") + .get(API_URL + "/users/" + userId + "/profile", { + headers: tokenHeader(), + }) .then((res) => { return res.data; }) - .catch((err) => console.log(err)); + .catch((err) => console.error(err)); } async getUserRatingAverage(userId) { return await axios - .get(API_URL + "rating/" + userId + "/average") + .get(API_URL + "rating/" + userId + "/average", { + headers: tokenHeader(), + }) .then((res) => { return res.data; }) - .catch((err) => console.log(err)); + .catch((err) => console.error(err)); } //TODO diff --git a/src/services/ws.js b/src/services/ws.js index b9adba0dd168d0e183dc6b151b95fff38d806ef4..c37cc21d24e93419abb2a6d1ebe3a0e0c8be3503 100644 --- a/src/services/ws.js +++ b/src/services/ws.js @@ -17,18 +17,14 @@ const ws = (function () { const onMessageReceived = (payload) => { const data = JSON.parse(payload.body); - //console.log("New message!"); // Fire message event fire("MESSAGE", JSON.parse(payload.body)); if (data.status == "NEW_MESSAGE") fire("NEW_MESSAGE", JSON.parse(payload.body)); - - //console.log("Received message: " + payload); }; const onConnected = () => { - //console.log("Websocket Connected"); stompClient.subscribe( "/user/" + parseCurrentUser().accountId + "/queue/messages", onMessageReceived @@ -57,7 +53,6 @@ const ws = (function () { } }, sendMessage: ({ sender, recipient /* , status */ }) => { - //if (status) console.log(status); stompClient.send( "/app/chat", {}, diff --git a/src/utils/apiutil.js b/src/utils/apiutil.js index 2653cc8b833b74c08385b1cc65e2e6f03b1e1304..2f8fabcb74dc13da2e74888291ee8b581c721b16 100644 --- a/src/utils/apiutil.js +++ b/src/utils/apiutil.js @@ -13,7 +13,7 @@ export function doLogin(loginRequest) { return auth; }) .catch((error) => { - console.log(error.response); + console.error(error.response); return auth; }); } @@ -30,7 +30,7 @@ export function registerUser(registerInfo) { .then((response) => { return response; }) - .catch((err) => console.log(err)); + .catch((err) => console.error(err)); } export async function getUser(userid) { @@ -112,11 +112,10 @@ export function postNewItem(itemInfo) { headers: tokenHeader(), }) .then((response) => { - //console.log("poster: " + response.data); return response; }) .catch((error) => { - console.log(error.response); + console.error(error.response); return error; }); } @@ -128,7 +127,7 @@ export function postNewgroup(groupInfo) { return response; }) .catch((error) => { - console.log(error.response); + console.error(error.response); return error; }); } @@ -138,11 +137,10 @@ export function postNewRent(rentInfo) { headers: tokenHeader(), }) .then((response) => { - //console.log("poster: " + response.data); return response; }) .catch((error) => { - console.log(error.response); + console.error(error.response); return error; }); } @@ -254,7 +252,6 @@ export async function GetMemberRequestsOfCommunity(communityID) { export function JoinOpenCommunity(communityId) { if (tokenHeader().Authorization == "Bearer " + null) { - //console.log("ikke logget på!"); return "Login to join any community"; } @@ -266,7 +263,7 @@ export function JoinOpenCommunity(communityId) { return response; }) .catch((error) => { - console.log(error.response); + console.error(error.response); return error; }); } @@ -297,22 +294,34 @@ export async function LeaveCommunity(communityID) { return response.data; }) .catch((error) => { - console.log(error.data); + console.error(error.data); return error; }); } +export async function GetUserListings() { + return axios + .get(API_URL + "listing/userListings", { + headers: tokenHeader(), + }) + .then((response) => { + return response.data; + }) + .catch((error) => { + console.error(error); + }); +} + export function postNewRating(ratingInfo) { return axios - .post(API_URL + "rating/save", ratingInfo, { - headers: tokenHeader(), - }) - .then((response) => { - console.log("poster: " + response.data); - return response; - }) - .catch((error) => { - console.log(error.response); - return error; - }); -} \ No newline at end of file + .post(API_URL + "rating/save", ratingInfo, { + headers: tokenHeader(), + }) + .then((response) => { + return response; + }) + .catch((error) => { + console.log(error.response); + return error; + }); +} diff --git a/src/views/ChatViews/ChatView.vue b/src/views/ChatViews/ChatView.vue index b260cfd92c6b9d1e5862ae56f27c977d3c68b642..581da8f24f289618486dc3366f4476ca14e1d3c2 100644 --- a/src/views/ChatViews/ChatView.vue +++ b/src/views/ChatViews/ChatView.vue @@ -64,7 +64,6 @@ export default { this.selected = this.conversations.find( (conversation) => conversation.recipient.userId == userid ).recipient; - //console.log(this.selected); }, }, async created() { diff --git a/src/views/CommunityViews/CommunityView.vue b/src/views/CommunityViews/CommunityView.vue index 8755c39e632108ccca0f9ed1ce84f5db986e8105..4bf6345d4af82773fc196bc0847648692b1bd3e0 100644 --- a/src/views/CommunityViews/CommunityView.vue +++ b/src/views/CommunityViews/CommunityView.vue @@ -1,4 +1,5 @@ <template> + <!-- My communities, with pagination --> <div v-if="loggedIn"> <div class="flex flex-row p-4 relative"> <div class="text-xl md:text-2xl text-gray-600 font-medium w-full"> @@ -10,18 +11,72 @@ alt="Opprett ny gruppe" /> </div> - <CommunityList :communities="myCommunities" :member="true" /> + <CommunityList :communities="visibleMyCommunities" :member="true" /> + + <!-- pagination my communities --> + <div class="flex justify-center"> + <PaginationTemplate + v-bind:items="myCommunities" + v-on:page:update="updatePageMyCommunities" + v-bind:currentPage="currentPageMyCommunities" + v-bind:pageSize="pageSizeMyCommunities" + class="mt-10 mb-5" + /> + </div> </div> + + <!-- Public communities, with search and pagination --> <p class="text-xl md:text-2xl text-gray-600 font-medium w-full p-4"> Offentlige grupper </p> - <CommunityList :communities="publicCommunities" :member="false" /> + <!-- Search field --> + <div class="relative mt-1 mx-2" id="searchComponent"> + <span class="absolute inset-y-0 left-0 flex items-center pl-3"> + <svg class="w-5 h-5 text-gray-400" viewBox="0 0 24 24" fill="none"> + <path + d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + ></path> + </svg> + </span> + + <input + type="text" + id="searchInput" + class="w-full py-3 pl-10 pr-4 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-primary-medium dark:focus:border-primary-medium focus:outline-none focus:ring" + placeholder="Search" + v-model="search" + @change="searchWritten" + /> + </div> + + <!-- Public communities list, two lists, one for when it's searched and one for pagination --> + <div v-if="showPaginated"> + <CommunityList :communities="visiblePublicCommunities" :member="false" /> + </div> + <div v-if="showSearched"> + <CommunityList :communities="searchPublicCommunities" :member="false" /> + </div> + <!-- pagination Public communities --> + <div class="flex justify-center"> + <PaginationTemplate + v-bind:items="publicCommunities" + v-on:page:update="updatePagePublicCommunities" + v-bind:currentPage="currentPagePublicCommunities" + v-bind:pageSize="pageSizePublicCommunities" + class="mt-10 mb-5" + /> + </div> </template> <script> import CommunityList from "@/components/CommunityComponents/CommunityList.vue"; import { getMyGroups, getVisibleGroups } from "@/utils/apiutil"; import { UserAddIcon } from "@heroicons/vue/outline"; +import PaginationTemplate from "@/components/BaseComponents/PaginationTemplate"; export default { name: "HomeView", @@ -30,21 +85,93 @@ export default { loggedIn: false, myCommunities: [], publicCommunities: [], + search: "", + showSearched: false, + showPaginated: true, + + //Variables connected to pagination + currentPagePublicCommunities: 0, + currentPageMyCommunities: 0, + pageSizeMyCommunities: 5, + pageSizePublicCommunities: 10, + visiblePublicCommunities: [], + visibleMyCommunities: [], }; }, components: { CommunityList, UserAddIcon, + PaginationTemplate, }, - async created() { + computed: { + searchPublicCommunities() { + let filteredItems = []; + + filteredItems = this.publicCommunities.filter( + (p) => + p.name.toLowerCase().includes(this.search.toLowerCase()) || + p.location.toLowerCase().includes(this.search.toLowerCase()) + ); + + return filteredItems; + }, + }, + methods: { + //Pagination + updatePagePublicCommunities(pageNumber) { + this.currentPagePublicCommunities = pageNumber; + this.updateVisibleCommunities(); + }, + updatePageMyCommunities(pageNumber) { + this.currentPageMyCommunities = pageNumber; + this.updateVisibleCommunities(); + }, + updateVisibleCommunities() { + this.visiblePublicCommunities = this.publicCommunities.slice( + this.currentPagePublicCommunities * this.pageSizePublicCommunities, + this.currentPagePublicCommunities * this.pageSizePublicCommunities + + this.pageSizePublicCommunities + ); + this.visibleMyCommunities = this.myCommunities.slice( + this.currentPageMyCommunities * this.pageSizeMyCommunities, + this.currentPageMyCommunities * this.pageSizeMyCommunities + + this.pageSizeMyCommunities + ); + + // if we have 0 visible communities, go back a page + if ( + this.visiblePublicCommunities.length === 0 && + this.currentPagePublicCommunities > 0 + ) { + this.updatePagePublicCommunities(this.currentPagePublicCommunities - 1); + } + if ( + this.visibleMyCommunities.length === 0 && + this.currentPageMyCommunities > 0 + ) { + this.updatePageMyCommunities(this.currentPageMyCommunities - 1); + } + }, + //Triggers when search field input is changed + searchWritten: function () { + //This method triggers when search input field is changed + if (this.search.length > 0) { + this.showPaginated = false; + this.showSearched = true; + } else { + this.showPaginated = true; + this.showSearched = false; + } + }, + }, + async beforeMount() { this.publicCommunities = await getVisibleGroups(); this.loggedIn = this.$store.state.user.token !== null; if (!this.loggedIn) return; - this.myCommunities = await getMyGroups(); - }, - mounted() { + // Double loop is bad; find a better way to do this + // Loops through both arrays and removes myCommunities from public for (var i = 0; i < this.publicCommunities.length; i++) { for (var j = 0; j < this.myCommunities.length; j++) { if ( @@ -55,6 +182,8 @@ export default { } } } + + this.updateVisibleCommunities(); }, }; </script> diff --git a/src/views/TestView.vue b/src/views/TestView.vue index a4c11f01199994126da3586bf0d81ab23903d053..f86430c64bb07d2f6e60fe0626ac1f50371d3682 100644 --- a/src/views/TestView.vue +++ b/src/views/TestView.vue @@ -1,7 +1,5 @@ <template> - <div > - - </div> + <div></div> </template> <script> @@ -11,8 +9,7 @@ export default { show: false, }; }, - components: { - }, + components: {}, methods: { toggleModal() { this.show = !this.show; diff --git a/src/views/UserProfileViews/UserItemsView.vue b/src/views/UserProfileViews/UserItemsView.vue new file mode 100644 index 0000000000000000000000000000000000000000..8ac137d470d2dd6ed213d18d9c778c1da872996b --- /dev/null +++ b/src/views/UserProfileViews/UserItemsView.vue @@ -0,0 +1,15 @@ +<template> + <user-items> </user-items> +</template> + +<script> +import UserItems from "@/components/UserProfileComponents/UserItems.vue"; +export default { + name: "UserItemsView", + components: { + UserItems, + }, +}; +</script> + +<style></style> diff --git a/tests/unit/component-tests/base-component-tests/pagination-template.spec.js b/tests/unit/component-tests/base-component-tests/pagination-template.spec.js new file mode 100644 index 0000000000000000000000000000000000000000..91a7495f64107bf31184e1dee68e250a959e06de --- /dev/null +++ b/tests/unit/component-tests/base-component-tests/pagination-template.spec.js @@ -0,0 +1,21 @@ +import { mount } from "@vue/test-utils"; +import Pagination from "@/components/BaseComponents/PaginationTemplate.vue"; + +describe("PaginationTemplate", () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(Pagination, { + //passing prop to component + props: { + items: [], + currentPage: 0, + pageSize: 4, + }, + }); + }); + + it("is instantiated", () => { + expect(wrapper.exists()).toBeTruthy(); + }); +}); diff --git a/tests/unit/component-tests/community-component-tests/community-hamburger.spec.js b/tests/unit/component-tests/community-component-tests/community-hamburger.spec.js index 8a7211fcc06388357a4646aa8219cb285eeffcf6..4f610d50a19491b24345c83325ce55a5c38602a1 100644 --- a/tests/unit/component-tests/community-component-tests/community-hamburger.spec.js +++ b/tests/unit/component-tests/community-component-tests/community-hamburger.spec.js @@ -1,26 +1,17 @@ import { shallowMount } from "@vue/test-utils"; import CommunityHamburger from "@/components/CommunityComponents/CommunityHamburger.vue"; import { route, router, $route, $router } from "../../mock-router"; +import { store, $store } from "../../mock-store"; describe("CommunityHamburger elements rendering", () => { let wrapper; beforeEach(() => { wrapper = shallowMount(CommunityHamburger, { - //passing prop to component - props: { - adminStatus: true, - community: { - communityId: 1, - name: "String", - description: "String", - visibility: 0, - location: "String", - picture: "String", - }, - }, global: { mocks: { + store, + $store, route, router, $route, @@ -33,7 +24,7 @@ describe("CommunityHamburger elements rendering", () => { it("renders all li fields", () => { expect(wrapper.find("#newItem").text()).toMatch("Opprett Utleie"); expect(wrapper.find("#getMembers").text()).toMatch("Se Medlemmer"); - expect(wrapper.find("#adminGroup").text()).toMatch("Administrer Gruppe"); + //expect(wrapper.find("#adminGroup").text()).toMatch("Administrer Gruppe"); expect(wrapper.find("#leaveGroup").text()).toMatch("Forlat Gruppe"); }); }); diff --git a/tests/unit/component-tests/renting-compnents-tests/new-rent.spec.js b/tests/unit/component-tests/renting-compnents-tests/new-rent.spec.js new file mode 100644 index 0000000000000000000000000000000000000000..3f8ffafa68bf5dd606afdeda9214b57871ff174f --- /dev/null +++ b/tests/unit/component-tests/renting-compnents-tests/new-rent.spec.js @@ -0,0 +1,46 @@ +import { mount } from "@vue/test-utils"; +import NewRent from "@/components/RentingComponents/NewRent.vue"; + +describe("Confirm and send a rent request", () => { + let wrapper; + const route = { + params: { + id: 1, + }, + }; + const router = { + push: jest.fn(), + }; + beforeEach(() => { + wrapper = mount(NewRent, { + props: { + newRentBox: { + title: "Telt", + listingID: 1, + fromTime: "2022-09-19", + toTime: "2022-09-23", + price: 200, + renterId: 1, + isAccepted: false, + }, + }, + global: { + mocks: { + $route: route, + $router: router, + }, + }, + }); + }); + + it("Is instansiated", () => { + expect(wrapper.exists()).toBeTruthy(); + }); + + it("Check if fields show correct informations", () => { + expect(wrapper.find("#rentTitle").text()).toEqual("Telt"); + expect(wrapper.find("#fromTime").text()).toMatch("19. September 2022"); + expect(wrapper.find("#toTime").text()).toMatch("23. September 2022"); + expect(wrapper.find("#price").text()).toEqual("Totaltpris: 200 kr"); + }); +});