fix：好友约战首页调整完成

src/components/GuideTwo.vue

@@ -27,7 +27,7 @@ defineProps({
   display: flex;
   align-items: center;
   padding: 0 15px;
-  margin-bottom: 14px;
+  margin-bottom: 14rpx;
   width: clac(100% - 30px);
 }
 .container .shooter2 {

src/components/Header.vue

@@ -59,6 +59,9 @@ const loading = ref(false);
 const pointBook = ref(null);
 const showProgress = ref(false);
 const heat = ref(0);
+/** 当前对战房间的房号，由 battle-room 页面通过 uni.$emit 传入 */
+const battleRoomNumber = ref("");
+
 const updateLoading = (value) => {
   loading.value = value;
 };
@@ -67,6 +70,14 @@ const updateHot = (value) => {
   heat.value = value;
 };
 
+/**
+ * 接收 battle-room 页面发出的房间信息，更新房号展示
+ * @param {{ roomNumber: string }} info
+ */
+const updateBattleRoomInfo = (info) => {
+  battleRoomNumber.value = info.roomNumber || "";
+};
+
 onMounted(() => {
   const pages = getCurrentPages();
   const currentPage = pages[pages.length - 1];
@@ -83,9 +94,11 @@ onMounted(() => {
     showProgress.value = true;
   }
   uni.$on("update-hot", updateHot);
+  uni.$on("battle-room-info", updateBattleRoomInfo);
 });
 onBeforeUnmount(() => {
   uni.$off("update-hot", updateHot);
+  uni.$off("battle-room-info", updateBattleRoomInfo);
 });
 </script>
 
@@ -172,6 +185,16 @@ onBeforeUnmount(() => {
     <view v-if="showProgress" class="battle-progress">
       <HeaderProgress />
     </view>
+    <!-- 对战房间：整个胶囊为分享按钮，点击任意区域均可触发分享 -->
+    <button
+      v-if="currentPage === 'pages/battle-room' && battleRoomNumber"
+      open-type="share"
+      hover-class="none"
+      class="battle-room-number"
+    >
+      <text class="battle-room-number__text">房号: {{ battleRoomNumber }}</text>
+      <image src="../static/share2.png" mode="widthFix" class="battle-room-number__icon" />
+    </button>
   </view>
 </template>
 
@@ -259,4 +282,37 @@ onBeforeUnmount(() => {
   margin: 0 20rpx;
   max-width: 300rpx;
 }
+/* 对战房间：整个胶囊作为分享按钮，靠右对齐 */
+.battle-room-number {
+  margin-left: auto;
+  margin-right: 10rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 240rpx;
+  height: 64rpx;
+  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 {
+  border: none;
+}
+.battle-room-number__text {
+  width: 156rpx;
+  height: 28rpx;
+  font-weight: 400;
+  font-size: 20rpx;
+  color: #ffffff;
+  text-align: center;
+  line-height: 28rpx;
+}
+.battle-room-number__icon {
+  width: 25rpx;
+  height: 26rpx;
+}
 </style>

src/pages/battle-room.vue

@@ -29,6 +29,18 @@ const players = ref([]);
 const blueTeam = ref([]);
 const redTeam = ref([]);
 
+/**
+ * 根据对战类型和房间人数动态生成页面标题
+ * battleType=1: 组队对战；count 2/4/6 分别对应 1v1/2v2/3v3
+ * battleType=2: 多人乱斗
+ */
+const battleTitle = computed(() => {
+  if (!room.value.battleType) return "好友约战";
+  if (room.value.battleType === 2) return "多人乱斗";
+  const half = room.value.count / 2;
+  return `${half}v${half}对抗赛`;
+});
+
 const ready = ref(false);
 const allReady = ref(false);
 const timer = ref(null);
@@ -96,6 +108,9 @@ async function refreshRoomData() {
   }
   if (timer.value) clearInterval(timer.value);
   // timer.value = setTimeout(refreshRoomData, 2000);
+
+  // 通知 Header 组件更新房号展示
+  uni.$emit("battle-room-info", { roomNumber: roomNumber.value });
 }
 
 const startGame = async () => {
@@ -236,7 +251,7 @@ onBeforeUnmount(() => {
 </script>
 
 <template>
-  <Container :title="`好友约战 - ${roomNumber}`">
+  <Container :title="battleTitle">
     <view class="standby-phase">
       <GuideTwo>
         <view class="battle-guide">
@@ -247,7 +262,6 @@ onBeforeUnmount(() => {
             }}</text>
             <text v-if="room.battleType === 2">大乱斗即将开始! </text>
           </view>
-          <!-- <button hover-class="none" open-type="share">邀请</button> -->
         </view>
       </GuideTwo>
       <view v-if="room.battleType === 1 && room.count === 2" class="team-mode">
@@ -380,7 +394,7 @@ onBeforeUnmount(() => {
 .team-mode {
   width: calc(100vw - 30px);
   height: 125vw;
-  margin: 15px;
+  margin: 0 15px 15px 15px;
 }
 
 .team-mode>image:first-child {