퍼블 업뎃

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

@@ -43,6 +43,8 @@ const URL = {
     SUPPORT_API                 : "/support/api", // API 서비스
     SUPPORT_RESEARCH            : "/support/research", // 건설기준 연구
     SUPPORT_POLL                : "/support/poll", // 설문조사
+    SUPPORT_SURVEY              : "/support/survey/:Id", // 설문조사 참여
+    SUPPORT_SURVEY_NOID         : "/support/survey/", // 설문조사 참여
     SUPPORT_DOWNLOAD            : "/support/download", // 고객지원/자료실
     // SUPPORT_DOWNLOAD_DETAIL     : "/support/download/detail", // 고객지원/자료실/상세
     // SUPPORT_DOWNLOAD_CREATE     : "/support/download/create", // 고객지원/자료실/등록

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

@@ -468,10 +468,26 @@
 
     .BRD018 .head > span:nth-child(1) {position: relative; width: 15%; }
     .BRD018 .head > span:nth-child(2) {position: relative; width: 85%; padding: 10px; text-align: left;}
-    .BRD018 .head > span:nth-child(-n+1)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
+    .BRD018 .head > span:nth-child(1)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
     .BRD018 .result .list_item > div:nth-child(1) {width: 15%; padding: 10px 0;}
     .BRD018 .result .list_item > div:nth-child(2) {width: 85%; padding: 10px; text-align: left;}
 
+    .BRD019 .head > span:nth-child(1) {position: relative; width: 60%;}
+    .BRD019 .head > span:nth-child(2) {position: relative; width: 8%; text-align: center;}
+    .BRD019 .head > span:nth-child(3) {position: relative; width: 8%; text-align: center;}
+    .BRD019 .head > span:nth-child(4) {position: relative; width: 8%; text-align: center;}
+    .BRD019 .head > span:nth-child(5) {position: relative; width: 8%; text-align: center;}
+    .BRD019 .head > span:nth-child(6) {position: relative; width: 8%; text-align: center;}
+    .BRD019 .head > span:nth-child(-n+5)::after {position: absolute; content: ''; right: 0; bottom: 0; height: 50%; border-right: 1px solid #B5B5B5;}
+    .BRD019 .result .list_item > div:nth-child(1) {width: 60%; text-align: left; padding-left: 10px;}
+    .BRD019 .result .list_item > div:nth-child(2) {width: 8%; text-align: center;}
+    .BRD019 .result .list_item > div:nth-child(3) {width: 8%; text-align: center;}
+    .BRD019 .result .list_item > div:nth-child(4) {width: 8%; text-align: center;}
+    .BRD019 .result .list_item > div:nth-child(5) {width: 8%; text-align: center;}
+    .BRD019 .result .list_item > div:nth-child(6) {width: 8%; text-align: center;}
+    .poll_title {font-size: 15px; padding-left: 10px;}
+    .poll_answer {padding-left: 20px;}
+
 
     /* 찾아오시는길 */
     .SITE_CONTACT_US .map {margin-top: 43px;}

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

@@ -11,10 +11,38 @@ import Button from "react-bootstrap/Button";
 function Poll(){
     const navigate = useNavigate();
 
-    const goToDetail = () => {
+    const goToDetail = (id, isClosed) => {
-        // navigate('/support/list/KCSC-QA');
+        if (isClosed) {
+            alert('마감된 설문조사입니다.');
+        } else {
+            // 로그인 한경우만 참여 가능하게
+            navigate(`${URL.SUPPORT_SURVEY_NOID}${id}`);
+        }
     };
 
+    const surveys = [
+        {
+            id: 1,
+            title: "2023년 건설기준 포털시스템 이용자 만족도 조사",
+            isClosed: false,
+            period: "2014-06-25 ~ 2015-09-17",
+            content: "본 연구의 목적은 “건설공사기준 코드체계(국토교통부 고시 제2013-640호, ‘13.10)” 전환에 따른 분야별 코드별로 현행 설계기준과 표준시방서에 대하여 중복 및 상충 항목의 검토 정비하여 통합 코드(안) 마련."
+        },
+        {
+            id: 2,
+            title: "2022년 건설기준 포털시스템 이용자 만족도 조사",
+            isClosed: true,
+            period: "2013-12-26 ~ 2015-06-30",
+            content: "본 연구의 목적은 “건설공사기준 코드체계(국토교통부 고시 제2013-640호, ‘13.10)” 전환에 따른 분야별 코드별로 현행 설계기준과 표준시방서에 대하여 중복 및 상충 항목의 검토 정비하여 통합 코드(안) 마련."
+        },
+        {
+            id: 3,
+            title: "2021년 건설기준 포털시스템 이용자 만족도 조사",
+            isClosed: true,
+            period: "2013-03-01 ~ 2014-07-01",
+            content: "ㅇ 현장 여건 변화 및 민원 등에 따른 합리적 표준시방서 개정 ㅇ 2009년 개정 이후 민원 및 감사원 지적 등에 따른 시방서 내용 개정"
+        }
+    ];
 
     return (
         <div className="container">
@@ -35,6 +63,32 @@ function Poll(){
                         <h1 className="tit_3">설문조사</h1>
 
                         {/* <!-- 건설기준연구 안내 (리스트 5개씩만 뿌려주세요.)--> */}
+                        {surveys.map((survey) => (
+                            <React.Fragment key={survey.id}>
+                                <Row className="py-3 justify-content-between align-items-end">
+                                    <Col className="fs-6 fw-bold text-4c6 ps-4">{survey.title}</Col>
+                                    <Col className="text-end">
+                                        <Button
+                                            type="button"
+                                            className={survey.isClosed ? "btn btn-secondary px-4" : "btn btn-22498E px-4"}
+                                            onClick={() => goToDetail(survey.id, survey.isClosed)}>
+                                            {survey.isClosed ? '설문마감' : '참여하기'}
+                                        </Button>
+                                    </Col>
+                                </Row>
+                                <div className="board_view2 pb-4">
+                                    <dl>
+                                        <dt>참여기간</dt>
+                                        <dd>{survey.period}</dd>
+                                    </dl>
+                                    <dl>
+                                        <dt>내용</dt>
+                                        <dd>{survey.content}</dd>
+                                    </dl>
+                                </div>
+                            </React.Fragment>
+                        ))}
+
                         <Row className={"py-3 justify-content-between align-items-end"} >
                             <Col className={"fs-6 fw-bold text-4c6 ps-4"}>2023년 건설기준 포털시스템 이용자 만족도 조사</Col>
                             <Col className={"text-end"}><Button type={"button"} className={"btn btn-22498E px-4"}  onClick={goToDetail} >참여하기</Button></Col>

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

@@ -0,0 +1,131 @@
+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 Row from "react-bootstrap/Row";
+import Col from "react-bootstrap/Col";
+import Button from "react-bootstrap/Button";
+
+function Poll_Detail(){
+
+
+
+    return (
+        <div className="container">
+            <div className="c_wrap">
+                {/* <!-- Location --> */}
+                <div className="location">
+                    <ul>
+                        <li><Link to={URL.MAIN} className="home" >Home</Link></li>
+                        <li><Link to={URL.SUPPORT_LIST_NOCODE+'/KCSC-NTC'}>정보제공</Link></li>
+                        <li><Link to={URL.SUPPORT_POLL}>설문조사</Link></li>
+                        <li>설문조사 참여하기</li>
+                    </ul>
+                </div>
+                {/* <!--// Location --> */}
+
+                <div className="layout">
+
+                    <div className="contents" id="contents">
+                        {/* <!-- 본문 --> */}
+                        <h1 className="tit_3">설문조사 참여하기</h1><div className="board_list BRD018">
+                        <div className="head">
+                            <span>설문조사명</span>
+                            <span>건설기준 포털시스템 이용자 만족도 조사</span>
+                        </div>
+                        <div className="result">
+                            <div className="list_item">
+                                <div>목적</div>
+                                <div>건설기준 포털시스템의 사용자 만족도를 조사하여 향후 시스템 개선에 반영</div>
+                            </div>
+                            <div className="list_item">
+                                <div>첨부파일</div>
+                                <div></div>
+                            </div>
+                            <div className="list_item">
+                                <div>설문기간</div>
+                                <div>2023-12-15 ~ 2023-12-29</div>
+                            </div>
+                        </div>
+
+                        <div className={"pt-4 pb-1 fs-4 fw-bold"}><img src={"/assets/images/question.png"} className={"p-2"} /> 건설기준 포털시스템 접속 목적(복수 응답 가능)</div>
+                        <div className={"poll_title"}>1) 질문 문항입니다.</div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c1"} /> <label htmlFor={"c1"}>국가건설기준코드 검색</label></div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c2"} /> <label htmlFor={"c2"}>국가건설기준코드 검색</label></div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c3"} /> <label htmlFor={"c3"}>국가건설기준코드 검색</label></div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c4"} /> <label htmlFor={"c4"}>국가건설기준코드 검색</label></div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c5"} /> <label htmlFor={"c5"}>국가건설기준코드 검색</label></div>
+                        <div className={"poll_answer"}><input type={"checkbox"} id={"c6"} /> <label htmlFor={"c6"}>국가건설기준코드 검색</label></div>
+                        <div className={"pt-4 ps-2"}>기타</div>
+                        <div><textarea className={"w-100 h_50"}></textarea></div>
+
+                        <div className={"pt-4 pb-1 fs-4 fw-bold"}><img src={"/assets/images/question.png"} className={"p-2"} />이용자 만족도</div>
+                        <div className={"poll_title"}>건설기준 포털시스템의 만족도에 대한 설문 입니다. 귀하의 의견과 일치되는 곳에 'O' 표해 주십시오.</div>
+                        <div className="board_list BRD019">
+                            <div className="head">
+                                <span>질문내용</span>
+                                <span>매우만족</span>
+                                <span>다소만족</span>
+                                <span>보통</span>
+                                <span>다소불만족</span>
+                                <span>매우불만족</span>
+                            </div>
+                            <div className="result">
+                                <div className="list_item">
+                                    <div className={"text-center fw-bold"}>(정보제공)</div>
+                                </div>
+                                <div className="list_item">
+                                    <div>(1) 업무와 관련된 정보를 제공하고 있습니까?</div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                </div>
+                                <div className="list_item">
+                                    <div>(2) 업무와 관련된 정보를 제공하고 있습니까?</div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                </div>
+                                <div className="list_item">
+                                    <div>(3) 업무와 관련된 정보를 제공하고 있습니까?</div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                </div>
+                                <div className="list_item">
+                                    <div className={"text-center fw-bold"}>(시스템 일반현황)</div>
+                                </div>
+                                <div className="list_item">
+                                    <div>(1) 시스템의 응답속도는 만족하십니까?</div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                    <div><input type={"radio"}/></div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <div className={"pt-4 pb-1 fs-4 fw-bold"}><img src={"/assets/images/question.png"} className={"p-2"} />건의사항 및 향후 발전방향</div>
+                        <div className={"poll_title"}>건설기준 포털시스템에 개선이 필요한 부분이나 건의사항이 있으시면 기재해 주시기 바랍니다.</div>
+                        <div><textarea className={"w-100 h_100"}></textarea></div>
+
+                        <Row className={"py-3n"} >
+                            <Col className={"text-center"}><Button type={"button"} className={"btn btn-22498E px-4"}  onClick={""} >설문조사 최종 참여하기</Button></Col>
+                        </Row>
+                    </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+}
+
+export default Poll_Detail;

egovframe-template-simple-react-contribution/src/routes/index.jsx

@@ -44,6 +44,7 @@ import SupportSite from 'pages/support/Site';
 import SupportApi from 'pages/support/Api';
 import SupportResearch from 'pages/support/Research';
 import SupportPoll from 'pages/support/Poll';
+import SupportSurvey from 'pages/support/Survey';
 
 import EgovSupportDownloadList from 'pages/support/download/EgovDownloadList';
 // import EgovSupportDownloadDetail from 'pages/support/download/EgovDownloadDetail';
@@ -266,6 +267,7 @@ const SecondRoutes = () => {
         <Route path={URL.SUPPORT_API} element={<SupportApi />} />
         <Route path={URL.SUPPORT_RESEARCH} element={<SupportResearch />} />
         <Route path={URL.SUPPORT_POLL} element={<SupportPoll />} />
+        <Route path={URL.SUPPORT_SURVEY} element={<SupportSurvey />} />
 
         <Route path={URL.SUPPORT_DOWNLOAD} element={<EgovSupportDownloadList />} />
         {/*<Route path={URL.SUPPORT_DOWNLOAD_DETAIL} element={<EgovSupportDownloadDetail />} />*/}