feat: 优化用户界面和交互提示

src/components/dialog/WorkflowAddDialog.vue

@@ -24,7 +24,7 @@ const workflowForm = ref<Workflow>({
 // 提示框
 const $toast = useToast()
 
-// 调用API 新增工作流
+// 调用API 新增任务
 async function addWorkflow() {
   if (!workflowForm.value.name || !workflowForm.value.timer) {
     $toast.error('请填写完整信息！')
@@ -34,10 +34,10 @@ 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)
@@ -48,7 +48,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="新建任务" class="rounded-t">
       <DialogCloseBtn @click="emit('close')" />
       <VDivider />
       <VCardText>
@@ -60,7 +60,7 @@ async function addWorkflow() {
                 label="别名"
                 :rules="[requiredValidator]"
                 persistent-hint
-                hint="工作流名称"
+                hint="任务名称"
               />
             </VCol>
             <VCol cols="12">
@@ -70,11 +70,11 @@ async function addWorkflow() {
                 :rules="[requiredValidator]"
                 placeholder="5位cron表达式"
                 persistent-hint
-                hint="工作流执行周期"
+                hint="任务执行周期"
               />
             </VCol>
             <VCol cols="12">
-              <VTextarea v-model="workflowForm.description" label="工作流描述" />
+              <VTextarea v-model="workflowForm.description" label="任务描述" />
             </VCol>
           </VRow>
         </VForm>

src/components/dialog/WorkflowEditDialog.vue

@@ -29,11 +29,16 @@ const emit = defineEmits(['close', 'save'])
       <!-- Toolbar -->
       <div>
         <VToolbar color="primary">
-          <VToolbarTitle>编辑工作流 - {{ workflow?.name }}</VToolbarTitle>
+          <VToolbarItems>
+            <VBtn icon @click="emit('close')" class="ms-3">
+              <VIcon size="large" color="white" icon="mdi-close" />
+            </VBtn>
+          </VToolbarItems>
+          <VToolbarTitle> 编辑流程 - {{ workflow?.name }} </VToolbarTitle>
           <VSpacer />
           <VToolbarItems>
-            <VBtn icon variant="plain" @click="emit('close')" class="me-3">
-              <VIcon size="large" color="white" icon="ri-close-line" />
+            <VBtn icon @click="emit('save')" class="me-5">
+              <VIcon size="large" color="white" icon="mdi-content-save" />
             </VBtn>
           </VToolbarItems>
         </VToolbar>
@@ -50,10 +55,10 @@ const emit = defineEmits(['close', 'save'])
               <p v-if="isDragOver">Drop here</p>
             </DropzoneBackground>
           </VueFlow>
-
           <Sidebar />
-        </div> </VCardText
-    ></VCard>
+        </div>
+      </VCardText>
+    </VCard>
   </VDialog>
 </template>
 <style>