props変更対応

src/components/TotalComponent.vue

@@ -8,16 +8,22 @@
   </q-card>
 </template>
 
-<script>
+<script setup lang="ts">
-export default {
+import { TaskBaseItem } from 'src/models/task';
-  name: 'TotalComponent',
+import { computed } from 'vue';
-  props: {
+
-    amount: {
+
-      type: Number,
+interface Props {
-      required: true
+  tasks: TaskBaseItem[];
 }
-  }
+
-};
+// Props の取得
+const props = defineProps<Props>();
+
+const amount = computed(() => {
+  return props.tasks.reduce((acc, task) => acc + task.reward, 0);
+});
+
 </script>
 
 <style scoped>