144 lines
5.7 KiB
HTML
144 lines
5.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<!-- Required meta tags -->
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<!-- Bootstrap CSS -->
|
|
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
|
|
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
|
|
|
|
<style>
|
|
.bd-placeholder-img {
|
|
font-size: 1.125rem;
|
|
text-anchor: middle;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
.bd-placeholder-img-lg {
|
|
font-size: 3.5rem;
|
|
}
|
|
}
|
|
</style>
|
|
<!-- Custom styles for this template -->
|
|
<link href="static/css/starter.css" rel="stylesheet">
|
|
<!-- <link href="static/css/cover.css" rel="stylesheet"> -->
|
|
|
|
<title>TPDL 2020 Companion WebApp</title>
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
|
|
<a class="navbar-brand" href="#">TPDL 2020 Paper #55 WebApp</a>
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault"
|
|
aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
|
|
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
|
|
<ul class="navbar-nav mr-auto">
|
|
<li class="nav-item active">
|
|
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">The paper</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
<main role="main" class="container" id="app">
|
|
|
|
<div class="row justify-content-center">
|
|
<div class="col-10">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" v-model="query" placeholder="Your query terms..."
|
|
aria-label="Your query terms..." aria-describedby="button-addon2">
|
|
<select class="form-control col-md-3" aria-describedby="button-addon2" v-model="index"
|
|
v-on:change="switch_index">
|
|
<option v-bind:value="'propagation-before'">Before propagation</option>
|
|
<option v-bind:value="'propagation-after'">After propagation</option>
|
|
</select>
|
|
<div class="input-group-append">
|
|
<button class="btn btn-outline-secondary" type="button" id="button-addon2"
|
|
v-on:click="new_query">Search!</button>
|
|
</div>
|
|
</div>
|
|
<a href="#" v-on:click="run_example(1)">Example 1</a>
|
|
<a href="#" v-on:click="run_example(2)">Example 2</a>
|
|
<a href="#" v-on:click="run_example(3)">Example 3</a>
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-center" v-if="hits">
|
|
<div>
|
|
<strong>Query:</strong> {{query}} - Viewing records {{start}} to {{start+10}} - <strong>Hits:</strong> {{total}}
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-center" v-if="hits">
|
|
<div>
|
|
<nav aria-label="Page navigation example">
|
|
<ul class="pagination justify-content-center">
|
|
<li class="page-item" v-bind:class="{disabled: start < 10}" v-on:click="start >= 10 && previous_page()">
|
|
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
|
|
</li>
|
|
<li class="page-item" v-bind:class="{disabled: start+10 > total}"
|
|
v-on:click="start+10 <= total && next_page()">
|
|
<a class="page-link" href="#">Next</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
<table class="table table-responsive">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col"><span class="badge badge-primary">ID</span> & <span
|
|
class="badge badge-warning">PIDs</span></th>
|
|
<th scope="col">Type</th>
|
|
<th scope="col">Metadata</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="hit in hits">
|
|
<td>
|
|
<div><span class="badge badge-primary">{{hit.id}}</span></div>
|
|
<div v-for="pid in hit.pid['_l_']"><span class="badge badge-warning">{{pid}}</span></div>
|
|
</td>
|
|
<td>
|
|
<div>
|
|
<span v-if="hit.type == 'publication'" class="badge badge-success">publication</span>
|
|
<span v-if="hit.type == 'dataset'" class="badge badge-danger">dataset</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div><strong>Titles</strong></div>
|
|
<div v-for="title in hit.title['_l_']">→ {{title}}</div>
|
|
<div><strong>Abstracts</strong></div>
|
|
<div v-for="abstract in hit.abstract['_l_']">→ {{abstract}}</div>
|
|
<div v-if="index != 'propagation-before'"><strong>Propagated abstracts</strong></div>
|
|
<div v-if="index != 'propagation-before'" v-for="propagated in hit.propagated_abstract['_l_']">→ {{propagated}}<br />
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Optional JavaScript -->
|
|
<script src="static/bower_components/vue/dist/vue.min.js"></script>
|
|
<script src="static/bower_components/axios/dist/axios.min.js"></script>
|
|
<script src="static/js/app.js"></script>
|
|
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
|
|
<script src="static/bower_components/jquery/dist/jquery.slim.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
|
|
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
|
|
crossorigin="anonymous"></script>
|
|
<script src="static/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
|
|
</body>
|
|
|
|
</html> |