재개정 선택박스 양식 수정.

북마크 모달 내 재개정 선택 박스 추가.
cks
강석 최 2023-12-01 15:20:23 +09:00
parent 3bf36a235e
commit fd0bcbeef7
2 changed files with 65 additions and 9 deletions

View File

@ -2,12 +2,15 @@ import {React, useCallback, useEffect, useState} from "react";
import Modal from "react-bootstrap/Modal";
import * as EgovNet from "../../api/egovFetch";
import {VwDiv} from "./Vw.style";
import Form from "react-bootstrap/Form";
const BookmarkModal = ({docCode, docPart}) => {
const [modalTitle, setModalTitle] = useState();
const [modalBody, setModalBody] = useState();
const [docInfoSeq, setDocInfoSeq] = useState();
const [docInfo, setDocInfo] = useState();
const getModalContent = useCallback(() => {
const getModalContent = useCallback((docInfoSeq) => {
EgovNet.requestFetch(
'/standardCode/getCodeDetailInfo.do',
{
@ -16,6 +19,7 @@ const BookmarkModal = ({docCode, docPart}) => {
'Content-type': 'application/json'
},
body: JSON.stringify({
docInfoSeq: docInfoSeq,
docCode: docCode,
docPart: docPart
})
@ -25,8 +29,8 @@ const BookmarkModal = ({docCode, docPart}) => {
if(resp.result.document.length>0){
resp.result.document.forEach(function (item, index){
const isTitle = item.full_content.includes(item.group_title);
if(isTitle){
setModalTitle(docCode + " " + item.group_title);
if(item.cont_label === docPart){
setModalTitle(item.group_title);
}
if(item.full_content.includes("<table")){
item.full_content = item.full_content.replace('<table ', '<table class="table table-bordered "')
@ -44,15 +48,59 @@ const BookmarkModal = ({docCode, docPart}) => {
);
})
const getCodeInfo = useCallback(() => {
console.groupCollapsed("EgovMain.getCodeInfo()");
EgovNet.requestFetch(
'/standardCode/getCodeInfo.do',
{
method: "POST",
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify({
docCode: docCode
})
},
(resp) => {
const docInfo = resp.result.docInfo;
// 헤더 연도 선택지 구성
let headTag = [];
if(docInfo.length>0){
let optionTag = [];
docInfo.forEach(function (item, index){
optionTag.push(
<option value={item.doc_info_seq}
selected={docInfoSeq===item.doc_info_seq || (docInfoSeq===undefined && item.last_yn === 'Y')}>
{item.doc_er==='E'?'재정':'개정'} {item.kcsc_cd} {item.doc_nm} :{item.doc_yr}
</option>
)
})
headTag.push(<Form.Select size="sm" onChange={docInfoSelectorChange}>{optionTag}</Form.Select>)
}else{
headTag.push(<div>검색된 결과가 없습니다.</div>); // 코드 목록 초기값
}
setDocInfo(headTag);
}
)
})
const docInfoSelectorChange = useCallback((el) => {
setModalBody([<div>불러오는중</div>])
const docInfoSeq = el.target.value
setDocInfoSeq(docInfoSeq);
getModalContent(docInfoSeq);
})
useEffect(() => {
getModalContent();
getCodeInfo();
}, []);
return (
<>
<Modal.Header closeButton>
<Modal.Title>
{modalTitle}
{docInfo} {modalTitle}
</Modal.Title>
</Modal.Header>
<Modal.Body>

View File

@ -5,6 +5,7 @@ import Loading from '../../components/Loading'
import BookmarkModal from './BookmarkModal';
import {SbContainer} from './Sb.style'
import {VwDiv, VwPtag} from './Vw.style'
import Form from 'react-bootstrap/Form'
import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';
import Modal from 'react-bootstrap/Modal';
@ -15,6 +16,7 @@ import CODE from "../../constants/code";
function CodeViewer(props) {
const [treeLoading, setTreeLoading] = useState(true);
const [docLoading, setDocLoading] = useState(true);
const [selectFlag, setSelectFlag] = useState(false);
const {linkedDocCode} = useParams();
const [docInfoSeq, setDocInfoSeq] = useState()
const [docCode, setDocCode] = useState(linkedDocCode !== undefined?linkedDocCode:props.docCode);
@ -113,7 +115,7 @@ function CodeViewer(props) {
</option>
)
})
headTag.push(<select onChange={docInfoSelectorChange}>{optionTag}</select>)
headTag.push(<Form.Select size="sm" onChange={docInfoSelectorChange} disabled={selectFlag}>{optionTag}</Form.Select>)
}else{
headTag.push(<div>검색된 결과가 없습니다.</div>); // 코드 목록 초기값
}
@ -243,6 +245,7 @@ function CodeViewer(props) {
setDocSummary(summaryTag);
setDocDetail(detailTag);
setDocLoading(false);
setSelectFlag(false);
},
function (resp) {
console.log("err response : ", resp);
@ -251,9 +254,14 @@ function CodeViewer(props) {
console.groupEnd("EgovMain.getCodeDetailInfo()");
},[]);
const docInfoSelectorChange = (el) => {
getCodeDetailInfo(el.target.value, null);
}
const docInfoSelectorChange = useCallback((el) => {
setDocSummary([<div></div>])
setDocDetail([<div>불러오는중</div>])
setSelectFlag(true);
const docInfoSeq = el.target.value
setDocInfoSeq(docInfoSeq);
getCodeDetailInfo(docInfoSeq, null);
})
const actionAppend = (el) => {
if(!el) return;
if(el.childNodes.length===0){
@ -365,7 +373,7 @@ function CodeViewer(props) {
<Col xs={12} className="border-bottom">
<Row>
<Col xs={3}></Col>
<Col xs={9}>{docInfo}</Col>
<Col xs={"auto"}>{docInfo}</Col>
</Row>
</Col>
<Col xs={3} className="border-end viewerDiv">