样式优化

src/components/BattleFooter.vue

@@ -124,7 +124,7 @@ const normalRounds = computed(
 .container {
   width: 100%;
   overflow: hidden;
-  margin-top: -40px;
+  margin-top: -100rpx;
 }
 .container > view:nth-child(2) {
   position: relative;
@@ -166,7 +166,7 @@ const normalRounds = computed(
   background: linear-gradient(270deg, #0006 0%, #6a1212 100%);
 }
 .players > view > view {
-  min-height: 25px;
+  min-height: 52rpx;
   width: calc(100% - 40px);
   padding: 2px 20px;
   margin-bottom: 5px;
@@ -175,7 +175,7 @@ const normalRounds = computed(
   align-items: center;
 }
 .players > view > view > image:first-child {
-  width: 72px;
+  width: 135rpx;
   height: 20px;
 }
 .players > view > view > view:last-child {
@@ -185,6 +185,7 @@ const normalRounds = computed(
   font-size: 16px;
   color: #fed847;
   margin-right: 5px;
+  font-weight: 500;
 }
 .guide-row {
   display: flex;
@@ -196,6 +197,6 @@ const normalRounds = computed(
   position: relative;
 }
 .guide-row > image {
-  width: 18%;
+  width: 140rpx;
 }
 </style>

src/components/HeaderProgress.vue

@@ -174,6 +174,7 @@ onBeforeUnmount(() => {
   display: flex;
   align-items: center;
   justify-content: center;
+  font-weight: 500;
 }
 .container > button:last-child {
   width: 36px;

src/components/ShootProgress2.vue

@@ -89,9 +89,9 @@ onBeforeUnmount(() => {
   align-items: center;
 }
 .container > image {
-  width: 360rpx;
+  width: 380rpx;
   height: 80rpx;
-  transform: translateY(20rpx);
+  transform: translateY(18rpx);
 }
 .container > view:last-child {
   width: 100%;
@@ -113,7 +113,7 @@ onBeforeUnmount(() => {
   font-size: 18rpx;
   color: #fff;
   position: absolute;
-  top: 0;
+  top: -0.5rpx;
   left: 50%;
   transform: translateX(-50%);
 }

src/components/TeamAvatars.vue

@@ -65,7 +65,7 @@ watch(
       class="flag"
       :style="{
         [isRed ? 'left' : 'right']: '10rpx',
-        top: currentTeam ? '-44rpx' : '-30rpx',
+        top: currentTeam ? '-36rpx' : '-24rpx',
       }"
     />
     <view
@@ -76,7 +76,7 @@ watch(
         width: (isFirst(item.id) ? 80 : 60) + 'rpx',
         height: (isFirst(item.id) ? 80 : 60) + 'rpx',
         zIndex: team.length - ((players[item.id] || {}).sort || 0),
-        border: isFirst(item.id) ? '3rpx solid' : '2rpx solid',
+        border: isFirst(item.id) ? '3.5rpx solid' : '2rpx solid',
         borderColor: isRed ? '#ff6060' : '#5fadff',
         top: isFirst(item.id) ? '0rpx' : '12rpx',
         [isRed ? 'left' : 'right']: getPos(item.id) + 'rpx',
@@ -130,9 +130,9 @@ watch(
 }
 .player > text {
   position: absolute;
-  font-size: 16rpx;
+  font-size: 15rpx;
   text-align: center;
-  width: 80rpx;
+  width: 76rpx;
   left: 0;
   bottom: 0;
   color: #fff;

src/pages/team-battle.vue

@@ -4,7 +4,6 @@ import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import BattleHeader from "@/components/BattleHeader.vue";
 import BowTarget from "@/components/BowTarget.vue";
-import ShootProgress from "@/components/ShootProgress.vue";
 import PlayersRow from "@/components/PlayersRow.vue";
 import BattleFooter from "@/components/BattleFooter.vue";
 import ScreenHint from "@/components/ScreenHint.vue";
@@ -199,6 +198,7 @@ async function onReceiveMessage(messages = []) {
       start.value = true;
     }
     if (msg.constructor === MESSAGETYPES.ToSomeoneShoot) {
+      currentRound.value = msg.round;
       if (currentShooterId.value !== msg.userId) {
         currentShooterId.value = msg.userId;
         const redPlayer = redTeam.value.find(
@@ -380,7 +380,7 @@ onHide(() => {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-top: -1%;
+  margin-top: -2%;
   margin-bottom: 6%;
 }
 </style>