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

import React from 'react';
import Col from "react-bootstrap/Col";
import Row from "react-bootstrap/Row";
import FavoriteIcon from "./FavoriteIcon";
import Button from "react-bootstrap/Button";

function StandardCodeList({listData, filterData, getHistoryModal}) {

    function historyBtn(item){
        getHistoryModal(item);
    }

    return (
        <div className={"result standard_code_result"}>
            {listData.filter(item => {
                if (item.groupNm.includes(filterData)) {
                    return item
                }
                return null
            }).map(item => {
                return (
                    <div className="list_item List_Codes">
                        <div className="mainCategory">{item.mainCategory}</div>
                        <div className="middleCategory">{item.middleCategory}</div>
                        <div className="kcscCd">{item.kcscCd}</div>
                        <div className="groupNm">{item.groupNm}<br/><span className={"text-danger"}>{item.rvsnRemark}</span></div>
                        <div className="Revisionhistory">
                            <Button size={"sm"} variant={"outline-secondary"} onClick={()=>{historyBtn(item)}}>개정 이력</Button>
                        </div>
                        <div className="fille">
                            <Row className={"justify-content-start"}>
                                {item.historyList.filter(history => {
                                    return history;
                                }).map(history => {
                                    let buttonClass = "btn btn-sm docInfoBtn docInfoActive "
                                    let pClass = "yearInfo yearInfoActive";
                                    if(history.docEr === 'E'){
                                        buttonClass += "btn-success "
                                    }else{
                                        buttonClass += "btn-primary "
                                    }
                                    return (
                                        <Col xs={"auto"} className={"px-1"}>
                                            <input type="button"
                                                   className={buttonClass}
                                                   value={history.docEr==='E'?'제':'개'}
                                                   onClick={()=>{
                                                       const rvsnYmd = new Date(history.rvsnYmd)
                                                       rvsnYmd.setHours(rvsnYmd.getHours()+9)
                                                       window.open("/standardCode/viewer/"+history.kcscCd+":"+rvsnYmd.toISOString().split('T')[0]);
                                                   }}
                                            />
                                            <br/>
                                            <p className={pClass}>{history.docYr}</p>
                                        </Col>
                                    )
                                })}
                            </Row>
                        </div>
                        <FavoriteIcon item={item}/>
                    </div>
                )
            })}
        </div>
    );
}


export default StandardCodeList;