locale of Conformance page

This commit is contained in:
Cindy Chang
2024-06-05 09:46:20 +08:00
parent e2d420b4bd
commit 499ad33d57
3 changed files with 61 additions and 23 deletions

View File

@@ -1,8 +1,9 @@
<template>
<section class="h-full shadow-[1px_0px_4px_rgba(0,0,0,0.25)] bg-neutral-100 absolute inset-y-0 left-0 z-10" :class="!notShowActList ? (isShowBar ? 'w-full' : 'w-[312px]') : 'w-[312px]'">
<section class="h-full shadow-[1px_0px_4px_rgba(0,0,0,0.25)] bg-neutral-100 absolute inset-y-0 left-0 z-10"
:class="!notShowActList ? (isShowBarOpen ? 'w-full' : 'w-[312px]') : 'w-[312px]'">
<!-- header -->
<div class="bg-neutral-200 px-4">
<p class="h2">Rule Settings</p>
<p class="h2">{{ i18next.t("Conformance.RuleSettings") }}</p>
</div>
<!-- contanier -->
<div class="p-4 h-[calc(100%_-_40px)] flex">
@@ -12,9 +13,12 @@
<!-- radio group -->
<ConformanceRadioGroup></ConformanceRadioGroup>
<!-- show and hidden button -->
<div v-if="!notShowActList" class="flex items-center justify-between mr-1" :class="isShowBar ? 'text-primary' : ''">
<p class="h2">Activity Selector</p>
<span class="material-symbols-outlined cursor-pointer duration-300 hover:bg-primary/50 hover:rounded" @click="isShowBar = !isShowBar" id="cyp-showbaricon">{{ isShowBar ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}</span>
<div v-if="!notShowActList" class="flex items-center justify-between mr-1" :class="isShowBarOpen ? 'text-primary' : ''">
<p class="h2">{{ i18next.t("Conformance.ActivitySelector") }}</p>
<span class="material-symbols-outlined cursor-pointer duration-300 hover:bg-primary/50 hover:rounded"
@click="isShowBarOpen = !isShowBarOpen" id="cyp-showbaricon">
{{ isShowBarOpen ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}
</span>
</div>
<!-- select result -->
<ConformanceSelectResult
@@ -67,12 +71,17 @@
</div>
<!-- button -->
<div class="space-x-4 p-4 flex justify-center items-content border-t border-neutral-300">
<button type="button" class="btn btn-sm btn-neutral" @click="reset">Clear</button>
<button type="button" class="btn btn-sm " @click="submit" :class="this.isDisabled ? 'btn-disable' : 'btn-neutral'" :disabled="isDisabledButton" >Apply</button>
<button type="button" class="btn btn-sm btn-neutral" @click="reset">{{ i18next.t("Global.Clear")}} </button>
<button id="btn_apply_conformance" type="button" class="btn btn-sm " @click="submitConformance"
:class="this.isDisabled ? 'btn-disable' : 'btn-neutral'"
:disabled="isDisabledButton"
>
{{ i18next.t("Global.Apply") }}
</button>
</div>
</div>
<!-- show bar -->
<ConformanceShowBar v-if="!notShowActList" :class="isShowBar?'':'hidden'"
<ConformanceShowBar v-if="!notShowActList" :class="isShowBarOpen?'':'hidden'"
:isSubmit="isSubmit"
:isSubmitTask="isSubmitTask"
:isSubmitStartAndEnd="isSubmitStartAndEnd"
@@ -107,6 +116,7 @@
<script>
import { storeToRefs } from 'pinia';
import i18next from '@/i18n/i18n';
import LoadingStore from '@/stores/loading.js';
import ConformanceStore from '@/stores/conformance.js';
import ConformanceRadioGroup from './ConformanceSidebar/ConformanceRadioGroup.vue';
@@ -125,8 +135,9 @@ export default {
},
data() {
return {
i18next: i18next,
isDisabled: true,
isShowBar: false,
isShowBarOpen: false,
visibleLeft: false,
selectConformanceTask: null,
selectConformanceStartAndEnd: null, // Activity sequence
@@ -251,7 +262,11 @@ export default {
},
computed: {
notShowActList: function() {
return (this.selectedRuleType === 'Activity sequence' && this.selectedActivitySequence === 'Sequence' && (this.selectedMode === 'Short loop(s)' || this.selectedMode === 'Self loop(s)')) || (this.selectedRuleType === 'Processing time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All') || (this.selectedRuleType === 'Waiting time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All') || (this.selectedRuleType === 'Cycle time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All')
return (this.selectedRuleType === 'Activity sequence' && this.selectedActivitySequence === 'Sequence'
&& (this.selectedMode === 'Short loop(s)' || this.selectedMode === 'Self loop(s)'))
|| (this.selectedRuleType === 'Processing time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All')
|| (this.selectedRuleType === 'Waiting time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All')
|| (this.selectedRuleType === 'Cycle time' && this.selectedProcessScope === 'End to end' && this.selectedActSeqMore === 'All')
},
/**
* Apply button is disabled or not
@@ -304,7 +319,8 @@ export default {
if(!this.isSubmit) {
if(this.selectCfmPtEteSEStart && this.selectCfmPtEteSEEnd) disabled = false;
} else {
if((!this.selectCfmPtEteSEStart && this.selectCfmPtEteSEEnd) || (this.selectCfmPtEteSEStart && !this.selectCfmPtEteSEEnd)) disabled = true;
if((!this.selectCfmPtEteSEStart && this.selectCfmPtEteSEEnd)
|| (this.selectCfmPtEteSEStart && !this.selectCfmPtEteSEEnd)) disabled = true;
else disabled = false;
}
break;
@@ -322,7 +338,8 @@ export default {
if(!this.isSubmit) {
if(this.selectCfmPtPSEStart && this.selectCfmPtPSEEnd) disabled = false;
} else {
if((!this.selectCfmPtPSEStart && this.selectCfmPtPSEEnd) || (this.selectCfmPtPSEStart && !this.selectCfmPtPSEEnd)) disabled = true;
if((!this.selectCfmPtPSEStart && this.selectCfmPtPSEEnd)
|| (this.selectCfmPtPSEStart && !this.selectCfmPtPSEEnd)) disabled = true;
else disabled = false;
}
break;
@@ -347,7 +364,8 @@ export default {
if(!this.isSubmit) {
if(this.selectCfmWtEteSEStart && this.selectCfmWtEteSEEnd) disabled = false;
} else {
if((!this.selectCfmWtEteSEStart && this.selectCfmWtEteSEEnd) || (this.selectCfmWtEteSEStart && !this.selectCfmWtEteSEEnd)) disabled = true;
if((!this.selectCfmWtEteSEStart && this.selectCfmWtEteSEEnd)
|| (this.selectCfmWtEteSEStart && !this.selectCfmWtEteSEEnd)) disabled = true;
else disabled = false;
}
break;
@@ -365,7 +383,8 @@ export default {
if(!this.isSubmit) {
if(this.selectCfmWtPSEStart && this.selectCfmWtPSEEnd) disabled = false;
} else {
if((!this.selectCfmWtPSEStart && this.selectCfmWtPSEEnd) || (this.selectCfmWtPSEStart && !this.selectCfmWtPSEEnd)) disabled = true;
if((!this.selectCfmWtPSEStart && this.selectCfmWtPSEEnd)
|| (this.selectCfmWtPSEStart && !this.selectCfmWtPSEEnd)) disabled = true;
else disabled = false;
}
break;
@@ -388,7 +407,8 @@ export default {
if(!this.isSubmit) {
if(this.selectCfmCtEteSEStart && this.selectCfmCtEteSEEnd) disabled = false;
} else {
if((!this.selectCfmCtEteSEStart && this.selectCfmCtEteSEEnd) || (this.selectCfmCtEteSEStart && !this.selectCfmCtEteSEEnd)) disabled = true;
if((!this.selectCfmCtEteSEStart && this.selectCfmCtEteSEEnd)
|| (this.selectCfmCtEteSEStart && !this.selectCfmCtEteSEEnd)) disabled = true;
else disabled = false;
}
break;
@@ -799,7 +819,7 @@ export default {
this.$emitter.emit('reset', null);
// reset 成功訊息
this.$toast.success('Rule cleared.');
this.isShowBar = true;
this.isShowBarOpen = true;
},
/**
* 設定 Start & End Data 連動資料
@@ -829,8 +849,8 @@ export default {
/**
* Apply button 發送選項,取得 Check Id.
*/
async submit() {
let data;
async submitConformance() {
let data ;
this.selectDurationTime = await {
min: this.selectTimeRangeMin,
@@ -1187,8 +1207,12 @@ export default {
};
break;
};
if(data.min > data.max) return this.$toast.error('Please check time range setting.');
if(JSON.stringify(data) === JSON.stringify(this.isSubmitData)) return this.$toast.error('Please set the new rule.');
if(data.min > data.max) {
return this.$toast.error('Please check time range setting.');
}
if(JSON.stringify(data) === JSON.stringify(this.isSubmitData)) {
return this.$toast.error('Please set the new rule.');
}
this.isLoading = true;
this.isSubmit = true;
@@ -1196,7 +1220,7 @@ export default {
this.conformanceRuleData = data; // 給存檔的 Data
await this.conformanceStore.addConformanceCheckId(data);
await this.conformanceStore.getConformanceReport();
this.isShowBar = false;
this.isShowBarOpen = false;
this.isLoading = false;
// Results page Cover Plate
this.$emitter.emit('coverPlate', false);
@@ -1204,7 +1228,7 @@ export default {
},
},
created() {
this.isShowBar = this.conformanceLogCreateCheckId || this.conformanceFilterCreateCheckId ? false : true;
this.isShowBarOpen = this.conformanceLogCreateCheckId || this.conformanceFilterCreateCheckId ? false : true;
// 選取 list 的結果
this.$emitter.on('actListData', (data) => {
this.selectConformanceTask = data;