import React 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 SelectOption from "components/commonCode/SelectOption";
import * as EgovNet from "api/egovFetch";
import CODE from "constants/code";

function MenuModal({savedInfo, reloadFunction}){

    function editMenu(e){
        e.preventDefault();
        e.stopPropagation();
        const form = e.target;
        const info = {
            menuId: form.menuId.value,
            menuTitle: form.menuTitle.value,
            menuGroup: form.menuGroup.value,
            menuLevel: form.menuLevel.value,
            menuSort: form.menuSort.value,
            menuUrl: form.menuUrl.value,
            menuTypeCd: form.menuTypeCd.value,
        }
        EgovNet.requestFetch(
            '/admin/config/menu-mgt',
            {
                method: "PUT",
                headers: {
                    'Content-type': 'application/json'
                },
                body: JSON.stringify(info)
            },
            (resp) => {
                if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) {
                    alert("저장되었습니다.")
                    reloadFunction();
                }else if(Number(resp.resultCode) === Number(CODE.RCV_ERROR_AUTH)){
                    console.log("토큰 갱신중.")
                }else{
                    alert(resp.result.resultMessage)
                }
            }
        )
    }

    function deleteMenu(menuId){
        if(window.confirm("삭제하시겠습니까?")) {
            EgovNet.requestFetch(
                '/admin/config/menu-mgt',
                {
                    method: "DELETE",
                    headers: {
                        'Content-type': 'application/json'
                    },
                    body: JSON.stringify({menuId: menuId})
                },
                (resp) => {
                    if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) {
                        alert("삭제되었습니다.")
                        reloadFunction();
                    } else if (Number(resp.resultCode) === Number(CODE.RCV_ERROR_AUTH)) {
                        console.log("토큰 갱신중.")
                    } else {
                        alert(resp.result.resultMessage)
                    }
                }
            )
        }
    }

    return (
        <>
            <Modal.Header closeButton>
                <Modal.Title>
                    {savedInfo!==undefined?`${savedInfo?.menuTitle} 상세정보`:'메뉴 생성'}
                </Modal.Title>
            </Modal.Header>
            <Modal.Body>
                <Form onSubmit={(e) =>{editMenu(e)}} noValidate>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            메뉴 코드
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="text" name="menuId" placeholder="아이디" required defaultValue={savedInfo?.menuId} readOnly={savedInfo!==undefined}/>
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            메뉴 이름
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="text" name="menuTitle" placeholder="이름" required defaultValue={savedInfo?.menuTitle} />
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            부모 메뉴
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="email" name="menuGroup" placeholder="그룹" required defaultValue={savedInfo?.menuGroup} />
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            레벨
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="number" min={"0"} name="menuLevel" placeholder="레벨" required defaultValue={savedInfo!==undefined?savedInfo.menuLevel:0} />
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            정렬
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="number" min={"0"} name="menuSort" placeholder="정렬" required defaultValue={savedInfo!==undefined?savedInfo.menuSort:0} />
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            URI
                        </Form.Label>
                        <Col sm={9}>
                            <Form.Control type="text" name="menuUrl" placeholder="URI" required defaultValue={savedInfo?.menuUrl} />
                        </Col>
                    </Form.Group>
                    <Form.Group as={Row} className="mb-3">
                        <Form.Label column sm={3}>
                            타입
                        </Form.Label>
                        <Col sm={9}>
                            <SelectOption name={"menuTypeCd"} grpCd={"MNU_TYPE"} selectedValue={savedInfo?.menuTypeCd}/>
                        </Col>
                    </Form.Group>
                    <Row className="mb-3">
                        {savedInfo !== undefined?<Col xs={2}><button type={"button"} className={"btn btn_red_h31 px-3"} onClick={()=>{deleteMenu(savedInfo.menuId)}}>삭제</button></Col>:''}
                        <Col xs={{span: savedInfo!==undefined?8:10}}></Col>
                        <Col xs={2}>
                            <button type="submit" className={"btn btn_blue_h31 px-3"}>저장</button>
                        </Col>
                    </Row>
                </Form>
            </Modal.Body>
        </>
    );
}

export default MenuModal;