120 lines
4.7 KiB
Vue
120 lines
4.7 KiB
Vue
<template>
|
||
<main class="h-screen-main relative">
|
||
<div class="h-full relative bg-neutral-50">
|
||
<ConformanceSidebar></ConformanceSidebar>
|
||
<ConformanceResults></ConformanceResults>
|
||
</div>
|
||
<StatusBar></StatusBar>
|
||
</main>
|
||
</template>
|
||
<script>
|
||
import { storeToRefs } from 'pinia';
|
||
import axios from 'axios';
|
||
import LoadingStore from '@/stores/loading.js';
|
||
import ConformanceStore from '@/stores/conformance.js';
|
||
import StatusBar from '@/components/Discover/StatusBar.vue';
|
||
import ConformanceResults from '@/components/Discover/Conformance/ConformanceResults.vue';
|
||
import ConformanceSidebar from '@/components/Discover/Conformance/ConformanceSidebar.vue';
|
||
|
||
export default {
|
||
setup() {
|
||
const loadingStore = LoadingStore();
|
||
const conformanceStore = ConformanceStore();
|
||
const { isLoading } = storeToRefs(loadingStore);
|
||
const { conformanceLogId, conformanceFilterId, conformanceLogCreateCheckId, conformanceFilterCreateCheckId,
|
||
conformanceLogTempCheckId, conformanceFilterTempCheckId, selectedRuleType, selectedActivitySequence,
|
||
selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo, conformanceRuleData,
|
||
conformanceTempReportData, conformanceFileName,
|
||
} = storeToRefs(conformanceStore);
|
||
|
||
return { isLoading, conformanceLogId, conformanceFilterId, conformanceLogCreateCheckId, conformanceFilterCreateCheckId,
|
||
conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceStore, selectedRuleType,
|
||
selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo,
|
||
conformanceRuleData, conformanceTempReportData, conformanceFileName
|
||
};
|
||
},
|
||
components: {
|
||
StatusBar,
|
||
ConformanceResults,
|
||
ConformanceSidebar,
|
||
},
|
||
async created() {
|
||
this.isLoading = true;
|
||
|
||
const params = this.$route.params;
|
||
const file = this.$route.meta.file;
|
||
const isCheckPage = this.$route.name.includes('Check');
|
||
|
||
if(!isCheckPage) {
|
||
switch (params.type) {
|
||
case 'log': // FILES page 來的 log
|
||
this.conformanceLogId = params.fileId;
|
||
break;
|
||
case 'filter': // FILES page 來的 filter
|
||
this.conformanceFilterId = params.fileId;
|
||
break;
|
||
}
|
||
} else {
|
||
switch (params.type) {
|
||
case 'log': // FILES page 來的已存檔 rule(log-check)
|
||
this.conformanceLogId = file.parent.id;
|
||
this.conformanceFileName = file.name;
|
||
break;
|
||
case 'filter': // FILES page 來的已存檔 rule(filter-check)
|
||
this.conformanceFilterId = file.parent.id;
|
||
this.conformanceFileName = file.name;
|
||
break;
|
||
}
|
||
await this.conformanceStore.getConformanceReport();
|
||
}
|
||
await this.conformanceStore.getConformanceParams();
|
||
// 給 rule 檔取得 ShowBar 一些時間
|
||
setTimeout(() => this.isLoading = false, 500);
|
||
},
|
||
mounted() {
|
||
this.selectedRuleType = 'Have activity';
|
||
this.selectedActivitySequence = 'Start & End';
|
||
this.selectedMode = 'Directly follows';
|
||
this.selectedProcessScope = 'End to end';
|
||
this.selectedActSeqMore = 'All';
|
||
this.selectedActSeqFromTo = 'From';
|
||
},
|
||
beforeUnmount() {
|
||
// 離開 conformance 時將 id 為 null，避免污染其他檔案
|
||
this.conformanceLogId = null;
|
||
this.conformanceFilterId = null;
|
||
this.conformanceLogCreateCheckId = null;
|
||
this.conformanceFilterCreateCheckId = null;
|
||
this.conformanceRuleData = null;
|
||
this.conformanceFileName = null;
|
||
},
|
||
async beforeRouteEnter(to, from, next) {
|
||
const isCheckPage = to.name.includes('Check');
|
||
if (isCheckPage) {
|
||
const conformanceStore = ConformanceStore();
|
||
// Save token in Headers.
|
||
// (?:^|.;\s)：匹配 "luciaToken" 之前的內容，允許它在字符串開頭或某個分號之後。
|
||
// luciaToken\s=\s**：匹配 "luciaToken="，並忽略兩邊的空格。
|
||
// ([^;]*)：捕獲 "luciaToken" 的值，直到遇到下一個分號或字符串結尾。
|
||
// .*$：匹配剩餘的字符，確保完整的提取。
|
||
// |^.*$：在找不到 "luciaToken" 的情況下，匹配整個字符串。
|
||
// 實際應用
|
||
const token = document.cookie.replace(/(?:(?:^|.*;\s*)luciaToken\s*=\s*([^;]*).*$)|^.*$/, "$1");
|
||
|
||
axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;
|
||
switch (to.params.type) {
|
||
case 'log':
|
||
conformanceStore.setConformanceLogCreateCheckId(to.params.fileId);
|
||
break;
|
||
case 'filter':
|
||
conformanceStore.conformanceFilterCreateCheckId = to.params.fileId;
|
||
break;
|
||
}
|
||
await conformanceStore.getConformanceReport();
|
||
to.meta.file = await conformanceStore.conformanceTempReportData?.file; // 將 file data 存到 route 給 Navbar, StatusBar 使用
|
||
}
|
||
next();
|
||
}
|
||
}
|
||
</script>
|