You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
85 lines
2.0 KiB
85 lines
2.0 KiB
<template>
|
|
<div>
|
|
<navbar />
|
|
<div class="central-view">
|
|
<sidebar @filter="applyFilters" />
|
|
<div class="main-view">
|
|
<overview-screen :items="items" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
import Navbar from "@/components/Navbar.vue";
|
|
import Sidebar from "@/components/Sidebar.vue";
|
|
import OverviewScreen from "@/components/OverviewScreen.vue";
|
|
export default {
|
|
name: "front-view",
|
|
components: { Navbar, Sidebar, OverviewScreen },
|
|
data() {
|
|
return {
|
|
items: [],
|
|
currentFilters: {},
|
|
}
|
|
},
|
|
methods: {
|
|
fetchAllItems() {
|
|
const baseURL = "http://localhost:8080/api/v1";
|
|
|
|
fetch(`${baseURL}/items/?limit=10000`)
|
|
.then(res => res.json())
|
|
.then(data => this.items = data)
|
|
.catch((e) => console.log(e))
|
|
},
|
|
fetchFiltered(filter) {
|
|
const baseURL = "http://localhost:8080/api/v1";
|
|
|
|
// request options
|
|
const options = {
|
|
method: 'POST',
|
|
body: JSON.stringify(filter),
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
}
|
|
};
|
|
|
|
fetch(`${baseURL}/detailed_search/?limit=10000`, options)
|
|
.then(res => res.json())
|
|
.then(data => this.items = data)
|
|
.catch((e) => console.log(e))
|
|
},
|
|
applyFilters(filter) {
|
|
let key;
|
|
for (key in filter) {
|
|
if (filter[key] != "Any") {
|
|
this.currentFilters[key] = filter[key]
|
|
} else {
|
|
delete this.currentFilters[key]
|
|
}
|
|
};
|
|
|
|
this.fetchFiltered(this.currentFilters);
|
|
}
|
|
},
|
|
created() {
|
|
this.fetchAllItems()
|
|
},
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
<style lang="css">
|
|
.central-view {
|
|
height: max(100vh, 100%);
|
|
margin: 0;
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.main-view {
|
|
width: 100%;
|
|
}
|
|
</style> |