Skip to content
Snippets Groups Projects
Commit 16776e38 authored by henrikburmann's avatar henrikburmann
Browse files

Can send hardcoded rent

parent 0eb85a51
No related branches found
No related tags found
1 merge request!81Renting
Hide whitespace changes
Inline Side-by-side
Showing
with 211 additions and 122 deletions
src/components/CommunityComponents/CommunityHome.vue
+ 15
− 8
View file @ 16776e38
<template>
<section class="w-full px-5 py-4 mx-auto rounded-md">
<CommunityHeader :admin-status="false" :community="community" class="mb-5"/>
<CommunityHeader
:admin-status="false"
:community="community"
class="mb-5"
/>
<!-- Search field -->
<div class="relative" id="searchComponent">
......@@ -28,7 +31,9 @@
<!-- Item cards -->
<div class="absolute inset-x-0 px-6 py-3">
<div class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center">
<div
class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center"
>
<ItemCard v-for="item in searchedItems" :key="item" :item="item" />
</div>
</div>
......@@ -77,18 +82,20 @@ export default {
};
},
methods: {
getCommunityFromAPI: async function (){
this.communityID = await this.$router.currentRoute.value.params.communityID;
getCommunityFromAPI: async function () {
this.communityID = await this.$router.currentRoute.value.params
.communityID;
this.community = await GetCommunity(this.communityID);
},
getListingsOfCommunityFromAPI: async function(){
this.communityID = await this.$router.currentRoute.value.params.communityID;
getListingsOfCommunityFromAPI: async function () {
this.communityID = await this.$router.currentRoute.value.params
.communityID;
this.items = await GetListingsInCommunity(this.communityID);
},
},
beforeMount() {
this.getCommunityFromAPI(); //To get the id of the community before mounting the view
this.getListingsOfCommunityFromAPI();
}
},
};
</script>
src/components/CommunityComponents/ItemCard.vue
+ 3
− 1
View file @ 16776e38
......@@ -11,7 +11,9 @@
{{ item.address }}
</p>
<p class="font-bold text-sm" id="title">{{ item.title }}</p>
<p class="text-gray-700 text-xs" id="price">{{ item.pricePerDay }} kr</p>
<p class="text-gray-700 text-xs" id="price">
{{ item.pricePerDay }} kr
</p>
</div>
</div>
</div>
......
src/components/RentingComponents/NewRent.vue
+ 87
− 30
View file @ 16776e38
<template>
<div class="confirmationBox">
<div>
<div class="rentTitle">
<h1>
{{ title }}
{{ title }}
</h1>
</div>
<div>
<p>{{ description }}</p>
<div class = "fromTime">
<p>Fra: {{ from_time }}</p>
</div>
<div>
<p>Fra: {{ from_time }}</p>
<div class = "toTime">
<p>Til: {{ to_time }}</p>
</div>
<div>
<p>Til: {{ to_time }}</p>
</div>
<div>
<label
<div class = "message">
<label
class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-400"
id="descriptionLabel"
>Skriv en melding til utleier</label>
<textarea
id="description"
rows="4"
v-bind="message"
class="block p-2.5 w-full text-sm text-gray-900 bg-gray-200 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
required
></textarea>
>Skriv en melding til utleier</label
>
<textarea
id="description"
rows="4"
v-model="message"
class="block p-2.5 w-full text-sm text-gray-900 bg-gray-200 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
required
></textarea>
</div>
<colored-button class = "cancelButton" :text="'Tilbake'"></colored-button>
<div class = "confirmButton">
<colored-button @click="sendRent" :text="'Send'"></colored-button>
</div>
<button @click="cancelRent">Avbryt</button>
<button @click="sendRent">Send forespøsel</button>
</div>
</template>
<script>
import ColoredButton from "@/components/BaseComponents/ColoredButton.vue";
import { postNewRent } from "@/utils/apiutil";
export default {
name: "NewRent",
components: {
ColoredButton,
},
data() {
return {
// title: "Objekt",
// from_time: "2022-04-03",
// to_time: "2022-04-10",
message: ""
title: this.newRentBox.title,
message: "",
price: this.newRentBox.price_per_day,
};
},
props: {
newRentBox: {
renterId: Number,
title: String,
description: String,
from_time: Date,
to_time: Date,
fromTime: Date,
toTime: Date,
pricePerDay: Number,
listingId: Number,
isAccepted: Boolean
},
},
methods: {
cancelRent() {
console.log("Canceled");
},
sendRent: function () {
console.log(this.message);
sendRent: async function () {
const rent = {
// message: this.message,
listingId: this.newRentBox.listingId,
renterId: this.newRentBox.renterId,
isAccepted: false,
toTime: this.newRentBox.toTime,
fromTime: this.newRentBox.fromTime,
};
await postNewRent(rent);
console.log(rent);
},
},
};
</script>
<style></style>
<style>
.confirmationBox{
margin-top: 60fr;
width: 70%;
margin: auto;
display: grid;
grid-template-columns: 1fr 3fr;
grid-template-rows: 1fr 1fr 1fr 3fr 1fr;
max-height: 90%;
}
.cancelButton{
grid-column: 1/2;
grid-row: 1/2;
}
.rentTitle{
margin-top: 10%;
text-align: center;
grid-column: 2/3;
}
.fromTime{
grid-row: 2/3;
grid-column: 1/3;
display: block;
}
.toTime{
grid-row: 3/4;
grid-column: 1/3;
display: block;
}
.message{
grid-column: 1/3;
grid-row: 4/5;
}
.confirmButton{
grid-column: 1/3;
grid-row: 5/6;
align-content: center;
}
</style>
src/utils/apiutil.js
+ 34
− 20
View file @ 16776e38
......@@ -121,6 +121,20 @@ export function postNewgroup(groupInfo) {
return error;
});
}
export function postNewRent(rentInfo) {
return axios
.post(API_URL + "renting/renter/save", rentInfo, {
headers: tokenHeader(),
})
.then((response) => {
console.log("poster: " + response.data);
return response;
})
.catch((error) => {
console.log(error.response);
return error;
});
}
export function getMyGroups() {
return axios
......@@ -149,27 +163,27 @@ export function getVisibleGroups() {
}
export async function GetCommunity(communityID) {
return axios
.get(API_URL + "community/" + communityID, {
headers: tokenHeader(),
})
.then((response) => {
return response.data;
})
.catch((error) => {
console.error(error);
});
return axios
.get(API_URL + "community/" + communityID, {
headers: tokenHeader(),
})
.then((response) => {
return response.data;
})
.catch((error) => {
console.error(error);
});
}
export async function GetListingsInCommunity(communityID) {
return axios
.get(API_URL + "community/" + communityID + "/listings", {
headers: tokenHeader(),
})
.then((response) => {
return response.data;
})
.catch((error) => {
console.error(error);
});
return axios
.get(API_URL + "community/" + communityID + "/listings", {
headers: tokenHeader(),
})
.then((response) => {
return response.data;
})
.catch((error) => {
console.error(error);
});
}
src/views/CommunityViews/CommunityView.vue
+ 9
− 10
View file @ 16776e38
<template>
<div>
<img
class="cursor-pointer h-8 mr-4 mt-4 float-right"
v-if="isLoggedIn"
src="@/assets/newCommunity.png"
alt="Legg til gruppe"
@click="$router.push('/createNewGroup')"
class="cursor-pointer h-8 mr-4 mt-4 float-right"
v-if="isLoggedIn"
src="@/assets/newCommunity.png"
alt="Legg til gruppe"
@click="$router.push('/createNewGroup')"
/>
</div>
<div>
<div id="myGroups" v-if="isLoggedIn">
<div class="m-4" >Mine grupper:</div>
<div class="m-4">Mine grupper:</div>
<group-list :groupList="myGroups" />
</div>
<div id="localGroups">
......@@ -18,7 +18,6 @@
<group-list :groupList="localGroups" />
</div>
</div>
</template>
<script>
......@@ -48,9 +47,9 @@ export default {
async created() {
await this.getMyGroups();
await this.getPotentialGroups();
if(this.$store.state.user.token !== null){
this.isLoggedIn = true
if (this.$store.state.user.token !== null) {
this.isLoggedIn = true;
}
},
},
};
</script>
src/views/RentingViews/NewRentView.vue
+ 14
− 1
View file @ 16776e38
<template>
<NewRent> </NewRent>
<NewRent :newRentBox="item"> </NewRent>
</template>
<script>
import NewRent from "@/components/RentingComponents/NewRent.vue";
export default {
name: "NewRentView.vue",
data() {
return {
item: {
renterId: 3,
title: "Jekk til leie",
description: "Typ transport",
fromTime: "2022-07-26",
toTime: "2022-08-01",
pricePerDay: 4.0,
listingId: 157,
},
};
},
components: {
NewRent,
},
......
tests/unit/apiutil-communityHome-mock.spec.js
+ 49
− 52
View file @ 16776e38
import {GetCommunity, GetListingsInCommunity} from "@/utils/apiutil";
import { GetCommunity, GetListingsInCommunity } from "@/utils/apiutil";
import axios from "axios";
jest.mock("axios");
describe("testing mocking of apiutil.js", () => {
it("check that existing group returns correctly", async () => {
const expectedResponse = {
communityId: 4040,
name: "Fisken i vannet",
description: "For vi som liker fjell fisk",
visibility: 1,
location: "Bergen brygge",
picture: "fish blub blub"
};
axios.get.mockImplementation(() =>
Promise.resolve({ data: expectedResponse })
);
const communityResponse = await GetCommunity(4040);
expect(communityResponse.name).toBe(expectedResponse.name);
});
it("check that existing group returns correct listings", async () => {
const expectedResponse = {
item1: {
title: "Fiskekurs",
description: "Fisking og sånn",
pricePerDay: 200,
address: "Vannet",
userID: 6,
categoryNames: null,
communityIDs: null
},
item2: {
title: "TestFraFrontend",
description: "oslo",
pricePerDay: 500,
address: "oslo",
userID: 1,
categoryNames: null,
communityIDs: null
},
};
axios.get.mockImplementation(() =>
Promise.resolve({ data: expectedResponse })
);
const communityItemResponse = await GetListingsInCommunity(4040);
expect(communityItemResponse).toBe(expectedResponse);
})
it("check that existing group returns correctly", async () => {
const expectedResponse = {
communityId: 4040,
name: "Fisken i vannet",
description: "For vi som liker fjell fisk",
visibility: 1,
location: "Bergen brygge",
picture: "fish blub blub",
};
axios.get.mockImplementation(() =>
Promise.resolve({ data: expectedResponse })
);
const communityResponse = await GetCommunity(4040);
expect(communityResponse.name).toBe(expectedResponse.name);
});
it("check that existing group returns correct listings", async () => {
const expectedResponse = {
item1: {
title: "Fiskekurs",
description: "Fisking og sånn",
pricePerDay: 200,
address: "Vannet",
userID: 6,
categoryNames: null,
communityIDs: null,
},
item2: {
title: "TestFraFrontend",
description: "oslo",
pricePerDay: 500,
address: "oslo",
userID: 1,
categoryNames: null,
communityIDs: null,
},
};
axios.get.mockImplementation(() =>
Promise.resolve({ data: expectedResponse })
);
const communityItemResponse = await GetListingsInCommunity(4040);
expect(communityItemResponse).toBe(expectedResponse);
});
});
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment