github.com/muhammedhassanm/blockchain@v0.0.0-20200120143007-697261defd4d/blockapps-ba-master/ui/src/scenes/Projects/components/Project/index.js (about)

     1  import React, { Component } from 'react';
     2  import { connect } from 'react-redux';
     3  import { browserHistory } from 'react-router';
     4  import Button from 'react-md/lib/Buttons/Button';
     5  import Chip from 'react-md/lib/Chips';
     6  import Toolbar from 'react-md/lib/Toolbars';
     7  
     8  import BidModal from '../BidModal/';
     9  import { fetchProject } from './actions/project.actions';
    10  import { fetchProjectBids } from './components/Bids/components/BidTable/actions/projectBids.actions';
    11  import { projectEvent } from './actions/project-event.actions';
    12  import { openBidModal } from '../BidModal/bidModal.actions';
    13  import Status from './components/Status';
    14  import Detail from './components/Detail';
    15  import Bids from './components/Bids';
    16  import mixpanel from 'mixpanel-browser';
    17  import { ROLES, BID_STATES, STATES } from '../../../../constants';
    18  import './Project.css';
    19  
    20  class Project extends Component {
    21  
    22    componentWillMount() {
    23      this.props.fetchProject(encodeURI(this.props.params['pname']));
    24      this.props.fetchProjectBids(encodeURI(this.props.params['pname']));
    25    }
    26  
    27    get isBuyer() {
    28      return parseInt(this.props.login['role'], 10) === ROLES.BUYER;
    29    }
    30  
    31    get isSupplier() {
    32      return parseInt(this.props.login['role'], 10) === ROLES.SUPPLIER;
    33    }
    34  
    35    handleProjectEventClick = function (e, projectName, projectEvent) {
    36      e.stopPropagation();
    37      // project events enum: { NULL, ACCEPT, DELIVER, RECEIVE }
    38      const location = 'project_event_' + projectEvent;
    39      mixpanel.track(location);
    40      this.props.projectEvent(projectName, projectEvent, this.props.login['username']);
    41    };
    42  
    43    render() {
    44      const project = this.props.project;
    45      const actions = [];
    46      const children = [];
    47      if (project && project.name && parseInt(project.state, 10)) {
    48        //children
    49        children.push(
    50          <Chip
    51            key="state"
    52            label={STATES[parseInt(project.state, 10)].state}
    53            className="state-chip"
    54          />
    55        );
    56  
    57        //actions
    58        if (this.isBuyer) {
    59  
    60          if (parseInt(project.state, 10) === STATES.INTRANSIT) {
    61            actions.push(
    62              <Button
    63                icon
    64                primary
    65                onClick={(e) => this.handleProjectEventClick(e, project.name, 3)}
    66                tooltipLabel="Mark as Received"
    67                key="mood"
    68              >
    69                mood
    70                </Button>
    71            );
    72          }
    73        }
    74  
    75        if (this.isSupplier) {
    76          if (parseInt(project.state, 10) === STATES.PRODUCTION) {
    77            const myBidAccepted = this.props.bids.some(
    78              bid =>
    79                BID_STATES[parseInt(bid.state, 10)] === 'ACCEPTED' && bid.supplier === this.props.login.username
    80            );
    81            if (myBidAccepted) {
    82              actions.push(
    83                <Button
    84                  icon
    85                  onClick={(e) => this.handleProjectEventClick(e, project.name, 2)}
    86                  tooltipLabel="Mark as Shipped"
    87                  key="flight_takeoff"
    88                >
    89                  flight_takeoff
    90                </Button>
    91              );
    92            }
    93          }
    94  
    95          if (parseInt(project.state, 10) === STATES.OPEN) {
    96            actions.push(
    97              <Button
    98                icon
    99                key="gavel"
   100                tooltipLabel="Bid"
   101                onClick={(e) => {
   102                  e.stopPropagation();
   103                  mixpanel.track('open_bid_modal_click');
   104                  this.props.openBidModal();
   105                }
   106                }>
   107                gavel
   108                </Button>
   109            );
   110          }
   111        }
   112  
   113        actions.push(
   114          <Button
   115            icon
   116            key="home"
   117            tooltipLabel="Home"
   118            onClick={(e) => {
   119              e.stopPropagation();
   120              mixpanel.track('home_click');
   121              browserHistory.push('/projects');
   122            }
   123            }>
   124            home
   125          </Button>
   126        );
   127      }
   128  
   129      return (
   130        <section>
   131          <Toolbar
   132            themed
   133            title={project.name}
   134            className="project-title"
   135            actions={actions}
   136            children={children}
   137          />
   138          <BidModal name={project.name} />
   139          <div className="md-grid">
   140            <div className="md-cell md-cell--4 md-cell--12-phone">
   141              <Status state={project.state} />
   142            </div>
   143            <div className="md-cell md-cell--4 md-cell--12-phone">
   144              <Detail project={project} />
   145            </div>
   146            <div className="md-cell md-cell--4  md-cell--12-phone">
   147              <Bids project={project} bids={this.props.bids} />
   148            </div>
   149          </div>
   150        </section>
   151      );
   152    }
   153  }
   154  
   155  function mapStateToProps(state) {
   156    return {
   157      project: state.project.project,
   158      login: state.login,
   159      bids: state.bids.bids,
   160    };
   161  }
   162  
   163  export default connect(mapStateToProps, { fetchProject, fetchProjectBids, projectEvent, openBidModal })(Project);