feat: Conformance Save Logout done.

2023-12-01 14:24:05 +08:00
parent c26a1dfee7
commit 8b502e67f4
8 changed files with 78 additions and 49 deletions
--- a/src/components/Discover/Conformance/ConformanceSidebar.vue
+++ b/src/components/Discover/Conformance/ConformanceSidebar.vue
@@ -1268,6 +1268,10 @@ export default {
      };
    });
  },
+  beforeUnmount() {
+    this.isSubmitReset();
+    this.selectTimeReset();
+  },
 }
 </script>
 <style>
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -24,6 +24,8 @@ import loginStore from '@/stores/login.js';
 import DspLogo from '@/components/icons/DspLogo.vue';
 import IconMember from '@/components/icons/IconMember.vue';
 import AllMapDataStore from '@/stores/allMapData.js';
+import ConformanceStore from '@/stores/conformance.js';
+import { leaveFilter, leaveConformance } from '@/module/alertModal.js';

 export default {
  data() {
@@ -35,9 +37,11 @@ export default {
    const store = loginStore();
    const { logOut } = store;
    const allMapDataStore = AllMapDataStore();
+    const conformanceStore = ConformanceStore();
    const { tempFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore);
+    const { conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceFileName } = storeToRefs(conformanceStore);

-    return { logOut, temporaryData, tempFilterId, postRuleData, ruleData, allMapDataStore}
+    return { logOut, temporaryData, tempFilterId, postRuleData, ruleData, conformanceLogTempCheckId, conformanceFilterTempCheckId, allMapDataStore, conformanceStore, conformanceFileName }
  },
  components: {
    DspLogo,
@@ -45,13 +49,13 @@ export default {
  },
  methods: {
    logOutButton() {
-      if (this.$route.name === 'Map' && this.$route.params.type === 'log') {
-        this.tempFilterId = null;
-        this.temporaryData = [];
-        this.postRuleData = [];
-        this.ruleData = [];
-      };
-      this.logOut();
+      if ((this.$route.name === 'Map' || this.$route.name === 'CheckMap') && this.tempFilterId) {
+        // 傳給 Map，通知 Sidebar 要關閉。
+        this.$emitter.emit('leaveFilter', false);
+        leaveFilter(false, this.allMapDataStore.addFilterId, false, this.logOut)
+      } else if((this.$route.name === 'Conformance' || this.$route.name === 'CheckConformance') && (this.conformanceLogTempCheckId || this.conformanceFilterTempCheckId)) {
+        leaveConformance(false, this.conformanceStore.addConformanceCreateCheckId, false, this.logOut)
+      } else this.logOut();
    },
  },
  mounted() {
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -1,6 +1,15 @@
 <template>
  <nav class="bg-neutral-700">
    <div class="mx-auto px-4" :class="[showNavbarBreadcrumb? 'min-h-12': 'h-12']">
+      <p class="text-neutral-10">logId: {{ logId }}</p>
+      <p class="text-neutral-10">tempFilterId: {{ tempFilterId }}</p>
+      <p class="text-neutral-10">createFilterId: {{ createFilterId }}</p>
+      <p class="text-neutral-10">conformanceLogId: {{ conformanceLogId }}</p>
+      <p class="text-neutral-10">conformanceFilterId: {{ conformanceFilterId }}</p>
+      <p class="text-neutral-10">conformanceLogTempCheckId: {{ conformanceLogTempCheckId }}</p>
+      <p class="text-neutral-10">conformanceFilterTempCheckId: {{ conformanceFilterTempCheckId }}</p>
+      <p class="text-neutral-10">conformanceLogCreateCheckId: {{ conformanceLogCreateCheckId }}</p>
+      <p class="text-neutral-10">conformanceFilterCreateCheckId: {{ conformanceFilterCreateCheckId }}</p>
      <div class="flex justify-between items-center flex-wrap" v-show="showNavbarBreadcrumb">
        <div class="flex flex-1 items-center">
          <!-- 回 Files 頁 -->
@@ -148,15 +157,18 @@ export default {
          if(this.createFilterId) {
            await this.allMapDataStore.updataFilter();
            if(this.isUpdataFilter) await savedSuccessfully(this.filterName);
-            this.tempFilterId = null;
          }else if(this.logId){
            await saveFilter(this.allMapDataStore.addFilterId);
            // 存檔後為 filterID，換網址不跳頁，使用 push 記錄歷史路由
            await this.$router.push(`/discover/map/filter/${this.createFilterId}`);
          };
          break;
-        case 'Conformance':
        case 'CheckMap':
+          // 無論 parentLog, parentFilter，做新 filter 皆另存新檔
+          await saveFilter(this.allMapDataStore.addFilterId);
+          // 存檔後為 filterID，換網址不跳頁，使用 push 記錄歷史路由
+          await this.$router.push(`/discover/map/filter/${this.createFilterId}`);
+        case 'Conformance':
        case 'CheckConformance':
          // 先判斷有沒有 check Id，有就儲存 return，沒有就往下走
          // 沒有 check Id, 有暫存 temp Id 可以另存新檔
--- a/src/module/alertModal.js
+++ b/src/module/alertModal.js
@@ -65,8 +65,9 @@ export async function savedSuccessfully(value) {
 * @param { function } next
 * @param { function } addFilterId
 * @param { string } toPath
+ * @param { function } logOut
 */
-export async function leaveFilter(next, addFilterId, toPath) {
+export async function leaveFilter(next, addFilterId, toPath, logOut) {
  const allMapDataStore = AllMapDataStore();
  const result = await Swal.fire({
    title: 'SAVE YOUR FILTER?',
@@ -82,13 +83,18 @@ export async function leaveFilter(next, addFilterId, toPath) {
    customClass: customClass
  })
  if(result.isConfirmed) {
-    await saveFilter(addFilterId)
-    next(toPath);
+    if(allMapDataStore.createFilterId) {
+      await allMapDataStore.updataFilter();
+      if(allMapDataStore.isUpdataFilter) await savedSuccessfully(allMapDataStore.filterName);
+    } else {
+      await saveFilter(addFilterId);
+    }
+    logOut ? logOut() : next(toPath);
  } else if(result.dismiss === 'cancel') {
    allMapDataStore.tempFilterId = null;
-    next(toPath);
+    logOut ? logOut() : next(toPath);
  } else if(result.dismiss === 'backdrop') {
-    next(false);
+    logOut ? null : next(false);
  }
 };
 /**
@@ -127,9 +133,10 @@ export async function saveConformance(addConformanceCreateCheckId) {
 * @param { function } next
 * @param { function } addConformanceCreateCheckId
 * @param { string } toPath
+ * @param { function } logOut
 */
-export async function leaveConformance(next, addConformanceCreateCheckId, toPath) {
-  const allMapDataStore = AllMapDataStore();
+export async function leaveConformance(next, addConformanceCreateCheckId, toPath, logOut) {
+  const conformanceStore = ConformanceStore();
  const result = await Swal.fire({
    title: 'SAVE YOUR RULE?',
    icon: 'warning',
@@ -143,16 +150,22 @@ export async function leaveConformance(next, addConformanceCreateCheckId, toPath
    customClass: customClass
  })
  if(result.isConfirmed) {
-    await saveFilter(addConformanceCreateCheckId)
-    next(toPath);
+    if(conformanceStore.conformanceFilterCreateCheckId || conformanceStore.conformanceLogCreateCheckId) {
+      await conformanceStore.updataConformance();
+      if(conformanceStore.isUpdataConformance) await savedSuccessfully(conformanceStore.conformanceFileName);
+    } else {
+      await saveConformance(addConformanceCreateCheckId);
+    }
+    logOut ? logOut() : next(toPath);
  } else if(result.dismiss === 'cancel') {
-    ConformanceStore.conformanceFilterTempCheckId = null;
-    ConformanceStore.conformanceLogTempCheckId = null;
-    next(toPath);
+    conformanceStore.conformanceFilterTempCheckId = null;
+    conformanceStore.conformanceLogTempCheckId = null;
+    logOut ? logOut() : next(toPath);
  } else if(result.dismiss === 'backdrop') {
-    next(false);
+    logOut ? null : next(false);
  }
 };
+
 // 登出 button 規則，暫時沒用到
 export async function logoutLeave(addFilterId) {
  const allMapDataStore = AllMapDataStore();
--- a/src/stores/allMapData.js
+++ b/src/stores/allMapData.js
@@ -352,6 +352,7 @@ export default defineStore('allMapDataStore', {
      try {
        const response = await this.$axios.put(api, data);
        this.isUpdataFilter = response.status === 200;
+        this.tempFilterId = null;
      }catch(error) {
        apiError(error, 'Failed to updata an Existing Filter.');
      }
--- a/src/views/Discover/Conformance/index.vue
+++ b/src/views/Discover/Conformance/index.vue
@@ -1,10 +1,4 @@
 <template>
-  <!-- conformanceLogId: {{ conformanceLogId }} <br>
-  conformanceFilterId: {{ conformanceFilterId }} <br>
-  conformanceLogTempCheckId: {{ conformanceLogTempCheckId }} <br>
-  conformanceFilterTempCheckId: {{ conformanceFilterTempCheckId }} <br>
-  conformanceLogCreateCheckId: {{ conformanceLogCreateCheckId }} <br>
-  conformanceFilterCreateCheckId: {{ conformanceFilterCreateCheckId }} <br> -->
  <main class="h-screen-main relative">
    <div class="h-full relative bg-neutral-50">
      <ConformanceSidebar></ConformanceSidebar>
@@ -57,14 +51,18 @@ export default {
            this.conformanceLogCreateCheckId = params.checkId;
            // 為複寫 Modal 取得 fileName
            await this.filesStore.fetchConformanceLog();
-            await this.allConformanceLog.forEach(file => this.conformanceFileName = file.id == this.conformanceLogCreateCheckId ? file.name : null);
+            await this.allConformanceLog.forEach(file => {
+              if(file.id == this.conformanceLogCreateCheckId) return this.conformanceFileName = file.name;
+            });
            break;
          case 'filter':
            this.conformanceFilterId = params.checkFileId;
            this.conformanceFilterCreateCheckId = params.checkId;
            // 為複寫 Modal 取得 fileName
            await this.filesStore.fetchConformanceFilter();
-            await this.allConformanceFilter.forEach(file => this.conformanceFileName = file.id == this.conformanceFilterCreateCheckId ? file.name : null);
+            await this.allConformanceFilter.forEach(file => {
+              if(file.id == this.conformanceFilterCreateCheckId) return this.conformanceFileName = file.name;
+            });
        }
        await this.conformanceStore.getConformanceReport();
        break;
--- a/src/views/Discover/Map/index.vue
+++ b/src/views/Discover/Map/index.vue
@@ -67,9 +67,9 @@ export default {
    const loadingStore = LoadingStore();
    const allMapDataStore = AllMapDataStore();
    const { isLoading } = storeToRefs(loadingStore);
-    const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, filterTasks, filterStartToEnd, filterEndToStart, filterTimeframe, filterTrace, temporaryData, isRuleData, ruleData, logId, baseLogId, createFilterId, cases } = storeToRefs(allMapDataStore);
+    const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, filterTasks, filterStartToEnd, filterEndToStart, filterTimeframe, filterTrace, temporaryData, isRuleData, ruleData, logId, baseLogId, createFilterId, cases, postRuleData } = storeToRefs(allMapDataStore);

-    return { isLoading, processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, filterTasks, filterStartToEnd, filterEndToStart, filterTimeframe, filterTrace, logId, baseLogId, createFilterId, temporaryData, isRuleData, ruleData, allMapDataStore, cases }
+    return { isLoading, processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, filterTasks, filterStartToEnd, filterEndToStart, filterTimeframe, filterTrace, logId, baseLogId, createFilterId, temporaryData, isRuleData, ruleData, allMapDataStore, cases, postRuleData  }
  },
  props:['type', 'checkType', 'checkId', 'checkFileId'], // 來自 router 的 props
  components: {
@@ -387,5 +387,13 @@ export default {
      this.sidebarState = boolean;
    });
  },
+  beforeUnmount() {
+    this.logId = null;
+    this.createFilterId = null;
+    this.tempFilterId = null;
+    this.temporaryData = [];
+    this.postRuleData = [];
+    this.ruleData = [];
+  }
 }
 </script>
--- a/src/views/MainContainer.vue
+++ b/src/views/MainContainer.vue
@@ -31,17 +31,6 @@ export default {

    return { checkLogin, loadingStore, temporaryData, tempFilterId, createFilterId, postRuleData, ruleData, allMapDataStore };
  },
-  watch: {
-    $route: function(to, from) {
-      // 離開 Map Log 頁要將 Funnel 的規則刪除, Map Filter 會帶上次儲存的 Funnel, 所以不用做
-      if(from.name === 'Map' && from.params.type === 'log') {
-        this.tempFilterId = null;
-        this.temporaryData = [];
-        this.postRuleData = [];
-        this.ruleData = [];
-      }
-    }
-  },
  components: {
    Header,
    Navbar,
@@ -58,14 +47,14 @@ export default {
    this.checkLogin();
  },
  beforeRouteUpdate(to, from, next) {
-    // 離開 Discover 頁時判斷是否有無資料和需要存檔
-    if ((from.name === 'Map') && this.tempFilterId) {
+    // 離開 Map 頁時判斷是否有無資料和需要存檔
+    if ((from.name === 'Map' || from.name === 'CheckMap') && this.tempFilterId) {
      // 傳給 Map，通知 Sidebar 要關閉。
      this.$emitter.emit('leaveFilter', false);
      leaveFilter(next, this.allMapDataStore.addFilterId, to.path)
-    } else {
-      next();
-    }
+    } else if((this.$route.name === 'Conformance' || this.$route.name === 'CheckConformance') && (this.conformanceLogTempCheckId || this.conformanceFilterTempCheckId)) {
+      leaveFilter(false, this.conformanceStore.addConformanceCreateCheckId, false, this.logOut)
+    } else next();
  },
 };
 </script>