중간 저장

egovframe-template-simple-react-contribution/src/components/file/FileDragDrop.jsx

@@ -7,12 +7,12 @@ import { FileUploader } from "react-drag-drop-files";
  * @param {fileTypes} const fileTypes = ["JPG", "PNG", "GIF"]; 
  * @returns 
  */
-function FileDragDrop({fileTypes, children, multiple, label, onDrop, handleChange, file, setFile, dropMessageStyle}) {
+function FileDragDrop({fileTypes, children, multiple, label, onDrop, handleChange, file, setFile, dropMessageStyle, name}) {
 
   return (
     <FileUploader
         handleChange={handleChange}
-        name="file"
+        name={name}
         types={fileTypes ? fileTypes : "*"}
         multiple={multiple && false}
         label={label}

egovframe-template-simple-react-contribution/src/pages/admin/committee/ProgressStatus.jsx

@@ -213,7 +213,7 @@ function ProgressStatus(props) {
                                     getList({ ...searchCondition, pageIndex: passedPage })
                                 }} />
                                 <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__CONTENTS__POP_UP__CREATE} className="btn btn_blue_h46 w_100">등록</Link>
+                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS__CREATE} className="btn btn_blue_h46 w_100">등록</Link>
                                 </div>
                                 
                             </div>

egovframe-template-simple-react-contribution/src/pages/admin/committee/ProgressStatus/Edit.jsx

@@ -1,6 +1,10 @@
 import React, { useState, useEffect } from 'react';
 import { Link, useLocation, useNavigate } from 'react-router-dom';
 import DatePicker from "react-datepicker";
+import AttachFileIcon from '@mui/icons-material/AttachFile';
+
+
+import FileDragDrop from "components/file/FileDragDrop";
 
 
 
@@ -53,6 +57,37 @@ const StyledDiv = styled.div`
     }
 `;
 
+
+function AttachFile(props) {
+
+    const fileTypes = ["JPG", "PNG", "GIF", "PDF", "HWP", "HWPX", "ZIP", "JPEG", "MP4", "TXT"];
+    const onDrop = (e) => {
+        //alert('ddd');
+    };
+    
+    const handleChange = (file) => {        
+        props.setFile(file);
+    };    
+
+    return (
+        <FileDragDrop
+            className="file-drag-drop"
+            multiple={false}
+            name={props.name}
+            fileTypes={fileTypes}
+            onDrop={onDrop}
+            handleChange={handleChange}
+            dropMessageStyle={{backgroundColor: '#cfe2ff'}}
+        >
+            <div>
+                <AttachFileIcon />
+                {props.file ? props.file.name : props.fileName ? props.fileName : "파일을 마우스로 끌어놓으세요."}
+            </div>
+        </FileDragDrop>
+    );
+    
+}
+
 function SchedulesEdit(props) {
     console.group("EgovAdminScheduleEdit");
     console.log("[Start] EgovAdminScheduleEdit ------------------------------");
@@ -79,19 +114,16 @@ function SchedulesEdit(props) {
     console.log("EgovAdminScheduleEdit [location] : ", location);
 
     const [modeInfo, setModeInfo] = useState({ mode: props.mode });
-    const [scheduleDetail, setScheduleDetail] = useState
+    const [requestItems, setRequestItems] = useState
         (
             {
                 startDate: new Date(),         
-                endDate: new Date(),            
                 eventId : 0,
             }
         );
 
     const [schdulBgndeHH, setSchdulBgndeHH] = useState();
     const [schdulBgndeMM, setSchdulBgndeMM] = useState();
-    const [schdulEnddeHH, setSchdulEnddeHH] = useState();
-    const [schdulEnddeMM, setSchdulEnddeMM] = useState();
 
     const [scheduleInit, setScheduleInit] = useState({});
     const [scheduleApiOrgApiDepthList, setScheduleApiOrgApiDepthList] = useState({ });
@@ -148,14 +180,7 @@ function SchedulesEdit(props) {
                     resp
                 );
 
-                if (modeInfo.mode === CODE.MODE_CREATE) {// 조회/등록이면 조회 안함
+                if (modeInfo.mode === CODE.MODE_CREATE) {     
-                    setScheduleDetail({
-                        ...scheduleDetail,
-                        schdulBgnde:  location.state.iUseDate,
-                        schdulEndde: location.state.iUseDate,
-                        startDate: convertDate(location.state.iUseDate),
-                        endDate: convertDate(location.state.iUseDate),
-                    });
                     return;
                 }
         
@@ -169,15 +194,6 @@ function SchedulesEdit(props) {
                 EgovNet.requestFetch(retrieveDetailURL,
                     requestOptions,
                     function (resp) {                        
-
-                        let rawScheduleDetail = resp.result;
-                        //기본값 설정
-                        setScheduleDetail({
-                            ...scheduleDetail,
-                            ...rawScheduleDetail,
-                            startDate: convertDate(rawScheduleDetail.schdulBgnde),
-                            endDate: convertDate(rawScheduleDetail.schdulEndde),
-                        });
                     }
                 );
             }
@@ -188,16 +204,16 @@ function SchedulesEdit(props) {
     const updateSchedule = () => {
         const formData = new FormData();
         
-        for (let key in scheduleDetail) {
+        for (let key in requestItems) {
             if ( key === 'startDate' ) {
-                formData.append(key, getDateFourteenDigit( scheduleDetail[key] ));
+                formData.append(key, getDateFourteenDigit( requestItems[key] ));
             } else if( key === 'endDate' ) {
-                formData.append(key, getDateFourteenDigit( scheduleDetail[key] ));
+                formData.append(key, getDateFourteenDigit( requestItems[key] ));
             } else {
-                formData.append(key, scheduleDetail[key]);
+                formData.append(key, requestItems[key]);
             }
             
-            console.log("scheduleDetail [%s] ", key, scheduleDetail[key]);
+            console.log("requestItems [%s] ", key, requestItems[key]);
         }
 
         if ( formValidator(formData) ) {
@@ -263,13 +279,13 @@ function SchedulesEdit(props) {
     }, []);
 
     useEffect(function () {
-        console.log("------------------------------EgovAdminScheduleEdit [%o]", scheduleDetail);
+        console.log("------------------------------EgovAdminScheduleEdit [%o]", requestItems);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [scheduleDetail]);
+    }, [requestItems]);
 
     useEffect(function () {        
 
-        EgovNet.requestFetch(`/schedule/api/org-api/depth/list?paramCodeGroup=${scheduleDetail.upCommittee}`,
+        EgovNet.requestFetch(`/schedule/api/org-api/depth/list?paramCodeGroup=${requestItems.upCommittee}`,
             requestOptions,
             function (resp) {
                 setScheduleApiOrgApiDepthList(
@@ -277,9 +293,9 @@ function SchedulesEdit(props) {
                 );                
             }
         );
-        console.log("------------------------------EgovAdminScheduleEdit [%o]", scheduleDetail);
+        console.log("------------------------------EgovAdminScheduleEdit [%o]", requestItems);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [scheduleDetail && scheduleDetail.upCommittee]);
+    }, [requestItems && requestItems.upCommittee]);
     
 
     const onClickDeleteSchedule = (schdulId) => {
@@ -307,6 +323,24 @@ function SchedulesEdit(props) {
         );
     }
 
+    //사전검토자료
+    const [preDataFile, setPreDataFile] = useState(null);
+    const [preDataFileName, setPreDataFileName] = useState(null);
+    //사전검토양식
+    const [preFormFile, setPreFormFile] = useState(null);
+    const [preFormFileName, setPreFormFileName] = useState(null);
+    //관계기관의견
+    const [partnerFile, setPartnerFile] = useState(null);
+    const [partnerFileName, setPartnerFileName] = useState(null);
+    //조치계획서
+    //const [preDataFile, setPreDataFile] = useState(null);
+    //const [preDataFileName, setPreDataFileName] = useState(null);
+    //조치결과서
+    //const [preDataFile, setPreDataFile] = useState(null);
+    //const [preDataFileName, setPreDataFileName] = useState(null);
+
+
+
     console.log("------------------------------EgovAdminScheduleEdit [End]");
     console.groupEnd("EgovAdminScheduleEdit");
     return (
@@ -318,7 +352,7 @@ function SchedulesEdit(props) {
                         <li><Link to={URL.MAIN} className="home">Home</Link></li>
                         <li><Link to={URL.ADMIN}>사이트 관리</Link></li>
                         <li>위원회 관리</li>
-                        <li>위원회 일정 관리</li>
+                        <li>진행현황 관리</li>
                     </ul>
                 </div>
                 {/* <!--// Location --> */}
@@ -332,20 +366,36 @@ function SchedulesEdit(props) {
                         {/* <!-- 본문 --> */}
 
                         <div className="top_tit">
-                            <h1 className="tit_1">위원회 일정 관리</h1>
+                            <h1 className="tit_1">진행현황 관리</h1>
                         </div>
 
-                        {/* <!-- <h2 className="tit_2">위원회 일정 추가</h2> --> */}
-
                         {/* <!-- 게시판 상세보기 --> */}
                         <StyledDiv className="board_view2">
                             <dl>
-                                <dt>구분<span className="req">필수</span></dt>
+                                <dt><label htmlFor="title">안건</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <input className="f_input2 w_full" type="text" name="title" title="안건" id="title" placeholder="안건을 입력하세요."
+                                        value={requestItems.title}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
+                                    />
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">기준코드</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
+                                        value={requestItems.title}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
+                                    />
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">구분</label><span className="req">필수</span></dt>
                                 <dd>
                                     <label className="f_select w_150" htmlFor="div-meet">
                                         <select id="div-meet" name="div-meet" title="일정구분"
-                                            value={scheduleDetail.divMeet}
+                                            value={requestItems.divMeet}
-                                            onChange={(e) => setScheduleDetail({ ...scheduleDetail, divMeet: e.target.value })}>
+                                            onChange={(e) => setRequestItems({ ...requestItems, divMeet: e.target.value })}>
                                             <option key={"none"} value="">선택</option>
                                             {scheduleInit && scheduleInit.result && scheduleInit.result.listCodes
                                             && scheduleInit.result.listCodes.map((item) => (
@@ -356,12 +406,34 @@ function SchedulesEdit(props) {
                                 </dd>
                             </dl>
                             <dl>
-                                <dt>심의위원회<span className="req">필수</span></dt>
+                                <dt><label htmlFor="title">회의일자</label><span className="req">필수</span></dt>
+                                <dd className="datetime">
+                                    <span className="line_break">
+                                        <DatePicker
+                                            selected={requestItems.startDate}
+                                            name="schdulBgnde"
+                                            className="f_input"
+                                            dateFormat="yyyy-MM-dd HH:mm"
+                                            showTimeInput
+                                            onChange={(date) => {
+                                                console.log("setStartDate : ", date);
+                                                setRequestItems({ ...requestItems, schdulBgnde: getDateFourteenDigit(date), schdulBgndeYYYMMDD: getYYYYMMDD(date), schdulBgndeHH: date.getHours(), schdulBgndeMM: date.getMinutes(), startDate: date });
+                                                setSchdulBgndeHH(date.getHours());
+                                                setSchdulBgndeMM(date.getMinutes());
+                                            }} />
+                                        <input type="hidden" name="schdulBgndeHH" defaultValue={schdulBgndeHH} readOnly />
+                                        <input type="hidden" name="schdulBgndeMM" defaultValue={schdulBgndeMM} readOnly />
+                                    </span>
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">위원회</label><span className="req">필수</span></dt>
                                 <dd>
-                                    <label className="f_select w_250 up-committe" htmlFor="up-committee">
+                                    {/** top org */}
-                                        <select id="up-committe" name="up-committe" title="심의위원회-상위"
+                                    <label className="f_select w_250 org-group-id" htmlFor="org-group-id">
-                                            value={scheduleDetail.upCommittee}
+                                        <select id="org-group-id" name="orgGroupId" title="심의위원회-상위"
-                                            onChange={(e) => setScheduleDetail({ ...scheduleDetail, upCommittee: e.target.value })}>
+                                            value={requestItems.upCommittee}
+                                            onChange={(e) => setRequestItems({ ...requestItems, upCommittee: e.target.value })}>
                                             <option value="">선택</option>
                                             {scheduleInit && scheduleInit.result && scheduleInit.result.listTopOrg
                                             && scheduleInit.result.listTopOrg.map((item) => (
@@ -369,10 +441,21 @@ function SchedulesEdit(props) {
                                             ))}
                                         </select>
                                     </label>
-                                    <label className="f_select w_250 org-under-id" htmlFor="committee">
+                                    <label className="f_select w_250 org-group-id-1" htmlFor="org-group-id-1">
-                                        <select id="committee" name="committee" title="심의위원회-하위"
+                                        <select id="org-group-id-1" name="orgGroupId1" title="심의위원회-상위"
-                                            value={scheduleDetail.committee}
+                                            value={requestItems.upCommittee}
-                                            onChange={(e) => setScheduleDetail({ ...scheduleDetail, committee: e.target.value })}>
+                                            onChange={(e) => setRequestItems({ ...requestItems, upCommittee: e.target.value })}>
+                                            <option value="">선택</option>
+                                            {scheduleInit && scheduleInit.result && scheduleInit.result.listTopOrg
+                                            && scheduleInit.result.listTopOrg.map((item) => (
+                                                <option key={item.id} value={item.id}>{item.name}</option>
+                                            ))}
+                                        </select>
+                                    </label>
+                                    <label className="f_select w_250 org-group-id-2" htmlFor="org-group-id-2">
+                                        <select id="org-group-id-2" name="orgGroupId2" title="심의위원회-하위"
+                                            value={requestItems.committee}
+                                            onChange={(e) => setRequestItems({ ...requestItems, committee: e.target.value })}>
                                             <option value="">선택</option>
                                             {scheduleApiOrgApiDepthList && scheduleApiOrgApiDepthList.result && scheduleApiOrgApiDepthList.result.list
                                             && scheduleApiOrgApiDepthList.result.list.map((item) => (
@@ -382,12 +465,67 @@ function SchedulesEdit(props) {
                                     </label>
                                 </dd>
                             </dl>
+                            <dl>
+                                <dt><label htmlFor="title">사전검토자료</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <AttachFile name="preDataFile" file={preDataFile} setFile={setPreDataFile} fileName={preDataFileName}  />
+                                </dd>                                
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">사전검토양식</label><span className="req">필수</span></dt>
+                                <dd>                                   
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">관계기관의견</label><span className="req">필수</span></dt>
+                                <dd>                                   
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">조치계획서</label><span className="req">필수</span></dt>
+                                <dd>                                   
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">조치결과서</label><span className="req">필수</span></dt>
+                                <dd>
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">회의담당자</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
+                                        value={requestItems.title}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
+                                    />
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">회의실 비밀번호</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
+                                        value={requestItems.title}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
+                                    />
+                                </dd>
+                            </dl>
+                            <dl>
+                                <dt><label htmlFor="title">회의 안건</label><span className="req">필수</span></dt>
+                                <dd>
+                                    <input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
+                                        value={requestItems.title}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
+                                    />
+                                </dd>
+                            </dl>
+
+
                             <dl>
                                 <dt><label htmlFor="title">제목</label><span className="req">필수</span></dt>
                                 <dd>
                                     <input className="f_input2 w_full" type="text" name="title" title="제목" id="title" placeholder="제목을 입력하세요."
-                                        value={scheduleDetail.title}
+                                        value={requestItems.title}
-                                        onChange={(e) => setScheduleDetail({ ...scheduleDetail, title: e.target.value })}
+                                        onChange={(e) => setRequestItems({ ...requestItems, title: e.target.value })}
                                     />
                                 </dd>
                             </dl>
@@ -395,56 +533,16 @@ function SchedulesEdit(props) {
                                 <dt><label htmlFor="location">장소</label><span className="req">필수</span></dt>
                                 <dd>
                                     <input className="f_input2 w_full" type="text" name="location" title="장소" id="location" placeholder="장소를 입력하세요."
-                                        defaultValue={scheduleDetail.location}
+                                        defaultValue={requestItems.location}
-                                        onChange={(e) => setScheduleDetail({ ...scheduleDetail, location: e.target.value })} />
+                                        onChange={(e) => setRequestItems({ ...requestItems, location: e.target.value })} />
-                                </dd>
-                            </dl>
-                            <dl>
-                                <dt>날짜/시간<span className="req">필수</span></dt>
-                                <dd className="datetime">
-                                    <span className="line_break">
-                                        <DatePicker
-                                            selected={scheduleDetail.startDate}
-                                            name="schdulBgnde"
-                                            className="f_input"
-                                            dateFormat="yyyy-MM-dd HH:mm"
-                                            showTimeInput
-                                            onChange={(date) => {
-                                                console.log("setStartDate : ", date);
-                                                setScheduleDetail({ ...scheduleDetail, schdulBgnde: getDateFourteenDigit(date), schdulBgndeYYYMMDD: getYYYYMMDD(date), schdulBgndeHH: date.getHours(), schdulBgndeMM: date.getMinutes(), startDate: date });
-                                                setSchdulBgndeHH(date.getHours());
-                                                setSchdulBgndeMM(date.getMinutes());
-                                            }} />
-                                        <input type="hidden" name="schdulBgndeHH" defaultValue={schdulBgndeHH} readOnly />
-                                        <input type="hidden" name="schdulBgndeMM" defaultValue={schdulBgndeMM} readOnly />
-                                        <span className="f_inn_txt">~</span>
-                                    </span>
-                                    <span className="line_break">
-                                        <DatePicker
-                                            selected={scheduleDetail.endDate}
-                                            name="schdulEndde"
-                                            className="f_input"
-                                            dateFormat="yyyy-MM-dd HH:mm"
-                                            showTimeInput
-                                            minDate={scheduleDetail.startDate}
-                                            onChange={(date) => {
-                                                console.log("setEndDate: ", date);
-                                                setScheduleDetail({ ...scheduleDetail, schdulEndde: getDateFourteenDigit(date), schdulEnddeYYYMMDD: getYYYYMMDD(date), schdulEnddeHH: date.getHours(), schdulEnddeMM: date.getMinutes(), endDate: date });
-                                                setSchdulEnddeHH(date.getHours());
-                                                setSchdulEnddeMM(date.getMinutes());
-                                            }
-                                            } />
-                                        <input type="hidden" name="schdulEnddeHH" defaultValue={schdulEnddeHH} readOnly />
-                                        <input type="hidden" name="schdulEnddeMM" defaultValue={schdulEnddeMM} readOnly />
-                                    </span>
                                 </dd>
                             </dl>
                             <dl>
                                 <dt><label htmlFor="contents">내용</label><span className="req">필수</span></dt>
                                 <dd>
                                     <textarea className="f_txtar w_full h_100" name="contents" id="contents" cols="30" rows="10" placeholder="일정 내용을 입력하세요."
-                                        defaultValue={scheduleDetail.contents}
+                                        defaultValue={requestItems.contents}
-                                        onChange={(e) => setScheduleDetail({ ...scheduleDetail, contents: e.target.value })}
+                                        onChange={(e) => setRequestItems({ ...requestItems, contents: e.target.value })}
                                     ></textarea>
                                 </dd>
                             </dl>
@@ -465,7 +563,7 @@ function SchedulesEdit(props) {
                                 </div>
 
                                 <div className="right_col btn1">
-                                    <Link to={URL.ADMIN__COMMITTEE__SCHEDULES} className="btn btn_blue_h46 w_100">목록</Link>
+                                    <Link to={URL.ADMIN__COMMITTEE__PROGRESS_STATUS} className="btn btn_blue_h46 w_100">목록</Link>
                                 </div>
                             </div>
                             {/* <!--// 버튼영역 --> */}