feat: 更改滚动条布局

components/Lottery/Timing/Rewards.vue

 <template>
 <template>
-  <div
-    class="main"
-    :style="{
-      height: this.$route.path === '/mini/index' ? '65.5vh' : lotteryInfo.showType === 7 ? '46.5vh' : '37.5vh'
-    }"
-  >
-    <div class="intro">
-      <div class="intro__title">活动介绍</div>
-      <div class="intro__detail">{{ lotteryInfo.intro }}</div>
-    </div>
-    <div class="rule">
-      <div class="rule__sub">本场活动奖品:</div>
-      <div class="intro__rewards">
-        <div v-for="item in lotteryInfo.prizeConfigs" :key="item.id" class="intro__rewards-item">
-          <img v-if="item.icon" :src="item.icon" alt="" />
-          <img v-else src="./img/gift.png" alt="" />
-          <div>{{ item.name }}</div>
+  <div class="main">
+    <div
+      :style="{
+        height: this.$route.path === '/mini/index' ? '65.5vh' : lotteryInfo.showType === 7 ? '46.5vh' : '37.5vh'
+      }"
+    >
+      <div class="intro">
+        <div class="intro__title">活动介绍</div>
+        <div class="intro__detail">{{ lotteryInfo.intro }}</div>
+      </div>
+      <div class="rule">
+        <div class="rule__sub">本场活动奖品:</div>
+        <div class="intro__rewards">
+          <div v-for="item in lotteryInfo.prizeConfigs" :key="item.id" class="intro__rewards-item">
+            <img v-if="item.icon" :src="item.icon" alt="" />
+            <img v-else src="./img/gift.png" alt="" />
+            <div>{{ item.name }}</div>
+          </div>
         </div>
         </div>
       </div>
       </div>
     </div>
     </div>
@@ -45,6 +46,10 @@ export default {
 </script>
 </script>
 <style lang="less" scoped>
 <style lang="less" scoped>
 .main {
 .main {
+  width: 100%;
+  height: 100%;
+  padding: 0 13px;
+  overflow-x: scroll;
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
   .intro {
   .intro {
@@ -107,6 +112,7 @@ export default {
         img {
         img {
           width: 48px;
           width: 48px;
           height: 48px;
           height: 48px;
+          border-radius: 2px;
         }
         }
         div {
         div {
           width: 100%;
           width: 100%;

components/Lottery/Timing/RulePopup.vue

@@ -67,10 +67,11 @@ export default {
   height: calc(100% - 46px);
   height: calc(100% - 46px);
   &__main {
   &__main {
     width: 100%;
     width: 100%;
+    height: 100%;
     border-radius: 6px;
     border-radius: 6px;
-    padding: 13px;
-    position: relative;
+    padding-bottom: 13px;
     padding-top: 38px;
     padding-top: 38px;
+    position: relative;
     .main-link {
     .main-link {
       width: 24px;
       width: 24px;
       height: 74px;
       height: 74px;