geolba/tethys.frontend
6
0
Fork 1
Code Issues 7 Pull Requests Packages Projects 3 Releases 1 Wiki Activity

Comments added and commented code removed

Browse Source
This commit is contained in:
Porras-Bernardez 2024-05-08 17:11:55 +02:00
parent 3dbb04d737
commit 85ab6fb8cc
9 changed files with 40 additions and 401 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.vue
View File

@ -1,6 +1,8 @@
<template> <template>
<div class="container-fluid"> <div class="container-fluid">
<div class="development-notice">-- DEVELOPMENT SITE -- [Only for development purposes]</div> <div class="development-notice">
DEVELOPMENT SITE <br> >> Only for development purposes <<
</div>
</div> </div>
<!-- <HelloWorld msg="Welcome to Your Vue.js plus TypeScript App" /> --> <!-- <HelloWorld msg="Welcome to Your Vue.js plus TypeScript App" /> -->
<nav class="navbar navbar-light border-bottom" role="navigation" aria-label="main navigation"> <nav class="navbar navbar-light border-bottom" role="navigation" aria-label="main navigation">

31
src/api/api.ts
View File

@ -1,7 +1,6 @@
import initializeAxios from "./axiosSetup"; import initializeAxios from "./axiosSetup";
import { axiosRequestConfiguration } from "./config"; import { axiosRequestConfiguration } from "./config";
import { map } from "rxjs/operators"; import { map } from "rxjs/operators";
// import { Observable } from "@reactivex/rxjs/compat";
import { defer, Observable } from "rxjs"; import { defer, Observable } from "rxjs";
import { AxiosResponse } from "axios"; import { AxiosResponse } from "axios";
// https://ichi.pro/de/so-wickeln-sie-axios-mit-typescript-und-react-in-rxjs-ein-118892823169891 // https://ichi.pro/de/so-wickeln-sie-axios-mit-typescript-und-react-in-rxjs-ein-118892823169891
@ -13,34 +12,4 @@ const get = <T>(url: string, queryParams?: any): Observable<T> => {
return defer(() => axiosInstance.get<T>(url, { params: queryParams })).pipe(map((result: AxiosResponse) => result.data)); return defer(() => axiosInstance.get<T>(url, { params: queryParams })).pipe(map((result: AxiosResponse) => result.data));
}; };
// const post = <T>(url: string, body: object, queryParams?: any): Observable<T | void> => {
// return defer(() => axiosInstance.post<T>(url, body, { params: queryParams })).pipe(map((result: AxiosResponse) => result.data));
// };
// const put = <T>(
// url: string,
// body: object,
// queryParams?: object
// ): Observable<T | void> => {
// return defer(() =>
// axiosInstance.put<T>(url, body, { params: queryParams })
// ).pipe(map((result) => result.data));
// };
// const patch = <T>(
// url: string,
// body: object,
// queryParams?: object
// ): Observable<T | void> => {
// return defer(() =>
// axiosInstance.patch<T>(url, body, { params: queryParams })
// ).pipe(map((result) => result.data));
// };
// const deleteR = <T>(url: string, id: number): Observable<T | void> => {
// return defer(() => axiosInstance.delete(`${url}/${id}`)).pipe(
// map((result) => result.data)
// );
// };
export default { get }; export default { get };

14
src/api/axiosSetup.ts
View File

@ -1,20 +1,12 @@
import axios, { AxiosRequestConfig, AxiosInstance } from "axios"; import axios, { AxiosRequestConfig, AxiosInstance } from "axios";
const initialization = (config: AxiosRequestConfig): AxiosInstance => { const initialization = (config: AxiosRequestConfig): AxiosInstance => {
//axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
delete axios.defaults.headers.common["X-Requested-With"]; delete axios.defaults.headers.common["X-Requested-With"];
// axios.defaults.withCredentials = true;
// const token = document.head.querySelector('meta[name="csrf-token"]');
// if (token) {
// axios.defaults.headers.common["X-CSRF-TOKEN"] = token.innerHTML;
// }
const axiosInstance = axios.create(config);
/* const axiosInstance = axios.create(config);
Add default headers, interceptors etc..
*/
return axiosInstance; return axiosInstance;
}; };
export default initialization; export default initialization;

23
src/api/config.ts
View File

@ -1,31 +1,16 @@
import { AxiosRequestConfig } from "axios"; import { AxiosRequestConfig } from "axios";
import { stringify } from "qs"; import { stringify } from "qs";
// let headers: AxiosRequestConfig['headers'] = /* This file configures Axios to send requests with the specified headers and parameters serialization format for URL-encoded form data */
// headers['Content-Type'] = 'multipart/form-data';
export const axiosRequestConfiguration: AxiosRequestConfig = { export const axiosRequestConfiguration: AxiosRequestConfig = {
// responseType: "text",
// headers: {
// // "Content-Type": "text/plain",
// "Content-Type": "application/x-www-form-urlencoded",
// // "Content-Type": "application/x-www-form-urlencoded",
// // credentials: "same-origin",
// // "Access-Control-Allow-Credentials": "true",
// // "Access-Control-Allow-Origin": "*",
// },
headers: { headers: {
//: AxiosHeaders | Partial<RawAxiosHeaders & MethodsHeaders & CommonHeaders> | undefined
"Content-Type": "application/x-www-form-urlencoded", "Content-Type": "application/x-www-form-urlencoded",
}, },
// headers: {
// "Content-type": "application/json; charset=UTF-8",
// },
// paramsSerializer: {
// indexes: null, // by default: false
// },
paramsSerializer: { paramsSerializer: {
/* The serialize function takes an object of key-value pairs as input and uses the qs.stringify method to convert it into a URL-encoded string.
The arrayFormat: "repeat" option specifies how arrays should be serialized in the URL parameters. */
serialize: (params: Record<string, number>) => { serialize: (params: Record<string, number>) => {
return stringify(params, { arrayFormat: "repeat" }); return stringify(params, { arrayFormat: "repeat" });
}, },

27
src/components/vs-result/vs-result.vue
View File

@ -3,43 +3,18 @@
<div class="card result-list-container"> <div class="card result-list-container">
<div class="card-content record-elem"> <div class="card-content record-elem">
<p v-if="document.identifier && document.identifier.length > 0"> <p v-if="document.identifier && document.identifier.length > 0">
<!-- <span>Author: {{ document.identifier.join(', ') }}</span> -->
<!-- <span v-for="(author,index) in document.author" :key="index">{{ author }}; </span> -->
<!-- <span>'https://doi.org/' + {{ document.identifier[0] }}</span> -->
<a target="_blank" v-bind:href="'https://doi.org/' + document.identifier[0]"> <a target="_blank" v-bind:href="'https://doi.org/' + document.identifier[0]">
{{ "https://doi.org/" + document.identifier[0] + " &#10148;" }} </a {{ "https://doi.org/" + document.identifier[0] + " &#10148;" }} </a
>&nbsp; >&nbsp;
<span v-if="document.author && document.author.length > 0" class="disabled">{{ document.author[0] }}</span> <span v-if="document.author && document.author.length > 0" class="disabled">{{ document.author[0] }}</span>
</p> </p>
<!-- <span class="label label-info" data-container="div" data-title="Publication date">
{{ convert(document.server_date_published) }}
</span>
<span class="label label-default ng-binding">{{ document.doctype }}</span>
<span v-if="openAccessLicences.includes(document.licence)" class="label label-success titlecase">Open Access</span> -->
<h4> <h4>
<!-- <a
v-if="document.identifier && document.identifier.length > 0"
target="_self"
v-bind:href="'https://doi.' + getDomainWithoutSubdomain() + '/' + document.identifier[0]"
class="ng-binding"
>
{{ document.title_output }}
</a> -->
<!-- <a target="_self" v-bind:href="'dataset/' + document.id" class="ng-binding">
{{ document.title_output }}
</a> -->
<router-link class="ng-binding" v-bind:to="{ name: 'dataset', params: { datasetId: document.id } }">{{ <router-link class="ng-binding" v-bind:to="{ name: 'dataset', params: { datasetId: document.id } }">{{
document.title_output document.title_output
}}</router-link> }}</router-link>
</h4> </h4>
<!-- <p v-if="document.author && document.author.length > 0">
<span>Author: {{ document.author.join(', ') }}</span>
<span v-for="(author, index) in document.author" :key="index">{{ author }}; </span>
</p> -->
<p class="clamped clamped-2"> <p class="clamped clamped-2">
<span class="disabled" data-container="div" data-title="Publication date"> <span class="disabled" data-container="div" data-title="Publication date">
{{ convert(document.server_date_published) + ":&nbsp;" }} {{ convert(document.server_date_published) + ":&nbsp;" }}
@ -53,11 +28,9 @@
<p> <p>
<span class="label"><i class="fas fa-file"></i> {{ document.doctype }}</span> <span class="label"><i class="fas fa-file"></i> {{ document.doctype }}</span>
<!-- <span>Licence: {{ document.licence }}</span> -->
<span v-if="openAccessLicences.includes(document.licence)" class="label titlecase"><i class="fas fa-lock-open"></i> Open Access</span> <span v-if="openAccessLicences.includes(document.licence)" class="label titlecase"><i class="fas fa-lock-open"></i> Open Access</span>
</p> </p>
<!-- <span class="label label-keyword titlecase" v-for="(item, index) in document.subject" :key="index"> #{{ item }} </span> -->
</div> </div>
</div> </div>
</div> </div>

12
src/models/headers.ts
View File

@ -39,24 +39,12 @@ export interface ResponseContent {
docs: Array<Dataset>; docs: Array<Dataset>;
} }
// export interface FacetCount {
// facet_fields: FacetCategory<any>;
// }
// export class FacetCategory<T> {
// [key: string]: {
// values: T[];
// };
// }
export class FacetResults { export class FacetResults {
// language!: Array<FacetItem>; // language!: Array<FacetItem>;
// subject!: Array<FacetItem>; // subject!: Array<FacetItem>;
[key: string]: Array<FacetItem>; [key: string]: Array<FacetItem>;
} }
//#region solr response facets
export class FacetFields { export class FacetFields {
// count: number; // count: number;
language!: FacetInstance; language!: FacetInstance;

219
src/services/dataset.service.ts
View File

@ -6,21 +6,21 @@ import { Dataset, DbDataset, Suggestion } from "@/models/dataset";
import { SolrResponse } from "@/models/headers"; import { SolrResponse } from "@/models/headers";
import { ActiveFilterCategories } from "@/models/solr"; import { ActiveFilterCategories } from "@/models/solr";
import { VUE_API } from "@/constants"; import { VUE_API } from "@/constants";
// import { deserialize, instanceToInstance } from "class-transformer";
import { deserialize } from "class-transformer"; import { deserialize } from "class-transformer";
// import { OAI_DATASETS } from "./mock-oai-datasets";
// import { OaiDataset, OaiPerson } from "@/models/oai";
// import xml2js from "xml2js";
class DatasetService { class DatasetService {
/* https://tethys.at/solr/rdr_data/select?&0=fl%3Did%2Clicence%2Cserver_date_published%2Cabstract_output%2Cidentifier%2Ctitle_output%2Ctitle_additional%2Cauthor%2Csubject%2Cdoctype&q=%2A
&q.op=or&defType=edismax&qf=title%5E3%20author%5E2%20subject%5E1&indent=on&wt=json&rows=10&start=0&sort=server_date_published%20desc&facet=on&json.facet.language=%7B%20type%3A%20%22
terms%22%2C%20field%3A%20%22language%22%20%7D&json.facet.subject=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22subject%22%2C%20limit%3A%20-1%20%7D&json.facet.year=%7B%20type%3A%20%22
terms%22%2C%20field%3A%20%22year%22%20%7D&json.facet.author=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22author_facet%22%2C%20limit%3A%20-1%20%7D
*/
// for the autocomplete search // for the autocomplete search
public searchTerm(term: string, solrCore: string, solrHost: string): Observable<Dataset[]> { public searchTerm(term: string, solrCore: string, solrHost: string): Observable<Dataset[]> {
// solr endpoint // solr endpoint
// const host = 'http://voyagerdemo.com/';
// const host = 'https://www.tethys.at/';''
const host = "https://" + solrHost; const host = "https://" + solrHost;
const path = "/solr/" + solrCore + "/select?"; const path = "/solr/" + solrCore + "/select?";
// const base = "https://geomon.geologie.ac.at/52n-sos-webapp/api/features"; //host + path;
const base = host + path; const base = host + path;
//const fields = 'id,server_date_published,abstract_output,title_output,title_additional,author,subject'; // fields we want returned //const fields = 'id,server_date_published,abstract_output,title_output,title_additional,author,subject'; // fields we want returned
@ -36,17 +36,8 @@ class DatasetService {
"doctype", "doctype",
].toString(); ].toString();
//var dismaxFields = "title^3 abstract^2 subject^1";
const qfFields = "title^3 author^2 subject^1";
// let 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
// // }
// const query = "&q=" + term + "*"; const qfFields = "title^3 author^2 subject^1";
// const apiU = base + params + query;
const q_params = { const q_params = {
"0": "fl=" + fields, "0": "fl=" + fields,
@ -62,22 +53,26 @@ class DatasetService {
return stations; return stations;
} }
/* Only one facet => Author: Coric, Stjepan (16)
https://tethys.at/solr/rdr_data/select?&0=fl%3Did%2Clicence%2Cserver_date_published%2Cabstract_output%2Cidentifier%2Ctitle_output%2Ctitle_additional%2Cauthor%2Csubject%2Cdoctype&q=%2A
&q.op=or&defType=edismax&qf=title%5E3%20author%5E2%20subject%5E1&indent=on&wt=json&rows=10&fq=author%3A%28%22Coric%2C%20Stjepan%22%29&start=0&sort=server_date_published%20desc&facet=on
&json.facet.language=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22language%22%20%7D
&json.facet.subject=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22subject%22%2C%20limit%3A%20-1%20%7D
&json.facet.year=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22year%22%20%7D
&json.facet.author=%7B%20type%3A%20%22terms%22%2C%20field%3A%20%22author_facet%22%2C%20limit%3A%20-1%20%7D */
public facetedSearch( public facetedSearch(
suggestion: Suggestion | string, suggestion: Suggestion | string,
activeFilterCategories: ActiveFilterCategories, activeFilterCategories: ActiveFilterCategories,
solrCore: string, solrCore: string,
solrHost: string, solrHost: string,
start?: string, start?: string, // Starting page
): Observable<SolrResponse> { ): Observable<SolrResponse> {
// solr endpoint
// const host = 'http://voyagerdemo.com/';
//const host = 'https://www.tethys.at/';
//const host = 'https://' + solrHost;
const host = "https://" + solrHost; const host = "https://" + solrHost;
const path = "/solr/" + solrCore + "/select?"; const path = "/solr/" + solrCore + "/select?";
const base = host + path; const base = host + path;
//const fields = 'id,server_date_published,abstract_output,title_output,title_additional,author,subject'; // fields we want returned
const fields = [ const fields = [
"id", "id",
"licence", "licence",
@ -91,14 +86,6 @@ class DatasetService {
"doctype", "doctype",
].toString(); ].toString();
// const qfFields = "title^3 author^2 subject^1";
// let params = "fl=" + fields;
// if (term == "*%3A*") {
// params += "&defType=edismax&wt=json&indent=on"; //edismax
// } else {
// params += "&defType=dismax&qf=" + qfFields + "&wt=json&indent=on"; //dismax
// }
let term, queryOperator, qfFields; let term, queryOperator, qfFields;
if (typeof suggestion === "string") { if (typeof suggestion === "string") {
term = suggestion + "*"; term = suggestion + "*";
@ -111,34 +98,20 @@ class DatasetService {
} }
if (start === undefined) start = "0"; if (start === undefined) start = "0";
// start = "&start=" + start;
// const facetFields =
// "&facet=on&facet.field=language&facet.field={!key=datatype}doctype&facet.field=subject"; //&fq=year:(2019)";//&facet.query=year:2018";
const filterFields = new Array<string>(); const filterFields = new Array<string>();
if (Object.keys(activeFilterCategories).length > 0) { if (Object.keys(activeFilterCategories).length > 0) {
// filterFields = '["'; /* Declare variable prop with a type that is a key of the activeFilterCategories. The 'keyof typeof' activeFilterCategories type represents all possible keys
// const filterFields: string[] = []; that can exist on the activeFilterCategories --> prop can only be assigned a value that is a key of the activeFilterCategories object */
// const facet_fields: FacetFields = res.facets;
let prop: keyof typeof activeFilterCategories; let prop: keyof typeof activeFilterCategories;
for (prop in activeFilterCategories) { for (prop in activeFilterCategories) {
const filterItems = activeFilterCategories[prop]; const filterItems = activeFilterCategories[prop];
// const filterItems = facetCategory.values;
// filterItems.forEach((filterItem) => {
// console.log(`${key} ${valueArray}`);
filterItems.forEach(function (value: string) { filterItems.forEach(function (value: string) {
// filterFields += "&fq=" + key + ':("' + value + '")';
filterFields.push(prop + ':("' + value + '")'); filterFields.push(prop + ':("' + value + '")');
// filterFields += prop + ":" + value;
}); });
} }
// filterFields += '"]';
} }
// const query = "&sort=server_date_published desc" + "&q=" + term;
// const api =
// base + params + limit + start + query + filterFields + facetFields;
// https://solr.apache.org/guide/8_4/json-request-api.html // https://solr.apache.org/guide/8_4/json-request-api.html
const q_params = { const q_params = {
@ -164,198 +137,50 @@ class DatasetService {
}; };
const stations = api.get<SolrResponse>(base, q_params); const stations = api.get<SolrResponse>(base, q_params);
// .pipe(map((res) => res.response.docs));
return stations; return stations;
} }
public getYears(): Observable<string[]> { public getYears(): Observable<string[]> {
// const heroes = of(HEROES);
// const host = "https:" + VUE_API;
const host = VUE_API; const host = VUE_API;
const path = "/api/years"; const path = "/api/years";
const base = host + path; const base = host + path;
const years = api.get<string[]>(base); const years = api.get<string[]>(base);
// this.messageService.add('HeroService: fetched heroes');
return years; return years;
} }
public getDocuments(year: string): Observable<Array<DbDataset>> { public getDocuments(year: string): Observable<Array<DbDataset>> {
// const host = "https:" + VUE_API;
const host = VUE_API; const host = VUE_API;
const path = "/api/sitelinks/" + year; const path = "/api/sitelinks/" + year;
const base = host + path; const base = host + path;
const documents: Observable<DbDataset[]> = api.get<Array<DbDataset>>(base); const documents: Observable<DbDataset[]> = api.get<Array<DbDataset>>(base);
// this.messageService.add('HeroService: fetched heroes');
return documents; return documents;
} }
public getDataset(id: number): Observable<DbDataset> { public getDataset(id: number): Observable<DbDataset> {
// const host = "https:" + VUE_API;
const host = VUE_API; const host = VUE_API;
const path = "/api/dataset/" + id; const path = "/api/dataset/" + id;
const apiUrl = host + path; const apiUrl = host + path;
const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res))); const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res)));
// const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res, apiUrl)));
// this.messageService.add('HeroService: fetched heroes');
return dataset; return dataset;
} }
public getDatasetByDoi(doi: string): Observable<DbDataset> { public getDatasetByDoi(doi: string): Observable<DbDataset> {
// const host = "https:" + VUE_API;
const host = VUE_API; const host = VUE_API;
const path = "/api/dataset/10.24341/tethys." + doi; const path = "/api/dataset/10.24341/tethys." + doi;
const apiUrl = host + path; const apiUrl = host + path;
const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res))); const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res)));
// const dataset = api.get<DbDataset>(apiUrl).pipe(map((res) => this.prepareDataset(res, apiUrl)));
// this.messageService.add('HeroService: fetched heroes');
return dataset; return dataset;
} }
// public getOaiDatasets(): Observable<OaiDataset[]> {
// const apiUrl = "https://data.tethys.at/oai?verb=ListRecords&metadataPrefix=oai_datacite";
// const oaiDatasets = api.get<string>(apiUrl).pipe(
// map(
// (response: string) => {
// // const parser = new DOMParser();
// // const xmlDoc: XMLDocument = parser.parseFromString(response, "application/xml");
// // const xslDoc = parser.parseFromString(this.xsl, "application/xml");
// // const xsltProcessor = new XSLTProcessor();
// // xsltProcessor.importStylesheet(xslDoc);
// // console.log(xmlDoc);
// // const xmlDom = xsltProcessor.transformToDocument(xmlDoc);
// // const serializer = new XMLSerializer();
// // const html = serializer.serializeToString(xmlDom.documentElement);
// // console.log(html);
// // const arrOai = new Array<OaiDataset>();
// // return arrOai;
// const arrOai = this.parseXML(response);
// return arrOai;
// // .then((data) => {
// // return data;
// // });
// },
// // (error: string) => this.errorHandler(error),
// ),
// );
// // const oaiDatasets = of(OAI_DATASETS);
// // this.messageService.add('HeroService: fetched heroes');
// return oaiDatasets;
// }
// private parseXML(xmlStr: string): Array<OaiDataset> {
// // let k = "";
// const arr: OaiDataset[] = [];
// const domParser = new DOMParser();
// const doc = domParser.parseFromString(xmlStr, "application/xml");
// const records = doc.getElementsByTagName("ListRecords")[0];
// // // const rt = xmlNode.resumptionToken;
// // for (let i = 0; i < records.length; i++) {
// // console.log(records[i].getAttribute("name"));
// // }
// const parser: xml2js.Parser = new xml2js.Parser({
// trim: true,
// explicitArray: false,
// ignoreAttrs: false,
// // mergeAttrs: true,
// });
// parser.parseString(records.outerHTML, function (err: Error | null, result: any) {
// const xmlNode = result.ListRecords;
// // const rt = xmlNode.resumptionToken;
// for (const rNode in xmlNode.record) {
// const item = xmlNode.record[rNode];
// const dc = item.metadata.resource;
// const t = dc.titles.title;
// const id = dc.identifier._;
// const lang = "en"; //dc.titles.title.attributes("xml",True)->lang;
// let title: string;
// if (lang == "en" && t.length > 1) {
// title = t[1]._;
// } else {
// title = t[0]._;
// }
// let creator = "";
// if (dc.creators.creator instanceof Array) {
// dc.creators.creator.forEach((person: OaiPerson) => {
// creator += person.creatorName + "; ";
// });
// } else {
// creator += dc.creators.creator.creatorName._;
// }
// let contributor = "";
// if (dc.contributors) {
// if (dc.contributors.contributor instanceof Array) {
// dc.contributors.contributor.forEach((person: OaiPerson) => {
// contributor += person.contributorName + "; ";
// });
// } else {
// contributor += dc.contributors.contributor.contributorName;
// }
// }
// // ?.map((u: any) => u.creatorName._).join("; ");
// // foreach ($dc->creators->creator as $c) {
// // foreach ($c->creatorName as $d) {
// // if (count(explode(',',$d)) > 1) {
// // $creator .= explode(',',$d)[0] . ', ' . substr(explode(',',$d)[1],1,1) . '; ';
// // } else {
// // $creator .= explode(',',$d)[0];
// // }
// // }
// // }
// const north = dc.geoLocations.geoLocation.geoLocationBox.northBoundLatitude;
// const east = dc.geoLocations.geoLocation.geoLocationBox.eastBoundLongitude;
// const south = dc.geoLocations.geoLocation.geoLocationBox.southBoundLatitude;
// const west = dc.geoLocations.geoLocation.geoLocationBox.westBoundLongitude;
// const subject = dc.subjects.subject.map((u: any) => u._).join(", ");
// const oaiDataset = {
// doi: id,
// title: title,
// creator: creator,
// contributor: contributor,
// subject: subject,
// north: north,
// south: south,
// east: east,
// west: west,
// } as OaiDataset;
// arr.push(oaiDataset);
// }
// // resolve(arr);
// });
// return arr;
// }
// private prepareOAI(xml: any) : Array<OaiDataset> {
// //
// }
// private prepareDataset(datasetObj: DbDataset, apiUrl: string): DbDataset {
private prepareDataset(datasetObj: DbDataset): DbDataset { private prepareDataset(datasetObj: DbDataset): DbDataset {
const dataset = deserialize<DbDataset>(DbDataset, JSON.stringify(datasetObj)); const dataset = deserialize<DbDataset>(DbDataset, JSON.stringify(datasetObj));
dataset.url = document.documentURI; dataset.url = document.documentURI;
// this.internalDatasetId.generateInternalId(dataset);
// if (dataset.seriesParameters) {
// dataset.parameters = dataset.seriesParameters;
// delete dataset.seriesParameters;
// }
return dataset; return dataset;
} }
} }

87
src/views/search-view/search-view-component.ts
View File

@ -49,10 +49,8 @@ export default class SearchViewComponent extends Vue {
private solr: SolrSettings = { private solr: SolrSettings = {
core: SOLR_CORE, //"rdr_data", // SOLR.core; core: SOLR_CORE, //"rdr_data", // SOLR.core;
host: SOLR_HOST, //"tethys.at", host: SOLR_HOST, //"tethys.at",
// core: "test_data", // SOLR.core;
// host: "repository.geologie.ac.at",
}; };
// private rdrAPI!: DatasetService;
private error = ""; private error = "";
get stringSearchTerm(): string { get stringSearchTerm(): string {
@ -100,28 +98,13 @@ export default class SearchViewComponent extends Vue {
} }
} }
// onSearch(term: string): void {
onSearch(suggestion: Suggestion | string): void { onSearch(suggestion: Suggestion | string): void {
// let queryOperator;
// if (typeof suggestion === "string") {
// suggestion = suggestion + "*";
// queryOperator = "or";
// } else if (suggestion instanceof Suggestion) {
// // term = suggestion.value;
// queryOperator = "and";
// }
// if (term) {
// term = term.trim();
// } else {
// term = "*%3A*";
// }
this.activeFilterCategories = new ActiveFilterCategories(); this.activeFilterCategories = new ActiveFilterCategories();
this.facets = new FacetResults(); this.facets = new FacetResults();
// this.facets = {};
this.searchTerm = suggestion; this.searchTerm = suggestion;
/* The method returns an Observable, and the code subscribes to this Observable to handle the response. If the response is successful, it calls the dataHandler method
with the Solr response as a parameter. If there is an error, it calls the errorHandler method with the error message as a parameter */
DatasetService.facetedSearch(suggestion, this.activeFilterCategories, this.solr.core, this.solr.host, undefined).subscribe({ DatasetService.facetedSearch(suggestion, this.activeFilterCategories, this.solr.core, this.solr.host, undefined).subscribe({
next: (res: SolrResponse) => this.dataHandler(res), next: (res: SolrResponse) => this.dataHandler(res),
error: (error: string) => this.errorHandler(error), error: (error: string) => this.errorHandler(error),
@ -129,38 +112,20 @@ export default class SearchViewComponent extends Vue {
} }
private dataHandler(res: SolrResponse, filterItem?: FacetItem): void { private dataHandler(res: SolrResponse, filterItem?: FacetItem): void {
// this.results = datasets;
this.results = res.response.docs; this.results = res.response.docs;
this.numFound = res.response.numFound; this.numFound = res.response.numFound;
// pagination // pagination
this.pagination["total"] = res.response.numFound; this.pagination["total"] = res.response.numFound;
this.pagination["perPage"] = res.responseHeader.params.rows as number; this.pagination["perPage"] = res.responseHeader.params.rows as number;
// this.pagination["currentPage"] = 1;
this.pagination["data"] = res.response.docs; this.pagination["data"] = res.response.docs;
this.pagination.lastPage = Math.ceil(this.pagination.total / this.pagination.perPage); this.pagination.lastPage = Math.ceil(this.pagination.total / this.pagination.perPage);
// facets
// const facet_fields = res.facet_counts.facet_fields;
// for (const prop in facet_fields) {
// const facetCategory: FacetCategory<any> = facet_fields[prop];
// const facetValues = facetCategory.key.values.map((facet_value: any, i: number) => {
// if (i % 2 === 0 && typeof facet_value == "string") {
// //var rObj = { value: facet, count: facet_fields[prop][i + 1] };
// // FiletrItem with value and count
// const rObj = new FilterItem(facet_value, facetCategory.key.values[i + 1]);
// return rObj;
// }
// });
// .filter(function (el: FilterItem) {
// return el != null && el.count > 0;
// });
// //this.facets.push({ filterName: prop, values: facetValues });
// this.facets[prop] = facetValues;
// }
const facet_fields: FacetFields = res.facets; const facet_fields: FacetFields = res.facets;
let prop: keyof typeof facet_fields; let prop: keyof typeof facet_fields;
for (prop in facet_fields) { for (prop in facet_fields) {
const facetCategory = facet_fields[prop]; const facetCategory = facet_fields[prop];
if (facetCategory.buckets) { if (facetCategory.buckets) {
@ -194,12 +159,9 @@ export default class SearchViewComponent extends Vue {
private errorHandler(err: string): void { private errorHandler(err: string): void {
this.error = err; this.error = err;
// this.loading = false;
} }
onMenuClick(page: number) { onMenuClick(page: number) {
// const test = page;
// console.log(test);
this.pagination.currentPage = page; this.pagination.currentPage = page;
const start = page * this.pagination.perPage - this.pagination.perPage; const start = page * this.pagination.perPage - this.pagination.perPage;
@ -224,46 +186,10 @@ export default class SearchViewComponent extends Vue {
(res: SolrResponse) => this.dataHandler(res, facetItem), (res: SolrResponse) => this.dataHandler(res, facetItem),
(error: string) => this.errorHandler(error), (error: string) => this.errorHandler(error),
); );
// alert(this.activeFilterCategories[filter.Category]);
// var res = await rdrApi.search(this.searchTerm, this.activeFilterCategories, this.solrCore, this.solrHost);
// this.results = res.response.docs;
// this.numFound = res.response.numFound;
// // pagination
// this.pagination['total'] = res.response.numFound;
// this.pagination['per_page'] = res.responseHeader.params.rows;
// this.pagination['current_page'] = 1;
// this.pagination['data'] = res.response.docs;
// var facet_fields = res.facet_counts.facet_fields;
// for (var prop in facet_fields) {
// var facetValues = facet_fields[prop].map((facetValue, i) => {
// if (i % 2 === 0) {
// // var rObj = { value: facetValue, count: facet_fields[prop][i + 1] };
// var rObj;
// if (filter.value == facetValue) {
// rObj = filter;
// } else if (this.facets[prop].some(e => e.value === facetValue)) {
// // console.log(facetValue + " is included")
// var indexOfFacetValue = this.facets[prop].findIndex(i => i.value === facetValue);
// // console.log(indexOfFacetValue);
// rObj = this.facets[prop][indexOfFacetValue];
// rObj.count = facet_fields[prop][i + 1];
// } else {
// rObj = new FilterItem(facetValue, facet_fields[prop][i + 1]);
// }
// return rObj;
// }
// }).filter(function (el) {
// return el != null && el.count > 0;
// });
// // this.facets.push({ filterName: prop, values: facetValues });
// this.facets[prop] = facetValues;
} }
} }
onClearFacetCategory(categoryName: string): void { onClearFacetCategory(categoryName: string): void {
// alert(categoryName);
delete this.activeFilterCategories[categoryName]; delete this.activeFilterCategories[categoryName];
DatasetService.facetedSearch(this.searchTerm, this.activeFilterCategories, this.solr.core, this.solr.host, undefined).subscribe({ DatasetService.facetedSearch(this.searchTerm, this.activeFilterCategories, this.solr.core, this.solr.host, undefined).subscribe({
@ -311,5 +237,4 @@ export default class SearchViewComponent extends Vue {
}); });
} }
// onPaging(page: number): void {}
} }

24
src/views/search-view/search-view-component.vue
View File

@ -1,31 +1,11 @@
<template> <template>
<div id="page_style" class="rows site-content page__style page__description" autocomplete="off"> <div id="page_style" class="rows site-content page__style page__description" autocomplete="off">
<div class="container-fluid banner mz-5"> <div class="container-fluid banner mz-5">
<vs-input v-bind:propDisplay="searchTerm" v-bind:placeholder="'Enter your search term...'" @search-change="onSearch"></vs-input> <vs-input v-bind:propDisplay="searchTerm" v-bind:placeholder="'Enter your search term...'" @search-change="onSearch"></vs-input>
</div> </div>
<div class="column is-half is-offset-one-quarter" style="padding-top: 0; margin-top: 0"> <div class="column is-half is-offset-one-quarter" style="padding-top: 0; margin-top: 0">
<!-- <div class="tabs is-centered">
<ul id="id-results-tabs">
<li class="search_tab is-active">
<a target="_self">Web</a>
</li>
<li class="search_tab">
<a target="_self">Images</a>
</li>
<li class="search_tab">
<a target="_self">Videos</a>
</li>
<li class="search_tab">
<a target="_self">Homepages</a>
</li>
<li class="search_tab">
<a target="_self">Food</a>
</li>
<li class="search_tab">
<a target="_self">Books</a>
</li>
</ul>
</div> -->
<div v-if="results.length > 0" class="result-list-info"> <div v-if="results.length > 0" class="result-list-info">
<div v-if="hasSearchTerm()" class="resultheader"> <div v-if="hasSearchTerm()" class="resultheader">
Your search term {{ "'" + stringSearchTerm + "'" }} yielded <strong>{{ numFound }}</strong> results: Your search term {{ "'" + stringSearchTerm + "'" }} yielded <strong>{{ numFound }}</strong> results: