feat(WorkflowAdd): 添加工作流发布与取消按钮并实现表单提交逻辑

新增了发布工作流和取消按钮，实现了表单提交功能，包括表单验证和消息提示。

src/pages/WorkflowAdd.vue

@@ -82,6 +82,10 @@
           </el-input>
         </el-form-item>
       </div>
+      <div class="mt20">
+        <el-button type="primary" class="font_size16" @click="submitForm">发布工作流</el-button>
+        <el-button class="font_size16" @click="goBack">取消</el-button>
+      </div>
     </el-form>
   </div>
 </template>
@@ -118,7 +122,8 @@ const editorContent = ref(
     }
   ]
 );
-
+// 表单实例
+const ruleFormRef = ref(null)
 const ruleForm = reactive({
   name: '',
 })
@@ -134,6 +139,18 @@ const rules = reactive({
 onMounted(() => {
 });
 
+// 提交表单
+const submitForm = async () => {
+  await ruleFormRef.value.validate((valid, fields) => {
+    console.log(valid, fields)
+    if (!valid) {
+      DGTMessage.warning(fields.name[0].message)
+      return
+    }
+    DGTMessage.success('表单提交成功')
+  })
+}
+
   // 上传成功处理
 const handleUploadSuccess = (response, rawFile, uploadedFiles) => {
   DGTMessage.success('文件上传成功')