refactor(survey): 优化问卷预览页面样式和布局

- 调整了 Choice、Completion 和 FileUpload 组件的样式- 优化了预览页面的滚动和固定元素布局
- 添加了底部支持信息的固定显示- 统一了样式和间距，提高了页面的视觉效果和用户体验

src/views/Design/components/Questions/Choice.vue

@@ -167,17 +167,13 @@ const emitValue = () => {
 
   & .other-input {
     width: 100%;
-    height: 89px;
+    min-height: 89px;
-    background: #ffffff;
+    margin-top: 4px;
-    padding: 3px 5px;
+    margin-bottom: 10px;
-    border: 1px solid #ccc;
+    padding: 12px;
-    border-radius: 8px;
+    border: 1px solid #f4f4f4;
+    border-radius: 5px;
     outline: none;
-    //  禁止拖动
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    //textarea禁止扩大
-    resize: none;
   }
 }
 </style>

src/views/Design/components/Questions/Completion.vue

@@ -70,8 +70,8 @@ const emitValue = () => {
 .cont {
   .other_input {
     width: 100%;
-    min-height: 40px;
+    height: 89px;
-    margin-top: 12px;
+    margin-top: 10px;
     margin-bottom: 10px;
     padding: 12px;
     border: 1px solid #f4f4f4;

src/views/Design/components/Questions/FileUpload.vue

@@ -93,7 +93,7 @@ const emitValue = () => {
       <template #input>
         <div class="file-upload-label" @click="handleFileUpload">
           <van-icon class-prefix="mobilefont" name="upload" />
-          <span>{{ answer?.length > 0 ? '文件已上传' : '文件上传' }}</span>
+          <span class="ml10">{{ answer?.length > 0 ? '文件已上传' : '文件上传' }}</span>
         </div>
       </template>
     </van-field>
@@ -102,21 +102,21 @@ const emitValue = () => {
 
 <style lang="scss" scoped>
 .file-upload-label {
-  display: flex;
+  //display: flex;
-  flex-direction: column;
+  //flex-direction: column;
-  align-items: center;
+  //align-items: center;
-  justify-content: center;
+  //justify-content: center;
 
   //width: 100%;
-  height: 50px;
+  //height: 50px;
-  margin: 60px 0;
+  margin: 45px 0;
-  padding: 16px 18px;
+  padding: 8px 12px;
   border: 1px dashed #979797;
   border-radius: 8px;
   color: #666;
 
   //gap: 10px;
-  font-size: 12px;
+  font-size: 14px;
   text-align: center;
 }
 </style>

src/views/Survey/views/Create/Index.vue

@@ -944,6 +944,7 @@ onMounted(async () => {
 
 .survey-action {
   position: fixed;
+  z-index: 1;
   bottom: 0;
   display: flex;
   flex-direction: row;

src/views/Survey/views/Preview/Index.vue

@@ -475,13 +475,13 @@
           @change-answer="onRelation($event, question)"
         />
       </div>
-      <div style="margin: 10px 0; color: rgba(75, 75, 89, 1); text-align: center">
+
-        <el-text> 由数字科技中心YIP提供支持</el-text>
-      </div>
       <!--       <LangTranslate v-if="isAnswer && styleInfo.is_yip" translate-key="PoweredByDigitalTechnologyCenterYIP"
         class="footer" /> -->
     </div>
-
+    <div class="end-text" style="margin: 10px 0; color: rgba(75, 75, 89, 1); text-align: center">
+      <el-text> 由数字科技中心YIP提供支持</el-text>
+    </div>
     <!-- 分页 -->
     <!-- eslint-disable max-len -->
     <pfe-pagination
@@ -1482,6 +1482,7 @@ function clearAnswer(questions) {
 }
 </script>
 <style lang="scss" scoped>
+@import '@/assets/css/main';
 :deep(.van-cell::after) {
   display: none;
 }
@@ -1511,7 +1512,8 @@ function clearAnswer(questions) {
 }
 
 .preview-container {
-  overflow: hidden;
+  overflow: scroll;
+  max-height: calc(100vh - var(--sticky-top-height) - 65px - 40px);
 
   //min-height: calc(100vh - 100px);
   //padding: 0px 10px 10px 10px;
@@ -1519,20 +1521,34 @@ function clearAnswer(questions) {
   //background: linear-gradient(to bottom, #71b73c 200px, #f2f2f2 300px);
 
   .questions {
-    overflow: hidden;
+    overflow: scroll;
-    padding: 10px 10px 50px 10px;
+    padding: 10px 10px 10px 10px;
+    //margin-bottom: 50px;
 
     .question {
       overflow: hidden;
       //margin-top: 10px;
-      margin-bottom: 10px;
+      //margin-bottom: 10px;
       border: 1px solid #e5e5e5;
       border-radius: 16px;
-      background-color: white;
+      background: #fff;
     }
   }
 }
-
+.end-text {
+  position: fixed;
+  bottom: 65px;
+  width: 100%;
+  font-size: 12px;
+  text-align: center;
+  color: #a5a5ac;
+  background-color: #f2f2f2;
+  z-index: 10;
+  & .el-text {
+    font-size: 12px;
+    color: #4b4b59 !important;
+  }
+}
 .preview-info {
   display: flex;
   grid-template-columns: 1fr 80px;