diff --git a/egovframe-template-simple-react-contribution/src/components/alert/AlertDialogSlide.jsx b/egovframe-template-simple-react-contribution/src/components/alert/AlertDialogSlide.jsx new file mode 100644 index 0000000..a613536 --- /dev/null +++ b/egovframe-template-simple-react-contribution/src/components/alert/AlertDialogSlide.jsx @@ -0,0 +1,58 @@ +import React, { useEffect } from 'react'; + +import Button from '@mui/material/Button'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import Slide from '@mui/material/Slide'; + +const Transition = React.forwardRef(function Transition(props, ref) { + return ; +}); + +export default function AlertDialogSlide({confirm, setConfirm}) { + + useEffect(function () { + if( confirm ) { + setConfirm({ + ...confirm, + //open: !confirm.open && false, + //title: !confirm.title && "중요", + ///yes: !confirm.yes && "예", + //no: !confirm.no && "아니요", + }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + + const handleClose = () => { + setConfirm({...confirm, open: false}); + }; + + return ( + + {confirm && + + {confirm.title ? confirm.title : "알림"} + + {confirm.body} + + + + + + + } + + + ); +} \ No newline at end of file diff --git a/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp.jsx b/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp.jsx index f9fa52a..90cdf8a 100644 --- a/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp.jsx +++ b/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp.jsx @@ -1,13 +1,15 @@ import React, { useState, useEffect } from 'react'; -import { Link, useLocation } from 'react-router-dom'; +import { Link, useLocation, useNavigate } from 'react-router-dom'; import Switch from '@mui/material/Switch'; import * as EgovNet from 'api/egovFetch'; import URL from 'constants/url'; +import CODE from 'constants/code'; import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin'; import EgovPagingPaginationInfo from 'components/EgovPagingPaginationInfo'; + import styled from "styled-components"; const StyledDiv = styled.div` @@ -21,6 +23,7 @@ const label = { inputProps: { 'aria-label': '사용여부' } }; function PopUp(props) { const location = useLocation(); + const navigate = useNavigate(); const [listPopup, setListPopup] = useState([]); const [searchCondition, setSearchCondition] = useState(location.state?.searchCondition || { pageIndex: 1, searchCnd: '0', searchWrd: '' }); @@ -51,6 +54,32 @@ function PopUp(props) { } + + const onChangeActivationSwitch = (e, popupId) => { + const checked = e.target.checked; + const requestURL = `/contents/api/popup-manage/activation-switch/${popupId}?checked=${checked}`; + + const requestOptions = { + method: "PUT", + headers: { + 'Content-type': 'application/json', + } + } + + EgovNet.requestFetch(requestURL, + requestOptions, + (resp) => { + console.log("====>>> Schdule delete= ", resp); + if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) { + navigate(URL.ADMIN__CONTENTS__POP_UP ,{ replace: true }); + } else { + navigate({pathname: URL.ERROR}, {state: {msg : resp.resultMessage}}); + } + + } + ); + } + const Location = React.memo(function Location() { return ( @@ -106,11 +135,11 @@ function PopUp(props) {

검색된 결과가 없습니다.

} {listPopup.map((it)=>( -
+
{it.seq}
{it.popupTitle}
{it.startDate} ~ {it.endDate}
-
{it.useYn === 'Y' ? : }
+
{it.useYn === 'Y' ? onChangeActivationSwitch(e, it.seq)} defaultChecked /> : onChangeActivationSwitch(e, it.seq)} {...label} />}
))}
diff --git a/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp/PopupWriter.jsx b/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp/PopupWriter.jsx index d5e7f50..2eba0af 100644 --- a/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp/PopupWriter.jsx +++ b/egovframe-template-simple-react-contribution/src/pages/admin/contents/PopUp/PopupWriter.jsx @@ -4,6 +4,7 @@ import DatePicker from "react-datepicker"; import EgovAttachFile from 'components/EgovAttachFile'; import RichTextEditor from "../../../../components/editor/RichTextEditor"; +import AlertDialogSlide from "../../../../components/alert/AlertDialogSlide"; import CODE from 'constants/code'; @@ -34,7 +35,8 @@ function PopupWriter(props) { const [modeInfo, setModeInfo] = useState({ mode: props.mode }); const [text, setText] = useState(""); - const [popupDetail, setScheduleDetail] = useState({ startDate: new Date(), endDate: new Date() }); + const [textOriginal, setTextOriginal] = useState(""); + const [popupDetail, setPopupDetail] = useState({ startDate: new Date(), endDate: new Date() }); const [schdulBgndeHH, setSchdulBgndeHH] = useState(); const [schdulBgndeMM, setSchdulBgndeMM] = useState(); @@ -42,6 +44,10 @@ function PopupWriter(props) { const [schdulEnddeMM, setSchdulEnddeMM] = useState(); const [boardAttachFiles, setBoardAttachFiles] = useState(); + const [confirm, setConfirm] = React.useState(); + + + useEffect(function () { initMode(); // eslint-disable-next-line react-hooks/exhaustive-deps @@ -108,13 +114,14 @@ function PopupWriter(props) { function (resp) { let rawDetail = resp.result; //기본값 설정 - setScheduleDetail({ + setPopupDetail({ ...popupDetail, ...rawDetail, startDate: convertDate(rawDetail.schdulBgnde), endDate: convertDate(rawDetail.schdulEndde), }); setText(rawDetail.contents); + setTextOriginal(rawDetail.contents); } ); } @@ -144,25 +151,35 @@ function PopupWriter(props) { body: formData } - if (modeInfo.mode === CODE.MODE_MODIFY) { - modeInfo.editURL = `${modeInfo.editURL}/${location.state?.popupId}`; - } - EgovNet.requestFetch(modeInfo.editURL, - requestOptions, - (resp) => { - if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) { - navigate({ pathname: URL.ADMIN__CONTENTS__POP_UP }); - } else { - navigate({pathname: URL.ERROR}, {state: {msg : resp.resultMessage}}); + const requestTask = (callbackParams) => { + EgovNet.requestFetch(callbackParams.requestUrl, + requestOptions, + (resp) => { + if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) { + if (modeInfo.mode === CODE.MODE_MODIFY) { + alert("게시글이 수정 되었습니다."); + } + navigate({ pathname: URL.ADMIN__CONTENTS__POP_UP }); + } else { + navigate({pathname: URL.ERROR}, {state: {msg : resp.resultMessage}}); + } } - } - ); + ); + }; + + + if (modeInfo.mode === CODE.MODE_CREATE) { + setConfirm({...confirm, open: true, body: "추가하시겠습니까?", yesCallback: requestTask, yesCallbackParams: {requestUrl:modeInfo.editURL}}); + } else if (modeInfo.mode === CODE.MODE_MODIFY) { + setConfirm({...confirm, open: true, body: "수정하시겠습니까?", yesCallback: requestTask, yesCallbackParams: {requestUrl:`${modeInfo.editURL}/${location.state?.popupId}`}}); + } + } } const onClickDelete = (popupId) => { - const deleteBoardURL = `/schedule/${popupId}`; + const deleteBoardURL = `/contents/api/popup-manage/${popupId}`; const requestOptions = { method: "DELETE", @@ -171,22 +188,37 @@ function PopupWriter(props) { } } - EgovNet.requestFetch(deleteBoardURL, - requestOptions, - (resp) => { - console.log("====>>> Schdule delete= ", resp); - if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) { - alert("게시글이 삭제되었습니다.") - navigate(URL.ADMIN__COMMITTEE__SCHEDULES ,{ replace: true }); - } else { - // alert("ERR : " + resp.message); - navigate({pathname: URL.ERROR}, {state: {msg : resp.resultMessage}}); + const requestTask = () => { + EgovNet.requestFetch(deleteBoardURL, + requestOptions, + (resp) => { + if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) { + alert("삭제 되었습니다."); + navigate(URL.ADMIN__CONTENTS__POP_UP ,{ replace: true }); + } else { + navigate({pathname: URL.ERROR}, {state: {msg : resp.resultMessage}}); + } } + ); + }; - } - ); + setConfirm({...confirm, open: true, body: "삭제하시겠습니까?", yesCallback: requestTask}); } + const onClickList = (e) => { + + const requestTask = () => { + navigate(URL.ADMIN__CONTENTS__POP_UP ,{ replace: true }); + }; + if( text !== textOriginal ) { + setConfirm({...confirm, open: true, body: "작업 내용을 취소하시겠습니까?", yesCallback: requestTask}); + } else { + requestTask(); + } + + } + + const convertDate = (str) => { let year = str.substring(0, 4); let month = str.substring(4, 6); @@ -244,7 +276,7 @@ function PopupWriter(props) {
setScheduleDetail({ ...popupDetail, title: e.target.value })} + onChange={(e) => setPopupDetail({ ...popupDetail, title: e.target.value })} />
@@ -260,7 +292,7 @@ function PopupWriter(props) { showTimeInput onChange={(date) => { console.log("setStartDate : ", date); - setScheduleDetail({ ...popupDetail, schdulBgnde: getDateFourteenDigit(date), schdulBgndeYYYMMDD: getYYYYMMDD(date), schdulBgndeHH: date.getHours(), schdulBgndeMM: date.getMinutes(), startDate: date }); + setPopupDetail({ ...popupDetail, schdulBgnde: getDateFourteenDigit(date), schdulBgndeYYYMMDD: getYYYYMMDD(date), schdulBgndeHH: date.getHours(), schdulBgndeMM: date.getMinutes(), startDate: date }); setSchdulBgndeHH(date.getHours()); setSchdulBgndeMM(date.getMinutes()); }} /> @@ -278,7 +310,7 @@ function PopupWriter(props) { minDate={popupDetail.startDate} onChange={(date) => { console.log("setEndDate: ", date); - setScheduleDetail({ ...popupDetail, schdulEndde: getDateFourteenDigit(date), schdulEnddeYYYMMDD: getYYYYMMDD(date), schdulEnddeHH: date.getHours(), schdulEnddeMM: date.getMinutes(), endDate: date }); + setPopupDetail({ ...popupDetail, schdulEndde: getDateFourteenDigit(date), schdulEnddeYYYMMDD: getYYYYMMDD(date), schdulEnddeHH: date.getHours(), schdulEnddeMM: date.getMinutes(), endDate: date }); setSchdulEnddeHH(date.getHours()); setSchdulEnddeMM(date.getMinutes()); } @@ -295,7 +327,7 @@ function PopupWriter(props) { for ( let i = 0; i < attachfile.length; i++) { arrayConcat[`file_${i}`] = attachfile[i]; } - setScheduleDetail(arrayConcat); + setPopupDetail(arrayConcat); }} fnDeleteFile={(deletedFile) => { console.log("====>>> Delete deletedFile = ", deletedFile); @@ -324,11 +356,13 @@ function PopupWriter(props) { }
- 목록 +
{/* */} + {/* */}