FEAT : 회원프로필 창 추가

-

 ###초기설정
 >####데이터 베이스 설정
 > <pre><code>
->CREATE TABLE USER(
->ID int(10) NOT NULL AUTO_INCREMENT PRIMARY KEY,
->EMAIL varchar(64) NOT NULL UNIQUE,
->NAME varchar(64) NOT NULL,
->NICKNAME varchar(32) UNIQUE,
->AGE varchar(32),
->GENDER varchar(32)
->);
+> CREATE TABLE USER(
+> ID int(10) NOT NULL AUTO_INCREMENT PRIMARY KEY,
+> EMAIL varchar(64) NOT NULL UNIQUE,
+> NAME varchar(64) NOT NULL,
+> NICKNAME varchar(32) UNIQUE,
+> AGE int(16),
+> GENDER varchar(32),
+> PICTURE varchar(128) NOT NULL
+> );
 </code>
 </pre>
 
 > <pre><code>
->CREATE TABLE COMMENT(
->ID int(10) NOT NULL AUTO_INCREMENT PRIMARY KEY,
->CAFE_ID int(10) NOT NULL
->PRICE int(10) NOT NULL,
->KINDNESS int(10) NOT NULL,
->NOISE int(10) NOT NULL,
->ACCESSIBILITY int(10) NOT NULL
->);
+> CREATE TABLE COMMENT(
+> ID int(10) NOT NULL AUTO_INCREMENT PRIMARY KEY,
+> CAFE_ID int(10) NOT NULL
+> PRICE int(10) NOT NULL,
+> KINDNESS int(10) NOT NULL,
+> NOISE int(10) NOT NULL,
+> ACCESSIBILITY int(10) NOT NULL
+> );
 </code>
 </pre>
 

@@ -63,6 +63,7 @@ router.get("/login", checkAuthenticated, (req, res) => {
   req.session.user =req.user;
   req.session.user.email = req.user.email;
   req.session.user.name=req.user.name;
+  req.session.user.picture=req.user.picture;
   var sql = "SELECT * FROM USER WHERE EMAIL=?";
   var parameter = [req.session.user.email];
   connection.query(sql, parameter, function (err, row) {
@@ -83,9 +84,7 @@ router.get("/login", checkAuthenticated, (req, res) => {
 });
 
 router.post("/login", (req, res) => {
-  console.log(req.body.nickname);
-  console.log(req.body.age);
-  console.log(req.body.gender);
+  console.log("구글로그인 성공");
   var sql = " SELECT * FROM USER WHERE NICKNAME=?";
   var parameter = [req.body.nickname];
   connection.query(sql, parameter, function (err, row) {
@@ -135,6 +134,7 @@ function checkAuthenticated(req, res, next) {
     const payload = ticket.getPayload();
     user.name = payload.name;
     user.email = payload.email;
+    user.picture = payload.picture;
   }
   verify()
     .then(() => {

-{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1622068485937,"user":{"name":"최정민","email":"cjm104174@gmail.com","nickname":"Mayf","age":"24","gender":"male"}}
\ No newline at end of file
+{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1622070807469,"user":{"name":"최정민","email":"cjm104174@gmail.com","picture":"https://lh3.googleusercontent.com/a-/AOh14Gh3nytGsPbviGhkznR8HIwrL6o7xBIoFL08nIeU=s96-c","nickname":"Mayf","age":25,"gender":"male"}}
\ No newline at end of file

@@ -93,7 +93,6 @@
       </div>
     </section>
 
-    <a href="/logout" onclick="signOut();">Sign Out</a>
     <%if (message=='same nickname'){%>
     <script type="text/javascript">
       alert(

@@ -287,7 +287,7 @@
 
     <!-- 모달 바디 -->
     <div class="modal fade" id="profile" tabindex="-1" role="dialog" aria-labelledby="profilemodal" aria-hidden="true">
-      <div class="modal-dialog modal-lg" role="document">
+      <div class="modal-dialog" role="document">
         <div class="modal-content">
           <div class="modal-header">
             <h5 class="modal-title" id="profilemodal"><%=user.nickname%>'s PROFILE</h5>
@@ -296,12 +296,25 @@
             </button>
           </div>
           <div class="modal-body text-center">
-           <p>모달바</p>
+            <div class="card mb-3">
+              <div class="row g-0">
+                <div class="col-md-4">
+                  <img src="<%= user.picture%>" alt="google profile picture" style="width:100%; height: 100%; ">
+                </div>
+                <div class="col-md-8">
+                  <div class="card-body">
+                    <h5 class="card-title"><%=user.name%></h5>
+                    <p class="card-text">Age : <%=user.age%>,  Gender : <%=user.gender%></p>
+                    <p class="card-text">Emaile : <%=user.email%>
+                    <p class="card-text"><small class="text-muted">from Google and CafeRecommend</small></p>
+                  </div>
+                </div>
               </div>
-          <div class="modal-footer">
-            <button type="button" class="btn btn-primary" data-dismiss="modal">확인</button>
             </div>
           </div>
+
+            <button type="button" class="btn btn-primary" data-dismiss="modal">확인</button>
+        </div>
       </div>
     </div>
   </body>