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";

function StandardCodeList({listData, filterData}) {

    return (
        <div className={"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">
                            <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={()=>{
                                                       /*window.open("/standardCode/viewer/"+history.kcscCd+":"+history.rvsnYmd.split('T')[0]);*/
                                                   }}
                                            />
                                            <br/>
                                            <p className={pClass}>{history.docYr}</p>
                                        </Col>
                                    )
                                })}
                            </Row>
                        </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={()=>{
                                                       window.open("/standardCode/viewer/"+history.kcscCd+":"+history.rvsnYmd.split('T')[0]);
                                                   }}
                                            />
                                            <br/>
                                            <p className={pClass}>{history.docYr}</p>
                                        </Col>
                                    )
                                })}
                            </Row>
                        </div>
                        <FavoriteIcon item={item}/>
                    </div>
                )
            })}
        </div>
    );
}


export default StandardCodeList;