diff --git a/src/assets/styles/theme.scss b/src/assets/styles/theme.scss
index 69d0ce24a60825a7f92cd41f8dcb2b2d1922180d..b76af6b24fe2f9093b8c06e79214c4bea3bc985b 100644
--- a/src/assets/styles/theme.scss
+++ b/src/assets/styles/theme.scss
@@ -16,6 +16,7 @@ body[theme='dark'] {
   --flow-instance-hover-color: #1F2329;
   --flow-instance-shadow: 0 4px 16px 0 rgba(253, 254, 255, 0.1);
   --flow-node-default-over-color: #25303E;
+  --flow-node-boder-default-over: #314265;
   --flow-node-success-over-color: #1F312A;
   --flow-node-error-over-color: #332127;
 }
@@ -37,7 +38,8 @@ body[theme='light'] {
   --o-flow-code-border: rgb(223,229,239);
   --flow-instance-hover-color: #FDFEFF;
   --flow-instance-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
-  --flow-node-default-over-color: #EEF3FE;
-  --flow-node-success-over-color: #E6F6E9;
-  --flow-node-error-over-color: #F8E7E7;
+  --flow-node-default-over-color: #edf2fd;
+  --flow-node-boder-default-over: #c7d6f5;
+  --flow-node-success-over-color: #e6f6e9;
+  --flow-node-error-over-color: #f8e7e7;
 }
diff --git a/src/views/app/index.vue b/src/views/app/index.vue
index 44eb2f6a3bedb075567e8503b063bc47a64b409d..241d585e76f3639ee4f9152215bdebfcb0a7351e 100644
--- a/src/views/app/index.vue
+++ b/src/views/app/index.vue
@@ -51,7 +51,11 @@
               <div class="appCenterCardContent">
                 <div class="appCenterCardContentTop">
                   <div class="appCenterCardContentTitle">{{ appItem.name }}</div>
-                  <div class="appCenterCardContentCollect" @click="handleFavorite($event, appItem)">
+                  <div
+                    class="appCenterCardContentCollect"
+                    :class="appItem.published ? '' : 'noClick'"
+                    @click.stop="handleFavorite($event, appItem)"
+                  >
                     <IconFavorite v-if="appItem.favorited" class="appFavorite" />
                     <IconUnfavorite v-else="appItem.favorited" />
                   </div>
@@ -68,6 +72,10 @@
                 <el-button text @click="handleDelApp($event, appItem)">删除</el-button>
               </div>
             </div>
+            <div class="unPublishSymbol" v-if="!appItem.published">
+              <div class="coverIcon"></div>
+              <div class="textDesc">未发布</div>
+            </div>
           </div>
         </div>
       </div>
@@ -159,6 +167,10 @@ const handleQueryAppList = (payload?: any) => {
 };
 
 const handleFavorite = (e, item) => {
+  // 未发布的不可收藏
+  if (!item.published) {
+    return;
+  }
   e.stopPropagation();
   api
     .changeSingleAppCollect({
@@ -225,16 +237,40 @@ onMounted(() => {
   handleQueryAppList();
 });
 </script>
-<style scoped>
-.container {
-  width: 100vw;
-  height: 100vh;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
+<style lang="scss" scoped>
+.appCenterCardSingle {
+  position: relative;
+  .unPublishSymbol {
+    position: absolute;
+    width: 56px;
+    height: 16px;
+    display: flex;
+    left: 8px;
+    top: -4px;
+    .coverIcon {
+      width: 0px;
+      height: 0px;
+      border: 2px;
+      border-color: #5481de #5481de transparent transparent;
+      border-left: 2px solid transparent;
+      border-top: 2px solid transparent;
+      border-right: 2px solid #5481de;
+      border-bottom: 2px solid #5481de;
+    }
+    .textDesc {
+      flex: 1;
+      line-height: 16px;
+      color: #fff;
+      text-align: center;
+      font-size: 12px;
+      border-top-right-radius: 4px;
+      border-bottom-left-radius: 4px;
+      background: #6395fd;
+    }
+  }
+  .noClick {
+    cursor: not-allowed;
+  }
 }
 
 img {
diff --git a/src/views/app/style.scss b/src/views/app/style.scss
index 607b3272cb2dfc84fd50757d29f322a5fd9cc473..96eb9d7e406ca6227ef8d1b0fbe19f4907ac8aa3 100644
--- a/src/views/app/style.scss
+++ b/src/views/app/style.scss
@@ -56,7 +56,7 @@
       }
     }
     .appCenterCardContainer {
-      margin-top: 16px;
+      padding-top: 16px;
       max-width: 1336px;
       max-height: calc(100vh - 327px);
       overflow-y: scroll;
diff --git a/src/views/createapp/components/workFlow.vue b/src/views/createapp/components/workFlow.vue
index b074b9c02e2ae9e7d95c8c43c660a1d6bb848f2c..4e30f6cb0d8897844320c013818b87b1c985b0da 100644
--- a/src/views/createapp/components/workFlow.vue
+++ b/src/views/createapp/components/workFlow.vue
@@ -18,7 +18,6 @@ import { useLayout } from './workFlowConfig/useLayout';
 import { IconSearch, IconCaretRight, IconCaretDown, IconPlusCircle } from '@computing/opendesign-icons';
 import EditYamlDrawer from './workFlowConfig/yamlEditDrawer.vue';
 import { api } from 'src/apis';
-import yaml from 'js-yaml';
 import { BranchSourceIdType } from './types';
 import { useRoute } from 'vue-router';
 
@@ -38,8 +37,8 @@ const flowZoom = ref(1);
 const debugDialogVisible = ref(false);
 const isNodeAndLineConnect = ref(false);
 const apiServiceList = ref([]);
+const allApiServiceList = ref([]);
 const yamlContent = ref();
-const hasWorkFlow = ref(true);
 const emits = defineEmits(['validateConnect']);
 const route = useRoute();
 const workFlowList = ref([]);
@@ -325,11 +324,23 @@ onMounted(() => {
     })
     .then(res => {
       apiServiceList.value = res[1]?.result.services;
+      allApiServiceList.value = res[1]?.result.services;
       activeName.value = [res[1]?.result.services[0]?.serviceId];
       activeNames.value = [res[1]?.result.services[0]?.serviceId];
     });
 });
 
+// 过滤工作流接口返回的可拖拽节点
+const searchApiList = () => {
+  apiServiceList.value = allApiServiceList.value.map(item => {
+    const filterObj = { ...item, nodeMetaDatas: [] };
+    if (item?.nodeMetaDatas) {
+      filterObj.nodeMetaDatas = item.nodeMetaDatas.filter(item => item?.name.includes(apiSearchValue.value));
+    }
+    return filterObj;
+  });
+};
+
 const handleDebugDialogOps = visible => {
   debugDialogVisible.value = visible;
 };
@@ -554,7 +565,7 @@ const saveFlow = () => {
       },
     )
     .then(res => {
-      if (res[1].result) {
+      if (res[1]?.result) {
         ElMessage.success('更新成功');
         queryFlow('update');
       }
@@ -582,6 +593,7 @@ defineExpose({
                 v-model="apiSearchValue"
                 class="o-style-search"
                 placeholder="搜索"
+                @input="searchApiList"
                 :prefix-icon="IconSearch"
                 clearable
               ></el-input>
@@ -609,7 +621,6 @@ defineExpose({
                   </div>
                 </el-collapse-item>
               </el-collapse>
-              <div style="display: none" @click="updateNodeTest">测试状态修改（暂不显示）</div>
             </div>
           </div>
         </div>
diff --git a/src/views/createapp/components/workFlowConfig/BranchNode.vue b/src/views/createapp/components/workFlowConfig/BranchNode.vue
index 2c1dd27a1ca29e7549f29ea9d67cc47a03ef20f0..feb83a41a3ed85cda7216eb0fb019842dd65ce7d 100644
--- a/src/views/createapp/components/workFlowConfig/BranchNode.vue
+++ b/src/views/createapp/components/workFlowConfig/BranchNode.vue
@@ -24,6 +24,8 @@ const emits = defineEmits(['delNode', 'editYamlDrawer']);
 
 const statusList = ref(['waiting', 'success', 'error', 'default']);
 
+const branchIdList = ref([]);
+
 const curStatus = ref('');
 
 watch(
@@ -35,6 +37,9 @@ watch(
     } else {
       curStatus.value = props.data?.status;
     }
+    if (props.data?.parameters?.input_parameters?.choices) {
+      branchIdList.value = props.data?.parameters?.input_parameters?.choices.map(item => item?.branchId);
+    }
   },
   { deep: true, immediate: true },
 );
@@ -54,6 +59,7 @@ const editYaml = (nodeName, yamlCode) => {
     <Handle type="target" :position="Position.Left"></Handle>
     <div class="outHandleRing outRingLeft"></div>
     <div class="delOverShadow leftBox"></div>
+    <div class="delOverShadow leftNodeBox"></div>
     <div class="nodeBox">
       <div class="title" v-if="props.data.name">
         <div class="iconStyle"></div>
@@ -61,36 +67,23 @@ const editYaml = (nodeName, yamlCode) => {
         <div class="moreTip">
           <el-popover placement="right" trigger="hover" popper-class="nodeDealPopper">
             <template #reference>···</template>
-            <el-button text class="dealItem" @click="editYaml(props.data.name, props.data.parameters)"
-              >编辑</el-button
-            >
+            <el-button text class="dealItem" @click="editYaml(props.data.name, props.data.parameters)">编辑</el-button>
             <el-button text class="dealItem" @click="delNode(props.id)">删除</el-button>
           </el-popover>
         </div>
       </div>
       <div class="desc" v-if="props.data.description">{{ props.data.description }}</div>
       <div class="branchDesc" v-if="props.data.parameters?.input_parameters?.choices">
-        <div v-for="(item, index) in props.data.parameters.input_parameters.choices" :key="index"> {{ item.description }}</div>
+        <div class="branchItem" v-for="(item, index) in props.data.parameters.input_parameters.choices" :key="index">
+          {{ item.description }}
+
+          <Handle class="souceFirstHandle" :id="branchIdList[index]" type="source" :position="Position.Right"></Handle>
+
+          <div class="delOverShadow rightBox" style="top: 0%"></div>
+          <div class="outHandleRing outRingRight" style="top: 30%"></div>
+        </div>
       </div>
     </div>
-    <Handle
-      class="souceFirstHandle"
-      :connectable="props.data?.isConnectSourceA"
-      :id="BranchSourceIdType.SOURCEA"
-      type="source"
-      :position="Position.Right"
-    ></Handle>
-    <Handle
-      class="souceSecondHandle"
-      :connectable="props.data?.isConnectSourceB"
-      :id="BranchSourceIdType.SOURCEB"
-      type="source"
-      :position="Position.Right"
-    ></Handle>
-    <div class="delOverShadow rightBox" style="top: 0%"></div>
-    <div class="delOverShadow rightBox" style="top: 50%"></div>
-    <div class="outHandleRing outRingRight" style="top: 30%"></div>
-    <div class="outHandleRing outRingRight" style="top: 70%"></div>
   </div>
 </template>
 
@@ -103,6 +96,30 @@ const editYaml = (nodeName, yamlCode) => {
     .vue-flow__handle-right.souceSecondHandle {
       top: 70%;
     }
+    // 分支样式
+    .branchDesc {
+      font-size: 12px;
+      .branchItem {
+        position: relative;
+        margin-bottom: 8px;
+        .vue-flow__handle-right {
+          right: -18px;
+        }
+        &:last-child {
+          margin-bottom: 0px;
+        }
+      }
+    }
+    &:hover {
+      .branchItem {
+        .vue-flow__handle-right {
+          right: -30px;
+        }
+        .rightBox {
+          display: none;
+        }
+      }
+    }
   }
 }
 </style>
diff --git a/src/views/createapp/components/workFlowConfig/workFlowDialog.vue b/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
index e5a6c5573a7fe16f454deadc683e8c39ed687551..8564ce75bf488b53065e357c14fbac6b61280bc5 100644
--- a/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
+++ b/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
@@ -17,7 +17,7 @@
           clearable
         ></el-input>
       </el-form-item>
-      <el-form-item prop="desc" label="工作流描述">
+      <el-form-item prop="description" label="工作流描述">
         <el-input
           type="textarea"
           show-word-limit
@@ -31,7 +31,7 @@
     </el-form>
     <template #footer>
       <span class="dialog-footer">
-        <el-button class="o-dlg-btn" type="primary" size="small" @click="handleSubmit">确定</el-button>
+        <el-button class="o-dlg-btn" type="primary" size="small" @click="handleSubmit(workFlowForm)">确定</el-button>
         <el-button class="o-dlg-btn" size="small" @click="onCancel">取消</el-button>
       </span>
     </template>
@@ -42,7 +42,7 @@ import { ref } from 'vue';
 import { api } from 'src/apis';
 import { useRoute } from 'vue-router';
 import { v4 as uuidv4 } from 'uuid';
-import { ElMessage } from 'element-plus';
+import { ElMessage, FormInstance } from 'element-plus';
 const workFlowDiaVisible = ref(true);
 const route = useRoute();
 const props = defineProps({
@@ -66,74 +66,78 @@ const workFlowRules = ref({
 const onCancel = () => {
   emits('handleClose');
 };
-const handleSubmit = () => {
-  // 创建工作流
-  const appId = route.query?.appId;
-  // 创建使用生成的flowId
-  const flowId = uuidv4();
-  // 调用接口新建工作流
-  api
-    .createOrUpdateFlowTopology(
-      {
-        appId: appId,
-        flowId,
-        topologyCheck: false,
-      },
-      {
-        flow: {
-          name: workFlowData.value.name,
-          description: workFlowData.value.description,
-          enable: true,
-          editable: true,
-          // 创建工作流时，默认包含开始结束固定两节点，这两个节点非后端返回，其apiId与serviceId不为空即可
-          nodes: [
-            {
-              apiId: 'startId',
-              name: '开始',
-              serviceId: 'startService',
-              type: 'start',
-              description: 'startNode',
-              editable: false,
+const handleSubmit = (formEl: FormInstance | undefined) => {
+  // 校验必填项是否填写
+  formEl?.validate(valid => {
+    if (valid) {
+      // 创建工作流
+      const appId = route.query?.appId;
+      // 创建使用生成的flowId
+      const flowId = uuidv4();
+      // 调用接口新建工作流
+      api
+        .createOrUpdateFlowTopology(
+          {
+            appId: appId,
+            flowId,
+            topologyCheck: false,
+          },
+          {
+            flow: {
+              name: workFlowData.value.name,
+              description: workFlowData.value.description,
               enable: true,
-              nodeId: 'node1',
-              position: {
-                x: 100,
-                y: 160,
-              },
+              editable: true,
+              // 创建工作流时，默认包含开始结束固定两节点，这两个节点非后端返回，其apiId与serviceId不为空即可
+              nodes: [
+                {
+                  apiId: 'startId',
+                  name: '开始',
+                  serviceId: 'startService',
+                  type: 'start',
+                  description: 'startNode',
+                  editable: false,
+                  enable: true,
+                  nodeId: 'node1',
+                  position: {
+                    x: 100,
+                    y: 160,
+                  },
+                },
+                {
+                  apiId: 'endId',
+                  name: '结束',
+                  serviceId: 'endService',
+                  type: 'end',
+                  description: 'endNode',
+                  editable: false,
+                  enable: true,
+                  nodeId: 'node2',
+                  position: {
+                    x: 600,
+                    y: 160,
+                  },
+                },
+              ],
+              // 初始创建的工作流边为空
+              edges: [],
             },
-            {
-              apiId: 'endId',
-              name: '结束',
-              serviceId: 'endService',
-              type: 'end',
-              description: 'endNode',
-              editable: false,
-              enable: true,
-              nodeId: 'node2',
-              position: {
-                x: 600,
-                y: 160,
-              },
+            focusPoint: {
+              x: 800,
+              y: 800,
             },
-          ],
-          // 初始创建的工作流边为空
-          edges: [
-          ],
-        },
-        focusPoint: {
-          x: 800,
-          y: 800,
-        },
-      },
-    )
-    .then(res => {
-      if (res[1]?.result?.flow) {
-        ElMessage.success('创建成功');
-        // 将创建成功后的flow对象传给父组件
-        emits('createFlowId', {...res[1].result.flow});
-        onCancel();
-      }
-    });
+          },
+        )
+        .then(res => {
+          if (res[1]?.result?.flow) {
+            ElMessage.success('创建成功');
+            // 将创建成功后的flow对象传给父组件
+            emits('createFlowId', { ...res[1].result.flow });
+            onCancel();
+          }
+        });
+    }
+  });
 };
 </script>
 <style lang="scss">
diff --git a/src/views/createapp/index.vue b/src/views/createapp/index.vue
index 92f0edc97dea392c822a26dc482bcb4a8ae801a0..ee4a056716b529eebb9f2de9e8ad20c015d60d31 100644
--- a/src/views/createapp/index.vue
+++ b/src/views/createapp/index.vue
@@ -25,34 +25,16 @@ const handleChangeAppType = type => {
 };
 
 const handlePulishApp = () => {
-  let appFormValue = appConfigRef.value.createAppForm;
-  if (appFormValue) {
-    api
-      .createOrUpdateApp({
-        appId: route.query?.appId as string,
-        icon: appFormValue.icon,
-        name: appFormValue.name,
-        description: appFormValue.description,
-        links: appFormValue.links.map(item => {
-          return { url: item, title: item };
-        }),
-        recommendedQuestions: appFormValue.recommendedQuestions,
-        dialogRounds: appFormValue.dialogRounds,
-        permission: appFormValue.permission,
-      })
-      .then(res => {
-        if (res[1]) {
-          ElMessage({
-            showClose: true,
-            message: '修改成功',
-            icon: IconSuccess,
-            customClass: 'o-message--success',
-            duration: 2000,
-          });
-          router.push('/app');
-        }
-      });
-  }
+  // 发布接口
+  api
+    .releaseSingleAppData({
+      id: route.query?.appId as string,
+    })
+    .then(res => {
+      if (res[1]?.result) {
+        ElMessage.success('发布成功');
+      }
+    });
 };
 
 const handleValidateContent = valid => {
@@ -65,14 +47,46 @@ const validateConnect = valid => {
 };
 
 // 获取工作流列表
-const getFlowList = (flowDataList) => {
+const getFlowList = flowDataList => {
   flowList.value = flowDataList;
-}
+};
 
-// 保存当前工作流
-const saveFlow = () => {
-  workFlowRef.value.saveFlow();
-}
+// 保存按钮
+const saveConfigOrFlow = () => {
+  console.log(createAppType.value, 'createAppType');
+  if (createAppType.value === 'appConfig') {
+    let appFormValue = appConfigRef.value.createAppForm;
+    if (appFormValue) {
+      api
+        .createOrUpdateApp({
+          appId: route.query?.appId as string,
+          icon: appFormValue.icon,
+          name: appFormValue.name,
+          description: appFormValue.description,
+          links: appFormValue.links.map(item => {
+            return { url: item, title: '' };
+          }),
+          recommendedQuestions: appFormValue.recommendedQuestions,
+          dialogRounds: appFormValue.dialogRounds,
+          permission: appFormValue.permission,
+        })
+        .then(res => {
+          if (res[1]) {
+            ElMessage({
+              showClose: true,
+              message: '更新成功',
+              icon: IconSuccess,
+              customClass: 'o-message--success',
+              duration: 2000,
+            });
+          }
+        });
+    }
+  } else {
+    // 工作流页面保存当前的工作流
+    workFlowRef.value.saveFlow();
+  }
+};
 watch(
   () => router,
   () => {
@@ -126,9 +140,9 @@ const handleJumperAppCenter = () => {
     </div>
     <div class="createAppContainerFooter">
       <el-button>取消</el-button>
-      <el-button @click="saveFlow">保存</el-button>
+      <el-button @click="saveConfigOrFlow">保存</el-button>
       <el-button :disabled="true">预览</el-button>
-      <el-button type="primary" :disabled="publishValidate" @click="handlePulishApp()">发布</el-button>
+      <el-button type="primary" @click="handlePulishApp()">发布</el-button>
     </div>
   </div>
 </template>
diff --git a/src/views/styles/workFlowArrange.scss b/src/views/styles/workFlowArrange.scss
index b063ff813c74807359b55bcaa5196f0fd8772329..97f61221f43941de7f363f304b815af1270094c1 100644
--- a/src/views/styles/workFlowArrange.scss
+++ b/src/views/styles/workFlowArrange.scss
@@ -266,13 +266,13 @@
     height: fit-content;
     border-radius: 4px;
     border: 4px solid transparent;
-    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.1);
-    background-color: var(--o-bg-color-base);
     position: relative;
     .nodeBox {
       min-height: 78px;
       padding: 16px 18px;
       display: flex;
+      background-color: var(--o-bg-color-base);
+      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.1);
       flex-direction: column;
       gap: 8px;
       .title {
@@ -373,21 +373,29 @@
     }
     .delOverShadow {
       width: 8px;
-      height: 60%;
+      height: 40px;
       position: absolute;
       background-color: transparent;
-      top: 20%;
+      top: calc(50% - 20px);
       z-index: 1;
     }
     .leftBox {
       left: -12px;
     }
+
+    .leftNodeBox {
+      width: 4px;
+      left: -4px;
+    }
     .rightBox {
       right: -12px;
     }
     &:hover {
       border: 4px solid rgba(99, 149, 253, 0.3);
       box-shadow: 0px 0px 0px 8px rgba(99, 149, 253, 0.1);
+      .customNodeStyle {
+        width: 328px;
+      }
       .vue-flow__handle-left {
         width: 24px;
         height: 24px;
@@ -431,6 +439,9 @@
       .leftBox {
         background-color: var(--flow-node-default-over-color);
       }
+      .leftNodeBox {
+        background-color: var(--flow-node-boder-default-over);
+      }
       .rightBox {
         background-color: var(--flow-node-default-over-color);
       }