- autocomplete vor search inputs
- composer updates
This commit is contained in:
Arno Kaimbacher
parent
e3ea9847a3
commit
300c8a13a9
87
composer.lock
generated
87
composer.lock
generated
|
|
@ -1053,16 +1053,16 @@
|
|||
},
|
||||
{
|
||||
"name": "mcamara/laravel-localization",
|
||||
"version": "1.4.5",
|
||||
"version": "1.4.6",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/mcamara/laravel-localization.git",
|
||||
"reference": "4350fdbd4e4da04510a77cf9fd19614233c500f6"
|
||||
"reference": "72a22855d4617ad667eec2565540da2e7158c2c5"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/mcamara/laravel-localization/zipball/4350fdbd4e4da04510a77cf9fd19614233c500f6",
|
||||
"reference": "4350fdbd4e4da04510a77cf9fd19614233c500f6",
|
||||
"url": "https://api.github.com/repos/mcamara/laravel-localization/zipball/72a22855d4617ad667eec2565540da2e7158c2c5",
|
||||
"reference": "72a22855d4617ad667eec2565540da2e7158c2c5",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -1111,7 +1111,7 @@
|
|||
"localization",
|
||||
"php"
|
||||
],
|
||||
"time": "2019-10-17T20:28:46+00:00"
|
||||
"time": "2019-10-25T08:31:04+00:00"
|
||||
},
|
||||
{
|
||||
"name": "monolog/monolog",
|
||||
|
|
@ -1260,16 +1260,16 @@
|
|||
},
|
||||
{
|
||||
"name": "nikic/php-parser",
|
||||
"version": "v4.2.4",
|
||||
"version": "v4.2.5",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/nikic/PHP-Parser.git",
|
||||
"reference": "97e59c7a16464196a8b9c77c47df68e4a39a45c4"
|
||||
"reference": "b76bbc3c51f22c570648de48e8c2d941ed5e2cf2"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/nikic/PHP-Parser/zipball/97e59c7a16464196a8b9c77c47df68e4a39a45c4",
|
||||
"reference": "97e59c7a16464196a8b9c77c47df68e4a39a45c4",
|
||||
"url": "https://api.github.com/repos/nikic/PHP-Parser/zipball/b76bbc3c51f22c570648de48e8c2d941ed5e2cf2",
|
||||
"reference": "b76bbc3c51f22c570648de48e8c2d941ed5e2cf2",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -1277,6 +1277,7 @@
|
|||
"php": ">=7.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"ircmaxell/php-yacc": "0.0.4",
|
||||
"phpunit/phpunit": "^6.5 || ^7.0 || ^8.0"
|
||||
},
|
||||
"bin": [
|
||||
|
|
@ -1307,7 +1308,7 @@
|
|||
"parser",
|
||||
"php"
|
||||
],
|
||||
"time": "2019-09-01T07:51:21+00:00"
|
||||
"time": "2019-10-25T18:33:07+00:00"
|
||||
},
|
||||
{
|
||||
"name": "opis/closure",
|
||||
|
|
@ -1562,16 +1563,16 @@
|
|||
},
|
||||
{
|
||||
"name": "psr/log",
|
||||
"version": "1.1.0",
|
||||
"version": "1.1.1",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/php-fig/log.git",
|
||||
"reference": "6c001f1daafa3a3ac1d8ff69ee4db8e799a654dd"
|
||||
"reference": "bf73deb2b3b896a9d9c75f3f0d88185d2faa27e2"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/php-fig/log/zipball/6c001f1daafa3a3ac1d8ff69ee4db8e799a654dd",
|
||||
"reference": "6c001f1daafa3a3ac1d8ff69ee4db8e799a654dd",
|
||||
"url": "https://api.github.com/repos/php-fig/log/zipball/bf73deb2b3b896a9d9c75f3f0d88185d2faa27e2",
|
||||
"reference": "bf73deb2b3b896a9d9c75f3f0d88185d2faa27e2",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -1580,7 +1581,7 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"branch-alias": {
|
||||
"dev-master": "1.0.x-dev"
|
||||
"dev-master": "1.1.x-dev"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -1605,7 +1606,7 @@
|
|||
"psr",
|
||||
"psr-3"
|
||||
],
|
||||
"time": "2018-11-20T15:27:04+00:00"
|
||||
"time": "2019-10-25T08:06:51+00:00"
|
||||
},
|
||||
{
|
||||
"name": "psr/simple-cache",
|
||||
|
|
@ -3147,21 +3148,23 @@
|
|||
},
|
||||
{
|
||||
"name": "tijsverkoyen/css-to-inline-styles",
|
||||
"version": "2.2.1",
|
||||
"version": "2.2.2",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/tijsverkoyen/CssToInlineStyles.git",
|
||||
"reference": "0ed4a2ea4e0902dac0489e6436ebcd5bbcae9757"
|
||||
"reference": "dda2ee426acd6d801d5b7fd1001cde9b5f790e15"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/tijsverkoyen/CssToInlineStyles/zipball/0ed4a2ea4e0902dac0489e6436ebcd5bbcae9757",
|
||||
"reference": "0ed4a2ea4e0902dac0489e6436ebcd5bbcae9757",
|
||||
"url": "https://api.github.com/repos/tijsverkoyen/CssToInlineStyles/zipball/dda2ee426acd6d801d5b7fd1001cde9b5f790e15",
|
||||
"reference": "dda2ee426acd6d801d5b7fd1001cde9b5f790e15",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"ext-dom": "*",
|
||||
"ext-libxml": "*",
|
||||
"php": "^5.5 || ^7.0",
|
||||
"symfony/css-selector": "^2.7 || ^3.0 || ^4.0"
|
||||
"symfony/css-selector": "^2.7 || ^3.0 || ^4.0 || ^5.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"phpunit/phpunit": "^4.8.35 || ^5.7 || ^6.0"
|
||||
|
|
@ -3190,7 +3193,7 @@
|
|||
],
|
||||
"description": "CssToInlineStyles is a class that enables you to convert HTML-pages/files into HTML-pages/files with inline styles. This is very useful when you're sending emails.",
|
||||
"homepage": "https://github.com/tijsverkoyen/CssToInlineStyles",
|
||||
"time": "2017-11-27T11:13:29+00:00"
|
||||
"time": "2019-10-24T08:53:34+00:00"
|
||||
},
|
||||
{
|
||||
"name": "vlucas/phpdotenv",
|
||||
|
|
@ -3251,16 +3254,16 @@
|
|||
},
|
||||
{
|
||||
"name": "yajra/laravel-datatables-oracle",
|
||||
"version": "v9.7.0",
|
||||
"version": "v9.7.1",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/yajra/laravel-datatables.git",
|
||||
"reference": "bb6ff7b76bd6253396cb7a5a7b6c51c5ab14b1a8"
|
||||
"reference": "787eb04e59d754c453e6ed4185073195bc01d967"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/yajra/laravel-datatables/zipball/bb6ff7b76bd6253396cb7a5a7b6c51c5ab14b1a8",
|
||||
"reference": "bb6ff7b76bd6253396cb7a5a7b6c51c5ab14b1a8",
|
||||
"url": "https://api.github.com/repos/yajra/laravel-datatables/zipball/787eb04e59d754c453e6ed4185073195bc01d967",
|
||||
"reference": "787eb04e59d754c453e6ed4185073195bc01d967",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -3318,7 +3321,7 @@
|
|||
"jquery",
|
||||
"laravel"
|
||||
],
|
||||
"time": "2019-10-02T05:58:48+00:00"
|
||||
"time": "2019-10-24T03:50:05+00:00"
|
||||
},
|
||||
{
|
||||
"name": "zizaco/entrust",
|
||||
|
|
@ -4491,16 +4494,16 @@
|
|||
},
|
||||
{
|
||||
"name": "phpunit/phpunit",
|
||||
"version": "7.5.16",
|
||||
"version": "7.5.17",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/sebastianbergmann/phpunit.git",
|
||||
"reference": "316afa6888d2562e04aeb67ea7f2017a0eb41661"
|
||||
"reference": "4c92a15296e58191a4cd74cff3b34fc8e374174a"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/sebastianbergmann/phpunit/zipball/316afa6888d2562e04aeb67ea7f2017a0eb41661",
|
||||
"reference": "316afa6888d2562e04aeb67ea7f2017a0eb41661",
|
||||
"url": "https://api.github.com/repos/sebastianbergmann/phpunit/zipball/4c92a15296e58191a4cd74cff3b34fc8e374174a",
|
||||
"reference": "4c92a15296e58191a4cd74cff3b34fc8e374174a",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -4571,7 +4574,7 @@
|
|||
"testing",
|
||||
"xunit"
|
||||
],
|
||||
"time": "2019-09-14T09:08:39+00:00"
|
||||
"time": "2019-10-28T10:37:36+00:00"
|
||||
},
|
||||
{
|
||||
"name": "sebastian/code-unit-reverse-lookup",
|
||||
|
|
@ -5141,16 +5144,16 @@
|
|||
},
|
||||
{
|
||||
"name": "seld/jsonlint",
|
||||
"version": "1.7.1",
|
||||
"version": "1.7.2",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/Seldaek/jsonlint.git",
|
||||
"reference": "d15f59a67ff805a44c50ea0516d2341740f81a38"
|
||||
"reference": "e2e5d290e4d2a4f0eb449f510071392e00e10d19"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/Seldaek/jsonlint/zipball/d15f59a67ff805a44c50ea0516d2341740f81a38",
|
||||
"reference": "d15f59a67ff805a44c50ea0516d2341740f81a38",
|
||||
"url": "https://api.github.com/repos/Seldaek/jsonlint/zipball/e2e5d290e4d2a4f0eb449f510071392e00e10d19",
|
||||
"reference": "e2e5d290e4d2a4f0eb449f510071392e00e10d19",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -5186,7 +5189,7 @@
|
|||
"parser",
|
||||
"validator"
|
||||
],
|
||||
"time": "2018-01-24T12:46:19+00:00"
|
||||
"time": "2019-10-24T14:27:39+00:00"
|
||||
},
|
||||
{
|
||||
"name": "seld/phar-utils",
|
||||
|
|
@ -5234,16 +5237,16 @@
|
|||
},
|
||||
{
|
||||
"name": "squizlabs/php_codesniffer",
|
||||
"version": "3.5.1",
|
||||
"version": "3.5.2",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/squizlabs/PHP_CodeSniffer.git",
|
||||
"reference": "82cd0f854ceca17731d6d019c7098e3755c45060"
|
||||
"reference": "65b12cdeaaa6cd276d4c3033a95b9b88b12701e7"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/squizlabs/PHP_CodeSniffer/zipball/82cd0f854ceca17731d6d019c7098e3755c45060",
|
||||
"reference": "82cd0f854ceca17731d6d019c7098e3755c45060",
|
||||
"url": "https://api.github.com/repos/squizlabs/PHP_CodeSniffer/zipball/65b12cdeaaa6cd276d4c3033a95b9b88b12701e7",
|
||||
"reference": "65b12cdeaaa6cd276d4c3033a95b9b88b12701e7",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
|
|
@ -5281,7 +5284,7 @@
|
|||
"phpcs",
|
||||
"standards"
|
||||
],
|
||||
"time": "2019-10-16T21:14:26+00:00"
|
||||
"time": "2019-10-28T04:36:32+00:00"
|
||||
},
|
||||
{
|
||||
"name": "symfony/filesystem",
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
; Override value of upload_max_filesize
|
||||
upload_max_filesize = 6M
|
||||
post_max_size =6M
|
||||
memory_limit = 100M
|
||||
upload_max_filesize = 100M
|
||||
post_max_size = 100M
|
||||
memory_limit = 128M
|
||||
2
public/backend/ckeditor.js
vendored
2
public/backend/ckeditor.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -22,7 +22,7 @@
|
|||
<!-- Search input section -->
|
||||
<div class="row">
|
||||
<div class="twelve columns">
|
||||
<vs-input @search="onSearch"></vs-input>
|
||||
<vs-input @search="onSearch" title="searching solr datasets" placeholder="Enter your search term..."></vs-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ export default class App extends Vue {
|
|||
numFound: number;
|
||||
|
||||
async onPaginate(start: number): Promise<void> {
|
||||
console.log(start);
|
||||
// console.log(start);
|
||||
var res = await rdrApi.search(this.searchTerm, this.activeFilterItems, start.toString());
|
||||
this.results = res.response.docs;
|
||||
}
|
||||
|
|
@ -65,9 +65,9 @@ export default class App extends Vue {
|
|||
if (filter.value == facetValue) {
|
||||
rObj = filter;
|
||||
} else if (this.facets[prop].some(e => e.value === facetValue)) {
|
||||
console.log(facetValue + " is included")
|
||||
// console.log(facetValue + " is included")
|
||||
var indexOfFacetValue = this.facets[prop].findIndex(i => i.value === facetValue);
|
||||
console.log(indexOfFacetValue);
|
||||
// console.log(indexOfFacetValue);
|
||||
rObj = this.facets[prop][indexOfFacetValue];
|
||||
rObj.count = facet_fields[prop][i + 1];
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -32,12 +32,12 @@ export default {
|
|||
var limit = "&rows=" + SOLR_CONFIG["limit"];
|
||||
// var limit = solrConfig.limit;
|
||||
|
||||
var dismaxFields = "title^3 abstract^2 subject^1";
|
||||
var qfFields = "title^3 author^3 subject^2";
|
||||
var params = "fl=" + fields;
|
||||
if (term == "*%3A*") {
|
||||
params += "&defType=edismax&wt=json&indent=on"; //edismax
|
||||
} else {
|
||||
params += "&defType=dismax&qf=" + dismaxFields + "&wt=json&indent=on"; //dismax
|
||||
params += "&defType=dismax&qf=" + qfFields + "&wt=json&indent=on"; //dismax
|
||||
}
|
||||
|
||||
if (start === undefined) start = "0";
|
||||
|
|
@ -70,6 +70,39 @@ export default {
|
|||
let res = await axios.get(api);
|
||||
// let { data } = res.data;
|
||||
return res.data;//.response;//.docs;
|
||||
},
|
||||
|
||||
async searchTerm(term: string): Promise<any> {
|
||||
// solr endpoint
|
||||
// const host = 'http://voyagerdemo.com/';
|
||||
const host = 'https://repository.geologie.ac.at/';
|
||||
const path = 'solr/rdr_data/select?';
|
||||
var base = host + path;
|
||||
|
||||
//const fields = 'id,server_date_published,abstract_output,title_output,title_additional,author,subject'; // fields we want returned
|
||||
var fields = ["id",
|
||||
"server_date_published",
|
||||
"abstract_output",
|
||||
"title_output",
|
||||
"title_additional",
|
||||
"author",
|
||||
"subject"].toString();
|
||||
|
||||
|
||||
//var dismaxFields = "title^3 abstract^2 subject^1";
|
||||
var qfFields = "title^3 author^2 subject^1";
|
||||
var params = "fl=" + fields;
|
||||
// if (term == "*%3A*") {
|
||||
// params += "&defType=edismax&wt=json&indent=on"; //edismax
|
||||
// } else {
|
||||
params += "&defType=edismax&qf=" + qfFields + "&wt=json&indent=on"; //dismax
|
||||
// }
|
||||
|
||||
var query = "&q=" + term + "*";
|
||||
var api = base + params + query;
|
||||
|
||||
let res = await axios.get(api);
|
||||
return res.data;//.response;//.docs;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { Vue, Component, Prop } from 'vue-property-decorator';
|
||||
// import Vue from "vue";
|
||||
import { Component, Prop } from 'vue-property-decorator';
|
||||
import Vue from "vue";
|
||||
|
||||
@Component
|
||||
export default class VsPagination extends Vue {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,263 @@
|
|||
import Vue from "vue";
|
||||
import { Component, Provide } from "vue-property-decorator";
|
||||
import { Component, Prop, Watch } from 'vue-property-decorator';
|
||||
import debounce from 'lodash/debounce';
|
||||
import rdrApi from '../search-results/dataservice';
|
||||
|
||||
|
||||
|
||||
@Component({})
|
||||
export default class VsInput extends Vue {
|
||||
term = "";
|
||||
|
||||
@Prop()
|
||||
title: string;
|
||||
|
||||
@Prop({ default: 'Search' })
|
||||
placeholder: string;
|
||||
|
||||
display: string = "";
|
||||
value = null;
|
||||
error: string = null;
|
||||
//search: null,
|
||||
results: Array<any> = [];
|
||||
// suggestions: Object = {};
|
||||
//showResults: boolean = false;
|
||||
loading: boolean = false;
|
||||
isAsync: boolean = true;
|
||||
items: Array<any> = [];
|
||||
selectedIndex: number = null;
|
||||
selectedDisplay = null;
|
||||
isFocussed: boolean = false;
|
||||
|
||||
// get results() {
|
||||
// return this.items;
|
||||
// }
|
||||
|
||||
get showResults(): boolean {
|
||||
return this.results.length > 0;
|
||||
}
|
||||
|
||||
get noResults(): boolean {
|
||||
return Array.isArray(this.results) && this.results.length === 0
|
||||
}
|
||||
|
||||
get isLoading(): boolean {
|
||||
return this.loading === true
|
||||
}
|
||||
|
||||
get hasError(): boolean {
|
||||
return this.error !== null
|
||||
}
|
||||
|
||||
get suggestions(): any[] {
|
||||
var suggestion = {
|
||||
titles: [],
|
||||
authors: [],
|
||||
subjects: []
|
||||
};
|
||||
|
||||
for (let key in this.results) {
|
||||
let obj = this.results[key];
|
||||
|
||||
if (obj["title_output"].toLowerCase().indexOf(this.display) !== -1) {
|
||||
var title = obj["title_output"];
|
||||
if (!suggestion["titles"].find(value => value === title)) {
|
||||
suggestion.titles.push(title);
|
||||
}
|
||||
}
|
||||
if (this.find(obj["author"], this.display.toLowerCase()) !== "") {
|
||||
var author = this.find(obj["author"], this.display.toLowerCase());
|
||||
if (!suggestion["authors"].find(value => value === author)) {
|
||||
suggestion.authors.push(author);
|
||||
}
|
||||
|
||||
}
|
||||
if (this.find(obj["subject"], this.display.toLowerCase()) != "") {
|
||||
var subject = this.find(obj["subject"], this.display.toLowerCase());
|
||||
if (!suggestion["subjects"].find(value => value === subject)) {
|
||||
suggestion.subjects.push(subject);
|
||||
}
|
||||
}
|
||||
}
|
||||
var suggestions = Array.prototype.concat(suggestion.titles, suggestion.authors, suggestion.subjects);
|
||||
return suggestions;
|
||||
}
|
||||
|
||||
// @Watch('items')
|
||||
// onItemsChanged(val: Array<any>, oldVal: Array<any>) {
|
||||
// this.results = val;
|
||||
// this.loading = false;
|
||||
// }
|
||||
|
||||
// reset() {
|
||||
// this.display = "";
|
||||
// this.items = [];
|
||||
// this.showResults = false;
|
||||
// }
|
||||
/**
|
||||
* Clear all values, results and errors
|
||||
*/
|
||||
clear() {
|
||||
this.display = null;
|
||||
// this.value = null
|
||||
this.results = [];
|
||||
this.error = null;
|
||||
this.$emit('clear');
|
||||
}
|
||||
|
||||
search() {
|
||||
this.$emit("search", this.term);
|
||||
this.$emit("search", this.display);
|
||||
}
|
||||
|
||||
|
||||
searchChanged() {
|
||||
this.selectedIndex = null
|
||||
// Let's warn the parent that a change was made
|
||||
// this.$emit("input", this.display);
|
||||
if (this.display.length >= 2) {
|
||||
this.loading = true;
|
||||
this.resourceSearch();
|
||||
} else {
|
||||
this.results = [];
|
||||
}
|
||||
}
|
||||
|
||||
resourceSearch = debounce(function () {
|
||||
if (!this.display) {
|
||||
this.results = []
|
||||
return
|
||||
}
|
||||
this.loading = true;
|
||||
// this.setEventListener();
|
||||
this.request();
|
||||
}, 200);
|
||||
|
||||
async request() {
|
||||
try {
|
||||
var res = await rdrApi.searchTerm(this.display);
|
||||
this.error = null
|
||||
this.results = res.response.docs;
|
||||
this.loading = false;
|
||||
} catch (error) {
|
||||
this.error = error.message;
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Register the component as focussed
|
||||
*/
|
||||
focus() {
|
||||
this.isFocussed = true
|
||||
}
|
||||
/**
|
||||
* Remove the focussed value
|
||||
*/
|
||||
blur() {
|
||||
this.isFocussed = false
|
||||
}
|
||||
|
||||
/**
|
||||
* Is this item selected?
|
||||
* @param {Object}
|
||||
* @return {Boolean}
|
||||
*/
|
||||
isSelected(key) {
|
||||
return key === this.selectedIndex
|
||||
}
|
||||
|
||||
onArrowDown(ev) {
|
||||
ev.preventDefault()
|
||||
if (this.selectedIndex === null) {
|
||||
this.selectedIndex = 0;
|
||||
return;
|
||||
}
|
||||
this.selectedIndex = (this.selectedIndex === this.suggestions.length - 1) ? 0 : this.selectedIndex + 1;
|
||||
this.fixScrolling();
|
||||
}
|
||||
|
||||
fixScrolling() {
|
||||
const currentElement = this.$refs.options[this.selectedIndex];
|
||||
currentElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' });
|
||||
}
|
||||
|
||||
onArrowUp(ev) {
|
||||
ev.preventDefault()
|
||||
if (this.selectedIndex === null) {
|
||||
this.selectedIndex = this.suggestions.length - 1;
|
||||
return;
|
||||
}
|
||||
this.selectedIndex = (this.selectedIndex === 0) ? this.suggestions.length - 1 : this.selectedIndex - 1;
|
||||
this.fixScrolling();
|
||||
}
|
||||
|
||||
onEnter() {
|
||||
if (this.selectedIndex === null) {
|
||||
this.$emit('nothingSelected', this.display);
|
||||
return;
|
||||
}
|
||||
this.select(this.suggestions[this.selectedIndex]);
|
||||
this.$emit('enter', this.display);
|
||||
}
|
||||
|
||||
select(obj) {
|
||||
if (!obj) {
|
||||
return
|
||||
}
|
||||
this.value = obj; //(obj["title_output"]) ? obj["title_output"] : obj.id
|
||||
this.display = obj;// this.formatDisplay(obj)
|
||||
this.selectedDisplay = this.display
|
||||
// this.$emit('selected', {
|
||||
// value: this.value,
|
||||
// display: this.display,
|
||||
// selectedObject: obj
|
||||
// })
|
||||
this.$emit('input', this.value);
|
||||
this.$emit("search", this.value);
|
||||
// alert(this.value);
|
||||
this.close();
|
||||
}
|
||||
|
||||
formatDisplay(obj) {
|
||||
if (obj.title_output.toLowerCase().indexOf(this.display) !== -1) {
|
||||
return obj.title_output;
|
||||
} else if (this.find(obj.author, this.display.toLowerCase()) !== "") {
|
||||
var author = this.find(obj.author, this.display.toLowerCase());
|
||||
return author;
|
||||
} else if (this.find(obj.subject, this.display.toLowerCase()) != "") {
|
||||
return this.find(obj.subject, this.display.toLowerCase());
|
||||
} else {
|
||||
return obj.id;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
find(myarray, searchterm): string {
|
||||
for (var i = 0, len = myarray.length; i < len; i += 1) {
|
||||
if (typeof (myarray[i]) === 'string' && myarray[i].toLowerCase().indexOf(searchterm) !== -1) {
|
||||
// print or whatever
|
||||
return myarray[i];
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Close the results list. If nothing was selected clear the search
|
||||
*/
|
||||
close() {
|
||||
if (!this.value || !this.selectedDisplay) {
|
||||
this.clear();
|
||||
}
|
||||
if (this.selectedDisplay !== this.display && this.value) {
|
||||
this.display = this.selectedDisplay;
|
||||
}
|
||||
this.results = [];
|
||||
this.error = null;
|
||||
//this.removeEventListener()
|
||||
this.$emit('close');
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,13 +1,18 @@
|
|||
<template>
|
||||
<div class="sidebar-simplesearch">
|
||||
<!-- <form method="GET" action="//repository.geologie.ac.at/search" accept-charset="UTF-8"> -->
|
||||
<div>
|
||||
<!-- v-on:keyup.enter="search()" -->
|
||||
<div class="autocomplete__box">
|
||||
<input
|
||||
class="search-input"
|
||||
placeholder="Enter your search term..."
|
||||
class="search-input"
|
||||
name="q"
|
||||
type="text"
|
||||
v-model="term" v-on:keyup.enter="search()"
|
||||
v-model="display"
|
||||
@input="searchChanged"
|
||||
v-bind:title="title"
|
||||
v-bind:placeholder="placeholder"
|
||||
v-on:keydown.down="onArrowDown" v-on:keydown.up="onArrowUp" v-on:keydown.enter="onEnter" @keydown.tab="close"
|
||||
v-on:focus="focus"
|
||||
/>
|
||||
|
||||
<!-- <button @click="search()" class="css-1gklxk5 ekqohx90"> -->
|
||||
|
|
@ -26,6 +31,27 @@
|
|||
/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<!-- clearButtonIcon -->
|
||||
<!-- <span v-show="!isLoading" class="autocomplete__icon autocomplete--clear" @click="clear">
|
||||
<img src="../assets/close.svg">
|
||||
</span> -->
|
||||
|
||||
<ul class="autocomplete-results pure-u-23-24" v-show="showResults">
|
||||
<li class="loading" v-if="isLoading">Loading results...</li>
|
||||
|
||||
<li
|
||||
v-else
|
||||
v-for="(result, key) in suggestions"
|
||||
:key="key"
|
||||
class="autocomplete-result-item"
|
||||
:class="{'is-active' : isSelected(key) }"
|
||||
@click.prevent="select(result)"
|
||||
ref="options"
|
||||
>
|
||||
<strong> {{ result }}</strong>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -37,11 +63,51 @@
|
|||
|
||||
// @Component({})
|
||||
// export default class VsInput extends Vue {
|
||||
// term = "";
|
||||
// term = "";
|
||||
// search() {
|
||||
// this.$emit("search", this.term);
|
||||
// }
|
||||
// }
|
||||
import VsInput from "./vs-input-class";
|
||||
export default VsInput;
|
||||
</script>
|
||||
</script>
|
||||
|
||||
|
||||
<style>
|
||||
.sidebar-simplesearch {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.autocomplete-results {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 1px solid #eeeeee;
|
||||
list-style-type: none;
|
||||
z-index: 1000;
|
||||
position: absolute;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
background: white;
|
||||
width: 100%;
|
||||
border: 1px solid #ccc;
|
||||
border-top: 0;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.autocomplete-result-item {
|
||||
list-style: none;
|
||||
text-align: left;
|
||||
padding: 7px 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.autocomplete-result-item.is-active {
|
||||
background: rgba(0, 180, 255, 0.15);
|
||||
}
|
||||
|
||||
.autocomplete-result-item:hover {
|
||||
background: rgba(0, 180, 255, 0.075);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user