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

2
eslint.config.mjs
View File

@@ -117,7 +117,7 @@ export default [
files: ["src/**/*.vue", "src/views/**/*.vue", "src/components/**/*.vue"], files: ["src/**/*.vue", "src/views/**/*.vue", "src/components/**/*.vue"],
rules: { rules: {
"vue/multi-word-component-names": "off", "vue/multi-word-component-names": "off",
"vue/no-side-effects-in-computed-properties": "off", "vue/no-side-effects-in-computed-properties": "error",
"vue/return-in-computed-property": "error", "vue/return-in-computed-property": "error",
"vue/no-parsing-error": "error", "vue/no-parsing-error": "error",
"vue/valid-v-else": "error", "vue/valid-v-else": "error",

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

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

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

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

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

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

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

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