1247

client/src/Pages/Mypage.js

 import React from 'react'
-import { Card, Image, Container, Row, Col, Table } from 'react-bootstrap'
-import mypagetiger from '../mypagetiger.svg';
+import { Card, Image, Container, Row, Col, Table, Accordion } from 'react-bootstrap'
+import { Link } from 'react-router-dom';
 import person from '../person.svg';
+import mypagetiger from '../mypagetiger.svg';
 
 
 function Mypage() {
   return (
-    <Container className="px-3 justify-content-center">
+    <Container className="px-3">
       <h3 className="my-4 mx-3 font-weight-bold">My Page</h3>
       <Card md={3} className="pt-3 mb-4" style={{ background: '#F7F3F3' }}>
         <Row>
@@ -17,51 +18,61 @@ function Mypage() {
             <Row className="mt-4 text-center">
               <Col>
                 <h2>
-                  <Image src={mypagetiger} width={"30px"} />
                   <strong>@Login.user</strong> <small>님</small>
                 </h2>
               </Col>
             </Row>
             <Row className="px-3">
               <Card.Body className="text-center">
-                  <strong>KU#</strong>에 오신 <em>@Login.user</em> 님,<br></br>
-                진심으로 환영합니다! 즐거운 쇼핑 되세요 ♡
+                <h4><Link to="/">
+                  <strong title="홈으로">
+                    <Image src={mypagetiger} width={"30rem"} roundedCircle className="img-thumbnail" >
+                    </Image>KU#
+                  </strong>
+                </Link>
+                  {/* 홈페이지로 돌아가기 */}
+                  에 오신 <em>@Login.user</em> 님,<br></br>
+                진심으로 환영합니다! 즐거운 쇼핑 되세요.</h4>
                 <Row className="mr-1 text-muted d-flex justify-content-end">
-                  
-                    <small>문의 : shoppingmall_KU@korea.ac.kr </small>
+                  <a href="mailto:shoppingmall_KU@korea.ac.kr">
+                    <small title="메일보내기"> 문의 : shoppingmall_KU@korea.ac.kr </small>
+                  </a>
+                  {/* 쇼핑몰 문의 메일보내기 */}
                 </Row>
               </Card.Body>
             </Row>
           </Col>
         </Row>
       </Card>
-      <Row className="my-3 px-3">
-        <Table>
-          <thead style={{ background: '#F7F3F3' }}>
-            <tr>
-              <th scope="col">주문현황</th>
-              <th scope="col">배송중</th>
-              <th scope="col">배송완료</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr>
-              <th scope="row">1</th>
-              <td>Mark</td>
-              <td>Otto</td>
-            </tr>
-            <tr>
-              <th scope="row">2</th>
-              <td>Jacob</td>
-              <td>Thornton</td>
-            </tr>
-            <tr>
-              <th scope="row">3</th>
-              <td colspan="2">Larry the Bird</td>
-            </tr>
-          </tbody>
-        </Table>
-      </Row>
+      <Accordion>
+        <Row className="my-3 px-3">
+          <Table>
+            <thead className="text-center" style={{ background: '#F7F3F3' }}>
+              <tr>
+                <th scope="col">주문현황</th>
+                <th scope="col">배송중</th>
+                <th scope="col">배송완료</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <th scope="row">케이시앵글부츠(SH)</th>
+                <td>Mark</td>
+                <td>Otto</td>
+              </tr>
+              <tr>
+                <th scope="row">2</th>
+                <td>Jacob</td>
+                <td>Thornton</td>
+              </tr>
+              <tr>
+                <th scope="row">3</th>
+                <td colspan="2">Larry the Bird</td>
+              </tr>
+            </tbody>
+          </Table>
+        </Row>
+      </Accordion>
 
     </Container >