Merge pull request #95 from innovationacademy-kr/develop

Develop to main with #93
innovationacademy-kr · Feb 14, 2024 · d3ab836 · d3ab836
2 parents 3733f4d + 5a11b22
commit d3ab836
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/components/home/FoldCard.vue b/src/components/home/FoldCard.vue
@@ -4,6 +4,7 @@ import ChevronIcon from "@/components/icons/IconChevron.vue";
 import CircleProgress from "@/components/home/CircleProgress.vue";
 import LoadingAnimationVue from "@/components/common/LoadingAnimation.vue";
 import { useHomeStore } from "@/stores/home";
+import { getStorage, saveStorage } from "@/utils/localStorage";
 
 const props = defineProps<{
   hour: number;
@@ -20,7 +21,7 @@ const {
 } = useHomeStore();
 
 const isLoading = ref(getIsLoading());
-const isOpen = ref(false);
+const isOpen = ref(getStorage("isDayCardOpen") || false);
 const goalTimeSet = () => {
   if (props.isMonth) {
     return Number(getGoalMonthHour());
@@ -51,6 +52,7 @@ const culculatePercent = () => {
 
 const clickHandler = () => {
   isOpen.value = !isOpen.value;
+  saveStorage("isDayCardOpen", isOpen.value);
   if (isOpen.value) {
     colorSet.value = false;
   } else {

diff --git a/src/components/home/FoldCardCompact.vue b/src/components/home/FoldCardCompact.vue
@@ -3,6 +3,7 @@ import { ref, watch } from "vue";
 import ChevronIcon from "@/components/icons/IconChevron.vue";
 import LoadingAnimationVue from "@/components/common/LoadingAnimation.vue";
 import { useHomeStore } from "@/stores/home";
+import { getStorage, saveStorage } from "@/utils/localStorage";
 
 const props = defineProps<{
   hour: number;
@@ -14,7 +15,7 @@ const props = defineProps<{
 const { getIsLoading } = useHomeStore();
 const isLoading = ref(getIsLoading());
 
-const isOpen = ref(false);
+const isOpen = ref(getStorage("isMonthCardOpen") || false);
 
 watch(getIsLoading, (val) => {
   isLoading.value = val;
@@ -25,11 +26,16 @@ const checkColor = () => {
     return "#ffffff";
   }
 };
+
+const clickHandler = () => {
+  isOpen.value = !isOpen.value;
+  saveStorage("isMonthCardOpen", isOpen.value);
+};
 </script>
 
 <template>
   <div class="wrap" :class="{ on: isOpen, primaryColor: !isOpen }">
-    <div class="textWrap use tapHighlight" @click="isOpen = !isOpen">
+    <div class="textWrap use tapHighlight" @click="clickHandler">
       <h2>
         <slot name="title"></slot>
       </h2>