댓글 삭제 작업중

egovframe-template-simple-react-contribution/package-lock.json

@@ -3146,6 +3146,12 @@
         "@types/node": "*"
       }
     },
+    "@types/cookie": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
+      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
+      "dev": true
+    },
     "@types/d3-array": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.1.tgz",
@@ -3260,6 +3266,16 @@
         "@types/unist": "^2"
       }
     },
+    "@types/hoist-non-react-statics": {
+      "version": "3.3.5",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz",
+      "integrity": "sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==",
+      "dev": true,
+      "requires": {
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0"
+      }
+    },
     "@types/html-minifier-terser": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz",
@@ -5551,6 +5567,11 @@
         "domelementtype": "^2.2.0"
       }
     },
+    "dompurify": {
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.1.5.tgz",
+      "integrity": "sha512-lwG+n5h8QNpxtyrJW/gJWckL+1/DQiYMX8f7t8Z2AZTPw1esVrqjI63i7Zc2Gz0aKzLVMYC1V1PL/ky+aY/NgA=="
+    },
     "domutils": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz",
@@ -11107,6 +11128,17 @@
         "warning": "^4.0.3"
       }
     },
+    "react-cookie": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-7.1.4.tgz",
+      "integrity": "sha512-wDxxa/HYaSXSMlyWJvJ5uZTzIVtQTPf1gMksFgwAz/2/W3lCtY8r4OChCXMPE7wax0PAdMY97UkNJedGv7KnDw==",
+      "dev": true,
+      "requires": {
+        "@types/hoist-non-react-statics": "^3.3.5",
+        "hoist-non-react-statics": "^3.3.2",
+        "universal-cookie": "^7.0.0"
+      }
+    },
     "react-copy-to-clipboard": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/react-copy-to-clipboard/-/react-copy-to-clipboard-5.1.0.tgz",
@@ -12985,6 +13017,24 @@
         "crypto-random-string": "^2.0.0"
       }
     },
+    "universal-cookie": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-7.1.4.tgz",
+      "integrity": "sha512-Q+DVJsdykStWRMtXr2Pdj3EF98qZHUH/fXv/gwFz/unyToy1Ek1w5GsWt53Pf38tT8Gbcy5QNsj61Xe9TggP4g==",
+      "dev": true,
+      "requires": {
+        "@types/cookie": "^0.6.0",
+        "cookie": "^0.6.0"
+      },
+      "dependencies": {
+        "cookie": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.6.0.tgz",
+          "integrity": "sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==",
+          "dev": true
+        }
+      }
+    },
     "universalify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",

egovframe-template-simple-react-contribution/package.json

@@ -17,6 +17,7 @@
     "apexcharts": "^3.45.2",
     "bootstrap": "^5.3.2",
     "date-fns": "^3.2.0",
+    "dompurify": "^3.1.5",
     "prop-types": "^15.8.1",
     "qs": "^6.11.0",
     "react": "^18.2.0",
@@ -44,7 +45,8 @@
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.3.0",
-    "@testing-library/user-event": "^13.5.0"
+    "@testing-library/user-event": "^13.5.0",
+    "react-cookie": "^7.1.4"
   },
   "scripts": {
     "start": "react-scripts start",

egovframe-template-simple-react-contribution/src/App.js

@@ -1,7 +1,8 @@
 import RootRoutes from './routes';
 import ThemeCustomization from 'themes';
 import ScrollTop from 'components/ScrollTop';
-import React from 'react';
+import React, { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
 
 import 'bootstrap/dist/css/bootstrap.min.css';
 import './css/base.css';
@@ -11,17 +12,34 @@ import './css/page.css';
 import './css/response.css';
 import './css/Custom/customMain.css'
 
+import URL from "constants/url";
+
 function App() {
 
   return (
       <ThemeCustomization>
           <ScrollTop>
+              <ScrollControl />
               <RootRoutes />
           </ScrollTop>
       </ThemeCustomization>
   )
 }
 
+const ScrollControl = () => {
+    const location = useLocation();
+
+    useEffect(() => {
+        const hideFooterPaths = [URL.STANDARD_CODE_VIEWER, URL.STANDARD_CODE_LIST];
+        if (hideFooterPaths.some(path => location.pathname.includes(path))) {
+            document.body.style.overflow = 'hidden';
+        } else {
+            document.body.style.overflow = '';
+        }
+    }, [location]);
+
+    return null;
+};
 console.log("process.env.NODE_ENV", process.env.NODE_ENV);
 console.log("process.env.REACT_APP_EGOV_CONTEXT_URL", "[" + process.env.REACT_APP_EGOV_CONTEXT_URL + "]");
 

egovframe-template-simple-react-contribution/src/components/EgovFooter.jsx

@@ -1,14 +1,16 @@
 import React, { useState, useCallback } from 'react';
 import {Link, NavLink} from 'react-router-dom';
-import URL from "../constants/url";
+import URL from "constants/url";
 
 import Collapse from 'react-bootstrap/Collapse'
 
 function EgovFooter() {
     const [toggle, setToggle] = useState(false);
     const toggleFunc = useCallback(() => setToggle(!toggle), [toggle]);
+    const hideFooterPaths = [URL.STANDARD_CODE_VIEWER, URL.STANDARD_CODE_LIST];
+    const currentPath = window.location.pathname;
 
-    if(window.location.pathname.includes("/standardCode/viewer")){
+    if(hideFooterPaths.some(path => currentPath.includes(path))){
         return null;
     }else{
         return (

egovframe-template-simple-react-contribution/src/components/EgovHeader.jsx

@@ -92,68 +92,91 @@ function EgovHeader({ loginUser, onChangeLogin }) {
         // <!-- header -->
         <div className="header">
             <div className="inner">
-                <div className="row logo w-100 justify-content-between pt-3">
-                    <div className="col-3">
+                <Row className="logo pt-4">
+                    <Col xs={3}>
                         <Link to={URL.MAIN} className="w"><img src="/assets/images/logo.png" alt="국가건설기준센터" /></Link>
                         <Link to={URL.MAIN} className="m"><img src="/assets/images/logo_m.png" alt="국가건설기준센터" /></Link>
-                    </div>
-                    <div className="col-6 d-flex justify-content-center align-items-end"><img src="/assets/images/copy.png" alt="국가건설기준센터" className="align-self-end" /></div>
-                    <div className="col-3 d-flex justify-content-end align-items-end">
-                        <div className="col-1 person" onClick={myHandler}></div>
-                        <div className="col-1 right_a" onClick={allMenuControl}>
-                            <button type="button" className="btn btnAllMenu" title="전체메뉴 닫힘">전체메뉴</button>
-                            <button type="button" className="btn mobile btnAllMenuM" title="전체메뉴 닫힘">전체메뉴</button>
+                    </Col>
+                    <Col xs={6} className="text-center">
+                        {/*<img src="/assets/images/copy.png" alt="국가건설기준센터" className="align-self-end" />*/}
+                        <div className="search">
+                            <div className="search_input">
+                                <form className="row justify-content-between w-100 m-0">
+                                    <div className="col-2">
+                                        <select name="" className="form-select shadow-none">
+                                            <option value="">코드명</option>
+                                            <option value="">목차</option>
+                                            <option value="">본문</option>
+                                        </select>
+                                    </div>
+                                    <div className="col-10 d-flex justify-content-between">
+                                        <div className="col-11"><input type="text" className="form-control shadow-none" placeholder="검색어를 입력하세요." lang="ko" /></div>
+                                        <div className="col-1 text-center">
+                                            <button type="button" className="topsearch" onClick={SearchHandler}></button>
+                                        </div>
+                                    </div>
+                                </form>
+                            </div>
                         </div>
-                    </div>
-                </div>
-                <div className="search">
-                    <div className="search_input">
-                        <form className="row justify-content-between w-100 m-0">
-                            <div className="col-2">
-                                <select name="" className="form-select shadow-none">
-                                    <option value="">코드명</option>
-                                    <option value="">목차</option>
-                                    <option value="">본문</option>
-                                </select>
-                            </div>
-                            <div className="col-10 d-flex justify-content-between">
-                                <div className="col-11"><input type="text" className="form-control shadow-none" placeholder="검색어를 입력하세요." lang="ko" /></div>
-                                <div className="col-1 text-center">
-                                    <button type="button" className="topsearch" onClick={SearchHandler}></button>
-                                </div>
-                            </div>
-                        </form>
-                    </div>
-                </div>
-                <div className="topcode d-flex justify-content-center w-100">
-                    <div className={showMore ? 'topcode_c justify-content-center' : 'topcode_n justify-content-center'}>
-                        <Row className="">
-                            <Col><a href="/standardCode/list/1010" title="공통코드" className={"topcodebnt"}>공통코드</a></Col>
-                            <Col><a href="/standardCode/list/101011" title="지반코드" className={"topcodebnt"}>지반코드</a></Col>
-                            <Col><a href="/standardCode/list/101014" title="구조코드" className={"topcodebnt"}>구조코드</a></Col>
-                            <Col><a href="/standardCode/list/101017" title="내진코드" className={"topcodebnt"}>내진코드</a></Col>
-                            <Col><a href="/standardCode/list/102021" title="가설코드" className={"topcodebnt"}>가설코드</a></Col>
-                            <Col><a href="/standardCode/list/102024" title="교량코드" className={"topcodebnt"}>교량코드</a></Col>
-                            <Col><a href="/standardCode/list/102027" title="터널코드" className={"topcodebnt"}>터널코드</a></Col>
-                            <Col><a href="/standardCode/list/102029" title="공동구코드" className={"topcodebnt"}>공동구코드</a></Col>
-                            <Col><a href="/standardCode/list/102031" title="설비코드" className={"topcodebnt"}>설비코드</a></Col>
-                            <Col><Link onClick={toggleShowMore} title="..." className={"topcodebnt"}>{showMore ? (<b> Ⅹ </b>) : (<b> · · · </b>)}</Link></Col>
+                    </Col>
+                    <Col xs={3}>
+                        <Row className="justify-content-end">
+                            <Col xs={"auto"} className="person mt-2" onClick={myHandler}></Col>
+                            <Col xs={"auto"} className="right_a mt-2" onClick={allMenuControl}>
+                                <button type="button" className="btn btnAllMenu" title="전체메뉴 닫힘">전체메뉴</button>
+                                <button type="button" className="btn mobile btnAllMenuM" title="전체메뉴 닫힘">전체메뉴</button>
+                            </Col>
                         </Row>
-                        {showMore && (
-                            <Row className="">
-                                <Col><a href="/standardCode/list/102034" title="조경코드" className="topcodebnt">조경코드</a></Col>
-                                <Col><a href="/standardCode/list/102041" title="건축코드" className="topcodebnt">건축코드</a></Col>
-                                <Col><a href="/standardCode/list/102044" title="도로코드" className="topcodebnt">도로코드</a></Col>
-                                <Col><a href="/standardCode/list/102047" title="철도코드" className="topcodebnt">철도코드</a></Col>
-                                <Col><a href="/standardCode/list/102051" title="하천코드" className="topcodebnt">하천코드</a></Col>
-                                <Col><a href="/standardCode/list/102054" title="댐코드" className="topcodebnt">댐코드</a></Col>
-                                <Col><a href="/standardCode/list/102057" title="상수도코드" className="topcodebnt">상수도코드</a></Col>
-                                <Col><a href="/standardCode/list/102061" title="하수도코드" className="topcodebnt">하수도코드</a></Col>
-                                <Col><a href="/standardCode/list/102067" title="농업기반코드" className="topcodebnt">농업기반코드</a></Col>
-                            </Row>
-                        )}
-                    </div>
-                </div>
+                    </Col>
+                </Row>
+                {/*<div className="search">*/}
+                {/*    <div className="search_input">*/}
+                {/*        <form className="row justify-content-between w-100 m-0">*/}
+                {/*            <div className="col-2">*/}
+                {/*                <select name="" className="form-select shadow-none">*/}
+                {/*                    <option value="">코드명</option>*/}
+                {/*                    <option value="">목차</option>*/}
+                {/*                    <option value="">본문</option>*/}
+                {/*                </select>*/}
+                {/*            </div>*/}
+                {/*            <div className="col-10 d-flex justify-content-between">*/}
+                {/*                <div className="col-11"><input type="text" className="form-control shadow-none" placeholder="검색어를 입력하세요." lang="ko" /></div>*/}
+                {/*                <div className="col-1 text-center">*/}
+                {/*                    <button type="button" className="topsearch" onClick={SearchHandler}></button>*/}
+                {/*                </div>*/}
+                {/*            </div>*/}
+                {/*        </form>*/}
+                {/*    </div>*/}
+                {/*</div>*/}
+                {/*<div className="topcode d-flex justify-content-center w-100">*/}
+                {/*    <div className={showMore ? 'topcode_c justify-content-center' : 'topcode_n justify-content-center'}>*/}
+                {/*        <Row className="">*/}
+                {/*            <Col><a href="/standardCode/list/1010" title="공통코드" className={"topcodebnt"}>공통코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/101011" title="지반코드" className={"topcodebnt"}>지반코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/101014" title="구조코드" className={"topcodebnt"}>구조코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/101017" title="내진코드" className={"topcodebnt"}>내진코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/102021" title="가설코드" className={"topcodebnt"}>가설코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/102024" title="교량코드" className={"topcodebnt"}>교량코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/102027" title="터널코드" className={"topcodebnt"}>터널코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/102029" title="공동구코드" className={"topcodebnt"}>공동구코드</a></Col>*/}
+                {/*            <Col><a href="/standardCode/list/102031" title="설비코드" className={"topcodebnt"}>설비코드</a></Col>*/}
+                {/*            <Col><Link onClick={toggleShowMore} title="..." className={"topcodebnt"}>{showMore ? (<b> Ⅹ </b>) : (<b> · · · </b>)}</Link></Col>*/}
+                {/*        </Row>*/}
+                {/*        {showMore && (*/}
+                {/*            <Row className="">*/}
+                {/*                <Col><a href="/standardCode/list/102034" title="조경코드" className="topcodebnt">조경코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102041" title="건축코드" className="topcodebnt">건축코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102044" title="도로코드" className="topcodebnt">도로코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102047" title="철도코드" className="topcodebnt">철도코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102051" title="하천코드" className="topcodebnt">하천코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102054" title="댐코드" className="topcodebnt">댐코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102057" title="상수도코드" className="topcodebnt">상수도코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102061" title="하수도코드" className="topcodebnt">하수도코드</a></Col>*/}
+                {/*                <Col><a href="/standardCode/list/102067" title="농업기반코드" className="topcodebnt">농업기반코드</a></Col>*/}
+                {/*            </Row>*/}
+                {/*        )}*/}
+                {/*    </div>*/}
+                {/*</div>*/}
 
                 {/*<h1 className="logo">*/}
                 {/*    <Link to={URL.MAIN} className="w">*/}

egovframe-template-simple-react-contribution/src/components/leftmenu/EgovLeftNavSupport.jsx

@@ -1,18 +1,131 @@
-import React from 'react';
+import React, {useState} from 'react';
 
-import { NavLink } from 'react-router-dom';
+import { Link } from 'react-router-dom';
 import URL from 'constants/url';
+import Button from 'react-bootstrap/Button'
+import Row from 'react-bootstrap/Row'
+import Col from 'react-bootstrap/Col'
+import { Box, Tabs, Tab, Typography } from '@mui/material';
+
+function a11yProps(index) {
+    return {
+        id: `wrapped-tab-${index}`,
+        'aria-controls': `wrapped-tabpanel-${index}`,
+    };
+}
+function TabPanel(props) {
+    const { children, value, index, ...other } = props;
+
+    return (
+        <div
+            role="tabpanel"
+            hidden={value !== index}
+            id={`wrapped-tabpanel-${index}`}
+            aria-labelledby={`wrapped-tab-${index}`}
+            {...other}
+        >
+            {value === index && (
+                <Box sx={{ p: 3 }}>
+                    <Typography>{children}</Typography>
+                </Box>
+            )}
+        </div>
+    );
+}
 
 function EgovLeftNavSupport() {
+    const [value, setValue] = useState(0);
+    const handleChange = (event, newValue) => {
+        setValue(newValue);
+    };
+
     return (
-        <div className="nav">
+        <div className="nav3">
             <div className="inner">
-                <h2>고객지원</h2>
-                <ul className="menu4">
-                    <li><NavLink to={URL.SUPPORT_DOWNLOAD} className={({ isActive }) => (isActive ? "cur" : "")}>자료실</NavLink></li>
-                    <li><NavLink to={URL.SUPPORT_QNA} className={({ isActive }) => (isActive ? "cur" : "")}>묻고답하기</NavLink></li>
-                    <li><NavLink to={URL.SUPPORT_APPLY} className={({ isActive }) => (isActive ? "cur" : "")}>서비스신청</NavLink></li>
-                </ul>
+                <div className="menu11">
+                    <Row className={"m-0 pb-4"}>
+                        <Col xs={"auto"} className={"person"}></Col>
+                        <Col className={"pt-2 ps-0"}>
+                            <Row>
+                                <Col><span className={"fs-5 fw-bold"}>관리자</span> 님</Col>
+                            </Row>
+                            <Row className={"f_11"}>
+                                <Col xs={"auto"}><Link to={URL.CHANGE_PW} className={"text-secondary"}>비밀번호변경</Link></Col>
+                                <Col xs={"auto"}><Link to="" className={"text-secondary"}>회원탈퇴</Link></Col>
+                            </Row>
+                        </Col>
+                    </Row>
+                    <Box sx={{ borderBottom: 2, borderColor: '#22498E' }}>
+                        <Tabs
+                            value={value}
+                            onChange={handleChange}
+                            indicatorColor="secondary"
+                            textColor="#fff"
+                        >
+                            <Tab value={0} {...a11yProps(0)} sx={{ fontWeight: 700, width: '50%', fontSize: 14 }} label="내 Q&A" wrapped />
+                            <Tab value={1} {...a11yProps(1)} sx={{ fontWeight: 700, width: '50%', fontSize: 14 }} label="다운로드" />
+                        </Tabs>
+                    </Box>
+                    <TabPanel value={value} index={0} className={"myPanel"}>
+                        {/*<Row>*/}
+                        {/*    <Col className={"text-center py-4 f_14"}>질문한 Q&A가 없습니다.</Col>*/}
+                        {/*</Row>*/}
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                    </TabPanel>
+                    <TabPanel value={value} index={1} className={"myPanel"}>
+                        {/*<Row>*/}
+                        {/*    <Col className={"text-center py-4 f_14"}>다운로드한 파일이 없습니다.</Col>*/}
+                        {/*</Row>*/}
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2024.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2024.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2024.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">매입형 합성기둥의 설계기준 관련</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                        <Row className={"f_11"}>
+                            <Col xs={8} className="text-truncate">일반 건축 콘크리트공사 시공 허용 오차 기준 질의</Col>
+                            <Col xs={4} className={"text-end p-0"}>2023.01.02</Col>
+                        </Row>
+                    </TabPanel>
+                </div>
+                <div className="mt-3"><Link to={URL.SUPPORT_QNA}><Button variant={"22498E"} className={"w-100"} >+ 새 질문 작성</Button></Link> </div>
             </div>
         </div>
     );

egovframe-template-simple-react-contribution/src/constants/url.js

@@ -35,7 +35,7 @@ const URL = {
     SUPPORT                     : "/support", // 고객지원
     SUPPORT_QNA                 : "/support/qna", // 게시판/QNA 소개
     SUPPORT_LIST                : "/support/list/:BbsCode", // 게시판/리스트
-    SUPPORT_DETAIL              : "/support/detail/:BbsCode", // 게시판/상세보기
+    SUPPORT_DETAIL              : "/support/detail/:bbsContSeq", // 게시판/상세보기
     SUPPORT_CREATE              : "/support/create/:BbsCode", // 게시판/글쓰기
     SUPPORT_LIST_NOCODE         : "/support/list",
     SUPPORT_DETAIL_NOCODE       : "/support/detail", // 게시판/상세보기

egovframe-template-simple-react-contribution/src/css/Custom/customMain.css

@@ -12,49 +12,55 @@
     background-color: #212121;
 }
 
-.code_list .head >span:nth-child(1),.code_list .result .List_Codes >div:nth-child(1){
-    text-align: left;
-    width: 12%;
-}
-.code_list .head >span:nth-child(2),.code_list .result .List_Codes >div:nth-child(2){
-    text-align: left;
-    width: 15%;
-}
-.code_list .head >span:nth-child(3),.code_list .result .List_Codes >div:nth-child(3){
-    text-align: left;
-    width: 10%;
-}
-.code_list .head >span:nth-child(4),.code_list .result .List_Codes >div:nth-child(4) {
-    width: 34%;
-    text-align: left;
-}
-.code_list .head >span:nth-child(5),.code_list .result .List_Codes >div:nth-child(5){
-    width: 15%;
-}
-.code_list .head >span:nth-child(6),.code_list .result .List_Codes >div:nth-child(6){
-    width: 15%;
-}
-.code_list .head > span:nth-child(7),.code_list .result .List_Codes >div:nth-child(7){
-    width: 7%;
-}
-.code_list .result .List_Codes >div:nth-child(1),
-.code_list .result .List_Codes >div:nth-child(2),
-.code_list .result .List_Codes >div:nth-child(3),
-.code_list .result .List_Codes >div:nth-child(4),
-.code_list .result .List_Codes >div:nth-child(5),
-.code_list .result .List_Codes >div:nth-child(6),
-.code_list .result .List_Codes >div:nth-child(7){
-    font-size: 14px;
-}
+/*.code_list .head >span:nth-child(1),.code_list .result .List_Codes >div:nth-child(1){*/
+/*    text-align: left;*/
+/*    width: 12%;*/
+/*}*/
+/*.code_list .head >span:nth-child(2),.code_list .result .List_Codes >div:nth-child(2){*/
+/*    text-align: left;*/
+/*    width: 15%;*/
+/*}*/
+/*.code_list .head >span:nth-child(3),.code_list .result .List_Codes >div:nth-child(3){*/
+/*    text-align: left;*/
+/*    width: 10%;*/
+/*}*/
+/*.code_list .head >span:nth-child(4),.code_list .result .List_Codes >div:nth-child(4) {*/
+/*    width: 34%;*/
+/*    text-align: left;*/
+/*}*/
+/*.code_list .head >span:nth-child(5),.code_list .result .List_Codes >div:nth-child(5){*/
+/*    width: 15%;*/
+/*}*/
+/*.code_list .head >span:nth-child(6),.code_list .result .List_Codes >div:nth-child(6){*/
+/*    width: 15%;*/
+/*}*/
+/*.code_list .head > span:nth-child(7),.code_list .result .List_Codes >div:nth-child(7){*/
+/*    width: 7%;*/
+/*}*/
+/*.code_list .result .List_Codes >div:nth-child(1),*/
+/*.code_list .result .List_Codes >div:nth-child(2),*/
+/*.code_list .result .List_Codes >div:nth-child(3),*/
+/*.code_list .result .List_Codes >div:nth-child(4),*/
+/*.code_list .result .List_Codes >div:nth-child(5),*/
+/*.code_list .result .List_Codes >div:nth-child(6),*/
+/*.code_list .result .List_Codes >div:nth-child(7){*/
+/*    font-size: 14px;*/
+/*}*/
 
-.standard_code_modal .head >span:nth-child(1),.standard_code_modal .result .list_item >div:nth-child(1){width: 12%;}
-.standard_code_modal .head >span:nth-child(2),.standard_code_modal .result .list_item >div:nth-child(2){width: 15%;}
-.standard_code_modal .head >span:nth-child(3),.standard_code_modal .result .list_item >div:nth-child(3){width: 10%;}
+/*.standard_code_modal .head >span:nth-child(1),.standard_code_modal .result .list_item >div:nth-child(1){width: 12%;}*/
+/*.standard_code_modal .head >span:nth-child(2),.standard_code_modal .result .list_item >div:nth-child(2){width: 15%;}*/
+/*.standard_code_modal .head >span:nth-child(3),.standard_code_modal .result .list_item >div:nth-child(3){width: 10%;}*/
 
 .standard_code_result{
-    max-height: 520px;
-    overflow-y: auto;
+    max-height: calc(100vh - 238px);
+    overflow-y: scroll;
 }
+
+.standard_code_result_detail{
+    max-height: calc(100vh - 577px);
+    overflow-y: scroll;
+}
+
 .download_list{
     max-height: 550px;
     overflow-y: auto;
@@ -67,7 +73,7 @@
     max-width: 100%;
 }
 .listTableDiv{
-    padding: 0 !important;
+    padding: 0 10px !important;
 }
 .vieweratag{
     color: black;
@@ -83,8 +89,14 @@
     color: #fff;
 }
 
-
-
+/* 메인 슬라이더 도트 위치 조정 */
+.slick-dots {
+    position: absolute;
+    bottom: 8%;
+    left: 50%;
+    transform: translate(-50%, 50%);
+    z-index: 10;
+}
 
 
 

egovframe-template-simple-react-contribution/src/css/base.css

@@ -64,8 +64,10 @@ button {cursor: pointer;}
 .w_full {width: 100%;}
 .w_half {width: 50%;}
 .w_quarter {width: 25%;}
+.w_20 {width: 20px;}
 .w_50 {width: 50px;}
 .w_70 {width: 70px;}
+.w_75 {width: 75px;}
 .w_80 {width: 80px;}
 .w_100 {width: 100px;}
 .w_120 {width: 120px;}
@@ -82,6 +84,8 @@ button {cursor: pointer;}
 .mw_400 {max-width: 400px;}
 .mw_450 {max-width: 450px;}
 
+.h_10 {height: 10px;}
+.h_20 {height: 20px;}
 .h_25 {height: 25px;}
 .h_30 {height: 30px;}
 .h_40 {height: 40px;}
@@ -97,6 +101,7 @@ button {cursor: pointer;}
 .f_15 {font-size: 15px;}
 .f_16 {font-size: 16px;}
 .f_17 {font-size: 17px;}
+.f_30 {font-size: 30px;}
 
 
 /* 여백 */
@@ -108,10 +113,12 @@ button {cursor: pointer;}
 
 .bg-fa {background: #FAFAFA !important;}
 .bg-224 {background: #22498E !important;}
+.bg-f8f {background: #F8FAFC !important;}
 
 .text-4c6 {color: #4C6C84 !important;}
+.text-222 {color: #222222 !important;}
 .text-224 {color: #22498E !important;}
 
 .clickable{cursor: pointer;}
-
+.cursor{cursor: pointer;}
 /*.MuiTab-root.Mui-selected { color: #22498E; }*/

egovframe-template-simple-react-contribution/src/css/component.css

@@ -66,6 +66,10 @@
 .board_list .result .list_item1 {display: table; width: 100%; table-layout: fixed; margin-left: 0px;}
 .board_list .result .list_item1 > div {display: table-cell; padding: 5px 0; border-bottom: 1px solid #dde2e5; color: #666; font-size: 14px; text-align: center; vertical-align: middle; }
 
+/* 건설기준 리스트 */
+.board_list .result .list_item2 {display: table; width: 100%; table-layout: fixed; margin-left: 0px;}
+.board_list .result .list_item2 > div {display: table-cell; padding-top: 5px; border-bottom: 1px solid #dde2e5; color: #666; font-size: 14px; text-align: center; vertical-align: middle; }
+
 .board_bot {margin-top: 40px;}
 
 .paging {text-align: center;}
@@ -255,9 +259,10 @@ 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: 5px 10px; margin-right: 10px; cursor: pointer; border: 1px solid #ccc; border-radius: 5px; transition: background-color 0.3s;}
+.tab {width: 100px; padding: 5px 0; cursor: pointer; border: 1px solid #ccc; border-radius: 10px; transition: background-color 0.3s;}
 .tab:hover {background-color: #f0f0f0;}
-.active {background-color: #007bff; color: #fff;}
+.active {background-color: #22498E; color: #fff;}
+.nav-item a {color: #6C6C6C;}
 
 .f_input {height: 46px; padding: 0 20px; border: 0; border-radius: 5px; color: #222; font-size: 16px; background: #f7f7f7;}
 .f_input1 {width:200px; height: 32px; padding: 0 30px 0 0; border: 0; border-radius: 5px; color: #222; font-size: 16px; background: #f7f7f7 url(css/images/bg_btn_calendar.png) no-repeat;background-position: right center; background-size: 32px 32px; cursor: pointer;}      /* made by lim f_input1*/

egovframe-template-simple-react-contribution/src/css/layout.css

@@ -4,7 +4,7 @@ body {min-width: 1400px;}
 
 /*.header {position: relative;}*/
 .header::after {content: ""; display: block; left: 0; bottom: 0; width: 100%; height: 1px; background: #dedede;}
-.header > .inner {max-width: 1400px; height: 210px; margin: 0 auto; }  /* position: relative; padding: 0 50px; */
+.header > .inner {max-width: 1400px; height: 110px; margin: 0 auto; }  /* position: relative; padding: 0 50px; */
 .header h1 {display: inline-block; margin-top: 32px;}
 .header h1 a,
 .header h1 img {display: block;}
@@ -28,8 +28,8 @@ body {min-width: 1400px;}
 .header .right_a .btn.active {background: url(css/images/ico_allmenu_close.png) no-repeat center; background-size: 22px 18px;}
 .header .right_a .btn.mobile {display: none;}
 
-.header .search {height:96px; padding:24px 0px 10px; margin: 0 auto; }
-.header .search .search_input {max-width: 734px; width: calc(100% - 40px); height:62px; margin: 0 auto; border: 2px solid #004994; border-radius: 20px; padding: 10px}
+.header .search {height:66px; padding:0; margin: 0 auto; }
+.header .search .search_input {max-width: 734px; width: calc(100% - 40px); height:52px; margin: 0 auto; border: 2px solid #004994; border-radius: 20px; padding: 5px}
 .header .search .search_input select {border: none;}
 .header .search .search_input input {ime-mode:active; border: none;}
 .header .search .topsearch {width: 40px; height: 40px; background: url(css/images/ico_search_b.png) no-repeat center center; background-size: 22px 22px; filter: brightness(1) sepia(1) saturate(3) hue-rotate(175deg);}
@@ -53,11 +53,11 @@ body {min-width: 1400px;}
     box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
 }
 
-.header .topcode .topcodebnt:hover{
-    background-color: #8F8F8F;
-    color: #fff;
-    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.4);
-}
+/*.header .topcode .topcodebnt:hover{*/
+/*    background-color: #8F8F8F;*/
+/*    color: #fff;*/
+/*    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.4);*/
+/*}*/
 
     /* All menu */
 .all_menu {transition: transform .2s ease-in-out, opacity .2s ease-in-out; transform-origin: top; z-index: 10; padding: 50px 20px;}
@@ -83,7 +83,7 @@ body {min-width: 1400px;}
 .c_wrap .layout {display: table; width: 100%; table-layout: fixed; padding-bottom: 20px;}       /* added by lim   padding-bottom: 20px; */
 
 /* 관리자 (왼쪽메뉴) */
-.c_wrap .layout .nav:not(.tabs) {display: table-cell; width: 220px; vertical-align: top;}      /* changed by lim        width: 260px;  */
+.c_wrap .layout .nav:not(.tabs) {display: table-cell; width: 220px; vertical-align: top; padding-right: 30px;}      /* changed by lim        width: 260px;  */
 /*.c_wrap .layout .nav .inner {border: 1px solid #dde2e5; border-radius: 10px;}*/
 .nav_title{padding: 35px 30px 26px 20px;}                               /* changed by lim       border-bottom: 4px solid #dde2e5;  */
 .c_wrap .layout .nav h2 {color: #222; font-size: 24px; font-weight: 700;}
@@ -95,7 +95,7 @@ body {min-width: 1400px;}
 .c_wrap .layout .nav ul li a.cur {color: #222; font-weight: 700;}
 
 /* (구)건설기준 (왼쪽메뉴) */
-.c_wrap .layout .nav2:not(.tabs) {display: table-cell; width: 350px; vertical-align: top;}
+.c_wrap .layout .nav2:not(.tabs) {display: table-cell; width: 350px; vertical-align: top; padding-right: 30px;}
 /*.c_wrap .layout .nav2 h2 {color: #222; font-size: 22px; font-weight: 700;}*/
 .c_wrap .layout .nav2 button {font-size: 15px;}
 .c_wrap .layout .nav2 .accordion-button {background: #FAFAFA;}
@@ -105,10 +105,10 @@ body {min-width: 1400px;}
 .c_wrap .layout .contents .border-secondary {border : 1px solid #6c757d;}
 .c_wrap .layout .contents .border-secondary-no_top {border-left: 1px solid #6c757d; border-right: 1px solid #6c757d; border-bottom: 1px solid #6c757d; height: 500px; overflow-y: scroll;}
 
-.c_wrap .layout .contents {display: table-cell; width: auto; vertical-align: top; padding-left: 30px;}
+.c_wrap .layout .contents {display: table-cell; width: auto; vertical-align: top; }
 
 /* 센터소개 (왼쪽메뉴) */
-.c_wrap .layout .nav1:not(.tabs) {display: table-cell; width: 220px; vertical-align: top;}
+.c_wrap .layout .nav1:not(.tabs) {display: table-cell; width: 220px; vertical-align: top; padding-right: 30px;}
 .c_wrap .layout .nav1 h2 {color: #222; font-size: 24px; font-weight: 700;}
 .c_wrap .layout .nav1 .menu10 {mnargin: 0; border: 1px solid #dde2e5;}
 .c_wrap .layout .nav1 .menu10 li + li {border-top: 1px solid #dde2e5; }
@@ -116,7 +116,13 @@ body {min-width: 1400px;}
 .c_wrap .layout .nav1 ul li a:hover::after {content: ""; display: block; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 9px; height: 15px; background: url(css/images/ico_arrow_r_gray_9x15.png) no-repeat; }
 .c_wrap .layout .nav1 ul li a.cur {color: #fff; font-weight: 700; background-color: #004994; }
 
-    /* location */
+/* 내정보 (왼쪽메뉴) */
+.c_wrap .layout .nav3:not(.tabs) {display: table-cell; width: 300px; vertical-align: top; padding-right: 30px;}
+.c_wrap .layout .nav3 .menu11 {height : 300px; margin: 0; border: 1px solid #AFAFAF; border-radius: 10px;}
+.c_wrap .layout .nav3 .menu11 .person::before {content: ""; display: inline-block; width: 50px; height: 50px; background: url(css/images/ico_user.png) no-repeat center bottom; background-size: 30px 30px; }
+.c_wrap .layout .nav3 .menu11 .myPanel {height: 145px; overflow-x: hidden; overflow-y: auto;}
+
+/* location */
 .location {height: 30px; padding-top: 23px; text-align: right;}     /* chagned by lim   height: 70px; padding-top: 43px; */
 .location ul, .location ul li {display: inline-block; vertical-align: top;}
 .location ul li {position: relative; color: #666; font-size: 14px;}

egovframe-template-simple-react-contribution/src/css/page.css

@@ -49,20 +49,31 @@
     /* 메인 */
     /*.P_MAIN {position: relative; background: #f5f5f5;}*/
     /*.P_MAIN::before {content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 360px; background: #fff;}*/
-    .P_MAIN .c_wrap .topbox {width: 100%; height:390px; background: #F8F8F8; margin: 0 auto;}
-    .P_MAIN .c_wrap .topbox .topbox_1 {width: 360px; height: 340px; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 0 4px 5px #ccc; background: #fff; padding: 30px;}
-    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_11{font-size: 22px; font-weight: 700; padding-bottom: 15px;}
-    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_12{font-size: 14px; }
-    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_13{font-size: 12px; font-weight: 700; color: #22498E; padding-bottom: 5px;}
-    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_14{font-size: 17px; font-weight: 600; line-height: 42px; white-space: nowrap;}
-    .P_MAIN .c_wrap .topbox .topbox_2 {width: 630px; height: 340px; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 0 4px 5px #ccc; background: #fff; margin: 0 25px; padding: 30px;}
-    .P_MAIN .c_wrap .topbox .topbox_2 .topbox_11{font-size: 22px; font-weight: 700; padding-bottom: 10px;}
-    .P_MAIN .c_wrap .topbox .topbox_2 .topbox_12{font-size: 19px; padding-bottom: 70px;}
-    .P_MAIN .c_wrap .topbox .topbox_2 .topbox_13 {width: 80px; height: 80px; border-radius: 50%; background: #E2E9F6; display: flex; justify-content: center; align-items: center; margin-left: 1.2rem;}
-    .P_MAIN .c_wrap .topbox .topbox_2 .topbox_14{font-size: 16px; font-weight: 600; text-align: center; line-height: 40px; color: #222;}
-    .P_MAIN .c_wrap .topbox .topbox_2 .topbox_15{text-align: center; line-height: 40px;}
-    .P_MAIN .c_wrap .topbox .topbox_3 {width: 360px; height: 340px; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 0 4px 5px #ccc; background: #fff; padding: 30px;}
-    .P_MAIN .c_wrap .topbox .topbox_3 .topbox_11{font-size: 22px; font-weight: 700; padding-bottom: 20px;}
+    .P_MAIN .c_wrap .topbox {width: 100%; height:370px; background: #F8F8F8; margin: 0 auto;}
+    .P_MAIN .c_wrap .topbox .topbox_1 {width: 1400px; height: 340px; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 0 4px 5px #ccc; background: #fff; padding: 15px;}
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_11{width: 1010px; padding: 0;}
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_12{background: #004994; margin-left: 0; margin-right: -3px; color: #fff; line-height: 30px;}
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_13{font-size: 14px; font-weight: 700; }
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_14 {font-size: 12px; font-weight: 600; text-align: right; }
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_14 span{border-radius: 20px; border: 1px solid #fff; padding: 3px 8px;}
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_15{background: #E0E0E0; margin-left: -21px; margin-right: 12px; line-height: 30px;}
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_16 {font-size: 12px; font-weight: 600; text-align: right; }
+    .P_MAIN .c_wrap .topbox .topbox_1 .topbox_16 span{border-radius: 20px; border: 1px solid #4C6C84; padding: 3px 8px;}
+    .P_MAIN .c_wrap .topbox .topbox_2 { height: 45px; border: 1px solid #EAEAEA; border-radius: 10px; padding: 10px; color: #222;}
+    .P_MAIN .c_wrap .topbox .topbox_2:hover {border: 1px solid #22498E; color: #22498E;}
+    .P_MAIN .c_wrap .topbox .topbox_2 img {filter: none; transition: filter 0.3s ease;}
+    .P_MAIN .c_wrap .topbox .topbox_2:hover img {filter: invert(39%) sepia(86%) saturate(2000%) hue-rotate(180deg) brightness(80%) contrast(66%);}
+    .P_MAIN .c_wrap .topbox .topbox_4 {width: 75px; height: 75px; border: 1px solid #EAEAEA; border-radius: 20px; padding: 10px 0; margin-left: 0;}
+    .P_MAIN .c_wrap .topbox .topbox_5 {width: 95px; font-size: 12px; padding: 0px; margin-left: -10px; text-align: center;}
+    .P_MAIN .c_wrap .topbox .topbox_3 {width: 350px; height: 310px; border: 1px solid #dde2e5; background: #fff; padding: 15px 30px;}
+    .P_MAIN .c_wrap .topbox .topbox_3 .topbox_31{font-size: 22px; font-weight: 700; padding-bottom: 20px;}
+
+    /*.P_MAIN .c_wrap .topbox .topbox_2 {width: 630px; height: 340px; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 0 4px 5px #ccc; background: #fff; margin: 0 25px; padding: 30px;}*/
+    /*.P_MAIN .c_wrap .topbox .topbox_2 .topbox_11{font-size: 22px; font-weight: 700; padding-bottom: 10px;}*/
+    /*.P_MAIN .c_wrap .topbox .topbox_2 .topbox_12{font-size: 19px; padding-bottom: 70px;}*/
+    /*.P_MAIN .c_wrap .topbox .topbox_2 .topbox_13 {width: 80px; height: 80px; border-radius: 50%; background: #E2E9F6; display: flex; justify-content: center; align-items: center; margin-left: 1.2rem;}*/
+    /*.P_MAIN .c_wrap .topbox .topbox_2 .topbox_14{font-size: 16px; font-weight: 600; text-align: center; line-height: 40px; color: #222;}*/
+    /*.P_MAIN .c_wrap .topbox .topbox_2 .topbox_15{text-align: center; line-height: 40px;}*/
     .P_MAIN .c_wrap .login_search {border: 1px solid #6F6F6F; border-radius: 10px; overflow: hidden;}
     .P_MAIN .c_wrap .login_border {border: 1px solid #6F6F6F; margin-top: 5px;}
     .P_MAIN .c_wrap .login_search_word {max-height: 125px; padding: 5px; overflow-x: auto; overflow-y: auto;}
@@ -70,29 +81,37 @@
     .P_MAIN .c_wrap .menubox .menubox_n {padding: 0 50px;}
     .P_MAIN .c_wrap .menubox .menu_img {width: 100px; height: 100px; border-radius: 50%; background: #E2E9F6; display: flex; justify-content: center; align-items: center;}
     .P_MAIN .c_wrap .menubox .menu_text {font-size: 16px; font-weight: 700; padding-top: 10px; justify-content: center; color: #222;}
-    .P_MAIN .c_wrap .qnabox {width: 100%; height:340px; background: #F8FAFC;}
-    .P_MAIN .c_wrap .qnabox .qnabox_1 {width: 1400px; height: 80px; margin:0 auto; padding: 0 10px; font-size: 35px; font-weight: 700; color: #004994;}
-    .P_MAIN .c_wrap .qnabox .qnabox_11 {width: 50%; font-size: 35px; font-weight: 700; color: #004994;}
-    .P_MAIN .c_wrap .qnabox .qnabox_12 {width: 50%; font-size: 20px; font-weight: 500; color: #6C6C6C;}
+    .P_MAIN .c_wrap .bbsbox {width: 100%; height:300px; margin: 0 auto; padding-top: 15px;}     /* border-bottom: 1px solid #E6E6E6;  */
+    .P_MAIN .c_wrap .bbsbox .bbsbox_1 {width: 500px; }
+    .P_MAIN .c_wrap .bbsbox .bbsbox_3 {width: 500px; margin-left: 10px;}
+    .P_MAIN .c_wrap .bbsbox .bbsbox_1 .MuiBox-root,
+    .P_MAIN .c_wrap .bbsbox .bbsbox_3 .MuiBox-root {padding-top: 0px; }
+    .P_MAIN .c_wrap .bbsbox .bbsbox_1 .bbsbox_11,
+    .P_MAIN .c_wrap .bbsbox .bbsbox_3 .bbsbox_11 {border-bottom: 1px solid #D3D3D3; padding: 14px 0;}
+    .P_MAIN .c_wrap .bbsbox .bbsbox_1 .bbsbox_11 .bbsbox_11_title,
+    .P_MAIN .c_wrap .bbsbox .bbsbox_3 .bbsbox_11 .bbsbox_11_title {font-size: 15px; color: #222;}
+    .P_MAIN .c_wrap .bbsbox .bbsbox_2 {width: 370px; margin-left: 20px;}
+    .P_MAIN .c_wrap .bbsbox .bbsbox_2 img {width: 370px; height: 270px; border-radius: 20px; }
+    .P_MAIN .c_wrap .qna_count {width: 100%; margin: 0 auto; padding-bottom: 10px; border-bottom: 1px solid #eaeaea; }
+    .P_MAIN .c_wrap .qnabox {max-width: 1010px; padding: 0; height:215px; }
+    .P_MAIN .c_wrap .qnabox .qnabox_1 {width: 1010px; max-height: 45px; margin:0 auto; padding: 0 10px; font-size: 35px; font-weight: 700; color: #004994;}
+    .P_MAIN .c_wrap .qnabox .qnabox_11 {width: 50%; font-size: 30px; font-weight: 700; color: #004994;}
+    .P_MAIN .c_wrap .qnabox .qnabox_12 {width: 50%; font-size: 16px; font-weight: 500; color: #6C6C6C;}
     .P_MAIN .c_wrap .qnabox .qnabox_12 .rounded_circle_qna {width: 32px; height: 32px; border-radius: 50%; background: #FFF; box-shadow: 0 4px 5px #ccc; align-items: center; text-align: center; display: flex; }
-    .P_MAIN .c_wrap .qnabox .qnabox_2 {width: 1400px; margin:0 auto; }
-    .P_MAIN .c_wrap .qnabox .qnabox_n {width: 330px; height: 200px; border: 1px solid #dde2e5; border-radius: 10px; box-shadow: 0 4px 5px #ccc; background: #fff; margin: 20px 10px; padding: 30px;}
+    .P_MAIN .c_wrap .qnabox .qnabox_2 {width: 1010px; margin:0 auto; }
+    .P_MAIN .c_wrap .qnabox .qnabox_n {width: 25%; height: 158px; border: 1px solid #dde2e5; border-radius: 10px; box-shadow: 0 4px 5px #ccc; background: #fff; margin: 10px; padding: 15px 30px;}
     .P_MAIN .c_wrap .qnabox .qnabox_n .qnabox_n_file {background: #EBF1FF; border-radius: 10px; color: #22498E; font-size: 12px;}
-    .P_MAIN .c_wrap .qnabox .qnabox_n .qnabox_n_title {height: 100px; font-size: 18px; overflow: hidden; text-overflow: ellipsis; font-weight: 600;}
+    .P_MAIN .c_wrap .qnabox .qnabox_n .qnabox_n_title {height: 90px; font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
+    .P_MAIN .c_wrap .qnabox .qnabox_n .qnabox_n_title a {display: block; height: 88px;}
     .P_MAIN .c_wrap .qnabox .qnabox_n .qnabox_n_date {font-size: 13px; }
-    .P_MAIN .c_wrap .numbox {width: 100%; height:100px; background: #4C6C84;}
-    .P_MAIN .c_wrap .numbox .numbox_n {width: 300px; color: #fff; text-align: center;}
-    .P_MAIN .c_wrap .numbox .num_text {font-size: 16px; font-weight: 600;}
-    .P_MAIN .c_wrap .numbox .num_count {font-size: 25px; font-weight: 700;}
-    .P_MAIN .c_wrap .numbox .num_count span.unit {font-size: 20px;}
-    .P_MAIN .c_wrap .bbsbox {width: 100%; height:350px; border-bottom: 1px solid #E6E6E6; margin: 0 auto; padding-top: 25px;}
-    .P_MAIN .c_wrap .bbsbox .bbsbox_1 {width: 980px; }
-    .P_MAIN .c_wrap .bbsbox .bbsbox_1 .bbsbox_11 {border-bottom: 1px solid #D3D3D3; padding: 14px 0;}
-    .P_MAIN .c_wrap .bbsbox .bbsbox_1 .bbsbox_11 .bbsbox_11_title {font-size: 15px; color: #222;}
-    .P_MAIN .c_wrap .bbsbox .bbsbox_2 {width: 370px; margin-left: 50px;}
-    .P_MAIN .c_wrap .bbsbox .bbsbox_2 img {max-width: 370px; border-radius: 20px; }
+    .P_MAIN .c_wrap .numbox {max-width: 370px; height: 215px; border-radius: 20px; background: #EBF1F9; margin-left: 20px; padding: 20px 30px; }
+    .P_MAIN .c_wrap .numbox .numbox_n {width: auto; background: #fff; border-radius: 10px; margin-bottom: 10px;}
+    .P_MAIN .c_wrap .numbox .numbox_n:nth-child(4) {margin-bottom: 0px; }
+    .P_MAIN .c_wrap .numbox .num_text {font-size: 12px; color: #fff; font-weight: 600; background: #3378C1; border-radius: 10px; max-width: 100px; line-height: 35px; text-align: center; }
+    .P_MAIN .c_wrap .numbox .num_count {font-size: 14px; font-weight: 700; color: #3378C1; line-height: 35px; text-align: right;}
+    .P_MAIN .c_wrap .numbox .num_count span.unit {font-size: 11px;}
 
-    .P_MAIN .c_wrap .bannerbox {width: 1400px; height:80px; margin: 0 auto;}
+    .P_MAIN .c_wrap .bannerbox {width: 1400px; height:80px; margin: 0 auto; }
     /*.P_MAIN .c_wrap .bannerbox .slick-list {width: 1400px; margin: 0 auto;}*/
     .P_MAIN .c_wrap .bannerbox .banner_slide {max-width: 210px; max-height: 60px; border: 1px solid #dde2e5; border-radius: 15px; text-align: center; padding: 10px; margin: 10px;}
     .P_MAIN .c_wrap .bannerbox .slick-slide img {max-width: 180px; max-height: 60px;}
@@ -146,73 +165,9 @@
     /*.P_MAIN .banner_bot > div.b4 > div {background: url(css/images/ico_bn04.png) no-repeat center 60px;}*/
 
 
-    /* 오늘의 행사 */
-    .BRD001 .head > span:nth-child(1) {width: 150px;}
-    .BRD001 .head > span:nth-child(3) {width: 150px;}
-    .BRD001 .result .list_item > div:nth-child(1) {width: 150px;}
-    .BRD001 .result .list_item > div:nth-child(3) {width: 150px;}
-
-    /* 공지사항 */
-    .BRD002 .head > span:nth-child(1) {width: 60px;}
-    .BRD002 .head > span:nth-child(3) {width: 100px;}
-    .BRD002 .head > span:nth-child(4) {width: 120px;}
-    .BRD002 .head > span:nth-child(5) {width: 100px;}
-    .BRD002 .result .list_item > div:nth-child(1) {width: 60px;}
-    .BRD002 .result .list_item > div:nth-child(2) {text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
-    .BRD002 .result .list_item > div:nth-child(3) {width: 100px;}
-    .BRD002 .result .list_item > div:nth-child(4) {width: 120px;}
-    .BRD002 .result .list_item > div:nth-child(5) {width: 100px;}
-
-    /* 금주의 행사 */
-    .BRD003 .head > span:nth-child(1) {width: 200px;}
-    .BRD003 .head > span:nth-child(2) {width: 150px;}
-    .BRD003 .head > span:nth-child(3) {width: 470px;}
-    .BRD003 .head > span:nth-child(4) {width: 150px;}
-    .BRD003 .result .list_item > div:nth-child(1) {width: 200px;}
-    .BRD003 .result .list_item > div:nth-child(2) {width: auto;}
-    .BRD003 .result .list_item > div:nth-child(2) > a {display: table; width: 100%; color: #666;}
-    .BRD003 .result .list_item > div:nth-child(2) > a:hover {text-decoration: underline;}
-    .BRD003 .result .list_item > div:nth-child(2) > a > * {display: table-cell;}
-    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(1) {width: 150px;}
-    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(2) {width: auto; text-align: center;}
-    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(3) {width: 150px;}
-
-    /* 게시판템플릿관리 */
-    .BRD004 .head > span:nth-child(1) {width: 70px;}
-    .BRD004 .head > span:nth-child(2) {width: 150px;}
-    .BRD004 .head > span:nth-child(3) {width: 120px;}
-    .BRD004 .head > span:nth-child(5) {width: 100px;}
-    .BRD004 .head > span:nth-child(6) {width: 140px;}
-    .BRD004 .result .list_item > div:nth-child(1) {width: 70px;}
-    .BRD004 .result .list_item > div:nth-child(2) {width: 150px;}
-    .BRD004 .result .list_item > div:nth-child(3) {width: 120px;}
-    .BRD004 .result .list_item > div:nth-child(5) {width: 100px;}
-    .BRD004 .result .list_item > div:nth-child(6) {width: 140px;}
-
-    /* 사이트관리 미리보기 게시판 */
-    .BRD005 .head > span:nth-child(1) {width: 60px;}
-    .BRD005 .head > span:nth-child(3) {width: 100px;}
-    .BRD005 .head > span:nth-child(4) {width: 120px;}
-    .BRD005 .head > span:nth-child(5) {width: 100px;}
-    .BRD005 .result .list_item > div:nth-child(1) {width: 60px;}
-    .BRD005 .result .list_item > div:nth-child(3) {width: 100px;}
-    .BRD005 .result .list_item > div:nth-child(4) {width: 120px;}
-    .BRD005 .result .list_item > div:nth-child(5) {width: 100px;}
-
-    /* 게시판 관리 */
-    .BRD006 .head > span:nth-child(1) {width: 160px; text-align: left;}
-    .BRD006 .head > span:nth-child(3) {width: 160px;}
-    .BRD006 .head > span:nth-child(4) {width: 70px;}
-    .BRD006 .head > span:nth-child(5) {width: 70px;}
-    .BRD006 .head > span:nth-child(6) {width: 120px;}
-    .BRD006 .result .list_item > div:nth-child(1) {width: 160px; text-align: left;}
-    .BRD006 .result .list_item > div:nth-child(3) {width: 160px;}
-    .BRD006 .result .list_item > div:nth-child(4) {width: 70px;}
-    .BRD006 .result .list_item > div:nth-child(5) {width: 70px;}
-    .BRD006 .result .list_item > div:nth-child(6) {width: 120px;}
 
     /* 사이트관리 > 사용자관리 > 사용자목록 */
-    .userList .head > span:nth-child(1) {width: 60px;}
+    .userList .head > span:nth-child(1) {width: 20px;}
     .userList .head > span:nth-child(2) {width: 100px;}
     .userList .head > span:nth-child(3) {width: 100px;}
     .userList .head > span:nth-child(4) {width: 120px;}
@@ -317,20 +272,85 @@
     .PDS_LIST .board_list {margin-top: 50px;}
 
 
+    /* 오늘의 행사 */
+    .BRD001 .head > span:nth-child(1) {width: 150px;}
+    .BRD001 .head > span:nth-child(3) {width: 150px;}
+    .BRD001 .result .list_item > div:nth-child(1) {width: 150px;}
+    .BRD001 .result .list_item > div:nth-child(3) {width: 150px;}
+
+    /* 공지사항 */
+    .BRD002 .head > span:nth-child(1) {width: 60px;}
+    .BRD002 .head > span:nth-child(3) {width: 100px;}
+    .BRD002 .head > span:nth-child(4) {width: 120px;}
+    .BRD002 .head > span:nth-child(5) {width: 100px;}
+    .BRD002 .result .list_item > div:nth-child(1) {width: 60px;}
+    .BRD002 .result .list_item > div:nth-child(2) {text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
+    .BRD002 .result .list_item > div:nth-child(3) {width: 100px;}
+    .BRD002 .result .list_item > div:nth-child(4) {width: 120px;}
+    .BRD002 .result .list_item > div:nth-child(5) {width: 100px;}
+
+    /* 금주의 행사 */
+    .BRD003 .head > span:nth-child(1) {width: 200px;}
+    .BRD003 .head > span:nth-child(2) {width: 150px;}
+    .BRD003 .head > span:nth-child(3) {width: 470px;}
+    .BRD003 .head > span:nth-child(4) {width: 150px;}
+    .BRD003 .result .list_item > div:nth-child(1) {width: 200px;}
+    .BRD003 .result .list_item > div:nth-child(2) {width: auto;}
+    .BRD003 .result .list_item > div:nth-child(2) > a {display: table; width: 100%; color: #666;}
+    .BRD003 .result .list_item > div:nth-child(2) > a:hover {text-decoration: underline;}
+    .BRD003 .result .list_item > div:nth-child(2) > a > * {display: table-cell;}
+    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(1) {width: 150px;}
+    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(2) {width: auto; text-align: center;}
+    .BRD003 .result .list_item > div:nth-child(2) > a > span:nth-child(3) {width: 150px;}
+
+    /* 게시판템플릿관리 */
+    .BRD004 .head > span:nth-child(1) {width: 70px;}
+    .BRD004 .head > span:nth-child(2) {width: 150px;}
+    .BRD004 .head > span:nth-child(3) {width: 120px;}
+    .BRD004 .head > span:nth-child(5) {width: 100px;}
+    .BRD004 .head > span:nth-child(6) {width: 140px;}
+    .BRD004 .result .list_item > div:nth-child(1) {width: 70px;}
+    .BRD004 .result .list_item > div:nth-child(2) {width: 150px;}
+    .BRD004 .result .list_item > div:nth-child(3) {width: 120px;}
+    .BRD004 .result .list_item > div:nth-child(5) {width: 100px;}
+    .BRD004 .result .list_item > div:nth-child(6) {width: 140px;}
+
+    /* 관리자 - 건설기준연구 관리 */
+    .BRD005 .head > span:nth-child(1) {width: 60px;}
+    .BRD005 .head > span:nth-child(3) {width: 200px;}
+    .BRD005 .head > span:nth-child(4) {width: 300px;}
+    .BRD005 .result .list_item > div:nth-child(1) {width: 60px;}
+    .BRD005 .result .list_item > div:nth-child(2) {text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
+    .BRD005 .result .list_item > div:nth-child(3) {width: 200px;}
+    .BRD005 .result .list_item > div:nth-child(4) {width: 300px; text-align: left;}
+
+    /* 게시판 관리 */
+    .BRD006 .head > span:nth-child(1) {width: 160px;}
+    .BRD006 .head > span:nth-child(3) {width: 180px;}
+    .BRD006 .head > span:nth-child(4) {width: 140px;}
+    .BRD006 .head > span:nth-child(5) {width: 100px;}
+    .BRD006 .head > span:nth-child(6) {width: 120px;}
+    .BRD006 .result .list_item > div:nth-child(1) {width: 160px;}
+    .BRD006 .result .list_item > div:nth-child(2) {text-align: left;}
+    .BRD006 .result .list_item > div:nth-child(3) {width: 180px;}
+    .BRD006 .result .list_item > div:nth-child(4) {width: 140px;}
+    .BRD006 .result .list_item > div:nth-child(5) {width: 100px;}
+    .BRD006 .result .list_item > div:nth-child(6) {width: 120px;}
+
 
     /* 사이트관리 > 게시판현황 > 게시물관리 */
     .BRD007 .head > span:nth-child(1) {width: 70px;}
     .BRD007 .head > span:nth-child(3) {width: 70px;}
-    .BRD007 .head > span:nth-child(4) {width: 120px;}
-    .BRD007 .head > span:nth-child(5) {width: 160px;}
+    .BRD007 .head > span:nth-child(4) {width: 80px;}
+    .BRD007 .head > span:nth-child(5) {width: 100px;}
     .BRD007 .head > span:nth-child(6) {width: 120px;}
-    .BRD007 .head > span:nth-child(7) {width: 140px;}
+    .BRD007 .head > span:nth-child(7) {width: 100px;}
     .BRD007 .result .list_item > div:nth-child(1) {width: 70px;}
     .BRD007 .result .list_item > div:nth-child(3) {width: 70px;}
-    .BRD007 .result .list_item > div:nth-child(4) {width: 120px;}
-    .BRD007 .result .list_item > div:nth-child(5) {width: 160px;}
+    .BRD007 .result .list_item > div:nth-child(4) {width: 80px;}
+    .BRD007 .result .list_item > div:nth-child(5) {width: 100px;}
     .BRD007 .result .list_item > div:nth-child(6) {width: 120px;}
-    .BRD007 .result .list_item > div:nth-child(7) {width: 140px;}
+    .BRD007 .result .list_item > div:nth-child(7) {width: 100px;}
 
     .PDS_REG .pds_desc_edit {margin: 14px 0 30px 0;}
 
@@ -410,6 +430,9 @@
     .BOARD_USE_LIST .board_view2 dl dt {width: 185px;}
     .BOARD_USE_LIST .board_view2 dl:nth-child(2) dd .f_input2 {width: 490px; margin-left: 17px;}
 
+    /* 검색화면 */
+    /*.board_view2*/
+
 
     /* 사용자 게시판 */
     .BRD013 .head > span:nth-child(1) {position: relative; width: 60px;}
@@ -505,6 +528,42 @@
     .BRD020 .result .list_item > div:nth-child(6) {width: 120px;}
     .BRD020 .result .list_item > div:nth-child(7) {width: 100px;}
 
+    /* 기준코드 리스트 */
+    .BRD021 .head > span:nth-child(1) {position: relative; width: 120px;}
+    .BRD021 .head > span:nth-child(2) {position: relative; }
+    .BRD021 .head > span:nth-child(3) {position: relative; width: 120px;}
+    .BRD021 .head > span:nth-child(4) {position: relative; width: 200px;}
+    .BRD021 .head > span:nth-child(5) {position: relative; width: 250px;}
+    .BRD021 .head > span:nth-child(6) {position: relative; width: 100px;}
+    .BRD021 .head > span:nth-child(7) {width: 100px;} /* 스크롤바 크기만큼 width 더 잡아야 함.*/
+    .BRD021 .head > span:nth-child(-n+6)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
+    .BRD021 .result .list_item2 > div:nth-child(1) {width: 120px;}
+    .BRD021 .result .list_item2 > div:nth-child(2) {text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-align: left; padding-left: 10px;}
+    .BRD021 .result .list_item2 > div:nth-child(3) {width: 120px;}
+    .BRD021 .result .list_item2 > div:nth-child(4) {width: 200px;}
+    .BRD021 .result .list_item2 > div:nth-child(5) {width: 250px; padding-left: 10px;}
+    .BRD021 .result .list_item2 > div:nth-child(6) {width: 100px;}
+    .BRD021 .result .list_item2 > div:nth-child(7) {width: 80px;}
+
+    /* 통합다운로드 */
+    .BRD022 .head > span:nth-child(1) {position: relative; width: 40%; }
+    .BRD022 .head > span:nth-child(2) {position: relative; width: 30%; }
+    .BRD022 .head > span:nth-child(3) {position: relative; width: 30%; }
+    .BRD022 .head > span:nth-child(-n+2)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
+    .BRD022 .result .list_item > div:nth-child(1) {width: 40%; text-align: center;}
+    .BRD022 .result .list_item > div:nth-child(2) {width: 30%; text-align: center;}
+    .BRD022 .result .list_item > div:nth-child(3) {width: 30%; text-align: center;}
+
+    /* 즐겨찾기 */
+    .BRD023 .head > span:nth-child(1) {position: relative; width: 100px; }
+    .BRD023 .head > span:nth-child(2) {position: relative; }
+    .BRD023 .head > span:nth-child(3) {position: relative; width: 200px; }
+    .BRD023 .head > span:nth-child(4) {position: relative; width: 100px; }
+    .BRD023 .head > span:nth-child(-n+3)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
+    .BRD023 .result .list_item > div:nth-child(1) {width: 100px; text-align: center;}
+    .BRD023 .result .list_item > div:nth-child(2) {text-align: left; padding-left: 10px;}
+    .BRD023 .result .list_item > div:nth-child(3) {width: 200px; text-align: center;}
+    .BRD023 .result .list_item > div:nth-child(4) {width: 100px; text-align: center;}
 
     /* 찾아오시는길 */
     .SITE_CONTACT_US .map {margin-top: 43px;}
@@ -589,7 +648,7 @@
     .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{height: calc(100vh - 190px); overflow-y: auto;}
+    .viewerDiv{height: calc(100vh - 153px); overflow-y: auto;}
     .openDoc{background-color: bisque;}
     .docLink{color: black;background-color: palegreen}
     .docLink:hover{cursor: pointer}
@@ -613,7 +672,10 @@
     .modalDocInfoActive{filter: grayscale(0%);}
     .docInfoRow > div{--bs-gutter-x: 0.5rem;}
     .bookmarkModalHeader{--bs-modal-title-line-height:1;}
-    .optionBtn{--bs-btn-padding-y: 0.1rem;--bs-btn-padding-x: 0.25rem;--bs-btn-font-size: 0.7rem; margin-right: 7px;}
+    .optionBtn{--bs-btn-padding-y: 0.15rem;--bs-btn-padding-x: 0.25rem;--bs-btn-font-size: 0.7rem; margin-right: 7px;}
+    .detailInfoDiv {position: relative;}
+    .datailcollapse {position: absolute; top: 0; left: 0; margin-top: 200px; margin-left: 0;}
+    .datailcollapse img {position: fixed;}
 
 
     /* 건설기준코드 안내*/

egovframe-template-simple-react-contribution/src/css/response.css

@@ -5,8 +5,8 @@
     /* Layout */
     body {min-width: auto;}
 
-    .header .inner {width: 100%; height: 70px; padding: 0 20px;}
-    .header h1 {margin-top: 22.5px;}
+    .header .inner {width: 100%; padding: 0 10px;}
+    /*.header h1 {margin-top: 22.5px;}*/
     .header .logo .w {display: none;}
     .header .logo .m {display: block;}
     .header .logo .m img {height: 25px;}

egovframe-template-simple-react-contribution/src/pages/admin/board/AdminPostMgtEdit.jsx

@@ -5,6 +5,8 @@ import Modal from "react-bootstrap/Modal";
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import {default as EgovLeftNav} from 'components/leftmenu/EgovLeftNavAdmin';
 import EgovRadioButtonGroup from 'components/EgovRadioButtonGroup';
@@ -153,7 +155,7 @@ function AdminPostMgtEdit({props, reloadFunction, searchCondition}) {
     const [selectedBbsSeq, setSelectedBbsSeq] = useState(props?.selectedBbsSeq ? props?.selectedBbsSeq : props?.bbsSeq);
 
     const handleSelectChange = (e) => {
-        const selectedBbsSeq = e.target.value;
+        const selectedBbsSeq = e.target.selectedOptions[0].dataset.bbsSeq;
         setSelectedBbsSeq(selectedBbsSeq);
     }
 
@@ -235,7 +237,7 @@ function AdminPostMgtEdit({props, reloadFunction, searchCondition}) {
                                 <Form.Select id="select1" name="bbsId" onChange={handleSelectChange}>
                                     <option value="">선택</option>
                                     {categoryList.map((item) => (
-                                        <option key={item.bbsSeq} value={item.bbsSeq}
+                                        <option key={item.bbsSeq} value={item.bbsId} data-bbs-seq={item.bbsSeq}
                                                 selected={props?.mode === CODE.MODE_MODIFY ? item.bbsSeq == props.bbsSeq : item.bbsSeq == props.selectedBbsSeq}>{item.bbsTitle}</option>
                                     ))}
                                 </Form.Select>
@@ -275,19 +277,19 @@ function AdminPostMgtEdit({props, reloadFunction, searchCondition}) {
                         )}
 
                         {/* <!-- 버튼영역 --> */}
-                        <div className="board_btn_area">
-                            <div className="left_col btn1">
+                        <Row className="pt-3">
+                            <Col xs={6}>
                                 {modeInfo.mode === CODE.MODE_MODIFY &&
-                                <button type={"button"} className="btn btn_red_h46 w_100" onClick={() => {
+                                <button type={"button"} className="btn btn_red_h32 w_100" onClick={() => {
                                     deletePost(props)
                                 }}>삭제</button>
                                 }
-                            </div>
+                            </Col>
 
-                            <div className="right_col btn1">
-                                <button type="submit" className="btn btn_skyblue_h46 w_100">저장</button>
-                            </div>
-                        </div>
+                            <Col xs={6} className="text-end">
+                                <button type="submit" className="btn btn_blue_h32 w_100">저장</button>
+                            </Col>
+                        </Row>
                         {/* <!--// 버튼영역 --> */}
                     </Form>
                 </div>

egovframe-template-simple-react-contribution/src/pages/admin/board/AdminPostMgtList.jsx

@@ -74,7 +74,7 @@ function AdminPostMgtList(props) {
                             <div>{item?.fileGrpId && <img src={fileIconPath} alt="File Icon" />}</div>
                             <div>{item?.frstCrtId}</div>
                             <div>{formattedDate}</div>
-                            <div><button className={"btn btn_blue_h31 px-1"} onClick={()=>{editPost(item)}}>수정</button></div>
+                            <div><button className={"btn btn_skyblue_h32 px-1"} onClick={()=>{editPost(item)}}>수정</button></div>
                         </div>
                     );
                 });
@@ -90,7 +90,7 @@ function AdminPostMgtList(props) {
                             <div>{item?.fileGrpId && <img src={fileIconPath} alt="File Icon" />}</div>
                             <div>{item?.frstCrtId}</div>
                             <div>{formattedDate}</div>
-                            <div><button className={"btn btn_blue_h31 px-1"} onClick={()=>{editPost(item)}}>수정</button></div>
+                            <div><button className={"btn btn_skyblue_h32 px-1"} onClick={()=>{editPost(item)}}>수정</button></div>
                         </div>
                     );
                 });

egovframe-template-simple-react-contribution/src/pages/admin/board/EgovAdminBoardEdit.jsx

@@ -5,6 +5,8 @@ import Modal from "react-bootstrap/Modal";
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import {default as EgovLeftNav} from 'components/leftmenu/EgovLeftNavAdmin';
 import EgovRadioButtonGroup from 'components/EgovRadioButtonGroup';
@@ -301,16 +303,16 @@ function EgovAdminBoardEdit({props, reloadFunction}) {
                         </dl>
 
                         {/* <!-- 버튼영역 --> */}
-                        <div className="board_btn_area">
-                            <div className="left_col btn1">
+                        <Row className="pt-3">
+                            <Col xs={6}>
                                 {modeInfo.mode === CODE.MODE_MODIFY && (
-                                <button type={"button"} className="btn btn_red_h46 w_100" onClick={()=>{deleteBoard(props)}}>삭제</button>
+                                <button type={"button"} className="btn btn_red_h32 w_100" onClick={()=>{deleteBoard(props)}}>삭제</button>
                                 )}
-                            </div>
-                            <div className="right_col btn1">
-                                <button type="submit" className="btn btn_skyblue_h46 w_100">저장</button>
-                            </div>
-                        </div>
+                            </Col>
+                            <Col xs={6} className="text-end">
+                                <button type="submit" className="btn btn_blue_h32 w_100">저장</button>
+                            </Col>
+                        </Row>
                         {/* <!--// 버튼영역 --> */}
                     </Form>
                 </div>

egovframe-template-simple-react-contribution/src/pages/admin/boards/List.jsx

@@ -63,7 +63,7 @@ function EgovAdminBoardList(props) {
                             <div>{item.frstCrtId}</div>
                             <div>{formattedDate}</div>
                             <div>{item.useYn}</div>
-                            <div><button className={"btn btn_blue_h31 px-1"} onClick={()=>{editBoard(item)}}>수정</button></div>
+                            <div><button className={"btn btn_skyblue_h32 px-1"} onClick={()=>{editBoard(item)}}>수정</button></div>
                         </div>
                     );
                 });

egovframe-template-simple-react-contribution/src/pages/admin/committee/ProgressStatus.jsx

@@ -212,8 +212,8 @@ function ProgressStatus(props) {
                                             <div>{it.orgNm}</div>
                                             <div>진행단계표시</div>
                                             <div>{it.regDate}</div>
-                                            <div><button type='button' className='btn btn_blue_h31 px-1'>수정</button></div>
-                                            <div><button type='button' className='btn btn_red_h31 px-1'>삭제</button></div>
+                                            <div><button type='button' className='btn btn_skyblue_h32 px-1'>수정</button></div>
+                                            <div><button type='button' className='btn btn_red_h32 px-1'>삭제</button></div>
                                         </div>
                                     ))}
                                 </div>
@@ -233,7 +233,7 @@ function ProgressStatus(props) {
                                     getList({ ...searchCondition, pageIndex: passedPage })
                                 }} />
                                 <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS__CREATE} className="btn btn_blue_h46 w_100">등록</Link>
+                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS__CREATE} className="btn btn_blue_h32 w_100">등록</Link>
                                 </div>
                                 
                             </div>

egovframe-template-simple-react-contribution/src/pages/admin/committee/ProgressStatus/Detail.jsx

@@ -4,6 +4,8 @@ import { Link, useLocation, useNavigate } from 'react-router-dom';
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
 
@@ -151,11 +153,15 @@ function SchedulesDetail(props) {
                             </dl>
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS} className="btn btn_blue_h46 w_100">목록</Link>
-                                </div>
-                            </div>
+                            <Row className="pt-3">
+                                <Col xs={6}>
+                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS} className="btn btn_skyblue_h32 w_100">목록</Link>
+                                    <button className="btn btn_red_h32 w_100 ms-2">삭제</button>
+                                </Col>
+                                <Col xs={6} className="text-end">
+                                    <Link to="" className="btn btn_blue_h32 w_100">수정</Link>
+                                </Col>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
 
                             

egovframe-template-simple-react-contribution/src/pages/admin/committee/ProgressStatus/Edit.jsx

@@ -5,6 +5,8 @@ import AttachFile from "components/file/AttachFile";
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
 
@@ -540,18 +542,18 @@ function ProgressStatusEdit(props) {
                             </dl>
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">
-                                <div className="left_col btn1">
-                                    <button className="btn btn_skyblue_h46 w_100"
+                            <Row className="pt-3">
+                                <Col xs={6}>
+                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS} className="btn btn_skyblue_h32 w_100">목록</Link>
+                                </Col>
+                                <Col xs={6} className="text-end">
+                                    <button className="btn btn_blue_h32 w_100"
                                         onClick={() => updateSchedule()}
                                     > 저장</button>            
                                     
-                                </div>
+                                </Col>
 
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS} className="btn btn_blue_h46 w_100">목록</Link>
-                                </div>
-                            </div>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
                         </StyledDiv>
                         {/* <!-- 게시판 상세보기 --> */}

egovframe-template-simple-react-contribution/src/pages/admin/committee/Schedules/Detail.jsx

@@ -3,7 +3,8 @@ import { Link, useLocation, useNavigate } from 'react-router-dom';
 
 import styled from "styled-components";
 
-
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
@@ -155,22 +156,22 @@ function SchedulesDetail(props) {
                             </dl>
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">                               
-                                <div className="left_col btn1">
+                            <Row className="pt-3">
+                                <Col xs={6}>
+                                    <Link to={URL.ADMIN__COMMITTEE__SCHEDULES} className="btn btn_skyblue_h32 w_100">목록</Link>
+                                    <button className="btn btn_red_h32 w_100 ms-2"
+                                            onClick={(e) => {
+                                                onClickDeleteSchedule(location.state?.schdulId);
+                                            }}>삭제</button>
+                                </Col>
+                                <Col xs={6} className="text-end">
                                     <Link to={{pathname: URL.ADMIN__COMMITTEE__SCHEDULES__MODIFY}}
                                         state={{
                                             schdulId: location.state?.schdulId
                                         }}
-                                        className="btn btn_skyblue_h46 w_100">수정</Link>
-                                    <button className="btn btn_skyblue_h46 w_100"
-                                        onClick={(e) => {
-                                            onClickDeleteSchedule(location.state?.schdulId);
-                                        }}>삭제</button>                                        
-                                </div>
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__SCHEDULES} className="btn btn_blue_h46 w_100">목록</Link>
-                                </div>
-                            </div>
+                                        className="btn btn_blue_h32 w_100">수정</Link>
+                                </Col>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
                         </div>
                         {/* <!-- 게시판 상세보기 --> */}

egovframe-template-simple-react-contribution/src/pages/admin/committee/Schedules/Edit.jsx

@@ -2,7 +2,8 @@ import React, { useState, useEffect } from 'react';
 import { Link, useLocation, useNavigate } from 'react-router-dom';
 import DatePicker from "react-datepicker";
 
-
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
@@ -52,12 +53,12 @@ const StyledDiv = styled.div`
             width: 100%;
         }
     }
-    .right_col {
-        position: absolute;
-        right: 0px;
-        top: 0px;
-        text-align: right;
-    }
+    //.right_col {
+    //    position: absolute;
+    //    right: 0px;
+    //    top: 0px;
+    //    text-align: right;
+    //}
 `;
 
 function SchedulesEdit(props) {
@@ -457,24 +458,22 @@ function SchedulesEdit(props) {
                             </dl>
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">
-                                <div className="left_col btn1">
-                                    <button className="btn btn_skyblue_h46 w_100"
+                            <Row className="pt-3">
+                                <Col xs={6}>
+                                    <Link to={URL.ADMIN__COMMITTEE__SCHEDULES} className="btn btn_skyblue_h32 w_100">목록</Link>
+                                    {modeInfo.mode === CODE.MODE_MODIFY &&
+                                        <button className="btn btn_red_h32 w_100 ms-2"
+                                                onClick={(e) => {
+                                                    onClickDeleteSchedule(location.state?.schdulId);
+                                                }}>삭제</button>
+                                    }
+                                </Col>
+                                <Col xs={6} className={"text-end"}>
+                                    <button className="btn btn_blue_h32 w_100"
                                         onClick={() => updateSchedule()}
                                     > 저장</button>
-                                    {modeInfo.mode === CODE.MODE_MODIFY &&
-                                        <button className="btn btn_skyblue_h46 w_100"
-                                        onClick={(e) => {
-                                            onClickDeleteSchedule(location.state?.schdulId);
-                                        }}>삭제</button> 
-                                    }
-                                    
-                                </div>
-
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__SCHEDULES} className="btn btn_blue_h46 w_100">목록</Link>
-                                </div>
-                            </div>
+                                </Col>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
                         </StyledDiv>
                         {/* <!-- 게시판 상세보기 --> */}

egovframe-template-simple-react-contribution/src/pages/admin/config/AboutSiteMgt.jsx

@@ -57,7 +57,7 @@ function StandardCodeMgt(props) {
                             <div><Image src={SERVER_URL+"/admin/config/about-site-mgt/get-site-image?fileGrpId=" + item.fileGrpId} alt="이미지"  onClick={(e) => window.open(e.target.src)} width={"150"}/></div>
                             <div>{item.siteOrder}</div>
                             <div>{item.useYn}</div>
-                            <div><button className={"btn btn_blue_h31 px-1"} onClick={()=>{editPartnerSite(item)}}>수정</button></div>
+                            <div><button className={"btn btn_skyblue_h31 px-1"} onClick={()=>{editPartnerSite(item)}}>수정</button></div>
                         </div>
                     );
                 });

egovframe-template-simple-react-contribution/src/pages/admin/config/aboutSiteMgt/AboutSiteModal.jsx

@@ -262,16 +262,16 @@ function AboutSiteModal({props, reloadFunction}) {
                         </dl>
 
                         {/* <!-- 버튼영역 --> */}
-                        <Row className="board_btn_area">
+                        <Row className="pt-3">
                             <Col>
-                                <button type={"button"} className="btn btn_blue_h32" onClick={()=>{reloadFunction()}}>목록</button>
+                                {/*<button type={"button"} className="btn btn_skyblue_h32" onClick={()=>{reloadFunction()}}>목록</button>*/}
+                                {modeInfo.mode === CODE.MODE_MODIFY &&
+                                    <button type={"button"} className="btn btn_red_h32" onClick={()=>{deletePartnerSite(props)}}>삭제</button>
+                                }
                             </Col>
                             <Col className="text-end">
-                                <button type="submit" className="btn btn_skyblue_h32">저장
+                                <button type="submit" className="btn btn_blue_h32">저장
                                 </button>
-                                {modeInfo.mode === CODE.MODE_MODIFY &&
-                                <button type={"button"} className="btn btn_red_h32" onClick={()=>{deletePartnerSite(props)}}>삭제</button>
-                                }
                             </Col>
                         </Row>
                         {/* <!--// 버튼영역 --> */}

egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp.jsx

@@ -6,6 +6,8 @@ import LinearProgress from '@mui/material/LinearProgress';
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
 import EgovPagingPaginationInfo from 'components/EgovPagingPaginationInfo';
@@ -184,16 +186,18 @@ function PopUp(props) {
                             
 
                             {/* <!-- Paging --> */}
-                            <div className="board-bot">
-                                <div></div>
-                                <EgovPagingPaginationInfo pagination={paginationInfo} setPaginationInfo={setPaginationInfo} moveToPage={passedPage => {
-                                    getList({ ...searchCondition, pageIndex: passedPage })
-                                }} />
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__CONTENTS__POP_UP__CREATE} className="btn btn_blue_h46 w_100">등록</Link>
-                                </div>
+                            <Row className="pt-3">
+                                <Col xs={3}></Col>
+                                <Col xs={6}>
+                                    <EgovPagingPaginationInfo pagination={paginationInfo} setPaginationInfo={setPaginationInfo} moveToPage={passedPage => {
+                                        getList({ ...searchCondition, pageIndex: passedPage })
+                                    }} />
+                                </Col>
+                                <Col xs={3} className="text-end">
+                                    <Link to={URL.ADMIN__CONTENTS__POP_UP__CREATE} className="btn btn_blue_h32 w_100">등록</Link>
+                                </Col>
                                 
-                            </div>
+                            </Row>
                             {/* <!--/ Paging --> */}
 
 

egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp/PopupEditor.jsx

@@ -6,6 +6,8 @@ import AttachFile from "../../../../components/file/AttachFile";
 import RichTextEditor from "../../../../components/editor/RichTextEditor";
 import AlertDialogSlide from "../../../../components/alert/AlertDialogSlide";
 import LoadingProgress from "../../../../components/progress/LoadingProgress";
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import CODE from 'constants/code';
 
@@ -415,23 +417,22 @@ function PopupEditor(props) {
                             {/* <!--// 게시판 --> */}
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">                                
-                                <div className="left_col btn1">
-                                    <button className="btn btn_blue_h46 w_100"
-                                        onClick={onClickList}>목록</button> 
-                                </div>
-                                <div className="right_col btn1">
-                                    <button className="btn btn_skyblue_h46 w_100"
+                            <Row>
+                                <Col xs={6}>
+                                    <button className="btn btn_skyblue_h32 w_100" onClick={onClickList}>목록</button>
+                                    {modeInfo.mode === CODE.MODE_MODIFY &&
+                                        <button className="btn btn_red_h32 w_100 ms-2"
+                                                onClick={(e) => {
+                                                    onClickDelete(location.state?.popupId);
+                                                }}>삭제</button>
+                                    }
+                                </Col>
+                                <Col xs={6} className="text-end">
+                                    <button className="btn btn_blue_h32 w_100"
                                         onClick={() => createPopup()}
                                     > 저장</button>
-                                    {modeInfo.mode === CODE.MODE_MODIFY &&
-                                        <button className="btn btn_red_h46 w_100"
-                                        onClick={(e) => {
-                                            onClickDelete(location.state?.popupId);
-                                        }}>삭제</button> 
-                                    }                                    
-                                </div>
-                            </div>
+                                </Col>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
 
                             <AlertDialogSlide confirm={confirm} setConfirm={setConfirm} />

egovframe-template-simple-react-contribution/src/pages/admin/contents/StandardResearch.jsx

@@ -5,6 +5,8 @@ import LinearProgress from '@mui/material/LinearProgress';
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
 import CODE from 'constants/code';
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
 
 import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
 import EgovPagingPaginationInfo from 'components/EgovPagingPaginationInfo';
@@ -162,7 +164,7 @@ function StandardResearch(props) {
 
                     
                             {/* <!-- 게시판목록 --> */}
-                            <div className="board_list BRD008">
+                            <div className="board_list BRD005">
                                 <div className="head">
                                     <span>번호</span>
                                     <span>연구명</span>
@@ -180,7 +182,7 @@ function StandardResearch(props) {
                                     {list && list.map((it)=>(
                                         <div className='list_item' key={it.id}>
                                             <div>{it.number}</div>
-                                            <div className="al"><Link to={URL.ADMIN__CONTENTS__STANDARDS_RESEARCH__MODIFY} state={{rsId: it.id} } key={it.id} className='title' >{it.title}</Link></div>
+                                            <div className="al"><Link to={URL.ADMIN__CONTENTS__STANDARDS_RESEARCH__MODIFY} state={{rsId: it.id} } key={it.id} className='title' className={"text-222"}>{it.title}</Link></div>
                                             <div>{it.researchStartDate} ~ {it.researchEndDate}</div>
                                             <div>{it.director}</div>
                                         </div>
@@ -194,16 +196,17 @@ function StandardResearch(props) {
 
 
                             {/* <!-- Paging --> */}
-                            <div className="board-bot">
-                                <div></div>
-                                <EgovPagingPaginationInfo pagination={paginationInfo} setPaginationInfo={setPaginationInfo} moveToPage={passedPage => {
-                                    getList({ ...searchCondition, pageIndex: passedPage })
-                                }} />
-                                <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__CONTENTS__STANDARDS_RESEARCH__CREATE} className="btn btn_blue_h46 w_100">등록</Link>
-                                </div>
+                            <Row className="pt-3">
+                                <Col xs={3}></Col>
+                                <Col xs={6}><EgovPagingPaginationInfo pagination={paginationInfo} setPaginationInfo={setPaginationInfo} moveToPage={passedPage => {
+                                        getList({ ...searchCondition, pageIndex: passedPage })
+                                    }} />
+                                </Col>
+                                <Col xs={3} className="text-end">
+                                    <Link to={URL.ADMIN__CONTENTS__STANDARDS_RESEARCH__CREATE} className="btn btn_blue_h32 w_100">등록</Link>
+                                </Col>
                                 
-                            </div>
+                            </Row>
                             {/* <!--/ Paging --> */}
 
 

egovframe-template-simple-react-contribution/src/pages/admin/contents/StandardResearch/StandardResearchEditor.jsx

@@ -1,6 +1,9 @@
 import React, { useState, useEffect } from 'react';
 import { Link, useLocation, useNavigate } from 'react-router-dom';
 import DatePicker from "react-datepicker";
+import Col from "react-bootstrap/Col";
+import Row from "react-bootstrap/Row";
+
 import LinearProgress from '@mui/material/LinearProgress';
 
 import EgovAttachFile from 'components/EgovAttachFile';
@@ -403,23 +406,23 @@ function StandardResearchEditor(props) {
                             {/* <!--// 게시판 --> */}
 
                             {/* <!-- 버튼영역 --> */}
-                            <div className="board_btn_area">
-                                <div className="left_col btn1">
-                                    <button className="btn btn_skyblue_h46 w_100"
+                            <Row className="pt-3">
+                                <Col xs={6}>
+                                    <button className="btn btn_skyblue_h32 w_100"
+                                            onClick={onClickList}>목록</button>
+                                    {modeInfo.mode === CODE.MODE_MODIFY &&
+                                        <button className="btn btn_red_h32 w_100 ms-2"
+                                                onClick={(e) => {
+                                                    onClickDelete(location.state?.rsId);
+                                                }}>삭제</button>
+                                    }
+                                </Col>
+                                <Col xs={6} className="text-end">
+                                    <button className="btn btn_blue_h32 w_100"
                                         onClick={() => createItem()}
                                     > 저장</button>
-                                    {modeInfo.mode === CODE.MODE_MODIFY &&
-                                        <button className="btn btn_skyblue_h46 w_100"
-                                        onClick={(e) => {
-                                            onClickDelete(location.state?.rsId);
-                                        }}>삭제</button> 
-                                    }                                    
-                                </div>
-                                <div className="right_col btn1">
-                                    <button className="btn btn_blue_h46 w_100"
-                                        onClick={onClickList}>목록</button> 
-                                </div>
-                            </div>
+                                </Col>
+                            </Row>
                             {/* <!--// 버튼영역 --> */}
 
                             <AlertDialogSlide confirm={confirm} setConfirm={setConfirm} />

egovframe-template-simple-react-contribution/src/pages/admin/contents/Survey.jsx

@@ -37,12 +37,12 @@ function Survey({}) {
                         <div className={"list_item"} key={"surveyListDiv_"+index}>
                             <div>{item.svyTitle}</div>
                             <div>{item.svyStartDt}~{item.svyEndDt}</div>
-                            <div><button className={"btn btn_blue_h31 px-1"} onClick={()=>{editSurveyQt(item)}}>질문관리</button></div>
+                            <div><button className={"btn btn_blue_h32 px-1"} onClick={()=>{editSurveyQt(item)}}>질문관리</button></div>
                             <div><Form.Check type={"switch"} defaultChecked={item.useYn==="Y"} onChange={()=>editUseYn(item.svySeq)}/></div>
-                            <div><button className={"btn btn_blue_h31 px-1"}>설문지 보기</button></div>
-                            <div><button className={"btn btn_blue_h31 px-1"}>통계 보기</button></div>
+                            <div><button className={"btn btn_blue_h32 px-1"}>설문지 보기</button></div>
+                            <div><button className={"btn btn_blue_h32 px-1"}>통계 보기</button></div>
                             <div>
-                                <button className={"btn btn_blue_h31 px-1"} onClick={()=>{editSurvey(item)}}>수정</button>
+                                <button className={"btn btn_skyblue_h32 px-1"} onClick={()=>{editSurvey(item)}}>수정</button>
                             </div>
                         </div>
                     );

egovframe-template-simple-react-contribution/src/pages/admin/users/List.jsx

@@ -145,7 +145,7 @@ function List({}) {
                             </ul>
                         </div>
 
-                        <div className="board_list userList">
+                        <div className="board_list ">   {/* userList 칸이 안맞아서 제거함.*/}
                             <div className="head">
                                 <span>아이디</span>
                                 <span>이름</span>

egovframe-template-simple-react-contribution/src/pages/admin/users/UserInfoModal.jsx

@@ -173,7 +173,7 @@ function UserInfoModal({savedInfo, cmtList, reloadFunction}){
                     <Row className="mb-3">
                         <Form.Label column xs={{span:8, offset:2}} id="findResultLabel"></Form.Label>
                         <Col xs={2}>
-                            <Button type="submit">저장</Button>
+                            <Button variant={"22498E"} type="submit">저장</Button>
                         </Col>
                     </Row>
                 </Form>

egovframe-template-simple-react-contribution/src/pages/login/My.jsx

@@ -1,13 +1,96 @@
 import React, { useState } from 'react';
 import {Link, useLocation, useNavigate} from 'react-router-dom';
 import * as EgovNet from 'api/egovFetch';
+import URL from "constants/url";
+
+import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavSupport';
+import Row from "react-bootstrap/Row";
+import Col from "react-bootstrap/Col";
+import Button from "react-bootstrap/Button";
 
 function My(){
 
 
 
     return (
-        <div>마이 페이지</div>
+        <div className="container">
+            <div className="c_wrap">
+                {/* <!-- Location --> */}
+                <div className="location">
+                    <ul>
+                        <li><Link to={URL.MAIN} className="home" >Home</Link></li>
+                        <li>내정보</li>
+                    </ul>
+                </div>
+                {/* <!--// Location --> */}
+
+                <div className="layout">
+                    {/* <!-- Navigation --> */}
+                    <EgovLeftNav></EgovLeftNav>
+                    {/* <!--// Navigation --> */}
+
+                    <div className="contents" id="contents">
+                        {/* <!-- 본문 --> */}
+                        <h1 className="tit_3">내정보</h1>
+
+                        <div className="card bg-fa mb-3">
+                            <Row className="p-3">
+                                <Col xs={"auto"} className="px-4"><img src="/assets/images/icon_qna.png" /></Col>
+                                <Col xs={"auto"} className="">
+                                    사용자가 즐겨찾기한 목록입니다.<br />
+                                    코드명을 선택하시면 즐겨찾기한 페이지로 이동됩니다.
+                                </Col>
+                            </Row>
+                        </div>
+
+                        {/* <!-- 게시판목록 --> */}
+                        <div className="board_list BRD023">
+                            <div className="head">
+                                <span>선택</span>
+                                <span>코드명</span>
+                                <span>개정이력</span>
+                                <span>파일</span>
+                            </div>
+                            <div className="result">
+                                {/* <!-- case : 데이터 없을때 --> */}
+                                {/* <p className="no_data" key="0">검색된 결과가 없습니다.</p> */}
+
+                                {/* <!-- case : 데이터 있을때 --> */}
+                                <Row className="list_item m-0">
+                                    <Col><input type={"checkbox"} name={"list1"} id={"list1"} /></Col>
+                                    <Col><Link to="" className={"text-secondary"}>1212</Link></Col>
+                                    <Col></Col>
+                                    <Col><img src="/assets/images/down.png" className={"h_20"} /></Col>
+                                </Row>
+                                <Row className="list_item m-0">
+                                    <Col><input type={"checkbox"} name={"list1"} id={"list1"} /></Col>
+                                    <Col><Link to="" className={"text-secondary"}>1212</Link></Col>
+                                    <Col></Col>
+                                    <Col><img src="/assets/images/down.png" className={"h_20"} /></Col>
+                                </Row>
+                                <Row className="list_item m-0">
+                                    <Col><input type={"checkbox"} name={"list1"} id={"list1"} /></Col>
+                                    <Col><Link to="" className={"text-secondary"}>1212</Link></Col>
+                                    <Col></Col>
+                                    <Col><img src="/assets/images/down.png" className={"h_20"} /></Col>
+                                </Row>
+                            </div>
+                        </div>
+                        {/* <!--// 게시판목록 --> */}
+
+                        <Row className="board_bot justify-content-between">
+                            <Col xs={3} className=""><Button type={"button"} variant={"22498E"} className={"px-3 f_13"} >선택삭제</Button></Col>
+                            {/* <!-- Paging --> */}
+                            <Col xs={6}></Col>
+                            {/* <!--/ Paging --> */}
+
+                            {/* 수요조사는 버튼명 "의견 접수"  수요조사와 QNA만 작성가능하게 관리자 세팅되어야 함/관리자 쓰기권한만 작성가능 */}
+                            <Col xs={3} className="text-end"></Col>
+                        </Row>
+                    </div>
+                </div>
+            </div>
+        </div>
     );
 }
 

egovframe-template-simple-react-contribution/src/pages/main/EgovMain.jsx

@@ -19,6 +19,8 @@ import {getLocalItem, setLocalItem} from "utils/storage";
 import URL from 'constants/url';
 import CODE from "constants/code";
 
+import CustomModal from './EgovModal';
+import { useCookies } from "react-cookie";
 
 function a11yProps(index) {
     return {
@@ -27,6 +29,27 @@ function a11yProps(index) {
     };
 }
 
+
+function TabPanel(props) {
+    const { children, value, index, ...other } = props;
+
+    return (
+        <div
+            role="tabpanel"
+            hidden={value !== index}
+            id={`wrapped-tabpanel-${index}`}
+            aria-labelledby={`wrapped-tab-${index}`}
+            {...other}
+        >
+            {value === index && (
+                <Box sx={{ p: 3 }}>
+                    <Typography component="div">{children}</Typography>
+                </Box>
+            )}
+        </div>
+    );
+}
+
 function EgovMain(props) {
     console.group("EgovMain");
     console.log("[Start] EgovMain ------------------------------");
@@ -39,7 +62,20 @@ function EgovMain(props) {
     const [user, setUser] = useState(parseJwt(getLocalItem('accessToken')) || null);
     console.log(user);
 
-    const handlePlusClick = () => {
+    // 모달 상태 및 콘텐츠 관리
+    const [show, setShow] = React.useState(false);
+    const [modalContent, setModalContent] = React.useState({});
+    const [showModals, setShowModals] = useState([]);
+    const [cookies, setCookie] = useCookies([`MainModal_${modalContent.id}`]);
+
+    const handleShow = (content) => {
+        setShowModals(prev => [...prev, content]);
+    };
+    const handleClose = (id) => {
+        setShowModals(prev => prev.filter(modal => modal.id !== id));
+    };
+
+    const handlePlusClick = (currentTabValue) => {
         const urls = [
             URL.SUPPORT_LIST_NOCODE+'/KCSC-NOT',
             URL.SUPPORT_LIST_NOCODE+'/KCSC-NTC',
@@ -48,8 +84,8 @@ function EgovMain(props) {
             URL.SUPPORT_LIST_NOCODE+'/KCSC-TEC',
             URL.SUPPORT_LIST_NOCODE+'/KCSC-NWS'
         ];
-        if (value >= 0 && value < urls.length) {
-            navigate(urls[value]);
+        if (currentTabValue >= 0 && currentTabValue < urls.length) {
+            navigate(urls[currentTabValue]);
         }
     };
 
@@ -65,6 +101,18 @@ function EgovMain(props) {
         pauseOnHover: true
     };
 
+    const settings1 = {
+        dots: true,
+        infinite: true,
+        speed: 1000,
+        slidesToShow: 1,
+        slidesToScroll: 1,
+        arrows: false,
+        autoplay: true,
+        autoplaySpeed: 5000,
+        pauseOnHover: true
+    };
+
     const banners = [
         { src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
         { src: '/assets/images/copy2.png', url: 'https://talbakkum.com' },
@@ -86,9 +134,15 @@ function EgovMain(props) {
     ];
 
     // TAB 상태를 정의합니다.
-    const [value, setValue] = useState(0);
-    const handleChange = (event, newValue) => {
-        setValue(newValue);
+    const [leftTabValue, setLeftTabValue] = useState(0);
+    const [rightTabValue, setRightTabValue] = useState(3);
+
+    const handleLeftTabChange = (event, newValue) => {
+        setLeftTabValue(newValue);
+    };
+
+    const handleRightTabChange = (event, newValue) => {
+        setRightTabValue(newValue);
     };
 
 	// eslint-disable-next-line no-unused-vars
@@ -176,6 +230,36 @@ function EgovMain(props) {
     //     retrieveList();
     // }, [retrieveList]);
 
+    useEffect(() => {
+        // 모달 콘텐츠 배열
+        const modalContents = [
+            {
+                id: 1,
+                title: `제목 제목 제목 제목 제목 제목 1`,
+                body: `내용 내용 내용 내용 내용 내용 내용 내용 내용 내용\\n내용 내용 내용 내용 내용 내용 내용 내용 내용 내용\\n내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 1`,
+                files: [
+                    { name: '파일1.txt', imageSrc: '/assets/images/file.png' },
+                    { name: '파일2.txt', imageSrc: '/assets/images/file.png' }
+                ]
+            },
+            {
+                id: 2,
+                title: `제목 2`,
+                body: `내용 2\n내용 2`,
+                files: [
+                    { name: '파일3.txt', imageSrc: '/assets/images/file.png' },
+                    { name: '파일4.txt', imageSrc: '/assets/images/file.png' }
+                ]
+            }
+        ];
+
+        // 쿠키가 없는 모달만 열기
+        modalContents.forEach(content => {
+            if (!cookies[`MainModal_${content.id}`]) {
+                handleShow(content);
+            }
+        });
+    }, [cookies]);
 
     const onChangeLogin = (user) => {
         setUser(user);
@@ -218,239 +302,458 @@ function EgovMain(props) {
         <div className="P_MAIN">{/* container */}
             <div className="c_wrap">
                 <div className="topbox d-flex justify-content-center align-items-center">
-                    <div className="topbox_1">
-                        <div className="topbox_11">실시간 인기키워드</div>
-                        {/*<div className="topbox_12">현재 기준 사용자가 가장 많이 검색하는 키워드입니다.</div>*/}
-                        <div className="topbox_13">2024년 5월 9일 목요일 오전 11:45</div>
-                        <Row className="topbox_14">
-                            <Col xs={6}>
-                                <div className={"text-truncate"}>1 가설공사</div>
-                                <div className={"text-truncate"}>2 가설공사</div>
-                                <div className={"text-truncate"}>3 가설공사</div>
-                                <div className={"text-truncate"}>4 가설공사가설공사</div>
-                                <div className={"text-truncate"}>5 가설공사</div>
-                            </Col>
-                            <Col xs={6}>
-                                <div className={"text-truncate"}>&nbsp;&nbsp;6 가설공사</div>
-                                <div className={"text-truncate"}>&nbsp;&nbsp;7 가설공사가설공사가설공사가설공사</div>
-                                <div className={"text-truncate"}>&nbsp;&nbsp;8 가설공사</div>
-                                <div className={"text-truncate"}>&nbsp;&nbsp;9 가설공사</div>
-                                <div className={"text-truncate"}>10 가설공사</div>
-                            </Col>
-                        </Row>
-                    </div>
-                    <div className="topbox_2">
-                        <div className={"topbox_11"}>자주찾는 서비스</div>
-                        {/*<div className={"topbox_12"}>버튼을 선택하시면 해당 서비스로 이동합니다.</div>*/}
-                        <Row>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_LIST} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing1.png" /></div>
-                                    <div className={"topbox_14"}>코드검색</div>
-                                    {/*<div className={"topbox_15"}><Button type={"button"} className={"btn btn-22498E px-3"}>바로가기</Button> </div>*/}
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_INFO} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing2.png" /></div>
-                                    <div className={"topbox_14"}>코드안내</div>
-                                    {/*<div className={"topbox_15"}><Button type={"button"} className={"btn btn-22498E px-3"}>바로가기</Button> </div>*/}
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.COMMITTEE_SCHEDULE} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing3.png" /></div>
-                                    <div className={"topbox_14"}>위원회일정</div>
-                                    {/*<div className={"topbox_15"}><Button type={"button"} className={"btn btn-22498E px-3"}>바로가기</Button> </div>*/}
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_LIST + '/5000'} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing4.png" /></div>
-                                    <div className={"topbox_14"}>전문시방서</div>
-                                    {/*<div className={"topbox_15"}><Button type={"button"} className={"btn btn-22498E px-3"}>바로가기</Button> </div>*/}
-                                </Link>
-                            </Col>
-                        </Row>
-                        <Row>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_OLD_NOCODE+'/5'} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing5.png" /></div>
-                                    <div className={"topbox_14"}>훈령/예규/지침</div>
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_ENG} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing6.png" /></div>
-                                    <div className={"topbox_14"}>영문건설기준</div>
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.STANDARD_CODE_TERM} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing8.png" /></div>
-                                    <div className={"topbox_14"}>건설기준용어</div>
-                                </Link>
-                            </Col>
-                            <Col>
-                                <Link to={URL.SUPPORT_API} className="link-wrapper">
-                                    <div className={"topbox_13"}><img src="/assets/images/ico-landing10.png" /></div>
-                                    <div className={"topbox_14"}>API 서비스</div>
-                                </Link>
-                            </Col>
-                        </Row>
-                    </div>
-                    <div className="topbox_3">
-                        <div className={"topbox_11"}>{user ? (
-                            <>
-                                <Row>
-                                    <Col xs={6}>{user.id} 님.</Col>
-                                    <Col xs={6} className={"text-end"}><Button type={"button"} className={"btn btn-22498E btn-sm"} onClick={logOutHandler}>로그아웃</Button> </Col>
-                                </Row>
-                            </>    
-                        ) : ('로그인')}
-                        </div>
-                        <div>
-                            <EgovLogin onChangeLogin={onChangeLogin}></EgovLogin>
-                        </div>
-                    </div>
+                    <Row className="topbox_1">
+                        <Col className={"topbox_11"}>
+                            <Row>
+                                <Col xs={6}>
+                                    <Row className={"topbox_12 justify-content-between"}>
+                                        <Col className={"topbox_13"}>설계기준</Col>
+                                        <Col className={"topbox_14"}><span>더보기 +</span></Col>
+                                    </Row>
+                                </Col>
+                                <Col xs={6}>
+                                    <Row className={"topbox_15 justify-content-between"}>
+                                        <Col className={"topbox_13"}>표준시방서</Col>
+                                        <Col className={"topbox_16"}><span>더보기 +</span></Col>
+                                    </Row>
+                                </Col>
+                            </Row>
+                            <Row className={"pt-3 mx-0"}>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/1010" title="공통코드">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col xs={7}>공통</Col>
+                                            <Col xs={5} className={"text-end"}><img src={"/assets/images/x1.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/101011" title="지반">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>지반</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x2.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/101014" title="구조">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>구조</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x3.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102034" title="조경">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>조경</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x4.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102041" title="건축">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>건축</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x5.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102067" title="농업기반">
+                                        <Row className={"topbox_2 justify-content-between me-0"}>
+                                            <Col>농업기반</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x6.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                            </Row>
+                            <Row className={"pt-2 mx-0"}>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/101017" title="내진">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>내진</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x7.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102021" title="가설">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>가설</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x8.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102024" title="교량">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>교량</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x9.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102047" title="철도">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>철도</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x10.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102051" title="하천">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>하천</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x11.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102054" title="댐">
+                                        <Row className={"topbox_2 justify-content-between me-0"}>
+                                            <Col>댐</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x12.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                            </Row>
+                            <Row className={"pt-2 mx-0"}>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102027" title="터널">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>터널</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x13.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102029" title="공동구">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>공동구</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x14.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102031" title="설비">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>설비</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x15.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102057" title="상수도">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>상수도</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x16.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102061" title="하수도">
+                                        <Row className={"topbox_2 justify-content-between me-1"}>
+                                            <Col>하수도</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x17.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={2}>
+                                    <Link to="/standardCode/list/102044" title="도로">
+                                        <Row className={"topbox_2 justify-content-between me-0"}>
+                                            <Col>도로</Col>
+                                            <Col className={"text-end"}><img src={"/assets/images/x18.png"} className={"h_25"} /></Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                            </Row>
+                            <Row className={"pt-3 mx-0 justify-content-between"}>
+                                <Col xs={"auto"} className={"p-0"}>
+                                    <Link to={URL.STANDARD_CODE_INFO} title="건설기준안내" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing2.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222 text-center"}>건설기준안내</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.COMMITTEE_SCHEDULE} title="위원회일정" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing3.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>위원회일정</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.STANDARD_CODE_LIST + '/5000'} title="전문시방서" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing4.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>전문시방서</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.STANDARD_CODE_OLD_NOCODE+'/5'} title="훈련/예규/지침" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing5.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>훈련/예규/지침</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.STANDARD_CODE_ENG} title="영문건설기준" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing6.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>영문건설기준</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.STANDARD_CODE_TERM} title="건설기준용어" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing8.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>건설기준용어</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.STANDARD_CODE_LIST} title="최근수정코드" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing13.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>최근수정코드</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.SUPPORT_LIST_NOCODE+'/KCKC-INV'} title="수요조사" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing12.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>수요조사</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                                <Col xs={"auto"}>
+                                    <Link to={URL.SUPPORT_API} title="오픈 API" className={"w_75"}>
+                                        <Row className={"topbox_4 justify-content-center"}>
+                                            <Col><img src="/assets/images/ico-landing10.png" className={"w_50 h_50"} /></Col>
+                                        </Row>
+                                        <Row className={"topbox_5 justify-content-center"}>
+                                            <Col className={"text-222"}>오픈 API</Col>
+                                        </Row>
+                                    </Link>
+                                </Col>
+                            </Row>
+                        </Col>
+                        <Col xs={"auto"} className={"justify-content-end p-0"}>
+                            <div className="topbox_3">
+                                <div className={"topbox_31"}>{user ? (
+                                    <>
+                                        <Row>
+                                            <Col xs={6}>{user.id} 님.</Col>
+                                            <Col xs={6} className={"text-end"}><Button type={"button"} className={"btn btn-22498E btn-sm"} onClick={logOutHandler}>로그아웃</Button> </Col>
+                                        </Row>
+                                    </>
+                                ) : ('로그인')}
+                                </div>
+                                <div>
+                                    <EgovLogin onChangeLogin={onChangeLogin}></EgovLogin>
+                                </div>
+                            </div>
+                        </Col>
+                    </Row>
                 </div>
 
-
-                <div className="numbox d-flex justify-content-center align-items-center">
-                    <div className="numbox_n"><div className="num_text">다운로드 수</div><div className="num_count"><CountUp start={0} end={334345} duration={2.5} separator="," /><span className="unit">건</span></div></div>
-                    <div className="numbox_n"><div className="num_text">회원가입자 수</div><div className="num_count"><CountUp start={0} end={12345} duration={2.5} separator="," /><span className="unit">명</span></div></div>
-                    <div className="numbox_n"><div className="num_text">일 평균 방문자</div><div className="num_count"><CountUp start={0} end={56427} duration={2.5} separator="," /><span className="unit">명</span></div></div>
-                    <div className="numbox_n"><div className="num_text">개정고시</div><div className="num_count"><CountUp start={0} end={99875} duration={2.5} separator="," /><span className="unit">건</span></div></div>
-                </div>
-
-
-                {/*<div className="menubox d-flex justify-content-center align-items-center">*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.STANDARD_CODE_OLD}><div className="menu_img"><img src="/assets/images/ico-landing5.png" /></div><div className="menu_text">훈령/예규/지침</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.STANDARD_CODE_ENG}><div className="menu_img"><img src="/assets/images/ico-landing6.png" /></div><div className="menu_text">영문건설기준</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.STANDARD_CODE_TERM}><div className="menu_img"><img src="/assets/images/ico-landing8.png" /></div><div className="menu_text">건설기준용어</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.SUPPORT_LIST_NOCODE+'/KCSC-EVT'}><div className="menu_img"><img src="/assets/images/ico-landing7.png" /></div><div className="menu_text">주요행사</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.SUPPORT_LIST_NOCODE+'/KCSC-INV'}><div className="menu_img"><img src="/assets/images/ico-landing9.png" /></div><div className="menu_text">수요조사</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.SUPPORT_API}><div className="menu_img"><img src="/assets/images/ico-landing10.png" /></div><div className="menu_text">API 서비스</div></Link></div>*/}
-                {/*    <div className="menubox_n text-center"><Link to={URL.SUPPORT_SITE}><div className="menu_img"><img src="/assets/images/ico-landing11.png" /></div><div className="menu_text">관련사이트</div></Link></div>*/}
-                {/*</div>*/}
-
-
                 <div className="bbsbox d-flex justify-content-center align-items-start">
                     <div className="bbsbox_1">
                         <Box sx={{ borderBottom: 2, borderColor: 'divider' }}>
                             <Tabs
-                                value={value}
-                                onChange={handleChange}
+                                value={leftTabValue}
+                                onChange={handleLeftTabChange}
                                 indicatorColor="secondary"
-                                textColor="#22498E"
+                                textColor="inherit"
+                                sx={{
+                                    '& .Mui-selected': {
+                                        color: '#22498E', // 선택된 탭의 색상
+                                    },
+                                }}
                             >
-                                <Tab value={0} {...a11yProps(0)} sx={{ fontSize: value === 0 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 0 ? '#22498E' : 'secondary'}} label="건설기준고시" wrapped />
-                                <Tab value={1} {...a11yProps(1)} sx={{ fontSize: value === 1 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 1 ? '#22498E' : 'secondary'}} label="공지사항" />
-                                <Tab value={2} {...a11yProps(2)} sx={{ fontSize: value === 2 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 2 ? '#22498E' : 'secondary'}} label="위원회 진행현황" />
-                                <Tab value={3} {...a11yProps(3)} sx={{ fontSize: value === 3 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 3 ? '#22498E' : 'secondary'}} label="건설기준연구" />
-                                <Tab value={4} {...a11yProps(4)} sx={{ fontSize: value === 4 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 4 ? '#22498E' : 'secondary'}} label="기술자료" />
-                                <Tab value={5} {...a11yProps(5)} sx={{ fontSize: value === 5 ? '1.5rem' : '1rem', fontWeight: 700, color: value === 5 ? '#22498E' : 'secondary'}} label="보도자료" />
-                                <Tab value="" label="+" sx={{ fontSize: '1.75rem', ml: 'auto' }} onClick={handlePlusClick} />
+                                <Tab value={0} {...a11yProps(0)} sx={{ fontSize: leftTabValue === 0 ? '1.3rem' : '1rem', fontWeight: 700, color: leftTabValue === 0 ? '#22498E' : 'secondary'}} label="건설기준고시" wrapped />
+                                <Tab value={1} {...a11yProps(1)} sx={{ fontSize: leftTabValue === 1 ? '1.3rem' : '1rem', fontWeight: 700, color: leftTabValue === 1 ? '#22498E' : 'secondary'}} label="건설기준연구" />
+                                <Tab value={2} {...a11yProps(2)} sx={{ fontSize: leftTabValue === 2 ? '1.3rem' : '1rem', fontWeight: 700, color: leftTabValue === 2 ? '#22498E' : 'secondary'}} label="위원회 진행현황" />
+                                <Tab value="" label="+" sx={{ fontSize: '1.75rem', ml: 'auto' }} onClick={() => handlePlusClick(leftTabValue)} />
                             </Tabs>
                         </Box>
-                        <TabPanel value={value} index={0}>
+                        <TabPanel value={leftTabValue} index={0}>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>국토교통부고시_제2024-147호(내진설계일반(KDS_17_10_00))_정정_고시</Link></Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                                {/*<Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>*/}
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>국토교통부고시_제2024-147호(내진설계일반(KDS_17_10_00))_정정_고시</Link></Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>국토교통부고시_제2024-147호(내진설계일반(KDS_17_10_00))_정정_고시</Link></Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>국토교통부고시_제2024-147호(내진설계일반(KDS_17_10_00))_정정_고시_정정_고시_정정_고시_정정_고시_정정_고시_정정_고시_정정_고시</Link></Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                         </TabPanel>
-                        <TabPanel value={value} index={1}>
+                        <TabPanel value={leftTabValue} index={1}>
                             <Row className={"bbsbox_11"}>
-                                <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준위원회</Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>2024년 제7차 건설기준연구</Link></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준위원회</Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준위원회</Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
                             </Row>
                             <Row className={"bbsbox_11"}>
                                 <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준위원회</Col>
-                                <Col xs={2} className={"text-end"}>2024.01.23.</Col>
-                                <Col xs={1} className={"text-end"}><img src={"/assets/images/file.png"} /></Col>
-                            </Row></TabPanel>
-                        <TabPanel value={value} index={2}>건설기준고시 리스트 출력</TabPanel>
-                        <TabPanel value={value} index={3}>건설기준연구 리스트 출력</TabPanel>
-                        <TabPanel value={value} index={4}>기술자료 리스트 출력</TabPanel>
-                        <TabPanel value={value} index={5}>보도자료 리스트 출력</TabPanel>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                            </Row>
+                        </TabPanel>
+                        <TabPanel value={leftTabValue} index={2}>위원회 진행현황 리스트 출력</TabPanel>
+                    </div>
+                    <div className="bbsbox_3">
+                        <Box sx={{ borderBottom: 2, borderColor: 'divider' }}>
+                            <Tabs
+                                value={rightTabValue}
+                                onChange={handleRightTabChange}
+                                indicatorColor="secondary"
+                                textColor="inherit"
+                                sx={{
+                                    '& .Mui-selected': {
+                                        color: '#22498E', // 선택된 탭의 색상
+                                    },
+                                }}
+                            >
+                                <Tab value={3} {...a11yProps(3)} sx={{ fontSize: rightTabValue === 3 ? '1.3rem' : '1rem', fontWeight: 700, color: rightTabValue === 3 ? '#22498E' : 'secondary'}} label="공지사항" />
+                                <Tab value={4} {...a11yProps(4)} sx={{ fontSize: rightTabValue === 4 ? '1.3rem' : '1rem', fontWeight: 700, color: rightTabValue === 4 ? '#22498E' : 'secondary'}} label="기술자료" />
+                                <Tab value={5} {...a11yProps(5)} sx={{ fontSize: rightTabValue === 5 ? '1.3rem' : '1rem', fontWeight: 700, color: rightTabValue === 5 ? '#22498E' : 'secondary'}} label="보도자료" />
+                                <Tab value="" label="+" sx={{ fontSize: '1.75rem', ml: 'auto' }} onClick={() => handlePlusClick(rightTabValue)} />
+                            </Tabs>
+                        </Box>
+                        <TabPanel value={rightTabValue} index={3}>
+                            <Row className={"bbsbox_11"}>
+                                <Col xs={9} className={"text-truncate"}><Link to={URL.SUPPORT_DETAIL} className={"bbsbox_11_title"}>2024년 제7차 공지사항</Link></Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                            </Row>
+                            <Row className={"bbsbox_11"}>
+                                <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준연구</Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                            </Row>
+                            <Row className={"bbsbox_11"}>
+                                <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준연구</Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                            </Row>
+                            <Row className={"bbsbox_11"}>
+                                <Col xs={9} className={"text-truncate"}>2024년 제7차 건설기준연구</Col>
+                                <Col xs={3} className={"text-end"}>2024.01.23.</Col>
+                            </Row>
+                        </TabPanel>
+                        <TabPanel value={rightTabValue} index={4}>기술자료 리스트 출력</TabPanel>
+                        <TabPanel value={rightTabValue} index={5}>보도자료 리스트 출력</TabPanel>
+                    </div>
+                    <div className="bbsbox_2">
+                        {/*<Link to={URL.ABOUT_PROMOTE}><img src="/assets/images/narae.jpg" /></Link>*/}
+                        <Slider {...settings1}>
+                            <Link to={URL.ABOUT_PROMOTE}><img src="/assets/images/narae.jpg" /></Link>
+                            <Link to={URL.ABOUT_PROMOTE}><img src="/assets/images/narae.jpg" /></Link>
+                        </Slider>
                     </div>
-                    <div className="bbsbox_2"><Link to={URL.ABOUT_PROMOTE}><img src="/assets/images/narae.jpg" /></Link></div>
                 </div>
 
 
-                <div className="qnabox">
-                    <div className="qnabox_1 d-flex justify-content-center">
-                        <div className="qnabox_11 d-flex justify-content-start align-items-end">Q&A</div>
-                        <Row className="qnabox_12 text-center align-items-end">
-                            <Col xs={9}></Col>
-                            <Col xs={1} className={"rounded_circle_qna"}><img src={"/assets/images/left.png"} /></Col>
-                            <Col xs={1} className={""}> 1/2 </Col>
-                            <Col xs={1} className={"rounded_circle_qna"}><img src={"/assets/images/right.png"} /></Col>
+                <Row className={"qna_count d-flex justify-content-center"}>
+                    <Col className="qnabox">
+                        <div className="qnabox_1 d-flex justify-content-center">
+                            <div className="qnabox_11 text-start align-items-end">Q&A</div>
+                            <Row className="qnabox_12 text-center justify-content-center align-items-end">
+                                <Col xs={8}></Col>
+                                <Col xs={1} className={"rounded_circle_qna"}><img src={"/assets/images/left.png"} /></Col>
+                                <Col xs={2} className={""}> 1/2 </Col>
+                                <Col xs={1} className={"rounded_circle_qna"}><img src={"/assets/images/right.png"} /></Col>
+                            </Row>
+                        </div>
+                        <div className="qnabox_2 d-flex justify-content-center align-items-center">
+                            <div className="qnabox_n">
+                                <Row>
+                                    <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
+                                    <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
+                                </Row>
+                                <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 정말 잘 되나요? 정말 잘 되나요? 정말 잘 되나요? 정말 잘 되나요?</Link></Row>
+                                <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
+                            </div>
+                            <div className="qnabox_n">
+                                <Row>
+                                    <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
+                                    <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
+                                </Row>
+                                <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
+                                <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
+                            </div>
+                            <div className="qnabox_n">
+                                <Row>
+                                    <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
+                                    <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
+                                </Row>
+                                <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
+                                <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
+                            </div>
+                            <div className="qnabox_n">
+                                <Row>
+                                    <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
+                                    <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
+                                </Row>
+                                <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
+                                <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
+                            </div>
+                        </div>
+                    </Col>
+                    <Col className={"numbox"}>
+                        <Row className="numbox_n">
+                            <Col className="num_text">다운로드 수</Col>
+                            <Col className="num_count"><CountUp start={0} end={334345} duration={2.5} separator="," /><span className="unit">건</span></Col>
                         </Row>
-                    </div>
-                    <div className="qnabox_2 d-flex justify-content-center align-items-center">
-                        <div className="qnabox_n">
-                            <Row>
-                                <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
-                                <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
-                            </Row>
-                            <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
-                            <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
-                        </div>
-                        <div className="qnabox_n">
-                            <Row>
-                                <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
-                                <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
-                            </Row>
-                            <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
-                            <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
-                        </div>
-                        <div className="qnabox_n">
-                            <Row>
-                                <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
-                                <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
-                            </Row>
-                            <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
-                            <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
-                        </div>
-                        <div className="qnabox_n">
-                            <Row>
-                                <Col xs={10} className={"qnabox_n_file py-1"}>00.jpg</Col>
-                                <Col xs={2} className={"text-end p-0"}><img src={"/assets/images/file.png"} /></Col>
-                            </Row>
-                            <Row className={"qnabox_n_title pt-2"}><Link to={URL.SUPPORT_DETAIL} className={"text-secondary p-0"}>콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요? 콘크리트 내구성 설계 및 평가 문의요.. 정말 잘 되나요?</Link></Row>
-                            <Row className={"qnabox_n_date justify-content-end"}>2024.01.23</Row>
-                        </div>
-                    </div>
-                </div>
-
+                        <Row className="numbox_n">
+                            <Col className="num_text">회원가입자 수</Col>
+                            <Col className="num_count"><CountUp start={0} end={12345} duration={2.5} separator="," /><span className="unit">명</span></Col>
+                        </Row>
+                        <Row className="numbox_n">
+                            <Col className="num_text">일 평균 방문자</Col>
+                            <Col className="num_count"><CountUp start={0} end={56427} duration={2.5} separator="," /><span className="unit">명</span></Col>
+                        </Row>
+                        <Row className="numbox_n">
+                            <Col className="num_text">개정고시</Col>
+                            <Col className="num_count"><CountUp start={0} end={99875} duration={2.5} separator="," /><span className="unit">건</span></Col>
+                        </Row>
+                    </Col>
+                </Row>
 
                 <div className="bannerbox">
                     <Slider {...settings}>
@@ -464,30 +767,19 @@ function EgovMain(props) {
                     </Slider>
                 </div>
             </div>
+
+            {showModals.map(modalContent => (
+                <CustomModal
+                    key={modalContent.id}
+                    show={true}
+                    handleClose={() => handleClose(modalContent.id)}
+                    modalContent={modalContent}
+                />
+            ))}
         </div>
 
     );
 }
 
 
-function TabPanel(props) {
-    const { children, value, index, ...other } = props;
-
-    return (
-        <div
-            role="tabpanel"
-            hidden={value !== index}
-            id={`wrapped-tabpanel-${index}`}
-            aria-labelledby={`wrapped-tab-${index}`}
-            {...other}
-        >
-            {value === index && (
-                <Box sx={{ p: 3 }}>
-                    <Typography>{children}</Typography>
-                </Box>
-            )}
-        </div>
-    );
-}
-
 export default EgovMain;

egovframe-template-simple-react-contribution/src/pages/main/EgovModal.jsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import Modal from 'react-bootstrap/Modal';
+import { Row, Col, Button } from 'react-bootstrap';
+import { useCookies } from 'react-cookie';
+
+const CustomModal = ({ show, handleClose, modalContent }) => {
+    const [dontShowAgain, setDontShowAgain] = React.useState(false);
+    const [cookies, setCookie] = useCookies([`MainModal_${modalContent.id}`]);
+
+    const handleCheckboxChange = () => {
+        const newDontShowAgain = !dontShowAgain;
+        setDontShowAgain(newDontShowAgain);
+        if (newDontShowAgain) {
+            const expirationDate = new Date();
+            expirationDate.setDate(expirationDate.getDate() + 1);
+            setCookie(`MainModal_${modalContent.id}`, "true", { expires: expirationDate });
+            handleClose();
+        }
+    };
+
+    React.useEffect(() => {
+        if (cookies[`MainModal_${modalContent.id}`]) {
+            handleClose();
+        }
+    }, [cookies, modalContent.id, handleClose]);
+
+    return (
+        <Modal show={show} onHide={handleClose} backdrop="static">
+            <Modal.Header closeButton className={"bg-224 text-white rounded-0"}>
+                <Modal.Title className={"fs-6"}>{modalContent.title}</Modal.Title>
+            </Modal.Header>
+            <Modal.Body className={"px-4 pb-0"}>
+                <Row className={"pb-3"}>
+                    <Col xs={12} className="text-start">
+                        {modalContent.body && modalContent.body.split("\n").map((line, index) => (
+                            <React.Fragment key={index}>
+                                {line}
+                                <br />
+                            </React.Fragment>
+                        ))}
+                    </Col>
+                </Row>
+                {modalContent.files && modalContent.files.map((file, index) => (
+                    <Row key={index} className={`py-2 ${index === 0 ? 'border-top' : ''}`}>
+                        <Col xs={1}><img src={file.imageSrc} className={"h_20"} alt="파일" /></Col>
+                        <Col xs={11} className="text-start">{file.name}</Col>
+                    </Row>
+                ))}
+                {/*<Row className={"py-2 border-top"}>*/}
+                {/*    <Col xs={1} ><img src={"/assets/images/file.png"} className={"h_20"} /></Col>*/}
+                {/*    <Col xs={11} className="text-start">파일명</Col>*/}
+                {/*</Row>*/}
+                {/*<Row className={"py-2"}>*/}
+                {/*    <Col xs={1} ><img src={"/assets/images/file.png"} className={"h_20"} /></Col>*/}
+                {/*    <Col xs={11} className="text-start">파일명</Col>*/}
+                {/*</Row>*/}
+                {/*<Row className={"py-2"}>*/}
+                {/*    <Col xs={1} ><img src={"/assets/images/file.png"} className={"h_20"} /></Col>*/}
+                {/*    <Col xs={11} className="text-start">파일명</Col>*/}
+                {/*</Row>*/}
+            </Modal.Body>
+            <Modal.Footer className={"h_30 py-1 mb-1 bg-fa"}>
+                <input type="checkbox" checked={dontShowAgain} onChange={handleCheckboxChange} id={`MainModal_${modalContent.id}`} />
+                <label className={"f_12"} htmlFor={`MainModal_${modalContent.id}`}> 오늘 하루 열지 않음</label>
+            </Modal.Footer>
+        </Modal>
+    );
+};
+
+export default CustomModal;

egovframe-template-simple-react-contribution/src/pages/standardCode/info/StandardCodeInfo.jsx

@@ -97,92 +97,92 @@ function StandardCodeInfo({}){
                                                 <Col className={"code_border"}></Col>
                                             </Row>
                                         </Col>
-                                        <Col xs={8} className={"h-100"}>
+                                        <Col xs={"auto"} className={"h-100"}>
                                             <Row>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>개정 <br />용이성</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                     </Row>
                                                 </Col>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>중복성 <br />최소화</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                     </Row>
                                                 </Col>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>상층성 <br />해결</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                     </Row>
                                                 </Col>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>사용자 <br />편의성</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                     </Row>
                                                 </Col>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>코드추가 <br />확장성</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                     </Row>
                                                 </Col>
-                                                <Col xs={2}>
+                                                <Col xs={"auto"}>
                                                     <Row>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>
                                                         </Col>
                                                         <Col xs={8} className={"code_circle py-4"}>성능 <br />중심지향</Col>
-                                                        <Col xs={1}>
+                                                        <Col xs={"auto"}>
                                                             <Row className={"pt-5"}>
                                                                 <Col className={"code_border"}></Col>
                                                             </Row>

egovframe-template-simple-react-contribution/src/pages/standardCode/list/DownloadModal.jsx

@@ -3,6 +3,8 @@ import {Button, Modal, Nav} from "react-bootstrap";
 import Col from "react-bootstrap/Col";
 import Row from "react-bootstrap/Row";
 import * as EgovNet from "api/egovFetch";
+import URL from "constants/url";
+import {Link} from "react-router-dom";
 
 
 function DownloadModal({closeFn}){
@@ -33,22 +35,40 @@ function DownloadModal({closeFn}){
                 <Modal.Title id="example-modal-sizes-title-lg">통합다운로드</Modal.Title>
             </Modal.Header>
             <Modal.Body>
-                <Row className={"justify-content-start py-1 mx-1"}>
-                    <Col xs={"auto px-1"}>
-                        <div className={`tab ${tab === 10 ? 'active' : ''}`}
-                                          onClick={() => {setTab(10); setSubTabsVisible(false)}}>설계기준</div>
-                    </Col>
-                    <Col xs={"auto px-1"}>
-                        <div className={`tab ${tab === 20 ? 'active' : ''}`}
-                             onClick={() => {setTab(20); setSubTabsVisible(false)}}>표준시방서</div>
-                    </Col>
-                    <Col xs={"auto px-1"}>
-                        <div className={`tab ${[40, 50, 60, 70, 80, 90].includes(tab) ? 'active' : ''}`}
-                             onClick={() => {setTab(40); setSubTabsVisible(true)}}>전문시방서</div>
-                    </Col>
-                </Row>
+
+                <div className="condition bg-fa">
+                    <ul className={"d-flex justify-content-start"}>
+                        <li className="col-auto">
+                            <div className={`tab ${tab === 10 ? 'active' : ''}`}
+                                 onClick={() => {setTab(10); setSubTabsVisible(false)}}>설계기준</div>
+                        </li>
+                        <li className="col-auto">
+                            <div className={`tab ${tab === 20 ? 'active' : ''}`}
+                                 onClick={() => {setTab(20); setSubTabsVisible(false)}}>표준시방서</div>
+                        </li>
+                        <li className="col-auto">
+                            <div className={`tab ${[40, 50, 60, 70, 80, 90].includes(tab) ? 'active' : ''}`}
+                                 onClick={() => {setTab(40); setSubTabsVisible(true)}}>전문시방서</div>
+                        </li>
+                    </ul>
+                </div>
+
+                {/*<Row className={"justify-content-start py-1 mx-1"}>*/}
+                {/*    <Col xs={"auto px-1"}>*/}
+                {/*        <div className={`tab ${tab === 10 ? 'active' : ''}`}*/}
+                {/*                          onClick={() => {setTab(10); setSubTabsVisible(false)}}>설계기준</div>*/}
+                {/*    </Col>*/}
+                {/*    <Col xs={"auto px-1"}>*/}
+                {/*        <div className={`tab ${tab === 20 ? 'active' : ''}`}*/}
+                {/*             onClick={() => {setTab(20); setSubTabsVisible(false)}}>표준시방서</div>*/}
+                {/*    </Col>*/}
+                {/*    <Col xs={"auto px-1"}>*/}
+                {/*        <div className={`tab ${[40, 50, 60, 70, 80, 90].includes(tab) ? 'active' : ''}`}*/}
+                {/*             onClick={() => {setTab(40); setSubTabsVisible(true)}}>전문시방서</div>*/}
+                {/*    </Col>*/}
+                {/*</Row>*/}
                 {subTabsVisible && (
-                    <Nav className={"tabs"} variant={"tabs"} >
+                    <Nav className={"tabs mt-2 text-4c6"} variant={"tabs"} >
                         <Nav.Item><Nav.Link className={`${tab === 40 ? 'active' : ''}`} onClick={() => {setTab(40)}}>서울특별시</Nav.Link></Nav.Item>
                         <Nav.Item><Nav.Link className={`${tab === 50 ? 'active' : ''}`} onClick={() => {setTab(50)}}>고속도로공사</Nav.Link></Nav.Item>
                         <Nav.Item><Nav.Link className={`${tab === 60 ? 'active' : ''}`} onClick={() => {setTab(60)}}>한국농어촌공사</Nav.Link></Nav.Item>
@@ -57,7 +77,7 @@ function DownloadModal({closeFn}){
                         <Nav.Item><Nav.Link className={`${tab === 90 ? 'active' : ''}`} onClick={() => {setTab(90)}}>K-Water</Nav.Link></Nav.Item>
                     </Nav>
                 )}
-                <div className="board_list standard_code_modal download_list">
+                <div className="board_list BRD022 download_list">     {/*standard_code_modal */}
                     <div className="head">
                         <span>구분</span>
                         <span>코드</span>
@@ -72,7 +92,8 @@ function DownloadModal({closeFn}){
                                     <div className="mainCategory">{item.groupNm}</div>
                                     <div className="middleCategory">{item.groupCurCd}</div>
                                     <div className="kcscCd">
-                                        <Button size={"sm"} variant={"outline-secondary"}>다운로드</Button>
+                                        {/*<Button size={"sm"} variant={"outline-secondary"}>다운로드</Button>*/}
+                                        <Link to=""><img src={"/assets/images/down.png"} className={"h_20"} /></Link>
                                     </div>
                                 </div>
                             )
@@ -80,7 +101,7 @@ function DownloadModal({closeFn}){
                     </div>
                 </div>
             </Modal.Body>
-            <Modal.Footer><Button onClick={closeFn}>닫기</Button></Modal.Footer>
+            {/*<Modal.Footer><Button onClick={closeFn}>닫기</Button></Modal.Footer>*/}
         </>
     )
 }

egovframe-template-simple-react-contribution/src/pages/standardCode/list/FavoriteIcon.jsx

@@ -38,7 +38,7 @@ function FavoriteIcon({item}){
                      alert("로그인 후 이용 가능한 서비스 입니다.")
                  }
              }}>
-            <AiFillStar color={favoriteChk?'#FFC000':''}/>
+            <AiFillStar color={favoriteChk?'#FFC000':''} size={25} />
         </div>
     );
 }

egovframe-template-simple-react-contribution/src/pages/standardCode/list/HistoryModal.jsx

@@ -1,4 +1,6 @@
 import React from "react";
+import {Link} from "react-router-dom";
+
 import * as File from "utils/file"
 import {Button, Modal, Nav} from "react-bootstrap";
 
@@ -11,7 +13,7 @@ function HistoryModal({closeFn, standardCode}){
             </Modal.Header>
             <Modal.Body>
                 <div>코드 : {standardCode.kcscCd}</div>
-                <div className="board_list standard_code_modal">
+                <div className="board_list BRD022">
                     <div className="head">
                         <span>고시일</span>
                         <span>기준코드</span>
@@ -25,12 +27,12 @@ function HistoryModal({closeFn, standardCode}){
                                 <div className="list_item">
                                     <div className="mainCategory">{history.rvsnYmd.split('T')[0]}</div>
                                     <div className="middleCategory">
-                                        {history.docFileGrpId}
-                                        {history.docFileGrpId?<Button size={"sm"} variant={"outline-secondary"} onClick={()=>File.standardCode(history.docFileGrpId)}>다운로드 </Button>:''}
+                                        {/*{history.docFileGrpId}*/}
+                                        {history.docFileGrpId?<Link to={""} onClick={()=>File.standardCode(history.docFileGrpId)}><img src={"/assets/images/down.png"} className={"h_20"} /> </Link>:''}
                                     </div>
                                     <div className="kcscCd">
-                                        {history.rvsnFileGrpId}
-                                        {history.rvsnFileGrpId?<Button size={"sm"} variant={"outline-secondary"} onClick={()=>File.download(history.rvsnFileGrpId)}>다운로드 </Button>:''}
+                                        {/*{history.rvsnFileGrpId}*/}
+                                        {history.rvsnFileGrpId?<Link to={""} onClick={()=>File.download(history.rvsnFileGrpId)}><img src={"/assets/images/down.png"} className={"h_20"} /> </Link>:''}
                                     </div>
                                 </div>
                             )
@@ -38,7 +40,7 @@ function HistoryModal({closeFn, standardCode}){
                     </div>
                 </div>
             </Modal.Body>
-            <Modal.Footer><Button onClick={closeFn}>닫기</Button></Modal.Footer>
+            {/*<Modal.Footer><Button onClick={closeFn}>닫기</Button></Modal.Footer>*/}
         </>
     )
 }

egovframe-template-simple-react-contribution/src/pages/standardCode/list/StandardCodeList.jsx

@@ -1,17 +1,19 @@
 import React from 'react';
+import {Link} from 'react-router-dom';
+
 import Col from "react-bootstrap/Col";
 import Row from "react-bootstrap/Row";
 import FavoriteIcon from "./FavoriteIcon";
 import Button from "react-bootstrap/Button";
 
-function StandardCodeList({listData, filterData, getHistoryModal}) {
+function StandardCodeList({listData, filterData, getHistoryModal, isDetailSearchOpen}) {
 
     function historyBtn(item){
         getHistoryModal(item);
     }
 
     return (
-        <div className={"result standard_code_result"}>
+        <div className={isDetailSearchOpen ? 'result standard_code_result_detail' : 'result standard_code_result'}>
             {listData.filter(item => {
                 if (item.groupNm.includes(filterData)) {
                     return item
@@ -19,15 +21,12 @@ function StandardCodeList({listData, filterData, getHistoryModal}) {
                 return null
             }).map(item => {
                 return (
-                    <div className="list_item List_Codes">
+                    <div className="list_item2 List_Codes">
+                        <div className="kcscCd">{item.kcscCd}</div>
+                        <div className="groupNm">{item.groupNm}<br /><span className={"text-danger f_12 pt-0"}>{item.rvsnRemark}</span></div>
                         <div className="mainCategory">{item.mainCategory}</div>
                         <div className="middleCategory">{item.middleCategory}</div>
-                        <div className="kcscCd">{item.kcscCd}</div>
-                        <div className="groupNm">{item.groupNm}<br/><span className={"text-danger"}>{item.rvsnRemark}</span></div>
-                        <div className="Revisionhistory">
-                            <Button size={"sm"} variant={"outline-secondary"} onClick={()=>{historyBtn(item)}}>개정 이력</Button>
-                        </div>
-                        <div className="fille">
+                        <div className="">
                             <Row className={"justify-content-start"}>
                                 {item.historyList.filter(history => {
                                     return history;
@@ -39,25 +38,43 @@ function StandardCodeList({listData, filterData, getHistoryModal}) {
                                     }else{
                                         buttonClass += "btn-primary "
                                     }
+
+                                    const handleClick = () => {
+                                        const rvsnYmd = new Date(history.rvsnYmd);
+                                        rvsnYmd.setHours(rvsnYmd.getHours() + 9);
+                                        window.open("/standardCode/viewer/" + history.kcscCd + ":" + rvsnYmd.toISOString().split('T')[0]);
+                                    };
+
                                     return (
                                         <Col xs={"auto"} className={"px-1"}>
-                                            <input type="button"
-                                                   className={buttonClass}
-                                                   value={history.docEr==='E'?'제':'개'}
-                                                   onClick={()=>{
-                                                       const rvsnYmd = new Date(history.rvsnYmd)
-                                                       rvsnYmd.setHours(rvsnYmd.getHours()+9)
-                                                       window.open("/standardCode/viewer/"+history.kcscCd+":"+rvsnYmd.toISOString().split('T')[0]);
-                                                   }}
+                                            {/*<input type="button"*/}
+                                            {/*       className={buttonClass}*/}
+                                            {/*       value={history.docEr==='E'?'제':'개'}*/}
+                                            {/*       onClick={()=>{*/}
+                                            {/*           const rvsnYmd = new Date(history.rvsnYmd)*/}
+                                            {/*           rvsnYmd.setHours(rvsnYmd.getHours()+9)*/}
+                                            {/*           window.open("/standardCode/viewer/"+history.kcscCd+":"+rvsnYmd.toISOString().split('T')[0]);*/}
+                                            {/*       }}*/}
+                                            {/*/>*/}
+                                            <Link to="" onClick={handleClick}>
+                                            <img
+                                                src={history.docEr === 'E' ? '/assets/images/je.png' : '/assets/images/ge.png'}
+                                                alt={history.docEr === 'E' ? '제' : '개'}
+                                                className={"h_20"}
                                             />
                                             <br/>
                                             <p className={pClass}>{history.docYr}</p>
+                                            </Link>
                                         </Col>
                                     )
                                 })}
                             </Row>
                         </div>
-                        <FavoriteIcon item={item}/>
+                        <div className="Revisionhistory">
+                            {/*<Button size={"sm"} variant={"outline-secondary"} onClick={()=>{historyBtn(item)}}>개정 이력</Button>*/}
+                            <Link to="" onClick={()=>{historyBtn(item)}}><img src={"/assets/images/down.png"} className={"h_20"} /></Link>
+                        </div>
+                        <FavoriteIcon item={item} />
                     </div>
                 )
             })}

egovframe-template-simple-react-contribution/src/pages/standardCode/list/StandardCodePage.jsx

@@ -18,6 +18,7 @@ function StandardCodePage({}) {
     const [resultCnt, setResultCnt] = useState(0);
     const [remarkCnt, setRemarkCnt] = useState(0);
     const [modalContent, setModalContent] = useState([]);
+    const [isDetailSearchOpen, setIsDetailSearchOpen] = useState(false);
 
     const [show, setShow] = useState(false);
     function close() {
@@ -56,39 +57,34 @@ function StandardCodePage({}) {
         setModalContent(<HistoryModal closeFn={close} standardCode={item}/>)
     }
 
+    const toggleDetailSearch = () => {
+        setIsDetailSearchOpen(prevState => !prevState);
+    };
+
     return (
         <div className="">
             <div className="c_wrap">
-                {/*<div className="location">
-                    <ul>
-                        <li><Link to={URL.MAIN} className="home">Home</Link></li>
-                        <li>건설기준코드</li>
-                        <li><Link to={URL.STANDARD_CODE_LIST} >건설기준코드 검색</Link></li>
-                    </ul>
-                </div>*/}
                 <div className="layout">
-                    <div className="contents NOTICE_LIST" id="contents">
-                        {/*<div className="top_tit">
-                            <h1 className="tit_1">건설기준코드 검색</h1>
-                        </div>*/}
-                        <div className="StandardCodeList container">
-                            <div className="c_wrap codeListContent">
-                                <div className="layout">
+                    {/*<div className="contents NOTICE_LIST" id="contents">*/}
+                    {/*    <div className="StandardCodeList container">*/}
+                    {/*        <div className="c_wrap codeListContent">*/}
+                    {/*            <div className="layout">*/}
                                     <div className="contents NOTICE_LIST listTableDiv">
-                                        <StandardCodeSearchForm param={listCode?listCode:'10'} reloadFunction={retrieveList} resultCnt={resultCnt} remarkCnt={remarkCnt} downloadModal={downloadModal}/>
-                                        <div className="board_list code_list">
+                                        <StandardCodeSearchForm param={listCode?listCode:'10'} reloadFunction={retrieveList} resultCnt={resultCnt} remarkCnt={remarkCnt} downloadModal={downloadModal}
+                                                                toggleDetailSearch={toggleDetailSearch} isDetailSearchOpen={isDetailSearchOpen}/>
+                                        <div className="board_list BRD021"> {/*code_list*/}
                                             <div className="head">
-                                                <span>대분류</span>
-                                                <span>중분류</span>
                                                 <span>코드번호</span>
                                                 <span>코드명</span>
+                                                <span>대분류</span>
+                                                <span>중분류</span>
                                                 <span>개정이력</span>
-                                                <span className={"text-start"}>보기</span>
+                                                <span>다운로드</span>
                                                 <span>즐겨찾기</span>
                                             </div>
                                             {
                                                 listLoading?(<Loading loadingState={true}/>):(
-                                                    <StandardCodeList listData={listData} filterData={filterData} getHistoryModal={historyModal}/>
+                                                    <StandardCodeList listData={listData} filterData={filterData} getHistoryModal={historyModal} isDetailSearchOpen={isDetailSearchOpen} />
                                                 )
                                             }
                                         </div>
@@ -96,10 +92,10 @@ function StandardCodePage({}) {
                                             {modalContent}
                                         </Modal>
                                     </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
+                    {/*            </div>*/}
+                    {/*        </div>*/}
+                    {/*    </div>*/}
+                    {/*</div>*/}
                 </div>
             </div>
         </div>

egovframe-template-simple-react-contribution/src/pages/standardCode/list/StandardCodeSearchForm.jsx

@@ -1,12 +1,15 @@
-import React, {useEffect, useState} from "react";
+import React, {useEffect, useState, memo} from "react";
+import {Link} from "react-router-dom";
+import URL from "constants/url";
+
 import {Nav} from "react-bootstrap";
 import Row from "react-bootstrap/Row";
 import Col from "react-bootstrap/Col";
-import {Link} from "react-router-dom";
 import Button from "react-bootstrap/Button";
-import * as EgovNet from "../../../api/egovFetch";
 
-function StandardCodeSearchForm({param, reloadFunction, resultCnt, remarkCnt, downloadModal}){
+import * as EgovNet from "api/egovFetch";
+
+function StandardCodeSearchForm({param, reloadFunction, resultCnt, remarkCnt, downloadModal, toggleDetailSearch, isDetailSearchOpen}){
 
     const [searchCondition, setSearchCondition] = useState({
         tab: Number(param?.substring(0, 2)),
@@ -53,7 +56,7 @@ function StandardCodeSearchForm({param, reloadFunction, resultCnt, remarkCnt, do
         getSelectBoxOption(groupCd, (resp)=>{
             const options = [];
             resp.result.groupList.forEach(function (item, index){
-                options.push(<option value={item.groupCurCd}>{item.groupNm}</option>)
+                options.push(<option key={item.groupCurCd} value={item.groupCurCd}>{item.groupNm}</option>)
             })
             setCat1SelectOption(options)
         })
@@ -65,7 +68,7 @@ function StandardCodeSearchForm({param, reloadFunction, resultCnt, remarkCnt, do
         getSelectBoxOption(groupCd, (resp)=>{
             const options = [];
             resp.result.groupList.forEach(function (item, index){
-                options.push(<option value={item.groupCurCd}>{item.groupNm}</option>)
+                options.push(<option key={item.groupCurCd} value={item.groupCurCd}>{item.groupNm}</option>)
             })
             setCat2SelectOption(options)
         })
@@ -77,88 +80,199 @@ function StandardCodeSearchForm({param, reloadFunction, resultCnt, remarkCnt, do
         getSelectBoxOption(groupCd, (resp)=>{
             const options = [];
             resp.result.groupList.forEach(function (item, index){
-                options.push(<option value={item.groupCurCd}>{item.groupNm}</option>)
+                options.push(<option key={item.groupCurCd} value={item.groupCurCd}>{item.groupNm}</option>)
             })
             setCat3SelectOption(options)
         })
     }, [searchCondition.category2]);
 
+    //상세검색 토글관련
+    const handleSearch = () => {
+        reloadFunction({ param });
+        if (isDetailSearchOpen) {
+            toggleDetailSearch();
+        }
+    };
 
     return (
         <>
-            <div className="condition">
-                <ul>
-                    <li className="third_1 L">
-                        <div className={`tab ${searchCondition.tab === 10 ? 'active' : ''}`}
-                             onClick={() => {setSearchCondition({...searchCondition, tab: 10})}}>설계기준</div>
+            {/* <!-- 검색조건 --> */}
+            <div className="condition my-2 bg-fa">
+                <ul className={"d-flex justify-content-between"}>
+                    <li className="col-auto">
+                        <Button type="button" variant={"outline-22498E"} className="px-4" onClick={downloadModal}>통합다운로드</Button>
                     </li>
-                    <li className="third_1 L">
-                        <div className={`tab ${searchCondition.tab === 20 ? 'active' : ''}`}
-                             onClick={() => {setSearchCondition({...searchCondition, tab: 20})}}>표준시방서</div>
+                    <li className="col-auto">
+                        <Button type="button" variant={"outline-22498E"} className="px-4" href={URL.STANDARD_CODE_INFO}>건설기준코드 안내</Button>
                     </li>
-                    <li className="third_1 L">
-                        <div className={`tab ${[40, 50, 60, 70, 80, 90].includes(searchCondition.tab) ? 'active' : ''}`}
-                             onClick={() => {setSearchCondition({...searchCondition, tab: 40})}}>전문시방서</div>
+                    <li className="w-100">
                     </li>
-                    <li className="third_1 L">
-                        <label className="f_select" htmlFor="sel1">
-                            <select id="sel1" title="조건" value={searchCondition.category1}
-                                    onChange={(e)=>{setSearchCondition({...searchCondition, category1: e.target.value})}}>
-                                <option value="">전체</option>
-                                {cat1SelectOption}
-                            </select>
-                        </label>
-                    </li>
-                    <li className="third_1 L">
-                        <label className="f_select w_306" htmlFor="sel1">
-                            <select id="sel2" title="조건" value={searchCondition.category2}
-                                    onChange={(e)=>{setSearchCondition({...searchCondition, category2: e.target.value})}}>
-                                <option value="">전체</option>
-                                {cat2SelectOption}
-                            </select>
-                        </label>
-                    </li>
-                    <li className="third_1 L">
-                        <label className="f_select w_306" htmlFor="sel1">
-                            <select id="sel3" title="조건" value={searchCondition.category3}
-                                    onChange={(e)=>{setSearchCondition({...searchCondition, category3: e.target.value})}}>
-                                <option value="">전체</option>
-                                {cat3SelectOption}
-                            </select>
-                        </label>
-                    </li>
-                    <li className="third_1 L">
+                    {/*<li className="col-auto">*/}
+                    {/*    <input type="text" name="" placeholder="검색어를 입력해 주세요." className="form-control shadow-none rounded-2" />*/}
+                    {/*</li>*/}
+                    {/*<li className="col-auto">*/}
+                    {/*    <Button type="button" className="btn btn-22498E px-4" onClick={handleSearch}>검색</Button>*/}
+                    {/*</li>*/}
+                    <li className="col-auto d-flex align-items-center">
                         {remarkCnt?(
                             <span>전체 {resultCnt} / <span className={"text-danger"}>{remarkCnt}</span> 건</span>
                         ):(
                             <span>전체 {resultCnt} 건</span>
                         )}
-
                     </li>
-                    <li className="third_1 L">
-                        <div className={`tab`} onClick={downloadModal}>통합 다운로드</div>
+                    <li className="col-auto">
+                        <Button type="button" variant={"outline-22498E"} className="px-4" onClick={toggleDetailSearch}>상세검색 {isDetailSearchOpen ? '∧' : '∨'}</Button>
                     </li>
                 </ul>
             </div>
-            <Row className={"justify-content-between"}>
-                <Col>
-                    {subTabsVisible && (
-                        <Nav className={"tabs"} variant={"tabs"} >
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 40 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 40})}}>서울특별시</Nav.Link></Nav.Item>
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 50 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 50})}}>고속도로공사</Nav.Link></Nav.Item>
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 60 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 60})}}>한국농어촌공사</Nav.Link></Nav.Item>
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 70 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 70})}}>철도건설공사</Nav.Link></Nav.Item>
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 80 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 80})}}>LH한국토지주택공사</Nav.Link></Nav.Item>
-                            <Nav.Item><Nav.Link className={`${searchCondition.tab === 90 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 90})}}>K-Water</Nav.Link></Nav.Item>
-                        </Nav>
-                    )}
-                </Col>
-                <Col xs={"auto"}>
-                    <Button href={"/standardCode/info"} size={"sm"} variant={"secondary"}>건설기준코드 안내</Button>
-                </Col>
-            </Row>
+            {/* <!--// 검색조건 --> */}
+
+            {isDetailSearchOpen && (
+                <div className="detail-search">
+                    {/* 상세 검색 조건을 여기에 추가 */}
+                    <div className="board_view2">
+                        <dl className={"bg-f8f border-bottom"}>
+                            <dd>
+                                <Row>
+                                    <Col xs={"auto"} className={"d-flex align-items-center"}><Button type={"button"} variant={"outline-secondary"} className={"w_20 h_20 px-0 pt-0 me-2 f_12 rounded-0"}>X</Button>설계기준(KDS)</Col>
+                                    <Col xs={"auto"} className={"d-flex align-items-center"}><Button type={"button"} variant={"outline-secondary"} className={"w_20 h_20 px-0 pt-0 me-2 f_12 rounded-0"}>X</Button>설계기준(KDS)</Col>
+                                    <Col xs={"auto"} className={"d-flex align-items-center"}><Button type={"button"} variant={"outline-secondary"} className={"w_20 h_20 px-0 pt-0 me-2 f_12 rounded-0"}>X</Button>설계기준(KDS)</Col>
+                                    <Col xs={"auto"} className={"d-flex align-items-center"}><Button type={"button"} variant={"outline-secondary"} className={"w_20 h_20 px-0 pt-0 me-2 f_12 rounded-0"}>X</Button>설계기준(KDS)</Col>
+                                </Row>
+                            </dd>
+                        </dl>
+                        <dl>
+                            <dt>건설기준</dt>
+                            <dd>
+                                <input type={"checkbox"} name={"chk1"} id={"chk1"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk1">설계기준(KDS)</label>
+                                <input type={"checkbox"} name={"chk2"} id={"chk2"}  className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk2">표준시방서(KCS)</label>
+                            </dd>
+                        </dl>
+                        <dl>
+                            <dt>전문시방서</dt>
+                            <dd>
+                                <input type={"checkbox"} name={"chk3"} id={"chk3"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk3">서울시(SMCS)</label>
+                                <input type={"checkbox"} name={"chk4"} id={"chk4"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk4">고속도로공사(EXCS)</label>
+                                <input type={"checkbox"} name={"chk5"} id={"chk5"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk5">농업생산기반시설(KRCCS)</label>
+                                <input type={"checkbox"} name={"chk6"} id={"chk6"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk6">철도건설공사(KRACS)</label>
+                                <input type={"checkbox"} name={"chk7"} id={"chk7"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk7">LH 한국토지주택공사(LHCS)</label>
+                                <input type={"checkbox"} name={"chk8"} id={"chk8"} className={"form-check-inline me-1"} /> <label className="pe-3" htmlFor="chk8">K-water(KWCS)</label>
+                            </dd>
+                        </dl>
+                        <dl>
+                            <dt>카테고리</dt>
+                            <dd>
+                                <label className="pe-3" htmlFor="sel1">
+                                    <select className={"form-select form-select-sm shadow-none"} id="sel1" title="조건" value={searchCondition.category1}
+                                            onChange={(e)=>{setSearchCondition({...searchCondition, category1: e.target.value})}}>
+                                        <option value="">전체</option>
+                                        {cat1SelectOption}
+                                    </select>
+                                </label>
+                                <label className="pe-3" htmlFor="sel1">
+                                    <select className={"form-select form-select-sm shadow-none"} id="sel2" title="조건" value={searchCondition.category2}
+                                            onChange={(e)=>{setSearchCondition({...searchCondition, category2: e.target.value})}}>
+                                        <option value="">전체</option>
+                                        {cat2SelectOption}
+                                    </select>
+                                </label>
+                                <label className="pe-3" htmlFor="sel1">
+                                    <select className={"form-select form-select-sm shadow-none"} id="sel3" title="조건" value={searchCondition.category3}
+                                            onChange={(e)=>{setSearchCondition({...searchCondition, category3: e.target.value})}}>
+                                        <option value="">전체</option>
+                                        {cat3SelectOption}
+                                    </select>
+                                </label>
+                            </dd>
+                        </dl>
+                        <dl>
+                            <dt>검색어</dt>
+                            <dd>
+                                <input type="text" name="" placeholder="검색어를 입력해 주세요." className="form-control shadow-none rounded-2" />
+                            </dd>
+                        </dl>
+                    </div>
+
+                    <div className="text-center w-100 py-3">
+                        <Button type="button" variant={"secondary"} className="px-4 me-3">초기화</Button>
+                        <Button type="button" variant={"22498E"} className="px-4">상세검색</Button>
+                    </div>
+                </div>
+            )}
+
+            {/*<div className="condition">*/}
+            {/*    <ul>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <div className={`tab ${searchCondition.tab === 10 ? 'active' : ''}`}*/}
+            {/*                 onClick={() => {setSearchCondition({...searchCondition, tab: 10})}}>설계기준</div>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <div className={`tab ${searchCondition.tab === 20 ? 'active' : ''}`}*/}
+            {/*                 onClick={() => {setSearchCondition({...searchCondition, tab: 20})}}>표준시방서</div>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <div className={`tab ${[40, 50, 60, 70, 80, 90].includes(searchCondition.tab) ? 'active' : ''}`}*/}
+            {/*                 onClick={() => {setSearchCondition({...searchCondition, tab: 40})}}>전문시방서</div>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <label className="f_select" htmlFor="sel1">*/}
+            {/*                <select id="sel1" title="조건" value={searchCondition.category1}*/}
+            {/*                        onChange={(e)=>{setSearchCondition({...searchCondition, category1: e.target.value})}}>*/}
+            {/*                    <option value="">전체</option>*/}
+            {/*                    {cat1SelectOption}*/}
+            {/*                </select>*/}
+            {/*            </label>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <label className="f_select w_306" htmlFor="sel1">*/}
+            {/*                <select id="sel2" title="조건" value={searchCondition.category2}*/}
+            {/*                        onChange={(e)=>{setSearchCondition({...searchCondition, category2: e.target.value})}}>*/}
+            {/*                    <option value="">전체</option>*/}
+            {/*                    {cat2SelectOption}*/}
+            {/*                </select>*/}
+            {/*            </label>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <label className="f_select w_306" htmlFor="sel1">*/}
+            {/*                <select id="sel3" title="조건" value={searchCondition.category3}*/}
+            {/*                        onChange={(e)=>{setSearchCondition({...searchCondition, category3: e.target.value})}}>*/}
+            {/*                    <option value="">전체</option>*/}
+            {/*                    {cat3SelectOption}*/}
+            {/*                </select>*/}
+            {/*            </label>*/}
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            {remarkCnt?(*/}
+            {/*                <span>전체 {resultCnt} / <span className={"text-danger"}>{remarkCnt}</span> 건</span>*/}
+            {/*            ):(*/}
+            {/*                <span>전체 {resultCnt} 건</span>*/}
+            {/*            )}*/}
+
+            {/*        </li>*/}
+            {/*        <li className="third_1 L">*/}
+            {/*            <div className={`tab`} onClick={downloadModal}>통합 다운로드</div>*/}
+            {/*        </li>*/}
+            {/*    </ul>*/}
+            {/*</div>*/}
+            {/*<Row className={"justify-content-between"}>*/}
+            {/*    <Col>*/}
+            {/*        {subTabsVisible && (*/}
+            {/*            <Nav className={"tabs"} variant={"tabs"} >*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 40 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 40})}}>서울특별시</Nav.Link></Nav.Item>*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 50 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 50})}}>고속도로공사</Nav.Link></Nav.Item>*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 60 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 60})}}>한국농어촌공사</Nav.Link></Nav.Item>*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 70 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 70})}}>철도건설공사</Nav.Link></Nav.Item>*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 80 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 80})}}>LH한국토지주택공사</Nav.Link></Nav.Item>*/}
+            {/*                <Nav.Item><Nav.Link className={`${searchCondition.tab === 90 ? 'active' : ''}`} onClick={() => {setSearchCondition({...searchCondition, tab: 90})}}>K-Water</Nav.Link></Nav.Item>*/}
+            {/*            </Nav>*/}
+            {/*        )}*/}
+            {/*    </Col>*/}
+            {/*    <Col xs={"auto"}>*/}
+            {/*        <Button href={"/standardCode/info"} size={"sm"} variant={"secondary"}>건설기준코드 안내</Button>*/}
+            {/*    </Col>*/}
+            {/*</Row>*/}
         </>
     );
 }
 
-export default StandardCodeSearchForm;
+export default memo(StandardCodeSearchForm);;

egovframe-template-simple-react-contribution/src/pages/standardCode/viewer/CodeViewer.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useCallback } from 'react';
-import { useLocation, useParams } from 'react-router-dom';
+import { useLocation, useParams, Link } from 'react-router-dom';
 import Loading from 'components/Loading'
 import BookmarkModal from './BookmarkModal';
 import {VwDiv, VwPtag} from './Vw.style'
@@ -31,8 +31,7 @@ function CodeViewer(props) {
     const [show, setShow] = useState(false);
     const [bookMarkModal, setBookMarkModal] = useState();
 
-    const [colList, setColList] = useState([3,2,7]);
-
+    const [colList, setColList] = useState([3,7,2]);
 
     const sessionUser = parseJwt(getLocalItem('accessToken'));
     const sessionUserSe = sessionUser?.userSe;
@@ -71,9 +70,9 @@ function CodeViewer(props) {
                 if(docInfo.length>0){
                     let optionTag = [];
                     let activeIndex = 0;
-                    let docTitle = "";
                     let docFileGrpId = "";
                     let rvsnFileGrpId = "";
+                    let docTitle = "";
                     if(ymd===undefined){
                         activeIndex = docInfo.length-1
                         docTitle = docInfo[docInfo.length-1].doc_nm
@@ -94,8 +93,8 @@ function CodeViewer(props) {
                             buttonClass += "btn-primary "
                         }
                         if(index === activeIndex){
-                            buttonClass += "docInfoActive"
-                            pClass += "yearInfoActive"
+                            buttonClass += "docInfoActive "
+                            pClass += "yearInfoActive "
                             docFileGrpId = item.doc_file_grp_id;
                             rvsnFileGrpId = item.rvsn_file_grp_id;
                         }
@@ -108,25 +107,51 @@ function CodeViewer(props) {
                                        onClick={docInfoSelectorChange}
                                        data-ymd={item.rvsn_ymd}
                                        data-doccode={item.kcsc_cd}
-                                       data-docinfoseq={item.doc_info_seq}/>
-                                <br/>
-                                <p className={pClass}>{item.doc_yr}</p>
+                                       data-docinfoseq={item.doc_info_seq} />
+                                {/*<div onClick={docInfoSelectorChange} value={item.doc_er==='E'?'제':'개'} data-ymd={item.rvsn_ymd} data-doccode={item.kcsc_cd} data-docinfoseq={item.doc_info_seq}>*/}
+                                {/*    <img*/}
+                                {/*        src={item.doc_er === 'E' ? '/assets/images/je.png' : '/assets/images/ge.png'}*/}
+                                {/*        alt={item.rvsn_ymd}*/}
+                                {/*        className={"h_20"}*/}
+                                {/*    />*/}
+                                    <br/>
+                                    <p className={pClass}>{item.doc_yr}</p>
+                                {/*</Button>*/}
                             </Col>)
                     })
                     headTag.push(
                         <>
-                            <Col xs={"auto"}>
-                                <Row className="docInfoRow">
-                                    <Col className="docInfoTitle">{docCode} {docTitle}</Col>
-                                    {optionTag}
+                            <Col xs={3} className={"d-flex align-items-center fw-bold"}>{docCode} {docTitle}</Col>
+                            <Col xs={9}>
+                                <Row className="justify-content-between">
+                                    <Col xs={"auto"}>
+                                        <Row>
+                                            <Col xs={"auto"}>
+                                                <Row className="docInfoRow">
+                                                    {/*<Col className="docInfoTitle">{docCode} {docTitle}</Col>*/}
+                                                    {optionTag}
+                                                </Row>
+                                            </Col>
+                                            <Col className={"d-flex align-items-center"}>
+                                                <Button type="button" variant={"22498E"} className="optionBtn w_75 h_30" >연혁</Button>
+                                                <Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30"  >2단비교</Button>
+                                                {rvsnFileGrpId?<Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30" onClick={()=>{File.download(rvsnFileGrpId)}} >신구조문</Button>:''}
+                                                {docFileGrpId?<Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30" onClick={()=>{File.standardCode(docFileGrpId)}} >첨부파일</Button>:''}
+                                                <Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30" >인용(3)</Button>
+                                                <Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30" >피인용(5)</Button>
+                                                <Button type="button" variant={"22498E"}  className="optionBtn w_75 h_30" >인쇄</Button>
+                                            </Col>
+                                        </Row>
+                                    </Col>
+                                    <Col xs={"auto"}>
+                                        <InputGroup>
+                                            <Form.Control type="text" size={"sm"} placeholder={"문서 내 검색"} className={"me-2 rounded-1"}/>
+                                            {errorSelector}
+                                            <Button type={"button"} variant={"outline-22498E"} className={"px-3 rounded-1 btn-sm"} ><img src={"/assets/images/menu.png"} className={"h_10 mt-1"} /> 목차 닫기</Button>
+                                        </InputGroup>
+                                    </Col>
                                 </Row>
                             </Col>
-                            <Col>
-                                <input type="button" className="btn btn-sm btn-primary optionBtn" value="연혁"/>
-                                <input type="button" className="btn btn-sm btn-primary optionBtn" value="2단비교"/>
-                                {rvsnFileGrpId?<input type="button" className="btn btn-sm btn-primary optionBtn" value="신구조문" onClick={()=>{File.download(rvsnFileGrpId)}}/>:''}
-                                {docFileGrpId?<input type="button" className="btn btn-sm btn-primary optionBtn" value="첨부파일" onClick={()=>{File.standardCode(docFileGrpId)}}/>:''}
-                            </Col>
                         </>
                     )
                 }else{
@@ -262,7 +287,7 @@ function CodeViewer(props) {
                 setDocSummary(summaryTag);
                 setDocDetail(detailTag);
                 if(optionTag.length>0){
-                    errorTag.push(<Form.Select size="sm" onChange={errorSelectorChange}><option value="">선택</option>{optionTag}</Form.Select>)
+                    errorTag.push(<Form.Select size="sm" onChange={errorSelectorChange} className={"me-2 rounded-1"}><option value="">선택</option>{optionTag}</Form.Select>)
                     setErrorSelector(errorTag);
                 }
                 setDocLoading(false);
@@ -403,9 +428,9 @@ function CodeViewer(props) {
     }
     function treeControl(){
         if(colList[0]===3){
-            setColList([0,3,9]);
+            setColList([0,10,2]);
         }else{
-            setColList([3,2,7]);
+            setColList([3,7,2]);
         }
     }
 
@@ -422,38 +447,44 @@ function CodeViewer(props) {
             <Loading loadingState={treeLoading || docLoading}/>
             <Row className={`mx-0 ${treeLoading || docLoading?'d-none':''}`}>
                 <Col xs={12} className="border-bottom">
-                    <Row>
-                        <Col xs={3}></Col>
-                        <Col xs={9}>
-                            <Row className="justify-content-between">
-                                <Col xs={"auto"}>
-                                    <Row>
+                    <Row className={"pt-1"}>
+                        {/*<Col xs={3}></Col>*/}
+                        {/*<Col xs={9}>*/}
+                        {/*    <Row className="justify-content-between">*/}
+                        {/*        <Col xs={"auto"}>*/}
+                        {/*            <Row>*/}
                                         {docInfo}
-                                    </Row>
-                                </Col>
-                                <Col xs={"auto"}>
-                                    <InputGroup>
-                                        <Form.Control type="text" size={"sm"} placeholder={"문서 내 검색"}/>
-                                        {errorSelector}
-                                    </InputGroup>
-                                </Col>
-                            </Row>
-                        </Col>
+                        {/*            </Row>*/}
+                        {/*        </Col>*/}
+                        {/*        <Col xs={"auto"}>*/}
+                        {/*            <InputGroup>*/}
+                        {/*                <Form.Control type="text" size={"sm"} placeholder={"문서 내 검색"}/>*/}
+                        {/*                {errorSelector}*/}
+                        {/*            </InputGroup>*/}
+                        {/*        </Col>*/}
+                        {/*    </Row>*/}
+                        {/*</Col>*/}
                     </Row>
                 </Col>
                 <Col xs={colList[0]} className={`border-end viewerDiv ${colList[0]===3?'':'d-none'}`}>
                     {/*{codeTree}*/}
                     <ViewerTree docCode={docCode} updateDocCode={updateDocCode} setTreeLoading={setTreeLoading}/>
                 </Col>
-                <Col xs={colList[1]} className="border-end viewerDiv">
-                    <div>
-                        <Button size={"sm"} variant={"outline-secondary"} onClick={treeControl}>{colList[0]===3?'트리 접기':'트리 펼치기'}</Button>
+                <Col xs={colList[1]} className="viewerDiv detailInfoDiv" ref={actionAppend}>
+                    <div className={"datailcollapse"}>
+                        {/*<Button size={"sm"} variant={"outline-secondary"} onClick={treeControl}>{colList[0]===3?'트리 접기':'트리 펼치기'}</Button>*/}
+                        <img
+                            src={colList[0]===3 ? "/assets/images/close.png" : "/assets/images/open.png"}
+                            alt={colList[0]===3 ? "접기" : "열기"}
+                            onClick={treeControl}
+                            className={"cursor"}
+                        />
                     </div>
-                    {docSummary}
-                </Col>
-                <Col xs={colList[2]} className="viewerDiv detailInfoDiv" ref={actionAppend}>
                     {docDetail}
                 </Col>
+                <Col xs={colList[2]} className="border-end viewerDiv">
+                    {docSummary}
+                </Col>
             </Row>
             <Modal show={show} onHide={handleClose} size="xl" keyboard={false} scrollable>
                 {bookMarkModal}

egovframe-template-simple-react-contribution/src/pages/standardCode/viewer/SbItem.jsx

@@ -30,7 +30,7 @@ const SbItem = ({item, openDocCode, updateDocCode}) => {
                 <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} openDocCode={openDocCode} updateDocCode={updateDocCode} />
+                        <SbItem key={child.seq} item={child} openDocCode={openDocCode} updateDocCode={updateDocCode} />
                     ))}
                 </SbSub>
             </div>

egovframe-template-simple-react-contribution/src/pages/standardCode/viewer/ViewerTree.jsx

@@ -38,7 +38,7 @@ function ViewerTree({docCode, updateDocCode, setTreeLoading}){
     return (
         <SbContainer>
             {tree.map((subItem) =>
-                <SbItem item={subItem} openDocCode={docCode} updateDocCode={updateDocCode} />
+                <SbItem key={subItem.seq} item={subItem} openDocCode={docCode} updateDocCode={updateDocCode} />
             )}
         </SbContainer>
     );

egovframe-template-simple-react-contribution/src/pages/standardCode/viewer/ViwerComponents.jsx

@@ -67,7 +67,7 @@ export function CodeTree({docCode, setdoccodandname}) {
 //TODO 추가 분리 작업 필요
 export function CodeCotentData({docCode}) {
     const [codeChapter, setcodeChapter] = useState([]);
-    const [codeContent, setcodeContetn] = useState([]);
+    const [codeContent, setcodeContent] = useState([]);
     let result =[];
     const getCodeDetail = (docCode) => {
         EgovNet.requestFetch(
@@ -98,7 +98,7 @@ export function CodeCotentData({docCode}) {
             </VwDiv>
             )
         }))
-        setcodeContetn(result.map(item =>{
+        setcodeContent(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

egovframe-template-simple-react-contribution/src/pages/support/Detail.jsx

@@ -1,5 +1,5 @@
-import React, { useState } from 'react';
-import {Link, useNavigate} from 'react-router-dom';
+import React, {useCallback, useEffect, useState} from 'react';
+import {Link, useLocation, useNavigate, useParams} from 'react-router-dom';
 
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
@@ -7,10 +7,24 @@ import URL from 'constants/url';
 import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col';
 import Button from 'react-bootstrap/Button';
+import {format} from "date-fns";
+import DOMPurify from 'dompurify';
+import CODE from "../../constants/code";
+
 
 function Detail(){
     const navigate = useNavigate();
 
+    const {bbsContSeq} = useParams();
+    console.log("@@@ bbsContSeq : " + bbsContSeq);
+
+    const location = useLocation();
+    const item = location.state?.item;
+    console.log("@@@ item : " + JSON.stringify(item));
+
+    const [listTag, setListTag] = useState([]);
+    const [comment, setComment] = useState('');
+
     const goToList = () => {
         navigate('/support/list/KCSC-QA');
     };
@@ -19,6 +33,114 @@ function Detail(){
         navigate('/support/create/KCSC-QA');
     };
 
+    const retrieveList = useCallback(() => {
+        console.log("@@@ retrieveList 호출됨");
+        const retrieveListURL = '/user/boards/reply/reply-list?bbsContSeq=' + bbsContSeq;
+
+        const requestOptions = {
+            method: "GET",
+            headers: {
+                'Content-type': 'application/json',
+            }
+        }
+
+        EgovNet.requestFetch(retrieveListURL,
+            requestOptions,
+            (resp) => {
+                let mutListTag = [];
+                setListTag([]);
+                resp.result.replyList.forEach(function (item) {
+                    const finalModifiedDate = item?.lastChgDt || item?.frstCrtDt;
+                    const formattedDate = finalModifiedDate ? format(finalModifiedDate, "yyyy-MM-dd HH:mm:ss") : "";
+                    mutListTag.push(
+                        <li key={item.replSeq}>
+                            <span>{item?.frstCrtId}, {formattedDate}</span>
+                            {item?.replCont}
+                            <Link to="#" className="btn delete" onClick={() => deleteReply(item.replSeq)}>삭제</Link>
+                        </li>
+                    );
+                });
+                if(!mutListTag.length) mutListTag.push(<p className="no_data" key="0">댓글이 없습니다.</p>); // 댓글 목록 초기값
+                setListTag(mutListTag);
+            },
+            function (resp) {
+                console.log("err response : ", resp);
+            }
+        );
+    },[bbsContSeq]);
+
+    useEffect(() => {
+        retrieveList();
+    }, []);
+
+    const handleChange = (event) => {
+        setComment(event.target.value);
+    };
+
+    const handleSubmit = (e) => {
+        console.log(comment);
+        editReply(e);
+    };
+
+    const editReply = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+
+        const data = {
+            bbsContSeq: bbsContSeq,
+            replCont: comment
+        };
+        console.log("@@@ data : " + JSON.stringify(data));
+        EgovNet.requestFetch(
+            '/user/boards/reply/reply-mgt',
+            {
+                method: "POST",
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(data)
+            },
+            (resp) => {
+                if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) {
+                    alert("저장되었습니다.");
+                    setComment('');
+                    retrieveList();
+                } else if (Number(resp.resultCode) === Number(CODE.RCV_ERROR_AUTH)) {
+                    console.log("토큰 갱신중.")
+                } else {
+                    alert(resp.result.resultMessage)
+                }
+            }
+        )
+    }
+
+    const deleteReply = (replSeq) => {
+        if (window.confirm("삭제하시겠습니까?")) {
+            EgovNet.requestFetch(
+                '/user/boards/reply/reply-mgt',
+                {
+                    method: "DELETE",
+                    headers: {
+                        'Content-type': 'application/json'
+                    },
+                    body: JSON.stringify({replSeq})
+                },
+                (resp) => {
+                    if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) {
+                        console.log("@@@ 삭제 성공, retrieveList 호출");
+                        retrieveList();
+                    } else if (Number(resp.resultCode) === Number(CODE.RCV_ERROR_AUTH)) {
+                        console.log("토큰 갱신중.")
+                    } else {
+                        alert(resp.result.resultMessage)
+                    }
+                }
+            )
+        }
+    }
+
+
+
     return (
         <div className="container">
             <div className="c_wrap">
@@ -45,38 +167,34 @@ function Detail(){
                                 </dd>
                                 <dt>등록일자</dt>
                                 <dd>
-                                    2011-08-08 11:11:11
+                                    {format(new Date(item.frstCrtDt), 'yyyy-MM-dd HH:mm:ss')}
                                 </dd>
                             </dl>
                             <dl>
                                 <dt>작성자</dt>
                                 <dd>
-                                    박성환
+                                    {item.frstCrtId}
                                 </dd>
                                 <dt>조회</dt>
                                 <dd>
-                                    100
+                                    {item.bbsReadCnt}
                                 </dd>
                             </dl>
                             <dl>
                                 <dt>첨부파일</dt>
                                 <dd>
                                     <span className="file_attach">
-                                        <Link to="">file_name.hwp</Link> <span>[3626] byte</span>
+                                        <Link to="">{item.fileGrpId}</Link> <span>[3626] byte</span>
                                     </span>
                                 </dd>
                             </dl>
                             <dl>
-                                <dd>[공지] jsp파일을 못찼습니다. 제목 뿌려주세요.</dd>
+                                <dd>{item.bbsContTitle}</dd>
                             </dl>
                         </div>
                         <div className="qna_q">
                             <span>Q</span>
-                            안녕하세요 웹호스팅에 올렸더니 jsp파일에서 이런에러로그가 남았는데요 jsp파일을 못찾는것같습니다? xml을 수정해야하나요?<br/>
-                            심각: Servlet.service() for servlet action threw exception<br/>
-                            javax.servlet.ServletException: Could not get RequestDispatcher for [/WEB-INF/jsp/egovframework//main/main.jsp]: check that
-                            this file exists within your WAR<br/>
-                            at org.springframework.web.servlet.view.InternalResourceView.renderMergedOutputModel(InternalResourceView.java:217)
+                            <div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(item.bbsContents) }}></div>
                         </div>
                         <div className="qna_a">
                             <span>A</span>
@@ -108,32 +226,18 @@ function Detail(){
                             </Col>
                             <Col xs={10} className="">
                                 {/*<div>*/}
-                                    <textarea className="f_txtar w-100 h-100" name="" id="replay_write" rows="4"></textarea>
+                                    <textarea className="f_txtar w-100 h-100" name="" id="replay_write" rows="4"
+                                              value={comment} onChange={handleChange}></textarea>
                                 {/*</div>*/}
                             </Col>
                             <Col xs={1} className="">
-                                <Button type={"button"} className="btn btn-22498E w-100 h-100" >등록</Button>
+                                <Button type={"button"} className="btn btn-22498E w-100 h-100" onClick={handleSubmit}>등록</Button>
                             </Col>
                         </Row>
                         {/* <!--// 답변달기 --> */}
                         <div className="qna_a">
                             <ul>
-                                <li>
-                                    <span>chanjin, 2011-08-08 12:33:33</span>
-                                    심각: Servlet.service() for servlet action threw exception은 jsp파일을 열어서 보셔야합니다.<br />
-                                    javax.servlet.ServletException: Could not get RequestDispatcher for [/WEB-INF/jsp/egovframework//main/main.jsp]: check that<br />
-                                    <Link to="#" className="btn delete">삭제</Link>
-                                </li>
-                                <li>
-                                    <span>sunrise, 2011-08-07 11:11:11</span>
-                                    tomcat서버를 재시동해보세요. 전 그렇게 하니깐 되던데요.
-                                    <Link to="#" className="btn delete">삭제</Link>
-                                </li>
-                                <li>
-                                    <span>auto, 2011-08-07 11:11:11</span>
-                                    제가 살펴볼께요 메일로 주세요. test@naver.com
-                                    <Link to="#" className="btn delete">삭제</Link>
-                                </li>
+                                {listTag}
                             </ul>
                         </div>
 

egovframe-template-simple-react-contribution/src/pages/support/List.jsx

@@ -1,5 +1,5 @@
-import React, { useState } from 'react';
-import {Link, useNavigate} from 'react-router-dom';
+import React, {useCallback, useEffect, useState} from 'react';
+import {Link, useLocation, useNavigate, useParams} from 'react-router-dom';
 
 import * as EgovNet from 'api/egovFetch';
 import URL from 'constants/url';
@@ -7,6 +7,9 @@ import URL from 'constants/url';
 import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col';
 import Button from 'react-bootstrap/Button';
+import {format} from "date-fns";
+import EgovPaging from "../../components/EgovPaging";
+import Detail from "./Detail";
 
 function List(){
     const navigate = useNavigate();
@@ -14,6 +17,95 @@ function List(){
     const goToCreate = () => {
         navigate('/support/create/KCSC-QA');
     };
+    const location = useLocation();
+
+    const {BbsCode} = useParams();
+    const [searchCondition, setSearchCondition] = useState(location.state?.searchCondition || { pageIndex: 1, searchCnd: '0', searchKeyword: '', bbsId:BbsCode });// 기존 조회에서 접근 했을 시 || 신규로 접근 했을 시
+    const [paginationInfo, setPaginationInfo] = useState({});
+    const [listTag, setListTag] = useState([]);
+    const [categoryList, setCategoryList] = useState([]);
+
+    const [show, setShow] = useState(false);
+    const [modalBody, setModalBody] = useState();
+    const handleClose = () => setShow(false);
+    const handleShow = () => setShow(true);
+
+    console.log("@@@ BbsCode : " + BbsCode);
+
+    function Detail(item) {
+        const detailUrl = '/support/detail/' + item.bbsContSeq;
+        console.log(detailUrl);
+        navigate(detailUrl, {state : {item}});
+    }
+
+    const retrieveList = useCallback((searchCondition) => {
+        handleClose();
+        const params = EgovNet.convParams(searchCondition);
+
+        console.groupCollapsed("EgovUserPostList.retrieveList()");
+
+        const retrieveListURL = '/user/boards/posts/post-list' + params;
+
+        const requestOptions = {
+            method: "GET",
+            headers: {
+                'Content-type': 'application/json',
+
+            }
+        }
+
+        EgovNet.requestFetch(retrieveListURL,
+            requestOptions,
+            (resp) => {
+                setPaginationInfo(resp.result.paginationInfo);
+                setCategoryList(resp.result.categoryList);
+                console.log("@@@ resultCnt : " + resp.result.resultCnt);
+
+                let mutListTag = [];
+                setListTag([]);
+                resp.result.fixedList.forEach(function (item) {
+                    const finalModifiedDate = item?.lastChgDt ? item?.lastChgDt : item?.frstCrtDt;
+                    const formattedDate = finalModifiedDate ? format(finalModifiedDate, "yyyy-MM-dd") : "";
+                    mutListTag.push(
+                        <div className="list_item">
+                            <div>공지</div>
+                            <div className="al" onClick={()=>{Detail(item)}}>{item?.bbsContTitle}</div>
+                            <div>{item?.frstCrtId}</div>
+                            <div>{item?.bbsReadCnt}</div>
+                            <div>{formattedDate}</div>
+                            <div>{item?.fileGrpId && <img src="/assets/images/file.png" />}</div>
+                        </div>
+                    );
+                });
+
+                resp.result.postList.forEach(function (item, index) {
+                    const finalModifiedDate = item?.lastChgDt ? item?.lastChgDt : item?.frstCrtDt;
+                    const formattedDate = finalModifiedDate ? format(finalModifiedDate, "yyyy-MM-dd") : "";
+                    mutListTag.push(
+                        <div className="list_item">
+                            <div>{resp.result.resultCnt - (resp.result.paginationInfo.pageIndex -1) * resp.result.paginationInfo.rowCnt - index}</div>
+                            <div className="al" onClick={()=>{Detail(item)}}>{item?.bbsContTitle}</div>
+                            <div>{item?.frstCrtId}</div>
+                            <div>{item?.bbsReadCnt}</div>
+                            <div>{formattedDate}</div>
+                            <div>{item?.fileGrpId && <img src="/assets/images/file.png" />}</div>
+                        </div>
+                    );
+                });
+                if(!mutListTag.length) mutListTag.push(<p className="no_data" key="0">검색된 결과가 없습니다.</p>); // 게시판 목록 초기값
+                setListTag(mutListTag);
+            },
+            function (resp) {
+                console.log("err response : ", resp);
+            }
+        );
+        console.groupEnd("EgovUserPostList.retrieveList()");
+    },[listTag]);
+
+    useEffect(() => {
+        retrieveList(searchCondition);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [searchCondition]);
 
 
     return (
@@ -72,7 +164,8 @@ function List(){
                                 {/* <p className="no_data" key="0">검색된 결과가 없습니다.</p> */}
 
                                 {/* <!-- case : 데이터 있을때 --> */}
-                                <Link to={URL.SUPPORT_DETAIL_NOCODE+'/KCSC-NTC'} className="list_item">
+                                {listTag}
+                                {/*<Link to={URL.SUPPORT_DETAIL_NOCODE+'/KCSC-NTC'} className="list_item">
                                     <div>3</div>
                                     <div className="al">[공지] 공통컴포넌트 중 모니터링 관련 서비스 실행시 오류가 발생합니다 [15] <img src="/assets/images/lock.png" className="pt-1" /> <img src="/assets/images/new.png" className="pt-1" /></div>
                                     <div>관리자</div>
@@ -91,16 +184,16 @@ function List(){
                                 <Link to={URL.SUPPORT_DETAIL_NOCODE+'/KCSC-NTC'} className="list_item">
                                     <div>1</div>
                                     <div className="al d-flex align-items-center">
-                                        {/*미답변시 아이콘*/}
+                                        미답변시 아이콘
                                         <img src="/assets/images/icon_answer0.png" className="pt-1 h_30 pb-1" /> &nbsp;
-                                        {/*답변완료시 아이콘*/}
-                                        {/*<img src="/assets/images/icon_answer.png" className="pt-1 h_30 pb-1" /> &nbsp;*/}
+                                        답변완료시 아이콘
+                                        <img src="/assets/images/icon_answer.png" className="pt-1 h_30 pb-1" /> &nbsp;
                                         공통컴포넌트 중 모니터링 관련 서비스 실행시 오류가 발생합니다.</div>
                                     <div>홍길동</div>
                                     <div>3</div>
                                     <div>2021-7-24</div>
                                     <div></div>
-                                </Link>
+                                </Link>*/}
                             </div>
                         </div>
                         {/* <!--// 게시판목록 --> */}
@@ -108,23 +201,10 @@ function List(){
                         <Row className="board_bot justify-content-between">
                             <Col xs={3} className=""></Col>
                             {/* <!-- Paging --> */}
-                            <Col xs={6} className="paging">
-                                <ul>
-                                    <li className="btn"><button to="" className="first">처음</button></li>
-                                    <li className="btn"><button to="" className="prev">이전</button></li>
-                                    <li><button to="" className="cur">1</button></li>
-                                    <li><button to="">2</button></li>
-                                    <li><button to="">3</button></li>
-                                    <li><button to="">4</button></li>
-                                    <li><button to="">5</button></li>
-                                    <li><button to="">6</button></li>
-                                    <li><button to="">7</button></li>
-                                    <li><button to="">8</button></li>
-                                    <li><button to="">9</button></li>
-                                    <li><button to="">10</button></li>
-                                    <li className="btn"><button to="" className="next">다음</button></li>
-                                    <li className="btn"><button to="" className="last">마지막</button></li>
-                                </ul>
+                            <Col xs={6}>
+                                <EgovPaging pagination={paginationInfo} moveToPage={passedPage => {
+                                    retrieveList({ ...searchCondition, pageIndex: passedPage}) //, searchCnd: cndRef.current.value, searchKeyword: wrdRef.current.value
+                                }} />
                             </Col>
                             {/* <!--/ Paging --> */}
 

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/admin/boards/AdminBoardsController.java

@@ -2,10 +2,9 @@ package com.dbnt.kcscbackend.admin.boards;
 
 import com.dbnt.kcscbackend.admin.boards.entity.TnBbs;
 import com.dbnt.kcscbackend.admin.boards.entity.TnBbsContents;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsRepl;
 import com.dbnt.kcscbackend.admin.boards.service.AdminBoardsService;
-import com.dbnt.kcscbackend.admin.config.entity.TcMenu;
 import com.dbnt.kcscbackend.auth.entity.LoginVO;
-import com.dbnt.kcscbackend.commonCode.CommonCodeController;
 import com.dbnt.kcscbackend.commonCode.service.CommonCodeService;
 import com.dbnt.kcscbackend.config.common.BaseController;
 import com.dbnt.kcscbackend.config.common.ResponseCode;
@@ -26,7 +25,6 @@ import org.springframework.web.bind.annotation.*;
 import org.springframework.web.multipart.MultipartFile;
 
 import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpServletResponse;
 import javax.validation.Valid;
 import java.util.ArrayList;
 import java.util.HashMap;
@@ -171,15 +169,15 @@ public class AdminBoardsController extends BaseController {
             @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
     })
     @RequestMapping(method = RequestMethod.GET, value = "/posts/post-list", consumes = MediaType.APPLICATION_JSON_VALUE)
-    public ResultVO getPostList(TnBbsContents params) throws Exception {
+    public ResultVO getPostList(TnBbsContents tnBbsContents) throws Exception {
         ResultVO resultVO = new ResultVO();
-        params.setQueryInfo();
-        Map<String, Object> resultMap = adminBoardsService.selectPostList(params);
+        tnBbsContents.setQueryInfo();
+        Map<String, Object> resultMap = adminBoardsService.selectPostList(tnBbsContents);
         resultMap.put("categoryList", adminBoardsService.selectBoardList());
         int totCnt = Integer.parseInt((String)resultMap.get("resultCnt"));
-        params.setContentCnt(totCnt);
-        params.setPaginationInfo();
-        resultMap.put("paginationInfo", params);
+        tnBbsContents.setContentCnt(totCnt);
+        tnBbsContents.setPaginationInfo();
+        resultMap.put("paginationInfo", tnBbsContents);
         resultVO.setResult(resultMap);
         return resultVO;
     }

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/admin/boards/entity/TnBbsRepl.java

@@ -0,0 +1,57 @@
+package com.dbnt.kcscbackend.admin.boards.entity;
+import com.dbnt.kcscbackend.config.common.BoardParams;
+import lombok.Getter;
+import lombok.NoArgsConstructor;
+import lombok.Setter;
+import org.hibernate.annotations.DynamicInsert;
+import org.hibernate.annotations.DynamicUpdate;
+
+import javax.persistence.*;
+import java.time.LocalDateTime;
+
+@Getter
+@Setter
+@Entity
+@NoArgsConstructor
+@DynamicInsert
+@DynamicUpdate
+@Table(name = "tn_bbs_repl")
+public class TnBbsRepl extends BoardParams {
+  @Id
+  @GeneratedValue(strategy = GenerationType.IDENTITY)
+  @Column(name = "repl_seq")
+  private Long replSeq;
+
+  @Column(name = "bbs_cont_seq", nullable = false)
+  private Long bbsContSeq;
+
+  @Column(name = "repl_cont", nullable = false, length = 550)
+  private String replCont;
+
+  @Column(name = "repl_cont_parent")
+  private Long replContParent;
+
+  @Column(name = "repl_cont_level", nullable = false)
+  private Long replContLevel;
+
+  @Column(name = "ip_address", nullable = false, length = 50)
+  private String ipAddress;
+
+  @Column(name = "frst_crt_id", nullable = false, length = 50)
+  private String frstCrtId;
+
+  @Column(name = "frst_crt_dt", nullable = false)
+  private LocalDateTime frstCrtDt;
+
+  @Column(name = "last_chg_id", length = 50)
+  private String lastChgId;
+
+  @Column(name = "last_chg_dt")
+  private LocalDateTime lastChgDt;
+
+  @Column(name = "use_yn", nullable = false, columnDefinition = "bpchar(1)")
+  private String useYn;
+
+  @Column(name = "old_seq")
+  private Long oldSeq;
+}

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/admin/boards/repository/TnBbsReplRepository.java

@@ -0,0 +1,14 @@
+package com.dbnt.kcscbackend.admin.boards.repository;
+
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbs;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsRepl;
+import org.springframework.data.jpa.repository.JpaRepository;
+
+import java.util.List;
+import java.util.Optional;
+
+public interface TnBbsReplRepository extends JpaRepository<TnBbsRepl, Long> {
+
+    List<TnBbsRepl> findByBbsContSeq(Long bbsContSeq);
+    Long countByBbsContSeq(Long bbsContSeq);
+}

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/admin/boards/service/AdminBoardsService.java

@@ -2,11 +2,13 @@ package com.dbnt.kcscbackend.admin.boards.service;
 
 import com.dbnt.kcscbackend.admin.boards.entity.TnBbs;
 import com.dbnt.kcscbackend.admin.boards.entity.TnBbsContents;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsRepl;
 import com.dbnt.kcscbackend.admin.boards.mapper.AdminBoardsMapper;
 import com.dbnt.kcscbackend.admin.boards.repository.TnBbsContentsRepository;
+import com.dbnt.kcscbackend.admin.boards.repository.TnBbsReplRepository;
 import com.dbnt.kcscbackend.admin.boards.repository.TnBbsRepository;
-import com.dbnt.kcscbackend.admin.config.entity.TcMenu;
 import com.dbnt.kcscbackend.auth.entity.LoginVO;
+import com.dbnt.kcscbackend.config.util.ClientUtils;
 import com.dbnt.kcscbackend.file.entity.TnAttachFile;
 import com.dbnt.kcscbackend.file.service.FileService;
 import lombok.RequiredArgsConstructor;
@@ -26,6 +28,7 @@ public class AdminBoardsService extends EgovAbstractServiceImpl {
 
     private final TnBbsRepository tnBbsRepository;
     private final TnBbsContentsRepository tnBbsContentsRepository;
+    private final TnBbsReplRepository tnBbsReplRepository;
     private final AdminBoardsMapper adminBoardsMapper;
     private final FileService fileService;
 

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/standardCode/repository/TnDocumentContentRepository.java

@@ -1,10 +1,10 @@
 package com.dbnt.kcscbackend.standardCode.repository;
 
-
 import com.dbnt.kcscbackend.standardCode.entity.TnDocumentContent;
 import com.dbnt.kcscbackend.standardCode.service.StandardCodeContentInterface;
 import org.springframework.data.jpa.repository.JpaRepository;
 import org.springframework.data.jpa.repository.Query;
+import org.springframework.data.repository.query.Param;
 
 import java.util.List;
 import java.util.Optional;
@@ -12,13 +12,21 @@ import java.util.Optional;
 public interface TnDocumentContentRepository extends JpaRepository<TnDocumentContent, Integer> {
 
   @Query(value = "select * from get_recent_full_context_by_content(:docCode, :docPart)", nativeQuery = true)
-  List<StandardCodeContentInterface> getRecentFullContextByContent(String docCode, String docPart);
+  List<StandardCodeContentInterface> getRecentFullContextByContent(
+          String docCode,
+          String docPart);
 
   @Query(value = "select * from get_year_full_context_by_content(:docInfoSeq, :docCode, :docPart, null, null)", nativeQuery = true)
-  List<StandardCodeContentInterface> getYearFullContextByContent(Integer docInfoSeq, String docCode, String docPart);
+  List<StandardCodeContentInterface> getYearFullContextByContent(
+          Integer docInfoSeq,
+          String docCode,
+          String docPart);
 
   @Query(value = "select * from sp_get_recent_full_context_by_content(:docCode, :docPart, :ymd)", nativeQuery = true)
-  List<StandardCodeContentInterface> spGetRecentFullContextByContent(String docCode, String docPart, String ymd);
+  List<StandardCodeContentInterface> spGetRecentFullContextByContent(
+          String docCode,
+          String docPart,
+          String ymd);
 
   Optional<TnDocumentContent> findByDocContSeq(Integer docContSeq);
 

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/standardCode/repository/TnDocumentInfoRepository.java

@@ -4,6 +4,7 @@ import com.dbnt.kcscbackend.standardCode.entity.TnDocumentInfo;
 import com.dbnt.kcscbackend.standardCode.service.TnDocumentInfoInterface;
 import org.springframework.data.jpa.repository.JpaRepository;
 import org.springframework.data.jpa.repository.Query;
+import org.springframework.data.repository.query.Param;
 
 import java.util.List;
 import java.util.Optional;

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/user/UserBoardsController.java

@@ -0,0 +1,255 @@
+package com.dbnt.kcscbackend.user;
+
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsContents;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsRepl;
+import com.dbnt.kcscbackend.admin.boards.service.AdminBoardsService;
+import com.dbnt.kcscbackend.auth.entity.LoginVO;
+import com.dbnt.kcscbackend.commonCode.service.CommonCodeService;
+import com.dbnt.kcscbackend.config.common.BaseController;
+import com.dbnt.kcscbackend.config.common.ResponseCode;
+import com.dbnt.kcscbackend.config.common.ResultVO;
+import com.dbnt.kcscbackend.config.util.ClientUtils;
+import com.dbnt.kcscbackend.file.entity.TnAttachFile;
+import com.dbnt.kcscbackend.file.service.FileService;
+import com.dbnt.kcscbackend.user.service.UserBoardsService;
+import io.swagger.v3.oas.annotations.Operation;
+import io.swagger.v3.oas.annotations.responses.ApiResponse;
+import io.swagger.v3.oas.annotations.responses.ApiResponses;
+import io.swagger.v3.oas.annotations.tags.Tag;
+import lombok.RequiredArgsConstructor;
+import org.springframework.http.MediaType;
+import org.springframework.security.core.annotation.AuthenticationPrincipal;
+import org.springframework.validation.Errors;
+import org.springframework.validation.FieldError;
+import org.springframework.web.bind.annotation.*;
+import org.springframework.web.multipart.MultipartFile;
+
+import javax.servlet.http.HttpServletRequest;
+import javax.validation.Valid;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+@RestController
+@RequiredArgsConstructor
+@RequestMapping("/user/boards")
+@Tag(name = "UserBoardsController", description = "사이트관리 게시판현황")
+public class UserBoardsController extends BaseController {
+
+    private final AdminBoardsService adminBoardsService;
+    private final UserBoardsService userBoardsService;
+    private final CommonCodeService commonCodeService;
+    private final FileService fileService;
+
+    /* ---- 게시물관리 ----- */
+    @Operation(
+            summary = "게시물 목록 조회",
+            description = "게시물 목록 조회",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "조회 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.GET, value = "/posts/post-list", consumes = MediaType.APPLICATION_JSON_VALUE)
+    public ResultVO getPostList(TnBbsContents tnBbsContents) throws Exception {
+        ResultVO resultVO = new ResultVO();
+        tnBbsContents.setQueryInfo();
+        Map<String, Object> resultMap = adminBoardsService.selectPostList(tnBbsContents);
+        resultMap.put("categoryList", adminBoardsService.selectBoardList());
+        int totCnt = Integer.parseInt((String)resultMap.get("resultCnt"));
+        tnBbsContents.setContentCnt(totCnt);
+        tnBbsContents.setPaginationInfo();
+        resultMap.put("paginationInfo", tnBbsContents);
+        resultVO.setResult(resultMap);
+        return resultVO;
+    }
+
+    @Operation(
+            summary = "게시물 카테고리 셀렉트박스 옵션, 파일 목록 조회",
+            description = "게시물 카테고리 셀렉트박스 옵션, 파일 목록 조회",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "조회 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.POST, value = "/posts/get-category-and-file-list", consumes = MediaType.APPLICATION_JSON_VALUE)
+    public ResultVO getCategoryList(@RequestBody TnBbsContents tnBbsContents) throws Exception {
+        ResultVO resultVO = new ResultVO();
+        Map<String, Object> resultMap = new HashMap<>();
+
+        resultMap.put("categoryList", adminBoardsService.selectBoardList());
+        //첨부파일명을 가져온다.
+        List<TnAttachFile> tnAttachFileList = fileService.findByFileGrpId(tnBbsContents.getFileGrpId());
+        System.out.println("@@@ fileGrpId : " + tnBbsContents.getFileGrpId());
+
+        if (tnAttachFileList != null) {
+            List<Map<String, Object>> files = new ArrayList<Map<String, Object>>();
+            for (TnAttachFile item : tnAttachFileList) {
+                Map<String, Object> fileDto = new HashMap<String, Object>();
+                fileDto.put("seq", item.getFileSeq());
+                fileDto.put("name", item.getFileOldName());
+                files.add(fileDto);
+            }
+            resultMap.put("files", files);
+            System.out.println("@@@ files : " + files);
+        } else {
+            resultMap.put("files", null);
+        }
+        resultVO.setResult(resultMap);
+        return resultVO;
+    }
+
+    @Operation(
+            summary = "게시물 저장",
+            description = "게시물 저장",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "저장 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.PUT, value = "/posts/post-mgt")
+    public ResultVO savePostMgt(
+            @Valid TnBbsContents contents,
+            HttpServletRequest request,
+            Errors errors,
+            @RequestParam(required = false) long[] survivingFiles,
+            @RequestParam(required = false) MultipartFile[] files,
+            @AuthenticationPrincipal LoginVO user) throws Exception {
+        ResultVO resultVO = new ResultVO();
+        if (user == null) {
+            resultVO.setResultCode(ResponseCode.TOKEN_EXPIRED.getCode());
+        } else {
+            if (errors.hasErrors()) {
+                StringBuilder msg = new StringBuilder();
+                for (FieldError error : errors.getFieldErrors()) {
+                    msg.append(error.getDefaultMessage());
+                    msg.append("\n");
+                }
+                resultVO.setResultCode(ResponseCode.INPUT_CHECK_ERROR.getCode());
+                resultVO.setResultMessage(msg.toString());
+            } else {
+                System.out.println("@@@ contents.getBbsSeq() : " + contents.getBbsSeq());
+                contents.setIpAddress(ClientUtils.getRemoteIP(request));
+                adminBoardsService.savePost(contents, request, user, files, survivingFiles);
+                resultVO.setResultCode(ResponseCode.SUCCESS.getCode());
+            }
+        }
+        return resultVO;
+    }
+
+    @Operation(
+            summary = "게시물 삭제",
+            description = "게시물 삭제",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "삭제 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.DELETE, value = "/posts/post-mgt")
+    public ResultVO deletePostMgt(@RequestBody TnBbsContents contents, HttpServletRequest request, @AuthenticationPrincipal LoginVO user) {
+        ResultVO resultVO = new ResultVO();
+        if (user == null) {
+            resultVO.setResultCode(ResponseCode.TOKEN_EXPIRED.getCode());
+        } else {
+            contents.setIpAddress(ClientUtils.getRemoteIP(request));
+            String result = adminBoardsService.deletePost(contents);
+            if (result == null) {
+                resultVO.setResultCode(ResponseCode.SUCCESS.getCode());
+            } else if (result.equals("notFind")) {
+                resultVO.setResultCode(ResponseCode.SAVE_ERROR.getCode());
+                resultVO.setResultMessage("대상이 존재하지 않습니다.");
+            }
+        }
+        return resultVO;
+    }
+
+    /* ---- 댓글관리 ----- */
+    @Operation(
+            summary = "댓글 목록 조회",
+            description = "댓글 목록 조회",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "조회 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.GET, value = "/reply/reply-list", consumes = MediaType.APPLICATION_JSON_VALUE)
+    public ResultVO getReplyList(TnBbsRepl tnBbsRepl) throws Exception {
+        ResultVO resultVO = new ResultVO();
+        Map<String, Object> resultMap = userBoardsService.selectReplyList(tnBbsRepl.getBbsContSeq());
+        resultVO.setResult(resultMap);
+        return resultVO;
+    }
+
+    @Operation(
+            summary = "댓글 저장",
+            description = "댓글 저장",
+            tags = {"UserBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "저장 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.POST, value = "/reply/reply-mgt")
+    public ResultVO saveReplyMgt(
+            @Valid @RequestBody TnBbsRepl tnBbsRepl,
+            HttpServletRequest request,
+            Errors errors,
+            @AuthenticationPrincipal LoginVO user) throws Exception {
+        System.out.println("@@@ : " + tnBbsRepl.getBbsContSeq());
+        System.out.println("@@@ : " + tnBbsRepl.getReplCont());
+
+        ResultVO resultVO = new ResultVO();
+        if (user == null) {
+            resultVO.setResultCode(ResponseCode.TOKEN_EXPIRED.getCode());
+        } else {
+            if (errors.hasErrors()) {
+                StringBuilder msg = new StringBuilder();
+                for (FieldError error : errors.getFieldErrors()) {
+                    msg.append(error.getDefaultMessage());
+                    msg.append("\n");
+                }
+                resultVO.setResultCode(ResponseCode.INPUT_CHECK_ERROR.getCode());
+                resultVO.setResultMessage(msg.toString());
+            } else {
+                System.out.println("@@@ tnBbsRepl.getBbsSeq() : " + tnBbsRepl.getBbsContSeq());
+                userBoardsService.saveReply(tnBbsRepl, request, user);
+                resultVO.setResultCode(ResponseCode.SUCCESS.getCode());
+            }
+        }
+        return resultVO;
+    }
+
+    @Operation(
+            summary = "댓글 삭제",
+            description = "댓글 삭제",
+            tags = {"AdminBoardsController"}
+    )
+    @ApiResponses(value = {
+            @ApiResponse(responseCode = "200", description = "삭제 성공"),
+            @ApiResponse(responseCode = "403", description = "인가된 사용자가 아님")
+    })
+    @RequestMapping(method = RequestMethod.DELETE, value = "/reply/reply-mgt")
+    public ResultVO deleteReplyMgt(@RequestBody TnBbsRepl tnBbsRepl, HttpServletRequest request, @AuthenticationPrincipal LoginVO user) {
+        ResultVO resultVO = new ResultVO();
+        if (user == null) {
+            resultVO.setResultCode(ResponseCode.TOKEN_EXPIRED.getCode());
+        } else {
+            tnBbsRepl.setIpAddress(ClientUtils.getRemoteIP(request));
+            String result = userBoardsService.deleteReply(tnBbsRepl);
+            if (result == null) {
+                resultVO.setResultCode(ResponseCode.SUCCESS.getCode());
+            } else if (result.equals("notFind")) {
+                resultVO.setResultCode(ResponseCode.SAVE_ERROR.getCode());
+                resultVO.setResultMessage("대상이 존재하지 않습니다.");
+            }
+        }
+        return resultVO;
+    }
+
+}

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/user/service/UserBoardsService.java

@@ -0,0 +1,64 @@
+package com.dbnt.kcscbackend.user.service;
+
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbs;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsContents;
+import com.dbnt.kcscbackend.admin.boards.entity.TnBbsRepl;
+import com.dbnt.kcscbackend.admin.boards.mapper.AdminBoardsMapper;
+import com.dbnt.kcscbackend.admin.boards.repository.TnBbsContentsRepository;
+import com.dbnt.kcscbackend.admin.boards.repository.TnBbsReplRepository;
+import com.dbnt.kcscbackend.admin.boards.repository.TnBbsRepository;
+import com.dbnt.kcscbackend.auth.entity.LoginVO;
+import com.dbnt.kcscbackend.config.util.ClientUtils;
+import com.dbnt.kcscbackend.file.entity.TnAttachFile;
+import com.dbnt.kcscbackend.file.service.FileService;
+import lombok.RequiredArgsConstructor;
+import org.egovframe.rte.fdl.cmmn.EgovAbstractServiceImpl;
+import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+import org.springframework.web.multipart.MultipartFile;
+
+import javax.servlet.http.HttpServletRequest;
+import java.text.SimpleDateFormat;
+import java.time.LocalDateTime;
+import java.util.*;
+
+@Service
+@RequiredArgsConstructor
+public class UserBoardsService extends EgovAbstractServiceImpl {
+
+    private final TnBbsRepository tnBbsRepository;
+    private final TnBbsContentsRepository tnBbsContentsRepository;
+    private final TnBbsReplRepository tnBbsReplRepository;
+    private final AdminBoardsMapper adminBoardsMapper;
+    private final FileService fileService;
+
+    public Map<String, Object> selectReplyList(Long bbsContSeq) {
+        Map<String, Object> resultMap = new HashMap<>();
+        resultMap.put("replyList", tnBbsReplRepository.findByBbsContSeq(bbsContSeq));
+        resultMap.put("resultCnt", tnBbsReplRepository.countByBbsContSeq(bbsContSeq));
+        return resultMap;
+    }
+
+    public void saveReply(TnBbsRepl tnBbsRepl, HttpServletRequest request, LoginVO user) throws Exception {
+        tnBbsRepl.setBbsContSeq(tnBbsRepl.getBbsContSeq());
+        tnBbsRepl.setReplCont(tnBbsRepl.getReplCont());
+        tnBbsRepl.setReplContLevel(1L);
+        tnBbsRepl.setIpAddress(ClientUtils.getRemoteIP(request));
+        tnBbsRepl.setFrstCrtId(user.getId());
+        tnBbsRepl.setFrstCrtDt(LocalDateTime.now());
+        tnBbsRepl.setUseYn("Y");
+        tnBbsReplRepository.save(tnBbsRepl);
+    }
+
+    @Transactional
+    public String deleteReply(TnBbsRepl tnBbsRepl) {
+        TnBbsRepl savedReply = tnBbsReplRepository.findById(tnBbsRepl.getReplSeq()).orElse(null);
+        if (savedReply == null) {
+            return "notFind";
+        } else {
+            tnBbsReplRepository.deleteById(tnBbsRepl.getReplSeq());
+            return null;
+        }
+    }
+
+}

kcsc-back-end/src/main/resources/mybatisMapper/AdminBoardsMapper.xml

@@ -52,6 +52,9 @@
 			<if test='searchKeyword != null and searchKeyword != ""'>
 				and bbs_cont_title like '%'||#{searchKeyword}||'%'
 			</if>
+			<if test='bbsId != null and bbsId != ""'>
+				and bbs_id = #{bbsId}
+			</if>
 		</where>
 	</sql>
 </mapper>