건설기준코드 검색 페이지 작업중.
parent
a23833a00b
commit
903ef68f86
|
|
@ -1,4 +1,4 @@
|
|||
import React from 'react';
|
||||
import React, {useState} from 'react';
|
||||
import { Link, NavLink, useNavigate } from 'react-router-dom';
|
||||
|
||||
import * as EgovNet from 'api/egovFetch';
|
||||
|
|
@ -13,6 +13,7 @@ function EgovHeader({ loginUser, onChangeLogin }) {
|
|||
console.group("EgovHeader");
|
||||
console.log("[Start] EgovHeader ------------------------------");
|
||||
|
||||
const [menuDiv, setMenuDiv] = useState(false);
|
||||
const accessToken = getLocalItem('accessToken');
|
||||
const userInfo = parseJwt(accessToken);
|
||||
const sessionUserId = userInfo?.id;
|
||||
|
|
@ -56,9 +57,15 @@ function EgovHeader({ loginUser, onChangeLogin }) {
|
|||
);
|
||||
}
|
||||
|
||||
function allMenuControl(){
|
||||
setMenuDiv(!menuDiv);
|
||||
}
|
||||
|
||||
console.log("------------------------------EgovHeader [End]");
|
||||
console.groupEnd("EgovHeader");
|
||||
|
||||
|
||||
|
||||
return (
|
||||
// <!-- header -->
|
||||
<div className="header">
|
||||
|
|
@ -71,7 +78,8 @@ function EgovHeader({ loginUser, onChangeLogin }) {
|
|||
<div className="gnb">
|
||||
<h2 className="blind">주메뉴</h2>
|
||||
<ul>
|
||||
<li><NavLink to={URL.ABOUT} className={({ isActive }) => (isActive ? "cur" : "")}>사이트소개</NavLink></li>
|
||||
<li><NavLink to={URL.STANDARD_CODE_INFO} className={({ isActive }) => (isActive ? "cur" : "")}>건설기준코드</NavLink></li>
|
||||
{/*<li><NavLink to={URL.ABOUT} className={({ isActive }) => (isActive ? "cur" : "")}>사이트소개</NavLink></li>*/}
|
||||
<li><NavLink to={URL.INTRO} className={({ isActive }) => (isActive ? "cur" : "")}>정보마당</NavLink></li>
|
||||
<li><NavLink to={URL.SUPPORT} className={({ isActive }) => (isActive ? "cur" : "")}>고객지원</NavLink></li>
|
||||
<li><NavLink to={URL.INFORM} className={({ isActive }) => (isActive ? "cur" : "")}>알림마당</NavLink></li>
|
||||
|
|
@ -98,17 +106,24 @@ function EgovHeader({ loginUser, onChangeLogin }) {
|
|||
{/* <!--// PC web에서 보여지는 영역 --> */}
|
||||
|
||||
{/* <!-- right area --> */}
|
||||
<div className="right_a">
|
||||
<div className="right_a" onClick={allMenuControl}>
|
||||
<button type="button" className="btn btnAllMenu" title="전체메뉴 닫힘">전체메뉴</button>
|
||||
<button type="button" className="btn mobile btnAllMenuM" title="전체메뉴 닫힘">전체메뉴</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* <!-- All menu : web --> */}
|
||||
<div className="all_menu WEB closed">
|
||||
<div className={`all_menu WEB ${menuDiv?"open":"closed"}`}>
|
||||
<h2 className="blind">전체메뉴</h2>
|
||||
<div className="inner">
|
||||
<div className="col">
|
||||
<h3>건설기준코드</h3>
|
||||
<ul>
|
||||
<li><NavLink to={URL.STANDARD_CODE_INFO} onClick={allMenuControl} className={({ isActive }) => (isActive ? "cur" : "")}>건설기준코드 안내</NavLink></li>
|
||||
<li><NavLink to={URL.STANDARD_CODE_LIST} onClick={allMenuControl} className={({ isActive }) => (isActive ? "cur" : "")}>건설기준코드 검색</NavLink></li>
|
||||
</ul>
|
||||
</div>
|
||||
{/*<div className="col">
|
||||
<h3>사이트소개</h3>
|
||||
<ul>
|
||||
<li><NavLink to={URL.ABOUT_SITE} className={({ isActive }) => (isActive ? "cur" : "")}>소개</NavLink></li>
|
||||
|
|
@ -116,7 +131,8 @@ function EgovHeader({ loginUser, onChangeLogin }) {
|
|||
<li><NavLink to={URL.ABOUT_ORGANIZATION} className={({ isActive }) => (isActive ? "cur" : "")}>조직소개</NavLink></li>
|
||||
<li><NavLink to={URL.ABOUT_LOCATION} className={({ isActive }) => (isActive ? "cur" : "")}>찾아오시는 길</NavLink></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>*/}
|
||||
|
||||
<div className="col">
|
||||
<h3>정보마당</h3>
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -119,7 +119,9 @@ const URL = {
|
|||
ADMIN__LOGS__FILE_DOWNLOAD_STATUS : "/admin/logs/file-download-status", // 위원회 관리/파일 다운현황
|
||||
|
||||
//기준코드
|
||||
STANDARD_CODE_LIST : "/standardCode/list/:listCode", //건설기준코드/리스트
|
||||
STANDARD_CODE_INFO : "/standardCode/info",
|
||||
STANDARD_CODE_LIST : "/standardCode/list", //건설기준코드/리스트
|
||||
STANDARD_CODE_LIST_LINK : "/standardCode/list/:listCode", //건설기준코드/리스트
|
||||
STANDARD_CODE_DETAIL : "/standardCode/detail", //건설기준코드/리스트
|
||||
STANDARD_CODE_VIEWER : "/standardCode/viewer", //건설기준코드/뷰어
|
||||
STANDARD_CODE_VIEWER_LINK : "/standardCode/viewer/:linkedDocCode", //건설기준코드/뷰어/새 창 링크
|
||||
|
|
|
|||
|
|
@ -187,7 +187,7 @@
|
|||
|
||||
|
||||
/* Condition */
|
||||
.condition {padding: 10px; border: 1px solid #dde2e5; border-radius: 10px; font-size: 0; text-align: center;} /* changed by lim padding: 26px;*/
|
||||
.condition {padding: 10px; border: 1px solid #dde2e5; border-radius: 10px; text-align: center;} /* changed by lim padding: 26px;*/
|
||||
.condition > ul,
|
||||
.condition > ul li {display: inline-block; vertical-align: top;}
|
||||
.condition > ul li + li {margin-left: 20px;}
|
||||
|
|
@ -246,7 +246,7 @@ select::-ms-expand {display:none;}
|
|||
/* 건설기준코드list 설계기준 표준시방서 전문시방서 통합 다운로드 탭 */
|
||||
.right_col {display: flex; justify-content: space-between; align-items: center;}
|
||||
.mini_board ul {display: flex; list-style: none; padding: 0; margin: 0;}
|
||||
.tab {padding: 10px; margin-right: 10px; cursor: pointer; border: 1px solid #ccc; border-radius: 5px; transition: background-color 0.3s;}
|
||||
.tab {padding: 5px 10px; margin-right: 10px; cursor: pointer; border: 1px solid #ccc; border-radius: 5px; transition: background-color 0.3s;}
|
||||
.tab:hover {background-color: #f0f0f0;}
|
||||
.active {background-color: #007bff; color: #fff;}
|
||||
|
||||
|
|
|
|||
|
|
@ -8,13 +8,52 @@ import {AiFillFileMarkdown, AiFillStar} from "react-icons/ai";
|
|||
|
||||
function StandardCodeList(props) {
|
||||
const {listCode} = useParams();
|
||||
const [show, setshow] = useState(false);
|
||||
const [groupseq, setgroupseq] = useState();
|
||||
const [show, setShow] = useState(false);
|
||||
const [groupSeq, setgroupSeq] = useState();
|
||||
|
||||
function showhandling(e) {
|
||||
console.group("StandardCodeList");
|
||||
console.log("[Start] StandardCodeList ------------------------------");
|
||||
console.log("StandardCodeList [props] : ", props);
|
||||
console.log("listcode----------------------------" + listCode);
|
||||
|
||||
const location = useLocation();
|
||||
console.log("StandardCodeList [location] : ", location);
|
||||
|
||||
const category1Ref = useRef();
|
||||
const category2Ref = useRef();
|
||||
const category3Ref = useRef();
|
||||
const wrdRef = useRef();
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const [searchCondition, setSearchCondition] = useState(location.state?.searchCondition || {
|
||||
pageIndex: 1,
|
||||
tab: listCode?.substring(0, 2),
|
||||
category1: listCode?.substring(2, 4),
|
||||
category2: listCode?.substring(4, 6),
|
||||
searchWrd: ''
|
||||
});// 기존 조회에서 접근 했을 시 || 신규로 접근 했을 시
|
||||
const [masterBoard, setMasterBoard] = useState({});
|
||||
|
||||
/* 검색기능 추가 변수*/
|
||||
const [listData, setlistData] = useState([]);
|
||||
const [filterData, setFilterData] = useState('');
|
||||
const [category1List, setCategory1List] = useState([]);
|
||||
const [category2List, setCategory2List] = useState([]);
|
||||
const [category3List, setCategory3List] = useState([]);
|
||||
const [resultCnt, setResultCnt] = useState(0);
|
||||
|
||||
/* 탭 */
|
||||
const [activeTab, setActiveTab] = useState(10);
|
||||
const [subTabsVisible, setSubTabsVisible] = useState(false);
|
||||
|
||||
function close() {
|
||||
setShow(false);
|
||||
}
|
||||
|
||||
function showHandling(e) {
|
||||
const param = e.currentTarget.dataset;
|
||||
const groupseq = param.groupseq;
|
||||
console.log(groupseq);
|
||||
const groupSeq = param.groupSeq;
|
||||
console.log(groupSeq);
|
||||
EgovNet.requestFetch(
|
||||
'/standardCode/codeListModal.do',
|
||||
{
|
||||
|
|
@ -23,7 +62,7 @@ function StandardCodeList(props) {
|
|||
'Content-type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(
|
||||
groupseq
|
||||
groupSeq
|
||||
)
|
||||
}, (resp) => {
|
||||
console.log(resp + "------------------------resp")
|
||||
|
|
@ -50,52 +89,14 @@ function StandardCodeList(props) {
|
|||
)
|
||||
}
|
||||
|
||||
setgroupseq(<StandardCodeListModalTable head={head} content={body}/>);
|
||||
setgroupSeq(<StandardCodeListModalTable head={head} content={body}/>);
|
||||
}
|
||||
)
|
||||
setshow(true);
|
||||
setShow(true);
|
||||
|
||||
}
|
||||
|
||||
function close() {
|
||||
setshow(false);
|
||||
}
|
||||
|
||||
console.group("StandardCodeList");
|
||||
console.log("[Start] StandardCodeList ------------------------------");
|
||||
console.log("StandardCodeList [props] : ", props);
|
||||
console.log("listcode----------------------------" + listCode);
|
||||
|
||||
const location = useLocation();
|
||||
console.log("StandardCodeList [location] : ", location);
|
||||
|
||||
const category1Ref = useRef();
|
||||
const category2Ref = useRef();
|
||||
const category3Ref = useRef();
|
||||
const wrdRef = useRef();
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const [searchCondition, setSearchCondition] = useState(location.state?.searchCondition || {
|
||||
pageIndex: 1,
|
||||
tab: listCode.substring(0, 2),
|
||||
category1: listCode.substring(2, 4),
|
||||
category2: listCode.substring(4, 6),
|
||||
searchWrd: ''
|
||||
});// 기존 조회에서 접근 했을 시 || 신규로 접근 했을 시
|
||||
const [masterBoard, setMasterBoard] = useState({});
|
||||
|
||||
/* 검색기능 추가 변수*/
|
||||
const [listdata, setlistdata] = useState([]);
|
||||
const [filterData, setfilterData] = useState('');
|
||||
const [category1List, setCategory1List] = useState([]);
|
||||
const [category2List, setCategory2List] = useState([]);
|
||||
const [category3List, setCategory3List] = useState([]);
|
||||
const [resultCnt, setResultCnt] = useState(0);
|
||||
|
||||
/* 탭 */
|
||||
const [activeTab, setActiveTab] = useState(10);
|
||||
const [subTabsVisible, setSubTabsVisible] = useState(false);
|
||||
|
||||
|
||||
const handleTabClick = (tabName) => {
|
||||
setActiveTab(tabName);
|
||||
|
||||
|
|
@ -135,7 +136,7 @@ function StandardCodeList(props) {
|
|||
(resp) => {
|
||||
setMasterBoard(resp.result.tnDocumentInfo);
|
||||
/*검색을 위한 리스트 state에 저장*/
|
||||
setlistdata(resp.result.resultList);
|
||||
setlistData(resp.result.resultList);
|
||||
setCategory1List(resp.result.category1List);
|
||||
setCategory2List(resp.result.category2List);
|
||||
setCategory3List(resp.result.category3List);
|
||||
|
|
@ -159,49 +160,31 @@ function StandardCodeList(props) {
|
|||
return (
|
||||
<div className="StandardCodeList container">
|
||||
<div className="c_wrap codelistcontent">
|
||||
{/* <!-- Location --> */}
|
||||
<div className="location">
|
||||
<ul>
|
||||
<li><Link to={URL.MAIN} className="home">Home</Link></li>
|
||||
<li><Link to='#'>건설기준코드</Link></li>
|
||||
<li>{masterBoard && masterBoard.bbsNm}</li>
|
||||
<li><Link to={URL.STANDARD_CODE_LIST}>건설기준코드 검색</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
{/* <!--// Location --> */}
|
||||
|
||||
<div className="layout">
|
||||
{/* <!-- Navigation --> */}
|
||||
|
||||
{/* <!--// Navigation --> */}
|
||||
|
||||
<div className="contents NOTICE_LIST listtablediv">
|
||||
{/* <!-- 본문 --> */}
|
||||
|
||||
<div className="top_tit">
|
||||
<h2 className="tit_1">건설기준코드</h2>
|
||||
<h2 className="tit_1">건설기준코드 검색</h2>
|
||||
</div>
|
||||
|
||||
<h2 className="tit_2">설계기준, 표준시방서 내용을 열람할 수 있습니다.</h2>
|
||||
|
||||
{/* <!-- 검색조건 --> */}
|
||||
<div className="condition">
|
||||
<ul>
|
||||
<li className="third_2 R">
|
||||
<span className="f_search w_200">
|
||||
<input type="text" name="" defaultValue={searchCondition.searchWrd} placeholder="코드명" ref={wrdRef}
|
||||
onChange={e => {
|
||||
setfilterData(e.target.value);
|
||||
}}
|
||||
/>
|
||||
<button type="button"
|
||||
onClick={() => {
|
||||
retrieveList({...searchCondition, pageIndex: 1, category1: category1Ref.current.value, searchWrd: wrdRef.current.value, tab: activeTab});
|
||||
}}>조회</button>
|
||||
</span>
|
||||
<li className="third_1 L">
|
||||
<div className={`tab ${activeTab === 10 ? 'active' : ''}`} onClick={() => handleTabClick(10)}>설계기준</div>
|
||||
</li>
|
||||
<li className="third_1 L">
|
||||
<div className={`tab ${activeTab === 20 ? 'active' : ''}`} onClick={() => handleTabClick(20)}>표준시방서</div>
|
||||
</li>
|
||||
<li className="third_1 L">
|
||||
<div className={`tab ${[40, 50, 60, 70, 80, 90].includes(activeTab) ? 'active' : ''}`} onClick={() => handleTabClick(40)}>전문시방서</div>
|
||||
</li>
|
||||
<li className="third_1 L">
|
||||
<label className="f_select" htmlFor="sel1">
|
||||
<span>{searchCondition.category1}</span>
|
||||
<select id="sel1" title="조건" value={searchCondition.category1} ref={category1Ref}
|
||||
onChange={e => {
|
||||
const updatedCondition = {
|
||||
|
|
@ -272,19 +255,12 @@ function StandardCodeList(props) {
|
|||
</select>
|
||||
</label>
|
||||
</li>
|
||||
<li className="third_1 L">
|
||||
<div className={`tab`}>통합 다운로드</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{/* <!--// 검색조건 --> */}
|
||||
<div className="right_col">
|
||||
<div className="mini_board">
|
||||
<ul>
|
||||
<div className={`tab ${activeTab === 10 ? 'active' : ''}`} onClick={() => handleTabClick(10)}>설계기준</div>
|
||||
<div className={`tab ${activeTab === 20 ? 'active' : ''}`} onClick={() => handleTabClick(20)}>표준시방서</div>
|
||||
<div className={`tab ${[40, 50, 60, 70, 80, 90].includes(activeTab) ? 'active' : ''}`} onClick={() => handleTabClick(40)}>전문시방서</div>
|
||||
<div className={`tab`}>통합 다운로드</div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{subTabsVisible && (
|
||||
<div className="right_col">
|
||||
<div className="mini_board">
|
||||
|
|
@ -315,7 +291,7 @@ function StandardCodeList(props) {
|
|||
<div className="result">
|
||||
|
||||
{/*검색기능 filterData가 없는경우 모든 데이터 출력*/}
|
||||
{listdata.filter(item => {
|
||||
{listData.filter(item => {
|
||||
if (item.groupNm.includes(filterData)) {
|
||||
return item
|
||||
}
|
||||
|
|
@ -327,7 +303,7 @@ function StandardCodeList(props) {
|
|||
<div className="middleCategory">{item.middleCategory}</div>
|
||||
<div className="kcscCd">{item.kcscCd}</div>
|
||||
<div className="groupNm">{item.groupNm}</div>
|
||||
<div className="Revisionhistory"><a className="vieweratag" onClick={showhandling} data-groupseq={item.groupSeq}>개정이력</a></div>
|
||||
<div className="Revisionhistory"><a className="vieweratag" onClick={showHandling} data-groupSeq={item.groupSeq}>개정이력</a></div>
|
||||
<div className="fille">{item.contentcount > 0 ? <a className="vieweratag" href={"/standardCode/viewer/" + item.kcscCd}>내용보기</a> : null}</div>
|
||||
<div className="viewer">{item.docFileGrpId == null ? null :
|
||||
<a href={"https://www.kcsc.re.kr/file/DownloadGrp/" + item.docFileGrpId}><AiFillFileMarkdown/></a>}</div>
|
||||
|
|
@ -343,7 +319,7 @@ function StandardCodeList(props) {
|
|||
{/* <!-- Paging --> */}
|
||||
|
||||
{/* <!--/ Paging --> */}
|
||||
<StandardCodeListModal size={"lg"} show={show} content={groupseq} onClose={close} title={"개정이력"}/>
|
||||
<StandardCodeListModal size={"lg"} show={show} content={groupSeq} onClose={close} title={"개정이력"}/>
|
||||
|
||||
|
||||
{/* <!--// 본문 --> */}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import {React, useCallback, useEffect, useState} from "react";
|
||||
import Modal from "react-bootstrap/Modal";
|
||||
import * as EgovNet from "../../api/egovFetch";
|
||||
import * as EgovNet from "../../../api/egovFetch";
|
||||
import {VwDiv} from "./Vw.style";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import React, { useState, useEffect, useCallback } from 'react';
|
||||
import { useLocation, useParams } from 'react-router-dom';
|
||||
import SbItem from './SbItem'
|
||||
import Loading from '../../components/Loading'
|
||||
import Loading from '../../../components/Loading'
|
||||
import BookmarkModal from './BookmarkModal';
|
||||
import {SbContainer} from './Sb.style'
|
||||
import {VwDiv, VwPtag} from './Vw.style'
|
||||
|
|
@ -10,9 +10,9 @@ import Row from 'react-bootstrap/Row';
|
|||
import Col from 'react-bootstrap/Col';
|
||||
import Modal from 'react-bootstrap/Modal';
|
||||
import * as EgovNet from 'api/egovFetch';
|
||||
import {getLocalItem} from "../../utils/storage";
|
||||
import CODE from "../../constants/code";
|
||||
import {parseJwt} from "../../utils/parseJwt";
|
||||
import {getLocalItem} from "../../../utils/storage";
|
||||
import CODE from "../../../constants/code";
|
||||
import {parseJwt} from "../../../utils/parseJwt";
|
||||
|
||||
function CodeViewer(props) {
|
||||
const [treeLoading, setTreeLoading] = useState(true);
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import * as EgovNet from "../../api/egovFetch";
|
||||
import * as EgovNet from "../../../api/egovFetch";
|
||||
import React, {useEffect, useState} from "react";
|
||||
import SbItem from "./SbItem";
|
||||
import {Col, Row} from "react-bootstrap";
|
||||
|
|
@ -109,11 +109,11 @@ import AdminLogsFileDownloadStatus from 'pages/admin/logs/FileDownloadStatus';
|
|||
|
||||
|
||||
//건설기준코드
|
||||
import CodeViewer from 'pages/standardCode/viewer';
|
||||
import CodeViewer from 'pages/standardCode/viewer/viewer';
|
||||
|
||||
import * as EgovNet from 'api/egovFetch'; // jwt토큰 위조 검사 때문에 추가
|
||||
import initPage from 'js/ui';
|
||||
import StandardCodeList from "../pages/standardCode/StandardCodeList";
|
||||
import StandardCodeList from "../pages/standardCode/list/StandardCodeList";
|
||||
|
||||
const RootRoutes = () => {
|
||||
//useLocation객체를 이용하여 정규표현식을 사용한 /admin/~ 으로 시작하는 경로와 비교에 사용(아래 1줄) */}
|
||||
|
|
@ -326,6 +326,7 @@ const SecondRoutes = () => {
|
|||
|
||||
{/*기준코드리스트*/}
|
||||
<Route path={URL.STANDARD_CODE_LIST} element={<StandardCodeList />} />
|
||||
<Route path={URL.STANDARD_CODE_LIST_LINK} element={<StandardCodeList />} />
|
||||
|
||||
</Routes>
|
||||
<EgovFooter />
|
||||
|
|
|
|||
Loading…
Reference in New Issue