diff --git a/src/assets/styles/theme.scss b/src/assets/styles/theme.scss
index 5314e56a460400c592bc3fbc4bad3dec1fc8fa7c..71318e03f93d152d70282993442aea2ca7e782f6 100644
--- a/src/assets/styles/theme.scss
+++ b/src/assets/styles/theme.scss
@@ -19,6 +19,7 @@ body[theme='dark'] {
   --flow-nodeBox-shadow: 0 8px 16px 0 rgba(253, 254, 255, 0.1);
   // 工作流节点背景色
   --flow-bg-color: #343a43;
+  --o-bash-box-shadow:  0 4px 16px 0 rgba(255, 255, 255, 0.1);
   // 工作流开始节点结束背景渐变色
   --flow-startEnd-bg: linear-gradient(rgba(132, 149, 253, 0.3), rgba(104, 113, 129, 0.15), rgba(52, 58, 67, 0));
   --flow-system-bg: linear-gradient(rgba(113, 225, 229, 0.3), rgba(97, 119, 121, 0.15), rgba(52, 58, 67, 0));
@@ -62,7 +63,8 @@ body[theme='light'] {
   --flow-instance-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
   --flow-nodeBox-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
   // 工作流节点背景色
-  --flow-bg-color: #fff;
+  --flow-bg-color: #fdfeff;
+  --o-bash-box-shadow:  0 4px 16px 0 rgba(42, 47, 55, 0.1);
   // 工作流开始节点结束背景渐变色
   --flow-startEnd-bg: linear-gradient(rgba(133, 148, 253, 0.3), rgba(210, 231, 252, 0.15), rgba(255, 255, 255, 0));
   --flow-system-bg: linear-gradient(rgba(156, 237, 203, 0.3), rgba(240, 253, 244, 0.15), rgba(255, 255, 255, 0));
diff --git a/src/components/Upload/index.vue b/src/components/Upload/index.vue
index 4efbfac77bf3b4128ee0139fb4377658aa791095..4bff0ff366f0c580fac39bf60b965b48509ea9df 100644
--- a/src/components/Upload/index.vue
+++ b/src/components/Upload/index.vue
@@ -217,6 +217,18 @@ watch(
     }
   },
 );
+
+const updateFunc = () => {
+  const foldDoms = document.querySelectorAll('span[title="Fold line"]');
+  foldDoms.forEach(dom => {
+    dom.innerText = '';
+  });
+
+  const unFoldDoms = document.querySelectorAll('span[title="Unfold line"]');
+  unFoldDoms.forEach(dom => {
+    dom.innerText = '';
+  });
+};
 onMounted(() => {
   if (themeStore.theme === 'dark') {
     extensions.value = [yaml(), oneDark];
@@ -281,6 +293,7 @@ onMounted(() => {
       :extensions="extensions"
       :disabled="!editable"
       @ready="handleReady"
+      @update="updateFunc"
       @change="handleChange"
     />
   </div>
@@ -326,7 +339,7 @@ onMounted(() => {
   </div>
 </template>
 
-<style scoped>
+<style lang="scss" scoped>
 .serviceName{
   display: block;
   font-size: 14px;
@@ -341,11 +354,30 @@ onMounted(() => {
 .v-codemirror {
   height: 100%;
   width: 100%;
-  .cm-editor {
+  ::v-deep(.cm-editor) {
     height: 100%;
     border: 1px solid var(--o-time-text);
     .cm-gutters {
       background-color: var(--o-bash-bg);
+      span[title='Fold line'] {
+        width: 0;
+        height: 0;
+        display: block;
+        border: 4px solid transparent;
+        border-top: 4px solid #8d98aa;
+        margin-top: 8px;
+        padding: 0;
+      }
+      span[title='Unfold line'] {
+        width: 0;
+        height: 0;
+        display: block;
+        border: 4px solid transparent;
+        border-left: 4px solid #8d98aa;
+        margin-top: 6px;
+        margin-left: 4px;
+        padding: 0;
+      }
     }
   }
   .cm-focused {
diff --git a/src/views/createapp/components/appConfig.vue b/src/views/createapp/components/appConfig.vue
index a9525453513728ac5dbce881803d9090532bd7d6..fbec5911abd0051aaf51f8ad0809aa17e9754ec4 100644
--- a/src/views/createapp/components/appConfig.vue
+++ b/src/views/createapp/components/appConfig.vue
@@ -8,8 +8,10 @@ import { api } from 'src/apis';
 import CustomLoading from '../../customLoading/index.vue';
 import AppInitalPreview from 'src/views/dialogue/components/AppInitalPreview.vue';
 import { ElMessage } from 'element-plus';
+import { useChangeThemeStore } from 'src/store';
 const activeName = ref([1, 2, 3]);
 const activeNames = ref([1, 2, 3]);
+const themeStore = useChangeThemeStore();
 const route = useRoute();
 const props = withDefaults(defineProps<{
   handleValidateContent: Function,
@@ -425,7 +427,7 @@ defineExpose({
   </el-form>
   <div class="createAppContainerMainBox">
     <div class="previewTitle">界面预览</div>
-    <div class="createAppContainerMainRight">
+    <div class="createAppContainerMainRight" :class="themeStore.theme">
       <AppInitalPreview :createAppForm="createAppForm" />
     </div>
   </div>
diff --git a/src/views/createapp/components/codeMirror/mirrorTextArea.vue b/src/views/createapp/components/codeMirror/mirrorTextArea.vue
index 08504db3f81760066984a6021eb074593a20b3ed..82e7eb7de2a9cd2d37f54974937619851285cc8c 100644
--- a/src/views/createapp/components/codeMirror/mirrorTextArea.vue
+++ b/src/views/createapp/components/codeMirror/mirrorTextArea.vue
@@ -50,11 +50,11 @@ const updateFunc = () => {
   });
 };
 </script>
-<style lang="scss">
+<style lang="scss" scoped>
 .v-codemirror {
   height: 100%;
   width: 100%;
-  .cm-editor {
+  ::v-deep(.cm-editor) {
     height: 100%;
     border: 1px solid var(--o-time-text);
     .cm-gutters {
diff --git a/src/views/createapp/components/workFlowConfig/useLayout.js b/src/views/createapp/components/workFlowConfig/useLayout.js
index a5239dbcae8e67a6a2480e699988f3c58dc9dd25..5ae8340cbb350e20574d09b6a969028f2cc5cf04 100644
--- a/src/views/createapp/components/workFlowConfig/useLayout.js
+++ b/src/views/createapp/components/workFlowConfig/useLayout.js
@@ -33,16 +33,13 @@ export function useLayout() {
     for (const node of nodes) {
       // 查找到节点的信息
       const graphNode = findNode(node.id);
+      // 获取到所有节点中最高的高度，之后可计算每个节点与最高高度差设置y，使得节点的中心点都在同一水平线上
       maxHeight = maxHeight > graphNode.dimensions.height ? maxHeight : graphNode.dimensions.height;
     }
 
     for (const node of nodes) {
       // 查找到节点的信息
       const graphNode = findNode(node.id);
-      const newNode = {
-        width: graphNode.dimensions.width + 100 || 150,
-        height: graphNode.dimensions.height + 100 || 50,
-      };
 
       // 设置节点
       dagreGraph.setNode(node.id, {
@@ -64,17 +61,16 @@ export function useLayout() {
       const nodeWithPosition = dagreGraph.node(node.id);
       let diff = maxHeight - nodeWithPosition.height;
       let position = { x: nodeWithPosition.x, y: nodeWithPosition.y + diff / 2 };
-      let newPosition = { x: nodeWithPosition.x, y: nodeWithPosition.y + diff / 2 };
       // 需要进行判断--是否为开始结束
       if (node.id === 'start' || node.id === 'end') {
-        newPosition = { x: nodeWithPosition.x + 112, y: nodeWithPosition.y + diff / 2 };
+        position = { x: nodeWithPosition.x + 112, y: nodeWithPosition.y + diff / 2 };
       }
 
       return {
         ...node,
         targetPosition: isHorizontal ? Position.Left : Position.Top,
         sourcePosition: isHorizontal ? Position.Right : Position.Bottom,
-        position: newPosition, // 这里修改即可
+        position: position, // 这里修改即可
       };
     });
   }
diff --git a/src/views/createapp/components/workFlowDebug.vue b/src/views/createapp/components/workFlowDebug.vue
index 54dbc9bb2ea21be656e69142171fd02c8dbdb686..c7a7214458e74bb79e066f07679ddf7784355683 100644
--- a/src/views/createapp/components/workFlowDebug.vue
+++ b/src/views/createapp/components/workFlowDebug.vue
@@ -45,7 +45,7 @@
         <!-- 发送问题 -->
         <div class="sendIcon">
           <img v-if="isAnswerGenerating || dialogueInput.length <= 0" src="@/assets/images/send_disable.png" alt="" />
-          <div v-else @click="handleSendMessage(undefined, dialogueInput)">
+          <div v-else @click="handleSendMessage(undefined, dialogueInput)" class="ableSend">
             <img v-if="themeStore.theme === 'dark'" src="@/assets/images/dark_send.png" alt="" />
             <img v-else src="@/assets/images/light_send.png" alt="" />
           </div>
diff --git a/src/views/dialogue/components/AppInitalPreview.vue b/src/views/dialogue/components/AppInitalPreview.vue
index d2194870f661b113fde4cbb04a2e45c79461f772..33dd1ab0bf59467bd7459be5c2f985e1ec61dcea 100644
--- a/src/views/dialogue/components/AppInitalPreview.vue
+++ b/src/views/dialogue/components/AppInitalPreview.vue
@@ -17,11 +17,15 @@
       </div>
     </div>
   </div>
+  <footer class="copilot-footer">
+    <CommonFooter />
+  </footer>
 </template>
 <script setup lang="ts">
 import { ref, watch } from 'vue';
 import InterPreview from 'src/views/dialogue/components/InterPreview.vue';
 import { useChangeThemeStore } from 'src/store';
+import CommonFooter from 'src/components/commonFooter/CommonFooter.vue';
 const themeStore = useChangeThemeStore();
 interface InterPreProps {
   createAppForm: any;
@@ -78,6 +82,10 @@ watch(
     border-radius: 2px;
   }
 
+  .dialogue-conversation-bottom-sendbox__upload {
+    cursor: default;
+  }
+
   &__textarea {
     height: 60%;
     position: relative;
diff --git a/src/views/styles/createApp.scss b/src/views/styles/createApp.scss
index 3d57a8ed404bb4cc403b08b0bd642723978bbf5d..4c671aa7ad65c12e365462c75861a1b9baea4b55 100644
--- a/src/views/styles/createApp.scss
+++ b/src/views/styles/createApp.scss
@@ -123,6 +123,10 @@
       margin-bottom: 12px;
     }
   }
+  .createAppContainerMainRight.dark {
+    background: var(--o-bg-image) center center no-repeat;
+    background-size: cover;
+  }
 
   .createAppContainerMainLeft {
     width: 536px;
diff --git a/src/views/styles/workFlowArrange.scss b/src/views/styles/workFlowArrange.scss
index 9954021b5d2ea6e20f8384f6e73f719f0c91c339..c7e08e5ca32ec9bdbe08288fe0a87c9941f99a2b 100644
--- a/src/views/styles/workFlowArrange.scss
+++ b/src/views/styles/workFlowArrange.scss
@@ -118,19 +118,22 @@
       .el-collapse {
         .el-collapse-item__header {
           padding: 0 !important;
-          height: 28px;
+          height: 24px;
+          line-height: 24px;
           font-size: 14px;
           color: var(--o-text-color-primary);
           display: flex;
           gap: 8px;
           text-align: left;
           flex-wrap: nowrap;
+          margin-bottom: 8px;
           .el-icon {
             color: var(--o-text-color-tertiary);
           }
         }
         .el-collapse-item__content {
           margin-left: 0px;
+          margin-bottom: 0px;
         }
       }
     }
@@ -158,13 +161,17 @@
     .nodeIcon {
       width: 24px;
       height: 24px;
-      background: gray;
       border-radius: 4px;
     }
     .stancesName {
       flex: 1;
       text-align: left;
     }
+    &:hover {
+      background-color: var(--flow-bg-color);
+      box-shadow: var(--o-bash-box-shadow);
+      cursor: pointer;
+    }
   }
   .workFlowContainerRight {
     position: relative;
@@ -188,6 +195,7 @@
         width: 32px;
         height: 32px;
         background: var(--o-bg-color-base);
+        border-radius: 4px;
         cursor: pointer;
         img {
           width: 100%;
diff --git a/src/views/styles/workFlowDebug.scss b/src/views/styles/workFlowDebug.scss
index 57c8079ce4b2b9563998e7aac6fd4f66cbd72b7a..81ffd90000d52c24970648c43cc7383de4d623c5 100644
--- a/src/views/styles/workFlowDebug.scss
+++ b/src/views/styles/workFlowDebug.scss
@@ -72,6 +72,9 @@
       .sendIcon {
         width: 48px;
         height: 32px;
+        .ableSend {
+          cursor: pointer;
+        }
         img {
           width: 32px;
         }