Commit 7c82f341 authored by Matija Obreza's avatar Matija Obreza
Browse files

Tables: Added DATE_WITHCODE_RENDERER support and PrettyDate uses friendly display for future dates

parent d6530930
......@@ -295,6 +295,7 @@ const MIN_COLUMN_WIDTH = 10;
export class Renderers {
public static DATE_RENDERER = ({ value }: { value: Date }): JSX.Element => value ? <PrettyDate value={ value } /> : null;
public static DATE_WITHCODE_RENDERER = (formatField: string) => ({ value, row }: { value: Date, row: unknown }): JSX.Element => value ? <PrettyDate value={ value } format={ row[formatField] } /> : null;
public static STRING_BOOL_RENDERER = ({ value }: { value: string }): JSX.Element => {
if(value) {
return <div className={ `boolField ${value === 'Y' ? 'boolY' : 'boolN'}` }>{value}</div>
......
......@@ -41,7 +41,7 @@ export default connect(mapStateToProps, null)(withTranslation()(function PrettyD
return (
<span className="prettydate">
{ !simple && diffDays <= 4 ?
{ !simple && (diffDays <= 4 || diffSeconds < 0) ?
moment(value).fromNow()
:
dateFormatter(format)(value)
......
......@@ -23,10 +23,10 @@ const BasicAccessionActionsTableConfigProps = {
id: { readonly: true, align: TextAlign.right },
},
columnRenderers: {
notBeforeDate: Renderers.DATE_RENDERER,
notBeforeDate: Renderers.DATE_WITHCODE_RENDERER('notBeforeDateCode'),
createdDate: Renderers.DATE_RENDERER,
startedDate: Renderers.DATE_RENDERER,
completedDate: Renderers.DATE_RENDERER,
startedDate: Renderers.DATE_WITHCODE_RENDERER('startedDateCode'),
completedDate: Renderers.DATE_WITHCODE_RENDERER('completedDateCode'),
isWebVisible: Renderers.STRING_BOOL_RENDERER,
actionNameCode: ({ value }: { value: string }) => <CodeValueDisplay codeGroup={ AccessionAction.CodeGroup.actionNameCode } value={ value } />,
},
......
......@@ -29,10 +29,10 @@ const BasicInventoryActionsTableConfigProps = {
formCode: { align: TextAlign.center },
},
columnRenderers: {
notBeforeDate: Renderers.DATE_RENDERER,
notBeforeDate: Renderers.DATE_WITHCODE_RENDERER('notBeforeDateCode'),
createdDate: Renderers.DATE_RENDERER,
startedDate: Renderers.DATE_RENDERER,
completedDate: Renderers.DATE_RENDERER,
startedDate: Renderers.DATE_WITHCODE_RENDERER('startedDateCode'),
completedDate: Renderers.DATE_WITHCODE_RENDERER('completedDateCode'),
quantity: ({ value }: { value: number }) => <Number value={ value } />,
formCode: ({ value }: { value: string }) => <CodeValueDisplay codeGroup={ InventoryAction.CodeGroup.formCode } value={ value } description />,
actionNameCode: ({ value }: { value: string }) => <CodeValueDisplay codeGroup={ InventoryAction.CodeGroup.actionNameCode } value={ value } />,
......@@ -68,8 +68,6 @@ const InventoryActionsTableConfigProps = {
inventory: ({ value }: { value: Inventory }) => value && <InventoryLink inventory={ value } />,
accession: ({ row }: { row: InventoryAction }) => row.inventory && row.inventory.accession && <AccessionLink accession={ row.inventory.accession } />,
durationInDays: Renderers.NUMBER_RENDERER,
startedDate: Renderers.DATE_RENDERER,
completedDate: Renderers.DATE_RENDERER,
quantity: Renderers.NUMBER_RENDERER,
},
};
......
......@@ -27,9 +27,9 @@ const BasicRequestActionsTableConfigProps = {
id: { readonly: true, align: TextAlign.right },
},
columnRenderers: {
notBeforeDate: Renderers.DATE_RENDERER,
startedDate: Renderers.DATE_RENDERER,
completedDate: Renderers.DATE_RENDERER,
notBeforeDate: Renderers.DATE_WITHCODE_RENDERER('notBeforeDateCode'),
startedDate: Renderers.DATE_WITHCODE_RENDERER('startedDateCode'),
completedDate: Renderers.DATE_WITHCODE_RENDERER('completedDateCode'),
actionNameCode: ({ value }: { value: string }) => <CodeValueDisplay codeGroup={ OrderRequestAction.CodeGroup.actionNameCode } value={ value } />,
cooperator: ({ value: cooperator }: { value: Cooperator }): JSX.Element => <CooperatorLink cooperator={ cooperator } />,
},
......
......@@ -7,7 +7,7 @@ import { WithTranslation, withTranslation } from 'react-i18next';
import { Accession, Inventory, InventoryMaintenancePolicy } from '@gringlobal-ce/client/model/gringlobal';
// Ui
import ContentHeader from '@gringlobal-ce/client/ui/common/heading/ContentHeader';
import Table, { TextAlign } from '@gringlobal-ce/client/ui/common/table/Table';
import Table, { Renderers, TextAlign } from '@gringlobal-ce/client/ui/common/table/Table';
import { CooperatorOwnedTableConfiguration as TableConfiguration } from '@gringlobal-ce/client/ui/common/table/TableConfiguration';
import PageTitle from '@gringlobal-ce/client/ui/common/PageTitle';
import FiltersButton from 'accession/ui/c/FiltersButton';
......@@ -31,6 +31,7 @@ interface IOrderBrowsePageProps extends React.ClassAttributes<any>, WithTranslat
export const InventoryViabilityOrderTableDefaultConfig = {
defaultColumns: [
'id',
'notBeforeDate',
'accession',
'formTypeCode',
'inventoryNumber',
......@@ -48,7 +49,7 @@ export const InventoryViabilityOrderTableDefaultConfig = {
defaultColumnSettings: {
id: { readonly: true, align: TextAlign.right },
formTypeCode: { align: TextAlign.center },
notBeforeDate: { align: TextAlign.center, label: 'client:model.InventoryAction.notBeforeDate' },
// inventory.accession
...[
'taxonomySpecies', 'improvementStatusCode',
......@@ -56,6 +57,7 @@ export const InventoryViabilityOrderTableDefaultConfig = {
].reduce((obj, prop) => ({...obj, [prop]: { label: `client:model.Accession.${prop}` }}), {}),
},
columnRenderers: {
notBeforeDate: Renderers.DATE_WITHCODE_RENDERER('notBeforeDateCode'),
accession: ({ value: accession }: { value: Accession }): JSX.Element => accession ? <AccessionLink accession={ accession }/> : null,
formTypeCode: ({ value: codeValue }: { value: string }) => <CodeValueDisplay codeGroup={ Inventory.CodeGroup.formTypeCode } value={ codeValue } description />,
inventoryNumber: ({ row: inventory }: { row: Inventory }): JSX.Element => <InventoryLink inventory={ inventory }/>,
......@@ -79,7 +81,6 @@ export const InventoryViabilityOrderTableDefaultConfig = {
const InventoryViabilityOrderTableConfig = new TableConfiguration(InventoryViabilityOrderTableDefaultConfig);
class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
private scheduledInventories = [];
public constructor(props) {
super(props);
......@@ -89,6 +90,7 @@ class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
selected: [],
filter: {},
scheduledActions: null,
scheduledInventories: null,
orderDialogIsOpen: false,
error: null,
};
......@@ -107,7 +109,8 @@ class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
}
private rowsToggled = (selectedRows: number[]) => {
const selected = selectedRows.map((rowIndex) => this.scheduledInventories[rowIndex])
const { scheduledInventories } = this.state;
const selected = selectedRows.map((rowIndex) => scheduledInventories[rowIndex])
this.setState({ selected });
}
......@@ -115,7 +118,8 @@ class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
private loadData = () => {
InventoryViabilityService.listScheduledInventories(this.state.filter)
.then((scheduledActions) => {
this.setState({ scheduledActions })
const scheduledInventories = scheduledActions.content.map(action => { return { ...action.inventory, notBeforeDate: action.notBeforeDate, notBeforeDateCode: action.notBeforeDateCode } });
this.setState({ scheduledActions, scheduledInventories })
})
}
......@@ -150,13 +154,12 @@ class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
public render() {
const { t } = this.props;
const { scheduledActions, selected, filter, orderDialogIsOpen, error } = this.state;
const { scheduledActions, scheduledInventories, selected, filter, orderDialogIsOpen, error } = this.state;
if (!scheduledActions) {
if (!scheduledInventories) {
return <Loading/>
}
this.scheduledInventories = scheduledActions.content.map((action) => action.inventory);
const actions = [
{
......@@ -181,7 +184,7 @@ class OrderBrowsePage extends React.Component<IOrderBrowsePageProps> {
tableKey="viability-scheduled-list"
type={ 'Inventory' }
columns={ InventoryViabilityOrderTableConfig.defaultColumns }
data={ this.scheduledInventories }
data={ scheduledInventories }
tableConfig={ InventoryViabilityOrderTableConfig }
total={ scheduledActions.content && scheduledActions.totalElements }
onRowsToggled={ this.rowsToggled }
......
Supports Markdown
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