It fixes #146

parent df9216e6
......@@ -125,12 +125,9 @@ class MyDataPage extends React.Component {
<MenuContainer />
<LoginContainer />
<ExpirationLoginContainer></ExpirationLoginContainer>
<div style={{ marginTop: '30px', marginLeft: '30px', marginRight: '30px' }}>
<InvestigationsContainer linkProposal={true} openData={true} investigations={this.props.myInvestigations} />
</div>
</div>
);
}
......
......@@ -2,95 +2,48 @@ import React from 'react';
import Moment from 'react-moment';
import { Grid, Row, Col, Image } from 'react-bootstrap';
import './DatasetSummary.css';
import { getFileByEventId } from '../../../api/icat/icatPlus.js';
import EMDatasetSummary from './EMDatasetSummary';
import GalleryDatasetThumbnail from '../GalleryDatasetThumbnail.js'
import { getDatasetParameterValueByName } from '../../../helpers/DatasetHelper.js';
import ParameterTableWidget from '../../Instrument/ParameterTableWidget.js';
class DatasetSummary extends React.Component {
componentDidMount() {
}
getImageFromGalleyByIndex(index) {
/** Checking gallery **/
var gallery = this.props.dataset.parameters.filter(function (o) { return o.name === "ResourcesGallery" });
if (gallery != null) {
if (gallery.length > 0) {
gallery = gallery[0].value.split(" ");
if (gallery.length > index) {
var url = getFileByEventId(this.props.sessionId, this.props.dataset.investigation.id, gallery[index] );
return <div><br /><Image src={url} thumbnail /></div>;
}
}
}
return null;
}
getParameterValue(name){
var sampleNameParameter = this.props.dataset.parameters.filter(function (o) { return o.name === name });
if (sampleNameParameter){
if (sampleNameParameter[0]){
return sampleNameParameter[0].value;
}
}
getParameters(){
return [
{name : 'Name', value : this.props.dataset.name},
{name : 'Definition', value : getDatasetParameterValueByName(this.props.dataset, "definition")},
{name : 'Start', value : <Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.startDate}</Moment>},
{name : 'Sample', value : this.props.dataset.sampleName},
{name : 'Description', value : getDatasetParameterValueByName(this.props.dataset, "Sample_description")}
];
}
render() {
var technique = this.getParameterValue("definition");
render() {
var technique = getDatasetParameterValueByName(this.props.dataset, "definition");
if (technique){
if (technique === 'EM'){
return <EMDatasetSummary dataset={this.props.dataset}></EMDatasetSummary>
}
}
return (
<Grid fluid>
<Grid fluid style={{margin:'20px'}}>
<Row>
<Col xs={12} md={2}>
<Grid fluid style={{marginTop:'30px'}}>
<Row>
<Col xs={4} sm={6} md={6}>Name</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.props.dataset.name}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Definition</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("definition")}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Start</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'><Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.startDate}</Moment></Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>End</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'><Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.endDate}</Moment></Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Sample</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("Sample_name")}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Description</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("Sample_description")}</Col>
</Row>
</Grid>
</Col>
<Col xs={12} sm={12} md={2}>
{this.getImageFromGalleyByIndex(0)}
<Col xs={12} md={3}>
<ParameterTableWidget striped={true} parameters={this.getParameters()} ></ParameterTableWidget>
</Col>
<Col xs={12} sm={12} md={2}>
{this.getImageFromGalleyByIndex(1)}
<GalleryDatasetThumbnail dataset={this.props.dataset} sessionId={this.props.sessionId} index={0} ></GalleryDatasetThumbnail>
</Col>
<Col xs={12} sm={12} md={2}>
{this.getImageFromGalleyByIndex(2)}
<GalleryDatasetThumbnail dataset={this.props.dataset} sessionId={this.props.sessionId} index={1} ></GalleryDatasetThumbnail>
</Col>
<Col xs={12} sm={12} md={2}>
{this.getImageFromGalleyByIndex(3)}
<GalleryDatasetThumbnail dataset={this.props.dataset} sessionId={this.props.sessionId} index={2} ></GalleryDatasetThumbnail>
</Col>
<Col xs={12} sm={12} md={2}>
{this.getImageFromGalleyByIndex(4)}
</Col>
<GalleryDatasetThumbnail dataset={this.props.dataset} sessionId={this.props.sessionId} index={3} ></GalleryDatasetThumbnail>
</Col>
</Row>
</Grid>
......
......@@ -2,54 +2,28 @@ import React from 'react';
import Moment from 'react-moment';
import { Grid, Row, Col, Image } from 'react-bootstrap';
import './DatasetSummary.css';
import { getImageFromGalleyByIndex } from '../../../helpers/DatasetHelper.js';
class EMDatasetSummary extends React.Component {
getParameterValue(name){
var sampleNameParameter = this.props.dataset.parameters.filter(function (o) { return o.name === name });
if (sampleNameParameter){
if (sampleNameParameter[0]){
return sampleNameParameter[0].value;
}
}
import GalleryDatasetThumbnail from '../GalleryDatasetThumbnail.js'
import { getDatasetParameterValueByName } from '../../../helpers/DatasetHelper.js';
import ParameterTableWidget from '../../Instrument/ParameterTableWidget.js';
class EMDatasetSummary extends React.Component {
getParameters(){
return [
{name : 'Name', value : this.props.dataset.name},
{name : 'Definition', value : getDatasetParameterValueByName(this.props.dataset, "definition")},
{name : 'Start', value : <Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.startDate}</Moment>},
{name : 'Sample', value : this.props.dataset.sampleName},
{name : 'Description', value : getDatasetParameterValueByName(this.props.dataset, "Sample_description")}
];
}
render() {
return (
<Grid fluid>
<Grid fluid style={{margin:'20px'}}>
<Row>
<Col xs={12} md={2}>
<Grid fluid style={{marginTop:'30px'}}>
<Row>
<Col xs={4} sm={6} md={6}>Name</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.props.dataset.name}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Definition</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("definition")}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Start</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'><Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.startDate}</Moment></Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>End</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'><Moment parse="YYYY-MM-DD HH:mm" format="LTS">{this.props.dataset.endDate}</Moment></Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Sample</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("Sample_name")}</Col>
</Row>
<Row>
<Col xs={4} sm={6} md={6}>Description</Col>
<Col xs={8} sm={6} md={6} className='column_parameter_value'>{this.getParameterValue("Sample_description")}</Col>
</Row>
</Grid>
<Col xs={12} md={4}>
<ParameterTableWidget striped={true} parameters={this.getParameters()} ></ParameterTableWidget>
</Col>
<Col xs={12} sm={12} md={2}>
......@@ -61,11 +35,9 @@ class EMDatasetSummary extends React.Component {
<Col xs={12} sm={12} md={2}>
</Col>
<Col xs={12} sm={12} md={2}>
</Col>
<Col xs={12} sm={12} md={2}>
{getImageFromGalleyByIndex(this.props.dataset, this.props.sessionId, 0)}
<GalleryDatasetThumbnail dataset={this.props.dataset} sessionId={this.props.sessionId} index={0} ></GalleryDatasetThumbnail>
</Col>
</Row>
</Grid>
......
......@@ -93,7 +93,22 @@ class DatasetTable extends React.Component {
}
},
{
text: "Name",
text: "Sample",
dataField: "sampleName",
sort: true,
hidden: false,
headerStyle: (column, colIndex) => {
return { width: "50%", textAlign: "center" };
},
responsiveHeaderStyle: {
xs: { hidden: true },
sm: { hidden: true },
md: { hidden: false },
lg: { hidden: false },
}
},
{
text: "Dataset",
dataField: "name",
sort: true,
hidden: false,
......@@ -102,7 +117,7 @@ class DatasetTable extends React.Component {
},
responsiveHeaderStyle: {
xs: { hidden: false },
sm: { hidden: true },
sm: { hidden: false },
md: { hidden: false },
lg: { hidden: false },
}
......
......@@ -24,7 +24,7 @@ class DatasetWidget extends React.Component {
render() {
let dataset = this.props.dataset;
let definition = this.getDefinition(dataset);
function getFilesTabTitle(dataset) {
var fileCount = _.find(dataset.parameters, function (o) { return o.name === FILE_COUNT; });
if (fileCount) {
......@@ -36,8 +36,7 @@ class DatasetWidget extends React.Component {
}
/** Case of publication */
/** Case of publication */
if (definition){
if (definition.length > 0){
if (definition[0].value === "Publication"){
......@@ -46,7 +45,7 @@ class DatasetWidget extends React.Component {
}
}
return (<div><Panel >
return (<div style={{fontSize:'12px'}}><Panel>
<Panel.Body >
<Tabs id="tabs">
<Tab eventKey={1} title="Summary">
......@@ -74,7 +73,7 @@ class DatasetWidget extends React.Component {
</Tabs>
</Panel.Body>
<Panel.Footer>
<DatasetFooter location={dataset.location} sessionId={this.props.sessionId} dataset={dataset} ></DatasetFooter>
<DatasetFooter location={this.props.dataset.location} sessionId={this.props.sessionId} dataset={this.props.dataset} ></DatasetFooter>
</Panel.Footer>
</Panel><br /><br /><br /><br /></div>
......
import React, { Component } from 'react'
import { Image } from 'react-bootstrap';
import { getFileByEventId } from '../../api/icat/icatPlus.js';
import PropTypes from 'prop-types';
export default class GalleryDatasetThumbnail extends Component {
render() {
var gallery = this.props.dataset.parameters.filter(function (o) { return o.name === "ResourcesGallery" });
if (gallery != null) {
if (gallery.length > 0) {
gallery = gallery[0].value.split(" ");
if (gallery.length > this.props.index) {
var url = getFileByEventId(this.props.sessionId, this.props.dataset.investigation.id, gallery[this.props.index] );
return <Image src={url} thumbnail />;
}
}
}
return null;
}
}
GalleryDatasetThumbnail.propTypes = {
sessionId : PropTypes.string.isRequired,
index : PropTypes.string.isRequired,
dataset : PropTypes.object.isRequired
}
......@@ -17,8 +17,7 @@ class InstrumentSlitWidget extends React.Component {
};
}
getSlitValues(prefix){
debugger
getSlitValues(prefix){
return [
this.getJSONKeyValuePair('Blade Front', getDatasetParameterByName(this.props.dataset, prefix + "_blade_front")),
this.getJSONKeyValuePair('Blade Back', getDatasetParameterByName(this.props.dataset, prefix + "_blade_back")),
......
......@@ -13,7 +13,7 @@ class InstrumentWidget extends React.Component {
return null;
}
return <div style={{fontSize:'11px'}}>
return <div style={{fontSize:'12px'}}>
<InstrumentWidgetSection
header="Monochromator"
......@@ -72,16 +72,13 @@ class InstrumentWidgetSection extends React.Component {
}
}
if (!names && !values && (!this.props.parameters || this.props.parameters === 0)){
if (!names && !values && (!this.props.parameters || this.props.parameters === 0 || !_.find(this.props.parameters, function(parameter){ console.log(parameter.name); return parameter.value }))){
return null;
}
/** If all values are empty then it is not displayed */
// if (!_.find(this.props.parameters, function(parameter){ console.log(parameter.name); return parameter.value })){
// return null;
// }
return <div className="container-fluid">
<br />
<span style={{fontSize:'16px', fontWeight:'bold'}} >{this.props.header}</span>
......
......@@ -2,4 +2,8 @@
color: #E7E5E5;
border : 0px solid white;
background-color: white;
}
.value{
font-weight: bold;
}
\ No newline at end of file
......@@ -9,8 +9,14 @@ class ParameterTableWidget extends React.Component {
return "gray-out";
}
}
getColumnValueClass(value){
if ((!value)|| (value === "")||(value === null)){
return "gray-out";
}
return "value";
}
getRow(name, value){
return <tr ><td className={this.getColumnNameClass(value)}>{name}</td><td className={this.getColumnNameClass(value)}>{value}</td></tr>
return <tr ><td className={this.getColumnNameClass(value)}>{name}</td><td className={this.getColumnValueClass(value)}>{value}</td></tr>
}
getColumns(names, values){
return <tbody>
......@@ -47,8 +53,12 @@ class ParameterTableWidget extends React.Component {
//if (!_.find(parameterValues, function(value){ return value !== null})){
// return null;
// }
var striped = true;
if (this.props.striped == false){
striped = this.props.striped;
}
return <Table striped condensed hover>
return <Table striped={striped} condensed hover>
{this.getHeader(this.props.header)}
{this.getColumns(parameterNames, parameterValues)}
</Table>;
......
import _ from 'lodash';
import { convertParameterNameToAlias } from './Parameters.js';
import { getFileByEventId } from '../api/icat/icatPlus.js';
import React from 'react';
import { Image } from 'react-bootstrap';
export function getDatasetParameterByName(dataset, parameterName) {
var parameter = _.find(dataset.parameters, function (o) { return o.name === parameterName });
......@@ -23,19 +21,12 @@ export function getDatasetParameterByPrefixName(dataset, prefix) {
};
export function getImageFromGalleyByIndex(dataset, sessionId, index) {
/** Checking gallery **/
var gallery = dataset.parameters.filter(function (o) { return o.name === "ResourcesGallery" });
if (gallery != null) {
if (gallery.length > 0) {
gallery = gallery[0].value.split(" ");
if (gallery.length > index) {
var url = getFileByEventId(sessionId, dataset.investigation.id, gallery[index] );
return <div><br /><Image src={url} thumbnail /></div>;
}
}
}
return null;
export function getDatasetParameterValueByName(dataset, name){
var sampleNameParameter = dataset.parameters.filter(function (o) { return o.name === name });
if (sampleNameParameter){
if (sampleNameParameter[0]){
return sampleNameParameter[0].value;
}
}
}
}
\ No newline at end of file
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