localStorage 설정

Nuung · Jun 25, 2022 · 01a8922 · 01a8922
1 parent 25e5aa5
commit 01a8922
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 33 deletions.
diff --git a/fpm-fe-html/components/navBar.html b/fpm-fe-html/components/navBar.html
@@ -1,12 +1,37 @@
+<meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
+  <script src="https://kit.fontawesome.com/a31f53fe58.js" crossorigin="anonymous"></script>
+
 <!-- Nav Bar -->
 <div class="mdc-top-app-bar__row">
-    <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-    <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button" aria-label="Open navigation menu">menu</button>
-    <span class="mdc-top-app-bar__title">Page title</span>
-    </section>
-    <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-    <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Favorite">favorite</button>
-    <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Search">search</button>
-    <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Options">more_vert</button>
-    </section>
+    <!-- A grey horizontal navbar that becomes vertical on small screens -->
+    <nav class="navbar navbar-expand-sm bg-light">
+        <!-- Links -->
+        <ul class="navbar-nav">
+            <li class="nav-item">
+                <a class="nav-link" href="../pages/mainPage.html">
+                    <i class="fa-solid fa-house fa-xl"></i>
+                </a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" href="../pages/challenge.html">
+                    <i class="fa-brands fa-gripfire fa-xl"></i>
+                </a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" href="../pages/myAsset.html">
+                    <i class="fa-solid fa-square-poll-vertical fa-xl"></i>
+                </a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" href="../pages/profile.html">
+                    <i class="fa-solid fa-circle-user fa-xl"></i>
+                </a>
+            </li>
+        </ul>
+    </nav>
 </div>
diff --git a/fpm-fe-html/pages/myAsset.html b/fpm-fe-html/pages/myAsset.html
diff --git a/fpm-fe-html/public/javascript/groupReport.js b/fpm-fe-html/public/javascript/groupReport.js
@@ -1,4 +1,5 @@
 $(document).ready(function(){
+
     const selectedTag = location.href.split('?')[1];
     $('#'+selectedTag).toggleClass('selected');
     jQuery('.selected').parent('div').css('background', '#EEE5FF');

diff --git a/fpm-fe-html/public/javascript/mainPage.js b/fpm-fe-html/public/javascript/mainPage.js
@@ -1,17 +1,39 @@
 $(document).ready(function () {
+
+  let token = document.cookie.split('=')[1];
+
   $.ajax({
     type: "GET",
     url: "http://api.fpm.local/api/financial",
     headers: {
       authorization:
-        "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6ImNqY2YwaHM1ZmNkazI2MSIsImlhdCI6MTY1NjEzOTIyMSwiZXhwIjoxNjg3Njc1MjIxLCJpc3MiOiJmcG0ifQ.wpt9TFqGXJfAYXTIBSj2BeTBY2vqm-oFEhM91Gi_pKc",
+        token,
     },
     success: function (res) {
       console.log(res);
       let hashtags = res["data"]["user"]["hashtag"];
       let nickName = res["data"]["user"]["nickName"];
+      let follower = res["data"]["user"]["follower"];
+      let mostSpendAmt = res["data"]["userFinancialDetail"][0]["mostSpendAmt"];
+      let leastSpendAmt = res["data"]["userFinancialDetail"][0]["leastSpendAmt"];
       let totalAmt = res["data"]["userFinancialDetail"][0]["depositTotalAmt"];
+      let insureAmt = res["data"]["userFinancialDetail"][0]["insureAmt"];
+      let irpAmt = res["data"]["userFinancialDetail"][0]["irpAmt"];
+      let stockAmt = res["data"]["userFinancialDetail"][0]["stockAmt"];
+      let realAmt = res["data"]["userFinancialDetail"][0]["realAmt"];
       let top3Spend = res["data"]["userFinancialDetail"][0]["spendCategory"]["after"];
+
+      localStorage.setItem('hashtag', hashtags);
+      localStorage.setItem('nickName', nickName);
+      localStorage.setItem('follower', follower);
+      localStorage.setItem('mostSpendAmt', mostSpendAmt);
+      localStorage.setItem('leastSpendAmt', leastSpendAmt);
+      localStorage.setItem('depositTotalAmt', totalAmt);
+      localStorage.setItem('insureAmt', insureAmt);
+      localStorage.setItem('irpAmt', irpAmt);
+      localStorage.setItem('stockAmt', stockAmt);
+      localStorage.setItem('realAmt', realAmt);
+
       for (let i = 1; i <= 6; i++) {
         $("#hashtag" + i).text(hashtags[i - 1]);
       }
@@ -30,29 +52,6 @@ $(document).ready(function () {
       alert("통신 실패.");
     },
   });
-
-  var xValues = ["Italy", "France", "Spain", "USA", "Argentina"];
-  var yValues = [55, 49, 44, 24, 15];
-  var barColors = ["#b91d47", "#00aba9", "#2b5797", "#e8c3b9", "#1e7145"];
-
-  new Chart("myChart", {
-    type: "doughnut",
-    data: {
-      labels: xValues,
-      datasets: [
-        {
-          backgroundColor: barColors,
-          data: yValues,
-        },
-      ],
-    },
-    options: {
-      title: {
-        display: true,
-        text: "World Wide Wine Production 2018",
-      },
-    },
-  });
 });
 
 $("[id^=hashtag]").on("click", function(){