From ff2c07fd9f58ddcac7579aebd58008dad8c54a20 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ole=20Volds=C3=A6ter?= <ole.voldsater@uib.no>
Date: Mon, 14 Oct 2019 15:46:28 +0200
Subject: [PATCH] =?UTF-8?q?fullstendig=20s=C3=B8k?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/App.vue | 42 ++++++++++++++++++++++++++------
src/components/Article.vue | 4 +--
src/components/Header.vue | 15 ++++--------
src/components/SearchResults.vue | 34 ++++++++++++++++++++++++++
src/utils/helpers.js | 11 +++++++++
5 files changed, 86 insertions(+), 20 deletions(-)
create mode 100644 src/components/SearchResults.vue
create mode 100644 src/utils/helpers.js
diff --git a/src/App.vue b/src/App.vue
index 3082f389..8e35c881 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,13 +4,15 @@
<div class="">
<autocomplete :search="search" :get-result-value="result_view" @submit="select_result" placeholder="søk..."></autocomplete>
</div>
+ <SearchResults :hits="search_results" />
<Article :article="article" />
</div>
</template>
<script>
-import axios from "axios";
+import axios from "axios"
import Article from './components/Article.vue'
+import SearchResults from './components/SearchResults.vue'
import Autocomplete from '@trevoreyre/autocomplete-vue'
import '@trevoreyre/autocomplete-vue/dist/style.css'
@@ -28,6 +30,8 @@ export default {
data: function() {
return {
article_id: parseInt(window.location.href.split("/").pop()),
+ search_query: window.location.href.split("?q=")[1],
+ search_results: [],
article: {lemmas: []},
search: function(q) {
return new Promise(resolve => {
@@ -41,32 +45,53 @@ export default {
}
}
}
- }).then(response => resolve(response.data.suggest.suggest[0].options))
+ }).then(function(response) {
+ let hits = response.data.suggest.suggest[0].options
+ if(q.length) hits = hits.concat({q: q})
+ resolve(hits)
+ })
})
},
result_view: function(result) {
- return result._source.lemmas.map(x => x.word).join(', ')
+ if (result._source)
+ return result._source.lemmas.map(x => x.word).join(', ')
+ else
+ return 'Alle søkeresultater...'
}
}
},
components: {
Article,
- Autocomplete
+ Autocomplete,
+ SearchResults
},
methods: {
select_result: function(event) {
- this.article = event._source
- history.pushState(this.article, this.article.lemmas.map(x => x.word).join(', '), event._id)
+ if(event._source){
+ this.search_results = []
+ this.article = event._source
+ history.pushState(this.article, this.article.lemmas.map(x => x.word).join(', '), event._id)
+ }else{
+ window.location.href="search?q=" + event.q
+ }
}
},
mounted: function(){
var self = this;
- axios.get('https://search-ordbok-prototype-6qpfmm6fz5jvy5ba3e6blryeqe.eu-west-1.es.amazonaws.com/ordbok/_doc/' + self.article_id)
+ if(this.search_query) {
+ axios.get('https://search-ordbok-prototype-6qpfmm6fz5jvy5ba3e6blryeqe.eu-west-1.es.amazonaws.com/ordbok/_search?q=' + self.search_query)
+ .then(function(response){
+ self.search_results = response.data.hits.hits
+ })
+ }
+ else
+ {
+ axios.get('https://search-ordbok-prototype-6qpfmm6fz5jvy5ba3e6blryeqe.eu-west-1.es.amazonaws.com/ordbok/_doc/' + self.article_id)
.then(function(response){
self.article = response.data._source
history.replaceState(self.article, self.article.lemmas.map(x => x.word).join(', '))
})
-
+ }
}
}
</script>
@@ -79,6 +104,7 @@ export default {
color: #2c3e50;
margin-top: 60px;
margin-left: 30%;
+ margin-right: 10%;
}
.autocomplete {
diff --git a/src/components/Article.vue b/src/components/Article.vue
index 352048d5..33c76848 100644
--- a/src/components/Article.vue
+++ b/src/components/Article.vue
@@ -1,7 +1,7 @@
<template>
- <div class="article">
+ <div class="article" v-show="article.lemmas.length">
<Header :lemmas="article.lemmas" />
- <div class="">
+ <div class="" v-if="article.etymology">
<h3>Etymologi</h3>
<ul>
<DefElement v-for="(element, index) in article.etymology" :key="index" :body='element' v-if="element.content" />
diff --git a/src/components/Header.vue b/src/components/Header.vue
index 50bccf65..f31b9e63 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -19,9 +19,10 @@
</template>
<script>
-import VueTooltipster from './vue-tooltipster.vue';
-import jQuery from 'jquery';
-window.jQuery = jQuery;
+import helpers from '../utils/helpers.js'
+import VueTooltipster from './vue-tooltipster.vue'
+import jQuery from 'jquery'
+window.jQuery = jQuery
export default {
name: 'Header',
@@ -37,13 +38,7 @@ export default {
).join(', ')
},
group_list: function() {
- var grp_collection = new Set()
- this.lemmas.forEach(function(lemma){
- lemma.inflection_groups.forEach(function(grp){
- grp_collection.add(grp.group_designation)
- })
- })
- return Array.from(grp_collection).join(';')
+ return helpers.group_list(this.lemmas)
}
},
components: {
diff --git a/src/components/SearchResults.vue b/src/components/SearchResults.vue
new file mode 100644
index 00000000..fe2b4356
--- /dev/null
+++ b/src/components/SearchResults.vue
@@ -0,0 +1,34 @@
+<template>
+ <div class="">
+ <h2 v-if="hits.length">Søkeresultater</h2>
+ <ul>
+ <li v-for="result in extended_results">
+ <a :href="result.id">{{result.label}}</a> ({{result.classification}})
+ </li>
+ </ul>
+ </div>
+</template>
+
+<script>
+import helpers from '../utils/helpers.js'
+export default {
+ name: 'SearchResults',
+ props: {
+ hits: Array
+ },
+ computed: {
+ extended_results: function(){
+ return this.hits.map(
+ function(hit){
+ return {
+ id: hit._id,
+ label: hit._source.lemmas.map(x => x.word).join(', '),
+ article: hit._source,
+ classification: helpers.group_list(hit._source.lemmas)
+ }
+ })
+ }
+ }
+}
+
+</script>
diff --git a/src/utils/helpers.js b/src/utils/helpers.js
new file mode 100644
index 00000000..460db5eb
--- /dev/null
+++ b/src/utils/helpers.js
@@ -0,0 +1,11 @@
+var group_list = function(grps) {
+ var grp_collection = new Set()
+ grps.forEach(function(lemma){
+ lemma.inflection_groups.forEach(function(grp){
+ grp_collection.add(grp.group_designation)
+ })
+ })
+ return Array.from(grp_collection).join(';')
+}
+
+export default { group_list}
--
GitLab