From db02d9c1267217b05e1ccd2a9f88028af462252c Mon Sep 17 00:00:00 2001
From: Junyan Qin <rockchinq@gmail.com>
Date: Sun, 3 Nov 2024 23:22:33 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=8C=E6=88=90=E4=BB=BB=E5=8A=A1?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pkg/core/taskmgr.py                           |  2 +
 web/src/App.vue                               |  2 +-
 web/src/components/TaskCard.vue               | 74 ++++++++++++++++++-
 .../{TaskDialog.vue => TaskListDialog.vue}    |  3 +-
 4 files changed, 75 insertions(+), 6 deletions(-)
 rename web/src/components/{TaskDialog.vue => TaskListDialog.vue} (97%)

diff --git a/pkg/core/taskmgr.py b/pkg/core/taskmgr.py
index 0a8af919..d7436b06 100644
--- a/pkg/core/taskmgr.py
+++ b/pkg/core/taskmgr.py
@@ -137,6 +137,8 @@ class TaskWrapper:
             for frame in self.task_stack:
                 exception_traceback += f"  File \"{frame.f_code.co_filename}\", line {frame.f_lineno}, in {frame.f_code.co_name}\n"
 
+            exception_traceback += f"    {self.assume_exception().__str__()}\n"
+
         return {
             "id": self.id,
             "task_type": self.task_type,
diff --git a/web/src/App.vue b/web/src/App.vue
index 02a42f45..f8ebed38 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -69,7 +69,7 @@
 import { getCurrentInstance } from 'vue'
 import {provide, ref, watch} from 'vue';
 
-import TaskDialog from '@/components/TaskDialog.vue'
+import TaskDialog from '@/components/TaskListDialog.vue'
 
 const { proxy } = getCurrentInstance()
 
diff --git a/web/src/components/TaskCard.vue b/web/src/components/TaskCard.vue
index 653a8670..167f6f41 100644
--- a/web/src/components/TaskCard.vue
+++ b/web/src/components/TaskCard.vue
@@ -2,19 +2,66 @@
     <div class="task-card">
         <div class="task-card-icon">
             <v-progress-circular :size="25" :width="2" indeterminate v-if="task.runtime.state == 'PENDING'" />
-            <v-icon v-else-if="task.runtime.state == 'FINISHED'" style="color: #4caf50;" :size="25" icon="mdi-check" />
+            <v-icon v-else-if="task.runtime.state == 'FINISHED' && task.runtime.exception == null"
+                style="color: #4caf50;" :size="25" icon="mdi-check" />
             <v-icon v-else-if="task.runtime.state == 'CANCELLED'" style="color: #f44336;" :size="25" icon="mdi-close" />
+
+            <v-icon v-else-if="task.runtime.state == 'FINISHED' && task.runtime.exception != null" style="color: #f44336;"
+                :size="25" icon="mdi-alert-circle-outline" v-bind="activatorProps" />
         </div>
 
         <div class="task-card-content">
             <div class="task-card-kind">{{ task.kind }}</div>
             <div class="task-card-label">{{ task.label }}</div>
-            <v-chip class="task-card-action" color="primary" variant="outlined" size="small" density="compact">正在执行: {{ task.task_context.current_action }}</v-chip>
+            <v-chip class="task-card-action" color="primary" variant="outlined" size="small" density="compact"
+                v-if="task.runtime.state == 'PENDING'">正在执行: {{ task.task_context.current_action }}</v-chip>
+            <v-chip class="task-card-action" color="success" variant="outlined" size="small" density="compact"
+                v-else-if="task.runtime.state == 'FINISHED' && task.runtime.exception == null">完成</v-chip>
+
+            <v-dialog max-width="500" persistent v-model="exceptionDialogShow">
+                <template v-slot:activator="{ props: activatorProps }">
+                    <v-chip class="task-card-action" color="error" variant="outlined" size="small" density="compact"
+                        v-if="task.runtime.state == 'FINISHED' && task.runtime.exception != null"
+                        v-bind="activatorProps">{{ task.runtime.exception }}</v-chip>
+                </template>
+
+                <v-card prepend-icon="mdi-alert-circle-outline"
+                    :text="task.runtime.exception_traceback"
+                    title="任务执行失败">
+                    <template v-slot:actions>
+                        <v-spacer></v-spacer>
+
+                        <v-btn @click="exceptionDialogShow = false" prepend-icon="mdi-close">
+                            关闭
+                        </v-btn>
+                    </template>
+                </v-card>
+            </v-dialog>
         </div>
 
         <div class="task-card-actions">
             <!-- <v-icon icon="mdi-details" /> -->
-             <v-btn icon="mdi-information-outline" variant="text" />
+            <v-dialog max-width="500" persistent v-model="detailsDialogShow">
+                <template v-slot:activator="{ props: activatorProps }">
+                    <v-btn icon="mdi-file-outline" variant="text" v-bind="activatorProps" />
+                </template>
+
+                <v-card prepend-icon="mdi-file-outline" id="task-details-card"
+                    :title="'任务执行日志 - '+task.label">
+
+                    <div id="task-details-log-container">
+                            <textarea id="task-details-log" v-model="task.task_context.log" readonly />
+
+                        <v-spacer></v-spacer>
+                    </div>
+                    <template v-slot:actions>
+
+                        <v-btn @click="detailsDialogShow = false" prepend-icon="mdi-close">
+                            关闭
+                        </v-btn>
+                    </template>
+                </v-card>
+            </v-dialog>
         </div>
     </div>
 </template>
@@ -26,6 +73,11 @@ defineProps({
         required: true
     }
 })
+
+import { ref } from 'vue'
+
+const exceptionDialogShow = ref(false)
+const detailsDialogShow = ref(false)
 </script>
 
 <style scoped>
@@ -75,4 +127,18 @@ defineProps({
     justify-self: flex-end;
 }
 
-</style>
\ No newline at end of file
+
+#task-details-log {
+    width: calc(100% - 2rem);
+    height: 10rem;
+    resize: none;
+    border: none;
+    padding: 0.6rem;
+    font-size: 0.8rem;
+    outline: none;
+    overflow: auto;
+    appearance: none;
+    background-color: #f6f6f6;
+    margin-inline: 1rem;
+}
+</style>
diff --git a/web/src/components/TaskDialog.vue b/web/src/components/TaskListDialog.vue
similarity index 97%
rename from web/src/components/TaskDialog.vue
rename to web/src/components/TaskListDialog.vue
index d7748154..7cf9207a 100644
--- a/web/src/components/TaskDialog.vue
+++ b/web/src/components/TaskListDialog.vue
@@ -9,6 +9,7 @@
             <v-btn class="ml-auto" text="关闭" prepend-icon="mdi-close" @click="close"></v-btn>
         </template>
     </v-card>
+
 </template>
 
 <script setup>
@@ -55,7 +56,7 @@ const refresh = () => {
 let refreshTask = null
 onMounted(() => {
     refresh()
-    refreshTask = setInterval(refresh, 500)
+    refreshTask = setInterval(refresh, 1000)
 })
 
 onUnmounted(() => {