Commit 5e430f38 authored by Matija Obreza's avatar Matija Obreza
Browse files

Merge branch '227-descriptorlist-displaypage' into 'master'

Resolve "DescriptorList: DisplayPage"

Closes #227

See merge request genesys-pgr/genesys-ui!233
parents 89f3353e 3430ebe4
......@@ -6,12 +6,12 @@ import withStyles from '@material-ui/core/styles/withStyles';
/*tslint:disable*/
const style = (theme) => ({
cropBlurb: {
padding: '16px',
[theme.breakpoints.up('md')]: {
columnCount: 2,
columnGap: '3rem',
},
[theme.breakpoints.up('xl')]: {
// padding: '16px',
// [theme.breakpoints.up('md')]: {
// columnCount: 2,
// columnGap: '3rem',
// },
[theme.breakpoints.up('lg')]: {
columnCount: 3,
columnGap: '3rem',
},
......
......@@ -87,9 +87,9 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
<PageContents className="pt-1rem">
<MainSection title={ t('crop.public.p.display.generalInformation') }>
{ cropDetails.blurb && cropDetails.blurb.body &&
<Properties>
<div className="mb-20">
<BlurbText body={ cropDetails.blurb.body } />
</Properties>
</div>
}
<Properties>
<PropertiesItem title={ t('crop.public.c.cropCard.originalName') }>{ crop.name }</PropertiesItem>
......
......@@ -9,7 +9,6 @@ import { fixDate } from 'utilities';
import { loadDescriptor, publishDescriptor, deleteDescriptor, approveDescriptor, rejectDescriptor } from 'descriptors/actions/editor';
import Descriptor, { DataType as DescriptorDataType } from 'model/catalog/Descriptor';
import VocabularyTerm from 'model/vocabulary/VocabularyTerm';
import { PublishState } from 'model/common.model';
import confirm from 'utilities/confirmAlert';
......@@ -21,7 +20,6 @@ import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import PrettyDate from 'ui/common/time/PrettyDate';
import { ScrollToTopOnMount } from 'ui/common/page/scrollers';
import { PartnerLink, CropLink, DescriptorListLink, DatasetLink } from 'ui/catalog/Links';
import { Table, TableRow, TableCell } from 'ui/common/tables';
import { Properties, PropertiesItem } from 'ui/common/Properties';
import VocabularyCard from 'vocabulary/ui/c/VocabularyCard';
import DescriptorScale from 'descriptors/ui/c/DescriptorScale';
......@@ -36,6 +34,7 @@ import Button from '@material-ui/core/Button';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';
import DescriptorTerms from './c/DescriptorTerms';
interface IDisplayPageProps extends React.ClassAttributes<any> {
classes: any;
......@@ -225,21 +224,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
{ descriptor.dataType === DescriptorDataType.CODED && descriptor.terms && descriptor.terms.length > 0 && (
<Grid item xs={ 12 } className="p-10">
<Section title={ t('descriptors.public.p.display.codingTable') }>
<Table widths={ ['10%', '20%', null] } headers={ (
<TableRow>
<TableCell>{ t('descriptors.public.p.display.code') }</TableCell>
<TableCell>{ t('descriptors.public.p.display.term') }</TableCell>
<TableCell>{ t('descriptors.public.p.display.description') }</TableCell>
</TableRow>
) }>
{ descriptor.terms.map((term: VocabularyTerm) => (
<TableRow key={ term.code }>
<TableCell className="font-bold">{ term.code }</TableCell>
<TableCell>{ term.title }</TableCell>
<TableCell>{ term.description }</TableCell>
</TableRow>
)) }
</Table>
<DescriptorTerms terms={ descriptor.terms } />
</Section>
</Grid>
) }
......
......@@ -8,9 +8,10 @@ import { translate } from 'react-i18next';
import { Properties, PropertiesItem } from 'ui/common/Properties';
import Descriptor from 'model/catalog/Descriptor';
import VocabularyTerm from 'model/vocabulary/VocabularyTerm';
import Descriptor, { DataType as DescriptorDataType } from 'model/catalog/Descriptor';
import { DescriptorLink, PartnerLink, CropLink } from 'ui/catalog/Links';
import DescriptorTerms from './DescriptorTerms';
import DescriptorScale from './DescriptorScale';
interface ICardProps {
complete?: boolean;
......@@ -194,16 +195,21 @@ const DescriptorCard = ({ complete = true, compact, descriptor, classes, classNa
{ t(`descriptors.common.dataType.${descriptor.dataType.toLowerCase()}`) }
</PropertiesItem>
) }
{ displayPref.dataType && descriptor.dataType === DescriptorDataType.NUMERIC && (
<PropertiesItem title={ t('descriptors.sort.uom') }>
{ descriptor.uom }
</PropertiesItem>
) }
</Properties>
</Grid>
{ (displayPref.vocabulary && descriptor.terms) && (
{ (displayPref.vocabulary && descriptor.terms && descriptor.terms.length > 0) && (
<Grid item xs={ 12 }>
{ descriptor.terms.map((term: VocabularyTerm) => (
<div key={ term.code }>{ term.code } &rarr; <b>{ term.title }</b> { term.description }</div>
)) }
{ descriptor.dataType === DescriptorDataType.CODED && <DescriptorTerms terms={ descriptor.terms } /> }
{ descriptor.dataType === DescriptorDataType.SCALE && <DescriptorScale className="mt-20" min={ descriptor.minValue } max={ descriptor.maxValue } decimal={ !descriptor.integerOnly } labels={ descriptor.terms } /> }
</Grid>
) }
{ errorMessage &&
<div className={ classes.errorMessage }>{ errorMessage }</div>
}
......
......@@ -59,7 +59,7 @@ const styles = (theme) => ({
/* tslint:enable */
});
const DescriptorScale = ({ classes, decimal, min, max, labels, className = '' }: { classes: any, decimal?: boolean, min: number, max: number, labels: VocabularyTerm[], className: string }) => {
const DescriptorScale = ({ classes, decimal, min, max, labels, className = '' }: { classes: any, decimal?: boolean, min: number, max: number, labels: VocabularyTerm[], className?: string }) => {
// Test if labels are provided
const bits: number[] = labels !== null ? labels.map((l) => +l.code) : [];
......
import * as React from 'react';
import { translate } from 'react-i18next';
import VocabularyTerm from 'model/vocabulary/VocabularyTerm';
import { Table, TableRow, TableCell } from 'ui/common/tables';
const DescriptorTerms = ({ terms, t }: { terms: VocabularyTerm[], t: any }) => {
if (! terms) {
return null;
}
// console.log(terms);
return (
<Table widths={ ['10%', '20%', null] } headers={ (
<TableRow>
<TableCell>{ t('descriptors.public.p.display.code') }</TableCell>
<TableCell>{ t('descriptors.public.p.display.term') }</TableCell>
<TableCell>{ t('descriptors.public.p.display.description') }</TableCell>
</TableRow>
) }>
{ terms.map((term: VocabularyTerm) => (
<TableRow key={ term.code }>
<TableCell className="font-bold">{ term.code }</TableCell>
<TableCell>{ term.title }</TableCell>
<TableCell>{ term.description }</TableCell>
</TableRow>
)) }
</Table>
);
};
export default translate()(DescriptorTerms);
......@@ -137,9 +137,9 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
<PageContents className="pt-1rem">
<MainSection title={ t('institutes.public.p.display.title') }>
{ institute.blurb && institute.blurb.body &&
<Properties>
<div className="mb-20">
<BlurbText body={ institute.blurb.body } />
</Properties>
</div>
}
<Properties>
<PropertiesItem title={ t('institutes.common.instituteCode') }>{ institute.details.code }</PropertiesItem>
......
......@@ -5,7 +5,7 @@ import * as React from 'react';
import MuiTable from '@material-ui/core/Table';
import MuiTableBody from '@material-ui/core/TableBody';
import MuiTableCell from '@material-ui/core/TableCell';
import MuiTableFooter from '@material-ui/core/TableFooter';
// import MuiTableFooter from '@material-ui/core/TableFooter';
import MuiTableHead from '@material-ui/core/TableHead';
import MuiTableRow from '@material-ui/core/TableRow';
......@@ -39,9 +39,6 @@ function Table({ headers, children, widths = [], maxHeight }: ITableProps) {
<MuiTableBody>
{ children }
</MuiTableBody>
<MuiTableFooter>
<MuiTableRow style={ { height: '2rem' } } />
</MuiTableFooter>
</MuiTable>
);
}
......
......@@ -496,14 +496,14 @@ table.genesys-table {
}
}
// This adds the "margins" to the left and right of the table
tr > td, tr > th {
&:first-child {
border-left: solid 1rem White;
}
&:last-child {
border-right: solid 1rem White;
}
}
// tr > td, tr > th {
// &:first-child {
// border-left: solid 1rem White;
// }
// &:last-child {
// border-right: solid 1rem White;
// }
// }
tbody {
> tr {
......
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