chore(水果游戏榜单): 前三名组件样式调整

src/views/Activities/JackPot/components/topUser.vue

@@ -74,7 +74,7 @@
             align-items: center;
           "
           :style="{
-            width: ranking == '1' ? `35%` : ranking == '2' ? `50%` : `50%`,
+            width: distributionValueWidth,
             background:
               ranking == '1'
                 ? `linear-gradient(270deg, #AD1300 0%, #FE280C 50%, #AD1300 100%)`
@@ -88,7 +88,7 @@
             src="/src/assets/icon/coin.png"
             alt=""
             style="display: block"
-            :style="{ width: isTopOne ? '20%' : '20%' }"
+            :style="{ width: coinWidth }"
           />
           <div
             style="font-weight: 590"
@@ -183,6 +183,34 @@ const bottomSectionHeight = computed(() => {
       return '35%'
   }
 })
+
+// 贡献值宽度
+const distributionValueWidth = computed(() => {
+  switch (props.ranking) {
+    case '1':
+      return '55%'
+    case '2':
+      return '50%'
+    case '3':
+      return '50%'
+    default:
+      return '50%'
+  }
+})
+
+// 金币图标宽度
+const coinWidth = computed(() => {
+  switch (props.ranking) {
+    case '1':
+      return '1em'
+    case '2':
+      return '0.9em'
+    case '3':
+      return '0.9em'
+    default:
+      return '0.9em'
+  }
+})
 </script>
 
 <style lang="scss" scoped>