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

- add sitelink-view-component with portal REST requests

Browse Source
This commit is contained in:
Arno Kaimbacher 2021-12-01 15:45:01 +01:00
parent 2c0c67cd64
commit 132edd4214
10 changed files with 216 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env
View File

@ -2,4 +2,4 @@
NODE_ENV=development
CONSTANT_VALUE=1234567
VUE_APP_PORTAL=//repository.geologie.ac.at/portal/login
VUE_APP_PORTAL=//repository.geologie.ac.at/portal

4
src/app.ts
View File

@ -8,6 +8,7 @@ import SearchViewComponent from "./views/search-view/search-view-component.vue";
import ServiceViewComponent from "./views/services-view/service-view-component.vue";
import OaiViewComponent from "./views/oai-view/oai-view-component.vue";
import ContactViewComponent from "./views/contact-view/contact-view-component.vue";
import SitelinkViewComponent from "./views/sitelink-view/sitelink-view-component.vue";
import { VUE_APP_PORTAL } from "./constants";
// import VsInput from "./components/vs-input/vs-input.vue";
// import VsResult from "./components/vs-result/vs-result.vue";
@ -34,11 +35,12 @@ import { VUE_APP_PORTAL } from "./constants";
ServiceViewComponent,
OaiViewComponent,
ContactViewComponent,
SitelinkViewComponent,
},
})
export default class App extends Vue {
public active = false;
public portal = VUE_APP_PORTAL;
public portal = VUE_APP_PORTAL + "/login";
mounted(): void {
// const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll(".navbar-burger"), 0);

9
src/components/vs-input/vs-input.ts
View File

@ -1,7 +1,8 @@
// import Vue from "vue";
// import { Component, Prop } from 'vue-property-decorator';
// import debounce from 'lodash/debounce';
import { DatasetService } from "../../services/dataset.service";
// import { DatasetService } from "../../services/dataset.service";
import DatasetService from "../../services/dataset.service";
import { SolrSettings } from "@/models/solr";
// import { ref } from "vue";
import { Options, Vue } from "vue-class-component";
@ -29,7 +30,7 @@ export default class VsInput extends Vue {
core: "rdr_data", // SOLR.core;
host: "tethys.at",
};
private rdrAPI!: DatasetService;
// private rdrAPI!: DatasetService;
itemRefs!: Array<any>;
emits = ["filter"];
@ -42,7 +43,7 @@ export default class VsInput extends Vue {
}
mounted() {
this.rdrAPI = new DatasetService();
// this.rdrAPI = new DatasetService();
}
get showResults(): boolean {
@ -146,7 +147,7 @@ export default class VsInput extends Vue {
}
private request(): void {
this.rdrAPI.searchTerm(this.display, this.solr.core, this.solr.host).subscribe(
DatasetService.searchTerm(this.display, this.solr.core, this.solr.host).subscribe(
(res: Dataset[]) => this.dataHandler(res),
(error: any) => this.errorHandler(error),
() => (this.loading = false),

25
src/models/dataset.ts
View File

@ -30,3 +30,28 @@ export enum SearchType {
Author = "author",
Subject = "subject",
}
export interface DbDataset {
id: number;
contributing_corporation: string;
creating_corporation: string;
publisher_name: string;
embargo_date: string;
publish_id: number;
project_id: number;
type: string;
language: string;
server_state: string;
belongs_to_bibliography: boolean;
created_at: string;
server_date_modified: string;
server_date_published: string;
account_id: number;
editor_id: number;
reviewer_id: number;
preferred_reviewer: number;
preferred_reviewer_email: string;
reject_editor_note: string;
reject_reviewer_note: string;
reviewer_note_visible: string;
}

6
src/router/index.ts
View File

@ -5,6 +5,7 @@ import SearchViewComponent from "@/views/search-view/search-view-component";
import ServiceViewComponent from "@/views/services-view/service-view-component.vue";
import OaiViewComponent from "@/views/oai-view/oai-view-component.vue";
import ContactViewComponent from "@/views/contact-view/contact-view-component.vue";
import SitelinkViewComponent from "@/views/sitelink-view/sitelink-view-component.vue";
const routes = [
{
@ -37,6 +38,11 @@ const routes = [
name: "Contact",
component: ContactViewComponent,
},
{
path: "/sitelinks",
name: "Sitelinks",
component: SitelinkViewComponent,
},
];
const router = createRouter({

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

@ -2,11 +2,12 @@
import api from "../api/api";
import { Observable } from "rxjs";
import { map } from "rxjs/operators";
import { Dataset, Suggestion } from "@/models/dataset";
import { Dataset, DbDataset, Suggestion } from "@/models/dataset";
import { SolrResponse } from "@/models/headers";
import { ActiveFilterCategories } from "@/models/solr";
import { VUE_APP_PORTAL } from "@/constants";
export class DatasetService {
class DatasetService {
// for the autocomplete search
public searchTerm(term: string, solrCore: string, solrHost: string): Observable<Dataset[]> {
// solr endpoint
@ -138,4 +139,27 @@ export class DatasetService {
return stations;
}
getYears(): Observable<string[]> {
// const heroes = of(HEROES);
const host = "https:" + VUE_APP_PORTAL;
const path = "/api/years";
const base = host + path;
const years = api.get<string[]>(base);
// this.messageService.add('HeroService: fetched heroes');
return years;
}
getDocuments(year: string): Observable<Array<DbDataset>> {
const host = "https:" + VUE_APP_PORTAL;
const path = "/api/sitelinks/" + year;
const base = host + path;
const documents = api.get<Array<DbDataset>>(base);
// this.messageService.add('HeroService: fetched heroes');
return documents;
}
}
export default new DatasetService();

3
src/views/home-view/home-view-component.vue
View File

@ -209,7 +209,8 @@
<a href="#"><i class="fas fa-stamp"></i> Impressum</a>
</li>
<li class="list-group-item">
<a href="#"><i class="fas fa-link"></i> Sitelinks</a>
<!-- <a href="#"><i class="fas fa-link"></i> Sitelinks</a> -->
<router-link to="/sitelinks"><i class="fas fa-link"></i> Sitelinks</router-link>
</li>
<li class="list-group-item">
<a href="#"><i class="far fa-file-alt"></i> Terms &amp; Conditions</a>

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

@ -4,7 +4,8 @@ import VsResult from "@/components/vs-result/vs-result.vue";
import FacetCategory from "@/components/face-category/facet-category.vue";
import ActiveFacetCategory from "@/components/active-facet-category/active-facet-category.vue";
import { SolrSettings } from "@/models/solr";
import { DatasetService } from "@/services/dataset.service";
// import { DatasetService } from "@/services/dataset.service";
import DatasetService from "../../services/dataset.service";
import { Suggestion, Dataset } from "@/models/dataset";
import { SolrResponse, FacetFields, FacetItem, FacetResults, FacetInstance } from "@/models/headers";
import { ActiveFilterCategories } from "@/models/solr";
@ -39,11 +40,11 @@ export default class SearchViewComponent extends Vue {
core: "rdr_data", // SOLR.core;
host: "tethys.at",
};
private rdrAPI!: DatasetService;
// private rdrAPI!: DatasetService;
private error = "";
mounted(): void {
this.rdrAPI = new DatasetService();
// this.rdrAPI = new DatasetService();
}
// onSearch(term: string): void {
@ -68,7 +69,7 @@ export default class SearchViewComponent extends Vue {
// this.facets = {};
this.searchTerm = suggestion;
this.rdrAPI.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(
(res: SolrResponse) => this.dataHandler(res),
(error: any) => this.errorHandler(error),
);
@ -152,7 +153,7 @@ export default class SearchViewComponent extends Vue {
if (!this.activeFilterCategories[facetItem.category].some((e) => e === facetItem.val)) {
this.activeFilterCategories[facetItem.category].push(facetItem.val);
this.rdrAPI.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(
(res: SolrResponse) => this.dataHandler(res, facetItem),
(error: any) => this.errorHandler(error),
);
@ -198,7 +199,7 @@ export default class SearchViewComponent extends Vue {
// alert(categoryName);
delete this.activeFilterCategories[categoryName];
this.rdrAPI.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(
(res: SolrResponse) => {
this.results = res.response.docs;
this.numFound = res.response.numFound;

64
src/views/sitelink-view/sitelink-view-component.ts Normal file
View File

@ -0,0 +1,64 @@
import { Observable, Subscription } from "rxjs";
import { Options, Vue } from "vue-class-component";
import DatasetService from "../../services/dataset.service";
import { DbDataset } from "@/models/dataset";
@Options({
name: "SitelinkViewComponent",
})
export default class SitelinkViewComponent extends Vue {
public years: string[] = [];
public selected = "";
private error = "";
// private subscription!: Subscription;
private subscriptions: Array<Subscription> = [];
public datasets: Array<DbDataset> = [];
// constructor() {
// super();
// // this.rdrAPI = new DatasetService();
// }
beforeMount() {
// this.rdrAPI = new DatasetService();
this.getYears();
}
getYears() {
const newSubs: Subscription = DatasetService.getYears().subscribe(
(res: string[]) => this.dataHandler(res),
(error: any) => this.errorHandler(error),
() => newSubs.unsubscribe(),
);
// this.subscriptions.push(newSubs);
}
beforeUnmount() {
//unsunscribe to ensure no memory leaks
// this.subscription.unsubscribe();
for (const subs of this.subscriptions) {
subs.unsubscribe();
}
}
select(year: string) {
this.selected = year;
const newSubs = DatasetService.getDocuments(year).subscribe(
(res: Array<DbDataset>) => {
this.datasets = res;
},
(error: any) => this.errorHandler(error),
);
this.subscriptions.push(newSubs);
}
private dataHandler(res: string[]): void {
// this.results = datasets;
this.years = res;
}
private errorHandler(err: any): void {
this.error = err;
// this.loading = false;
}
}

77
src/views/sitelink-view/sitelink-view-component.vue Normal file
View File

@ -0,0 +1,77 @@
<template>
<div class="container">
<section class="section">
<div class="title has-text-centered">
<h1 class="title">Sitelinks for Web Crawlers</h1>
<!-- <p class="lead">Want to keep updated or need further information?</p> -->
<hr class="center-line" />
</div>
<!-- <div class="column">
<span>
<a href="" v-for="(year, index) in years" :key="index">
{{ year }}
</a>
</span>
</div> -->
<div class="columns is-mobile is-centered">
<div class="column is-6">
<div class="list" v-if="years.length > 0">
<ul class="block-list has-radius is-primary">
<li v-for="(year, index) in years" :key="index" :class="{ highlight: year == selected }" @click="select(year)">
{{ year }}
</li>
</ul>
</div>
</div>
</div>
<div class="columns is-mobile is-centered">
<div class="column is-6">
<ol v-if="datasets.length > 0">
<li v-for="(dataset, index) in datasets" :key="index">
<div class="post">
<header class="post-header">
<h2 class="post-title">
<a>{{ dataset.type }}; {{ dataset.publish_id }}</a>
</h2>
</header>
</div>
</li>
</ol>
</div>
</div>
</section>
</div>
</template>
<script lang="ts">
import SitelinkViewComponent from "./sitelink-view-component";
export default SitelinkViewComponent;
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
.block-list li.is-primary,
.block-list.is-primary > li {
background: #00d1b2;
color: #fff;
}
.block-list li.has-radius,
.block-list.has-radius > li {
border-radius: 4px;
}
.block-list li {
padding: 16px;
background: #f5f5f5;
margin-bottom: 0.25rem;
}
// .block-list li:hover {
// color: red;
// }
.block-list li.highlight {
background: #6b716f;
}
</style>