diff --git a/src/views/createapp/components/appConfig.vue b/src/views/createapp/components/appConfig.vue
index 219fc097afa56d5b66c02f9281f502f86cf51c33..edd540e1323806643169947dfcc0d6e4ceabbc1a 100644
--- a/src/views/createapp/components/appConfig.vue
+++ b/src/views/createapp/components/appConfig.vue
@@ -56,7 +56,7 @@ const addLink = () => {
   createAppForm.value.connectList.push('');
 };
 const addRecommond = () => {
-  createAppForm.value.recommendQuestionList.unshift('');
+  createAppForm.value.recommendQuestionList.push('');
 };
 const delConnectItem = idx => {
   createAppForm.value.connectList.splice(idx, 1);
diff --git a/src/views/createapp/index.vue b/src/views/createapp/index.vue
index cf67431e9095fe2d1923e85e3e506bb39c6a2154..a4b0169219c56372332b12927baaa3e1c167f6e9 100644
--- a/src/views/createapp/index.vue
+++ b/src/views/createapp/index.vue
@@ -52,3 +52,23 @@ const handleChangeAppType = type => {
     </div>
   </div>
 </template>
+<style lang="scss">
+/* 滚动条轨道样式 */
+::-webkit-scrollbar-track {
+  background-image: linear-gradient(180deg, #e7f0fd 1%, #daeafc 40%) !important;
+  display: none;
+}
+
+::-webkit-scrollbar {
+  width: 3px !important;
+  height: 3px !important;
+  // display: none;
+}
+
+/* 滚动条的滑块 */
+::-webkit-scrollbar-thumb {
+  background-color: #c3cedf;
+  border-radius: 3px;
+  // display: none;
+}
+</style>
diff --git a/src/views/dialogue/components/InterPreview.vue b/src/views/dialogue/components/InterPreview.vue
index 80af1710e289dbdbd8f59d3521bc454ccfee1740..0ca32fb25bc10f8ddde1c8d62180170f113fe95d 100644
--- a/src/views/dialogue/components/InterPreview.vue
+++ b/src/views/dialogue/components/InterPreview.vue
@@ -12,45 +12,51 @@
       <div class="preMainImg">
         <img :src="interPreviewInfo.icon" class="preMainAvator" v-if="interPreviewInfo.icon.length" />
       </div>
-      <div
-        class="preMainContent"
-        v-if="
-          interPreviewInfo.appName.length ||
-          interPreviewInfo.appIntroduction.length ||
-          interPreviewInfo.connectList.length
-        "
-      >
-        <div class="preMainContentTitle" v-if="interPreviewInfo.appName.length">
-          <div class="greetDes">
-            <div class="greetDesContent">你好，我是</div>
-            <div class="greetDesAppName greetDesContent">
-              {{ interPreviewInfo.appName }}
+      <div class="preMainContanter">
+        <div
+          class="preMainContent"
+          v-if="interPreviewInfo.appName.length || interPreviewInfo.appIntroduction.length || connnectLinkList.length"
+        >
+          <div class="preMainContentTitle" v-if="interPreviewInfo.appName.length">
+            <div class="greetDes">
+              <div class="greetDesContent">你好，我是</div>
+              <div class="greetDesAppName greetDesContent">
+                {{ interPreviewInfo.appName }}
+              </div>
+              <div class="greetDesContent">，很高兴为你服务</div>
+            </div>
+            <div class="preAppUser">
+              <div>@zhang</div>
+              <div class="contentCollect"><IconUnfavorite /></div>
             </div>
-            <div class="greetDesContent">，很高兴为你服务</div>
           </div>
-          <div class="preAppUser">
-            <div>@zhang</div>
-            <div class="contentCollect"><IconUnfavorite /></div>
+          <div class="preMainContentDes" v-if="interPreviewInfo.appIntroduction.length">
+            {{ interPreviewInfo.appIntroduction }}
           </div>
-        </div>
-        <div class="preMainContentDes" v-if="interPreviewInfo.appIntroduction.length">
-          {{ interPreviewInfo.appIntroduction }}
-        </div>
-        <div class="preMainContentLink" v-if="interPreviewInfo.connectList.length">
-          <el-badge :value="connnectLinkList.length" class="linkBadge">
-            <div class="contentLinkTitle">相关链接</div>
-          </el-badge>
-          <div class="connectBox">
-            <div v-for="(connect, index) in connnectLinkList">
-              <div v-if="connect.length" class="connectCard">
-                <div class="connectBoxIndex">{{ index + 1 }}</div>
-                <el-link class="connectBoxContent" type="primary" :href="connect">
-                  {{ connect }}
-                </el-link>
+          <div class="preMainContentLink" v-if="connnectLinkList.length">
+            <el-badge :value="connnectLinkList.length" class="linkBadge">
+              <div class="contentLinkTitle">相关链接</div>
+            </el-badge>
+            <div class="connectBox">
+              <div v-for="(connect, index) in connnectLinkList">
+                <div v-if="connect.length" class="connectCard">
+                  <div class="connectBoxIndex">{{ index + 1 }}</div>
+                  <el-link class="connectBoxContent" type="primary" :href="connect">
+                    {{ connect }}
+                  </el-link>
+                </div>
               </div>
             </div>
           </div>
         </div>
+        <div class="preFooter" v-if="recommendQuestionList.length">
+          <div class="preFooterTitle">推荐问题：</div>
+          <div class="preFooterContent">
+            <div v-for="ques in interPreviewInfo.recommendQuestionList">
+              <div class="preFooterContentQues" v-if="ques.length">{{ ques }}</div>
+            </div>
+          </div>
+        </div>
       </div>
     </div>
   </div>
@@ -65,12 +71,14 @@ interface InterPreProps {
 }
 const props = withDefaults(defineProps<InterPreProps>(), {});
 const interPreviewInfo = ref();
+const recommendQuestionList = ref();
 const connnectLinkList = ref<any>([]);
 watch(
   () => props.createAppForm,
   (newValue, oldValue) => {
     interPreviewInfo.value = props.createAppForm;
     connnectLinkList.value = props.createAppForm.connectList.filter(item => item.length);
+    recommendQuestionList.value = props.createAppForm.recommendQuestionList.filter(item => item.length);
   },
   {
     immediate: true,
diff --git a/src/views/styles/InterPreview.scss b/src/views/styles/InterPreview.scss
index a345a700301b3ba0ca2d4c305f648a058224d18f..10af746dc6d0670c106e330afb7d3c70a0b890d1 100644
--- a/src/views/styles/InterPreview.scss
+++ b/src/views/styles/InterPreview.scss
@@ -48,80 +48,108 @@
           border-radius: 50%;
         }
       }
-      .preMainContent {
+      .preMainContanter {
         width: calc(100% - 166px);
-        padding: 24px;
-        background-color: var(--o-bg-color-base);
-        .preMainContentTitle {
-          display: flex;
-          flex-direction: column;
-          gap: 8px;
-          border-bottom: 1px solid var(--o-time-text);
-          .greetDes {
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+        .preMainContent {
+          width: 100%;
+          padding: 24px;
+          background-color: var(--o-bg-color-base);
+          .preMainContentTitle {
             display: flex;
-            .greetDesContent {
-              font-size: 24px;
-              font-weight: 700;
-              line-height: 32px;
-              color: var(--o-text-color-primary);
+            flex-direction: column;
+            gap: 8px;
+            border-bottom: 1px solid var(--o-time-text);
+            .greetDes {
+              display: flex;
+              .greetDesContent {
+                font-size: 24px;
+                font-weight: 700;
+                line-height: 32px;
+                color: var(--o-text-color-primary);
+              }
+              .greetDesAppName {
+                color: #6c77fa;
+              }
             }
-            .greetDesAppName {
-              color: #6c77fa;
+            .preAppUser {
+              display: flex;
+              gap: 16px;
+              margin-bottom: 8px;
             }
           }
-          .preAppUser {
-            display: flex;
-            gap: 16px;
-            margin-bottom: 8px;
-          }
-        }
-        .preMainContentDes {
-          font-size: 16px;
-          line-height: 24px;
-          margin-top: 8px;
-          margin-bottom: 20px;
-        }
-        .preMainContentLink {
-          .contentLinkTitle {
-            color: var(--o-text-color-primary);
+          .preMainContentDes {
             font-size: 16px;
             line-height: 24px;
+            margin-top: 8px;
+            margin-bottom: 20px;
           }
-          .linkBadge {
-            .el-badge__content {
-              right: calc(-10px + var(--el-badge-size) / 2);
-              top: 4px;
+          .preMainContentLink {
+            .contentLinkTitle {
+              color: var(--o-text-color-primary);
+              font-size: 16px;
+              line-height: 24px;
+            }
+            .linkBadge {
+              .el-badge__content {
+                right: calc(-10px + var(--el-badge-size) / 2);
+                top: 4px;
+              }
+            }
+
+            .connectBox {
+              display: flex;
+              flex-wrap: wrap;
+              gap: 8px;
+              .connectCard {
+                display: flex;
+                height: 32px;
+                align-items: center;
+                background: rgba(99, 149, 253, 0.1);
+                padding: 0 8px 0 4px;
+                border-radius: 20px;
+                gap: 6px;
+                .connectBoxIndex {
+                  width: 24px;
+                  height: 24px;
+                  border-radius: 50%;
+                  text-align: center;
+                  line-height: 24px;
+                  font-size: 14px;
+                  color: var(--o-text-color-primary);
+                  background: var(--o-bg-color-base);
+                }
+                .connectBoxContent {
+                  color: #6395fd;
+                  font-size: 14px;
+                  cursor: pointer;
+                  font-weight: 400;
+                }
+              }
             }
           }
+        }
+        .preFooter {
+          width: 100%;
+          display: flex;
+          gap: 8px;
+          height: 32px;
+          align-items: center;
+          .preFooterTitle {
+            font-size: 12px;
+            line-height: 14px;
+            color: var(--o-text-color-secondary);
+          }
 
-          .connectBox {
+          .preFooterContent {
             display: flex;
-            flex-wrap: wrap;
             gap: 8px;
-            .connectCard {
-              display: flex;
-              height: 32px;
-              align-items: center;
-              background: rgba(99, 149, 253, 0.1);
-              padding: 0 8px 0 4px;
-              border-radius: 20px;
-              gap: 6px;
-              .connectBoxIndex {
-                width: 24px;
-                height: 24px;
-                border-radius: 50%;
-                text-align: center;
-                line-height: 24px;
-                font-size: 14px;
-                color: var(--o-text-color-primary);
-                background: var(--o-bg-color-base);
-              }
-              .connectBoxContent {
-                color: #6395fd;
-                font-size: 14px;
-                cursor: pointer;
-                font-weight: 400;
-              }
+            .preFooterContentQues {
+              border-radius: 8px;
+              padding: 8px 16px;
+              background-color: var(--o-bg-color-base);
             }
           }
         }