kcscDev/egovframe-template-simple-react-contribution/src/pages/standardCode/list/StandardCodePage.jsx

import React, {useState, useCallback} from 'react';
import {Link, useParams} from 'react-router-dom';

import * as EgovNet from 'api/egovFetch';
import {StandardCodeListModal, StandardCodeListModalTable} from './StandardCodeListModal'
import {AiFillFileMarkdown} from "react-icons/ai";
import StandardCodeSearchForm from "./StandardCodeSearchForm";
import Loading from "../../../components/Loading";
import StandardCodeList from "./StandardCodeList";
import URL from "../../../constants/url";

function StandardCodePage({}) {
    const {listCode} = useParams();
    const [listData, setListData] = useState([])
    const [listLoading, setListLoading] = useState(true);
    const [filterData, setFilterData] = useState('');
    const [resultCnt, setResultCnt] = useState(0);
    const [remarkCnt, setRemarkCnt] = useState(0);
    const [groupSeq, setGroupSeq] = useState();

    const [show, setShow] = useState(false);
    function close() {
        setShow(false);
    }
    
    function showHandling(e) {
        const param = e.currentTarget.dataset;
        const groupSeq = param.groupSeq;
        console.log(groupSeq);
        EgovNet.requestFetch(
            '/standardCode/codeListModal.do',
            {
                method: "POST",
                headers: {
                    'Content-type': 'application/json'
                },
                body: JSON.stringify(
                    groupSeq
                )
            }, (resp) => {
                console.log(resp + "------------------------resp")
                const body = [];
                const head = [];
                if (resp.length > 0) {
                    resp.forEach(function (item, index) {
                        const formattedDate = item.aplcnBgngYmd.match(/\d{4}-\d{2}-\d{2}/)[0];
                        const url = "https://www.kcsc.re.kr/file/DownloadGrp/" + item.docFileGrpId;
                        body.push(
                            <tr>
                                <td>{formattedDate}</td>
                                <td><a href={url}><AiFillFileMarkdown/></a></td>
                                <td></td>
                            </tr>)
                    })
                    head.push(
                        <tr>
                            <td>년도</td>
                            <td>기준코드</td>
                            <td>신구건설기준비교</td>
                        </tr>
                    )
                }

                setGroupSeq(<StandardCodeListModalTable head={head} content={body}/>);
            }
        )
        setShow(true);
    }

    const retrieveList = useCallback((searchCondition) => {
        setListLoading(true)
        EgovNet.requestFetch('/standardCode/standard-code-list'+EgovNet.convParams(searchCondition),
            {
                method: "GET",
                headers: {
                    'Content-type': 'application/json',
                }
            },
            (resp) => {
                setListData(resp.result.resultList);
                setResultCnt(resp.result.resultCnt.allCnt);
                setRemarkCnt(resp.result.resultCnt.remarkCnt);
                setListLoading(false)
            },
            function (resp) {
                console.log("err response : ", resp);
            }
        );

    }, []);


    return (
        <div className="">
            <div className="c_wrap">
                {/* <!-- Location --> */}
                <div className="location">
                    <ul>
                        <li><Link to={URL.MAIN} className="home">Home</Link></li>
                        <li>건설기준코드</li>
                        <li><Link to={URL.STANDARD_CODE_LIST} >건설기준코드 검색</Link></li>
                    </ul>
                </div>
                {/* <!--// Location --> */}

                <div className="layout">

                    <div className="contents NOTICE_LIST" id="contents">
                        {/* <!-- 본문 --> */}

                        <div className="top_tit">
                            <h1 className="tit_1">건설기준코드 검색</h1>
                        </div>
                        <div className="StandardCodeList container">
                            <div className="c_wrap codeListContent">
                                <div className="layout">
                                    <div className="contents NOTICE_LIST listTableDiv">
                                        <StandardCodeSearchForm param={listCode?listCode:'10'} reloadFunction={retrieveList} resultCnt={resultCnt} remarkCnt={remarkCnt}/>
                                        <div className="board_list code_list">
                                            <div className="head">
                                                <span>대분류</span>
                                                <span>중분류</span>
                                                <span>코드번호</span>
                                                <span>코드명</span>
                                                <span className={"text-start"}>개정이력</span>
                                                <span className={"text-start"}>보기</span>
                                                <span>즐겨찾기</span>
                                            </div>
                                            {
                                                listLoading?(<Loading/>):(
                                                    <StandardCodeList listData={listData} filterData={filterData}/>
                                                )
                                            }
                                        </div>
                                        <StandardCodeListModal size={"lg"} show={show} content={groupSeq} onClose={close} title={"개정이력"}/>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    );
}


export default StandardCodePage;