Untitled

import React from 'react';
import { connect } from 'react-redux';
import { AdminPage, FormTextBox } from 'view/component/AdminPage';
import { Link } from 'react-router-dom';
import { getSdhConfigHocPhanEditPage } from './redux';
import { getSdhTkbThongTinCoBanByMaHocPhan } from '../sdhThoiKhoaBieu/redux/redux-tkb-detaill';
import SectionHocPhanSinhVien from 'modules/mdSauDaiHoc/sdhConfigHocPhan/section/section-hoc-phan-sinh-vien';
class NhapDiemHocPhan extends AdminPage {
    state = {};
    componentDidMount() {
        T.ready('/user/sau-dai-hoc', () => {
            let route = T.routeMatcher('/user/sdh/nhap-diem-hoc-phan/edit/:maHocPhan'),
                maHocPhan = route.parse(window.location.pathname).maHocPhan;
            this.props.getSdhTkbThongTinCoBanByMaHocPhan(maHocPhan, dataCoBan => this.setState({ dataCoBan, maHocPhan: maHocPhan },
                () => {
                    console.log(dataCoBan, 'dataCoBan');
                    this.sectionHocPhan.setData(dataCoBan);
                })
            );
        });
    }
    render() {
        const dataCoBan = this.state.dataCoBan || {
            maMonHoc: '', tenMonHoc: '', maNganh: '', tenNganh: '', maHocPhan: '',
            tongTiet: '', tietLT: '', tietTH: '',
            tongTinChi: '', tinChiLT: '', tinChiTH: ''
        };
        return this.renderPage({
            icon: 'fa fa-calendar',
            title: 'Điều chỉnh học phần',
            breadcrumb: [
                <Link key={0} to='/user/sau-dai-hoc'>Sau đại học</Link>,
                <Link key={1} to='/user/sau-dai-hoc/thoi-khoa-bieu'>Thời khóa biểu</Link>,
                'Điều chỉnh học phần'
            ],
            content: <>
                <div className='tile'>
                    <h4 className='pl-4 pt-4'>Thông tin cơ bản học phần</h4>
                    <div className='d-flex flex-row justify-content-between'>
                        <div className='p-4 d-flex flex-column'>
                            <span className='mb-4'>Mã học phần: <strong>{dataCoBan.maHocPhan}</strong></span>
                            <span className='mb-4'>Ngành: <strong>{`${dataCoBan.maNganh} - ${dataCoBan.tenNganh}`}</strong></span>
                            <span >Môn học: <strong>{`${dataCoBan.maMonHoc} - ${dataCoBan.tenMonHoc}`}</strong></span>
                        </div>
                        <div className='p-4 d-flex flex-column'>
                            <span className='mb-4'>Tổng số tiết: <strong>{dataCoBan.tongTiet}</strong></span>
                            <span className='mb-4'>Số tiết lý thuyết: <strong>{dataCoBan.tietLT}</strong></span>
                            <span >Số tiết thực hành: <strong>{dataCoBan.tietTH}</strong></span>
                        </div>
                        <div className='p-4 mr-4 d-flex flex-column'>
                            <span className='mb-4'>Tổng số tín chỉ: <strong>{dataCoBan.tongTinChi}</strong></span>
                            <span className='mb-4'>Số tín chỉ lý thuyết: <strong>{dataCoBan.tinChiLT}</strong></span>
                            <span >Số tín chỉ thực hành: <strong>{dataCoBan.tinChiTH}</strong></span>
                        </div>
                    </div>
                    <SectionHocPhanSinhVien ref={e => this.sectionHocPhan = e} maHocPhan={this.state.maHocPhan} />

                </div>
            </>,
            backRoute: '/user/sau-dai-hoc/thoi-khoa-bieu',

        });
    }
}

const mapStateToProps = state => ({ system: state.system });
const mapActionsToProps = { getSdhConfigHocPhanEditPage, getSdhTkbThongTinCoBanByMaHocPhan };
export default connect(mapStateToProps, mapActionsToProps)(NhapDiemHocPhan);