ourworld_web/www_threefold_io
23
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix empty search result

Browse Source
This commit is contained in:
samaradel
2020-11-17 11:06:42 +02:00
parent a7c9939d0e
commit 1e9337d3f8
2 changed files with 39 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/layouts/Default.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<div id="app" dark> <div id="app" dark class="min-h-screen flex flex-col font-sans">
<HeaderPartial v-if="hideHeader!=true" @setTheme="setTheme" :theme="this.theme"></HeaderPartial> <HeaderPartial v-if="hideHeader!=true" @setTheme="setTheme" :theme="this.theme"></HeaderPartial>
<slot/> <slot/>
<NavbarPartial :disableScroll="disableScroll" @setTheme="setTheme" :theme="this.theme"></NavbarPartial> <NavbarPartial :disableScroll="disableScroll" @setTheme="setTheme" :theme="this.theme"></NavbarPartial>

38
src/pages/Search.vue
View File

@@ -1,13 +1,20 @@
<template> <template>
<Layout> <Layout>
<div class="container sm:pxi-0 mx-auto overflow-x-hidden"> <div class="container sm:pxi-0 mx-auto overflow-x-hidden my-auto">
<div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4"> <div
v-if="searchResults.length > 0"
class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4"
>
<PostListItem <PostListItem
v-for="edge in searchResults" v-for="edge in searchResults"
:key="edge.node.id" :key="edge.node.id"
:record="edge.node" :record="edge.node"
/> />
</div> </div>
<div v-else class="flex flex-col with-large my-auto text-center">
<h1>404</h1>
<p>OOPS! Something went wrong here</p>
</div>
</div> </div>
</Layout> </Layout>
</template> </template>
@@ -113,32 +120,31 @@ export default {
const searchTerm = this.q; const searchTerm = this.q;
if (searchTerm.length < 3) return []; if (searchTerm.length < 3) return [];
var searchRes = this.$search.search({ query: searchTerm, limit: 5 }); var searchRes = this.$search.search({ query: searchTerm, limit: 5 });
var result = [] var result = [];
for (var i = 0; i < searchRes.length; i++) { for (var i = 0; i < searchRes.length; i++) {
var item = searchRes[i] var item = searchRes[i];
result.push({"node" : this.objects[item.path]}) result.push({ node: this.objects[item.path] });
} }
return result return result;
}, },
}, },
mounted() { mounted() {
this.q = new URL(location.href).searchParams.get("query"); this.q = new URL(location.href).searchParams.get("query");
for (var i = 0; i < this.$page.projects.edges.length; i++) { for (var i = 0; i < this.$page.projects.edges.length; i++) {
var item = this.$page.projects.edges[i] var item = this.$page.projects.edges[i];
this.objects[item.node.path] = item.node this.objects[item.node.path] = item.node;
} }
for (var i = 0; i < this.$page.people.edges.length; i++) { for (var i = 0; i < this.$page.people.edges.length; i++) {
var item = this.$page.people.edges[i] var item = this.$page.people.edges[i];
this.objects[item.node.path] = item.node this.objects[item.node.path] = item.node;
} }
for (var i = 0; i < this.$page.blogs.edges.length; i++) { for (var i = 0; i < this.$page.blogs.edges.length; i++) {
var item = this.$page.blogs.edges[i] var item = this.$page.blogs.edges[i];
this.objects[item.node.path] = item.node this.objects[item.node.path] = item.node;
} }
}, },
components: { components: {
PostListItem, PostListItem,
@@ -146,3 +152,9 @@ export default {
}, },
}; };
</script> </script>
<style scoped>
h1 {
font-size: 13rem;;
}
</style>