Merge branch 'new-race-mode' into test

src/components/Header.vue

@@ -59,6 +59,8 @@ const loading = ref(false);
 const pointBook = ref(null);
 const showProgress = ref(false);
 const heat = ref(0);
+/** 房间号按钮动态定位样式（position: fixed，根据胶囊真实位置计算，脱离 flex 流避免挤压标题） */
+const battleRoomBtnStyle = ref({});
 
 const updateLoading = (value) => {
   loading.value = value;
@@ -83,6 +85,23 @@ onMounted(() => {
   if (currentPage.route === "pages/team-battle") {
     showProgress.value = true;
   }
+  // 仅在对战房间页获取胶囊位置，按钮用 fixed 定位精确贴靠胶囊左侧（脱离 flex 流，不挤压标题）
+  if (currentPage.route === "pages/battle-room") {
+    try {
+      const menuButtonRect = uni.getMenuButtonBoundingClientRect();
+      const { windowWidth } = uni.getSystemInfoSync();
+      battleRoomBtnStyle.value = {
+        // 按钮右边缘距视口右侧 = 屏幕宽 - 胶囊左边缘 + 4px 安全间隙
+        right: (windowWidth - menuButtonRect.left + 4) + "px",
+        // 垂直位置与胶囊顶部对齐
+        top: menuButtonRect.top + "px",
+        // 高度与胶囊一致，视觉融合
+        height: menuButtonRect.height + "px",
+      };
+    } catch (e) {
+      // 获取失败时使用 CSS 兜底定位（28vw + 4px 作为 right，8px 作为 top）
+    }
+  }
   uni.$on("update-hot", updateHot);
 });
 onBeforeUnmount(() => {
@@ -173,12 +192,13 @@ onBeforeUnmount(() => {
     <view v-if="showProgress" class="battle-progress">
       <HeaderProgress />
     </view>
-    <!-- 对战房间：整个胶囊为分享按钮，房号从 Store 读取 -->
+    <!-- 对战房间：整个胶囊为分享按钮，房号从 Store 读取；fixed 定位紧靠系统胶囊左侧 -->
     <button
       v-if="currentPage === 'pages/battle-room' && game.roomNumber"
       open-type="share"
       hover-class="none"
       class="battle-room-number"
+      :style="battleRoomBtnStyle"
     >
       <text class="battle-room-number__text">房号: {{ game.roomNumber }}</text>
       <image src="../static/share2.png" mode="widthFix" class="battle-room-number__icon" />
@@ -270,10 +290,12 @@ onBeforeUnmount(() => {
   margin: 0 20rpx;
   max-width: 300rpx;
 }
-/* 对战房间：整个胶囊作为分享按钮，靠右对齐 */
+/* 对战房间：整个胶囊作为分享按钮，fixed 定位脱离 flex 流，紧贴系统胶囊左侧 */
 .battle-room-number {
-  margin-left: auto;
-  margin-right: 20rpx;
+  position: fixed;
+  /* 兜底定位（JS 获取胶囊位置失败时生效）：约 28vw 对应胶囊区域左边缘 */
+  right: calc(28vw + 4px);
+  top: 8px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -282,9 +304,7 @@ onBeforeUnmount(() => {
   background: rgba(0, 0, 0, 0.15);
   border-radius: 96rpx;
   border: 1rpx solid #5b5758;
-  flex-shrink: 0;
   padding: 0;
-  line-height: normal;
 }
 /* 重置 button 默认边框 */
 .battle-room-number::after {

src/pages/friend-battle-result.vue

@@ -30,15 +30,15 @@ const overlayTimer = ref(null);
 /** 控制经验条是否执行进场动画（弹窗关闭后才置 true，避免动画被遮挡） */
 const showExpAnim = ref(false);
 
-// ---- Mock 数据（等待后端补充经验接口后替换）----
-/** 本局获得的经验值（MOCK：后端暂未返回，待接口就绪后替换） */
-const expGained = ref(24);
-/** 当前经验进度值（MOCK） */
-const expCurrent = ref(66);
-/** 升级所需总经验（MOCK） */
+// ---- 经验进度条数据（onLoad 中从 teams.players 解析填充）----
+/** 本局获得的经验值 */
+const expGained = ref(0);
+/** 对战结束后当前经验进度值 */
+const expCurrent = ref(0);
+/** 升级到下一级所需的总经验（兜底 100，防止分母为 0） */
 const expTotal = ref(100);
-/** 用户当前等级（MOCK） */
-const userLvl = ref(90);
+/** 用户当前等级 */
+const userLvl = ref(0);
 
 // ---- 计算属性 ----
 
@@ -170,6 +170,20 @@ onLoad(async (options) => {
   const result = await getBattleAPI(options.battleId);
   data.value = result;
 
+  // 从 teams 各队伍的 players 中找到当前用户，解析经验进度条所需字段
+  // 后端字段：exp（本局经验）/ currentExp（当前经验）/ upgradeExp（升级所需经验）/ level（当前等级）
+  const myIdStr = String(user.value.id);
+  for (const team of Object.values(result.teams || {})) {
+    const p = (team.players || []).find((pl) => String(pl.id) === myIdStr);
+    if (p) {
+      expGained.value  = p.exp         ?? 0;
+      expCurrent.value = p.currentExp  ?? 0;
+      expTotal.value   = p.upgradeExp  ?? 100;
+      userLvl.value    = p.level       ?? 0;
+      break;
+    }
+  }
+
   // 判断当前用户是否在胜利队伍中
   // 优先使用接口返回的 winTeam 字段；若缺失则以队伍得分高低作为兜底判断
   const myId = String(user.value.id);