Skip to content

Commit

Permalink
move specimen description to its own component
Browse files Browse the repository at this point in the history
  • Loading branch information
wbbaker committed Aug 22, 2024
1 parent 0ff0f3d commit 05fda1a
Show file tree
Hide file tree
Showing 2 changed files with 84 additions and 66 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -17,26 +17,8 @@
<VCardContent class="text-sm">
<p v-if="typeof inventoryDWC === 'string'" v-html="inventoryDWC"/>
<ul v-else class="tree ml-2">
<li v-for="inventoryItem in inventoryDWC" :key="inventoryItem.id" class="mt-1">
<details>
<summary class="cursor-pointer">
{{ makeInventoryLabel(inventoryItem) }}
</summary>
<ul class="m-2 ml-6 list-disc">
<li v-for="detail in makeInventoryDetails(inventoryItem)" v-html="detail" :key="detail?.id"/>
<li>
<details>
<summary class="cursor-pointer">Full Record ({{Object.keys(inventoryItem).length}} items)</summary>
<dl class="m-2 ml-6">
<template v-for="entry in Object.entries(inventoryItem)" :key="entry[0]">
<dt>{{ entry[0] }}</dt>
<dd class="ml-4 mb-2">{{ entry[1] }}</dd>
</template>
</dl>
</details>
</li>
</ul>
</details>
<li v-for="specimen in inventoryDWC" :key="specimen.id" class="mt-1">
<SpecimenSummary :specimen="specimen"/>
</li>
</ul>
</VCardContent>
Expand All @@ -48,6 +30,7 @@ import { ref, watch } from 'vue'
import PanelDropdown from '../PanelDropdown.vue'
import { useOtuPageRequest } from "@/modules/otus/helpers/useOtuPageRequest.js"
import TaxonWorks from "@/modules/otus/services/TaxonWorks.js"
import SpecimenSummary from "@/modules/otus/components/Panel/PanelSpecimens/SpecimenSummary.vue"
const props = defineProps({
otuId: {
Expand All @@ -59,52 +42,6 @@ const props = defineProps({
const inventoryDWC = ref("Loading...")
const isLoading = ref(false)
/** Based on taxonpages-orthoptera PanelSpecimentRecords. */
function makeInventoryLabel(item) {
return [
item.catalogNumber,
makeLocationDescription(item),
item.year,
// `length ${JSON.stringify(item).length}`,
].filter(Boolean).join("; ")
}
function makeInventoryDetails(item) {
return [
makeInventoryCollectionDate(item),
item.recordedBy && `Recorded by ${item.recordedBy}`,
makeIdentifiedByDesccription(item),
item.georeferencedBy && `Georeferenced by ${item.georeferencedBy}${makeGeoreferenceUncertainty(item)}`,
// CollectionObject #1234
item.dwc_occurrence_object_id && `${item.dwc_occurrence_object_type} #${item.dwc_occurrence_object_id}`,
].filter(Boolean)
}
function makeLocationDescription(item) {
return [
item.country && item.country,
item.stateProvince && item.stateProvince,
item.county && `${item.county} County`,
].filter(Boolean).join(", ")
}
function makeIdentifiedByDesccription(item) {
return [
item.identifiedBy && `Identified by ${item.identifiedBy}`,
item.dateIdentified,
].filter(Boolean).join(", ")
}
function makeInventoryCollectionDate(item) {
if (!item.year) return null
const date = new Date(item.year, item.month, item.day)
return `Collected ${date.toLocaleDateString()}`
}
function makeGeoreferenceUncertainty(item) {
return item.coordinateUncertaintyInMeters && ` to within ${item.coordinateUncertaintyInMeters} meters`
}
watch(
() => props.otuId,
async () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
<!--
A text summary of a Darwin Core representation of a specimen,
from the TaxonWorks api /otus/<ID>/inventory/dwc.json.
For further reference see https://dwc.tdwg.org/terms/.
-->
<template>
<details>
<summary class="cursor-pointer">
{{ describeSpecimen(specimen) }}
</summary>
<ul class="m-2 ml-6 list-disc">
<li v-for="detail in describeDetails(specimen)" v-html="detail" :key="detail?.id"/>
<li>
<details>
<summary class="cursor-pointer">Full Record ({{Object.keys(specimen).length}} items)</summary>
<dl class="m-2 ml-6">
<template v-for="entry in Object.entries(specimen)" :key="entry[0]">
<dt>{{ entry[0] }}</dt>
<dd class="ml-4 mb-2">{{ entry[1] }}</dd>
</template>
</dl>
</details>
</li>
</ul>
</details>
</template>

<script setup>
const props = defineProps({
specimen: {
type: Object, // Darwin Core schema -- see above for references
required: true,
}
})

/** Based on taxonpages-orthoptera PanelSpecimenRecords. */
function describeSpecimen(specimen) {
return [
specimen.catalogNumber,
describeLocation(specimen),
specimen.year,
// `length ${JSON.stringify(item).length}`,
].filter(Boolean).join("; ")
}

function describeDetails(specimen) {
return [
describeCollectionDate(specimen),
specimen.recordedBy && `Recorded by ${specimen.recordedBy}`,
describeIdentifiedBy(specimen),
specimen.georeferencedBy && `Georeferenced by ${specimen.georeferencedBy}${describeGeoreferenceUncertainty(specimen)}`,
// CollectionObject #1234
specimen.dwc_occurrence_object_id && `${specimen.dwc_occurrence_object_type} #${specimen.dwc_occurrence_object_id}`,
].filter(Boolean)
}

function describeLocation(specimen) {
return [
specimen.country && specimen.country,
specimen.stateProvince && specimen.stateProvince,
specimen.county && `${specimen.county} County`,
].filter(Boolean).join(", ")
}

function describeIdentifiedBy(specimen) {
return [
specimen.identifiedBy && `Identified by ${specimen.identifiedBy}`,
specimen.dateIdentified,
].filter(Boolean).join(", ")
}

function describeCollectionDate(specimen) {
if (!specimen.year) return null
const date = new Date(specimen.year, specimen.month, specimen.day)
return `Collected ${date.toLocaleDateString()}`
}

function describeGeoreferenceUncertainty(specimen) {
return specimen.coordinateUncertaintyInMeters && ` to within ${specimen.coordinateUncertaintyInMeters} meters`
}
</script>

0 comments on commit 05fda1a

Please sign in to comment.