import React, {useEffect, useState} from "react";
import Modal from "react-bootstrap/Modal";
import Form from "react-bootstrap/Form";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import * as EgovNet from "api/egovFetch";

function QuestionModal({svySeq}){

    const [qtTag, setQtTag] = useState([]);
    const [itemTag, setItemTag] = useState([]);

    function getSurveyQt(){
        EgovNet.requestFetch(
            '/admin/survey/edit-qt?svySeq='+svySeq,
            {
                method: "GET"
            },
            (resp) => {

                const temp = [];
                resp.result.qtList.forEach(function (qt, index){
                    temp.push(
                        <Row>
                            <Col onClick={()=>selectQt(qt.itemList)}>{qt.qtTitle}</Col>
                        </Row>
                    )
                })
                setQtTag(temp);

            },
            function (resp) {
                console.log("err response : ", resp);
            }
        );
    }

    function selectQt(itemList){
        const temp = [];
        itemList.forEach(function (item, index){
            temp.push(
                <Row>
                    <Col>{item.itemNm}</Col>
                </Row>
            )
        })
        setItemTag(temp);
    }

    function editSurveyQt(e){

    }

    useEffect(() => {
        getSurveyQt()
    }, []);

    return (
        <>
            <Modal.Header closeButton>
                <Modal.Title>질문관리</Modal.Title>
            </Modal.Header>
            <Modal.Body>
                <Row>
                    <Col xs={6}>
                        {qtTag}
                    </Col>
                    <Col xs={6}>
                        {itemTag}
                    </Col>
                </Row>
            </Modal.Body>
            <Modal.Footer>
                <button type="button" className={"btn btn_blue_h31 px-3"}>저장</button>
            </Modal.Footer>
        </>
    );
}

export default QuestionModal;