Migrate all Vue components from Options API to <script setup>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,377 +1,384 @@
|
||||
<template>
|
||||
<div class="mt-2 mb-12" v-if="selectedRuleType === 'Activity duration' || selectedRuleType === 'Waiting time'
|
||||
<div class="mt-2 mb-12" v-if="selectedRuleType === 'Activity duration' || selectedRuleType === 'Waiting time'
|
||||
|| selectedRuleType === 'Processing time' || selectedRuleType === 'Cycle time'">
|
||||
<p class="h2">Time Range</p>
|
||||
<div class=" text-sm leading-normal">
|
||||
<!-- Activity duration -->
|
||||
<TimeRangeDuration
|
||||
v-if="selectedRuleType === 'Activity duration'" :time="timeDuration" :select="isSubmitDurationTime" @min-total-seconds="minTotalSeconds"
|
||||
v-if="selectedRuleType === 'Activity duration'" :time="state.timeDuration" :select="isSubmitDurationTime" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<!-- Processing time -->
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="timeCfmPtEteAll" :select="isSubmitTimeCfmPtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="state.timeCfmPtEteAll" :select="isSubmitTimeCfmPtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="timeCfmPtEteStart" :select="isSubmitTimeCfmPtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="state.timeCfmPtEteStart" :select="isSubmitTimeCfmPtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="timeCfmPtEteEnd" :select="isSubmitTimeCfmPtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="state.timeCfmPtEteEnd" :select="isSubmitTimeCfmPtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="timeCfmPtEteSE" :select="isSubmitTimeCfmPtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="state.timeCfmPtEteSE" :select="isSubmitTimeCfmPtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From'" :time="timeCfmPtPStart" :select="isSubmitTimeCfmPtPStart" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From'" :time="state.timeCfmPtPStart" :select="isSubmitTimeCfmPtPStart" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'To'" :time="timeCfmPtPEnd" :select="isSubmitTimeCfmPtPEnd" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'To'" :time="state.timeCfmPtPEnd" :select="isSubmitTimeCfmPtPEnd" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From & To'" :time="timeCfmPtPSE" :select="isSubmitTimeCfmPtPSE" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Processing time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From & To'" :time="state.timeCfmPtPSE" :select="isSubmitTimeCfmPtPSE" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<!-- Waiting time -->
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="timeCfmWtEteAll" :select="isSubmitTimeCfmWtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="state.timeCfmWtEteAll" :select="isSubmitTimeCfmWtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="timeCfmWtEteStart" :select="isSubmitTimeCfmWtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="state.timeCfmWtEteStart" :select="isSubmitTimeCfmWtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="timeCfmWtEteEnd" :select="isSubmitTimeCfmWtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="state.timeCfmWtEteEnd" :select="isSubmitTimeCfmWtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="timeCfmWtEteSE" :select="isSubmitTimeCfmWtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="state.timeCfmWtEteSE" :select="isSubmitTimeCfmWtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From'" :time="timeCfmWtPStart" :select="isSubmitTimeCfmWtPStart" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From'" :time="state.timeCfmWtPStart" :select="isSubmitTimeCfmWtPStart" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'To'" :time="timeCfmWtPEnd" :select="isSubmitTimeCfmWtPEnd" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'To'" :time="state.timeCfmWtPEnd" :select="isSubmitTimeCfmWtPEnd" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From & To'" :time="timeCfmWtPSE" :select="isSubmitTimeCfmWtPSE" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Waiting time' && selectedProcessScope === 'Partial'
|
||||
&& selectedActSeqFromTo === 'From & To'" :time="state.timeCfmWtPSE" :select="isSubmitTimeCfmWtPSE" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<!-- Cycle time -->
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="timeCfmCtEteAll" :select="isSubmitTimeCfmCtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'All'" :time="state.timeCfmCtEteAll" :select="isSubmitTimeCfmCtEteAll" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="timeCfmCtEteStart" :select="isSubmitTimeCfmCtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start'" :time="state.timeCfmCtEteStart" :select="isSubmitTimeCfmCtEteStart" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="timeCfmCtEteEnd" :select="isSubmitTimeCfmCtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'End'" :time="state.timeCfmCtEteEnd" :select="isSubmitTimeCfmCtEteEnd" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="timeCfmCtEteSE" :select="isSubmitTimeCfmCtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
<TimeRangeDuration v-if="selectedRuleType === 'Cycle time' && selectedProcessScope === 'End to end'
|
||||
&& selectedActSeqMore === 'Start & End'" :time="state.timeCfmCtEteSE" :select="isSubmitTimeCfmCtEteSE" @min-total-seconds="minTotalSeconds"
|
||||
@max-total-seconds="maxTotalSeconds" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import TimeRangeDuration from '@/components/Discover/Conformance/ConformanceSidebar/TimeRangeDuration.vue';
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useConformanceStore } from '@/stores/conformance';
|
||||
import emitter from '@/utils/emitter';
|
||||
import TimeRangeDuration from '@/components/Discover/Conformance/ConformanceSidebar/TimeRangeDuration.vue';
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const conformanceStore = useConformanceStore();
|
||||
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope,
|
||||
selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, conformanceTask,
|
||||
cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, cfmPtPStart,
|
||||
cfmPtPEnd, cfmPtPSE, cfmWtEteStart, cfmWtEteEnd, cfmWtEteSE, cfmWtPStart,
|
||||
cfmWtPEnd, cfmWtPSE, cfmCtEteStart, cfmCtEteEnd, cfmCtEteSE, cfmPtEteWhole,
|
||||
cfmWtEteWhole, cfmCtEteWhole
|
||||
} = storeToRefs(conformanceStore);
|
||||
const conformanceStore = useConformanceStore();
|
||||
const { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope,
|
||||
selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, conformanceTask,
|
||||
cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, cfmPtPStart,
|
||||
cfmPtPEnd, cfmPtPSE, cfmWtEteStart, cfmWtEteEnd, cfmWtEteSE, cfmWtPStart,
|
||||
cfmWtPEnd, cfmWtPSE, cfmCtEteStart, cfmCtEteEnd, cfmCtEteSE, cfmPtEteWhole,
|
||||
cfmWtEteWhole, cfmCtEteWhole
|
||||
} = storeToRefs(conformanceStore);
|
||||
|
||||
return { selectedRuleType, selectedActivitySequence, selectedMode, selectedProcessScope,
|
||||
selectedActSeqMore, selectedActSeqFromTo, conformanceAllTasks, conformanceTask,
|
||||
cfmSeqStart, cfmSeqEnd, cfmPtEteStart, cfmPtEteEnd, cfmPtEteSE, cfmPtPStart,
|
||||
cfmPtPEnd, cfmPtPSE, cfmWtEteStart, cfmWtEteEnd, cfmWtEteSE, cfmWtPStart,
|
||||
cfmWtPEnd, cfmWtPSE, cfmCtEteStart, cfmCtEteEnd, cfmCtEteSE, cfmPtEteWhole,
|
||||
cfmWtEteWhole, cfmCtEteWhole
|
||||
};
|
||||
},
|
||||
props: ['isSubmitDurationTime', 'isSubmitTimeCfmPtEteAll', 'isSubmitTimeCfmPtEteStart',
|
||||
const props = defineProps(['isSubmitDurationTime', 'isSubmitTimeCfmPtEteAll', 'isSubmitTimeCfmPtEteStart',
|
||||
'isSubmitTimeCfmPtEteEnd', 'isSubmitTimeCfmPtEteSE', 'isSubmitTimeCfmPtPStart',
|
||||
'isSubmitTimeCfmPtPEnd', 'isSubmitTimeCfmPtPSE', 'isSubmitTimeCfmWtEteAll',
|
||||
'isSubmitTimeCfmWtEteStart', 'isSubmitTimeCfmWtEteEnd', 'isSubmitTimeCfmWtEteSE',
|
||||
'isSubmitTimeCfmWtPStart', 'isSubmitTimeCfmWtPEnd', 'isSubmitTimeCfmWtPSE', 'isSubmitTimeCfmCtEteAll',
|
||||
'isSubmitTimeCfmCtEteStart', 'isSubmitTimeCfmCtEteEnd', 'isSubmitTimeCfmCtEteSE'
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
timeDuration: null, // Activity duration
|
||||
timeCfmPtEteAll: null, // Processing time
|
||||
timeCfmPtEteAllDefault: null,
|
||||
timeCfmPtEteStart: null,
|
||||
timeCfmPtEteEnd: null,
|
||||
timeCfmPtEteSE: null,
|
||||
timeCfmPtPStart: null,
|
||||
timeCfmPtPEnd: null,
|
||||
timeCfmPtPSE: null,
|
||||
timeCfmWtEteAll: null, // Waiting time
|
||||
timeCfmWtEteAllDefault: null,
|
||||
timeCfmWtEteStart: null,
|
||||
timeCfmWtEteEnd: null,
|
||||
timeCfmWtEteSE: null,
|
||||
timeCfmWtPStart: null,
|
||||
timeCfmWtPEnd: null,
|
||||
timeCfmWtPSE: null,
|
||||
timeCfmCtEteAll: null, // Cycle time
|
||||
timeCfmCtEteAllDefault: null,
|
||||
timeCfmCtEteStart: null,
|
||||
timeCfmCtEteEnd: null,
|
||||
timeCfmCtEteSE: null,
|
||||
selectCfmPtEteSEStart: null,
|
||||
selectCfmPtEteSEEnd: null,
|
||||
selectCfmPtPSEStart: null,
|
||||
selectCfmPtPSEEnd: null,
|
||||
selectCfmWtEteSEStart: null,
|
||||
selectCfmWtEteSEEnd: null,
|
||||
selectCfmWtPSEStart: null,
|
||||
selectCfmWtPSEEnd: null,
|
||||
selectCfmCtEteSEStart: null,
|
||||
selectCfmCtEteSEEnd: null,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
TimeRangeDuration,
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* get min total seconds
|
||||
* @param {Number} e 最小值總秒數
|
||||
*/
|
||||
minTotalSeconds(e) {
|
||||
this.$emit('min-total-seconds', e);
|
||||
},
|
||||
/**
|
||||
* get min total seconds
|
||||
* @param {Number} e 最大值總秒數
|
||||
*/
|
||||
maxTotalSeconds(e) {
|
||||
this.$emit('max-total-seconds', e);
|
||||
},
|
||||
/**
|
||||
* get Time Range(duration)
|
||||
* @param {array} data API data，Activity 列表
|
||||
* @param {string} category 'act' | 'single' | 'double'，傳入以上任一值。
|
||||
* @param {string} task select Radio task or start
|
||||
* @param {string} taskTwo end
|
||||
* @returns {object} {min:12, max:345}
|
||||
*/
|
||||
getDurationTime(data, category, task, taskTwo) {
|
||||
let result = {min:0, max:0};
|
||||
switch (category) {
|
||||
case 'act':
|
||||
data.forEach(i => {
|
||||
if(i.label === task) {
|
||||
result = i.duration;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'single':
|
||||
data.forEach(i => {
|
||||
if(i.task === task) {
|
||||
result = i.time;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'double':
|
||||
data.forEach(i => {
|
||||
if(i.start === task && i.end === taskTwo) {
|
||||
result = i.time;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'all':
|
||||
result = data;
|
||||
break
|
||||
default:
|
||||
break;
|
||||
};
|
||||
return result;
|
||||
},
|
||||
/**
|
||||
* All reset
|
||||
*/
|
||||
reset() {
|
||||
this.timeDuration = null; // Activity duration
|
||||
this.timeCfmPtEteAll = this.timeCfmPtEteAllDefault; // Processing time
|
||||
this.timeCfmPtEteStart = null;
|
||||
this.timeCfmPtEteEnd = null;
|
||||
this.timeCfmPtEteSE = null;
|
||||
this.timeCfmPtPStart = null;
|
||||
this.timeCfmPtPEnd = null;
|
||||
this.timeCfmPtPSE = null;
|
||||
this.timeCfmWtEteAll = this.timeCfmWtEteAllDefault; // Waiting time
|
||||
this.timeCfmWtEteStart = null;
|
||||
this.timeCfmWtEteEnd = null;
|
||||
this.timeCfmWtEteSE = null;
|
||||
this.timeCfmWtPStart = null;
|
||||
this.timeCfmWtPEnd = null;
|
||||
this.timeCfmWtPSE = null;
|
||||
this.timeCfmCtEteAll = this.timeCfmCtEteAllDefault; // Cycle time
|
||||
this.timeCfmCtEteStart = null;
|
||||
this.timeCfmCtEteEnd = null;
|
||||
this.timeCfmCtEteSE = null;
|
||||
this.selectCfmPtEteSEStart = null;
|
||||
this.selectCfmPtEteSEEnd = null;
|
||||
this.selectCfmPtPSEStart = null;
|
||||
this.selectCfmPtPSEEnd = null;
|
||||
this.selectCfmWtEteSEStart = null;
|
||||
this.selectCfmWtEteSEEnd = null;
|
||||
this.selectCfmWtPSEStart = null;
|
||||
this.selectCfmWtPSEEnd = null;
|
||||
this.selectCfmCtEteSEStart = null;
|
||||
this.selectCfmCtEteSEEnd = null;
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.$emitter.on('actRadioData', (data) => {
|
||||
const category = data.category;
|
||||
const task = data.task;
|
||||
]);
|
||||
|
||||
const handleDoubleSelection = (startKey, endKey, timeKey, durationType) => {
|
||||
this[startKey] = task;
|
||||
this[timeKey] = { min: 0, max: 0 };
|
||||
if (this[endKey]) {
|
||||
this[timeKey] = this.getDurationTime(this[durationType], 'double', task, this[endKey]);
|
||||
}
|
||||
};
|
||||
const emit = defineEmits(['min-total-seconds', 'max-total-seconds']);
|
||||
|
||||
const handleSingleSelection = (key, timeKey, durationType) => {
|
||||
this[timeKey] = this.getDurationTime(this[durationType], 'single', task);
|
||||
};
|
||||
const state = reactive({
|
||||
timeDuration: null, // Activity duration
|
||||
timeCfmPtEteAll: null, // Processing time
|
||||
timeCfmPtEteAllDefault: null,
|
||||
timeCfmPtEteStart: null,
|
||||
timeCfmPtEteEnd: null,
|
||||
timeCfmPtEteSE: null,
|
||||
timeCfmPtPStart: null,
|
||||
timeCfmPtPEnd: null,
|
||||
timeCfmPtPSE: null,
|
||||
timeCfmWtEteAll: null, // Waiting time
|
||||
timeCfmWtEteAllDefault: null,
|
||||
timeCfmWtEteStart: null,
|
||||
timeCfmWtEteEnd: null,
|
||||
timeCfmWtEteSE: null,
|
||||
timeCfmWtPStart: null,
|
||||
timeCfmWtPEnd: null,
|
||||
timeCfmWtPSE: null,
|
||||
timeCfmCtEteAll: null, // Cycle time
|
||||
timeCfmCtEteAllDefault: null,
|
||||
timeCfmCtEteStart: null,
|
||||
timeCfmCtEteEnd: null,
|
||||
timeCfmCtEteSE: null,
|
||||
selectCfmPtEteSEStart: null,
|
||||
selectCfmPtEteSEEnd: null,
|
||||
selectCfmPtPSEStart: null,
|
||||
selectCfmPtPSEEnd: null,
|
||||
selectCfmWtEteSEStart: null,
|
||||
selectCfmWtEteSEEnd: null,
|
||||
selectCfmWtPSEStart: null,
|
||||
selectCfmWtPSEEnd: null,
|
||||
selectCfmCtEteSEStart: null,
|
||||
selectCfmCtEteSEEnd: null,
|
||||
});
|
||||
|
||||
switch (category) {
|
||||
// Activity duration
|
||||
case 'cfmDur':
|
||||
this.timeDuration = this.getDurationTime(this.conformanceAllTasks, 'act', task);
|
||||
break;
|
||||
// Processing time
|
||||
case 'cfmPtEteStart':
|
||||
handleSingleSelection('cfmPtEteStart', 'timeCfmPtEteStart', 'cfmPtEteStart');
|
||||
break;
|
||||
case 'cfmPtEteEnd':
|
||||
handleSingleSelection('cfmPtEteEnd', 'timeCfmPtEteEnd', 'cfmPtEteEnd');
|
||||
break;
|
||||
case 'cfmPtEteSEStart':
|
||||
handleDoubleSelection('selectCfmPtEteSEStart', 'selectCfmPtEteSEEnd', 'timeCfmPtEteSE', 'cfmPtEteSE');
|
||||
break;
|
||||
case 'cfmPtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmPtEteSEEnd', 'selectCfmPtEteSEStart', 'timeCfmPtEteSE', 'cfmPtEteSE');
|
||||
break;
|
||||
case 'cfmPtPStart':
|
||||
handleSingleSelection('cfmPtPStart', 'timeCfmPtPStart', 'cfmPtPStart');
|
||||
break;
|
||||
case 'cfmPtPEnd':
|
||||
handleSingleSelection('cfmPtPEnd', 'timeCfmPtPEnd', 'cfmPtPEnd');
|
||||
break;
|
||||
case 'cfmPtPSEStart':
|
||||
handleDoubleSelection('selectCfmPtPSEStart', 'selectCfmPtPSEEnd', 'timeCfmPtPSE', 'cfmPtPSE');
|
||||
break;
|
||||
case 'cfmPtPSEEnd':
|
||||
handleDoubleSelection('selectCfmPtPSEEnd', 'selectCfmPtPSEStart', 'timeCfmPtPSE', 'cfmPtPSE');
|
||||
break;
|
||||
// Waiting time
|
||||
case 'cfmWtEteStart':
|
||||
handleSingleSelection('cfmWtEteStart', 'timeCfmWtEteStart', 'cfmWtEteStart');
|
||||
break;
|
||||
case 'cfmWtEteEnd':
|
||||
handleSingleSelection('cfmWtEteEnd', 'timeCfmWtEteEnd', 'cfmWtEteEnd');
|
||||
break;
|
||||
case 'cfmWtEteSEStart':
|
||||
handleDoubleSelection('selectCfmWtEteSEStart', 'selectCfmWtEteSEEnd', 'timeCfmWtEteSE', 'cfmWtEteSE');
|
||||
break;
|
||||
case 'cfmWtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmWtEteSEEnd', 'selectCfmWtEteSEStart', 'timeCfmWtEteSE', 'cfmWtEteSE');
|
||||
break;
|
||||
case 'cfmWtPStart':
|
||||
handleSingleSelection('cfmWtPStart', 'timeCfmWtPStart', 'cfmWtPStart');
|
||||
break;
|
||||
case 'cfmWtPEnd':
|
||||
handleSingleSelection('cfmWtPEnd', 'timeCfmWtPEnd', 'cfmWtPEnd');
|
||||
break;
|
||||
case 'cfmWtPSEStart':
|
||||
handleDoubleSelection('selectCfmWtPSEStart', 'selectCfmWtPSEEnd', 'timeCfmWtPSE', 'cfmWtPSE');
|
||||
break;
|
||||
case 'cfmWtPSEEnd':
|
||||
handleDoubleSelection('selectCfmWtPSEEnd', 'selectCfmWtPSEStart', 'timeCfmWtPSE', 'cfmWtPSE');
|
||||
break;
|
||||
// Cycle time
|
||||
case 'cfmCtEteStart':
|
||||
handleSingleSelection('cfmCtEteStart', 'timeCfmCtEteStart', 'cfmCtEteStart');
|
||||
break;
|
||||
case 'cfmCtEteEnd':
|
||||
handleSingleSelection('cfmCtEteEnd', 'timeCfmCtEteEnd', 'cfmCtEteEnd');
|
||||
break;
|
||||
case 'cfmCtEteSEStart':
|
||||
handleDoubleSelection('selectCfmCtEteSEStart', 'selectCfmCtEteSEEnd', 'timeCfmCtEteSE', 'cfmCtEteSE');
|
||||
break;
|
||||
case 'cfmCtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmCtEteSEEnd', 'selectCfmCtEteSEStart', 'timeCfmCtEteSE', 'cfmCtEteSE');
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
});
|
||||
this.$emitter.on('reset', (data) => {
|
||||
this.reset();
|
||||
});
|
||||
this.$emitter.on('isRadioChange', (data) => {
|
||||
if(data) {
|
||||
this.reset();
|
||||
switch (this.selectedRuleType) {
|
||||
case 'Processing time':
|
||||
this.timeCfmPtEteAll = this.getDurationTime(this.cfmPtEteWhole, 'all');
|
||||
this.timeCfmPtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmPtEteAll));
|
||||
break;
|
||||
case 'Waiting time':
|
||||
this.timeCfmWtEteAll = this.getDurationTime(this.cfmWtEteWhole, 'all');
|
||||
this.timeCfmWtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmWtEteAll));
|
||||
break;
|
||||
case 'Cycle time':
|
||||
this.timeCfmCtEteAll = this.getDurationTime(this.cfmCtEteWhole, 'all');
|
||||
this.timeCfmCtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmCtEteAll));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
}
|
||||
});
|
||||
this.$emitter.on('isRadioProcessScopeChange', (data) => {
|
||||
if(data) {
|
||||
this.reset();
|
||||
};
|
||||
});
|
||||
this.$emitter.on('isRadioActSeqMoreChange', (data) => {
|
||||
if(data) {
|
||||
if(this.selectedActSeqMore === 'All') {
|
||||
switch (this.selectedRuleType) {
|
||||
case 'Processing time':
|
||||
this.timeCfmPtEteAll = this.getDurationTime(this.cfmPtEteWhole, 'all');
|
||||
this.timeCfmPtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmPtEteAll));
|
||||
break;
|
||||
case 'Waiting time':
|
||||
this.timeCfmWtEteAll = this.getDurationTime(this.cfmWtEteWhole, 'all');
|
||||
this.timeCfmWtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmWtEteAll));
|
||||
break;
|
||||
case 'Cycle time':
|
||||
this.timeCfmCtEteAll = this.getDurationTime(this.cfmCtEteWhole, 'all');
|
||||
this.timeCfmCtEteAllDefault = JSON.parse(JSON.stringify(this.timeCfmCtEteAll));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
}else this.reset();
|
||||
};
|
||||
});
|
||||
this.$emitter.on('isRadioActSeqFromToChange', (data) => {
|
||||
if(data) {
|
||||
this.reset();
|
||||
};
|
||||
});
|
||||
},
|
||||
// Store refs lookup for dynamic access in handleSingleSelection/handleDoubleSelection
|
||||
const storeRefs = {
|
||||
cfmPtEteStart,
|
||||
cfmPtEteEnd,
|
||||
cfmPtEteSE,
|
||||
cfmPtPStart,
|
||||
cfmPtPEnd,
|
||||
cfmPtPSE,
|
||||
cfmWtEteStart,
|
||||
cfmWtEteEnd,
|
||||
cfmWtEteSE,
|
||||
cfmWtPStart,
|
||||
cfmWtPEnd,
|
||||
cfmWtPSE,
|
||||
cfmCtEteStart,
|
||||
cfmCtEteEnd,
|
||||
cfmCtEteSE,
|
||||
};
|
||||
|
||||
/**
|
||||
* get min total seconds
|
||||
* @param {Number} e 最小值總秒數
|
||||
*/
|
||||
function minTotalSeconds(e) {
|
||||
emit('min-total-seconds', e);
|
||||
}
|
||||
/**
|
||||
* get min total seconds
|
||||
* @param {Number} e 最大值總秒數
|
||||
*/
|
||||
function maxTotalSeconds(e) {
|
||||
emit('max-total-seconds', e);
|
||||
}
|
||||
/**
|
||||
* get Time Range(duration)
|
||||
* @param {array} data API data，Activity 列表
|
||||
* @param {string} category 'act' | 'single' | 'double'，傳入以上任一值。
|
||||
* @param {string} task select Radio task or start
|
||||
* @param {string} taskTwo end
|
||||
* @returns {object} {min:12, max:345}
|
||||
*/
|
||||
function getDurationTime(data, category, task, taskTwo) {
|
||||
let result = {min:0, max:0};
|
||||
switch (category) {
|
||||
case 'act':
|
||||
data.forEach(i => {
|
||||
if(i.label === task) {
|
||||
result = i.duration;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'single':
|
||||
data.forEach(i => {
|
||||
if(i.task === task) {
|
||||
result = i.time;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'double':
|
||||
data.forEach(i => {
|
||||
if(i.start === task && i.end === taskTwo) {
|
||||
result = i.time;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'all':
|
||||
result = data;
|
||||
break
|
||||
default:
|
||||
break;
|
||||
};
|
||||
return result;
|
||||
}
|
||||
/**
|
||||
* All reset
|
||||
*/
|
||||
function reset() {
|
||||
state.timeDuration = null; // Activity duration
|
||||
state.timeCfmPtEteAll = state.timeCfmPtEteAllDefault; // Processing time
|
||||
state.timeCfmPtEteStart = null;
|
||||
state.timeCfmPtEteEnd = null;
|
||||
state.timeCfmPtEteSE = null;
|
||||
state.timeCfmPtPStart = null;
|
||||
state.timeCfmPtPEnd = null;
|
||||
state.timeCfmPtPSE = null;
|
||||
state.timeCfmWtEteAll = state.timeCfmWtEteAllDefault; // Waiting time
|
||||
state.timeCfmWtEteStart = null;
|
||||
state.timeCfmWtEteEnd = null;
|
||||
state.timeCfmWtEteSE = null;
|
||||
state.timeCfmWtPStart = null;
|
||||
state.timeCfmWtPEnd = null;
|
||||
state.timeCfmWtPSE = null;
|
||||
state.timeCfmCtEteAll = state.timeCfmCtEteAllDefault; // Cycle time
|
||||
state.timeCfmCtEteStart = null;
|
||||
state.timeCfmCtEteEnd = null;
|
||||
state.timeCfmCtEteSE = null;
|
||||
state.selectCfmPtEteSEStart = null;
|
||||
state.selectCfmPtEteSEEnd = null;
|
||||
state.selectCfmPtPSEStart = null;
|
||||
state.selectCfmPtPSEEnd = null;
|
||||
state.selectCfmWtEteSEStart = null;
|
||||
state.selectCfmWtEteSEEnd = null;
|
||||
state.selectCfmWtPSEStart = null;
|
||||
state.selectCfmWtPSEEnd = null;
|
||||
state.selectCfmCtEteSEStart = null;
|
||||
state.selectCfmCtEteSEEnd = null;
|
||||
}
|
||||
|
||||
// created() logic
|
||||
emitter.on('actRadioData', (data) => {
|
||||
const category = data.category;
|
||||
const task = data.task;
|
||||
|
||||
const handleDoubleSelection = (startKey, endKey, timeKey, durationType) => {
|
||||
state[startKey] = task;
|
||||
state[timeKey] = { min: 0, max: 0 };
|
||||
if (state[endKey]) {
|
||||
state[timeKey] = getDurationTime(storeRefs[durationType].value, 'double', task, state[endKey]);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSingleSelection = (key, timeKey, durationType) => {
|
||||
state[timeKey] = getDurationTime(storeRefs[durationType].value, 'single', task);
|
||||
};
|
||||
|
||||
switch (category) {
|
||||
// Activity duration
|
||||
case 'cfmDur':
|
||||
state.timeDuration = getDurationTime(conformanceAllTasks.value, 'act', task);
|
||||
break;
|
||||
// Processing time
|
||||
case 'cfmPtEteStart':
|
||||
handleSingleSelection('cfmPtEteStart', 'timeCfmPtEteStart', 'cfmPtEteStart');
|
||||
break;
|
||||
case 'cfmPtEteEnd':
|
||||
handleSingleSelection('cfmPtEteEnd', 'timeCfmPtEteEnd', 'cfmPtEteEnd');
|
||||
break;
|
||||
case 'cfmPtEteSEStart':
|
||||
handleDoubleSelection('selectCfmPtEteSEStart', 'selectCfmPtEteSEEnd', 'timeCfmPtEteSE', 'cfmPtEteSE');
|
||||
break;
|
||||
case 'cfmPtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmPtEteSEEnd', 'selectCfmPtEteSEStart', 'timeCfmPtEteSE', 'cfmPtEteSE');
|
||||
break;
|
||||
case 'cfmPtPStart':
|
||||
handleSingleSelection('cfmPtPStart', 'timeCfmPtPStart', 'cfmPtPStart');
|
||||
break;
|
||||
case 'cfmPtPEnd':
|
||||
handleSingleSelection('cfmPtPEnd', 'timeCfmPtPEnd', 'cfmPtPEnd');
|
||||
break;
|
||||
case 'cfmPtPSEStart':
|
||||
handleDoubleSelection('selectCfmPtPSEStart', 'selectCfmPtPSEEnd', 'timeCfmPtPSE', 'cfmPtPSE');
|
||||
break;
|
||||
case 'cfmPtPSEEnd':
|
||||
handleDoubleSelection('selectCfmPtPSEEnd', 'selectCfmPtPSEStart', 'timeCfmPtPSE', 'cfmPtPSE');
|
||||
break;
|
||||
// Waiting time
|
||||
case 'cfmWtEteStart':
|
||||
handleSingleSelection('cfmWtEteStart', 'timeCfmWtEteStart', 'cfmWtEteStart');
|
||||
break;
|
||||
case 'cfmWtEteEnd':
|
||||
handleSingleSelection('cfmWtEteEnd', 'timeCfmWtEteEnd', 'cfmWtEteEnd');
|
||||
break;
|
||||
case 'cfmWtEteSEStart':
|
||||
handleDoubleSelection('selectCfmWtEteSEStart', 'selectCfmWtEteSEEnd', 'timeCfmWtEteSE', 'cfmWtEteSE');
|
||||
break;
|
||||
case 'cfmWtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmWtEteSEEnd', 'selectCfmWtEteSEStart', 'timeCfmWtEteSE', 'cfmWtEteSE');
|
||||
break;
|
||||
case 'cfmWtPStart':
|
||||
handleSingleSelection('cfmWtPStart', 'timeCfmWtPStart', 'cfmWtPStart');
|
||||
break;
|
||||
case 'cfmWtPEnd':
|
||||
handleSingleSelection('cfmWtPEnd', 'timeCfmWtPEnd', 'cfmWtPEnd');
|
||||
break;
|
||||
case 'cfmWtPSEStart':
|
||||
handleDoubleSelection('selectCfmWtPSEStart', 'selectCfmWtPSEEnd', 'timeCfmWtPSE', 'cfmWtPSE');
|
||||
break;
|
||||
case 'cfmWtPSEEnd':
|
||||
handleDoubleSelection('selectCfmWtPSEEnd', 'selectCfmWtPSEStart', 'timeCfmWtPSE', 'cfmWtPSE');
|
||||
break;
|
||||
// Cycle time
|
||||
case 'cfmCtEteStart':
|
||||
handleSingleSelection('cfmCtEteStart', 'timeCfmCtEteStart', 'cfmCtEteStart');
|
||||
break;
|
||||
case 'cfmCtEteEnd':
|
||||
handleSingleSelection('cfmCtEteEnd', 'timeCfmCtEteEnd', 'cfmCtEteEnd');
|
||||
break;
|
||||
case 'cfmCtEteSEStart':
|
||||
handleDoubleSelection('selectCfmCtEteSEStart', 'selectCfmCtEteSEEnd', 'timeCfmCtEteSE', 'cfmCtEteSE');
|
||||
break;
|
||||
case 'cfmCtEteSEEnd':
|
||||
handleDoubleSelection('selectCfmCtEteSEEnd', 'selectCfmCtEteSEStart', 'timeCfmCtEteSE', 'cfmCtEteSE');
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
});
|
||||
emitter.on('reset', (data) => {
|
||||
reset();
|
||||
});
|
||||
emitter.on('isRadioChange', (data) => {
|
||||
if(data) {
|
||||
reset();
|
||||
switch (selectedRuleType.value) {
|
||||
case 'Processing time':
|
||||
state.timeCfmPtEteAll = getDurationTime(cfmPtEteWhole.value, 'all');
|
||||
state.timeCfmPtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmPtEteAll));
|
||||
break;
|
||||
case 'Waiting time':
|
||||
state.timeCfmWtEteAll = getDurationTime(cfmWtEteWhole.value, 'all');
|
||||
state.timeCfmWtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmWtEteAll));
|
||||
break;
|
||||
case 'Cycle time':
|
||||
state.timeCfmCtEteAll = getDurationTime(cfmCtEteWhole.value, 'all');
|
||||
state.timeCfmCtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmCtEteAll));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
}
|
||||
});
|
||||
emitter.on('isRadioProcessScopeChange', (data) => {
|
||||
if(data) {
|
||||
reset();
|
||||
};
|
||||
});
|
||||
emitter.on('isRadioActSeqMoreChange', (data) => {
|
||||
if(data) {
|
||||
if(selectedActSeqMore.value === 'All') {
|
||||
switch (selectedRuleType.value) {
|
||||
case 'Processing time':
|
||||
state.timeCfmPtEteAll = getDurationTime(cfmPtEteWhole.value, 'all');
|
||||
state.timeCfmPtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmPtEteAll));
|
||||
break;
|
||||
case 'Waiting time':
|
||||
state.timeCfmWtEteAll = getDurationTime(cfmWtEteWhole.value, 'all');
|
||||
state.timeCfmWtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmWtEteAll));
|
||||
break;
|
||||
case 'Cycle time':
|
||||
state.timeCfmCtEteAll = getDurationTime(cfmCtEteWhole.value, 'all');
|
||||
state.timeCfmCtEteAllDefault = JSON.parse(JSON.stringify(state.timeCfmCtEteAll));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
};
|
||||
}else reset();
|
||||
};
|
||||
});
|
||||
emitter.on('isRadioActSeqFromToChange', (data) => {
|
||||
if(data) {
|
||||
reset();
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user