import React from "react"; import Head from 'next/head'; import Image from 'next/image'; import moment from 'moment'; import 'moment/locale/ru'; import numeral from "numeral"; import { connect } from "react-redux"; import { withRouter } from 'next/router'; import { reduxWrapper } from '../../store'; import Header from '../components/Header'; import Footer from '../components/Footer'; import InnerMenu from "./components/InnerMenu"; import Company from "../components/Company"; import CalendarCellModal from "../components/Modal/calendar"; class SchedulePage extends React.Component { constructor(props) { super(props); this.state = { modalOpened: false, payments: [{ date: "2021-11-15", total: 128000.22, }, { date: "2021-11-25", total: 239400.88, }] }; } toggleModal = () => { this.setState({ modalOpened: !this.state.modalOpened }) } getPayments = (date) => { const { payments } = this.state; for(let i in payments) { if(payments[i].date === date) { return payments[i].total; } } return undefined; } render() { let month = 10; const dates = []; const date_sm = moment().month(month).startOf("month"); const date_em = moment().month(month).endOf("month"); console.log("date_sm", date_sm.format("YYYY-MM-DD")); console.log("date_em", date_em.format("YYYY-MM-DD")); console.log("date_sm.day()", date_sm.day()); console.log("date_em.day()", date_em.day()); let date_s = null; if(date_sm.day() !== 1) { date_s = date_sm.subtract(date_sm.day() - 1, "days"); } else { date_s = date_sm; } let date_e = null; if(date_em.day() !== 0) { date_e = date_em.add(7 - date_em.day(), "days"); } else { date_e = date_em; } const date = moment(); console.log(date_sm.format("YYYY-MM-DD")); console.log(date_sm.day()); console.log("date_s", date_s.format("YYYY-MM-DD")) console.log("date_e", date_e.format("YYYY-MM-DD")) let d = date_s; dates.push({ date: date_s.clone(), payment: this.getPayments(date_s.format("YYYY-MM-DD")), }); while(d.add(1, 'days').diff(date_e) < 0) { //console.log(d.toDate()); dates.push({ date: d.clone(), payment: this.getPayments(d.format("YYYY-MM-DD")), }); } const dow = date.day(); console.log(dow); console.log("date.month())", date.month()); const weeks = dates.reduce(function(result, value, index, array) { if (index % 7 === 0) result.push(array.slice(index, index +7)); return result; }, []); return ( ЛК Эволюция автолизинга

Календарь оплат

Пн

Вт

Ср

Чт

Пт

Сб

Вс

{ weeks.map((week, index) => { return (

{ week.map((day, index) => { return (

{ day.date.format("DD") } { day.date.format("MMM").toLocaleLowerCase() } { day.date.format("Y").toLocaleLowerCase() }

{ day.payment && (

this.toggleModal()}> Общий платеж { numeral(day.payment).format('') } р.

)}

) }) }

) }) } {/*}

30 мая

31 мая

01 июня

02 июня

03 июня

04 июня

05 июня

30 мая

31 мая

Общий платеж 239 400,00 р.

01 июня

02 июня

03 июня

04 июня

05 июня

{*/}

this.toggleModal()}/>