帮助与反馈 反馈列表样式优化 超出部分换行展示

src/pages/help/index.vue

@@ -4,7 +4,7 @@
     <view class="radio-list">
       <radio-group @change="radioChange">
         <label v-for="item in typeOptions" :key="item.id">
-          <radio :value="item.id.toString()" color="#A4D099" :checked="item.id == active" />
+          <radio :value="item.id.toString()" color="#A4D099" :checked="item.id == active" style="transform:scale(0.7)" />
           <span>{{ item.name }}</span>
         </label>
       </radio-group>
@@ -129,32 +129,41 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+uni-page-body{
+  background-color: #FFF;
+}
+
 .app-container {
-  background-color: #FFFFFF;
-  height: 100%;
+  background-color: #FFF;
   color: #353535;
+  position: relative;
 }
 
 .radio-list {
-  ::v-deep uni-radio .uni-radio-input {
-    width: 24rpx;
-    height: 24rpx;
+  margin-top: 20px;
+
+  uni-radio-group {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1rem;
   }
 
   label {
-    display: inline-block;
-    width: 25%;
+    width: 20%;
     font-size: 24rpx;
-    margin-top: 40rpx;
+    display: flex;
+    align-items: flex-start
   }
 
   span {
-    vertical-align: middle;
+    width: 100%;
+    word-break: break-all;
+    padding-top: 1px;
   }
 }
 
 .textarea {
-  margin-top: 48rpx;
+  margin-top: 24px;
 
   textarea {
     border-radius: 8px;
@@ -164,7 +173,7 @@ export default {
 }
 
 .upload {
-  margin-top: 48rpx;
+  margin: 24px 0 10px;
   display: flex;
   flex-wrap: wrap;
   align-content: flex-start;
@@ -177,7 +186,7 @@ export default {
   img {
     width: 160rpx;
     height: 160rpx;
-    margin: 0 24rpx 24rpx 0;
+    margin: 0 12px 12px 0;
     border-radius: 16rpx;
   }
 
@@ -205,10 +214,6 @@ export default {
 }
 
 .submit {
-  position: absolute;
-  bottom: 32rpx;
-  left: 50%;
-  transform: translate(-50%);
   width: 100%;
 
   button {