퍼블 업뎃
parent
d4fd86ac98
commit
6acab8a641
|
|
@ -59,8 +59,19 @@
|
|||
.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:390px; background: #F8FAFC;}
|
||||
.P_MAIN .c_wrap .numbox {width: 100%; height:200px; background: #4C6C84;}
|
||||
.P_MAIN .c_wrap .bbsbox {width: 100%; height:430px; border-bottom: 1px solid #E6E6E6;}
|
||||
.P_MAIN .c_wrap .bannerbox {width: 100%; height:80px;}
|
||||
.P_MAIN .c_wrap .numbox .numbox_n {width: 300px; color: #fff; text-align: center;}
|
||||
.P_MAIN .c_wrap .numbox .num_text {font-size: 22px; font-weight: 700;}
|
||||
.P_MAIN .c_wrap .numbox .num_count {font-size: 40px; font-weight: 700; padding-top: 10px;}
|
||||
.P_MAIN .c_wrap .numbox .num_count span.unit {font-size: 22px;}
|
||||
.P_MAIN .c_wrap .bbsbox {width: 100%; height:430px; border-bottom: 1px solid #E6E6E6; margin: 0 auto;}
|
||||
.P_MAIN .c_wrap .bbsbox .bbsbox_1 {width: 980px; }
|
||||
.P_MAIN .c_wrap .bbsbox .bbsbox_2 {width: 370px; margin-left: 50px;}
|
||||
|
||||
.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;}
|
||||
|
||||
/*.P_MAIN .c_wrap {position: relative;}*/
|
||||
/*.P_MAIN .colbox::after {content: ""; display: block; clear: both;}*/
|
||||
/*.P_MAIN .colbox > * {float: left;}*/
|
||||
|
|
|
|||
|
|
@ -3,6 +3,12 @@ import { Link, useLocation } from 'react-router-dom';
|
|||
import Row from 'react-bootstrap/Row';
|
||||
import Col from 'react-bootstrap/Col';
|
||||
import Button from 'react-bootstrap/Button';
|
||||
import CountUp from 'react-countup';
|
||||
|
||||
import Slider from "react-slick";
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
|
||||
import * as EgovNet from 'api/egovFetch';
|
||||
import URL from 'constants/url';
|
||||
|
||||
|
|
@ -14,6 +20,38 @@ function EgovMain(props) {
|
|||
const location = useLocation();
|
||||
console.log("EgovMain [location] : ", location);
|
||||
|
||||
const settings = {
|
||||
dots: false,
|
||||
infinite: true,
|
||||
speed: 500,
|
||||
slidesToShow: 6,
|
||||
slidesToScroll: 1,
|
||||
arrows: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 3000,
|
||||
pauseOnHover: true
|
||||
};
|
||||
|
||||
const banners = [
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/copy2.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/copy2.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/copy2.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/copy2.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
{ src: '/assets/images/f-logo.png', url: 'https://talbakkum.com' },
|
||||
// 필요한 만큼 배너 이미지를 추가합니다.
|
||||
];
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const [noticeBoard, setNoticeBoard] = useState();
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
|
|
@ -24,7 +62,7 @@ function EgovMain(props) {
|
|||
const retrieveList = useCallback(() => {
|
||||
console.groupCollapsed("EgovMain.retrieveList()");
|
||||
|
||||
const retrieveListURL = '/cmm/main/mainPageAPI.do';
|
||||
const retrieveListURL = '/';
|
||||
const requestOptions = {
|
||||
method: "POST",
|
||||
headers: {
|
||||
|
|
@ -120,14 +158,26 @@ function EgovMain(props) {
|
|||
<div className="qnabox">
|
||||
|
||||
</div>
|
||||
<div className="numbox">
|
||||
|
||||
<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="bbsbox">
|
||||
|
||||
<div className="bbsbox d-flex justify-content-center align-items-center">
|
||||
<div className="bbsbox_1">1</div>
|
||||
<div className="bbsbox_2">2</div>
|
||||
</div>
|
||||
<div className="bannerbox">
|
||||
|
||||
<Slider {...settings}>
|
||||
{banners.map((banner, index) => (
|
||||
<div key={index} className="banner_slide d-flex justify-content-center align-items-center">
|
||||
<a href={banner.url} target="_blank" rel="noopener noreferrer">
|
||||
<img src={banner.src} alt={`Banner ${index + 1}`} />
|
||||
</a>
|
||||
</div>
|
||||
))}
|
||||
</Slider>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue