From 6d5d4354d989a40e186773c57a654027d2a32429 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Wed, 26 Feb 2025 19:07:00 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=87=8D=E6=9E=84=E5=B7=A5=E4=BD=9C?=
 =?UTF-8?q?=E6=B5=81=E5=AF=B9=E8=AF=9D=E6=A1=86=EF=BC=8C=E5=90=88=E5=B9=B6?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=92=8C=E7=BC=96=E8=BE=91=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=EF=BC=8C=E6=96=B0=E5=A2=9E=E6=B5=81=E7=A8=8B=E6=93=8D=E4=BD=9C?=
 =?UTF-8?q?=E5=AF=B9=E8=AF=9D=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/cards/WorkflowTaskCard.vue     | 36 ++++++++--
 ...itDialog.vue => WorkflowActionsDialog.vue} |  0
 ...ddDialog.vue => WorkflowAddEditDialog.vue} | 67 +++++++++++++++----
 src/views/workflow/WorkflowListView.vue       |  4 +-
 4 files changed, 87 insertions(+), 20 deletions(-)
 rename src/components/dialog/{WorkflowEditDialog.vue => WorkflowActionsDialog.vue} (100%)
 rename src/components/dialog/{WorkflowAddDialog.vue => WorkflowAddEditDialog.vue} (58%)

diff --git a/src/components/cards/WorkflowTaskCard.vue b/src/components/cards/WorkflowTaskCard.vue
index 876bf32d..537c9ebe 100644
--- a/src/components/cards/WorkflowTaskCard.vue
+++ b/src/components/cards/WorkflowTaskCard.vue
@@ -2,7 +2,8 @@
 import { Workflow } from '@/api/types'
 import { useToast } from 'vue-toast-notification'
 import { useConfirm } from 'vuetify-use-dialog'
-import WorkflowEditDialog from '@/components/dialog/WorkflowEditDialog.vue'
+import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
+import WorkflowActionsDialog from '@/components/dialog/WorkflowActionsDialog.vue'
 import api from '@/api'
 
 // 定义输入参数
@@ -22,9 +23,12 @@ const $toast = useToast()
 // 确认框
 const createConfirm = useConfirm()
 
-// 流程编辑对话框
+// 编辑对话框
 const editDialog = ref(false)
 
+// 流程对话框
+const flowDialog = ref(false)
+
 // 加载中
 const loading = ref(false)
 
@@ -33,6 +37,11 @@ function handleEdit(item: Workflow) {
   editDialog.value = true
 }
 
+// 编辑流程
+function handleFlow(item: Workflow) {
+  flowDialog.value = true
+}
+
 // 计算已完成的动作数
 function resolveDoneActions(item: Workflow) {
   return item.current_action?.split(',').length || 0
@@ -41,6 +50,7 @@ function resolveDoneActions(item: Workflow) {
 // 编辑完成
 function editDone() {
   editDialog.value = false
+  flowDialog.value = false
   emit('refresh')
 }
 
@@ -134,7 +144,7 @@ const resolveProgress = (item: Workflow) => {
 </script>
 <template>
   <div>
-    <VCard class="mx-auto" @click="handleEdit(workflow)">
+    <VCard class="mx-auto" @click="handleFlow(workflow)">
       <VCardItem class="py-3" :class="`bg-${resolveStatusVariant(workflow?.state).color}`">
         <template #prepend>
           <IconBtn v-if="workflow?.state === 'P'">
@@ -150,13 +160,19 @@ const resolveProgress = (item: Workflow) => {
         <VCardSubtitle>{{ workflow?.description }}</VCardSubtitle>
         <template #append>
           <IconBtn>
-            <VIcon icon="mdi-edit" @click.stop="handleEdit(workflow)" />
+            <VIcon icon="mdi-vector-polyline-edit" @click.stop="handleFlow(workflow)" />
           </IconBtn>
           <IconBtn>
             <VIcon icon="mdi-dots-vertical" />
             <VMenu activator="parent" close-on-content-click>
               <VList>
-                <VListItem variant="plain" base-color="primary" @click="handleRun(workflow)">
+                <VListItem variant="plain" base-color="primary" @click="handleEdit(workflow)">
+                  <template #prepend>
+                    <VIcon icon="mdi-note-edit" />
+                  </template>
+                  <VListItemTitle>编辑任务</VListItemTitle>
+                </VListItem>
+                <VListItem variant="plain" base-color="info" @click="handleRun(workflow)">
                   <template #prepend>
                     <VIcon icon="mdi-run" />
                   </template>
@@ -222,8 +238,16 @@ const resolveProgress = (item: Workflow) => {
         </div>
       </VCardText>
     </VCard>
+    <!-- 流程对话框 -->
+    <WorkflowActionsDialog
+      v-if="flowDialog"
+      v-model="flowDialog"
+      @close="flowDialog = false"
+      @save="editDone"
+      :workflow="workflow"
+    />
     <!-- 编辑对话框 -->
-    <WorkflowEditDialog
+    <WorkflowAddEditDialog
       v-if="editDialog"
       v-model="editDialog"
       @close="editDialog = false"
diff --git a/src/components/dialog/WorkflowEditDialog.vue b/src/components/dialog/WorkflowActionsDialog.vue
similarity index 100%
rename from src/components/dialog/WorkflowEditDialog.vue
rename to src/components/dialog/WorkflowActionsDialog.vue
diff --git a/src/components/dialog/WorkflowAddDialog.vue b/src/components/dialog/WorkflowAddEditDialog.vue
similarity index 58%
rename from src/components/dialog/WorkflowAddDialog.vue
rename to src/components/dialog/WorkflowAddEditDialog.vue
index 3ca32136..8e101ccf 100644
--- a/src/components/dialog/WorkflowAddDialog.vue
+++ b/src/components/dialog/WorkflowAddEditDialog.vue
@@ -6,6 +6,15 @@ import { requiredValidator } from '@/@validators'
 import api from '@/api'
 import { useDisplay } from 'vuetify'
 
+// 输入参数
+const props = defineProps({
+  // 任务信息
+  workflow: Object as PropType<Workflow>,
+})
+
+// 新增或修改字样
+const title = computed(() => (props.workflow ? '编辑' : '创建'))
+
 // 显示器宽度
 const display = useDisplay()
 
@@ -13,13 +22,15 @@ const display = useDisplay()
 const emit = defineEmits(['save', 'remove', 'close'])
 
 // 站点编辑表单数据
-const workflowForm = ref<Workflow>({
-  name: undefined,
-  timer: undefined,
-  description: undefined,
-  state: 'P',
-  run_count: 0,
-})
+const workflowForm = ref<Workflow>(
+  props.workflow || {
+    name: undefined,
+    timer: undefined,
+    description: undefined,
+    state: 'P',
+    run_count: 0,
+  },
+)
 
 // 提示框
 const $toast = useToast()
@@ -34,10 +45,31 @@ async function addWorkflow() {
   try {
     const result: { [key: string]: string } = await api.post('workflow/', workflowForm.value)
     if (result.success) {
-      $toast.success('新增任务成功，请编辑流程！')
+      $toast.success(`创建任务成功，请编辑流程！`)
       emit('save')
     } else {
-      $toast.error(`新增任务失败：${result.message}`)
+      $toast.error(`创建任务失败：${result.message}`)
+    }
+  } catch (error) {
+    console.error(error)
+  }
+  doneNProgress()
+}
+
+// 调用API 编辑任务
+async function editWorkflow() {
+  if (!workflowForm.value.name || !workflowForm.value.timer) {
+    $toast.error('请填写完整信息！')
+    return
+  }
+  startNProgress()
+  try {
+    const result: { [key: string]: string } = await api.put(`workflow/${workflowForm.value.id}`, workflowForm.value)
+    if (result.success) {
+      $toast.success(`修改任务成功！`)
+      emit('save')
+    } else {
+      $toast.error(`修改任务失败：${result.message}`)
     }
   } catch (error) {
     console.error(error)
@@ -48,7 +80,7 @@ async function addWorkflow() {
 
 <template>
   <VDialog scrollable :close-on-back="false" persistent eager max-width="30rem" :fullscreen="!display.mdAndUp.value">
-    <VCard title="新建任务" class="rounded-t">
+    <VCard :title="`${title}任务`" class="rounded-t">
       <DialogCloseBtn @click="emit('close')" />
       <VDivider />
       <VCardText>
@@ -81,8 +113,19 @@ async function addWorkflow() {
       </VCardText>
       <VCardActions class="pt-3">
         <VSpacer />
-        <VBtn block color="primary" variant="elevated" @click="addWorkflow" prepend-icon="mdi-plus" class="px-5">
-          新增
+        <VBtn
+          v-if="workflow"
+          block
+          color="primary"
+          variant="elevated"
+          @click="editWorkflow"
+          prepend-icon="mdi-content-save"
+          class="px-5"
+        >
+          保存
+        </VBtn>
+        <VBtn v-else block color="primary" variant="elevated" @click="addWorkflow" prepend-icon="mdi-plus" class="px-5">
+          创建
         </VBtn>
       </VCardActions>
     </VCard>
diff --git a/src/views/workflow/WorkflowListView.vue b/src/views/workflow/WorkflowListView.vue
index a3b69919..1c807099 100644
--- a/src/views/workflow/WorkflowListView.vue
+++ b/src/views/workflow/WorkflowListView.vue
@@ -2,7 +2,7 @@
 import api from '@/api'
 import { Workflow } from '@/api/types'
 import { useDisplay } from 'vuetify'
-import WorkflowAddDialog from '@/components/dialog/WorkflowAddDialog.vue'
+import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
 import WorkflowTaskCard from '@/components/cards/WorkflowTaskCard.vue'
 import NoDataFound from '@/components/NoDataFound.vue'
 
@@ -83,5 +83,5 @@ onActivated(() => {
     @click="addDialog = true"
   />
   <!-- 新增对话框 -->
-  <WorkflowAddDialog v-if="addDialog" v-model="addDialog" @close="addDialog = false" @save="addDone" />
+  <WorkflowAddEditDialog v-if="addDialog" v-model="addDialog" @close="addDialog = false" @save="addDone" />
 </template>