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

Enable vue/no-side-effects-in-computed-properties and refactor computed state sync

Browse Source 
Co-Authored-By: Codex <codex@openai.com>
This commit is contained in:
依瑪貓
2026-03-08 12:45:39 +08:00
parent c88646eba3
commit d03041c2e3
6 changed files with 38 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -96,7 +96,7 @@
type="button"
class="btn btn-sm"
@click="submitConformance"
:class="isMainBtnDisabled ? 'btn-disable' : 'btn-neutral'"
:class="isApplyBtnDisabled ? 'btn-disable' : 'btn-neutral'"
:disabled="isApplyBtnDisabled"
>
{{ i18next.t("Global.Apply") }}
@@ -208,7 +208,6 @@ const {
const { activityRadioData } = storeToRefs(conformanceInputStore);
// data
const isMainBtnDisabled = ref(true);
const isShowBarOpen = ref(false);
const selectConformanceTask = ref(null);
const selectConformanceStartAndEnd = ref(null); // Activity sequence
@@ -386,8 +385,7 @@ const isApplyBtnDisabled = computed(() => {
break;
}
isMainBtnDisabled.value = disabledBool;
return isMainBtnDisabled.value;
return disabledBool;
});
// watch

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

@@ -433,17 +433,15 @@ const taskEnd = ref(null);
// Activity sequence
const cfmSeqStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataSeq.task;
const selectedTask = task.value ?? props.isSubmitShowDataSeq?.task ?? null;
return isEndSelected.value
? setSeqStartAndEndData(cfmSeqEnd.value, "sources", task.value)
? setSeqStartAndEndData(cfmSeqEnd.value, "sources", selectedTask)
: cfmSeqStart.value.map((i) => i.label);
});
const cfmSeqEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataSeq.task;
const selectedTask = task.value ?? props.isSubmitShowDataSeq?.task ?? null;
return isStartSelected.value
? setSeqStartAndEndData(cfmSeqStart.value, "sinks", task.value)
? setSeqStartAndEndData(cfmSeqStart.value, "sinks", selectedTask)
: cfmSeqEnd.value.map((i) => i.label);
});
// Processing time
@@ -454,17 +452,15 @@ const cfmPtEteEndData = computed(() => {
return cfmPtEteEnd.value.map((i) => i.task);
});
const cfmPtEteSEStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataPtEte.task;
const selectedTask = task.value ?? props.isSubmitShowDataPtEte?.task ?? null;
return isEndSelected.value
? setStartAndEndData(cfmPtEteSE.value, "end", task.value)
? setStartAndEndData(cfmPtEteSE.value, "end", selectedTask)
: setTaskData(cfmPtEteSE.value, "start");
});
const cfmPtEteSEEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataPtEte.task;
const selectedTask = task.value ?? props.isSubmitShowDataPtEte?.task ?? null;
return isStartSelected.value
? setStartAndEndData(cfmPtEteSE.value, "start", task.value)
? setStartAndEndData(cfmPtEteSE.value, "start", selectedTask)
: setTaskData(cfmPtEteSE.value, "end");
});
const cfmPtPStartData = computed(() => {
@@ -474,17 +470,15 @@ const cfmPtPEndData = computed(() => {
return cfmPtPEnd.value.map((i) => i.task);
});
const cfmPtPSEStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataPtP.task;
const selectedTask = task.value ?? props.isSubmitShowDataPtP?.task ?? null;
return isEndSelected.value
? setStartAndEndData(cfmPtPSE.value, "end", task.value)
? setStartAndEndData(cfmPtPSE.value, "end", selectedTask)
: setTaskData(cfmPtPSE.value, "start");
});
const cfmPtPSEEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataPtP.task;
const selectedTask = task.value ?? props.isSubmitShowDataPtP?.task ?? null;
return isStartSelected.value
? setStartAndEndData(cfmPtPSE.value, "start", task.value)
? setStartAndEndData(cfmPtPSE.value, "start", selectedTask)
: setTaskData(cfmPtPSE.value, "end");
});
// Waiting time
@@ -495,17 +489,15 @@ const cfmWtEteEndData = computed(() => {
return cfmWtEteEnd.value.map((i) => i.task);
});
const cfmWtEteSEStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataWtEte.task;
const selectedTask = task.value ?? props.isSubmitShowDataWtEte?.task ?? null;
return isEndSelected.value
? setStartAndEndData(cfmWtEteSE.value, "end", task.value)
? setStartAndEndData(cfmWtEteSE.value, "end", selectedTask)
: setTaskData(cfmWtEteSE.value, "start");
});
const cfmWtEteSEEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataWtEte.task;
const selectedTask = task.value ?? props.isSubmitShowDataWtEte?.task ?? null;
return isStartSelected.value
? setStartAndEndData(cfmWtEteSE.value, "start", task.value)
? setStartAndEndData(cfmWtEteSE.value, "start", selectedTask)
: setTaskData(cfmWtEteSE.value, "end");
});
const cfmWtPStartData = computed(() => {
@@ -515,17 +507,15 @@ const cfmWtPEndData = computed(() => {
return cfmWtPEnd.value.map((i) => i.task);
});
const cfmWtPSEStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataWtP.task;
const selectedTask = task.value ?? props.isSubmitShowDataWtP?.task ?? null;
return isEndSelected.value
? setStartAndEndData(cfmWtPSE.value, "end", task.value)
? setStartAndEndData(cfmWtPSE.value, "end", selectedTask)
: setTaskData(cfmWtPSE.value, "start");
});
const cfmWtPSEEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataWtP.task;
const selectedTask = task.value ?? props.isSubmitShowDataWtP?.task ?? null;
return isStartSelected.value
? setStartAndEndData(cfmWtPSE.value, "start", task.value)
? setStartAndEndData(cfmWtPSE.value, "start", selectedTask)
: setTaskData(cfmWtPSE.value, "end");
});
// Cycle time
@@ -536,17 +526,15 @@ const cfmCtEteEndData = computed(() => {
return cfmCtEteEnd.value.map((i) => i.task);
});
const cfmCtEteSEStartData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataCt.task;
const selectedTask = task.value ?? props.isSubmitShowDataCt?.task ?? null;
return isEndSelected.value
? setStartAndEndData(cfmCtEteSE.value, "end", task.value)
? setStartAndEndData(cfmCtEteSE.value, "end", selectedTask)
: setTaskData(cfmCtEteSE.value, "start");
});
const cfmCtEteSEEndData = computed(() => {
if (props.isSubmit && task.value === null)
task.value = props.isSubmitShowDataCt.task;
const selectedTask = task.value ?? props.isSubmitShowDataCt?.task ?? null;
return isStartSelected.value
? setStartAndEndData(cfmCtEteSE.value, "start", task.value)
? setStartAndEndData(cfmCtEteSE.value, "start", selectedTask)
: setTaskData(cfmCtEteSE.value, "end");
});

3
src/components/Discover/Map/Filter/ActAndSeq.vue
View File

@@ -171,11 +171,10 @@ const lastItemIndex = ref(null);
const data = computed(() => {
// Sort the Activity List
filteredData.value = filteredData.value.sort((x, y) => {
return [...filteredData.value].sort((x, y) => {
const diff = y.occurrences - x.occurrences;
return diff !== 0 ? diff : sortNumEngZhtwForFilter(x.label, y.label);
});
return filteredData.value;
});
watch(

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

@@ -103,13 +103,21 @@ const panelProps = ref({
// user select time start and end
const timeFrameStartEnd = computed(() => {
if (!startTime.value || !endTime.value) {
return [];
}
const start = getMoment(startTime.value).format("YYYY-MM-DDTHH:mm:00");
const end = getMoment(endTime.value).format("YYYY-MM-DDTHH:mm:00");
selectTimeFrame.value = [start, end]; // Data to send to the backend
return [start, end];
});
watch(timeFrameStartEnd, (newValue) => {
if (newValue.length === 2) {
selectTimeFrame.value = newValue; // Data to send to the backend
}
});
// Compute slider data; time format: millisecond timestamps
const sliderData = computed(() => {
const xAxisMin = new Date(filterTimeframe.value.x_axis.min).getTime();
@@ -348,8 +356,6 @@ function changeSelectArea(e) {
startMaxDate.value = new Date(end);
// Recalculate the chart mask
resizeMask(chart.value);
// Execute timeFrameStartEnd to update the data
timeFrameStartEnd.value;
}
/**
@@ -400,6 +406,5 @@ onMounted(() => {
// Set the calendar range to match the timeline range
startTime.value = startMinDate.value;
endTime.value = startMaxDate.value;
timeFrameStartEnd.value;
});
</script>

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

@@ -260,7 +260,7 @@
class="btn btn-sm"
@click="submit"
:disabled="isDisabledButton"
:class="isDisabled ? 'btn-disable' : 'btn-neutral'"
:class="isDisabledButton ? 'btn-disable' : 'btn-neutral'"
>
Apply
</button>
@@ -356,7 +356,6 @@ const isEndSelected = ref(null);
const isActAllTask = ref(true);
const rowData = ref([]);
const selectTraceArea = ref([]); // Trace slider
const isDisabled = ref(true); // Apply Button disabled setting
const filterTraceViewRef = ref(null);
const tooltip = {
containment: {
@@ -426,7 +425,6 @@ const isDisabledButton = computed(() => {
disabled = handleTimeframesSelection();
}
isDisabled.value = disabled;
return disabled;
});