From f596221df25704367b465daa639c73a1920254a9 Mon Sep 17 00:00:00 2001
From: Remi PLANEL <rplanel@pasteur.fr>
Date: Thu, 16 Feb 2023 14:29:11 +0100
Subject: [PATCH] Make reference a link
---
components/content/ReferencesList.vue | 23 ++++++++++++++++++-----
1 file changed, 18 insertions(+), 5 deletions(-)
diff --git a/components/content/ReferencesList.vue b/components/content/ReferencesList.vue
index 66c9ba38..d36b9b11 100644
--- a/components/content/ReferencesList.vue
+++ b/components/content/ReferencesList.vue
@@ -1,10 +1,17 @@
<template>
<ProseOl v-if="computedItems.length > 0">
- <ProseLi v-for="item in computedItems" :key="item.DOI" class="refArticle">
- <div class="ref-title">{{ item.title }}.</div>
- <div class="ref-authors">{{ item.authorsString }}</div>
- <div>{{ item?.containerTitle }}</div>
- </ProseLi>
+ <ProseA
+ v-for="item in computedItems"
+ :key="item.DOI"
+ :href="item.href"
+ target="blank"
+ >
+ <ProseLi class="refArticle">
+ <div class="ref-title">{{ item.title }}.</div>
+ <div class="ref-authors">{{ item.authorsString }}</div>
+ <div>{{ item?.containerTitle }}</div>
+ </ProseLi>
+ </ProseA>
</ProseOl>
</template>
@@ -15,6 +22,7 @@ const props = defineProps<{
items: string[];
}>();
+const doiBaseUrl = ref(new URL("https://doi.org/"));
const fetchedDoi = ref(
await Promise.all(
props.items.map(async (doi) => {
@@ -53,6 +61,7 @@ const computedItems = computed(() => {
authorsString: toAuthorsString(doi?.message?.author ?? []),
containerTitle: cts?.length > 0 ? cts[0] : ct?.length > 0 ? ct[0] : "",
abstract,
+ href: getReferenceUrl(DOI),
};
} else {
return {};
@@ -67,6 +76,10 @@ function toAuthorsString(authors: Array<{ family: string; given: string }>) {
})
.join(", ");
}
+
+function getReferenceUrl(doi) {
+ return new URL(doi, doiBaseUrl.value).href;
+}
</script>
<style lang="ts">
--
GitLab