80 lines
2.1 KiB
JavaScript
80 lines
2.1 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 {
|
|
bookedMig() {
|
|
return this.props.migs["booked_count"];
|
|
}
|
|
waitingMig() {
|
|
return this.props.migs["awaitterm_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.bookedMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/upcoming-migrations">booked</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">waiting</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.completedMig()}
|
|
</div>
|
|
<div className="card-action">
|
|
<a href="/completed">complete</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>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Cards;
|