Commit @1c2ea7a21dae8384a123724bd7a759716cf316fc

EctorKim 2023-03-06

230306 김동준 QnA 등록 수정

@1c2ea7a21dae8384a123724bd7a759716cf316fc

5d858df

1c2ea7a

client/views/component/QnAModal.jsx

--- client/views/component/QnAModal.jsx

+++ client/views/component/QnAModal.jsx

...	...	@@ -4,45 +4,106 @@
4	4	import SubTitle from "./SubTitle.jsx";
5	5	import { useNavigate } from "react-router";
6	6
7		-export default function QaAModal({ open, close, }) {
	7	+export default function QnAModal({ open, close }) {
	8	+ const [qnaRegisteringList, setQnaRegisteringList] = React.useState([]);
	9	+
	10	+ const [idx, setIdx] = React.useState();
	11	+ const [title, setTitle] = React.useState("");
	12	+ const [datetime, setDatetime] = React.useState("");
	13	+ const [contents, setContents] = React.useState("");
	14	+
	15	+ //qna등록
	16	+ const getQnaRegisteringList = () => {
	17	+ fetch("/qna/qnaInsert.json", {
	18	+ method: "POST",
	19	+ headers: {
	20	+ "Content-Type": "application/json; charset=UTF-8;",
	21	+ },
	22	+ body: JSON.stringify({
	23	+ qna_idx: idx,
	24	+ qna_title: title,
	25	+ qna_insert_user_id: "gym1004",
	26	+ qna_insert_datetime: datetime,
	27	+ }),
	28	+ })
	29	+ .then((response) => response.json())
	30	+ .then((data) => {
	31	+ if (data > 0) {
	32	+ console.log(data);
	33	+ alert("등록완료");
	34	+ close(true);
	35	+ } else {
	36	+ alert("등록실패, 관리자에게 문의해주세요.");
	37	+ }
	38	+ })
	39	+ .catch((error) => {
	40	+ console.log("qna error : ", error);
	41	+ });
	42	+ };
	43	+
	44	+ //게시판
	45	+ const thead = ["제목", "작성자", "작성일자"];
	46	+ const key = ["qna_title", "qna_insert_user_name", "qna_insert_datetime"];
	47	+
8	48	return (
9	49	<div class={open ? "openModal modal" : "modal"}>
10		- {open ? (
11		- <div className="modal-inner">
12		- <div className="modal-header flex">
13		- Q&A등록
14		- <Button className={"close"} onClick={close} btnName={"X"} />
15		- </div>
16		- <div className="modal-main"><div className="board-wrap">
17		- <div>
18		- <SubTitle explanation={"작성자 정보"} />
19		- <table className="margin-bottom2 qna-insert">
20		- <tr>
21		- <th>작성자</th>
22		- <td>
23		- <input type="text" placeholder="자동입력부분" />
24		- </td>
25		- </tr>
	50	+ {open ? (
	51	+ <div className="modal-inner">
	52	+ <div className="modal-header flex">
	53	+ Q&A등록
	54	+ <Button className={"close"} onClick={close} btnName={"X"} />
	55	+ </div>
	56	+ <div className="modal-main">
	57	+ <div className="board-wrap">
	58	+ <div>
	59	+ <SubTitle explanation={"작성자 정보"} />
	60	+ <table className="margin-bottom2 qna-insert">
	61	+ <tr>
	62	+ <th>작성자</th>
	63	+ <td>
	64	+ <input type="text" placeholder="자동입력부분" />
	65	+ </td>
	66	+ </tr>
26	67
27		- <tr>
28		- <th>제목</th>
29		- <td colSpan={3}>
30		- <input type="text" />
31		- </td>
32		- </tr>
33		- <tr>
34		- <th>내용</th>
35		- <td colSpan={3}>
36		- <textarea className="medicine" cols="30" rows="2"></textarea>
37		- </td>
38		- </tr>
39		- </table>
	68	+ <tr>
	69	+ <th>제목</th>
	70	+ <td colSpan={3}>
	71	+ <input
	72	+ type="text"
	73	+ value={title}
	74	+ onInput={(e) => {
	75	+ setTitle(e.target.value);
	76	+ }}
	77	+ />
	78	+ </td>
	79	+ </tr>
	80	+ <tr>
	81	+ <th>내용</th>
	82	+ <td colSpan={3}>
	83	+ <textarea
	84	+ className="medicine"
	85	+ cols="30"
	86	+ rows="2"
	87	+ value={contents}
	88	+ onInput={(e) => {
	89	+ setContents(e.target.value);
	90	+ }}
	91	+ ></textarea>
	92	+ </td>
	93	+ </tr>
	94	+ </table>
	95	+ </div>
	96	+ <div className="flex-center">
	97	+ <Button
	98	+ className={"btn-small red-btn"}
	99	+ btnName={"저장"}
	100	+ onClick={() => getQnaRegisteringList()}
	101	+ />
	102	+ </div>
	103	+ </div>
	104	+ </div>
40	105	</div>
41		- <div className="flex-center"><Button className={"btn-small red-btn"} btnName={"저장"} /></div >
42		- </div></div>
43		- </div>
44		- ) : null}
45		- </div>
46		-
	106	+ ) : null}
	107	+ </div>
47	108	);
48	109	}

5d858df

1c2ea7a

client/views/pages/App.jsx

--- client/views/pages/App.jsx

+++ client/views/pages/App.jsx


   };
 
 
-  const menuItems = GuardianApp.menuItems;  //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp 
-  const AppRoute = GuardianApp.AppRoute;
+  const menuItems = AllApp.menuItems;  //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp 
+  const AppRoute = AllApp.AppRoute;
 
 
   const { title } = menuItems.find(

5d858df

1c2ea7a

client/views/pages/callcenter/QuestionConfirm.jsx

--- client/views/pages/callcenter/QuestionConfirm.jsx

+++ client/views/pages/callcenter/QuestionConfirm.jsx


 import { useNavigate } from "react-router";
 
 export default function QuestionConfirm() {
+
   const navigate = useNavigate();
+
+
   return (
     <main>
       <div className="content-wrap row">

             className={"btn-large gray-btn"}
             btnName={"이전"}
             onClick={() => {
-              navigate("/QandASelect");
+              navigate("/QuestionSelect");
             }}
           />
           <Button
             className={"btn-large green-btn"}
             btnName={"등록"}
             onClick={() => {
-              navigate("/QandASelect");
+              navigate("/QuestionSelect");
             }}
           />
         </div>

5d858df

1c2ea7a

client/views/pages/callcenter/QuestionSelect.jsx

--- client/views/pages/callcenter/QuestionSelect.jsx

+++ client/views/pages/callcenter/QuestionSelect.jsx


   const openModal = () => {
     setModalOpen(true);
   };
-  const closeModal = () => {
+  const closeModal = (isInsertComplete) => {
     setModalOpen(false);
+    if (isInsertComplete == true) {
+      getQnaList();
+    }
   };
 
-  const [qnaList, setQnaList] = React.useState();
+  const [qnaList, setQnaList] = React.useState([]);
 
-  const [state, setState] = React.useState();
-  const [title, setTitle] = React.useState();
-  const [username, setUsername] = React.useState();
-  const [datetime, setDatetime] = React.useState();
+  const [idx, setIdx] = React.useState();
 
   //-------- 페이징 작업 설정 시작 --------//
   const limit = 15; // 페이지당 보여줄 공지 개수

       },
       body: JSON.stringify({
 
-        qna_state: state,
-        qna_title: title,
-        qna_insert_user_id: username,
-        qna_insert_datetime: datetime,
+        qna_idx: idx,
+
       }),
     })
       .then((response) => response.json())
       .then((data) => {
         console.log(data);
         setQnaList(data);
-        // setMyQnaTotal(data.length);
+        setMyQnaTotal(data.length);
       })
       .catch((error) => {
         console.log(

 
   //게시판
   const thead = ["No", "답변상태", "제목", "작성자", "작성일자"];
-  const key = ["idx", "state", "title", "username", "datetime"];
-  const content = [
-    {
-      No: 1,
-      answer: "답변완료",
-      title: (
-        <div
-          className="title"
-          onClick={() => {
-            navigate("/QuestionConfirm");
-          }}
-        >
-          담당자 바꿔주세요
-        </div>
-      ),
-      writer: "홍길동",
-      date: "2023-01-27",
-    },
-  ];
+  const key = ["qna_idx", "qna_state", "qna_title", "qna_insert_user_name", "qna_insert_datetime"];
+  
 
   React.useEffect(() => {
 

         <Table
           className="equipment-detail"
           head={thead}
-          contents={content}
+          contents={qnaList}
           contentKey={key}
           view={"qna"}
           offset={offset}

5d858df

1c2ea7a

server/modules/web/Server.js

--- server/modules/web/Server.js

+++ server/modules/web/Server.js


 webServer.get('*', function (request, response, next) {
     response.sendFile(`${BASE_DIR}/client/views/index.html`);
 })
+
 /**
 + * @author : 방선주
 + * @since : 2023.02.14
 + * @dscription : REST API 서버에 데이터 요청 보내기(Proxy)
 + */
-+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
-        proxyReqPathResolver: function (request) {
-            //console.log('request : ', request.url, request.params[0]);
-            return `${request.params['0']}.json`;
-        }
-    }));
+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
+    proxyReqPathResolver: function (request) {
+        //console.log('request : ', request.url, request.params[0]);
+        return `${request.params['0']}.json`;
+    }
+}));
+    
 /**
  * @author : 최정우
  * @since : 2022.09.21

Add a comment

Open 0
Closed 0

List

...	...	@@ -26,8 +26,8 @@
26	26	};
27	27
28	28
29		- const menuItems = GuardianApp.menuItems; //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp
30		- const AppRoute = GuardianApp.AppRoute;
	29	+ const menuItems = AllApp.menuItems; //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp
	30	+ const AppRoute = AllApp.AppRoute;
31	31
32	32
33	33	const { title } = menuItems.find(

...	...	@@ -5,7 +5,10 @@
5	5	import { useNavigate } from "react-router";
6	6
7	7	export default function QuestionConfirm() {
	8	+
8	9	const navigate = useNavigate();
	10	+
	11	+
9	12	return (
10	13	<main>
11	14	<div className="content-wrap row">
...	...	@@ -44,14 +47,14 @@
44	47	className={"btn-large gray-btn"}
45	48	btnName={"이전"}
46	49	onClick={() => {
47		- navigate("/QandASelect");
	50	+ navigate("/QuestionSelect");
48	51	}}
49	52	/>
50	53	<Button
51	54	className={"btn-large green-btn"}
52	55	btnName={"등록"}
53	56	onClick={() => {
54		- navigate("/QandASelect");
	57	+ navigate("/QuestionSelect");
55	58	}}
56	59	/>
57	60	</div>

...	...	@@ -13,16 +13,16 @@
13	13	const openModal = () => {
14	14	setModalOpen(true);
15	15	};
16		- const closeModal = () => {
	16	+ const closeModal = (isInsertComplete) => {
17	17	setModalOpen(false);
	18	+ if (isInsertComplete == true) {
	19	+ getQnaList();
	20	+ }
18	21	};
19	22
20		- const [qnaList, setQnaList] = React.useState();
	23	+ const [qnaList, setQnaList] = React.useState([]);
21	24
22		- const [state, setState] = React.useState();
23		- const [title, setTitle] = React.useState();
24		- const [username, setUsername] = React.useState();
25		- const [datetime, setDatetime] = React.useState();
	25	+ const [idx, setIdx] = React.useState();
26	26
27	27	//-------- 페이징 작업 설정 시작 --------//
28	28	const limit = 15; // 페이지당 보여줄 공지 개수
...	...	@@ -39,17 +39,15 @@
39	39	},
40	40	body: JSON.stringify({
41	41
42		- qna_state: state,
43		- qna_title: title,
44		- qna_insert_user_id: username,
45		- qna_insert_datetime: datetime,
	42	+ qna_idx: idx,
	43	+
46	44	}),
47	45	})
48	46	.then((response) => response.json())
49	47	.then((data) => {
50	48	console.log(data);
51	49	setQnaList(data);
52		- // setMyQnaTotal(data.length);
	50	+ setMyQnaTotal(data.length);
53	51	})
54	52	.catch((error) => {
55	53	console.log(
...	...	@@ -61,25 +59,8 @@
61	59
62	60	//게시판
63	61	const thead = ["No", "답변상태", "제목", "작성자", "작성일자"];
64		- const key = ["idx", "state", "title", "username", "datetime"];
65		- const content = [
66		- {
67		- No: 1,
68		- answer: "답변완료",
69		- title: (
70		- <div
71		- className="title"
72		- onClick={() => {
73		- navigate("/QuestionConfirm");
74		- }}
75		- >
76		- 담당자 바꿔주세요
77		- </div>
78		- ),
79		- writer: "홍길동",
80		- date: "2023-01-27",
81		- },
82		- ];
	62	+ const key = ["qna_idx", "qna_state", "qna_title", "qna_insert_user_name", "qna_insert_datetime"];
	63	+
83	64
84	65	React.useEffect(() => {
85	66
...	...	@@ -115,7 +96,7 @@
115	96	<Table
116	97	className="equipment-detail"
117	98	head={thead}
118		- contents={content}
	99	+ contents={qnaList}
119	100	contentKey={key}
120	101	view={"qna"}
121	102	offset={offset}

...	...	@@ -96,17 +96,19 @@
96	96	webServer.get('*', function (request, response, next) {
97	97	response.sendFile(`${BASE_DIR}/client/views/index.html`);
98	98	})
	99	+
99	100	/**
100	101	+ * @author : 방선주
101	102	+ * @since : 2023.02.14
102	103	+ * @dscription : REST API 서버에 데이터 요청 보내기(Proxy)
103	104	+ */
104		-+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
105		- proxyReqPathResolver: function (request) {
106		- //console.log('request : ', request.url, request.params[0]);
107		- return `${request.params['0']}.json`;
108		- }
109		- }));
	105	+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
	106	+ proxyReqPathResolver: function (request) {
	107	+ //console.log('request : ', request.url, request.params[0]);
	108	+ return `${request.params['0']}.json`;
	109	+ }
	110	+}));
	111	+
110	112	/**
111	113	* @author : 최정우
112	114	* @since : 2022.09.21

Delete comment