Commit ff772fe7 authored by Viacheslav Pavlov's avatar Viacheslav Pavlov
Browse files

MCPD date presentation control

parent 42b3228c
import * as React from 'react';
export default function McpdDate({ value, locale = 'en-GB' }: { value: string, locale?: string }) {
if (!value) {
return (<i>Date not provided</i>);
}
const year = value.substr(0, 4);
const month = value.substr(4, 2);
const day = value.substr(6, 2);
let mcpdDate;
if (!month || month === '--' || month === '00') {
mcpdDate = year;
} else {
if (!day || day === '--' || day === '00') {
const options = {year: 'numeric', month: 'long'};
mcpdDate = new Date(parseInt(year, 10), parseInt(month, 10) - 1, 1).toLocaleDateString(locale, options);
} else {
const options = {year: 'numeric', month: 'long', day: 'numeric'};
mcpdDate = new Date(parseInt(year, 10), parseInt(month, 10) - 1, parseInt(day, 10)).toLocaleDateString(locale, options);
}
}
return (
<span className="prettydate">
{ mcpdDate }
</span>
);
}
......@@ -25,6 +25,7 @@ import ReduxCheckbox from 'ui/common/checkbox';
import CropChips from 'ui/genesys/crop/CropChips';
import LocationMap from 'ui/common/LocationMap';
import {InstituteLink} from 'ui/genesys/Links';
import McpdDate from 'ui/common/time/McpdDate';
interface IBrowsePageProps extends React.ClassAttributes<any> {
......@@ -121,7 +122,7 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
</PropertiesItem>
<PropertiesItem title="Country of holding institute">{ accession.institute.country.name }</PropertiesItem>
<PropertiesItem title="Institute code">{ accession.institute.code }</PropertiesItem>
<PropertiesItem title="Acquisition date">{ accession.acquisitionDate }</PropertiesItem>
<PropertiesItem title="Acquisition date"><McpdDate value={ accession.acquisitionDate } /></PropertiesItem>
<PropertiesItem title="Biological status of accession">{ accession.sampStat }</PropertiesItem>
<PropertiesItem title="Availability for distribution">{ t(`accession.available.${accession.available}`) }</PropertiesItem>
......@@ -168,41 +169,44 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
</Properties>
</PageSection>
<PageSection title="Collecting information">
<Properties>
{ accession.countryOfOrigin && <PropertiesItem title="Country of origin">{ accession.countryOfOrigin.name }</PropertiesItem> }
{ accession.coll &&
[ 'collDate', 'collMissId', 'collNumb', 'collSite', 'collSrc' ]
.filter((prop) => accession.coll[prop] !== null).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.coll.${prop}`) }>{ accession.coll[prop] }</PropertiesItem>
))
}
{ accession.coll &&
[ 'collCode', 'collName' ]
.filter((prop) => accession.coll[prop].length).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.coll.${prop}`) }>{ accession.coll[prop] }</PropertiesItem>
))
}
{ accession.geo &&
[ 'latitude', 'longitude', 'datum', 'method', 'uncertainty', 'elevation' ]
.filter((prop) => accession.geo[prop] !== null).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.geo.${prop}`) }>{ accession.geo[prop] }</PropertiesItem>
))
}
</Properties>
{ accession.coll &&
<PageSection title="Collecting information">
<Properties>
{ accession.countryOfOrigin && <PropertiesItem title="Country of origin">{ accession.countryOfOrigin.name }</PropertiesItem> }
{ accession.coll.collDate && <PropertiesItem key="collDate" title={ t(`accession.coll.collDate`) }><McpdDate value={ accession.coll.collDate } /></PropertiesItem> }
{ accession.coll &&
[ 'collMissId', 'collNumb', 'collSite', 'collSrc' ]
.filter((prop) => accession.coll[prop] !== null).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.coll.${prop}`) }>{ accession.coll[prop] }</PropertiesItem>
))
}
{ accession.coll &&
[ 'collCode', 'collName' ]
.filter((prop) => accession.coll[prop].length).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.coll.${prop}`) }>{ accession.coll[prop] }</PropertiesItem>
))
}
{ accession.geo &&
[ 'latitude', 'longitude', 'datum', 'method', 'uncertainty', 'elevation' ]
.filter((prop) => accession.geo[prop] !== null).map((prop) => (
<PropertiesItem key={ prop } title={ t(`accession.geo.${prop}`) }>{ accession.geo[prop] }</PropertiesItem>
))
}
</Properties>
{ hasLatLon &&
<LocationMap
location={
{
id: accession.geo.id,
lat: accession.geo.latitude,
lng: accession.geo.longitude,
{ hasLatLon &&
<LocationMap
location={
{
id: accession.geo.id,
lat: accession.geo.latitude,
lng: accession.geo.longitude,
}
}
}
/>
}
</PageSection>
/>
}
</PageSection>
}
{ accession.remarks && accession.remarks.length > 0 && <PageSection title="Remarks">
<Properties>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment