Migrate all Vue components from Options API to <script setup>

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

@@ -9,65 +9,55 @@
     </div>
   </div>
 </template>
-<script>
-import { mapActions, } from 'pinia';
+<script setup>
+import { ref, computed, watch } from 'vue';
 import { useConformanceInputStore } from "@/stores/conformanceInput";
 import { sortNumEngZhtw } from '@/module/sortNumEngZhtw.js';
+import emitter from '@/utils/emitter';
 
-export default {
-  props: ['title', 'select', 'data', 'category', 'task', 'isSubmit'],
-  data() {
-    return {
-      sortData: [],
-      localSelect: null,
-      selectedRadio: null,
-    }
-  },
-  watch: {
-    data: {
-      handler: function(newValue) {
-        this.sortData = sortNumEngZhtw(newValue)
-      },
-      immediate: true, // 立即執行一次排序
-    },
-    task: function(newValue) {
-      this.selectedRadio = newValue;
-    },
-  },
-  computed: {
-    inputActivityRadioData: {
-      get(){
-        return {
-          category: this.category,
-          task: this.selectedRadio, // For example, "a", or "出院"
-      };
-      },
-    } ,
-  },
-  methods: {
-    /**
-     * 將選取的 Activity 傳出去
-     */
-    actRadioData() {
-      this.localSelect = null;
-      this.$emitter.emit('actRadioData', this.inputActivityRadioData);
-      this.$emit('selected-task', this.selectedRadio);
-      this.setActivityRadioStartEndData(this.inputActivityRadioData.task);
-    },
-    setGlobalActivityRadioDataState(){
-      //this.title: value might be "From" or "To"
-      this.setActivityRadioStartEndData(this.inputActivityRadioData.task, this.title);
-    },
-    ...mapActions(useConformanceInputStore, ['setActivityRadioStartEndData']),
-  },
-  created() {
-    sortNumEngZhtw(this.sortData);
-    this.localSelect = this.isSubmit ? this.select : null;
-    this.selectedRadio = this.localSelect;
-    this.$emitter.on('reset', (data) => {
-      this.selectedRadio = data;
-    });
-    this.setGlobalActivityRadioDataState();
-  },
+const props = defineProps(['title', 'select', 'data', 'category', 'task', 'isSubmit']);
+const emit = defineEmits(['selected-task']);
+
+const conformanceInputStore = useConformanceInputStore();
+
+const sortData = ref([]);
+const localSelect = ref(null);
+const selectedRadio = ref(null);
+
+watch(() => props.data, (newValue) => {
+  sortData.value = sortNumEngZhtw(newValue);
+}, { immediate: true });
+
+watch(() => props.task, (newValue) => {
+  selectedRadio.value = newValue;
+});
+
+const inputActivityRadioData = computed(() => ({
+  category: props.category,
+  task: selectedRadio.value,
+}));
+
+/**
+ * 將選取的 Activity 傳出去
+ */
+function actRadioData() {
+  localSelect.value = null;
+  emitter.emit('actRadioData', inputActivityRadioData.value);
+  emit('selected-task', selectedRadio.value);
+  conformanceInputStore.setActivityRadioStartEndData(inputActivityRadioData.value.task);
 }
+
+function setGlobalActivityRadioDataState() {
+  //this.title: value might be "From" or "To"
+  conformanceInputStore.setActivityRadioStartEndData(inputActivityRadioData.value.task, props.title);
+}
+
+// created
+sortNumEngZhtw(sortData.value);
+localSelect.value = props.isSubmit ? props.select : null;
+selectedRadio.value = localSelect.value;
+emitter.on('reset', (data) => {
+  selectedRadio.value = data;
+});
+setGlobalActivityRadioDataState();
 </script>