diff --git a/ui/src/locales/lang/en-US/views/application-workflow.ts b/ui/src/locales/lang/en-US/views/application-workflow.ts
index 66215996d..3ac6c265c 100644
--- a/ui/src/locales/lang/en-US/views/application-workflow.ts
+++ b/ui/src/locales/lang/en-US/views/application-workflow.ts
@@ -19,7 +19,9 @@ export default {
     autoSave: 'Auto Save',
     latestRelease: 'Latest Release',
     copyParam: 'Copy Parameters',
-    debug: 'Run'
+    debug: 'Run',
+    exit: 'Exit',
+    exitSave: 'Save & Exit',
   },
   tip: {
     publicSuccess: 'Published successfully',
@@ -33,7 +35,8 @@ export default {
     repeatedNodeError: 'A node with this name already exists',
     cannotCopy: 'Cannot be copied',
     copyError: 'Node already copied',
-    paramErrorMessage: 'Parameter already exists: '
+    paramErrorMessage: 'Parameter already exists: ',
+    saveMessage: 'Current changes have not been saved. Save before exiting?',
   },
   delete: {
     confirmTitle: 'Confirm to delete this node?',
diff --git a/ui/src/locales/lang/zh-CN/views/application-workflow.ts b/ui/src/locales/lang/zh-CN/views/application-workflow.ts
index d9af86338..95d73605f 100644
--- a/ui/src/locales/lang/zh-CN/views/application-workflow.ts
+++ b/ui/src/locales/lang/zh-CN/views/application-workflow.ts
@@ -19,7 +19,9 @@ export default {
     autoSave: '自动保存',
     latestRelease: '最近发布',
     copyParam: '复制参数',
-    debug: '调试'
+    debug: '调试',
+    exit: '直接退出',
+    exitSave: '保存并退出',
   },
   tip: {
     publicSuccess: '发布成功',
@@ -33,7 +35,8 @@ export default {
     repeatedNodeError: '节点名称已存在！',
     cannotCopy: '不能被复制',
     copyError: '已复制节点',
-    paramErrorMessage: '参数已存在: '
+    paramErrorMessage: '参数已存在: ',
+    saveMessage: '当前的更改尚未保存，是否保存后退出?',
   },
   delete: {
     confirmTitle: '确定删除该节点？',
diff --git a/ui/src/locales/lang/zh-Hant/views/application-workflow.ts b/ui/src/locales/lang/zh-Hant/views/application-workflow.ts
index 8c8e10dd5..e3491eb77 100644
--- a/ui/src/locales/lang/zh-Hant/views/application-workflow.ts
+++ b/ui/src/locales/lang/zh-Hant/views/application-workflow.ts
@@ -19,7 +19,9 @@ export default {
     autoSave: '自動保存',
     latestRelease: '最近發布',
     copyParam: '複製參數',
-    debug: '調試'
+    debug: '調試',
+    exit: '直接退出',
+    exitSave: '保存並退出',
   },
   tip: {
     publicSuccess: '發布成功',
@@ -33,7 +35,8 @@ export default {
     repeatedNodeError: '節點名稱已存在！',
     cannotCopy: '不能被複製',
     copyError: '已複製節點',
-    paramErrorMessage: '參數已存在: '
+    paramErrorMessage: '參數已存在: ',
+    saveMessage: '當前修改未保存，是否保存後退出？',
   },
   delete: {
     confirmTitle: '確定刪除該節點？',
diff --git a/ui/src/views/application-workflow/index.vue b/ui/src/views/application-workflow/index.vue
index f359b028b..0a266885b 100644
--- a/ui/src/views/application-workflow/index.vue
+++ b/ui/src/views/application-workflow/index.vue
@@ -2,9 +2,7 @@
   <div class="application-workflow" v-loading="loading">
     <div class="header border-b flex-between p-12-24">
       <div class="flex align-center">
-        <back-button
-          @click="router.push({ path: `/application/${id}/WORK_FLOW/overview` })"
-        ></back-button>
+        <back-button @click="back"></back-button>
         <h4>{{ detail?.name }}</h4>
         <div v-if="showHistory && disablePublic">
           <el-text type="info" class="ml-16 color-secondary"
@@ -143,7 +141,7 @@ import DropdownMenu from '@/views/application-workflow/component/DropdownMenu.vu
 import PublishHistory from '@/views/application-workflow/component/PublishHistory.vue'
 import applicationApi from '@/api/application'
 import { isAppIcon } from '@/utils/application'
-import { MsgSuccess, MsgError } from '@/utils/message'
+import { MsgSuccess, MsgError, MsgConfirm } from '@/utils/message'
 import { datetimeFormat } from '@/utils/time'
 import useStore from '@/stores'
 import { WorkFlowInstance } from '@/workflow/common/validate'
@@ -175,6 +173,19 @@ const showHistory = ref(false)
 const disablePublic = ref(false)
 const currentVersion = ref<any>({})
 
+function back() {
+  MsgConfirm(t('common.tip'), t('views.applicationWorkflow.tip.saveMessage'), {
+    confirmButtonText: t('views.applicationWorkflow.setting.exitSave'),
+    cancelButtonText: t('views.applicationWorkflow.setting.exit'),
+    type: 'warning'
+  })
+    .then(() => {
+      saveApplication(true, true)
+    })
+    .catch(() => {
+      router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+    })
+}
 function clickoutsideHistory() {
   if (!disablePublic.value) {
     showHistory.value = false
@@ -347,14 +358,18 @@ function getDetail() {
   })
 }
 
-function saveApplication(bool?: boolean) {
+function saveApplication(bool?: boolean, back?: boolean) {
   const obj = {
     work_flow: getGraphData()
   }
+  loading.value = back || false
   application.asyncPutApplication(id, obj).then((res) => {
     saveTime.value = new Date()
     if (bool) {
       MsgSuccess(t('common.saveSuccess'))
+      if (back) {
+        router.push({ path: `/application/${id}/WORK_FLOW/overview` })
+      }
     }
   })
 }