Commit ce7841c6 authored by Yasset Perez-Riverol's avatar Yasset Perez-Riverol
Browse files

Merge branch 'master' of https://github.com/PRIDE-Archive/pride-web

Merge with local
parents aad41d5d 786132ad
......@@ -39,7 +39,7 @@
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.2/css/ebi-global.css" type="text/css" media="all" />
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.2/fonts.css" type="text/css" media="all" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.min.css" type="text/css" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.9/css/all.css" integrity="sha384-5SOiIsAziJl6AWe0HWRKTXlfcSHKmYV4RBF18PPJ173Kzn7jzMyFuTtk8JA7QQG1" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
<!-- Use this CSS file for any custom styling -->
......
......@@ -2642,11 +2642,11 @@
}
},
"echarts": {
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.0.4.tgz",
"integrity": "sha512-PDWGchRwBvMcNJbg94/thIIDgD8Jw2APtbK6K9rq1X8h6rQIdQ3IFTEvRwGS9U0zsUgJQQwXFLXIw+RJ/EH3fw==",
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.1.0.tgz",
"integrity": "sha512-gP1e1fNnAj9KJpTDLXV21brklbfJlqeINmpQDJCDta9TX3cPoqyQOiDVcEPzbOVHqgBRgTOwNxC5iGwJ89014A==",
"requires": {
"zrender": "4.0.3"
"zrender": "4.0.4"
}
},
"ee-first": {
......@@ -10059,11 +10059,6 @@
"integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
"dev": true
},
"to-style": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/to-style/-/to-style-1.3.3.tgz",
"integrity": "sha1-Y6K3Cm9KfU/cLtV6C+TnI1y2aZw="
},
"toposort": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/toposort/-/toposort-1.0.6.tgz",
......@@ -10429,27 +10424,11 @@
"resolved": "https://registry.npmjs.org/vue-echarts/-/vue-echarts-3.0.4.tgz",
"integrity": "sha512-Netpqa/w3kOWeGNJm9tlOSrt63/m0L9W9DIWUoVggxXWyaA/5Dun1VY41K5YFGDkbVKJNC9pAB7ezyesvjIQFg==",
"requires": {
"echarts": "4.0.4",
"echarts": "4.1.0",
"lodash": "4.17.4",
"resize-detector": "0.1.3"
}
},
"vue-highlight-text": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/vue-highlight-text/-/vue-highlight-text-1.3.2.tgz",
"integrity": "sha512-NAb166NHgif85zrZX8cx1TCqtEFqJpqtXts+QYJ84T+FkdCyVTdTNEbxsneNZJ4ABdH5LCeNNZjXimtaFKv3TQ==",
"requires": {
"to-style": "1.3.3",
"vue": "2.5.16"
},
"dependencies": {
"vue": {
"version": "2.5.16",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.5.16.tgz",
"integrity": "sha512-/ffmsiVuPC8PsWcFkZngdpas19ABm5mh2wA7iDqcltyCTwlgZjHGeJYOXkBMo422iPwIcviOtrTCUpSfXmToLQ=="
}
}
},
"vue-hot-reload-api": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.2.4.tgz",
......@@ -11126,9 +11105,9 @@
}
},
"zrender": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-4.0.3.tgz",
"integrity": "sha512-LdkntRaNogzKAwlICuS0wdZcYaeA94llQ0SWqsgbcd6SPasgkjstaoe6vr5P9Pd2ID/rlhf3UrmIuFzqOLdDuA=="
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-4.0.4.tgz",
"integrity": "sha512-03Vd/BDl/cPXp8E61f5+Xbgr/a4vDyFA+uUtUc1s+5KgcPbyY2m+78R/9LQwkR6QwFYHG8qk25Q8ESGs/qpkZw=="
}
}
}
<template>
<div id="app">
<defaultNav/>
<keep-alive include="archive">
<!--<keep-alive include="archive">-->
<router-view/>
</keep-alive>
<!--/keep-alive>-->
<defaultFooter/>
</div>
</template>
......
......@@ -100,6 +100,7 @@
<Card>
<p slot="title" class="resource-list-title-container">
<span>Resources List</span>
<!--new api has no sort function
<span>
<span>Sort by: </span>
<div class="sortOption">
......@@ -107,8 +108,8 @@
<Option v-for="item in sortList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
</span>
-->
</p>
<Spin size="large" fix v-if="loading"></Spin>
<Card v-for="publicationItem in publicaitionList" class="resource-item" v-bind:key = "publicationItem.accession">
......@@ -229,8 +230,21 @@
projectItemsSpecies:'',
projectItemsProjectDescription:'',
projectItemsPublicationDate:'',
normalQuery:{}
}
},
beforeRouteUpdate:function (to, from, next) {
//console.log('to query',to.query);
/*
let filter = to.query.split('?')[1].split('filter');
if(filter.length>1)
filter.split("=");
console.log('filter',filter);*/
console.log('to.query',to.query);
this.queryArchiveProjectList(to.query);
//this.$bus.$emit('submit-search', {params: to.params, query: to.query});
next();
},
components: {
NavBar
},
......@@ -297,13 +311,25 @@
}
}
this.filter = condition.replace(/,$/gi,'');
//console.log(this.filter);
},
queryArchiveProjectList(){
queryArchiveProjectList(q){
this.publicaitionList = [];
this.loading = true;
this.loading = true;
let query = q || this.$route.query;
query.dateGap = '+1YEAR';
let pageSizeFound = false;
for(let i in query){
if(i == 'pageSize'){
pageSizeFound = true;
break;
}
}
if(!pageSizeFound)
query.pageSize = this.pageSize;
console.log('search query',query);
this.$http
.get(this.queryArchiveProjectListApi +this.query+ '&dateGap=%2B1YEAR')
.get(this.queryArchiveProjectListApi,{params: query})
.then(function(res){
this.total = res.body.page.totalElements;
this.loading = false;
......@@ -372,6 +398,7 @@
},
setHighlightKeywords(){
this.highlightKeyword = this.keyword.split(',');
//console.log('this.highlightKeyword',this.highlightKeyword);
},
querySpecificFacets(keyword){
if(this.containSelectors[0] && !this.containSelectors[0].value || this.containValue == keyword)
......@@ -582,7 +609,7 @@
for(let i=0; i<this.tagArray.length; i++){
this.keyword += this.tagArray[i]+',';
}
this.keyword.replace(/,$/gi,'');
this.keyword = this.keyword.replace(/,$/gi,'');
},
conditionDelete(index,item){
this.filterCombination.splice(index,1);
......@@ -618,19 +645,21 @@
this.hightlightMode = true;
else
this.hightlightMode = false;
this.queryArchiveProjectList();
this.$router.push({name: 'archive', query: this.query});
this.$Message.success({content:'new result', duration:1});
},
pageChange(page){
this.page = page-1;
this.setFilter();
this.queryArchiveProjectList();
this.$router.push({name: 'archive', query: this.query});
},
pageSizeChange(size){
this.pageSize = size;
this.setFilter();
this.queryArchiveProjectList();
this.$router.push({name: 'archive', query: this.query});
},
/*new api has no sort funtions
sortChange(type){
console.log(type);
if(type == 'Title')
......@@ -644,12 +673,12 @@
this.setFilter();
this.queryArchiveProjectList();
},
},*/
updateQuery(){
this.keyword
this.sort = 'publication_date';
this.page = 0;
this.pageSize = 20;
//this.normalQuery = {keyword:this.keyword, page:0, pageSize:20}
},
searchInputListener(){
this.$refs.searchRef.$el.querySelector('.ivu-select-selection .ivu-select-input').addEventListener('keydown',(e)=>{
......@@ -670,6 +699,18 @@
this.searchInputChange(e.target.value, true);
}
});
},
queryFormatter(query){
console.log('query',query);
let queryTemp = '?';
for(let i in query){
if(query[i] && i == 'keyword'){
queryTemp = queryTemp + i + '='+query[i]
}
else if(query[i] && i == 'filter'){
console.log('query[i]',query[i]);
}
}
}
},
......@@ -681,17 +722,30 @@
},
computed:{
//this variable is not used anymore and only for updating this.normalQuery;
query:function(){
let keyword= this.keyword? 'keyword='+this.keyword+'&' : '';
let filter = this.filter? 'filter='+this.filter+'&' : '';
let page='page='+this.page+'&';
let pageSize='pageSize='+this.pageSize;
return '?'+keyword+filter+page+pageSize;
//let keyword= this.keyword? 'keyword='+this.keyword+'&' : '';
//let filter = this.filter? 'filter='+this.filter+'&' : '';
//let page='page='+this.page+'&';
//let pageSize='pageSize='+this.pageSize;
let normalQuery = {}
console.log('filterCombination',this.filterCombination);
console.log('tagArray',this.tagArray);
for(let i=0; i<this.tagArray.length; i++){
}
normalQuery.keyword = this.keyword;
normalQuery.filter = this.filter;
normalQuery.page = this.page;
normalQuery.pageSize = this.pageSize;
//console.log('this.normalQuery',this.normalQuery);
//return '?'+keyword+filter+page+pageSize;
return normalQuery;
}
},
mounted: function(){
this.updateQuery();
//this.updateQuery();
this.setFilter();
this.queryArchiveProjectList();
this.searchInputListener();
......@@ -703,6 +757,7 @@
},
beforeRouteEnter(to,from,next){
//console.log('from',from);
if(from.name == 'landingpage' && from.params.keyword)
paramsFromLandingPage = from.params.keyword;
......
......@@ -211,18 +211,18 @@
<Button v-if="selectAllfiles" class= "download-button">Download</Button>
</div>
</div>
</Card>
</Card>
<!--
<Card v-if="total>0" class="card">
<p slot="title">Assay</p>
<div class="assay-search-container">
<!--<Table class="peptide-table" :loading="loading" border :columns="columns5" :data="results" size="small" @on-row-click="rowClick"></Table>-->
<Table class="assay-detail-table" :loading="assayLoading" border :columns="assayCol" :data="assayResults" size="small"></Table>
</div>
<div class="page-container">
<Page :total="total" :page-size="size" size="small" show-sizer show-total class-name="page" @on-change="pageChange" @on-page-size-change="pageSizeChange"></Page>
</div>
</Card>
-->
</div>
<!--
<Tabs :animated="false">
......@@ -297,7 +297,7 @@
<div class="property-wrapper">
<div v-if="diseases.length>0">
<div v-for="item in diseases">
<a>{{item}}</a>
<a>{{item.name}}</a>
</div>
</div>
<div v-else>
......@@ -332,11 +332,11 @@
</div>
</div>
<div class="property-row">
<div class="summary-content-header">Softwares</div>
<div class="summary-content-header">Software</div>
<div class="property-wrapper">
<div v-if="softwares.length>0">
<div v-for="item in softwares">
<a>{{item}}</a>
<a>{{item.name}}</a>
</div>
</div>
<div v-else>
......@@ -433,9 +433,82 @@
{
title: 'Name',
key: 'name',
align:'center',
align:'left',
ellipsis:true
},
{
title: 'Type',
width: 100,
key: 'type',
align:'left',
sortable: true,
ellipsis:true,
render: (h, params) => {
var className;
var iconColor;
if(params.row.type == 'PEAK'){
className='far fa-chart-bar';
iconColor='#bd7edc'
}
else if (params.row.type == 'RAW'){
className ='far fa-list-alt';
iconColor='#e2c94c'
}
else if (params.row.type == 'RESULT'){
className ='far fa-envelope-open';
iconColor='#6acaef'
}
else if (params.row.type == 'OTHER'){
className ='far fa-file';
iconColor='#999c9c'
}
else if (params.row.type == 'SEARCH'){
className ='fas fa-search';
iconColor='#5bc0be'
}
return h('div', [
h('i', {
attrs: { class: className},
style: {
color:iconColor,
marginRight: '5px',
marginLeft: '0px'
},
}),
h('span', {
on: {
click: () => {
}
}
}, params.row.type),
/*
h('Button', {
props: {
type: 'primary',
size: 'small'
},
style: {
display:'inline-block',
marginRight: '5px',
paddingLeft: '22px',
paddingRight: '22px'
},
on: {
click: () => {
//window.location.href = params.row.url.ftp;
window.open(params.row.url.ftp)
console.log(params.row.url.ftp);
//this.gotoBlast(params);
}
}
}, 'FTP'),*/
]);
}
},
{
title: 'Size (M)',
width: 80,
......@@ -737,7 +810,7 @@
this.$http
.get(this.queryArchiveProjectFilesApi + this.queryDownload)
.then(function(res){
//console.log(res.body);
console.log(res.body);
this.totalDownLoad = res.body.page.totalElements;
if(res.body._embedded.files){
let filesArray = res.body._embedded.files;
......@@ -745,6 +818,7 @@
for(let i=0;i<filesArray.length;i++){
let item ={
name: filesArray[i].fileName,
type: filesArray[i].fileCategory.value,
size: Math.round(filesArray[i].fileSizeBytes/1024/1024),
url: {
ftp: filesArray[i].publicFileLocations[0].value,
......
......@@ -136,7 +136,7 @@
});
},
tweetQuery(){
this.$Message.success({content:'documents update', duration:1});
//this.$Message.success({content:'documents update', duration:1});
this.info.tweet = Math.floor(Math.random()* 1000);
/*
this.$http
......@@ -149,7 +149,7 @@
*/
},
citationQuery(){
this.$Message.success({content:'documents update', duration:1});
//this.$Message.success({content:'documents update', duration:1});
this.info.citation = Math.floor(Math.random()* 1000);
/*
this.$http
......
......@@ -4,49 +4,113 @@
<Col :xs="{ span: 24 }" :sm="{span: 12}" :md="{ span: 8}" :lg="{ span: 8}">
<div class="item-container">
<div class="item">
<Sunburst></Sunburst>
<Spin fix v-if="sunburstPrideShow"></Spin>
<SunburstPrideSimple></SunburstPrideSimple>
<a class="static-more-button" @click="gotoStaticDetails">More</a>
</div>
</div>
</Col>
<Col :xs="{ span: 24 }" :sm="{span: 12}" :md="{ span: 8}" :lg="{ span: 8}">
<div class="item-container">
<div class="item">
<Sankey></Sankey>
<Spin fix v-if="sankeyPrideShow"></Spin>
<SankeyPrideSimple></SankeyPrideSimple>
<a class="static-more-button" @click="gotoStaticDetails">More</a>
</div>
</div>
</Col>
<Col :xs="{ span: 24 }" :sm="{span: 12}" :md="{ span: 8}" :lg="{ span: 8}">
<div class="item-container">
<div class="item">
<MapPride></MapPride>
<Spin fix v-if="mapPrideShow"></Spin>
<MapPrideSimple></MapPrideSimple>
<a class="static-more-button" @click="gotoStaticDetails">More</a>
</div>
</div>
</Col>
</Row>
<!--
<div class="button-wrapper">
<a class="button statistic-button" @click="">More Data</a>
</div>
-->
</div>
</template>
<script>
import LineSimple from './statistics_chart/LineSimple.vue'
import Sunburst from './statistics_chart/Sunburst.vue'
import Sankey from './statistics_chart/Sankey.vue'
import MapPride from './statistics_chart/Map.vue'
import test from './statistics_chart/test.vue'
import LinePrideSimple from './statistics_chart/LineSimple.vue'
import SunburstPrideSimple from './statistics_chart/SunburstSimple.vue'
import SankeyPrideSimple from './statistics_chart/SankeySimple.vue'
import MapPrideSimple from './statistics_chart/MapSimple.vue'
export default {
data () {
return {
value1: 0,
setting: {
dots: 'none',
},
landingPageJsonURL:'/static/landingPage/landing_page.json'
sunburstPrideApi:'http://ves-pg-41:9020/stats/SUBMISSIONS_PER_MONTH',
sankeyPrideApi:'http://ves-pg-41:9020/stats/SUBMISSIONS_PER_MONTH',
mapPrideApi:'http://ves-pg-41:9020/stats/SUBMISSIONS_PER_MONTH',
linePrideApi:'http://ves-pg-41:9020/stats/SUBMISSIONS_PER_YEAR',
sunburstPrideShow:true,
sankeyPrideShow:true,
mapPrideShow:true,
linePrideShow:true,
}
},
components: {
LineSimple,
Sunburst,
Sankey,
MapPride,
test
LinePrideSimple,
SunburstPrideSimple,
SankeyPrideSimple,
MapPrideSimple,
},
methods:{
gotoStaticDetails(){
this.$router.push({name:'statisticsdetails'})
},
querySunburst(){
this.$http
.get(this.sunburstPrideApi)
.then(function(res){
this.sunburstPrideShow=false;
this.$bus.$emit('show-simple-sunburst', res.body.speciesCounts);
},function(err){
});
},
querySankey(){
this.$http
.get(this.sankeyPrideApi)
.then(function(res){
this.sankeyPrideShow=false;
this.$bus.$emit('show-simple-sankey', res.body.speciesCounts);
},function(err){
});
},
queryLine(){
this.$http
.get(this.linePrideApi)
.then(function(res){
this.linePrideShow=false;
console.log(res.body);
this.$bus.$emit('show-simple-line', res.body.speciesCounts);
},function(err){
});
},
queryMap(){
this.$http
.get(this.mapPrideApi)
.then(function(res){
this.mapPrideShow=false;
this.$bus.$emit('show-simple-map', res.body.speciesCounts);
},function(err){
});
},
},
mounted: function(){
this.querySunburst();
this.querySankey();
this.queryLine();
this.queryMap();
},
}
</script>
......@@ -68,16 +132,33 @@
.item-container{
text-align: center;
margin: 50px 10px;
margin: 10px 15px;
}
.item{
position: relative;
border: 1px solid #ececec;
border-radius: 6px;
}
.static-more-button{
position: absolute;
top: 5px;
right: 10px;
border-bottom-style:none !important;
}
.button-wrapper{
text-align: center;