import React, {Component} from 'react';
import axios from 'axios';
import {Link} from "react-router-dom";

import EX from '../../Images/exam.png';
import LS from '../../Images/lesson.png';


export default class LessonAndExam extends Component {
    constructor(props) {
        super(props);


        this.state = {
            lessonList:[]
        }
    }

    componentDidMount = () => {
        let quizLessonTemp = []
        axios.get('http://localhost:5000/')
            .then(response => {
                console.log(response);
                this.setState({ lessonList: response.data.images });
                console.log(this.state.lessonList.length)
            })
            .catch(err => alert(err));
    }

    render(){
        return(
            <div className="container">


                        {this.state.lessonList.map((file) => (

                            <div className="">
                                <div className="p-3 mb-2 bg-light text-dark text-left">Accounting Lecture {file.lessonno}</div>
                                <div className="text-left ml-3">

                                </div>
                                <div className="row">
                                <div className="col-1">

                                    <div style={{padding: '0px'}}>
                                        <img  src={EX} alt="upload-image" style={{width:'35px'}}/>
                                        <hr/>
                                        <img  src={LS} alt="upload-image" style={{width:'35px'}}/>
                                    </div>
                                </div>



                                    <div style={{padding: '0px'}}>

                                        <a href={'http://localhost:5000/pdf/'+ file.filename}><p  style={{marginTop: '7px'}}>{file.lessonname}</p></a>
                                        <br/>
                                        <a href={'/question/'+ file.lessonno}><p  style={{marginTop: '7px'}}>Exam {file.lessonno}</p></a>
                                    </div>
                                </div>
                                </div>

                        ))
                        }


                    </div>




        )
    }
}