diff --git a/egovframe-template-simple-react-contribution/src/pages/standardCode/viwerComponents.js b/egovframe-template-simple-react-contribution/src/pages/standardCode/viwerComponents.js
new file mode 100644
index 0000000..9a4bc40
--- /dev/null
+++ b/egovframe-template-simple-react-contribution/src/pages/standardCode/viwerComponents.js
@@ -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 (
+
+
{doccode+' '+docname}
+
+
+
+
+ )
+}
+
+/*글 트리 컴포넌트*/
+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 (
+ {codeTree.map(resp => {
+ return (
+
+ )
+ }
+ )}
+ )
+}
+
+
+/*글 내용+목차 분리 컴포넌트*/
+//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(
+
+ {
+ document.location.hash="#"+item.cont_type_cd;
+ }} dangerouslySetInnerHTML={ {__html: item.group_title} }>
+
+
+ )
+ }))
+ 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' + docCode + '')
+ }
+ 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'+
+ ''+
+ '');
+ }
+ docPartMap.forEach((docPartLink, docPart)=>{
+ item.full_content = item.full_content.replaceAll(docPart, docPartLink);
+ })
+ }
+ if(item.full_content.includes(""+item.full_content;
+ }
+ item.full_content = item.full_content+"
"
+ return(
+
+ )
+ }
+ }))
+ }, [docCode])
+
+ return (<>
+
+
+ )
+}
+
+
+
+
+
+
+
+
+/*글 목차 컴포넌트*/
+export function CodeChapter({codeChapter}) {
+ return (<>{codeChapter})
+}
+
+/*글 내용 컴포넌트*/
+export function CodeContent({codeContent}) {
+ return (<>{codeContent})
+}
\ No newline at end of file