70 lines
1.7 KiB
JavaScript
70 lines
1.7 KiB
JavaScript
import React, { Component } from "react";
|
||
import Link from "next/link";
|
||
import numeral from "numeral";
|
||
|
||
class CalendarCellModal extends Component
|
||
{
|
||
constructor(props)
|
||
{
|
||
super(props);
|
||
this.state = {
|
||
menuOpened: false,
|
||
activeLink: ""
|
||
};
|
||
}
|
||
|
||
toggleMenu = () => {
|
||
this.setState({
|
||
menuOpened: !this.state.menuOpened
|
||
});
|
||
};
|
||
|
||
selected = (text) => {
|
||
this.toggleMenu();
|
||
this.setState({
|
||
activeLink: text
|
||
})
|
||
}
|
||
|
||
render()
|
||
{
|
||
const {menuOpened, activeLink} = this.state;
|
||
const { selected_payment } = this.props;
|
||
|
||
return (
|
||
<div className={this.props.open ? "fade opened" : "fade"}>
|
||
<div className="modal">
|
||
<div className="calendar_payment">
|
||
<div className="day">
|
||
<span>16</span> июня
|
||
</div>
|
||
<div className="payment_table">
|
||
<div className="table_row table_header">
|
||
<div className="table_cell">Договор</div>
|
||
<div className="table_cell">Платеж</div>
|
||
</div>
|
||
{ selected_payment && selected_payment.payments.map((payment, index) => (
|
||
<div className="table_row" key={ index }>
|
||
<div className="table_cell">
|
||
<Link href={`/contract/${ payment.contract.number }/payments`}>
|
||
<a>№{ payment.contract.number } от { payment.contract.date }</a>
|
||
</Link>
|
||
</div>
|
||
<div className="table_cell">
|
||
<b>{ numeral(payment.total_amount).format('') } р.</b>
|
||
</div>
|
||
</div>
|
||
)) }
|
||
</div>
|
||
</div>
|
||
<div className="modal_footer">
|
||
<button className="button button-blue" onClick={() => this.props.close()}>Закрыть</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
}
|
||
|
||
export default CalendarCellModal;
|