diff --git a/src/assets/styles/electron/linux.scss b/src/assets/styles/electron/linux.scss
index b4a8ee7d74825216034554c8bd57a75fa647d4cc..b423f1e30923674146497364c266fa7cbb7359b2 100644
--- a/src/assets/styles/electron/linux.scss
+++ b/src/assets/styles/electron/linux.scss
@@ -62,47 +62,3 @@ html.platform-linux {
     }
   }
 }
-
-.electron-env {
-  .dialogue-panel {
-    width: 920px !important;
-  }
-  .dialogue-conversation-bottom {
-    width: 800px !important;
-  }
-  .inital-panel {
-    width: 900px !important;
-    .container {
-      padding-left: 60px;
-    }
-    .eg .eg-list-item {
-      width: 175px !important;
-    }
-    .question {
-      height: 320px !important;
-    }
-  }
-}
-
-@media (min-width: 1441px) {
-  .electron-env {
-    .dialogue-conversation-bottom {
-      width: 920px !important;
-    }
-    .dialogue-panel {
-      width: 1040px !important;
-    }
-    .inital-panel {
-    width: 920px !important;
-    .container {
-      padding-left: 60px;
-    }
-    .eg .eg-list-item {
-      width: 175px !important;
-    }
-    .question {
-      height: 320px !important;
-    }
-  }
-}
-}
diff --git a/src/components/commonFooter/CommonFooter.vue b/src/components/commonFooter/CommonFooter.vue
index 313d55929b9d385886f01b3722b47d0a71321750..d1b9946d534f796b9e1afab6d41a0b8c37c19d6f 100644
--- a/src/components/commonFooter/CommonFooter.vue
+++ b/src/components/commonFooter/CommonFooter.vue
@@ -75,6 +75,7 @@ const readPolicy = async () => {
   display: flex;
   justify-content: center;
   align-items: center;
+  line-height: 16px;
   span {
     font-size: 12px;
     color: var(--o-text-color-tertiary);
diff --git a/src/components/dialoguePanel/DialoguePanel.scss b/src/components/dialoguePanel/DialoguePanel.scss
index f5a4f48fbb9c54c4a0016261aef46e10e3d89eb6..cef4685c32173d2e42483bf9673e7b3e91b6c2ae 100644
--- a/src/components/dialoguePanel/DialoguePanel.scss
+++ b/src/components/dialoguePanel/DialoguePanel.scss
@@ -214,8 +214,8 @@
   }
 }
 .dialogue-panel {
-  width: 1128px;
-  padding: 0 60px;
+  width: calc(100% - 176px);
+  max-width: 1000px;
   &__user {
     position: relative;
     margin-bottom: 24px;
@@ -505,11 +505,11 @@
 .workFlowDebugStyle {
   width: auto;
   padding-right: 24px;
+  padding-left: 64px;
   .loading {
     display: none;
   }
   .dialogue-panel__content {
-    gap: 16px;
     .content {
       margin-left: 0px;
       min-height: 48px;
@@ -536,9 +536,6 @@
       .loading-echarts {
         display: none;
       }
-      &::before {
-        left: 0;
-      }
     }
   }
   // 调试抽屉中不需要显示底部反对等功能图标
diff --git a/src/components/sessionCard/SessionCard.vue b/src/components/sessionCard/SessionCard.vue
index eeb5b151fa3ff1c5cfc65269a3543faadb346c7a..e894eb49000ee13e1208afcab96193d676403833 100644
--- a/src/components/sessionCard/SessionCard.vue
+++ b/src/components/sessionCard/SessionCard.vue
@@ -267,7 +267,7 @@ const deleteOne = (name: string, list: string[]) => {
 }
 
 .conversation-card {
-  width: calc(100% - 18px);
+  width: 264px;
   &:last-child .conversation-card-item {
     margin-bottom: 0px;
   }
@@ -287,8 +287,7 @@ const deleteOne = (name: string, list: string[]) => {
     &__box {
       flex: 1;
       border-radius: 8px;
-      // width: 100%;
-      width: 202px;
+      height: 66px;
       background-color: var(--o-bg-color-light);
       padding: 0px 5px 12px 15px;
       display: flex;
@@ -301,8 +300,7 @@ const deleteOne = (name: string, list: string[]) => {
           rgba(109, 117, 250, 0.1),
           rgba(90, 179, 255, 0.1)
         );
-        outline: 1px solid #7aa5ff;
-        // border: -1px solid transparent;
+        box-shadow: inset 0 0 0 1px #7aa5ff;
         .conversation-title__button {
           display: flex;
 
diff --git a/src/views/dialogue/Copilot.vue b/src/views/dialogue/Copilot.vue
index 9dc3a91bafe63452d185898d5ebd96bce51a0545..c93cbbed9afdb7bd0f96ac7eaa5ccf01c2251455 100644
--- a/src/views/dialogue/Copilot.vue
+++ b/src/views/dialogue/Copilot.vue
@@ -108,9 +108,7 @@ onMounted(async () => {
 });
 </script>
 <template>
-  <div
-    class="copilot-container"
-  >
+  <div class="copilot-container">
     <div class="copilot-container-main">
       <DialogueAside />
       <DialogueSession :createAppForm="createAppForm" />
@@ -135,11 +133,12 @@ onMounted(async () => {
 </template>
 <style lang="scss" scoped>
 .copilot-container {
-  padding: 16px 24px 16px 8px;
+  width: 100%;
   height: 100%;
   display: flex;
   justify-content: space-between;
   &-main {
+    width: 100%;
     display: flex;
     flex: 1;
   }
diff --git a/src/views/dialogue/components/AppInitalPreview.vue b/src/views/dialogue/components/AppInitalPreview.vue
index fdb703220da5cb0a6e07e12e2dced628b586f056..326de5ed6b6fbc1388762a92e5a1fb252ce98000 100644
--- a/src/views/dialogue/components/AppInitalPreview.vue
+++ b/src/views/dialogue/components/AppInitalPreview.vue
@@ -62,7 +62,7 @@ watch(
   border-radius: 8px;
   bottom: 0px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-  margin: 12px 104px;
+  margin: 12px 88px;
 }
 
 .dialogue-conversation-bottom-sendbox {
diff --git a/src/views/dialogue/components/DialogueAside.vue b/src/views/dialogue/components/DialogueAside.vue
index 3ae8ea21868ecaa10ee3f024842798f557d1ad01..480e1f2984433f135b1dc07ad3bfdca12d99dee1 100644
--- a/src/views/dialogue/components/DialogueAside.vue
+++ b/src/views/dialogue/components/DialogueAside.vue
@@ -537,7 +537,7 @@ watch(
 </template>
 <style lang="scss" scoped>
 :deep(.el-dialog) {
-    --o-dialog-width: 432px;
+  --o-dialog-width: 432px;
   .dialog-footer {
     flex-direction: row;
     .el-button {
@@ -545,7 +545,7 @@ watch(
       height: 24px;
     }
   }
-  }
+}
 :deep(.el-collapse-item__title) {
   line-height: 18px !important;
 }
@@ -554,8 +554,8 @@ watch(
 }
 :deep(.el-collapse-item__content) {
   border-bottom: none;
-  padding-bottom: 0px;
-  margin: 1px;
+  padding-bottom: 0;
+  margin: 0;
 }
 
 :deep(.el-collapse-item__header) {
@@ -587,7 +587,7 @@ watch(
 }
 
 .collapsible-apps {
-  width: 17rem;
+  width: 264px;
   border-radius: 8px;
   .collapsible-header {
     border-radius: 8px;
@@ -722,6 +722,9 @@ watch(
 }
 
 .aside-wrapper {
+  padding-left: 8px;
+  padding-top: 16px;
+  padding-bottom: 16px;
   position: relative;
   height: 100%;
 
@@ -758,7 +761,7 @@ watch(
 
   .create-button {
     position: relative;
-    width: calc(100% - 18px);
+    width: 264px;
     height: 40px;
     font-size: 16px;
     background-image: linear-gradient(to right, #6d75fa, #5ab3ff);
@@ -845,10 +848,10 @@ watch(
     }
 
     &-title {
+      width: 264px;
       display: flex;
       justify-content: space-between;
       align-items: center;
-      margin-right: 18px;
       cursor: pointer;
       user-select: none;
 
@@ -878,7 +881,7 @@ watch(
 
     .search-input {
       margin-top: 8px;
-      width: calc(100% - 18px);
+      width: 264px;
       font-size: 12px;
       border-radius: 4px;
       border-color: var(--o-border-color-lighter);
diff --git a/src/views/dialogue/components/DialogueSession.vue b/src/views/dialogue/components/DialogueSession.vue
index c4e17179517fc69900aef580cdb9090a8cbe524e..88ae0416e76152fa2006d8f2bfc81f8a3fe88636 100644
--- a/src/views/dialogue/components/DialogueSession.vue
+++ b/src/views/dialogue/components/DialogueSession.vue
@@ -672,25 +672,19 @@ watch(
           @handleSendMessage="handleSendMessage"
           @clearSuggestion="clearSuggestion(index)"
         />
-        <div
-          v-if="
-            conversationList.length === 0 &&
-            (app.selectedAppId === '' || !app.selectedAppId)
-          "
-        >
-          <InitalPanel @selectQuestion="selectQuestion" />
-        </div>
-        <div
-          class="dialogue-interPreview-main"
-          v-if="conversationList.length === 0 && app.selectedAppId !== ''"
-        >
-          <InterPreview
-            :createAppForm="Form"
+        <template v-if="conversationList.length === 0">
+          <InitalPanel
+            v-if="app.selectedAppId === '' || !app.selectedAppId"
             @selectQuestion="selectQuestion"
           />
-        </div>
+          <div v-else class="dialogue-interPreview-main">
+            <InterPreview
+              :createAppForm="Form"
+              @selectQuestion="selectQuestion"
+            />
+          </div>
+        </template>
       </div>
-      <div class="createApp-demo"></div>
       <div class="dialogue-conversation-bottom">
         <!-- 问题换一换 -->
         <div
@@ -875,10 +869,10 @@ watch(
     justify-content: space-between;
     align-items: center;
     font-size: 12px;
-      .rotated {
-    transition: transform 0.3s;
-    transform: rotate(90deg);
-  }
+    .rotated {
+      transition: transform 0.3s;
+      transform: rotate(90deg);
+    }
     .el-icon {
       width: 16px;
       height: 16px;
@@ -894,7 +888,7 @@ watch(
   height: 100%;
   width: 100%;
   display: flex;
-  min-width: 1028px;
+  min-width: 982px;
 }
 .dialogue-panel__stop {
   display: flex;
@@ -943,13 +937,12 @@ button[disabled]:hover {
 
 .dialogue-conversation {
   flex: 1;
-  border-radius: 0 8px 8px 0;
   display: flex;
   flex-direction: column;
   position: relative;
   align-items: center;
   justify-content: space-between;
-  min-width: 500px;
+  min-width: 982px;
 
   &::before {
     content: '';
@@ -959,7 +952,6 @@ button[disabled]:hover {
     top: 0;
     left: 0;
     opacity: 0.4;
-    // background-image: linear-gradient(180deg, #e7f0fd 1%, #accbee 100%);
     z-index: -1;
   }
 
@@ -970,7 +962,6 @@ button[disabled]:hover {
     width: 100%;
     height: 100%;
     overflow-y: auto;
-    margin-left: 16px;
     .initial-message {
       background-color: #fff;
     }
@@ -979,7 +970,8 @@ button[disabled]:hover {
   &-bottom {
     margin-top: 24px;
     height: auto;
-    width: 1000px;
+    max-width: 1000px;
+    width: calc(100% - 176px);
 
     .sendbox-wrapper {
       position: relative;
@@ -1245,19 +1237,20 @@ button[disabled]:hover {
 }
 
 .copilot-footer {
-  margin-top: 16px;
+  margin: 12px;
 }
 
 .dialogue-interPreview-main {
   width: 100%;
 }
+
 .preTop {
   width: 100%;
   display: flex;
   justify-content: center;
-  // padding-left: calc(50% - 0px);
   align-items: center;
   position: relative;
+  margin-top: 64px;
 
   .mcp-list {
     position: absolute;
diff --git a/src/views/dialogue/components/InitalPanel.vue b/src/views/dialogue/components/InitalPanel.vue
index c971b3acc9a26fabbaff867ef73182feb09cc5d3..b403b62fcc0f6565798c4ec6a549f00d05403891 100644
--- a/src/views/dialogue/components/InitalPanel.vue
+++ b/src/views/dialogue/components/InitalPanel.vue
@@ -67,61 +67,59 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="dialogue-panel">
-    <div class="inital-panel">
-      <div class="introduction">
-        {{ $t('main.describe1') }}
-        <img
-          src="@/assets/images/logo-euler-copilot.png"
-          alt=""
-          v-if="!appName?.length"
-        />
-        <div class="appNameTitle">{{ appName }}</div>
-        {{ $t('main.describe2') }}
-      </div>
-      <p class="inital-panel-tips"></p>
-      <div class="container">
-        <div class="eg">
-          <p class="eg-title">{{ $t('main.left_describe') }}</p>
-          <ul class="eg-list">
-            <li
-              class="eg-list-item"
-              v-for="item in EG_LIST"
-              :key="item.key"
-              :style="item.style"
-            >
-              <img :src="defaultIcon" alt="" />
-              <div class="eg-list-item__text">
-                <p>{{ $t('main.' + item.key) }}</p>
-                <span class="eg-list-item__text-desc">
-                  {{ $t('main.' + item.insertMessage) }}
-                </span>
-              </div>
-            </li>
-          </ul>
-          <div class="eg-btn">
-            <p @click="routerToAppCenter()">{{ $t('main.try_app') }}</p>
-          </div>
-        </div>
-        <div class="question">
-          <div class="question-title">
-            <p class="title">{{ $t('main.question') }}</p>
-            <div class="change">
-              <el-icon><IconLoad /></el-icon>
-              {{ $t('main.refresh') }}
+  <div class="inital-panel">
+    <div class="introduction">
+      {{ $t('main.describe1') }}
+      <img
+        src="@/assets/images/logo-euler-copilot.png"
+        alt=""
+        v-if="!appName?.length"
+      />
+      <div class="appNameTitle">{{ appName }}</div>
+      {{ $t('main.describe2') }}
+    </div>
+    <p class="inital-panel-tips"></p>
+    <div class="container">
+      <div class="eg">
+        <p class="eg-title">{{ $t('main.left_describe') }}</p>
+        <ul class="eg-list">
+          <li
+            class="eg-list-item"
+            v-for="item in EG_LIST"
+            :key="item.key"
+            :style="item.style"
+          >
+            <img :src="defaultIcon" alt="" />
+            <div class="eg-list-item__text">
+              <p>{{ $t('main.' + item.key) }}</p>
+              <span class="eg-list-item__text-desc">
+                {{ $t('main.' + item.insertMessage) }}
+              </span>
             </div>
+          </li>
+        </ul>
+        <div class="eg-btn">
+          <p @click="routerToAppCenter()">{{ $t('main.try_app') }}</p>
+        </div>
+      </div>
+      <div class="question">
+        <div class="question-title">
+          <p class="title">{{ $t('main.question') }}</p>
+          <div class="change">
+            <el-icon><IconLoad /></el-icon>
+            {{ $t('main.refresh') }}
           </div>
-          <ul class="question-list">
-            <li class="question-item" v-for="item in questions" :key="item.id">
-              <span class="question-number" :class="{ blue: item.id <= 3 }">
-                {{ item.id }}
-              </span>
-              <span class="question-des" @click="selectQuestions">
-                {{ $t('question.' + item.question) }}
-              </span>
-            </li>
-          </ul>
         </div>
+        <ul class="question-list">
+          <li class="question-item" v-for="item in questions" :key="item.id">
+            <span class="question-number" :class="{ blue: item.id <= 3 }">
+              {{ item.id }}
+            </span>
+            <span class="question-des" @click="selectQuestions">
+              {{ $t('question.' + item.question) }}
+            </span>
+          </li>
+        </ul>
       </div>
     </div>
   </div>
@@ -210,13 +208,11 @@ onMounted(() => {
   justify-content: center;
 
   .question {
-    // display: block;
-    width: 492px;
+    width: calc(50% - 8px);
     height: auto;
     box-shadow: 0px 5.18px 20.72px 0px var(--question-shadow);
     background: var(--question-bg);
     background-blend-mode: overlay;
-    // opacity: 0.5;
     border-radius: 8px;
     background-size: 100% 100%;
     margin-left: 16px;
@@ -259,13 +255,10 @@ onMounted(() => {
 .inital-panel {
   background-color: transparent;
   border-radius: 8px;
-  padding-top: 48px;
+  padding-top: 64px;
   display: block;
-  width: 1128px;
-
-  @media screen and (max-width: 1368px) and (max-height: 768px) {
-    padding: 16px 24px 16px 24px;
-  }
+  max-width: 1000px;
+  width: calc(100% - 176px);
 
   .introduction {
     display: flex;
@@ -291,9 +284,10 @@ onMounted(() => {
   .eg {
     background-color: var(--o-bg-color-base);
     padding: 24px;
+    box-shadow: 0px 5.18px 20.72px 0px var(--question-shadow);
     border-radius: 8px;
-    width: 492px;
-    height: 320px;
+    width: calc(50% - 8px);
+    height: auto;
     &-title {
       font-size: 18px;
       font-weight: 700;
@@ -301,8 +295,8 @@ onMounted(() => {
     }
     &-btn {
       display: flex;
-      position: relative;
-      top: 53px;
+      margin-top: 48px;
+      margin-bottom: 16px;
       cursor: pointer;
       p {
         display: block;
@@ -339,9 +333,10 @@ onMounted(() => {
       }
       &-item {
         display: flex;
-        align-items: center;
-        width: 218px;
-        height: 80px;
+        align-items: flex-start;
+        min-width: 169px;
+        max-width: 218px;
+        width: calc(50% - 4px);
         background: var(--o-bg-color-base);
         overflow: hidden;
         border-radius: 8px;
@@ -357,8 +352,8 @@ onMounted(() => {
         }
 
         &__text {
-          // width: 100%;
           margin-right: 16px;
+          margin-top: 16px;
           display: flex;
           flex-direction: column;
           font-size: 16px;
@@ -370,6 +365,9 @@ onMounted(() => {
             font-size: 14px;
             color: var(--o-text-color-secondary);
             font-weight: 400;
+            line-height: 22px;
+            margin-top: 4px;
+            margin-bottom: 14px;
           }
         }
 
diff --git a/src/views/dialogue/components/InterPreview.vue b/src/views/dialogue/components/InterPreview.vue
index fe9289e9e08995883d4abc2a1fc32e2912506ecb..6fcee756acdc1bbd8e013ee4971db96aad82efbb 100644
--- a/src/views/dialogue/components/InterPreview.vue
+++ b/src/views/dialogue/components/InterPreview.vue
@@ -22,15 +22,15 @@
       </div>
     </div>
     <div class="preMain">
-      <div class="preMainImg" v-if="interPreviewInfo?.name?.length">
-        <img
-          :src="interPreviewInfo.icon"
-          class="preMainAvator"
-          v-if="interPreviewInfo.icon.length"
-        />
-        <div v-else class="defaultIconNoCamera"></div>
-      </div>
       <div class="preMainContanter">
+        <div class="preMainImg" v-if="interPreviewInfo?.name?.length">
+          <img
+            :src="interPreviewInfo.icon"
+            class="preMainAvator"
+            v-if="interPreviewInfo.icon.length"
+          />
+          <div v-else class="defaultIconNoCamera"></div>
+        </div>
         <div
           class="preMainContent"
           v-if="
@@ -146,7 +146,6 @@ watch(
 .interPreviewBox {
   display: flex;
   flex: auto;
-  margin-top: 32px;
   width: 100%;
   gap: 32px;
   flex-direction: column;
@@ -156,6 +155,7 @@ watch(
     justify-content: center;
     align-items: center;
     position: relative;
+    margin-top: 64px;
 
     .mcp-list {
       position: absolute;
@@ -200,36 +200,42 @@ watch(
   }
 
   .preMain {
-    justify-content: center;
     display: flex;
-    gap: 16px;
+    justify-content: center;
+    align-items: flex-start;
 
-    .preMainImg {
-      width: 46px;
-      height: 46px;
-      border-radius: 50%;
-      .preMainAvator {
-        width: 100%;
-        height: 100%;
-        border-radius: 50%;
-        background-size: contain;
-      }
-      .defaultIconNoCamera {
-        width: 100%;
-        height: 100%;
-        background: url('@/assets/svgs/dark_user.svg');
-        background-size: contain !important;
-        &:hover {
-          background: url('@/assets/svgs/light_user.svg');
-        }
-      }
-    }
     .preMainContanter {
-      width: calc(100% - 166px);
-      max-width: calc(1000px - 46px);
+      width: calc(100% - 176px);
+      max-width: 1000px;
+      position: relative;
       display: flex;
       flex-direction: column;
       gap: 16px;
+
+      .preMainImg {
+        width: 46px;
+        height: 46px;
+        border-radius: 50%;
+        position: absolute;
+        left: -62px;
+        top: 0;
+        .preMainAvator {
+          width: 100%;
+          height: 100%;
+          border-radius: 50%;
+          background-size: contain;
+        }
+        .defaultIconNoCamera {
+          width: 100%;
+          height: 100%;
+          background: url('@/assets/svgs/dark_user.svg');
+          background-size: contain !important;
+          &:hover {
+            background: url('@/assets/svgs/light_user.svg');
+          }
+        }
+      }
+
       .preMainContent {
         width: 100%;
         padding: 24px;
diff --git a/src/views/dialogue/components/TitleBar.vue b/src/views/dialogue/components/TitleBar.vue
index 7022dae966809b67d57497aae629505b50c01dbd..f3b5e5227f291806284b100559a8b4c55c58f30c 100644
--- a/src/views/dialogue/components/TitleBar.vue
+++ b/src/views/dialogue/components/TitleBar.vue
@@ -115,7 +115,7 @@ const headerStyles = computed<CSSProperties>(() => {
 
       <el-popover popper-class="popper-class" :offset="4">
         <template #reference>
-          <div class="avatar" ></div>
+          <div class="avatar"></div>
         </template>
         <div
           class="exit-button lang-button"
@@ -131,6 +131,8 @@ const headerStyles = computed<CSSProperties>(() => {
 
 <style lang="scss" scoped>
 .dialogue-header {
+  z-index: 1;
+  box-shadow: 0 0 8px 0 rgba(var(--o-black), 0.1);
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -187,7 +189,7 @@ const headerStyles = computed<CSSProperties>(() => {
     }
   }
 }
-.popper-class{
+.popper-class {
   height: 42px !important;
 }
 </style>
diff --git a/src/views/dialogue/dialogueView.vue b/src/views/dialogue/dialogueView.vue
index ba50efe94c922ce9f2d3f233df486c7e39aeedd1..ad3fa74ecd94c8e23fb33a1e9aa10e4e5e0ca2a9 100644
--- a/src/views/dialogue/dialogueView.vue
+++ b/src/views/dialogue/dialogueView.vue
@@ -270,18 +270,20 @@ watch(
                 <img v-else class="create-button__icon" :src="item.src" />
               </el-icon>
             </span>
-            <span 
-            class="menu-text"
-            :class="{
-              'menu-text__selected':
-                router.currentRoute.value.name
-                  ?.toString()
-                  .indexOf(item.routerName) !== -1 ||
-                router.currentRoute.value.name
-                  ?.toString()
-                  .indexOf(item.anotherName!) !== -1,
-            }"
-            >{{ item.name }}</span>
+            <span
+              class="menu-text"
+              :class="{
+                'menu-text__selected':
+                  router.currentRoute.value.name
+                    ?.toString()
+                    .indexOf(item.routerName) !== -1 ||
+                  router.currentRoute.value.name
+                    ?.toString()
+                    .indexOf(item.anotherName!) !== -1,
+              }"
+            >
+              {{ item.name }}
+            </span>
           </router-link>
         </div>
 
@@ -294,12 +296,14 @@ watch(
               />
             </el-icon>
           </span>
-          <span 
-          class="menu-text"
-          :class="{
-            'menu-text__selected': route.path === '/settings',
-          }"
-          >{{ i18n.global.t('menu.settings') }}</span>
+          <span
+            class="menu-text"
+            :class="{
+              'menu-text__selected': route.path === '/settings',
+            }"
+          >
+            {{ i18n.global.t('menu.settings') }}
+          </span>
         </router-link>
       </div>
       <div class="dialogue-content">
@@ -563,7 +567,7 @@ watch(
   .divider {
     border-bottom: 1px solid var(--o-text-color-tertiary);
   }
-  .el-popper__arrow{
+  .el-popper__arrow {
     display: none;
   }
 }
@@ -648,7 +652,7 @@ watch(
           padding: 0 1px;
 
           &__selected {
-            color: #6395FD;
+            color: #6395fd;
             font-weight: 600;
           }
         }
@@ -656,7 +660,7 @@ watch(
     }
 
     .dialogue-content {
-      width: 100%;
+      width: calc(100% - 64px);
       height: 100%;
       flex: 1;
       background-image: var(--o-bg-image);
diff --git a/src/views/dialogue/types.ts b/src/views/dialogue/types.ts
index dd0887a4037416f03490907cdbf0b3cc0ce05caa..392a8a896d861a01b9ea9069504b4473d600ec39 100644
--- a/src/views/dialogue/types.ts
+++ b/src/views/dialogue/types.ts
@@ -75,6 +75,7 @@ export interface FlowDataType {
 export interface AppShowType {
   appId: string;
   name: string;
+  selectedAppId?: string;
 }
 
 export interface RobotConversationItem {
diff --git a/src/views/styles/workFlowDebug.scss b/src/views/styles/workFlowDebug.scss
index 7a17c91af75d44a1898bdfd5728f854c2fdc7398..bec6eea42e4b92e8d23f19f8b7f3befb250e0cfd 100644
--- a/src/views/styles/workFlowDebug.scss
+++ b/src/views/styles/workFlowDebug.scss
@@ -1,6 +1,6 @@
 .workFlowDebug {
   width: 40%;
-  min-width: 400px;
+  min-width: 540px;
   height: 100%;
   position: absolute;
   right: 0;