82 lines
2.2 KiB
JavaScript
82 lines
2.2 KiB
JavaScript
import React, { Component } from "react";
|
|
|
|
// styles and collects each endpoint
|
|
// booked, awaitterm, complete and missed
|
|
// is referenced on Home
|
|
|
|
class Cards extends Component {
|
|
upcomingMig() {
|
|
return this.props.migs["upcoming_count"];
|
|
}
|
|
bookedMig() {
|
|
return this.props.migs["booked_count"]
|
|
}
|
|
waitingMig() {
|
|
return this.props.migs["pendterm_count"];
|
|
}
|
|
completedMig() {
|
|
return this.props.migs["complete_count"];
|
|
}
|
|
missedMig() {
|
|
return this.props.migs["missed_count"];
|
|
}
|
|
|
|
render() {
|
|
if (!this.props.migs) {
|
|
return <div />;
|
|
}
|
|
|
|
return (
|
|
<div className="row">
|
|
<div className="col s6 m4">
|
|
<div className="card grey darken-1">
|
|
<div className="card-content white-text">
|
|
<span className="card-title"></span>
|
|
{this.upcomingMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/upcoming-migrations">upcoming</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="col s6 m4">
|
|
<div className="card grey darken-1">
|
|
<div className="card-content white-text">
|
|
<span className="card-title"></span>
|
|
{this.bookedMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/booked">booked</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="col s6 m3">
|
|
<div className="card grey darken-1">
|
|
<div className="card-content white-text">
|
|
<span className="card-title"></span>
|
|
{this.missedMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/missed">missed</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="col s6 m4">
|
|
<div className="card grey darken-1">
|
|
<div className="card-content white-text">
|
|
<span className="card-title"></span>
|
|
<p></p>
|
|
{this.waitingMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/pending-terminations">pending term</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Cards;
|