2024-02-07 notice update

src/main/java/com/its/web/controller/common/CommonController.java

@@ -1,6 +1,6 @@
 package com.its.web.controller.common;
 
-import com.its.web.dto.common.TbWebOrgDto;
+import com.its.web.dto.common.TbWwwOrgDto;
 import com.its.web.service.common.CommonService;
 import io.swagger.annotations.Api;
 import io.swagger.annotations.ApiOperation;
@@ -22,8 +22,8 @@ public class CommonController {
 
     private final CommonService service;
 
-    @ApiOperation(value = "공공기관 웹사이트 조회(TB_WEB_ORGAN)", response = TbWebOrgDto.class, responseContainer = "ArrayList")
+    @ApiOperation(value = "공공기관 웹사이트 조회(TB_WWW_ORGAN)", response = TbWwwOrgDto.class, responseContainer = "ArrayList")
     @PostMapping(value = "/web-organ", produces = {"application/json; charset=utf8"})
     @ResponseBody
-    public List<TbWebOrgDto> findAllOrganization() { return service.findAllOrganization(); }
+    public List<TbWwwOrgDto> findAllOrganization() { return service.findAllOrganization(); }
 }

src/main/java/com/its/web/controller/view/ViewController.java

@@ -1,6 +1,7 @@
 package com.its.web.controller.view;
 
 import com.its.web.service.common.CommonService;
+import com.its.web.service.notice.NoticeService;
 import com.its.web.service.statistics.StatisticsService;
 import com.its.web.service.traffic.TrafficService;
 import io.swagger.annotations.Api;
@@ -26,6 +27,8 @@ public class ViewController {
 
     private final CommonService commonService;
 
+    private final NoticeService noticeService;
+
     @ApiOperation(value = "01.메인화면")
     @GetMapping("/")
     public String Main(Model model) {
@@ -122,4 +125,14 @@ public class ViewController {
         model.addAttribute("active", "way");
         return "center/way";
     }
+
+    @ApiOperation(value = "05.공지사항")
+    @GetMapping(value = {"/notice/notice/{page}/{searchType}/{searchText}", "/notice/notice"})
+    public String notice(Model model, @Nullable @PathVariable("page") String page,
+                         @Nullable @PathVariable("page")String searchType,
+                         @Nullable @PathVariable("page")String searchText) {
+
+        model.addAttribute("list", this.noticeService.findAllList(page, searchType, searchText));
+        return "notice/notice";
+    }
 }

src/main/java/com/its/web/dto/common/TbWebOrgDto.java → src/main/java/com/its/web/dto/common/TbWwwOrgDto.java

@@ -10,8 +10,8 @@ import lombok.NoArgsConstructor;
 @Data
 @NoArgsConstructor
 @AllArgsConstructor
-@ApiModel("TbWebOrgDto(공공기관 웹사이트 DTO)")
-public class TbWebOrgDto {
+@ApiModel("TbWwwOrgDto(공공기관 웹사이트 DTO)")
+public class TbWwwOrgDto {
 
     @ApiModelProperty("공공기관 WEBSITE ID")
     @JsonProperty("organ_id")

src/main/java/com/its/web/dto/notice/NoticeDto.java

@@ -1,31 +1,72 @@
 package com.its.web.dto.notice;
 
-//@Data
-//@NoArgsConstructor
-//@AllArgsConstructor
-//@ApiModel("NoticeDto(공지사항 DTO)")
+import com.fasterxml.jackson.annotation.JsonProperty;
+import com.its.web.pagination.Pagination;
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.AllArgsConstructor;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+
+@Data
+@NoArgsConstructor
+@AllArgsConstructor
+@ApiModel("NoticeDto(공지사항 DTO)")
 public class NoticeDto {
-//    @ApiModelProperty("")
-//    @JsonProperty("idx")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("title")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("contents")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("u_idx")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("file_name")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("reg_dte")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("mod_dte")
-//
-//    @ApiModelProperty("")
-//    @JsonProperty("hit")
+    @ApiModelProperty("공지사항 ID")
+    @JsonProperty("board_id")
+    private String boardId;
+
+    @ApiModelProperty("공지사항 번호")
+    @JsonProperty("board_no")
+    private Long boardNo;
+
+    @ApiModelProperty("카테고리 코드")
+    @JsonProperty("category_cd")
+    private String categoryCd;
+
+    @ApiModelProperty("상위 공지사항 번호")
+    @JsonProperty("parent_board_no")
+    private Long parentBoardNo;
+
+    @ApiModelProperty("등록 일자")
+    @JsonProperty("reg_date")
+    private String regDate;
+
+    @ApiModelProperty("공지사항 제목")
+    @JsonProperty("b_subject")
+    private String bSubject;
+
+    @ApiModelProperty("공지사항 내용")
+    @JsonProperty("b_content")
+    private String bContent;
+
+    @ApiModelProperty("작성자")
+    @JsonProperty("b_writer")
+    private String bWriter;
+
+    @ApiModelProperty("첨부파일")
+    @JsonProperty("attach_file")
+    private String attachFile;
+
+    @ApiModelProperty("첨부파일 ID")
+    @JsonProperty("attach_file_id")
+    private String attachFileId;
+
+    @ApiModelProperty("공지사항")
+    @JsonProperty("b_notice")
+    private String bNotice;
+
+    @ApiModelProperty("조회수")
+    @JsonProperty("read_count")
+    private Integer readCount;
+
+    @ApiModelProperty("비고")
+    @JsonProperty("remark")
+    private String remark;
+
+    @ApiModelProperty("페이지 정보")
+    @JsonProperty("page")
+    private Pagination page;
+
 }

src/main/java/com/its/web/mapper/its/common/CommonMapper.java

@@ -1,14 +1,14 @@
 package com.its.web.mapper.its.common;
 
 import com.its.web.dto.common.CodeDto;
-import com.its.web.dto.common.TbWebOrgDto;
+import com.its.web.dto.common.TbWwwOrgDto;
 import org.apache.ibatis.annotations.Mapper;
 
 import java.util.List;
 
 @Mapper
 public interface CommonMapper {
-    List<TbWebOrgDto> findAllOrganization();
+    List<TbWwwOrgDto> findAllOrganization();
 
     List<CodeDto> findDayList();
 }

src/main/java/com/its/web/mapper/its/notice/NoticeMapper.java

@@ -1,4 +1,17 @@
 package com.its.web.mapper.its.notice;
 
-public class NoticeMapper {
+import com.its.web.dto.notice.NoticeDto;
+import com.its.web.pagination.Pagination;
+import org.apache.ibatis.annotations.Mapper;
+
+import java.util.List;
+
+@Mapper
+public interface NoticeMapper {
+
+    NoticeDto findNoticeById(Long boardNo);
+
+    int getNoticeTotalCount();
+
+    List<NoticeDto> findAllNotice(Pagination page);
 }

src/main/java/com/its/web/pagination/Pagination.java

@@ -0,0 +1,82 @@
+package com.its.web.pagination;
+
+import com.its.web.dto.notice.NoticeDto;
+import lombok.Data;
+
+import java.util.List;
+
+@Data
+public class Pagination {
+    private static final int PAGE_PER_NUM = 10;
+    private int startRow;
+    private int endRow;
+    private int currentPage;
+    private int startPage;
+    private int endPage;
+    private int totalPage;
+    private int prevPage;
+    private int nextPage;
+    private String searchType;
+    private String searchText;
+    private List<NoticeDto> list;
+
+    public Pagination (String page, int totalCount, String searchType, String searchText) {
+        this.currentPage = 1;
+        this.startPage = 1;
+        this.endPage = 1;
+        this.totalPage = 1;
+        this.prevPage = 0;
+        this.nextPage = 0;
+        this.searchType = "";
+        this.searchText = "";
+
+        if (searchText != null && !searchText.isEmpty()) {
+            this.searchText = searchText;
+        }
+
+        if (searchType != null && !searchType.isEmpty()) {
+            this.searchType = searchType;
+        }
+
+        try {
+            if (Integer.parseInt(page) > 0) {
+                this.currentPage = Integer.parseInt(page);
+            }
+        }
+        catch (NumberFormatException e) {
+
+        }
+
+        if (totalCount > PAGE_PER_NUM){
+            this.totalPage = totalCount / PAGE_PER_NUM;
+            if (totalCount % PAGE_PER_NUM > 0) {
+                this.totalPage++;
+            }
+        }
+
+        if (this.totalPage < this.currentPage) {
+            this.currentPage = this.totalPage;
+        }
+
+        this.startPage = ((this.currentPage-1) / PAGE_PER_NUM) * PAGE_PER_NUM + 1;
+        this.endPage = this.startPage + PAGE_PER_NUM - 1;
+
+        if (this.endPage > this.totalPage) {
+            this.endPage = this.totalPage;
+        }
+
+        if (this.startPage > PAGE_PER_NUM) {
+            this.prevPage = this.startPage - PAGE_PER_NUM;
+        }
+
+        if (this.totalPage > PAGE_PER_NUM && this.endPage < this.totalPage) {
+            this.nextPage = this.endPage + 1;
+        }
+
+        this.startRow = (this.currentPage - 1) * PAGE_PER_NUM + 1;
+        this.endRow = this.startRow + PAGE_PER_NUM -1;
+        if (totalCount < this.endRow + 1) {
+            this.endRow = totalCount;
+        }
+    }
+}

src/main/java/com/its/web/service/common/CommonService.java

@@ -1,7 +1,7 @@
 package com.its.web.service.common;
 
 import com.its.web.dto.common.CodeDto;
-import com.its.web.dto.common.TbWebOrgDto;
+import com.its.web.dto.common.TbWwwOrgDto;
 import com.its.web.mapper.its.common.CommonMapper;
 import lombok.RequiredArgsConstructor;
 import lombok.extern.slf4j.Slf4j;
@@ -15,10 +15,18 @@ import java.util.List;
 public class CommonService {
     private final CommonMapper mapper;
 
-    public List<TbWebOrgDto> findAllOrganization() {
+    /**
+     * 공공기관 사이트 URL
+     * @return
+     */
+    public List<TbWwwOrgDto> findAllOrganization() {
         return this.mapper.findAllOrganization();
     }
 
+    /**
+     * Day Code 리스트
+     * @return
+     */
     public List<CodeDto> findDayList() {
         return this.mapper.findDayList();
     }

src/main/java/com/its/web/service/notice/NoticeService.java

@@ -0,0 +1,25 @@
+package com.its.web.service.notice;
+
+import com.its.web.dto.notice.NoticeDto;
+import com.its.web.mapper.its.notice.NoticeMapper;
+import com.its.web.pagination.Pagination;
+import lombok.RequiredArgsConstructor;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+
+@Slf4j
+@RequiredArgsConstructor
+@Service
+public class NoticeService {
+    private final NoticeMapper mapper;
+
+    public Pagination findAllList(String page, String searchType, String searchText) {
+        Pagination pagination = new Pagination(page, this.mapper.getNoticeTotalCount(), searchType, searchText);
+        log.info("{}", pagination);
+        List<NoticeDto> list = this.mapper.findAllNotice(pagination);
+        pagination.setList(list);
+        return pagination;
+    }
+}

src/main/resources/mybatis/mapper/its/common/CommonMapper.xml

@@ -2,8 +2,8 @@
 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 
 <mapper namespace="com.its.web.mapper.its.common.CommonMapper">
-    <select id="findAllOrganization" resultType="com.its.web.dto.common.TbWebOrgDto">
-        SELECT organ_id, name, url FROM TB_WEB_ORGAN
+    <select id="findAllOrganization" resultType="com.its.web.dto.common.TbWwwOrgDto">
+        SELECT organ_id, name, url FROM TB_WWW_ORGAN
     </select>
 
     <select id="findDayList" resultType="com.its.web.dto.common.CodeDto">

src/main/resources/mybatis/mapper/its/notice/NoticeMapper.xml

@@ -2,47 +2,114 @@
 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 
 <mapper namespace="com.its.web.mapper.its.notice.NoticeMapper">
-    <select id="findNoticeById" parameterType="java.util.HashMap">
-        select
-            A.idx,
-            A.title,
-            A.contents,
-            A.u_idx,
-            A.file_name,
-            A.reg_dte,
-            A.mod_dte,
-            A.hit
-         from
-            tbl_board A
-         where A.idx = #{idx}
+    <select id="findNoticeById" parameterType="java.lang.Long" resultType="com.its.web.dto.notice.NoticeDto">
+        SELECT
+            boardid         as board_id,
+            boardno         as board_no,
+            categorycd      as categoryCd,
+            parentboardno   as parent_board_no,
+            regdate         as reg_date,
+            bsubject        as b_subject,
+            bcontent        as b_content,
+            bwriter         as b_writer,
+            attachfile      as attach_file,
+            attachfileid    as attach_file_id,
+            bnotice         as b_notice,
+            readcount       as read_count,
+            remark          as remark
+          FROM
+            TB_WWW_BOARD
+         WHERE boardid = 1
+           AND boardno = #{boardNo}
+
+    </select>
+
+    <select id="findAllNotice" parameterType="com.its.web.pagination.Pagination" resultType="com.its.web.dto.notice.NoticeDto">
+        SELECT
+            boardid         as board_id,
+            boardno         as board_no,
+            categorycd      as categoryCd,
+            parentboardno   as parent_board_no,
+            regdate         as reg_date,
+            bsubject        as b_subject,
+            bcontent        as b_content,
+            bwriter         as b_writer,
+            attachfile      as attach_file,
+            attachfileid    as attach_file_id,
+            bnotice         as b_notice,
+            readcount       as read_count,
+            remark          as remark
+        FROM (SELECT A.*,
+                ROWNUM AS RNUM
+                FROM (SELECT *
+                        FROM TB_WWW_BOARD
+                       ORDER BY BNOTICE DESC, BOARDNO DESC, REGDATE DESC
+                     ) A
+              )
+        WHERE RNUM <![CDATA[>=]]> #{startRow}
+          AND RNUM <![CDATA[<=]]> #{endRow}
+        <if test="searchType == 'title'">
+          AND BSUBJECT LIKE '%'||#{searchText}||'%'
+        </if>
+        <if test="searchType == 'content'">
+          AND BCONTENT LIKE '%'||#{searchText}||'%'
+        </if>
     </select>
 
-    <select id="findAllNotice" parameterType="java.util.HashMap">
-        select
-            AA.idx,
-            AA.title,
-            AA.contents,
-            AA.u_idx,
-            AA.file_name,
-            AA.reg_dte,
-            AA.mod_dte,
-            AA.hit
-        from (select
-                  A.*,
-                  ROWNUM AS rownum
-                from (select
-                          idx,
-                          title,
-                          contents,
-                          u_idx,
-                          file_name,
-                          reg_dte,
-                          mod_dte,
-                          hit
-                        from tbl_board
-                       order by idx, reg_dte desc) A
-            ) AA
-        where AA.rownum BETWEEN #{fromPage} AND #{toPage}
+    <select id="getNoticeTotalCount" parameterType="java.util.HashMap" resultType="int">
+        SELECT
+            NVL(COUNT(*), 0) as boardcount
+        FROM TB_WWW_BOARD
     </select>
 
+    <update id="updateNoticeReadCount" parameterType="java.util.HashMap">
+        UPDATE TB_WWW_BOARD
+           SET READCOUNT = READCOUNT+1
+         WHERE BOARDNO = #{boardNo}
+    </update>
+
+    <insert id="insertNotice" parameterType="java.util.HashMap">
+        INSERT INTO TB_WWW_BOARD (CATEGORYCD,
+                                  BOARDNO,
+                                  REGDATE,
+                                  BSUBJECT,
+                                  BCONTENT,
+                                  EMAIL,
+                                  ATTACHFILE,
+                                  ATTACHFILEID,
+                                  BNOTICE,
+                                  BWRITER,
+                                  BOARDID,
+                                  READCOUNT)
+        VALUES ('N',
+                (SELECT NVL(MAX(BOARDNO),0)+1 FROM TB_WWW_BOARD),
+                TO_DATE(TO_CHAR(SYSDATE,'yyyymmdd hh24mi'), 'YYYYMMDD HH24MI'),
+                #{bSubject},
+                #{bContent},
+                #{webUserId},
+                #{attachFile},
+                #{ATTACHFILEID},
+                #{bNotice},
+                '관리자',
+                1,
+                '0')
+    </insert>
+
+    <update id="updateNotice" parameterType="java.util.HashMap">
+        UPDATE TB_WWW_BOARD
+        SET REGDATE      = TO_DATE(TO_CHAR(SYSDATE,'yyyymmdd hh24mi'), 'YYYYMMDD HH24MI'),
+            BSUBJECT     = #{bSubject},
+            BCONTENT     = #{bContent},
+            ATTACHFILE   = #{attachFile},
+            ATTACHFILEID = #{attachFileId},
+            BNOTICE      = #{bNotice}
+        WHERE BOARDNO    = #{boardNo}
+          AND BOARDID    = 1
+    </update>
+
+    <delete id="deleteNotice" parameterType="java.util.HashMap">
+        DELETE TB_WWW_BOARD
+		 WHERE BOARDNO = #{boardNo}
+           AND BOARDID = 1
+    </delete>
 </mapper>

src/main/resources/static/css/center.css

@@ -88,14 +88,16 @@
     text-align: center;
     border-bottom: 1px solid rgb(33, 84, 153);
     font-size: 2rem;
-    font-weight: 500;
 }
 .centerWrap .way-content,
 .centerWrap .content1 {
     display: flex;
     flex-direction: row;
 }
-
+#map {
+    width: 100%;
+    height: 100%;
+}
 .centerWrap .way-content a:hover {
     color : rgb(51, 102, 171);
 }
@@ -127,7 +129,7 @@
 .centerWrap .content1 > div {
     padding : 10px;
 }
-.centerWrap .way-content > div:nth-child(2) > p,
+.centerWrap .way-content > div:nth-child(2) p,
 .centerWrap .content1 > div > p {
     padding : 10px 0;
 }
@@ -135,7 +137,12 @@
     width: 20px;
     height: 20px;
 }
-
+.centerWrap .way-content > div:nth-child(2) > div > div {
+    height: 50%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+}
 .centerWrap .way-content > div:nth-child(2) h2 {
     padding : 2rem 0 0 0;
     width: 100%;
@@ -153,7 +160,18 @@
     font-weight: bold;
     font-size: 15px;
 }
-
+.info-window {
+    width: 270px;
+    cursor: pointer;
+    height: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.info-window:hover {
+    color: rgb(51, 102, 171);
+    text-decoration: underline;
+}
 .centerWrap table, .centerWrap td, .centerWrap th {
     border: 1px solid black;
 }
@@ -196,14 +214,28 @@
         height: calc(100% - 253.19px);
     }
 
+    .centerWrap .way-content,
     .centerWrap .container .content1 {
         flex-direction: column;
     }
 
+    .centerWrap .way-content > div {
+        width: 100%;
+        height: 50%;
+    }
     .centerWrap .container .content1 img{
         width: 100%;
     }
 
+    .centerWrap .way-content > div:nth-child(2) > div{
+        height: 100%;
+        width: 100%;
+        justify-content: center;
+    }
+    .centerWrap .way-content > div:nth-child(2) > div > div {
+        width: 100%;
+        align-items: center;
+    }
 }
 
 @media (max-height: 765px) {
@@ -255,8 +287,14 @@
     .centerWrap .content1 p {
         font-size: 12px;
     }
+    .centerWrap .way-content > div:nth-child(2) p,
     .centerWrap table tr td,
     .centerWrap table thead tr th {
         font-size: 14px;
     }
+
+    .centerWrap .way-content > div:nth-child(2) img{
+        width: 15px;
+        height: 15px;
+    }
 }

src/main/resources/static/css/main.css

@@ -301,7 +301,7 @@ body {
 
     .mainWrap {
         padding: 0;
-        height: calc(100% - 153.19px);
+        height: calc(100% - 149.19px);
     }
 
     .mainWrap .main {

src/main/resources/static/css/notice.css

@@ -0,0 +1,185 @@
+
+.menu {
+    max-width: 1200px;
+    width: 100%;
+    margin: 1.5rem auto 0 auto;
+    display: flex;
+    -webkit-box-pack: center;
+    justify-content: center;
+}
+.menu > div {
+    width: 100px;
+    word-break: keep-all;
+    text-align: center;
+    line-height: 1.1;
+    font-weight: bold;
+    font-size: 18px;
+}
+.menu > div:not(:first-child) {
+    margin-left: 30px;
+}
+
+.menu > div.active {
+    color: rgb(51, 102, 171);
+}
+
+.menu > div:hover{
+    color: rgb(51, 102, 171);
+    cursor: pointer;
+}
+
+.mobile-menu {
+    display: none;
+    padding: 0.6rem 1rem;
+    border-top: 1px solid rgb(230, 230, 230);
+    justify-content: space-around;
+    width: 100%;
+    height: 80px;
+}
+.mobile-menu > div > div {
+    filter: grayscale(1);
+    background-size: 35px 35px;
+    width: 100%;
+    height: 35px;
+    background-position: center;
+    background-repeat: no-repeat;
+}
+.mobile-menu > div {
+    font-weight: bold;
+    padding-top : 5px;
+    font-size: 11px;
+}
+.mobile-menu > div.active > div {
+    filter: grayscale(0);
+}
+.mobile-menu > div.active {
+    color: rgb(51, 102, 171);
+}
+
+.mobile-menu > div:nth-child(1) > div {
+    background-image: url("/images/icon/menu_icon5-2.png");
+}
+
+.mobile-menu > div:nth-child(2) > div {
+    background-image: url("/images/icon/way.png");
+}
+
+.noticeWrap {
+    width: 100%;
+    height: calc(100% - 199.8px);
+    display: flex;
+    justify-content: center;
+    overflow: auto;
+    min-height: 500px;
+}
+
+.noticeWrap .container {
+    max-width: 1200px;
+    width: 95%;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+.noticeWrap .header {
+    padding: 2rem 0;
+    margin-bottom: 0;
+    color: rgb(51, 102, 171);
+    text-align: center;
+    border-bottom: 1px solid rgb(33, 84, 153);
+    font-size: 2rem;
+}
+
+.noticeWrap .content {
+    padding: 0px;
+    margin: 0px;
+    height: calc(100% - 151px);
+    overflow: auto;
+}
+.noticeWrap .pagination {
+    width: 100%;
+    height: 50px;
+    padding: 16px;
+    display: flex;
+    align-items: center;
+}
+.noticeWrap .pagination .previous {
+    -webkit-box-flex: 5;
+    flex-grow: 5;
+    text-align: left;
+}
+
+.noticeWrap .pagination .pages > a:not(:first-child) {
+    margin-left: 10px;
+}
+
+.noticeWrap .pagination .next {
+    -webkit-box-flex: 5;
+    flex-grow: 5;
+    text-align: right;
+}
+.noticeWrap .pagination img.active {
+    cursor: pointer;
+    display: block;
+}
+.noticeWrap .pagination .pages a.active{
+    color: rgb(51, 102, 171);
+    text-decoration: underline;
+    font-weight: bold;
+}
+.noticeWrap .pagination img {
+    width: 20px;
+    height: 20px;
+    display: none;
+}
+
+@media (max-width: 920px) {
+    .noticeWrap {
+        height: calc(100% - 200.19px);
+    }
+
+}
+
+@media (max-height: 765px) {
+    .noticeWrap {
+        height: calc(100% - 197.19px);
+    }
+}
+
+
+@media (max-width: 720px) {
+    .noticeWrap {
+        height: calc(100% - 205.19px);
+    }
+}
+
+
+@media (max-width: 547px) {
+    .noticeWrap {
+        height: calc(100% - 216.19px);
+    }
+}
+
+@media (max-width: 420px) {
+    .mobile-menu {
+        display: flex;
+    }
+
+    .menu {
+        display:  none;
+    }
+
+    .noticeWrap {
+        height: calc(100% - 228.19px);
+        padding: 5px 0;
+    }
+
+    .noticeWrap .header {
+        font-size: 1.5rem;
+    }
+
+    .noticeWrap h2 {
+        font-size: 14px;
+    }
+
+}

src/main/resources/static/css/statistics.css

@@ -185,7 +185,7 @@
     width: 100%;
     text-align: center;
     border-collapse: separate;
-    border-spacing: 0px;
+    border-spacing: 0;
     caption-side: bottom;
 }
 .table-toggle {

src/main/resources/static/js/statistics/statistics.js

@@ -175,8 +175,8 @@ function searchStatisticsAmount() {
         toDt     : toDt,
     }
 
-    // let height = 'calc(-400px + 100vh)';
-    // $table.css('height', height);
+    let height = '100%';
+    $table.css('height', height);
     $tbody.html('<tr><td><span><img src="/images/icon/loading.gif"></span></td></tr>');
     getDataAsync('/api/statistics/amount/' + type, "POST", param, null, (jsonData)=>{
         let str = emptyStr;
@@ -198,8 +198,8 @@ function searchStatisticsAmount() {
                 }
                 str += `</tr>`
             });
-            // height = 'auto';
-            // $table.css('height', height);
+            height = 'auto';
+            $table.css('height', height);
         }
         if (limit) {
             thead = '<th>구간</th>';
@@ -256,9 +256,9 @@ function searchStatisticsComm() {
         toDt     : toDt,
     }
 
-    // let height = 'calc(-443px + 100vh)';
+    let height = '100%';
     let url = "/speed";
-    // $table.css('height', height);
+    $table.css('height', height);
     $tbody.html('<tr><td><span><img src="/images/icon/loading.gif"></span></td></tr>');
     if (active === '지/정체통계') url = '/grade';
 
@@ -297,8 +297,8 @@ function searchStatisticsComm() {
                 }
                 str += `</tr>`
             });
-            // height = 'auto';
-            // $table.css('height', height);
+            height = 'auto';
+            $table.css('height', height);
         }
 
         $thead.html(thead);
@@ -316,7 +316,6 @@ function searchStatisticsComm() {
 function searchStatisticsCongest() {
     const $type     = $('.type');
     const $day      = $('.day');
-    const $thead    = $('.thead');
     const $tbody    = $('.table-content');
     const $table    = $('.table-box table');
     const type      = $type.val();
@@ -334,8 +333,8 @@ function searchStatisticsCongest() {
         day      : day,
     }
 
-    // let height = 'calc(-443px + 100vh)';
-    // $table.css('height', height);
+    let height = '100%';
+    $table.css('height', height);
     $tbody.html('<tr><td><span><img src="/images/icon/loading.gif"></span></td></tr>');
 
 
@@ -356,8 +355,8 @@ function searchStatisticsCongest() {
                             <td>${sped} km</td>
                         </tr>`
             });
-            // height = 'auto';
-            // $table.css('height', height);
+            height = 'auto';
+            $table.css('height', height);
         }
         $tbody.html(str);
     }, ()=>{

src/main/resources/templates/include/footer.html

@@ -24,17 +24,18 @@
             <div>
                 <div>
                     <div title="37683. 경상북도 포항시 남구 시청로1">
-                        <img src="/images/icon/location.png" alt="icon"
+                        <img class="footer-white-img" src="/images/icon/location.png" alt="icon"
                              style="width: 20px; height: 20px; margin-right: 0.5rem;">
                         <span>37683. 경상북도 포항시 남구 시청로1</span>
                     </div>
                     <div title="Tel.054-270-8282">
-                        <img src="/images/icon/phone.png" alt="icon"
+                        <img class="footer-white-img" src="/images/icon/phone.png" alt="icon"
                              style="width: 20px; height: 20px; margin-right: 0.5rem;">
                         <span>054-270-8282</span>
                     </div>
                     <div title="Fax.054-270-3620">
-                        <img src="/images/icon/fax.png" alt="" style="width: 20px; height: 20px; margin-right: 0.5rem;">
+                        <img class="footer-white-img" src="/images/icon/fax.png" alt="icon"
+                             style="width: 20px; height: 20px; margin-right: 0.5rem;">
                         <span>054-270-3620</span>
                     </div>
                 </div>
@@ -68,7 +69,7 @@
             </a>
         </div>
         <div>
-            <a>
+            <a href="/center/center">
                 <div>
                     <img th:src="${selected eq 'center'} ? @{/images/icon/menu_icon5-2.png} : @{/images/icon/menu_icon5.png}" alt="센터 아이콘" width="30" height="30">
                 </div>

src/main/resources/templates/include/header.html

@@ -17,8 +17,7 @@
             </div>
             <div class="top-menu-cont">
                 <div></div>
-                <a target="_blank" th:href="@{https://www.pohang.go.kr/bis/busLineSearch.do}"
-                   rel="noopener noreferrer">버스정보</a>
+                <a href="javascript:openBusSite(0)">버스정보</a>
                 <img src="/images/icon/direction.png" alt="새 창 열기">
             </div>
             <span tabindex="0" id="menu" onclick="menuOpen()">
@@ -84,7 +83,7 @@
                         <div class="sub-number">
                             <h1>04</h1>
                         </div>
-                        <p>
+                        <p onclick="movePath('/notice/notice')">
                             공지사항
                         </p>
                     </div>

src/main/resources/templates/main/main.html

@@ -38,7 +38,7 @@
                     <div>
                         <img src="/images/icon/alarm.png" alt="">
                         <span>공지사항</span>
-                        <a>+</a>
+                        <a href="/notice/notice">+</a>
                     </div>
                     <div class="content">
                         <div>
@@ -51,7 +51,7 @@
                     <div>
                         <img src="/images/icon/incd.png" alt="">
                         <span>돌발정보</span>
-                        <a>+</a>
+                        <a href="/trafficMap/incidents">+</a>
                     </div>
                     <div class="incd-content">
                         <div th:each="item, i:${notice}">

src/main/resources/templates/notice/notice.html

@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th=http://www.thymeleaf.org>
+<head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width,initial-scale=1"/>
+    <meta name="theme-color" content="#000000"/>
+    <meta name="description" content="포항시 교통정보센터입니다"/>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
+    <title>포항시 교통정보센터</title>
+    <th:block th:include="/include/head.html"></th:block>
+    <link rel="stylesheet" th:href="@{/css/notice.css}">
+</head>
+<body id="body">
+<th:block th:include="/include/header.html"></th:block>
+<div class="noticeWrap">
+    <div class="container">
+        <h2 class="header">공지사항</h2>
+        <div class="content">
+            <a th:each="item : ${list.getList()}" style="display: flex;">
+                <div th:text="${item.getBSubject()}"></div>
+                <div th:text="${item.getRegDate()}"></div>
+                <div th:text="${item.getReadCount() + '회'}"></div>
+            </a>
+        </div>
+        <div class="pagination">
+            <div class="previous">
+                <img th:class="${list.getPrevPage() == 0 ? '' : 'active'}" src="/images/icon/previous.png" alt="이전">
+            </div>
+            <div class="pages">
+               <a th:class="${m == list.getCurrentPage() ? 'active' : ''}" th:each="m : ${#numbers.sequence(list.getStartPage(), list.getEndPage())}" th:text="${m}"></a>
+            </div>
+            <div class="next">
+                <img th:class="${list.getNextPage() == 0 ? '' : 'active'}" src="/images/icon/next.png" alt="다음">
+            </div>
+        </div>
+    </div>
+</div>
+<th:block th:include="/include/footer.html"></th:block>
+</body>
+</html>