Commit 3bbaaea7 authored by hh1966's avatar hh1966
Browse files

Move static research plan to seperate tab in research plan details

parent 230fdc21
......@@ -27,7 +27,6 @@ export default class ResearchPlanDetails extends Component {
const { research_plan } = props;
this.state = {
research_plan,
edit: false,
update: false
};
this.nameRef = React.createRef()
......@@ -71,14 +70,6 @@ export default class ResearchPlanDetails extends Component {
})
}
toggleEdit() {
let {edit} = this.state
this.setState({
edit: !edit
});
}
// handle name actions
handleNameChange(value) {
......@@ -206,21 +197,10 @@ export default class ResearchPlanDetails extends Component {
// render functions
renderResearchPlanInfo(research_plan) {
const style = {height: 'auto'};
renderExportButton(disabled) {
return (
<Row style={style}>
<Col md={6}>
<h4>{research_plan.name}</h4>
</Col>
</Row>
)
}
renderExportButton() {
return (
<Dropdown id="research-plan-export-dropdown dropdown-right">
<Dropdown id="research-plan-export-dropdown"
className="research-plan-export-dropdown dropdown-right pull-right" disabled={disabled}>
<Dropdown.Toggle>
Export
</Dropdown.Toggle>
......@@ -245,25 +225,45 @@ export default class ResearchPlanDetails extends Component {
)
}
renderPropertiesTab(research_plan) {
const { name, body, attachments } = research_plan
const { update, edit } = this.state
const submitLabel = research_plan.isNew ? "Create" : "Save"
renderResearchPlanTab(research_plan, update) {
const { name, body, attachments, changed } = research_plan
return (
<ListGroup fill="true">
<ListGroupItem >
<div className="research-plan-export-buttons pull-right">
{edit && this.renderExportButton()}
<Button bsStyle="warning" onClick={() => this.toggleEdit()}>
{edit ? 'Display' : 'Edit'}
</Button>
</div>
{this.renderExportButton(changed)}
<ResearchPlanDetailsName value={name}
disabled={research_plan.isMethodDisabled('name')}
onChange={this.handleNameChange.bind(this)}
edit={false}
ref={this.nameRef} />
<ResearchPlanDetailsBody body={body}
disabled={research_plan.isMethodDisabled('body')}
onChange={this.handleBodyChange.bind(this)}
onDrop={this.handleBodyDrop.bind(this)}
onAdd={this.handleBodyAdd.bind(this)}
onDelete={this.handleBodyDelete.bind(this)}
onExport={this.handleExportField.bind(this)}
update={update}
edit={false}
ref={this.bodyRef} />
</ListGroupItem>
</ListGroup>
)
}
renderPropertiesTab(research_plan, update) {
const { name, body, attachments } = research_plan
return (
<ListGroup fill="true">
<ListGroupItem >
<ResearchPlanDetailsName value={name}
disabled={research_plan.isMethodDisabled('name')}
onChange={this.handleNameChange.bind(this)}
edit={edit}
edit={true}
ref={this.nameRef} />
<ResearchPlanDetailsBody body={body}
......@@ -274,7 +274,7 @@ export default class ResearchPlanDetails extends Component {
onDelete={this.handleBodyDelete.bind(this)}
onExport={this.handleExportField.bind(this)}
update={update}
edit={edit}
edit={true}
ref={this.bodyRef} />
<ResearchPlanDetailsAttachments attachments={attachments}
......@@ -283,25 +283,21 @@ export default class ResearchPlanDetails extends Component {
onUndoDelete={this.handleAttachmentUndoDelete.bind(this)}
onDownload={this.handleAttachmentDownload.bind(this)}
onEdit={this.handleAttachmentEdit.bind(this)}
edit={edit} />
edit={true} />
</ListGroupItem>
</ListGroup>
);
)
}
renderLiteratureTab(research_plan) {
const submitLabel = research_plan.isNew ? "Create" : "Save";
return (
<ResearchPlansLiteratures
element={research_plan}
/>
);
)
}
renderPanelHeading(research_plan) {
let saveBtnDisplay = research_plan.changed ? '' : 'none'
return (
<Panel.Heading>
<i className="fa fa-file-text-o" />
......@@ -320,18 +316,10 @@ export default class ResearchPlanDetails extends Component {
<Button bsStyle="warning" bsSize="xsmall" className="button-right"
onClick={() => this.handleSubmit()}
style={{display: saveBtnDisplay}} >
style={{display: research_plan.changed ? '' : 'none'}} >
<i className="fa fa-floppy-o "></i>
</Button>
</OverlayTrigger>
<OverlayTrigger placement="bottom"
overlay={<Tooltip id="saveresearch_plan">Toggle edit research_plan</Tooltip>}>
<Button bsStyle="warning" bsSize="xsmall" className="button-right"
onClick={() => this.toggleEdit()}>
<i className="fa fa-pencil"></i>
</Button>
</OverlayTrigger>
<OverlayTrigger placement="bottom"
overlay={<Tooltip id="fullSample">Fullresearch_plan</Tooltip>}>
......@@ -344,37 +332,37 @@ export default class ResearchPlanDetails extends Component {
)
}
renderPanelBody(research_plan, edit) {
const submitLabel = research_plan.isNew ? "Create" : "Save"
renderPanelBody(research_plan, update) {
return (
<Panel.Body>
{this.renderResearchPlanInfo(research_plan)}
<Tabs activeKey={this.state.activeTab} onSelect={key => this.handleSelect(key)}
id="screen-detail-tab">
<Tab eventKey={0} title={'Properties'}>
{this.renderPropertiesTab(research_plan)}
<Tab eventKey={0} title={'Research plan'}>
{this.renderResearchPlanTab(research_plan, update)}
</Tab>
<Tab eventKey={1} title={'Properties'}>
{this.renderPropertiesTab(research_plan, update)}
</Tab>
<Tab eventKey={1} title={'Literature'}>
<Tab eventKey={2} title={'Literature'}>
{this.renderLiteratureTab(research_plan)}
</Tab>
</Tabs>
<ButtonToolbar>
<Button bsStyle="primary" onClick={() => DetailActions.close(research_plan)}>Close</Button>
<Button bsStyle="warning" onClick={() => this.handleSubmit()}>{submitLabel}</Button>
<Button bsStyle="warning" onClick={() => this.handleSubmit()}>{research_plan.isNew ? "Create" : "Save"}</Button>
</ButtonToolbar>
</Panel.Body>
)
}
render() {
const { research_plan, edit } = this.state;
const { research_plan, update } = this.state;
return (
<Panel bsStyle={research_plan.isPendingToSave ? 'info' : 'primary'}
className="panel-detail research-plan-details">
{this.renderPanelHeading(research_plan)}
{this.renderPanelBody(research_plan, edit)}
{this.renderPanelBody(research_plan, update)}
</Panel>
);
}
......
......@@ -4,23 +4,19 @@
margin-bottom: 0;
}
.research-plan-export-buttons {
padding-top: 24px;
button {
line-height: 20px;
margin-left: 10px;
}
.research-plan-export-dropdown {
margin-top: 20px;
}
.research-plan-name {
&.static {
margin-top: 22px;
margin-top: 20px;
margin-bottom: 20px;
h1 {
margin: 0;
line-height: 36px;
font-size: 26px;
line-height: 32px;
}
}
}
......
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