cleaning frontend
This commit is contained in:
parent
54d19eb888
commit
f081b7206f
@ -8,11 +8,17 @@
|
|||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
import {onClickOutside} from '@vueuse/core'
|
import {onClickOutside} from '@vueuse/core'
|
||||||
const yearList = ref([])
|
const yearList = ref([])
|
||||||
|
const yearCheckedList = ref([])
|
||||||
const monthList = ref([])
|
const monthList = ref([])
|
||||||
|
const monthCheckedList = ref([])
|
||||||
const accessList = ref([])
|
const accessList = ref([])
|
||||||
|
const accessCheckedList = ref([])
|
||||||
const languageList = ref([])
|
const languageList = ref([])
|
||||||
|
const languageCheckedList = ref([])
|
||||||
const domainList = ref([])
|
const domainList = ref([])
|
||||||
|
const domainCheckedList = ref([])
|
||||||
const paperTypeList = ref([])
|
const paperTypeList = ref([])
|
||||||
|
const paperTypCheckedList = ref([])
|
||||||
|
|
||||||
const filters = Object.assign({},{
|
const filters = Object.assign({},{
|
||||||
year:[],
|
year:[],
|
||||||
@ -23,6 +29,7 @@ const filters = Object.assign({},{
|
|||||||
paperType:[],
|
paperType:[],
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
isOpen: Boolean,
|
isOpen: Boolean,
|
||||||
allArticles: ref([Object])
|
allArticles: ref([Object])
|
||||||
@ -30,6 +37,12 @@ const props = defineProps({
|
|||||||
|
|
||||||
|
|
||||||
function submit(){
|
function submit(){
|
||||||
|
filters.paperType = paperTypCheckedList.value
|
||||||
|
filters.year = yearCheckedList.value
|
||||||
|
filters.month = monthCheckedList.value
|
||||||
|
filters.access = accessCheckedList.value
|
||||||
|
filters.language = languageCheckedList.value
|
||||||
|
filters.domain = domainCheckedList.value
|
||||||
emit("modal-close")
|
emit("modal-close")
|
||||||
emit("submit", filters)
|
emit("submit", filters)
|
||||||
}
|
}
|
||||||
@ -96,12 +109,12 @@ onClickOutside(target, ()=>emit('modal-close'))
|
|||||||
<div class="modal-wrapper">
|
<div class="modal-wrapper">
|
||||||
<div class="modal-container" ref="target">
|
<div class="modal-container" ref="target">
|
||||||
<div id="filterGrid">
|
<div id="filterGrid">
|
||||||
<div> Year :<ul class="checkers"> <li v-for="n in yearList"> <input type="checkbox" :value=n v-model="filters.year"> {{n}} </li> </ul> </div>
|
<div> Year :<ul class="checkers"> <li v-for="n in yearList"> <input type="checkbox" :value=n v-model="yearCheckedList"> {{n}} </li> </ul> </div>
|
||||||
<div class="vl"> Access :<ul class="checkers"> <li v-for="n in accessList"> <input type="checkbox" :value=n v-model="filters.access"> {{n}} </li> </ul> </div>
|
<div class="vl"> Access :<ul class="checkers"> <li v-for="n in accessList"> <input type="checkbox" :value=n v-model="accessCheckedList"> {{n}} </li> </ul> </div>
|
||||||
<div class="vl"> Language :<ul class="checkers"> <li v-for="n in languageList"> <input type="checkbox" :value=n v-model="filters.language"> {{n}} </li> </ul> </div>
|
<div class="vl"> Language :<ul class="checkers"> <li v-for="n in languageList"> <input type="checkbox" :value=n v-model="languageCheckedList"> {{n}} </li> </ul> </div>
|
||||||
<div> Month :<ul class="checkers"> <li v-for="n in monthList"> <input type="checkbox" :value=n v-model="filters.month"> {{monthToString(n)}} </li> </ul> </div>
|
<div> Month :<ul class="checkers"> <li v-for="n in monthList"> <input type="checkbox" :value=n v-model="monthCheckedList"> {{monthToString(n)}} </li> </ul> </div>
|
||||||
<div class="vl"> Domain :<ul class="checkers"> <li v-for="n in domainList"> <input type="checkbox" :value=n v-model="filters.domain"> {{n}} </li> </ul> </div>
|
<div class="vl"> Domain :<ul class="checkers"> <li v-for="n in domainList"> <input type="checkbox" :value=n v-model="domainCheckedList"> {{n}} </li> </ul> </div>
|
||||||
<div class="vl"> PaperType :<ul class="checkers"> <li v-for="n in paperTypeList"> <input type="checkbox" :value=n v-model="filters.paperType"> {{n}} </li> </ul> </div>
|
<div class="vl"> PaperType :<ul class="checkers"> <li v-for="n in paperTypeList"> <input type="checkbox" :value=n v-model="paperTypCheckedList"> {{n}} </li> </ul> </div>
|
||||||
</div>
|
</div>
|
||||||
<div id="submit">
|
<div id="submit">
|
||||||
<button @click.stop="submit">Submit</button>
|
<button @click.stop="submit">Submit</button>
|
||||||
|
@ -36,7 +36,6 @@ const closeFilter = () => {
|
|||||||
};
|
};
|
||||||
const submitFilters = (receivedFilters)=>{
|
const submitFilters = (receivedFilters)=>{
|
||||||
filters.value = receivedFilters
|
filters.value = receivedFilters
|
||||||
console.log(filters.value)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -1,77 +1,20 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref} from "vue";
|
import { ref} from "vue";
|
||||||
import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
|
|
||||||
import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";
|
|
||||||
import {fetchResearches, } from "@/rest/ScientificPublications/ResearcherProfile.js";
|
import {fetchResearches, } from "@/rest/ScientificPublications/ResearcherProfile.js";
|
||||||
import {getSelf, patchProfile} from "@/rest/ScientificPublications/ManageResearcherProfile.js";
|
import {getSelf, patchProfile} from "@/rest/ScientificPublications/ManageResearcherProfile.js";
|
||||||
import ResearchPostComponent from "@/Apps/ScientificPublications/ResearchPostComponent.vue";
|
import ResearchPostComponent from "@/Apps/ScientificPublications/ResearchPostComponent.vue";
|
||||||
import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
|
import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
|
||||||
const input = ref("");
|
const input = ref("");
|
||||||
const isFilterOpened = ref(false);
|
|
||||||
const isResearchOpened = ref(false);
|
|
||||||
const isPostResearchOpened = ref(false);
|
const isPostResearchOpened = ref(false);
|
||||||
const articleToDisplay = ref()
|
|
||||||
const changing = ref(false);
|
const changing = ref(false);
|
||||||
|
|
||||||
let toModify= Object.assign({}, {});
|
let toModify= Object.assign({}, {});
|
||||||
|
|
||||||
const researcher = ref(await getSelf());
|
const researcher = ref(await getSelf());
|
||||||
const researchList = ref(await fetchResearches(researcher.value.id));
|
const researchList = ref(await fetchResearches(researcher.value.id));
|
||||||
//todo get the filters
|
|
||||||
|
|
||||||
const openFilter = () => {
|
|
||||||
isFilterOpened.value = true;
|
|
||||||
};
|
|
||||||
const closeFilter = () => {
|
|
||||||
isFilterOpened.value = false;
|
|
||||||
};
|
|
||||||
const submitFilters = ()=>{
|
|
||||||
}
|
|
||||||
const openResearch = (article) => {
|
|
||||||
isResearchOpened.value = true;
|
|
||||||
articleToDisplay.value = article;
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeResearch = () => {
|
|
||||||
isResearchOpened.value =false;
|
|
||||||
articleToDisplay.value = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function openPostResearch(){
|
function openPostResearch(){
|
||||||
isPostResearchOpened.value = true
|
isPostResearchOpened.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function searchInList(list, searchInput) {
|
|
||||||
let retList = []
|
|
||||||
for (let i = 0; i < list.length; i++) {
|
|
||||||
if (lDistance(list[i].title, searchInput) < 10 || list[i].title.toUpperCase().indexOf(searchInput.toUpperCase()) > -1){
|
|
||||||
retList.push(list[i])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return retList
|
|
||||||
}
|
|
||||||
|
|
||||||
function lDistance(s,t){
|
|
||||||
if (!s.length) return t.length;
|
|
||||||
if (!t.length) return s.length;
|
|
||||||
const arr = [];
|
|
||||||
for (let i = 0; i <= t.length; i++) {
|
|
||||||
arr[i] = [i];
|
|
||||||
for (let j = 1; j <= s.length; j++) {
|
|
||||||
arr[i][j] =
|
|
||||||
i === 0
|
|
||||||
? j
|
|
||||||
: Math.min(
|
|
||||||
arr[i - 1][j] + 1,
|
|
||||||
arr[i][j - 1] + 1,
|
|
||||||
arr[i - 1][j - 1] + (s[j - 1] === t[i - 1] ? 0 : 1)
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return arr[t.length][s.length];
|
|
||||||
}
|
|
||||||
|
|
||||||
function cancelChanges(){
|
function cancelChanges(){
|
||||||
changing.value = false
|
changing.value = false
|
||||||
toModify= Object.assign({}, {});
|
toModify= Object.assign({}, {});
|
||||||
@ -91,8 +34,6 @@ async function modifiedResearch(){
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template> <div class="body"><div id="main">
|
<template> <div class="body"><div id="main">
|
||||||
<FilterComponent :isOpen="isFilterOpened" :allArticles="researchList" @modal-close="closeFilter" @submit="submitFilters()"></FilterComponent>
|
|
||||||
<ArticleComponent :article="articleToDisplay" :isOpen="isResearchOpened" :manage="true" @modal-close="closeResearch" @modified="modifiedResearch" ></ArticleComponent>
|
|
||||||
<ResearchPostComponent :researcher="researcher" :isOpen="isPostResearchOpened" @modal-close="isPostResearchOpened = false" @posted="modifiedResearch"></ResearchPostComponent>
|
<ResearchPostComponent :researcher="researcher" :isOpen="isPostResearchOpened" @modal-close="isPostResearchOpened = false" @posted="modifiedResearch"></ResearchPostComponent>
|
||||||
<div id="profilePicture">
|
<div id="profilePicture">
|
||||||
<img src="/Clyde.png" />
|
<img src="/Clyde.png" />
|
||||||
@ -126,7 +67,7 @@ async function modifiedResearch(){
|
|||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div id="researches"> <ListResearches :research-list="researchList" :manage="true" @modified="modifiedResearch"></ListResearches> </div>
|
<div> <ListResearches :research-list="researchList" :manage="true" @modified="modifiedResearch"></ListResearches> </div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -187,6 +128,7 @@ async function modifiedResearch(){
|
|||||||
font-size: xx-large;
|
font-size: xx-large;
|
||||||
background-color:rgba(191, 64, 191,0.5);
|
background-color:rgba(191, 64, 191,0.5);
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.modifyButton:hover{
|
.modifyButton:hover{
|
||||||
@ -219,61 +161,9 @@ async function modifiedResearch(){
|
|||||||
background: #4cd964;
|
background: #4cd964;
|
||||||
}
|
}
|
||||||
|
|
||||||
#search{
|
|
||||||
width: 100%;
|
|
||||||
height: 10%;
|
|
||||||
display: inline-flex;
|
|
||||||
}
|
|
||||||
#search-input {
|
|
||||||
margin-left: 25px;
|
|
||||||
width: 75%;
|
|
||||||
font-size: 16px;
|
|
||||||
padding: 12px 20px 12px 40px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
height: 20px;
|
|
||||||
align-self: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#filterButton {
|
|
||||||
align-self: center;
|
|
||||||
margin-left: 2px;
|
|
||||||
font-size: xx-large;
|
|
||||||
color: white;
|
|
||||||
background: rgba(191, 64, 191,0.5);
|
|
||||||
border:2px solid black;
|
|
||||||
}
|
|
||||||
#filterButton:hover{
|
|
||||||
background: rgba(191, 64, 191);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#researchUL {
|
|
||||||
list-style-type: none;
|
|
||||||
color: white;
|
|
||||||
padding: 12px;
|
|
||||||
margin: 5px;
|
|
||||||
height: 400px;
|
|
||||||
overflow: scroll;
|
|
||||||
}
|
|
||||||
#researchLi{
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: auto auto auto;
|
|
||||||
border: 2px solid black;
|
|
||||||
color: white;
|
|
||||||
font-size: x-large;
|
|
||||||
text-align: center;
|
|
||||||
text-indent: 7px;
|
|
||||||
background-color: rgba(255, 255, 255, 0.09);
|
|
||||||
border-radius: 18px;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
a{
|
a{
|
||||||
color:#007aff;
|
color:#007aff;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vl {
|
|
||||||
border-right: 2px solid black;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
@ -7,17 +7,11 @@
|
|||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, reactive } from "vue";
|
import { ref, reactive } from "vue";
|
||||||
import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
|
import {fetchResearcher, fetchResearches, fetchStats} from "@/rest/ScientificPublications/ResearcherProfile.js";
|
||||||
import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";
|
|
||||||
import {fetchResearcher, fetchResearches, fetchStats, fetchResearch} from "@/rest/ScientificPublications/ResearcherProfile.js";
|
|
||||||
import {getFile, addView} from "@/rest/ScientificPublications/ManageResearch.js";
|
|
||||||
import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
|
import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
|
||||||
const input = ref("");
|
const input = ref("");
|
||||||
const statsOf = ref("");
|
const statsOf = ref("");
|
||||||
const statsBy = ref("");
|
const statsBy = ref("");
|
||||||
const isFilterOpened = ref(false);
|
|
||||||
const isResearchOpened = ref(false);
|
|
||||||
const articleToDisplay = ref(Object)
|
|
||||||
let chart;
|
let chart;
|
||||||
|
|
||||||
const researcherId = window.location.href.split("=")[1]
|
const researcherId = window.location.href.split("=")[1]
|
||||||
@ -27,29 +21,6 @@ const researchList = ref(await fetchResearches(researcherId));
|
|||||||
const researcher = ref(await fetchResearcher(researcherId));
|
const researcher = ref(await fetchResearcher(researcherId));
|
||||||
const stats = ref(await fetchStats(researcherId))
|
const stats = ref(await fetchStats(researcherId))
|
||||||
|
|
||||||
const closeFilter = () => {
|
|
||||||
isFilterOpened.value = false;
|
|
||||||
};
|
|
||||||
const submitFilters = ()=>{
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeResearch = () => {
|
|
||||||
isResearchOpened.value =false;
|
|
||||||
articleToDisplay.value = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const downloadBibTex = (research) => {
|
|
||||||
getFile(research.bibTexLocation)
|
|
||||||
}
|
|
||||||
|
|
||||||
async function downloadArticle (research) {
|
|
||||||
await addView(research.pdfLocation)
|
|
||||||
await getFile(research.pdfLocation)
|
|
||||||
articleToDisplay.value = await fetchResearch(articleToDisplay.value.id)
|
|
||||||
stats.value = await fetchStats(researcher.value.id)
|
|
||||||
update()
|
|
||||||
}
|
|
||||||
|
|
||||||
function downloadCoAuthors(){
|
function downloadCoAuthors(){
|
||||||
let coAuthors = []
|
let coAuthors = []
|
||||||
for (let i in researchList.value) {
|
for (let i in researchList.value) {
|
||||||
@ -100,8 +71,6 @@ function update(){
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div id="main">
|
<div id="main">
|
||||||
<FilterComponent :isOpen="isFilterOpened" :allArticles="researchList" @modal-close="closeFilter" @submit="submitFilters()"></FilterComponent>
|
|
||||||
<ArticleComponent :article="articleToDisplay" :isOpen="isResearchOpened" :manage="false" @modal-close="closeResearch" @downloadPdf="downloadArticle(articleToDisplay)" @downloadBibTex="downloadBibTex(articleToDisplay)"></ArticleComponent>
|
|
||||||
<div id="profilePicture">
|
<div id="profilePicture">
|
||||||
<img src="/Clyde.png" />
|
<img src="/Clyde.png" />
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user