Merge pull request #81 from innovationacademy-kr/fe/dev/refactor_v4/#75

[FE] FEAT: isMainInfoLoading 추가 #75
innovationacademy-kr · Dec 29, 2023 · d7dd74e · d7dd74e
2 parents 7c56336 + 3b082d1
commit d7dd74e
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/src/stores/home.ts b/src/stores/home.ts
@@ -6,6 +6,7 @@ import { saveStorage, getStorage } from "@/utils/localStorage";
 
 export const useHomeStore = defineStore("home", () => {
   const isLoading = ref(false);
+  const isMainInfoLoading = ref(false);
 
   const userInfo = ref({
     login: "",
@@ -84,6 +85,10 @@ export const useHomeStore = defineStore("home", () => {
     return isLoading.value;
   };
 
+  const getIsMainInfoLoading = () => {
+    return isMainInfoLoading.value;
+  };
+
   const getUserInfo = () => {
     return userInfo.value;
   };
@@ -172,6 +177,7 @@ export const useHomeStore = defineStore("home", () => {
 
   const apiMainInfo = async () => {
     try {
+      isMainInfoLoading.value = true;
       const { data: mainInfo } = await getMainInfo();
       userInfo.value = {
         login: mainInfo.login,
@@ -184,8 +190,10 @@ export const useHomeStore = defineStore("home", () => {
         gaepo: mainInfo.gaepo,
       };
       infoMessages.value = mainInfo.infoMessages;
+      isMainInfoLoading.value = false;
     } catch (error) {
       console.log(error);
+      isMainInfoLoading.value = false;
     }
   };
 
@@ -276,7 +284,9 @@ export const useHomeStore = defineStore("home", () => {
 
   const apiAccTimes = async () => {
     try {
-      isLoading.value = true;
+      if (!getStorage("weeklyAccTime")) {
+        isLoading.value = true;
+      }
       const { data: accTimes } = await getAccTimes();
       accDate.value = accTimes.todayAccumulationTime;
       accMonth.value = calcSecToTime(accTimes.monthAccumulationTime);
@@ -298,6 +308,7 @@ export const useHomeStore = defineStore("home", () => {
 
   return {
     getIsLoading,
+    getIsMainInfoLoading,
     getUserInfo,
     getAccDate,
     getAccMonth,

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
@@ -26,6 +26,7 @@ const {
   apiAccTimes,
   getInfoMessages,
   getIsLoading,
+  getIsMainInfoLoading,
 } = useHomeStore();
 
 onMounted(() => {
@@ -40,6 +41,7 @@ const getWeeklyData = ref(getWeeklyGraph());
 const getMonthlyData = ref(getMonthlyGraph());
 const numberOfPeople = ref(getNumberOfPeople());
 const isLoading = ref(getIsLoading());
+const isMainInfoLoading = ref(getIsMainInfoLoading());
 
 const isOnline = ref(getUserInfo().inoutState);
 
@@ -81,6 +83,10 @@ watch(getIsLoading, (val) => {
   isLoading.value = val;
 });
 
+watch(getIsMainInfoLoading, (val) => {
+  isMainInfoLoading.value = val;
+});
+
 watch(getUserInfo, () => {
   isOnline.value = getUserInfo().inoutState;
   if (isOnline.value === "IN") {
@@ -167,7 +173,7 @@ const stopTimer = () => {
       :numberOfPeople="numberOfPeople"
     />
   </main>
-  <DefaultModal v-if="!isLoading && isClickInfo != InfoModal.NONE">
+  <DefaultModal v-if="!isMainInfoLoading && isClickInfo != InfoModal.NONE">
     <template #title>
       <span
         class="bold"