기준코드 뷰어 작업중.

cks
강석 최 2023-10-17 18:01:49 +09:00
parent c36d8a69ba
commit c35583e9fe
5 changed files with 96 additions and 47 deletions

View File

@ -213,6 +213,25 @@ public class StandardCodeController {
private final StandardCodeService standardCodeService;
@Operation(
summary = "건설기준코드 트리 조회",
description = "건설기준코드 트리 조회",
tags = {"StandardCodeController"}
)
@ApiResponses(value = {
@ApiResponse(responseCode = "200", description = "조회 성공"),
@ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
})
@PostMapping(value = "/getCodeTree.do", consumes = MediaType.APPLICATION_JSON_VALUE)
public ResultVO getCodeTree(@RequestBody StandardCodeVO param, @AuthenticationPrincipal LoginVO user)
throws Exception {
ResultVO resultVO = new ResultVO();
Map<String, Object> resultMap = new HashMap<>();
resultMap.put("codeTree", standardCodeService.selectStandardCodeTree());
resultVO.setResult(resultMap);
return resultVO;
}
@Operation(
summary = "건설기준코드 내용 조회",
description = "건설기준코드 내용 조회",
@ -222,12 +241,11 @@ public class StandardCodeController {
@ApiResponse(responseCode = "200", description = "조회 성공"),
@ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
})
@PostMapping(value = "/viewer.do", consumes = MediaType.APPLICATION_JSON_VALUE)
public ResultVO selectStandardCode(@RequestBody StandardCodeVO param, @AuthenticationPrincipal LoginVO user)
@PostMapping(value = "/getCodeDetailInfo.do", consumes = MediaType.APPLICATION_JSON_VALUE)
public ResultVO getCodeDetailInfo(@RequestBody StandardCodeVO param, @AuthenticationPrincipal LoginVO user)
throws Exception {
ResultVO resultVO = new ResultVO();
Map<String, Object> resultMap = new HashMap<>();
resultMap.put("codeTree", standardCodeService.selectStandardCodeTree());
resultMap.put("document", standardCodeService.selectStandardCodeDocument(param));
resultVO.setResult(resultMap);
return resultVO;

View File

@ -77,7 +77,7 @@ const URL = {
//기준코드
STANDARD_CODE_LIST : "/standardCode/list", //건설기준코드/리스트
STANDARD_CODE_VIEWER : "/standardCode/viewer/:docCode", //건설기준코드/뷰어
STANDARD_CODE_VIEWER : "/standardCode/viewer", //건설기준코드/뷰어
}
export default URL;

View File

@ -305,3 +305,5 @@
.calendar_info ul li::before {content: ""; display: block; position: absolute; left: 20px; top: 27px; width: 2px; height: 2px; background: #222;}
.calendar_info ul li a {color: #222; font-size: 16px; font-weight: 300;}
.calendar_info ul li span {position: absolute; right: 15px; top: 15px; color: #808080; font-size: 16px; font-weight: 300;}
.viewerDiv{max-height: 650px; overflow-y: auto;}

View File

@ -1,12 +1,11 @@
import {React, useState} from 'react'
import { useNavigate } from 'react-router-dom';
import {SbTitle, SbSub, SbLink} from './Sb.style'
import {SbTitle, SbSub} from './Sb.style'
import { FcFolder, FcOpenedFolder, FcFile } from 'react-icons/fc'
import { AiOutlinePlusSquare, AiOutlineMinusSquare } from 'react-icons/ai'
const SbItem = ({ item }) => {
const SbItem = ({item, updateDocCode}) => {
const [collapsed, setCollapsed] = useState(false);
const navigate = useNavigate();
function toggleCollapse() {
setCollapsed(prevValue => !prevValue);
}
@ -19,7 +18,7 @@ const SbItem = ({ item }) => {
<SbTitle depth={item.doc_level} onClick={toggleCollapse}>{icon1}{icon2}&nbsp;{(item.doc_level === 1?'':item.doc_code)+' '+item.doc_code_name}</SbTitle>
<SbSub isOpen={collapsed}>
{item.childrens.map((child) => (
<SbItem item={child} />
<SbItem item={child} updateDocCode={updateDocCode} />
))}
</SbSub>
</div>
@ -28,14 +27,9 @@ const SbItem = ({ item }) => {
const icon = <FcFile />;
return (
<SbTitle depth={item.doc_level}>
{/*<a onClick={()=>{
navigate('/standardCode/viewer', {
state:{
docCode: item.doc_code
}
})
}}>{icon}&nbsp;{(item.doc_level === 1?'':item.doc_code)+' '+item.doc_code_name}</a>*/}
<SbLink to={"/standardCode/viewer/"+item.doc_code}>{icon}&nbsp;{(item.doc_level === 1?'':item.doc_code)+' '+item.doc_code_name}</SbLink>
<a onClick={()=>{
updateDocCode(item.doc_code, item.doc_code_name)
}}>{icon}&nbsp;{(item.doc_level === 1?'':item.doc_code)+' '+item.doc_code_name}</a>
</SbTitle>
)
}

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect, useCallback } from 'react';
import { useLocation, useParams } from 'react-router-dom';
import { useLocation } from 'react-router-dom';
import SbItem from './SbItem'
import {SbContainer} from './Sb.style'
import Row from 'react-bootstrap/Row';
@ -7,8 +7,8 @@ import Col from 'react-bootstrap/Col';
import * as EgovNet from 'api/egovFetch';
function CodeViewer(props) {
const [{docCode}, setDocCode] = useState(useParams());
const [docCode, setDocCode] = useState(props.docCode);
const [docName, setDocName] = useState(props.docName);
const [codeTree, setCodeTree] = useState();
const [docSummary, setDocSummary] = useState();
const [docDetail, setDocDetail] = useState();
@ -21,21 +21,23 @@ function CodeViewer(props) {
console.log("viewer [docCode] : ", docCode);
const retrieveList = useCallback(() => {
console.groupCollapsed("EgovMain.retrieveList()");
const retrieveListURL = '/standardCode/viewer.do';
const requestOptions = {
const updateDocCode = useCallback((docCode, docName)=>{
setDocCode(docCode);
setDocName(docName);
getCodeDetailInfo(docCode);
})
const getCodeTree = useCallback(()=>{
EgovNet.requestFetch(
'/standardCode/getCodeTree.do',
{
method: "POST",
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify({
docCode: docCode
})
}
EgovNet.requestFetch(retrieveListURL,
requestOptions,
body: JSON.stringify({})
},
(resp) => {
const menuData = resp.result.codeTree;
// 코드 목록 트리 구성
@ -48,8 +50,8 @@ function CodeViewer(props) {
if(tree.length>0){
treeTag.push(
<SbContainer>
{tree.map((subItem, index) =>
<SbItem item={subItem} key={index} />
{tree.map((subItem) =>
<SbItem item={subItem} updateDocCode={updateDocCode} />
)}
</SbContainer>
)
@ -57,18 +59,42 @@ function CodeViewer(props) {
treeTag.push(<div>검색된 결과가 없습니다.</div>); // 코드 목록 초기값
}
setCodeTree(treeTag);
},
function (resp) {
console.log("err response : ", resp);
}
);
})
const getCodeDetailInfo = useCallback((docCode) => {
console.groupCollapsed("EgovMain.getCodeDetailInfo()");
EgovNet.requestFetch(
'/standardCode/getCodeDetailInfo.do',
{
method: "POST",
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify({
docCode: docCode
})
},
(resp) => {
// 목차 구성
let summaryTag = [];
// 문서 전문 구성
let detailTag = [];
if(resp.result.document.length>0){
resp.result.document.forEach(function (item, index){
if(item.full_content.includes(item.group_title)){
summaryTag.push(
<div>{item.group_title}</div>
<div><p href="#" onClick={() => {
document.location.hash="#"+item.cont_type_cd;
}}>{item.group_title}</p></div>
)
}
detailTag.push(
<div dangerouslySetInnerHTML={ {__html: item.full_content} }></div>
<div id={item.cont_type_cd} dangerouslySetInnerHTML={ {__html: item.full_content} }></div>
)
})
}else{
@ -81,25 +107,34 @@ function CodeViewer(props) {
console.log("err response : ", resp);
}
);
console.groupEnd("EgovMain.retrieveList()");
console.groupEnd("EgovMain.getCodeDetailInfo()");
},[]);
useEffect(() => {
retrieveList();
}, [retrieveList]);
getCodeDetailInfo();
}, []);
useEffect(() => {
getCodeTree();
}, []);
console.log("------------------------------viewer [End]");
console.groupEnd("viewer");
return (
<Row>
<Col xs={3} className="border-end">
<Col xs={12} className="border-bottom">
<Row>
<Col xs={3}></Col>
<Col xs={9}>{docCode} {docName}</Col>
</Row>
</Col>
<Col xs={3} className="border-end viewerDiv">
{codeTree}
</Col>
<Col xs={3} className="border-end">
<Col xs={3} className="border-end viewerDiv">
{docSummary}
</Col>
<Col xs={6}>
<Col xs={6} className="viewerDiv">
{docDetail}
</Col>
</Row>