imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Standardize store exports to named useXxxStore convention

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
依瑪貓
2026-03-06 13:25:00 +08:00
parent 147b16ca34
commit 90048d0505
69 changed files with 241 additions and 241 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/AccountMenu/AcctMenu.vue
View File

@@ -34,20 +34,20 @@ import { computed, onMounted, ref, } from 'vue';
import { mapActions, mapState, storeToRefs } from 'pinia'; import { mapActions, mapState, storeToRefs } from 'pinia';
import i18next from '@/i18n/i18n'; import i18next from '@/i18n/i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import LoginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import AcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import { leaveFilter, leaveConformance } from '@/module/alertModal.js'; import { leaveFilter, leaveConformance } from '@/module/alertModal.js';
export default { export default {
setup() { setup() {
const { logOut } = LoginStore(); const { logOut } = useLoginStore();
const loginStore = LoginStore(); const loginStore = useLoginStore();
const router = useRouter(); const router = useRouter();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const acctMgmtStore = AcctMgmtStore(); const acctMgmtStore = useAcctMgmtStore();
const { tempFilterId } = storeToRefs(allMapDataStore); const { tempFilterId } = storeToRefs(allMapDataStore);
const { conformanceLogTempCheckId } = storeToRefs(conformanceStore); const { conformanceLogTempCheckId } = storeToRefs(conformanceStore);
@@ -89,8 +89,8 @@ export default {
} }
}, },
computed: { computed: {
...mapState(LoginStore, ['userData']), ...mapState(useLoginStore, ['userData']),
...mapState(AcctMgmtStore, ['isAcctMenuOpen']), ...mapState(useAcctMgmtStore, ['isAcctMenuOpen']),
}, },
methods: { methods: {
clickOtherPlacesThenCloseMenu(){ clickOtherPlacesThenCloseMenu(){
@@ -119,8 +119,8 @@ export default {
this.logOut(); this.logOut();
} }
}, },
...mapActions(LoginStore, ['getUserData']), ...mapActions(useLoginStore, ['getUserData']),
...mapActions(AcctMgmtStore, ['closeAcctMenu']), ...mapActions(useAcctMgmtStore, ['closeAcctMenu']),
}, },
created() { created() {
this.getUserData(); this.getUserData();

4
src/components/Compare/SidebarStates.vue
View File

@@ -147,13 +147,13 @@
</Sidebar> </Sidebar>
</template> </template>
<script> <script>
import CompareStore from '@/stores/compare.js'; import { useCompareStore } from '@/stores/compare.js';
import { getTimeLabel } from '@/module/timeLabel.js'; import { getTimeLabel } from '@/module/timeLabel.js';
import getMoment from 'moment'; import getMoment from 'moment';
export default { export default {
setup() { setup() {
const compareStore = CompareStore(); const compareStore = useCompareStore();
return { compareStore }; return { compareStore };
}, },

4
src/components/Discover/Conformance/ConformanceResults.vue
View File

@@ -193,7 +193,7 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import iconNA from '@/components/icons/IconNA.vue'; import iconNA from '@/components/icons/IconNA.vue';
import MoreModal from './MoreModal.vue'; import MoreModal from './MoreModal.vue';
import getNumberLabel from '@/module/numberLabel.js'; import getNumberLabel from '@/module/numberLabel.js';
@@ -203,7 +203,7 @@ import getMoment from 'moment';
export default { export default {
setup() { setup() {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { conformanceTempReportData, issueTraces, taskSeq, cases, loopTraces, loopTaskSeq, loopCases } = storeToRefs(conformanceStore); const { conformanceTempReportData, issueTraces, taskSeq, cases, loopTraces, loopTaskSeq, loopCases } = storeToRefs(conformanceStore);
return { conformanceTempReportData, issueTraces, taskSeq, cases, loopTraces, loopTaskSeq, loopCases, conformanceStore } return { conformanceTempReportData, issueTraces, taskSeq, cases, loopTraces, loopTaskSeq, loopCases, conformanceStore }

14
src/components/Discover/Conformance/ConformanceSidebar.vue
View File

@@ -124,9 +124,9 @@
<script> <script>
import { storeToRefs, mapState, mapActions, } from 'pinia'; import { storeToRefs, mapState, mapActions, } from 'pinia';
import i18next from '@/i18n/i18n'; import i18next from '@/i18n/i18n';
import ConformanceInputStore from '@/stores/conformanceInput'; import { useConformanceInputStore } from '@/stores/conformanceInput';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import ConformanceRadioGroup from './ConformanceSidebar/ConformanceRadioGroup.vue'; import ConformanceRadioGroup from './ConformanceSidebar/ConformanceRadioGroup.vue';
import ConformanceShowBar from './ConformanceSidebar/ConformanceShowBar.vue'; import ConformanceShowBar from './ConformanceSidebar/ConformanceShowBar.vue';
import ConformanceTimeRange from './ConformanceSidebar/ConformanceTimeRange.vue'; import ConformanceTimeRange from './ConformanceSidebar/ConformanceTimeRange.vue';
@@ -134,8 +134,8 @@ import ConformanceSelectResult from './ConformanceSidebar/ConformanceSelectResul
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope,
selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, cfmPtEteWhole, selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, cfmPtEteWhole,
@@ -325,7 +325,7 @@ export default {
this.isMainBtnDisabled = disabledBool; this.isMainBtnDisabled = disabledBool;
return this.isMainBtnDisabled; return this.isMainBtnDisabled;
}, },
...mapState(ConformanceInputStore, ['activityRadioData']), ...mapState(useConformanceInputStore, ['activityRadioData']),
}, },
watch: { watch: {
isSubmittedData: function(newValue) { isSubmittedData: function(newValue) {
@@ -1452,7 +1452,7 @@ export default {
? !(start && end) ? !(start && end)
: start !== end; : start !== end;
}, },
...mapActions(ConformanceInputStore, ['']) ...mapActions(useConformanceInputStore, [''])
}, },
created() { created() {
this.isShowBarOpen = !(this.conformanceLogCreateCheckId || this.conformanceFilterCreateCheckId); this.isShowBarOpen = !(this.conformanceLogCreateCheckId || this.conformanceFilterCreateCheckId);

4
src/components/Discover/Conformance/ConformanceSidebar/ActRadio.vue
View File

@@ -11,7 +11,7 @@
</template> </template>
<script> <script>
import { mapActions, } from 'pinia'; import { mapActions, } from 'pinia';
import ConformanceInputStore from "@/stores/conformanceInput"; import { useConformanceInputStore } from "@/stores/conformanceInput";
import { sortNumEngZhtw } from '@/module/sortNumEngZhtw.js'; import { sortNumEngZhtw } from '@/module/sortNumEngZhtw.js';
export default { export default {
@@ -58,7 +58,7 @@ export default {
//this.title: value might be "From" or "To" //this.title: value might be "From" or "To"
this.setActivityRadioStartEndData(this.inputActivityRadioData.task, this.title); this.setActivityRadioStartEndData(this.inputActivityRadioData.task, this.title);
}, },
...mapActions(ConformanceInputStore, ['setActivityRadioStartEndData']), ...mapActions(useConformanceInputStore, ['setActivityRadioStartEndData']),
}, },
created() { created() {
sortNumEngZhtw(this.sortData); sortNumEngZhtw(this.sortData);

4
src/components/Discover/Conformance/ConformanceSidebar/ConformanceRadioGroup.vue
View File

@@ -52,11 +52,11 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
export default { export default {
setup() { setup() {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo } = storeToRefs(conformanceStore); const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo } = storeToRefs(conformanceStore);
return { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo } return { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo }

4
src/components/Discover/Conformance/ConformanceSidebar/ConformanceSelectResult.vue
View File

@@ -30,14 +30,14 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import ResultCheck from '@/components/Discover/Conformance/ConformanceSidebar/ResultCheck.vue'; import ResultCheck from '@/components/Discover/Conformance/ConformanceSidebar/ResultCheck.vue';
import ResultArrow from '@/components/Discover/Conformance/ConformanceSidebar/ResultArrow.vue'; import ResultArrow from '@/components/Discover/Conformance/ConformanceSidebar/ResultArrow.vue';
import ResultDot from '@/components/Discover/Conformance/ConformanceSidebar/ResultDot.vue'; import ResultDot from '@/components/Discover/Conformance/ConformanceSidebar/ResultDot.vue';
export default { export default {
setup() { setup() {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo, isStartSelected, isEndSelected } = storeToRefs(conformanceStore); const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo, isStartSelected, isEndSelected } = storeToRefs(conformanceStore);
return { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo, isStartSelected, isEndSelected } return { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, selectedActSeqFromTo, isStartSelected, isEndSelected }

8
src/components/Discover/Conformance/ConformanceSidebar/ConformanceShowBar.vue
View File

@@ -99,16 +99,16 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import ActList from './ActList.vue'; import ActList from './ActList.vue';
import ActRadio from './ActRadio.vue'; import ActRadio from './ActRadio.vue';
import ActSeqDrag from './ActSeqDrag.vue'; import ActSeqDrag from './ActSeqDrag.vue';
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore, const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, selectedActSeqMore,
selectedActSeqFromTo, conformanceTask, cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, selectedActSeqFromTo, conformanceTask, cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE,

4
src/components/Discover/Conformance/ConformanceSidebar/ConformanceTimeRange.vue
View File

@@ -70,11 +70,11 @@
<script> <script>
import TimeRangeDuration from '@/components/Discover/Conformance/ConformanceSidebar/TimeRangeDuration.vue'; import TimeRangeDuration from '@/components/Discover/Conformance/ConformanceSidebar/TimeRangeDuration.vue';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
export default { export default {
setup() { setup() {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope, const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope,
selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, conformanceTask, selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, conformanceTask,
cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, cfmPtPStart, cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, cfmPtPStart,

4
src/components/Discover/Conformance/MoreModal.vue
View File

@@ -63,13 +63,13 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js'; import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
export default { export default {
props: ['listModal', 'listNo', 'traceId', 'firstCases', 'listTraces', 'taskSeq', 'cases', 'category'], props: ['listModal', 'listNo', 'traceId', 'firstCases', 'listTraces', 'taskSeq', 'cases', 'category'],
setup() { setup() {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { infinite404 } = storeToRefs(conformanceStore); const { infinite404 } = storeToRefs(conformanceStore);
return { infinite404, conformanceStore } return { infinite404, conformanceStore }

4
src/components/Discover/Map/Filter/Attributes.vue
View File

@@ -121,7 +121,7 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { setLineChartData } from '@/module/setChartData.js'; import { setLineChartData } from '@/module/setChartData.js';
import getMoment from 'moment'; import getMoment from 'moment';
import InputNumber from 'primevue/inputnumber'; import InputNumber from 'primevue/inputnumber';
@@ -129,7 +129,7 @@ import { Decimal } from 'decimal.js';
export default { export default {
setup() { setup() {
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { filterAttrs } = storeToRefs(allMapDataStore); const { filterAttrs } = storeToRefs(allMapDataStore);
return { filterAttrs } return { filterAttrs }

8
src/components/Discover/Map/Filter/Funnel.vue
View File

@@ -40,14 +40,14 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { delaySecond, } from '@/utils/timeUtil.js'; import { delaySecond, } from '@/utils/timeUtil.js';
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { hasResultRule, temporaryData, postRuleData, ruleData, isRuleData, tempFilterId } = storeToRefs(allMapDataStore); const { hasResultRule, temporaryData, postRuleData, ruleData, isRuleData, tempFilterId } = storeToRefs(allMapDataStore);

4
src/components/Discover/Map/Filter/Timeframes.vue
View File

@@ -32,7 +32,7 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { Chart, registerables } from 'chart.js'; import { Chart, registerables } from 'chart.js';
import 'chartjs-adapter-moment'; import 'chartjs-adapter-moment';
import getMoment from 'moment'; import getMoment from 'moment';
@@ -40,7 +40,7 @@ import getMoment from 'moment';
export default{ export default{
props:['selectValue'], props:['selectValue'],
setup() { setup() {
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { filterTimeframe, selectTimeFrame } = storeToRefs(allMapDataStore); const { filterTimeframe, selectTimeFrame } = storeToRefs(allMapDataStore);
return {allMapDataStore, filterTimeframe, selectTimeFrame } return {allMapDataStore, filterTimeframe, selectTimeFrame }

8
src/components/Discover/Map/Filter/Trace.vue
View File

@@ -70,15 +70,15 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js'; import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
export default { export default {
expose: ['selectArea', 'showTraceId', 'traceTotal'], expose: ['selectArea', 'showTraceId', 'traceTotal'],
setup() { setup() {
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const { infinit404, baseInfiniteStart, baseTraces, baseTraceTaskSeq, baseCases } = storeToRefs(allMapDataStore); const { infinit404, baseInfiniteStart, baseTraces, baseTraceTaskSeq, baseCases } = storeToRefs(allMapDataStore);
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);

8
src/components/Discover/Map/SidebarFilter.vue
View File

@@ -98,8 +98,8 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ActOccCase from '@/components/Discover/Map/Filter/ActOccCase.vue'; import ActOccCase from '@/components/Discover/Map/Filter/ActOccCase.vue';
import ActOcc from '@/components/Discover/Map/Filter/ActOcc.vue'; import ActOcc from '@/components/Discover/Map/Filter/ActOcc.vue';
import ActAndSeq from '@/components/Discover/Map/Filter/ActAndSeq.vue'; import ActAndSeq from '@/components/Discover/Map/Filter/ActAndSeq.vue';
@@ -112,8 +112,8 @@ import getMoment from 'moment';
export default { export default {
props: ['sidebarFilter', 'filterTasks', 'filterStartToEnd', 'filterEndToStart', 'filterTimeframe', 'filterTrace'], props: ['sidebarFilter', 'filterTasks', 'filterStartToEnd', 'filterEndToStart', 'filterTimeframe', 'filterTrace'],
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { hasResultRule, temporaryData, postRuleData, ruleData, isRuleData, selectTimeFrame } = storeToRefs(allMapDataStore); const { hasResultRule, temporaryData, postRuleData, ruleData, isRuleData, selectTimeFrame } = storeToRefs(allMapDataStore);

8
src/components/Discover/Map/SidebarState.vue
View File

@@ -243,8 +243,8 @@
<script> <script>
import { computed, ref, } from 'vue'; import { computed, ref, } from 'vue';
import PageAdmin from '@/stores/pageAdmin'; import { usePageAdminStore } from '@/stores/pageAdmin';
import MapPathStore from '@/stores/mapPathStore'; import { useMapPathStore } from '@/stores/mapPathStore';
import { getTimeLabel } from '@/module/timeLabel.js'; import { getTimeLabel } from '@/module/timeLabel.js';
import getMoment from 'moment'; import getMoment from 'moment';
import i18next from '@/i18n/i18n'; import i18next from '@/i18n/i18n';
@@ -268,8 +268,8 @@ export default {
} }
}, },
setup(props){ setup(props){
const pageAdmin = PageAdmin(); const pageAdmin = usePageAdminStore();
const mapPathStore = MapPathStore(); const mapPathStore = useMapPathStore();
const activeTrace = ref(0); const activeTrace = ref(0);
const currentMapFile = computed(() => pageAdmin.currentMapFile); const currentMapFile = computed(() => pageAdmin.currentMapFile);

8
src/components/Discover/Map/SidebarTraces.vue
View File

@@ -61,15 +61,15 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js'; import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
export default { export default {
props: ['sidebarTraces', 'cases'], props: ['sidebarTraces', 'cases'],
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { infinit404, infiniteStart, traceId, traces, traceTaskSeq, infiniteFirstCases } = storeToRefs(allMapDataStore); const { infinit404, infiniteStart, traceId, traces, traceTaskSeq, infiniteFirstCases } = storeToRefs(allMapDataStore);

6
src/components/Discover/Map/SidebarView.vue
View File

@@ -70,7 +70,7 @@
</template> </template>
<script> <script>
import MapPathStore from '@/stores/mapPathStore'; import { useMapPathStore } from '@/stores/mapPathStore';
import { mapState, mapActions, } from 'pinia'; import { mapState, mapActions, } from 'pinia';
export default { export default {
props: { props: {
@@ -108,7 +108,7 @@ export default {
} }
}, },
computed: { computed: {
...mapState(MapPathStore, ['isBPMNOn']), ...mapState(useMapPathStore, ['isBPMNOn']),
}, },
methods: { methods: {
/** /**
@@ -168,7 +168,7 @@ export default {
this.setIsBPMNOn(true); this.setIsBPMNOn(true);
this.switchMapType('bpmn'); this.switchMapType('bpmn');
}, },
...mapActions(MapPathStore, ['setIsBPMNOn',]), ...mapActions(useMapPathStore, ['setIsBPMNOn',]),
}, },
mounted() { mounted() {
this.dataLayerType = 'freq'; this.dataLayerType = 'freq';

4
src/components/Discover/StatusBar.vue
View File

@@ -80,13 +80,13 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { getTimeLabel } from '@/module/timeLabel.js'; import { getTimeLabel } from '@/module/timeLabel.js';
import getMoment from 'moment'; import getMoment from 'moment';
export default { export default {
setup() { setup() {
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { logId, stats, createFilterId } = storeToRefs(allMapDataStore); const { logId, stats, createFilterId } = storeToRefs(allMapDataStore);
return { logId, stats, createFilterId, allMapDataStore }; return { logId, stats, createFilterId, allMapDataStore };

4
src/components/File/UploadModal.vue
View File

@@ -18,12 +18,12 @@
import IconUploarding from '../icons/IconUploarding.vue'; import IconUploarding from '../icons/IconUploarding.vue';
import { uploadFailedFirst } from '@/module/alertModal.js' import { uploadFailedFirst } from '@/module/alertModal.js'
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import FilesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
export default { export default {
props: ['uploadModal'], props: ['uploadModal'],
setup() { setup() {
const filesStore = FilesStore(); const filesStore = useFilesStore();
const { uploadFileName } = storeToRefs(filesStore); const { uploadFileName } = storeToRefs(filesStore);
return { filesStore, uploadFileName } return { filesStore, uploadFileName }

14
src/components/Header.vue
View File

@@ -23,11 +23,11 @@
import { ref, } from 'vue'; import { ref, } from 'vue';
import { storeToRefs, } from 'pinia'; import { storeToRefs, } from 'pinia';
import i18next from '@/i18n/i18n'; import i18next from '@/i18n/i18n';
import loginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import DspLogo from '@/components/icons/DspLogo.vue'; import DspLogo from '@/components/icons/DspLogo.vue';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import { leaveFilter, leaveConformance } from '@/module/alertModal.js'; import { leaveFilter, leaveConformance } from '@/module/alertModal.js';
export default { export default {
@@ -38,10 +38,10 @@ export default {
} }
}, },
setup() { setup() {
const store = loginStore(); const store = useLoginStore();
const { logOut } = store; const { logOut } = store;
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const acctMgmtStore = useAcctMgmtStore(); const acctMgmtStore = useAcctMgmtStore();
const { tempFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore); const { tempFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore);
const { conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceFileName } = storeToRefs(conformanceStore); const { conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceFileName } = storeToRefs(conformanceStore);

22
src/components/Navbar.vue
View File

@@ -46,11 +46,11 @@
</template> </template>
<script> <script>
import { storeToRefs, mapState, mapActions, } from 'pinia'; import { storeToRefs, mapState, mapActions, } from 'pinia';
import filesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import PageAdminStore from '@/stores/pageAdmin.js'; import { usePageAdminStore } from '@/stores/pageAdmin.js';
import MapCompareStore from '@/stores/mapCompareStore'; import { useMapCompareStore } from '@/stores/mapCompareStore';
import IconSearch from '@/components/icons/IconSearch.vue'; import IconSearch from '@/components/icons/IconSearch.vue';
import IconSetting from '@/components/icons/IconSetting.vue'; import IconSetting from '@/components/icons/IconSetting.vue';
import { saveFilter, savedSuccessfully, saveConformance } from '@/module/alertModal.js'; import { saveFilter, savedSuccessfully, saveConformance } from '@/module/alertModal.js';
@@ -59,9 +59,9 @@ import AcctMenu from './AccountMenu/AcctMenu.vue';
export default { export default {
setup() { setup() {
const store = filesStore(); const store = useFilesStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { logId, tempFilterId, createFilterId, filterName, postRuleData, isUpdateFilter } = storeToRefs(allMapDataStore); const { logId, tempFilterId, createFilterId, filterName, postRuleData, isUpdateFilter } = storeToRefs(allMapDataStore);
const { conformanceRuleData, conformanceLogId, conformanceFilterId, const { conformanceRuleData, conformanceLogId, conformanceFilterId,
conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceLogTempCheckId, conformanceFilterTempCheckId,
@@ -85,7 +85,7 @@ export default {
}, },
data() { data() {
return { return {
mapCompareStore: MapCompareStore(), mapCompareStore: useMapCompareStore(),
showNavbarBreadcrumb: false, showNavbarBreadcrumb: false,
navViewData: navViewData:
{ {
@@ -125,7 +125,7 @@ export default {
this.navViewName === 'ACCOUNT MANAGEMENT' || this.navViewName === 'ACCOUNT MANAGEMENT' ||
this.activePage === 'PERFORMANCE'; this.activePage === 'PERFORMANCE';
}, },
...mapState(PageAdminStore, [ ...mapState(usePageAdminStore, [
'activePage', 'activePage',
'pendingActivePage', 'pendingActivePage',
'activePageComputedByRoute', 'activePageComputedByRoute',
@@ -338,7 +338,7 @@ export default {
} }
} }
}, },
...mapActions(PageAdminStore, [ ...mapActions(usePageAdminStore, [
'setPendingActivePage', 'setPendingActivePage',
'setPreviousPage', 'setPreviousPage',
'setActivePage', 'setActivePage',

4
src/components/durationjs.vue
View File

@@ -42,7 +42,7 @@
<script> <script>
//:value="tUnits[unit].val.toString().padStart(2, '0')" //:value="tUnits[unit].val.toString().padStart(2, '0')"
import { mapActions, } from 'pinia'; import { mapActions, } from 'pinia';
import ConformanceInputStore from '@/stores/conformanceInput'; import { useConformanceInputStore } from '@/stores/conformanceInput';
export default { export default {
props: { props: {
@@ -424,7 +424,7 @@ export default {
} }
}, },
...mapActions( ...mapActions(
ConformanceInputStore,[] useConformanceInputStore,[]
), ),
}, },
created() { created() {

26
src/module/alertModal.js
View File

@@ -1,8 +1,8 @@
import Swal from 'sweetalert2'; import Swal from 'sweetalert2';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import FilesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
import PageAdminStore from '@/stores/pageAdmin.js'; import { usePageAdminStore } from '@/stores/pageAdmin.js';
import { useModalStore } from '@/stores/modal.js'; import { useModalStore } from '@/stores/modal.js';
import { escapeHtml } from '@/utils/escapeHtml.js'; import { escapeHtml } from '@/utils/escapeHtml.js';
@@ -23,7 +23,7 @@ const customClass = {
*/ */
export async function saveFilter(addFilterId, next = null) { export async function saveFilter(addFilterId, next = null) {
let fileName = ''; let fileName = '';
const pageAdminStore = PageAdminStore(); const pageAdminStore = usePageAdminStore();
const { value, isConfirmed } = await Swal.fire({ const { value, isConfirmed } = await Swal.fire({
title: 'SAVE NEW FILTER', title: 'SAVE NEW FILTER',
@@ -90,8 +90,8 @@ export async function savedSuccessfully(value) {
* @param { function } logOut 登出函式 * @param { function } logOut 登出函式
*/ */
export async function leaveFilter(next, addFilterId, toPath, logOut) { export async function leaveFilter(next, addFilterId, toPath, logOut) {
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const pageAdminStore = PageAdminStore(); const pageAdminStore = usePageAdminStore();
const result = await Swal.fire({ const result = await Swal.fire({
title: 'SAVE YOUR FILTER?', title: 'SAVE YOUR FILTER?',
@@ -122,7 +122,7 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
} else if(result.dismiss === 'cancel') { } else if(result.dismiss === 'cancel') {
// console.log('popup cancel case', ); // console.log('popup cancel case', );
// Handle page admin issue // Handle page admin issue
// console.log("PageAdminStore.activePage", PageAdminStore.activePage); // console.log("usePageAdminStore.activePage", usePageAdminStore.activePage);
pageAdminStore.keepPreviousPage(); pageAdminStore.keepPreviousPage();
allMapDataStore.tempFilterId = null; allMapDataStore.tempFilterId = null;
@@ -130,7 +130,7 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
} else if(result.dismiss === 'backdrop') { } else if(result.dismiss === 'backdrop') {
// console.log('popup backdrop case', ); // console.log('popup backdrop case', );
// Handle page admin issue // Handle page admin issue
// console.log("PageAdminStore.activePage", PageAdminStore.activePage); // console.log("usePageAdminStore.activePage", usePageAdminStore.activePage);
pageAdminStore.keepPreviousPage(); pageAdminStore.keepPreviousPage();
if(!logOut){ if(!logOut){
@@ -186,7 +186,7 @@ export async function saveConformance(addConformanceCreateCheckId) {
* @param { function } logOut 登出函式 * @param { function } logOut 登出函式
*/ */
export async function leaveConformance(next, addConformanceCreateCheckId, toPath, logOut) { export async function leaveConformance(next, addConformanceCreateCheckId, toPath, logOut) {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const result = await showConfirmationDialog(); const result = await showConfirmationDialog();
if (result.isConfirmed) { if (result.isConfirmed) {
@@ -359,7 +359,7 @@ export async function uploadSuccess() {
* @param { object } fetchData 後端 API POST data * @param { object } fetchData 後端 API POST data
*/ */
export async function uploadConfirm(fetchData) { export async function uploadConfirm(fetchData) {
const filesStore = FilesStore(); const filesStore = useFilesStore();
const result = await Swal.fire({ const result = await Swal.fire({
title: 'ARE YOU SURE?', title: 'ARE YOU SURE?',
html: 'After importing, you won’t be able to modify labels.', html: 'After importing, you won’t be able to modify labels.',
@@ -441,7 +441,7 @@ export async function renameModal(rename, type, id, baseName) {
* @param { string } name 原本的檔案 * @param { string } name 原本的檔案
*/ */
export async function deleteFileModal(files, type, id, name) { export async function deleteFileModal(files, type, id, name) {
const filesStore = FilesStore(); const filesStore = useFilesStore();
const safeName = escapeHtml(name); const safeName = escapeHtml(name);
const htmlText = files.length === 0 ? `Do you really want to delete <span class="text-primary">${safeName}</span>?` : `<div class="text-left mx-4 space-y-1"><p class="mb-2">Do you really want to delete <span class="text-primary">${safeName}</span>?</p><p>The following dependent file(s) will also be deleted:</p><ul class="list-disc ml-6">${files}</ul></div>`; const htmlText = files.length === 0 ? `Do you really want to delete <span class="text-primary">${safeName}</span>?` : `<div class="text-left mx-4 space-y-1"><p class="mb-2">Do you really want to delete <span class="text-primary">${safeName}</span>?</p><p>The following dependent file(s) will also be deleted:</p><ul class="list-disc ml-6">${files}</ul></div>`;
@@ -489,7 +489,7 @@ export async function deleteSuccess() {
* @param {array} reallyDeleteData 被刪除的檔案 data，未取得 recordId 而傳入 * @param {array} reallyDeleteData 被刪除的檔案 data，未取得 recordId 而傳入
*/ */
export async function reallyDeleteInformation(files, reallyDeleteData) { export async function reallyDeleteInformation(files, reallyDeleteData) {
const filesStore = FilesStore(); const filesStore = useFilesStore();
const deleteCustomClass = { ...customClass }; const deleteCustomClass = { ...customClass };
const htmlText = `<div class="text-left mx-4 space-y-1"><p>The following file(s) have been deleted by other user(s):</p><ul class="list-disc ml-6">${files}</ul></div>`; const htmlText = `<div class="text-left mx-4 space-y-1"><p>The following file(s) have been deleted by other user(s):</p><ul class="list-disc ml-6">${files}</ul></div>`;

4
src/module/apiError.js
View File

@@ -1,4 +1,4 @@
import loadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import {useToast} from 'vue-toast-notification'; import {useToast} from 'vue-toast-notification';
import 'vue-toast-notification/dist/theme-sugar.css'; import 'vue-toast-notification/dist/theme-sugar.css';
@@ -12,7 +12,7 @@ const delay = (s = 0) => new Promise((resolve, reject) => setTimeout(resolve, s
* @param {string} toastMessage Toast 的提示文字 * @param {string} toastMessage Toast 的提示文字
*/ */
export default async function apiError(error, toastMessage) { export default async function apiError(error, toastMessage) {
const loading = loadingStore(); const loading = useLoadingStore();
const $toast = useToast(); const $toast = useToast();
await delay(); await delay();
loading.isLoading = true; loading.isLoading = true;

10
src/module/cytoscapeMap.js
View File

@@ -5,9 +5,9 @@ import fcose from 'cytoscape-fcose';
import cola from 'cytoscape-cola'; import cola from 'cytoscape-cola';
import tippy from 'tippy.js'; import tippy from 'tippy.js';
import 'tippy.js/dist/tippy.css'; import 'tippy.js/dist/tippy.css';
import MapPathStore from '@/stores/mapPathStore'; import { useMapPathStore } from '@/stores/mapPathStore';
import { getTimeLabel } from '@/module/timeLabel.js'; // 時間格式轉換器 import { getTimeLabel } from '@/module/timeLabel.js'; // 時間格式轉換器
import CytoscapeStore from '@/stores/cytoscapeStore'; import { useCytoscapeStore } from '@/stores/cytoscapeStore';
import { SAVE_KEY_NAME } from '@/constants/constants.js'; import { SAVE_KEY_NAME } from '@/constants/constants.js';
const composeFreqTypeText = (baseText, dataLayerOption, optionValue) => { //sonar-qube const composeFreqTypeText = (baseText, dataLayerOption, optionValue) => { //sonar-qube
@@ -232,12 +232,12 @@ export default function cytoscapeMap(mapData, dataLayerType, dataLayerOption, cu
// 按下節點光暈效果與鄰邊光暈效果 // 按下節點光暈效果與鄰邊光暈效果
cy.on('tap, mousedown', 'node', function (event) { cy.on('tap, mousedown', 'node', function (event) {
MapPathStore().onNodeClickHighlightEdges(event.target); useMapPathStore().onNodeClickHighlightEdges(event.target);
}); });
// 按下線段光暈效果與兩端點光暈效果 // 按下線段光暈效果與兩端點光暈效果
cy.on('tap, mousedown', 'edge', function (event) { cy.on('tap, mousedown', 'edge', function (event) {
MapPathStore().onEdgeClickHighlightNodes(event.target); useMapPathStore().onEdgeClickHighlightNodes(event.target);
}); });
// creat tippy.js // creat tippy.js
@@ -260,7 +260,7 @@ export default function cytoscapeMap(mapData, dataLayerType, dataLayerOption, cu
}); });
// here we remember and recall positions // here we remember and recall positions
const cytoscapeStore = CytoscapeStore(); const cytoscapeStore = useCytoscapeStore();
cy.ready(() => { cy.ready(() => {
cytoscapeStore.loadPositionsFromStorage(rank); cytoscapeStore.loadPositionsFromStorage(rank);
// 判斷localStorage是否儲存過拜訪資訊 // 判斷localStorage是否儲存過拜訪資訊

8
src/stores/acctMgmt.ts
View File

@@ -1,7 +1,7 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import apiClient from '@/api/client.js'; import apiClient from '@/api/client.js';
import apiError from '@/module/apiError'; import apiError from '@/module/apiError';
import piniaLoginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import { JUST_CREATE_ACCOUNT_HOT_DURATION_MINS } from '@/constants/constants'; import { JUST_CREATE_ACCOUNT_HOT_DURATION_MINS } from '@/constants/constants';
interface User { interface User {
@@ -25,7 +25,7 @@ interface EditDetail {
is_active: boolean; is_active: boolean;
} }
export default defineStore('acctMgmtStore', { export const useAcctMgmtStore = defineStore('acctMgmtStore', {
persist: true, persist: true,
state: () => ({ state: () => ({
allUserAccoutList: [] as User[], allUserAccoutList: [] as User[],
@@ -99,7 +99,7 @@ export default defineStore('acctMgmtStore', {
* Add some customization. For example, add isHovered field * Add some customization. For example, add isHovered field
*/ */
async customizeAllUserList(rawResponseData: User[]): Promise<User[]> { async customizeAllUserList(rawResponseData: User[]): Promise<User[]> {
const loginStore = piniaLoginStore(); const loginStore = useLoginStore();
await loginStore.getUserData(); await loginStore.getUserData();
const loginUserData:User = loginStore.userData; const loginUserData:User = loginStore.userData;
return rawResponseData.map(user => ({ return rawResponseData.map(user => ({
@@ -114,7 +114,7 @@ export default defineStore('acctMgmtStore', {
* Current logged in user should be placed at the first row on list * Current logged in user should be placed at the first row on list
*/ */
async moveCurrentLoginUserToFirstRow(fetchedUserList: User[]): Promise<User[]> { async moveCurrentLoginUserToFirstRow(fetchedUserList: User[]): Promise<User[]> {
const loginStore = piniaLoginStore(); const loginStore = useLoginStore();
await loginStore.getUserData(); await loginStore.getUserData();
const loginUserData:User = loginStore.userData; const loginUserData:User = loginStore.userData;
const foundLoginUserIndex = fetchedUserList.findIndex(user => user.username === loginUserData.username); const foundLoginUserIndex = fetchedUserList.findIndex(user => user.username === loginUserData.username);

2
src/stores/allMapData.js
View File

@@ -4,7 +4,7 @@ import apiClient from "@/api/client.js";
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
import { Decimal } from 'decimal.js'; import { Decimal } from 'decimal.js';
export default defineStore('allMapDataStore', { export const useAllMapDataStore = defineStore('allMapDataStore', {
state: () => ({ state: () => ({
baseLogId: null, baseLogId: null,
logId: null, logId: null,

2
src/stores/compare.js
View File

@@ -2,7 +2,7 @@ import { defineStore } from "pinia";
import apiClient from "@/api/client.js"; import apiClient from "@/api/client.js";
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
export default defineStore('compareStore', { export const useCompareStore = defineStore('compareStore', {
state: () => ({ state: () => ({
allCompareDashboardData: null, allCompareDashboardData: null,
}), }),

2
src/stores/conformance.js
View File

@@ -5,7 +5,7 @@ import abbreviateNumber from '@/module/abbreviateNumber.js';
import apiClient from "@/api/client.js"; import apiClient from "@/api/client.js";
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
export default defineStore('conformanceStore', { export const useConformanceStore = defineStore('conformanceStore', {
state: () => ({ state: () => ({
conformanceLogId: null, // log 檔 conformanceLogId: null, // log 檔
conformanceFilterId: null, // filter 檔 conformanceFilterId: null, // filter 檔

2
src/stores/conformanceInput.js
View File

@@ -7,7 +7,7 @@ import moment from 'moment';
* 而後者則側重在 API 的串接之所需 * 而後者則側重在 API 的串接之所需
*/ */
export default defineStore('conformanceInputStore', { export const useConformanceInputStore = defineStore('conformanceInputStore', {
state: () => ({ state: () => ({
inputDataToSave: { inputDataToSave: {
inputStart: null, // 有待釐清，start 是活動的開始，還是時間的開始? inputStart: null, // 有待釐清，start 是活動的開始，還是時間的開始?

2
src/stores/cytoscapeStore.ts
View File

@@ -23,7 +23,7 @@ interface NodePositions {
} }
export default defineStore('useCytoscapeStore', { export const useCytoscapeStore = defineStore('cytoscapeStore', {
state: () => ({ state: () => ({
nodePositions: {} as NodePositions, nodePositions: {} as NodePositions,
currentGraphId: "", currentGraphId: "",

8
src/stores/files.js
View File

@@ -4,9 +4,9 @@ import moment from 'moment';
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
import Swal from 'sweetalert2'; import Swal from 'sweetalert2';
import { uploadFailedFirst, uploadFailedSecond, uploadloader, uploadSuccess, deleteSuccess } from '@/module/alertModal.js'; import { uploadFailedFirst, uploadFailedSecond, uploadloader, uploadSuccess, deleteSuccess } from '@/module/alertModal.js';
import loadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
export default defineStore('filesStore', { export const useFilesStore = defineStore('filesStore', {
state: () => ({ state: () => ({
allEventFiles: [ allEventFiles: [
{ {
@@ -259,7 +259,7 @@ export default defineStore('filesStore', {
console.error('Delete File API Error: invalid id'); console.error('Delete File API Error: invalid id');
return; return;
}; };
const loading = loadingStore(); const loading = useLoadingStore();
loading.isLoading = true; loading.isLoading = true;
switch (type) { switch (type) {
case 'log': case 'log':
@@ -292,7 +292,7 @@ export default defineStore('filesStore', {
async deletionRecord(id) { async deletionRecord(id) {
let api = ''; let api = '';
const loading = loadingStore(); const loading = useLoadingStore();
loading.isLoading = true; loading.isLoading = true;
api = `/api/deletion/${id}`; api = `/api/deletion/${id}`;
try { try {

2
src/stores/loading.js
View File

@@ -1,6 +1,6 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
export default defineStore('loadingStore', { export const useLoadingStore = defineStore('loadingStore', {
state: () => ({ state: () => ({
isLoading: true, isLoading: true,
}), }),

2
src/stores/login.ts
View File

@@ -4,7 +4,7 @@ import apiClient from '@/api/client.js';
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
import { deleteCookie, setCookie, setCookieWithoutExpiration, getCookie } from "../utils/cookieUtil"; import { deleteCookie, setCookie, setCookieWithoutExpiration, getCookie } from "../utils/cookieUtil";
export default defineStore('loginStore', { export const useLoginStore = defineStore('loginStore', {
// data, methods, computed // data, methods, computed
// state, actions, getters // state, actions, getters
state: () => ({ state: () => ({

4
src/stores/mapCompareStore.ts
View File

@@ -1,5 +1,5 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import AllMapData from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { INSIGHTS_FIELDS_AND_LABELS } from '@/constants/constants'; import { INSIGHTS_FIELDS_AND_LABELS } from '@/constants/constants';
import ImgCapsuleGlow1 from '@/assets/capsule1-glow.svg'; import ImgCapsuleGlow1 from '@/assets/capsule1-glow.svg';
import ImgCapsuleGlow2 from '@/assets/capsule2-glow.svg'; import ImgCapsuleGlow2 from '@/assets/capsule2-glow.svg';
@@ -13,7 +13,7 @@ import ImgCapsule4 from '@/assets/capsule4.svg';
const ImgCapsulesGlow = [ImgCapsuleGlow1, ImgCapsuleGlow2, ImgCapsuleGlow3, ImgCapsuleGlow4]; const ImgCapsulesGlow = [ImgCapsuleGlow1, ImgCapsuleGlow2, ImgCapsuleGlow3, ImgCapsuleGlow4];
const ImgCapsules = [ImgCapsule1, ImgCapsule2, ImgCapsule3, ImgCapsule4]; const ImgCapsules = [ImgCapsule1, ImgCapsule2, ImgCapsule3, ImgCapsule4];
export default defineStore('useMapCompareStore', { export const useMapCompareStore = defineStore('mapCompareStore', {
state: () => ({ state: () => ({
routeParam: { routeParam: {
primaryType: '', primaryType: '',

8
src/stores/mapPathStore.ts
View File

@@ -1,5 +1,5 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import AllMapData from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import { INSIGHTS_FIELDS_AND_LABELS } from '@/constants/constants'; import { INSIGHTS_FIELDS_AND_LABELS } from '@/constants/constants';
import ImgCapsuleGlow1 from '@/assets/capsule1-glow.svg'; import ImgCapsuleGlow1 from '@/assets/capsule1-glow.svg';
import ImgCapsuleGlow2 from '@/assets/capsule2-glow.svg'; import ImgCapsuleGlow2 from '@/assets/capsule2-glow.svg';
@@ -13,7 +13,7 @@ import ImgCapsule4 from '@/assets/capsule4.svg';
const ImgCapsulesGlow = [ImgCapsuleGlow1, ImgCapsuleGlow2, ImgCapsuleGlow3, ImgCapsuleGlow4]; const ImgCapsulesGlow = [ImgCapsuleGlow1, ImgCapsuleGlow2, ImgCapsuleGlow3, ImgCapsuleGlow4];
const ImgCapsules = [ImgCapsule1, ImgCapsule2, ImgCapsule3, ImgCapsule4]; const ImgCapsules = [ImgCapsule1, ImgCapsule2, ImgCapsule3, ImgCapsule4];
export default defineStore('useMapPathStore', { export const useMapPathStore = defineStore('mapPathStore', {
state: () => ({ state: () => ({
clickedPath: [], clickedPath: [],
insights: {}, insights: {},
@@ -65,7 +65,7 @@ export default defineStore('useMapPathStore', {
} }
}, },
async createInsightWithPath() { async createInsightWithPath() {
const { insights } = AllMapData(); const { insights } = useAllMapDataStore();
this.insights = { ...insights }; this.insights = { ...insights };
this.startNode = this.cytoscape[this.processOrBPMN][this.curveType][this.directionType]?.nodes() this.startNode = this.cytoscape[this.processOrBPMN][this.curveType][this.directionType]?.nodes()
.filter(function (elem) { .filter(function (elem) {
@@ -118,7 +118,7 @@ export default defineStore('useMapPathStore', {
}); });
// Depth First Search from the starting node // Depth First Search from the starting node
await this.depthFirstSearchCreatePath(this.startNode, [this.startNode], []); await this.depthFirstSearchCreatePath(this.startNode, [this.startNode], []);
const { insights } = AllMapData(); const { insights } = useAllMapDataStore();
this.insights = { ...insights }; this.insights = { ...insights };
await this.matchGraphPathWithInsightsPath(); await this.matchGraphPathWithInsightsPath();
}, },

2
src/stores/pageAdmin.js
View File

@@ -7,7 +7,7 @@ const printPageAdminLog = false;
// Therefore, we need to handle page transitions caused by both of these methods. // Therefore, we need to handle page transitions caused by both of these methods.
// 至少有兩種方式引起畫面的導向: 點選導覽按鈕與重新整理網頁 // 至少有兩種方式引起畫面的導向: 點選導覽按鈕與重新整理網頁
// 因此至少要處理這兩種方式所引起的畫面切換 // 因此至少要處理這兩種方式所引起的畫面切換
export default defineStore('pageAdminStore', { export const usePageAdminStore = defineStore('pageAdminStore', {
state: () => ({ state: () => ({
activePage: 'MAP', activePage: 'MAP',
previousPage: 'MAP', previousPage: 'MAP',

2
src/stores/performance.js
View File

@@ -2,7 +2,7 @@ import { defineStore } from "pinia";
import apiClient from "@/api/client.js"; import apiClient from "@/api/client.js";
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
export default defineStore('performanceStore', { export const usePerformanceStore = defineStore('performanceStore', {
state: () => ({ state: () => ({
allPerformanceData: null, allPerformanceData: null,
freqChartData: null, freqChartData: null,

10
src/views/AccountManagement/AccountAdmin/AccountAdmin.vue
View File

@@ -115,10 +115,10 @@
<script> <script>
import { ref, computed, onMounted, watch, } from 'vue'; import { ref, computed, onMounted, watch, } from 'vue';
import { mapState, mapActions, } from 'pinia'; import { mapState, mapActions, } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import { useModalStore } from '@/stores/modal.js'; import { useModalStore } from '@/stores/modal.js';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import piniaLoginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import SearchBar from '../../../components/AccountMenu/SearchBar.vue'; import SearchBar from '../../../components/AccountMenu/SearchBar.vue';
import i18next from '@/i18n/i18n.js'; import i18next from '@/i18n/i18n.js';
import { useToast } from 'vue-toast-notification'; import { useToast } from 'vue-toast-notification';
@@ -140,9 +140,9 @@ export default {
setup() { setup() {
const toast = useToast(); const toast = useToast();
const acctMgmtStore = useAcctMgmtStore(); const acctMgmtStore = useAcctMgmtStore();
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const modalStore = useModalStore(); const modalStore = useModalStore();
const loginStore = piniaLoginStore(); const loginStore = useLoginStore();
const infiniteStart = ref(0); const infiniteStart = ref(0);
const shouldUpdateList = computed(() => acctMgmtStore.shouldUpdateList); const shouldUpdateList = computed(() => acctMgmtStore.shouldUpdateList);

2
src/views/AccountManagement/ModalAccountEditCreate.vue
View File

@@ -188,7 +188,7 @@ import { mapActions, } from 'pinia';
import { useModalStore } from '@/stores/modal.js'; import { useModalStore } from '@/stores/modal.js';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useToast } from 'vue-toast-notification'; import { useToast } from 'vue-toast-notification';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import ModalHeader from "./ModalHeader.vue"; import ModalHeader from "./ModalHeader.vue";
import IconChecked from "@/components/icons/IconChecked.vue"; import IconChecked from "@/components/icons/IconChecked.vue";
import { MODAL_CREATE_NEW, MODAL_ACCT_EDIT, PWD_VALID_LENGTH } from '@/constants/constants.js'; import { MODAL_CREATE_NEW, MODAL_ACCT_EDIT, PWD_VALID_LENGTH } from '@/constants/constants.js';

2
src/views/AccountManagement/ModalAccountInfo.vue
View File

@@ -25,7 +25,7 @@
<script> <script>
import { onBeforeMount, computed, ref } from 'vue'; import { onBeforeMount, computed, ref } from 'vue';
import i18next from '@/i18n/i18n.js'; import i18next from '@/i18n/i18n.js';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import ModalHeader from './ModalHeader.vue'; import ModalHeader from './ModalHeader.vue';
import Badge from '../../components/Badge.vue'; import Badge from '../../components/Badge.vue';

2
src/views/AccountManagement/ModalDeleteAlert.vue
View File

@@ -31,7 +31,7 @@
import { defineComponent, } from 'vue'; import { defineComponent, } from 'vue';
import { useModalStore } from '@/stores/modal.js'; import { useModalStore } from '@/stores/modal.js';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import i18next from '@/i18n/i18n.js'; import i18next from '@/i18n/i18n.js';
import { useToast } from 'vue-toast-notification'; import { useToast } from 'vue-toast-notification';

10
src/views/AccountManagement/MyAccount.vue
View File

@@ -117,10 +117,10 @@
<script> <script>
import { onMounted, computed, ref, } from 'vue'; import { onMounted, computed, ref, } from 'vue';
import i18next from '@/i18n/i18n.js'; import i18next from '@/i18n/i18n.js';
import LoginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import useAcctMgmtStore from '@/stores/acctMgmt'; import { useAcctMgmtStore } from '@/stores/acctMgmt';
import Badge from '../../components/Badge.vue'; import Badge from '../../components/Badge.vue';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import Button from '@/components/Button.vue'; import Button from '@/components/Button.vue';
import ButtonFilled from '@/components/ButtonFilled.vue'; import ButtonFilled from '@/components/ButtonFilled.vue';
import { useToast } from 'vue-toast-notification'; import { useToast } from 'vue-toast-notification';
@@ -128,8 +128,8 @@ import { PWD_VALID_LENGTH } from '@/constants/constants.js';
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const loginStore = LoginStore(); const loginStore = useLoginStore();
const acctMgmtStore = useAcctMgmtStore(); const acctMgmtStore = useAcctMgmtStore();
const toast = useToast(); const toast = useToast();

8
src/views/Compare/Dashboard/Compare.vue
View File

@@ -152,8 +152,8 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import moment from 'moment'; import moment from 'moment';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import CompareStore from '@/stores/compare.js'; import { useCompareStore } from '@/stores/compare.js';
import SidebarStates from '@/components/Compare/SidebarStates.vue'; import SidebarStates from '@/components/Compare/SidebarStates.vue';
import { setLineChartData } from '@/module/setChartData.js'; import { setLineChartData } from '@/module/setChartData.js';
import { simpleTimeLabel, followTimeLabel, import { simpleTimeLabel, followTimeLabel,
@@ -175,8 +175,8 @@ import FreqChart from '../../Discover/Performance/FreqChart.vue';
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const compareStore = CompareStore(); const compareStore = useCompareStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { compareDashboardData } = storeToRefs(compareStore); const { compareDashboardData } = storeToRefs(compareStore);

20
src/views/Compare/MapCompare.vue
View File

@@ -56,12 +56,12 @@
import { onBeforeMount, computed, } from 'vue'; import { onBeforeMount, computed, } from 'vue';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import cytoscapeMap from '@/module/cytoscapeMap.js'; import cytoscapeMap from '@/module/cytoscapeMap.js';
import CytoscapeStore from '@/stores/cytoscapeStore'; import { useCytoscapeStore } from '@/stores/cytoscapeStore';
import MapPathStore from '@/stores/mapPathStore'; import { useMapPathStore } from '@/stores/mapPathStore';
import SidebarView from '@/components/Discover/Map/SidebarView.vue'; import SidebarView from '@/components/Discover/Map/SidebarView.vue';
import SidebarState from '@/components/Discover/Map/SidebarState.vue'; import SidebarState from '@/components/Discover/Map/SidebarState.vue';
import SidebarTraces from '@/components/Discover/Map/SidebarTraces.vue'; import SidebarTraces from '@/components/Discover/Map/SidebarTraces.vue';
@@ -75,8 +75,8 @@
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const route = useRoute(); const route = useRoute();
const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId,
@@ -85,7 +85,7 @@
postRuleData postRuleData
} = storeToRefs(allMapDataStore); } = storeToRefs(allMapDataStore);
const cytoscapeStore = CytoscapeStore(); const cytoscapeStore = useCytoscapeStore();
const { setCurrentGraphId } = cytoscapeStore; const { setCurrentGraphId } = cytoscapeStore;
@@ -142,7 +142,7 @@
cytoscapeGraph: null, cytoscapeGraph: null,
curveStyle:'unbundled-bezier', // unbundled-bezier | taxi curveStyle:'unbundled-bezier', // unbundled-bezier | taxi
mapType: 'processMap', // processMap | bpmn mapType: 'processMap', // processMap | bpmn
mapPathStore: MapPathStore(), mapPathStore: useMapPathStore(),
dataLayerType: 'freq', // freq | duration dataLayerType: 'freq', // freq | duration
dataLayerOption: 'total', dataLayerOption: 'total',
rank: 'LR', // 直向 TB | 橫向 LR rank: 'LR', // 直向 TB | 橫向 LR
@@ -516,7 +516,7 @@
const isCheckPage = to.name.includes('Check'); const isCheckPage = to.name.includes('Check');
if (isCheckPage) { if (isCheckPage) {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
switch (to.params.type) { switch (to.params.type) {
case 'log': case 'log':
conformanceStore.conformanceLogCreateCheckId = to.params.fileId; conformanceStore.conformanceLogCreateCheckId = to.params.fileId;

10
src/views/Discover/Conformance/index.vue
View File

@@ -9,16 +9,16 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import StatusBar from '@/components/Discover/StatusBar.vue'; import StatusBar from '@/components/Discover/StatusBar.vue';
import ConformanceResults from '@/components/Discover/Conformance/ConformanceResults.vue'; import ConformanceResults from '@/components/Discover/Conformance/ConformanceResults.vue';
import ConformanceSidebar from '@/components/Discover/Conformance/ConformanceSidebar.vue'; import ConformanceSidebar from '@/components/Discover/Conformance/ConformanceSidebar.vue';
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { conformanceLogId, conformanceFilterId, conformanceLogCreateCheckId, conformanceFilterCreateCheckId, const { conformanceLogId, conformanceFilterId, conformanceLogCreateCheckId, conformanceFilterCreateCheckId,
conformanceLogTempCheckId, conformanceFilterTempCheckId, selectedRuleType, selectedActivitySequence, conformanceLogTempCheckId, conformanceFilterTempCheckId, selectedRuleType, selectedActivitySequence,
@@ -90,7 +90,7 @@ export default {
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
const isCheckPage = to.name.includes('Check'); const isCheckPage = to.name.includes('Check');
if (isCheckPage) { if (isCheckPage) {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
// Save token in Headers. // Save token in Headers.
// (?:^|.;\s)：匹配 "luciaToken" 之前的內容，允許它在字符串開頭或某個分號之後。 // (?:^|.;\s)：匹配 "luciaToken" 之前的內容，允許它在字符串開頭或某個分號之後。
// luciaToken\s=\s**：匹配 "luciaToken="，並忽略兩邊的空格。 // luciaToken\s=\s**：匹配 "luciaToken="，並忽略兩邊的空格。

20
src/views/Discover/Map/Map.vue
View File

@@ -64,12 +64,12 @@
import { onBeforeMount, computed, } from 'vue'; import { onBeforeMount, computed, } from 'vue';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import cytoscapeMap from '@/module/cytoscapeMap.js'; import cytoscapeMap from '@/module/cytoscapeMap.js';
import CytoscapeStore from '@/stores/cytoscapeStore'; import { useCytoscapeStore } from '@/stores/cytoscapeStore';
import MapPathStore from '@/stores/mapPathStore'; import { useMapPathStore } from '@/stores/mapPathStore';
import SidebarView from '@/components/Discover/Map/SidebarView.vue'; import SidebarView from '@/components/Discover/Map/SidebarView.vue';
import SidebarState from '@/components/Discover/Map/SidebarState.vue'; import SidebarState from '@/components/Discover/Map/SidebarState.vue';
import SidebarTraces from '@/components/Discover/Map/SidebarTraces.vue'; import SidebarTraces from '@/components/Discover/Map/SidebarTraces.vue';
@@ -83,8 +83,8 @@ const ImgCapsules = [ImgCapsule1, ImgCapsule2, ImgCapsule3, ImgCapsule4];
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const route = useRoute(); const route = useRoute();
const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId, const { processMap, bpmn, stats, insights, traceId, traces, baseTraces, baseTraceId,
@@ -93,7 +93,7 @@ export default {
postRuleData postRuleData
} = storeToRefs(allMapDataStore); } = storeToRefs(allMapDataStore);
const cytoscapeStore = CytoscapeStore(); const cytoscapeStore = useCytoscapeStore();
const { setCurrentGraphId } = cytoscapeStore; const { setCurrentGraphId } = cytoscapeStore;
@@ -151,7 +151,7 @@ export default {
cytoscapeGraph: null, cytoscapeGraph: null,
curveStyle: 'unbundled-bezier', // unbundled-bezier | taxi curveStyle: 'unbundled-bezier', // unbundled-bezier | taxi
mapType: 'processMap', // processMap | bpmn mapType: 'processMap', // processMap | bpmn
mapPathStore: MapPathStore(), mapPathStore: useMapPathStore(),
dataLayerType: 'freq', // freq | duration dataLayerType: 'freq', // freq | duration
dataLayerOption: 'total', dataLayerOption: 'total',
rank: 'LR', // 直向 TB | 橫向 LR rank: 'LR', // 直向 TB | 橫向 LR
@@ -534,7 +534,7 @@ export default {
const isCheckPage = to.name.includes('Check'); const isCheckPage = to.name.includes('Check');
if (isCheckPage) { if (isCheckPage) {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
switch (to.params.type) { switch (to.params.type) {
case 'log': case 'log':
conformanceStore.conformanceLogCreateCheckId = to.params.fileId; conformanceStore.conformanceLogCreateCheckId = to.params.fileId;

14
src/views/Discover/Performance/index.vue
View File

@@ -138,9 +138,9 @@
<script> <script>
import { storeToRefs, mapActions, } from 'pinia'; import { storeToRefs, mapActions, } from 'pinia';
import moment from 'moment'; import moment from 'moment';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import PerformanceStore from '@/stores/performance.js'; import { usePerformanceStore } from '@/stores/performance.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import StatusBar from '@/components/Discover/StatusBar.vue'; import StatusBar from '@/components/Discover/StatusBar.vue';
import { setLineChartData } from '@/module/setChartData.js'; import { setLineChartData } from '@/module/setChartData.js';
import { simpleTimeLabel, followTimeLabel, import { simpleTimeLabel, followTimeLabel,
@@ -156,8 +156,8 @@ const primeVueTicksLimit = PRIME_VUE_TICKS_LIMIT;
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const performanceStore = PerformanceStore(); const performanceStore = usePerformanceStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { performanceData } = storeToRefs(performanceStore); const { performanceData } = storeToRefs(performanceStore);
@@ -864,7 +864,7 @@ export default {
return [primeVueSetData, primeVueSetOption] return [primeVueSetData, primeVueSetOption]
}, },
...mapActions(PerformanceStore, [ ...mapActions(usePerformanceStore, [
'setFreqChartData', 'setFreqChartData',
'setFreqChartOptions', 'setFreqChartOptions',
'setFreqChartXData' 'setFreqChartXData'
@@ -918,7 +918,7 @@ export default {
const isCheckPage = to.name.includes('Check'); const isCheckPage = to.name.includes('Check');
if (isCheckPage) { if (isCheckPage) {
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
switch (to.params.type) { switch (to.params.type) {
case 'log': case 'log':
conformanceStore.conformanceLogCreateCheckId = to.params.fileId; conformanceStore.conformanceLogCreateCheckId = to.params.fileId;

24
src/views/Files/Files.vue
View File

@@ -222,12 +222,12 @@
</template> </template>
<script> <script>
import { storeToRefs, mapActions, } from 'pinia'; import { storeToRefs, mapActions, } from 'pinia';
import MapCompareStore from '@/stores/mapCompareStore'; import { useMapCompareStore } from '@/stores/mapCompareStore';
import LoginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import filesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import PageAdmin from '@/stores/pageAdmin.js'; import { usePageAdminStore } from '@/stores/pageAdmin.js';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import IconDataFormat from '@/components/icons/IconDataFormat.vue'; import IconDataFormat from '@/components/icons/IconDataFormat.vue';
import IconRule from '@/components/icons/IconRule.vue'; import IconRule from '@/components/icons/IconRule.vue';
import IconsFilter from '@/components/icons/IconsFilter.vue'; import IconsFilter from '@/components/icons/IconsFilter.vue';
@@ -240,7 +240,7 @@
export default { export default {
data() { data() {
return { return {
mapCompareStore: MapCompareStore(), mapCompareStore: useMapCompareStore(),
isActive: null, isActive: null,
isHover: null, isHover: null,
switchListOrGrid: false, switchListOrGrid: false,
@@ -286,10 +286,10 @@
} }
}, },
setup() { setup() {
const loginStore = LoginStore(); const loginStore = useLoginStore();
const store = filesStore(); const store = useFilesStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const { dependentsData, filesTag } = storeToRefs(store); const { dependentsData, filesTag } = storeToRefs(store);
const { createFilterId, baseLogId } = storeToRefs(allMapDataStore); const { createFilterId, baseLogId } = storeToRefs(allMapDataStore);
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
@@ -605,7 +605,7 @@
} }
}, },
...mapActions( ...mapActions(
PageAdmin, ['setCurrentMapFile',], usePageAdminStore, ['setCurrentMapFile',],
) )
}, },
mounted() { mounted() {

6
src/views/Login/Login.vue
View File

@@ -49,7 +49,7 @@
<script> <script>
import { ref, } from 'vue'; import { ref, } from 'vue';
import { storeToRefs, mapActions } from 'pinia'; import { storeToRefs, mapActions } from 'pinia';
import loginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
import IconMember from '@/components/icons/IconMember.vue'; import IconMember from '@/components/icons/IconMember.vue';
import IconLockKey from '@/components/icons/IconLockKey.vue'; import IconLockKey from '@/components/icons/IconLockKey.vue';
import IconEyeOpen from '@/components/icons/IconEyeOpen.vue'; import IconEyeOpen from '@/components/icons/IconEyeOpen.vue';
@@ -65,7 +65,7 @@ export default {
}, },
setup() { setup() {
// 調用函數，獲取 Store // 調用函數，獲取 Store
const store = loginStore(); const store = useLoginStore();
// 調用 store 裡的 state // 調用 store 裡的 state
const { auth, isInvalid } = storeToRefs(store); const { auth, isInvalid } = storeToRefs(store);
// 調用 store 裡的 action // 調用 store 裡的 action
@@ -109,7 +109,7 @@ export default {
}, },
onInputPwdFocus(){ onInputPwdFocus(){
}, },
...mapActions(loginStore, ['setRememberedReturnToUrl']), ...mapActions(useLoginStore, ['setRememberedReturnToUrl']),
}, },
created() { created() {
// 考慮到使用者可能在未登入的情況下貼入一個頁面網址連結過來瀏覽器 // 考慮到使用者可能在未登入的情況下貼入一個頁面網址連結過來瀏覽器

28
src/views/MainContainer.vue
View File

@@ -14,25 +14,25 @@
import { onBeforeMount, } from 'vue'; import { onBeforeMount, } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { storeToRefs, mapActions, mapState, } from 'pinia'; import { storeToRefs, mapActions, mapState, } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import AllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
import ConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
import Header from "@/components/Header.vue"; import Header from "@/components/Header.vue";
import Navbar from "@/components/Navbar.vue"; import Navbar from "@/components/Navbar.vue";
import Loading from '@/components/Loading.vue'; import Loading from '@/components/Loading.vue';
import { leaveFilter, leaveConformance } from '@/module/alertModal.js'; import { leaveFilter, leaveConformance } from '@/module/alertModal.js';
import PageAdminStore from '@/stores/pageAdmin.js'; import { usePageAdminStore } from '@/stores/pageAdmin.js';
import LoginStore from "@/stores/login"; import { useLoginStore } from "@/stores/login";
import { getCookie, setCookie } from "@/utils/cookieUtil.js"; import { getCookie, setCookie } from "@/utils/cookieUtil.js";
import ModalContainer from './AccountManagement/ModalContainer.vue'; import ModalContainer from './AccountManagement/ModalContainer.vue';
export default { export default {
name: 'MainContainer', name: 'MainContainer',
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const allMapDataStore = AllMapDataStore(); const allMapDataStore = useAllMapDataStore();
const conformanceStore = ConformanceStore(); const conformanceStore = useConformanceStore();
const pageAdminStore = PageAdminStore(); const pageAdminStore = usePageAdminStore();
const { tempFilterId, createFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore); const { tempFilterId, createFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore);
const { conformanceLogTempCheckId, conformanceFilterTempCheckId } = storeToRefs(conformanceStore); const { conformanceLogTempCheckId, conformanceFilterTempCheckId } = storeToRefs(conformanceStore);
const router = useRouter(); const router = useRouter();
@@ -65,23 +65,23 @@ export default {
ModalContainer, ModalContainer,
}, },
computed: { computed: {
...mapState(PageAdminStore, [ ...mapState(usePageAdminStore, [
'shouldKeepPreviousPage', 'shouldKeepPreviousPage',
'activePageComputedByRoute' 'activePageComputedByRoute'
]), ]),
...mapState(LoginStore, [ ...mapState(useLoginStore, [
'isLoggedIn', 'isLoggedIn',
'auth', 'auth',
]) ])
}, },
methods: { methods: {
...mapActions(PageAdminStore, [ ...mapActions(usePageAdminStore, [
'copyPendingPageToActivePage', 'copyPendingPageToActivePage',
'setPreviousPage', 'setPreviousPage',
'clearShouldKeepPreviousPageBoolean', 'clearShouldKeepPreviousPageBoolean',
'setActivePageComputedByRoute', 'setActivePageComputedByRoute',
],), ],),
...mapActions(LoginStore, [ ...mapActions(useLoginStore, [
'refreshToken', 'refreshToken',
],), ],),
}, },
@@ -100,7 +100,7 @@ export default {
// } // }
// } // }
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
const loginStore = LoginStore(); const loginStore = useLoginStore();
if (!getCookie("isLuciaLoggedIn")) { //這裡不要用pinia的isLoggedIn來檢查，因為會有重新整理時撈不到Persisted value的值的bug if (!getCookie("isLuciaLoggedIn")) { //這裡不要用pinia的isLoggedIn來檢查，因為會有重新整理時撈不到Persisted value的值的bug
if (getCookie('luciaRefreshToken')) { if (getCookie('luciaRefreshToken')) {

4
src/views/MemberArea/index.vue
View File

@@ -12,11 +12,11 @@
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import loginStore from '@/stores/login'; import { useLoginStore } from '@/stores/login';
export default { export default {
setup() { setup() {
const store = loginStore(); const store = useLoginStore();
const { userData } = storeToRefs(store); const { userData } = storeToRefs(store);
const { getUserData } = store; const { getUserData } = store;

8
src/views/Upload/index.vue
View File

@@ -79,14 +79,14 @@
</template> </template>
<script> <script>
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import LoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
import FilesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
import { uploadFailedFirst, uploadSuccess, uploadConfirm } from '@/module/alertModal.js' import { uploadFailedFirst, uploadSuccess, uploadConfirm } from '@/module/alertModal.js'
export default { export default {
setup() { setup() {
const loadingStore = LoadingStore(); const loadingStore = useLoadingStore();
const filesStore = FilesStore(); const filesStore = useFilesStore();
const { isLoading } = storeToRefs(loadingStore); const { isLoading } = storeToRefs(loadingStore);
const { uploadDetail, uploadId, uploadFileName } = storeToRefs(filesStore); const { uploadDetail, uploadId, uploadFileName } = storeToRefs(filesStore);

10
tests/components/Login.test.js
View File

@@ -7,7 +7,7 @@ vi.mock('@/module/apiError.js', () => ({
})); }));
import Login from '@/views/Login/Login.vue'; import Login from '@/views/Login/Login.vue';
import loginStore from '@/stores/login.ts'; import { useLoginStore } from '@/stores/login.ts';
describe('Login', () => { describe('Login', () => {
let pinia; let pinia;
@@ -46,7 +46,7 @@ describe('Login', () => {
it('enables login button when both fields have values', async () => { it('enables login button when both fields have values', async () => {
const wrapper = mountLogin(); const wrapper = mountLogin();
const store = loginStore(); const store = useLoginStore();
store.auth.username = 'user'; store.auth.username = 'user';
store.auth.password = 'pass'; store.auth.password = 'pass';
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
@@ -56,7 +56,7 @@ describe('Login', () => {
it('shows error message when isInvalid', async () => { it('shows error message when isInvalid', async () => {
const wrapper = mountLogin(); const wrapper = mountLogin();
const store = loginStore(); const store = useLoginStore();
store.isInvalid = true; store.isInvalid = true;
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
expect(wrapper.text()).toContain('Incorrect account or password'); expect(wrapper.text()).toContain('Incorrect account or password');
@@ -64,7 +64,7 @@ describe('Login', () => {
it('toggles password visibility', async () => { it('toggles password visibility', async () => {
const wrapper = mountLogin(); const wrapper = mountLogin();
const store = loginStore(); const store = useLoginStore();
store.auth.password = 'secret'; store.auth.password = 'secret';
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
@@ -86,7 +86,7 @@ describe('Login', () => {
const wrapper = mountLogin({ const wrapper = mountLogin({
route: { query: { 'return-to': 'encodedUrl' } }, route: { query: { 'return-to': 'encodedUrl' } },
}); });
const store = loginStore(); const store = useLoginStore();
expect(store.rememberedReturnToUrl).toBe('encodedUrl'); expect(store.rememberedReturnToUrl).toBe('encodedUrl');
}); });
}); });

4
tests/stores/acctMgmt.test.js
View File

@@ -16,7 +16,7 @@ vi.mock('@/api/client.js', () => ({
vi.mock('@/stores/login.ts', () => { vi.mock('@/stores/login.ts', () => {
const { defineStore } = require('pinia'); const { defineStore } = require('pinia');
return { return {
default: defineStore('loginStore', { useLoginStore: defineStore('loginStore', {
state: () => ({ state: () => ({
userData: { username: 'currentUser', name: 'Current' }, userData: { username: 'currentUser', name: 'Current' },
}), }),
@@ -27,7 +27,7 @@ vi.mock('@/stores/login.ts', () => {
}; };
}); });
import useAcctMgmtStore from '@/stores/acctMgmt.ts'; import { useAcctMgmtStore } from '@/stores/acctMgmt.ts';
describe('acctMgmtStore', () => { describe('acctMgmtStore', () => {
let store; let store;

2
tests/stores/allMapData.test.js
View File

@@ -12,7 +12,7 @@ vi.mock('@/api/client.js', () => ({
default: { get: mockGet, post: mockPost, put: mockPut }, default: { get: mockGet, post: mockPost, put: mockPut },
})); }));
import useAllMapDataStore from '@/stores/allMapData.js'; import { useAllMapDataStore } from '@/stores/allMapData.js';
describe('allMapDataStore', () => { describe('allMapDataStore', () => {
let store; let store;

2
tests/stores/compare.test.js
View File

@@ -10,7 +10,7 @@ vi.mock('@/api/client.js', () => ({
default: { get: mockGet }, default: { get: mockGet },
})); }));
import useCompareStore from '@/stores/compare.js'; import { useCompareStore } from '@/stores/compare.js';
describe('compareStore', () => { describe('compareStore', () => {
let store; let store;

2
tests/stores/conformance.test.js
View File

@@ -13,7 +13,7 @@ vi.mock('@/api/client.js', () => ({
})); }));
import apiError from '@/module/apiError.js'; import apiError from '@/module/apiError.js';
import useConformanceStore from '@/stores/conformance.js'; import { useConformanceStore } from '@/stores/conformance.js';
describe('conformanceStore', () => { describe('conformanceStore', () => {
let store; let store;

2
tests/stores/conformanceInput.test.js
View File

@@ -1,6 +1,6 @@
import { describe, it, expect, beforeEach } from 'vitest'; import { describe, it, expect, beforeEach } from 'vitest';
import { setActivePinia, createPinia } from 'pinia'; import { setActivePinia, createPinia } from 'pinia';
import useConformanceInputStore from '@/stores/conformanceInput.js'; import { useConformanceInputStore } from '@/stores/conformanceInput.js';
describe('conformanceInputStore', () => { describe('conformanceInputStore', () => {
let store; let store;

2
tests/stores/cytoscapeStore.test.js
View File

@@ -1,6 +1,6 @@
import { describe, it, expect, beforeEach, vi } from 'vitest'; import { describe, it, expect, beforeEach, vi } from 'vitest';
import { setActivePinia, createPinia } from 'pinia'; import { setActivePinia, createPinia } from 'pinia';
import useCytoscapeStore from '@/stores/cytoscapeStore.ts'; import { useCytoscapeStore } from '@/stores/cytoscapeStore.ts';
import { SAVE_KEY_NAME } from '@/constants/constants.js'; import { SAVE_KEY_NAME } from '@/constants/constants.js';
// Mock localStorage since jsdom's localStorage is limited // Mock localStorage since jsdom's localStorage is limited

2
tests/stores/files.test.js
View File

@@ -28,7 +28,7 @@ vi.mock('@/api/client.js', () => ({
default: { get: mockGet, post: mockPost, put: mockPut, delete: mockDelete }, default: { get: mockGet, post: mockPost, put: mockPut, delete: mockDelete },
})); }));
import useFilesStore from '@/stores/files.js'; import { useFilesStore } from '@/stores/files.js';
describe('filesStore', () => { describe('filesStore', () => {
let store; let store;

2
tests/stores/loading.test.js
View File

@@ -1,6 +1,6 @@
import { describe, it, expect, beforeEach } from 'vitest'; import { describe, it, expect, beforeEach } from 'vitest';
import { setActivePinia, createPinia } from 'pinia'; import { setActivePinia, createPinia } from 'pinia';
import useLoadingStore from '@/stores/loading.js'; import { useLoadingStore } from '@/stores/loading.js';
describe('loadingStore', () => { describe('loadingStore', () => {
let store; let store;

2
tests/stores/login.test.js
View File

@@ -13,7 +13,7 @@ vi.mock('@/api/client.js', () => ({
default: { get: mockClientGet }, default: { get: mockClientGet },
})); }));
import useLoginStore from '@/stores/login.ts'; import { useLoginStore } from '@/stores/login.ts';
// Mock axios methods (used for signIn/refreshToken which call plain axios) // Mock axios methods (used for signIn/refreshToken which call plain axios)
vi.spyOn(axios, 'post').mockImplementation(vi.fn()); vi.spyOn(axios, 'post').mockImplementation(vi.fn());

2
tests/stores/mapCompareStore.test.js
View File

@@ -1,6 +1,6 @@
import { describe, it, expect, beforeEach } from 'vitest'; import { describe, it, expect, beforeEach } from 'vitest';
import { setActivePinia, createPinia } from 'pinia'; import { setActivePinia, createPinia } from 'pinia';
import useMapCompareStore from '@/stores/mapCompareStore.ts'; import { useMapCompareStore } from '@/stores/mapCompareStore.ts';
describe('mapCompareStore', () => { describe('mapCompareStore', () => {
let store; let store;

2
tests/stores/mapPathStore.test.js
View File

@@ -16,7 +16,7 @@ vi.mock('@/assets/capsule2.svg', () => ({ default: 'cap2' }));
vi.mock('@/assets/capsule3.svg', () => ({ default: 'cap3' })); vi.mock('@/assets/capsule3.svg', () => ({ default: 'cap3' }));
vi.mock('@/assets/capsule4.svg', () => ({ default: 'cap4' })); vi.mock('@/assets/capsule4.svg', () => ({ default: 'cap4' }));
import useMapPathStore from '@/stores/mapPathStore.ts'; import { useMapPathStore } from '@/stores/mapPathStore.ts';
/** /**
* Creates a mock Cytoscape node. * Creates a mock Cytoscape node.

2
tests/stores/pageAdmin.test.js
View File

@@ -1,6 +1,6 @@
import { describe, it, expect, beforeEach } from 'vitest'; import { describe, it, expect, beforeEach } from 'vitest';
import { setActivePinia, createPinia } from 'pinia'; import { setActivePinia, createPinia } from 'pinia';
import usePageAdminStore from '@/stores/pageAdmin.js'; import { usePageAdminStore } from '@/stores/pageAdmin.js';
describe('pageAdminStore', () => { describe('pageAdminStore', () => {
let store; let store;

2
tests/stores/performance.test.js
View File

@@ -10,7 +10,7 @@ vi.mock('@/api/client.js', () => ({
default: { get: mockGet }, default: { get: mockGet },
})); }));
import usePerformanceStore from '@/stores/performance.js'; import { usePerformanceStore } from '@/stores/performance.js';
describe('performanceStore', () => { describe('performanceStore', () => {
let store; let store;

12
tests/views/MainContainerGuard.test.js
View File

@@ -3,16 +3,16 @@ import { setActivePinia, createPinia } from 'pinia';
// Mock all heavy imports that MainContainer.vue pulls in // Mock all heavy imports that MainContainer.vue pulls in
vi.mock('@/stores/loading.js', () => ({ vi.mock('@/stores/loading.js', () => ({
default: () => ({ isLoading: false }), useLoadingStore: () => ({ isLoading: false }),
})); }));
vi.mock('@/stores/allMapData.js', () => ({ vi.mock('@/stores/allMapData.js', () => ({
default: () => ({}), useAllMapDataStore: () => ({}),
})); }));
vi.mock('@/stores/conformance.js', () => ({ vi.mock('@/stores/conformance.js', () => ({
default: () => ({}), useConformanceStore: () => ({}),
})); }));
vi.mock('@/stores/pageAdmin.js', () => ({ vi.mock('@/stores/pageAdmin.js', () => ({
default: () => ({}), usePageAdminStore: () => ({}),
})); }));
vi.mock('@/module/alertModal.js', () => ({ vi.mock('@/module/alertModal.js', () => ({
leaveFilter: vi.fn(), leaveFilter: vi.fn(),
@@ -26,7 +26,7 @@ vi.mock('@/router/index.ts', () => ({
})); }));
vi.mock('@/module/cytoscapeMap.js', () => ({})); vi.mock('@/module/cytoscapeMap.js', () => ({}));
import LoginStore from '@/stores/login.ts'; import { useLoginStore } from '@/stores/login.ts';
import * as cookieUtil from '@/utils/cookieUtil.js'; import * as cookieUtil from '@/utils/cookieUtil.js';
// Import the component definition to access beforeRouteEnter // Import the component definition to access beforeRouteEnter
@@ -38,7 +38,7 @@ describe('MainContainer beforeRouteEnter', () => {
beforeEach(() => { beforeEach(() => {
setActivePinia(createPinia()); setActivePinia(createPinia());
loginStore = LoginStore(); loginStore = useLoginStore();
loginStore.$router = { push: vi.fn() }; loginStore.$router = { push: vi.fn() };
next = vi.fn(); next = vi.fn();
vi.clearAllMocks(); vi.clearAllMocks();