diff --git a/.vscode/settings.json b/.vscode/settings.json
index d0ec779..27588f7 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -32,7 +32,7 @@
     "editor.formatOnSave": true
   },
   "[vue]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.defaultFormatter": "Vue.volar",
     "editor.formatOnSave": true
   },
   "css.validate": false, //用来校验CSS文件中的语法错误和潜在的问题
diff --git a/src/views/Design/Index.vue b/src/views/Design/Index.vue
index 1c9e732..dbc3f3e 100644
--- a/src/views/Design/Index.vue
+++ b/src/views/Design/Index.vue
@@ -87,11 +87,7 @@
           <template #action="{ element: el }">
             <div class="flex slot-actions">
               <template v-for="(item, optionIndex) in actionOptions">
-                <div
-                  v-if="item.question_type.includes(el.question_type)"
-                  :key="optionIndex"
-                  class="flex"
-                >
+                <div v-if="item.question_type.includes(el.question_type)" :key="optionIndex" class="flex">
                   <template v-for="(act, actIndex) in item.actions" :key="actIndex">
                     <div class="flex align-center action-item" @click="actionEvent(act, el)">
                       <van-icon :name="act.icon"></van-icon>
@@ -106,13 +102,12 @@
 
         <!--        {{ element.question_type }}-->
         <!--        {{questionInfo.survey.pages.length}}-->
-        <paging
-          v-if="!element.question_type && questionInfo.survey.pages.length > 1"
-          :info="element"
-          :index="index"
-          :active="pageIsActive(activeIndex, questionInfo.questions, element.page)"
-          @click.stop=""
-        />
+        <div v-if="!filterGap">
+          <paging
+            v-if="!element.question_type && questionInfo.survey.pages.length > 1" :info="element" :index="index"
+            :active="pageIsActive(activeIndex, questionInfo.questions, element.page)" @click.stop=""
+          />
+        </div>
       </template>
     </draggable>
   </div>
@@ -180,6 +175,16 @@ function util() {
     copyStoreContent
   };
 }
+
+// 获取所有的 question 列表内容
+const { filterGap } = defineProps({
+  filterGap: {
+    type: Boolean,
+    required: false,
+    default: false
+  }
+});
+
 const { pageIsActive } = util();
 // 获取 Store 实例
 const counterStore = useCounterStore();
diff --git a/src/views/Design/Preview.vue b/src/views/Design/Preview.vue
index b1be816..3deac7d 100644
--- a/src/views/Design/Preview.vue
+++ b/src/views/Design/Preview.vue
@@ -1,48 +1,16 @@
-<template>
-  <div class="container preview-container">
-    <div v-for="(element, index) in questionsInfo.questions" :key="index" class="element-container">
-      <Choice v-if="element.question_type === 1" :element="element" :active="false"></Choice>
-      <!-- 填空题 -->
-      <Completion
-        v-if="element.question_type === 4"
-        :element="element"
-        :active="chooseQuestionId === element.id"
-        sn="lXEBBpE2"
-      ></Completion>
+<script setup lang="ts">
+import PreviewIndex from './Index.vue';
 
-      <martrix-question
-        v-if="element.question_type === 9"
-        :element="element"
-        :active="chooseQuestionId === element.id"
-      />
-
-      <!-- 打分题 -->
-      <Rate
-        v-if="element.question_type === 5"
-        :element="element"
-        :active="chooseQuestionId === element.id"
-        sn="lXEBBpE2"
-      />
-    </div>
-  </div>
-</template>
-<script setup>
-import Choice from '@/views/Design/components/Questions/Choice.vue';
-// store paine
-import { storeToRefs } from 'pinia';
-import { useCounterStore } from '@/stores/counter';
-import MartrixQuestion from '@/views/Design/components/Questions/MartrixQuestion.vue';
-import Rate from '@/views/Design/components/Questions/Rate.vue';
-import Completion from '@/views/Design/components/Questions/Completion.vue';
-const store = useCounterStore();
-const { questionsInfo } = storeToRefs(store);
 </script>
-<style scoped lang="scss">
-.preview-container {
-  background: #f5f5f5;
 
-  & .element-container {
-    padding: 8px;
-  }
-}
-</style>
+<template>
+  <van-nav-bar title="预览" left-arrow>
+    <template #right>
+      <van-icon name="search" />
+    </template>
+  </van-nav-bar>
+
+  <preview-index :filterGap="true"></preview-index>
+</template>
+
+<style lang="scss" scoped></style>
\ No newline at end of file