Commit @851b879d061966c32599ed2e531c76fa0c7f5d93

EctorKim 2023-03-03

230303 김동준 Table 수정

@851b879d061966c32599ed2e531c76fa0c7f5d93

635be6a

851b879

client/views/component/Table.jsx

--- client/views/component/Table.jsx

+++ client/views/component/Table.jsx


 import { useNavigate } from "react-router";
 // import styled from "styled-components";
 
-export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit }) {
+export default function Table({
+  head,
+  contents,
+  contentKey,
+  onClick,
+  className,
+  view,
+  offset,
+  limit,
+}) {
   const navigate = useNavigate();
   // 모달 title에 대상자 명 출력을 위함
   const [useName, setUseUserName] = React.useState("");

   const closeModal2 = () => {
     setModalOpen2(false);
   };
-  
+
   const buttonPrint = (name, id) => {
-    if (view == 'mySenior') {
+    if (view == "mySenior") {
       return (
         <td>
           <Button
             className={"btn-small gray-btn"}
             btnName={"보기"}
-            onClick={() =>{
+            onClick={() => {
               setUseUserName(name);
               setUseSeniorId(id);
               openModal();
-              }}
+            }}
           />
-        </td>)
-    }
-    else if (view == 'allSenior') {
+        </td>
+      );
+    } else if (view == "allSenior") {
       return (
         <>
           <td>
             <Button
               className={"btn-small gray-btn"}
               btnName={"선택"}
-              onClick={()=>{setUseSeniorId(id); openModal2();}}
+              onClick={() => {
+                setUseSeniorId(id);
+                openModal2();
+              }}
             />
           </td>
           <td>
             <Button
               className={"btn-small gray-btn"}
               btnName={"보기"}
-              onClick={(e) =>{
-              setUseUserName(name);
-              setUseSeniorId(id);
-              openModal();
+              onClick={(e) => {
+                setUseUserName(name);
+                setUseSeniorId(id);
+                openModal();
               }}
-          />
+            />
           </td>
         </>
-      )
+      );
+    } else if (view == "qna") {
+      return;
     } else {
-        return(
-    <td>
-      <Button
-        className={"btn-small gray-btn"}
-        btnName={"삭제"}
-        onClick={()=>{alert("삭제만들거예여.");}}
-      />
-    </td>
-    )
+      return (
+        <td>
+          <Button
+            className={"btn-small gray-btn"}
+            btnName={"삭제"}
+            onClick={() => {
+              alert("삭제만들거예여.");
+            }}
+          />
+        </td>
+      );
     }
-  }
+  };
 
   return (
     <>
       {/* 담당자 보기 모달 */}
-      <Modal_Matching open={modalOpen2} close={closeModal2} header="담당자 배정" />
+      <Modal_Matching
+        open={modalOpen2}
+        close={closeModal2}
+        header="담당자 배정"
+      />
       {/* 보호자 보기 모달창  */}
-      {modalOpen ? <Modal_Guadian open={modalOpen} close={closeModal} header={useName+"님의 가족"} useseniorId={useseniorId}/> : null}
+      {modalOpen ? (
+        <Modal_Guadian
+          open={modalOpen}
+          close={closeModal}
+          header={useName + "님의 가족"}
+          useseniorId={useseniorId}
+        />
+      ) : null}
       <table className={className}>
         <thead>
           <tr>

         <tbody>
           {contents.slice(offset, offset + limit).map((i, index) => {
             const userName = i.user_name;
-            const userId = i.user_id
+            const userId = i.user_id;
             return (
               <tr key={index}>
                 {contentKey.map((kes) => {
                   return (
                     <>
-                      <td onClick={() => 
-                        {
+                      <td
+                        onClick={() => {
                           // 대상자 페이지일 때만 상세페이지로 이동하도록 설정
-                          if(view == 'mySenior' || view == 'allSenior') {
-                            navigate(`/SeniorSelectOne/${i.user_id}`)
-                          } else {
-                            return ;
+                          if (view == "mySenior" || view == "allSenior") {
+                            navigate(`/SeniorSelectOne/${i.user_id}`);
+                          } 
+                          else if (view == "qna") {
+                            navigate(`/QuestionConfirm/`);
                           }
-                        }
-                      }>
-                            {i[kes]}
-                        
+                          else {
+                            return;
+                          }
+                        }}
+                      >
+                        {i[kes]}
                       </td>
                     </>
-                  )
+                  );
                 })}
                 {buttonPrint(userName, userId)}
               </tr>

     </>
   );
 }
-
 
 // const TableStyled = styled.table`
 //   border-top: 2px solid #2d303f;

Add a comment

Open 0
Closed 0

List

...	...	@@ -5,7 +5,16 @@
5	5	import { useNavigate } from "react-router";
6	6	// import styled from "styled-components";
7	7
8		-export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit }) {
	8	+export default function Table({
	9	+ head,
	10	+ contents,
	11	+ contentKey,
	12	+ onClick,
	13	+ className,
	14	+ view,
	15	+ offset,
	16	+ limit,
	17	+}) {
9	18	const navigate = useNavigate();
10	19	// 모달 title에 대상자 명 출력을 위함
11	20	const [useName, setUseUserName] = React.useState("");
...	...	@@ -29,64 +38,82 @@
29	38	const closeModal2 = () => {
30	39	setModalOpen2(false);
31	40	};
32		-
	41	+
33	42	const buttonPrint = (name, id) => {
34		- if (view == 'mySenior') {
	43	+ if (view == "mySenior") {
35	44	return (
36	45	<td>
37	46	<Button
38	47	className={"btn-small gray-btn"}
39	48	btnName={"보기"}
40		- onClick={() =>{
	49	+ onClick={() => {
41	50	setUseUserName(name);
42	51	setUseSeniorId(id);
43	52	openModal();
44		- }}
	53	+ }}
45	54	/>
46		- </td>)
47		- }
48		- else if (view == 'allSenior') {
	55	+ </td>
	56	+ );
	57	+ } else if (view == "allSenior") {
49	58	return (
50	59	<>
51	60	<td>
52	61	<Button
53	62	className={"btn-small gray-btn"}
54	63	btnName={"선택"}
55		- onClick={()=>{setUseSeniorId(id); openModal2();}}
	64	+ onClick={() => {
	65	+ setUseSeniorId(id);
	66	+ openModal2();
	67	+ }}
56	68	/>
57	69	</td>
58	70	<td>
59	71	<Button
60	72	className={"btn-small gray-btn"}
61	73	btnName={"보기"}
62		- onClick={(e) =>{
63		- setUseUserName(name);
64		- setUseSeniorId(id);
65		- openModal();
	74	+ onClick={(e) => {
	75	+ setUseUserName(name);
	76	+ setUseSeniorId(id);
	77	+ openModal();
66	78	}}
67		- />
	79	+ />
68	80	</td>
69	81	</>
70		- )
	82	+ );
	83	+ } else if (view == "qna") {
	84	+ return;
71	85	} else {
72		- return(
73		- <td>
74		- <Button
75		- className={"btn-small gray-btn"}
76		- btnName={"삭제"}
77		- onClick={()=>{alert("삭제만들거예여.");}}
78		- />
79		- </td>
80		- )
	86	+ return (
	87	+ <td>
	88	+ <Button
	89	+ className={"btn-small gray-btn"}
	90	+ btnName={"삭제"}
	91	+ onClick={() => {
	92	+ alert("삭제만들거예여.");
	93	+ }}
	94	+ />
	95	+ </td>
	96	+ );
81	97	}
82		- }
	98	+ };
83	99
84	100	return (
85	101	<>
86	102	{/* 담당자 보기 모달 */}
87		- <Modal_Matching open={modalOpen2} close={closeModal2} header="담당자 배정" />
	103	+ <Modal_Matching
	104	+ open={modalOpen2}
	105	+ close={closeModal2}
	106	+ header="담당자 배정"
	107	+ />
88	108	{/* 보호자 보기 모달창 */}
89		- {modalOpen ? <Modal_Guadian open={modalOpen} close={closeModal} header={useName+"님의 가족"} useseniorId={useseniorId}/> : null}
	109	+ {modalOpen ? (
	110	+ <Modal_Guadian
	111	+ open={modalOpen}
	112	+ close={closeModal}
	113	+ header={useName + "님의 가족"}
	114	+ useseniorId={useseniorId}
	115	+ />
	116	+ ) : null}
90	117	<table className={className}>
91	118	<thead>
92	119	<tr>
...	...	@@ -98,27 +125,30 @@
98	125	<tbody>
99	126	{contents.slice(offset, offset + limit).map((i, index) => {
100	127	const userName = i.user_name;
101		- const userId = i.user_id
	128	+ const userId = i.user_id;
102	129	return (
103	130	<tr key={index}>
104	131	{contentKey.map((kes) => {
105	132	return (
106	133	<>
107		- <td onClick={() =>
108		- {
	134	+ <td
	135	+ onClick={() => {
109	136	// 대상자 페이지일 때만 상세페이지로 이동하도록 설정
110		- if(view == 'mySenior' \|\| view == 'allSenior') {
111		- navigate(`/SeniorSelectOne/${i.user_id}`)
112		- } else {
113		- return ;
	137	+ if (view == "mySenior" \|\| view == "allSenior") {
	138	+ navigate(`/SeniorSelectOne/${i.user_id}`);
	139	+ }
	140	+ else if (view == "qna") {
	141	+ navigate(`/QuestionConfirm/`);
114	142	}
115		- }
116		- }>
117		- {i[kes]}
118		-
	143	+ else {
	144	+ return;
	145	+ }
	146	+ }}
	147	+ >
	148	+ {i[kes]}
119	149	</td>
120	150	</>
121		- )
	151	+ );
122	152	})}
123	153	{buttonPrint(userName, userId)}
124	154	</tr>
...	...	@@ -129,7 +159,6 @@
129	159	</>
130	160	);
131	161	}
132		-
133	162
134	163	// const TableStyled = styled.table`
135	164	// border-top: 2px solid #2d303f;

Delete comment