feat: 관리자 - 컨텐츠관리 - 팝업관리에서 특정 팝업 눌러서 삭제 및 수정 시 물어보고 수행하도록 로직 변경
parent
081f34f883
commit
9769d3b48c
|
|
@ -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 <Slide direction="up" ref={ref} {...props} />;
|
||||
});
|
||||
|
||||
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 (
|
||||
<React.Fragment>
|
||||
{confirm &&
|
||||
<Dialog
|
||||
open={ confirm.open }
|
||||
TransitionComponent={Transition}
|
||||
keepMounted
|
||||
onClose={handleClose}
|
||||
aria-describedby="alert-dialog-slide-description"
|
||||
>
|
||||
<DialogTitle>{confirm.title ? confirm.title : "알림"}</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText id="alert-dialog-slide-description">{confirm.body}</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => {handleClose(); confirm.yesCallback && confirm.yesCallback(confirm.yesCallbackParams);}}>{confirm.yes ? confirm.yes : "예"}</Button>
|
||||
<Button onClick={() => {handleClose(); confirm.noCallback && confirm.noCallback(confirm.noCallbackParams);}}>{confirm.no ? confirm.no : "아니요"}</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
}
|
||||
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
|
|
@ -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: '' });
|
||||
|
|
@ -52,6 +55,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 (
|
||||
<div className="location">
|
||||
|
|
@ -106,11 +135,11 @@ function PopUp(props) {
|
|||
<p className="no_data" key="0">검색된 결과가 없습니다.</p>
|
||||
}
|
||||
{listPopup.map((it)=>(
|
||||
<div className='list_item'>
|
||||
<div className='list_item' key={it.seq}>
|
||||
<div>{it.seq}</div>
|
||||
<div className="al"><Link to={URL.ADMIN__CONTENTS__POP_UP__MODIFY} state={{popupId: it.seq} } key={it.seq}>{it.popupTitle}</Link></div>
|
||||
<div>{it.startDate} ~ {it.endDate}</div>
|
||||
<div>{it.useYn === 'Y' ? <Switch {...label} defaultChecked /> : <Switch {...label} />}</div>
|
||||
<div>{it.useYn === 'Y' ? <Switch {...label} key={it.seq} onChange={(e) => onChangeActivationSwitch(e, it.seq)} defaultChecked /> : <Switch key={it.seq} onChange={(e) => onChangeActivationSwitch(e, it.seq)} {...label} />}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -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) {
|
|||
<dd>
|
||||
<input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
|
||||
value={popupDetail.title}
|
||||
onChange={(e) => setScheduleDetail({ ...popupDetail, title: e.target.value })}
|
||||
onChange={(e) => setPopupDetail({ ...popupDetail, title: e.target.value })}
|
||||
/>
|
||||
</dd>
|
||||
</dl>
|
||||
|
|
@ -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) {
|
|||
}
|
||||
</div>
|
||||
<div className="right_col btn1">
|
||||
<Link to={URL.ADMIN__CONTENTS__POP_UP} className="btn btn_blue_h46 w_100">목록</Link>
|
||||
<button className="btn btn_blue_h46 w_100"
|
||||
onClick={onClickList}>목록</button>
|
||||
</div>
|
||||
</div>
|
||||
{/* <!--// 버튼영역 --> */}
|
||||
|
||||
<AlertDialogSlide confirm={confirm} setConfirm={setConfirm} />
|
||||
</StyledDiv>
|
||||
{/* <!--// 본문 --> */}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue