viwer분리작업중
parent
6dce384e77
commit
fffc68358b
|
|
@ -0,0 +1,171 @@
|
|||
import * as EgovNet from "../../api/egovFetch";
|
||||
import React, {useEffect, useState} from "react";
|
||||
import SbItem from "./SbItem";
|
||||
import {Col, Row} from "react-bootstrap";
|
||||
import {VwDiv, VwPtag} from "./Sb.style";
|
||||
|
||||
/*최상위 컴포넌트*/
|
||||
export function Maincontent({docCode}) {
|
||||
const [doccode, setdoccode] = useState('');
|
||||
const [docname, setdocname] = useState('');
|
||||
//TODO 맨처음 목차코드 및 목차제목 안나오는 문제 수정
|
||||
function setdoccodandname(doccode, docname) {
|
||||
setdoccode(doccode);
|
||||
setdocname(docname);
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Col>{doccode+' '+docname}</Col>
|
||||
<Row>
|
||||
<CodeTree docCode={docCode} setdoccodandname={setdoccodandname}/>
|
||||
<CodeCotentData docCode={docCode}/>
|
||||
</Row>
|
||||
</div>)
|
||||
}
|
||||
|
||||
/*글 트리 컴포넌트*/
|
||||
export function CodeTree({docCode, setdoccodandname}) {
|
||||
const [codeTree, setcodeTree] = useState([]);
|
||||
const [doccode, setdoccode] = useState(docCode);
|
||||
let data = [];
|
||||
const getCodeTree = () => {
|
||||
EgovNet.requestFetch(
|
||||
'/standardCode/getCodeTree.do',
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({})
|
||||
}, (item) => {
|
||||
data = item.result.codeTree;
|
||||
const nest = (menuData, parent_seq = null, link = 'parent_seq') =>
|
||||
menuData.filter(item => item[link] === parent_seq)
|
||||
.map(item => ({...item, childrens: nest(menuData, item.seq)}));
|
||||
setcodeTree(nest(data));
|
||||
}, () => {
|
||||
})
|
||||
}
|
||||
useEffect(() => {
|
||||
getCodeTree()
|
||||
}, [])
|
||||
|
||||
return (<Col>
|
||||
{codeTree.map(resp => {
|
||||
return (
|
||||
<SbItem item={resp} openDocCode={doccode} updateDocCode={setdoccodandname}/>
|
||||
)
|
||||
}
|
||||
)}
|
||||
</Col>)
|
||||
}
|
||||
|
||||
|
||||
/*글 내용+목차 분리 컴포넌트*/
|
||||
//TODO 추가 분리 작업 필요
|
||||
export function CodeCotentData({docCode}) {
|
||||
const [codeChapter, setcodeChapter] = useState([]);
|
||||
const [codeContent, setcodeContetn] = useState([]);
|
||||
let result =[];
|
||||
const getCodeDetail = (docCode) => {
|
||||
EgovNet.requestFetch(
|
||||
'/standardCode/getCodeDetailInfo.do',
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
docCode: docCode
|
||||
})
|
||||
}, (item) => {
|
||||
result = item.result.document;
|
||||
}, () => {
|
||||
})
|
||||
}
|
||||
useEffect(() => {
|
||||
getCodeDetail(docCode)
|
||||
setcodeChapter(result.map(item =>{
|
||||
const isTitle = item.full_content.includes(item.group_title);
|
||||
return(
|
||||
<VwDiv depth={item.cont_level} isTitle={isTitle}>
|
||||
<VwPtag href="#" isTitle={isTitle} onClick={() => {
|
||||
document.location.hash="#"+item.cont_type_cd;
|
||||
}} dangerouslySetInnerHTML={ {__html: item.group_title} }>
|
||||
</VwPtag>
|
||||
</VwDiv>
|
||||
)
|
||||
}))
|
||||
setcodeContetn(result.map(item =>{
|
||||
const isTitle = item.full_content.includes(item.group_title);
|
||||
const docLinkReg = /([A-Z]{3,5}(\s[0-9]{2}){3,4})/g
|
||||
const docPartReg = /\((?:표|그림|부록)?\s*([A-Z]\.)?(?!\d\))\d+(\.\d+)*(\s?\(\d\))?(-\d+)?(?:\s*[A-Z])?\)/g
|
||||
if(docLinkReg.test(item.full_content)){
|
||||
const docCodeAry = item.full_content.match(docLinkReg);
|
||||
const docCodeMap = new Map();
|
||||
for(let i=0; i<docCodeAry.length; i++) {
|
||||
const docCode = docCodeAry[i];
|
||||
docCodeMap.set(docCode, '<a class="docLink" href="/standardCode/viewer/' + docCode + '" target="_blank">' + docCode + '</a>')
|
||||
}
|
||||
docCodeMap.forEach((docCodeLink, docCode)=>{
|
||||
item.full_content = item.full_content.replaceAll(docCode, docCodeLink);
|
||||
})
|
||||
if(docPartReg.test(item.full_content)){
|
||||
|
||||
const docPartAry = item.full_content.match(docPartReg);
|
||||
const docPartMap = new Map();
|
||||
for(let i=0; i<docPartAry.length; i++) {
|
||||
const docPart = docPartAry[i];
|
||||
const docCodeMatch = item.full_content.substring(item.full_content.indexOf(docPart)-30).match(docLinkReg);
|
||||
let docCode = null;
|
||||
if (docCodeMatch){
|
||||
docCode = docCodeMatch[0];
|
||||
}
|
||||
//const docCode = item.full_content.substring(item.full_content.indexOf(docPart)-30).match(docLinkReg)[0];
|
||||
docPartMap.set(docPart, docPart +
|
||||
'<key class="bookmark" data-doccode="'+docCode+'" data-docpart="'+docPart.replace('(', '').replace(')', '')+'">'+
|
||||
'<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 16 16" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M2 4a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v11.5a.5.5 0 0 1-.777.416L7 13.101l-4.223 2.815A.5.5 0 0 1 2 15.5V4z"></path><path d="M4.268 1A2 2 0 0 1 6 0h6a2 2 0 0 1 2 2v11.5a.5.5 0 0 1-.777.416L13 13.768V2a1 1 0 0 0-1-1H4.268z"></path></svg>'+
|
||||
'</key>');
|
||||
}
|
||||
docPartMap.forEach((docPartLink, docPart)=>{
|
||||
item.full_content = item.full_content.replaceAll(docPart, docPartLink);
|
||||
})
|
||||
}
|
||||
if(item.full_content.includes("<table")){
|
||||
item.full_content = item.full_content.replace('<table ', '<table class="table table-bordered "')
|
||||
}
|
||||
if(item.error_cd !== null){
|
||||
item.full_content = "<div class='errorText'>"+item.error_cd+"</div>"+item.full_content;
|
||||
}
|
||||
item.full_content = item.full_content+"<hr>"
|
||||
return(
|
||||
<VwDiv depth={item.cont_level} isTitle={isTitle} id={item.cont_type_cd} dangerouslySetInnerHTML={ {__html: item.full_content} }></VwDiv>
|
||||
)
|
||||
}
|
||||
}))
|
||||
}, [docCode])
|
||||
|
||||
return (<>
|
||||
<CodeChapter codeChapter={codeChapter}/>
|
||||
<CodeContent codeContent={codeContent}/>
|
||||
</>)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*글 목차 컴포넌트*/
|
||||
export function CodeChapter({codeChapter}) {
|
||||
return (<>{codeChapter}</>)
|
||||
}
|
||||
|
||||
/*글 내용 컴포넌트*/
|
||||
export function CodeContent({codeContent}) {
|
||||
return (<>{codeContent}</>)
|
||||
}
|
||||
Loading…
Reference in New Issue