Conformance: StatusSidebar Have activity Clear button done.

src/components/Discover/Conformance/ConformanceSidebar.vue

@@ -23,6 +23,7 @@
         <ConformanceTimeRange v-if="selectedRuleType === 'Activity duration' || selectedRuleType === 'Processing time' || selectedRuleType === 'Waiting time' || selectedRuleType === 'Cycle time'"></ConformanceTimeRange>
       </div>
       <!-- button -->
+      {{ selectConformanceTask }}
       <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 btn-neutral" @click="submit">Apply</button>
@@ -53,6 +54,7 @@ export default {
     return {
       isShowBar: false,
       visibleLeft: false,
+      selectConformanceTask: null,
     }
   },
   components: {
@@ -61,8 +63,23 @@ export default {
     ConformanceTimeRange,
     ConformanceSelectResult,
   },
+  methods: {
+    /**
+     * @param {boolean} massage true | false 清空選項
+     */
+     reset(massage) {
+      // Have activity
+      this.selectConformanceTask = null;
+      this.$emitter.emit('reset', null);
+      // 成功訊息
+      massage ? this.$toast.success('Reset Success.') : null;
+    },
+  },
   created() {
     this.isShowBar = true;
+    this.$emitter.on('actListData', (data) => {
+      this.selectConformanceTask = data;
+    })
   },
 }
 </script>

src/components/Discover/Conformance/ConformanceSidebar/ActList.vue

@@ -5,7 +5,7 @@
       <p class="h2 pl-2 border-b mb-3">Sort</p>
       <div class="flex flex-wrap justify-start content-start gap-4 px-2 overflow-y-auto scrollbar h-[calc(100%_-_52px)]">
           <div class="flex items-center w-[166px]" v-for="(act, index) in data" :key="index">
-              <Checkbox v-model="actList" :inputId="index.toString()" name="actList" :value="act" />
+              <Checkbox v-model="actList" :inputId="index.toString()" name="actList" :value="act" @change="actListData"/>
               <label :for="index" class="ml-2 p-2 whitespace-nowrap break-keep text-ellipsis overflow-hidden">{{ act }}</label>
           </div>
       </div>
@@ -19,6 +19,16 @@ export default {
     return {
       actList: null,
     }
-  }
+  },
+  methods: {
+    actListData() {
+      this.$emitter.emit('actListData', this.actList);
+    }
+  },
+  created() {
+    this.$emitter.on('reset', (data) => {
+      this.actList = data;
+    });
+  },
 }
 </script>

src/components/Discover/Conformance/ConformanceSidebar/ConformanceSelectResult.vue

@@ -41,7 +41,7 @@ export default {
   },
   data() {
     return {
-      data: ['到院', '到院到院到院到院到院到院到院', '到院到院到到院院到院到院到院', '到院到院到院到院到院到院'],
+      data: null,
       timeResultData: [
         {
           id: 1,
@@ -66,6 +66,14 @@ export default {
       ],
     }
   },
+  created() {
+    this.$emitter.on('actListData', (data) => {
+      this.data = data;
+    });
+    this.$emitter.on('reset', (data) => {
+      this.data = data;
+    });
+  },
 
 
 }

src/components/Discover/Conformance/ConformanceSidebar/ConformanceShowBar.vue

@@ -1,11 +1,5 @@
 <template>
   <section class="animate-fadein w-full h-full">
-    <!-- {{ selectedRuleType }}
-    {{ selectedActivitySequence }}
-    {{ selectedMode }}
-    {{ selectedProcessScope }}
-    {{ selectedActSeqMore }} -->
-
     <!-- Have activity -->
     <ActList v-if="selectedRuleType === 'Have activity'" :data="conformanceTask"></ActList>
     <!-- Activity sequence  -->
@@ -13,10 +7,8 @@
       <ActRadio :title="'Start activity'" :v-model="'actseqStartAndEndRadioStart'" :data="data" />
       <ActRadio :title="'End activity'" :v-model="'actseqStartAndEndRadioEnd'" :data="data" />
     </div>
-    <!-- v-if="selectedRuleType === 'Activity sequence' && selectedActivitySequence === 'Sequence'" -->
     <!-- actSeqDrag -->
     <ActSeqDrag v-if="selectedRuleType === 'Activity sequence' && selectedActivitySequence === 'Sequence'"></ActSeqDrag>
-
     <!-- Activity duration -->
     <ActRadio v-if="selectedRuleType === 'Activity duration'" :title="'Activities include'" :v-model="'actInclude'" :data="data" />
     <!-- Processing time -->
@@ -77,8 +69,10 @@ export default {
   },
   data() {
     return {
-      data:['到到到到到到到到到到到到到到到到到到到到到到院', '住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住院', '開開開開開開開開開開開開開開開開開開開開開開刀', '第第第第第第第第第第一次醫囑', 'aaaaaaaaaaaaaaaa', 'bb ccc ddddd eeee', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院 到院 到院 到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院院院院院院院院院院院院院院院院院院院院院院院院院院院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院']
+      data:['到到到到到到到到到到到到到到到到到到到到到到院', '住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住住院', '開開開開開開開開開開開開開開開開開開開開開開刀', '第第第第第第第第第第一次醫囑', 'aaaaaaaaaaaaaaaa', 'bb ccc ddddd eeee', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院 到院 到院 到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院院院院院院院院院院院院院院院院院院院院院院院院院院院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院', '到院', '住院', '開刀', '第一次醫囑', '第二次醫囑', '照會', '繳費', '領藥', '出院'],
     }
+  },
+  methods: {
   }
 }
 </script>

src/main.js

@@ -59,7 +59,7 @@ pinia.use(({ store }) => {
 
 // can use `this.$moment` in Vue.js
 app.config.globalProperties.$moment = moment;
-app.config.globalProperties.emitter = emitter;
+app.config.globalProperties.$emitter = emitter;
 app.config.globalProperties.$cytoscape = cytoscape;
 
 // Cytoscape.js's style

src/stores/conformance.js

@@ -12,6 +12,7 @@ let delay = (s = 0) =>  new Promise((resolve, reject) => setTimeout(resolve, s))
 export default defineStore('conformanceStore', {
   state: () => ({
     conformanceLogId: null,
+    conformanceLogTempCheckerId: null,
     conformanceFilterId: null,
     allConformanceTask: [],
     selectedRuleType: 'Have activity', // radio
@@ -45,6 +46,27 @@ export default defineStore('conformanceStore', {
         await delay(500);
         $toast.default('Failed to load the Conformance Parameters.',{position: 'bottom'});
       }
+    },
+    /**
+     * Creates a new temporary checker for a log.
+     */
+    async addLogConformanceTempCheckerId() {
+      let logId = this.conformanceLogId;
+      const api = `/api/temp-log-checkers?log_id=${logId}`;
+
+      try {
+        const response = await this.$axios.post(api);
+        console.log(response);
+        this.conformanceLogTempCheckerId = response.data.id;
+      } catch(error) {
+        console.log(error);
+        await delay();
+        loading.isLoading = true;
+        await delay(1000);
+        loading.isLoading = false;
+        await delay(500);
+        $toast.default('Failed to add the Temporary Checker for a log.',{position: 'bottom'});
+      }
     }
   },
 })