添加工作流备注功能

src/components/dialog/ForkWorkflowDialog.vue

@@ -152,7 +152,7 @@ async function doDelete() {
       <VCardText>
         <VCol>
           <div class="d-flex justify-space-between flex-wrap flex-md-nowrap flex-column flex-md-row">
-            <div class="ma-auto">
+            <div class="ma-auto mt-5">
               <div class="workflow-preview">
                 <VueFlow
                   :nodes="nodes"
@@ -257,7 +257,7 @@ async function doDelete() {
   border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
   border-radius: 8px;
   background-color: rgba(var(--v-theme-surface), 0.8);
-  block-size: 320px;
+  block-size: 280px;
   inline-size: 240px;
 }
 

src/components/workflow/NoteAction.vue

@@ -0,0 +1,58 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+defineProps({
+  id: {
+    type: String,
+    required: true,
+  },
+  data: {
+    type: Object,
+    required: true,
+  },
+})
+</script>
+<template>
+  <div>
+    <VCard max-width="20rem" class="note-card">
+      <VCardItem class="py-2">
+        <template v-slot:prepend>
+          <VAvatar color="warning">
+            <VIcon icon="mdi-note-text" size="x-large"></VIcon>
+          </VAvatar>
+        </template>
+        <VCardTitle>{{ t('workflow.note.title') }}</VCardTitle>
+      </VCardItem>
+      <VDivider />
+      <VCardText>
+        <VRow>
+          <VCol cols="12">
+            <VTextarea
+              v-model="data.content"
+              :label="t('workflow.note.content')"
+              :placeholder="t('workflow.note.placeholder')"
+              outlined
+              dense
+              auto-grow
+              rows="3"
+              max-rows="6"
+              clearable
+            />
+          </VCol>
+        </VRow>
+      </VCardText>
+    </VCard>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.note-card {
+  background: linear-gradient(135deg, rgba(var(--v-theme-warning), 0.1) 0%, rgba(var(--v-theme-warning), 0.05) 100%);
+
+  &:hover {
+    border-color: rgba(var(--v-theme-warning), 0.4);
+  }
+}
+</style>