POHANG
/
its-web-server


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
							<!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/admin-header.html"></th:block>
<div class="noticeWrap">
    <div class="container view">
        <h2 class="admin-header">팝업 공지</h2>
        <div class="content admin-view">
            <div class="button-box">
                <div class="bl-button" onclick="movePath('/phits/popup-list')">목록</div>
                <div style="display: flex;">
                    <div class="bl-button save-btn" onclick="save()">저장</div>
                </div>
            </div>
            <div class="view-box">
                <div>
                    <input class="title modify" name="b_subject" placeholder="팝업 제목을 입력해주세요.">
                    <textarea class="b_content modify" rows="16" name="b_content" placeholder="링크 주소가 있다면 URL을 입력해주세요. ex) https://www.naver.com"></textarea>
                    <div class="attach-box admin">
                        <div class="attach modify">
                            <div>첨부파일 없음</div>
                        </div>
                        <input type="file" name="attachFile" id="attach-file">
                        <div class="bl-button attach-btn" onclick="attachFile()">파일첨부</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<th:block th:include="/include/footer.html"></th:block>
</body>
</html>
<script th:inline="javascript">
    const $title      = $('.title');
    const $content    = $('.b_content');
    const $attach     = $('.attach');
    const $attachFile = $('#attach-file');

    let isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);

    if (isMobile) {
        $content.attr('rows', 10);
    }

    function attachFile() {
        $attachFile.click();
    }

    $attachFile.on("change", function() {
        const changeFile = $(this)[0].files[0];
        if (changeFile) {
            const fileName = changeFile.name;
            $attach.html('<div><span class="attach-delete" title="첨부파일 제거" onclick="deleteAttach()"></span>'+fileName+'</div>');
        }
    })

    function deleteAttach() {
        $attachFile.val("");
        $attach.html("<div>첨부파일 없음</div>")
        console.log($attachFile[0].files[0]);
    }

    function save() {
        const title   = $title.val();
        const content = $content.val();
        const file    = $attachFile[0].files[0];
        const formData = new FormData();
        if (isNull(title)) {
            $title.focus();
            return alert("공지사항 제목을 입력해주세요.");
        }

        if (isNull(content)) {
            $content.focus();
            return alert("공지사항 내용을 입력해주세요.");
        }

        formData.append("bSubject", title);
        formData.append("bContent", content);

        if (file) {
            formData.append("attachFile", file);
        }

        $.ajax({
            url: '/api/popup/writePopup',
            processData : false,
            contentType: false,
            data: formData,
            type: 'POST',
            success: function(jsonData) {
                if (jsonData) {
                    alert(jsonData.message);
                    if (jsonData.success === "S") {
                        window.location.href = "/phits/popup-list";
                    }
                }
            },
            error: function(error) {
                alert(error.responseJSON.message);
            }
        });
    }
</script>