新建项目

pages/join/join.wxml

@@ -0,0 +1,57 @@
+<view class="page join-page">
+  <view class="eyebrow">JOIN THE GAME</view>
+  <view class="title">找到你的队伍</view>
+  <view class="subtitle">向房主索取六位房间码，或直接打开好友分享的小程序卡片。</view>
+
+  <view class="code-card">
+    <view class="code-label">房间码</view>
+    <input
+      type="number"
+      maxlength="6"
+      value="{{code}}"
+      placeholder="000000"
+      focus
+      bindinput="onCodeInput"
+    />
+    <view class="demo-link" bindtap="useDemoCode">没有房间？使用演示房间 731204</view>
+  </view>
+
+  <view wx:if="{{preview}}" class="card room-preview">
+    <view class="row between">
+      <view>
+        <view class="preview-label">找到房间</view>
+        <view class="card-title">{{preview.name}}</view>
+      </view>
+      <view class="pill">{{preview.players.length}} / {{preview.settings.maxPlayers}} 人</view>
+    </view>
+    <view class="divider"></view>
+    <view class="preview-meta">
+      <text>{{preview.settings.mode === 'infection' ? '感染模式' : '经典模式'}}</text>
+      <text>{{preview.settings.durationMinutes}} 分钟</text>
+      <text>{{preview.settings.radiusMeters}} 米范围</text>
+    </view>
+  </view>
+
+  <view wx:if="{{previewHint}}" class="preview-error">{{previewHint}}</view>
+
+  <view class="section-label">你的游戏昵称</view>
+  <view class="name-input">
+    <view class="name-avatar">{{avatar}}</view>
+    <input
+      maxlength="10"
+      value="{{name}}"
+      placeholder="输入昵称"
+      bindinput="onNameInput"
+    />
+  </view>
+
+  <button
+    class="primary-button join-button"
+    loading="{{submitting}}"
+    disabled="{{submitting || !canJoin}}"
+    bindtap="join"
+  >
+    加入房间
+  </button>
+  <view class="privacy-tip">加入即表示你同意本局安全规则。精确位置不会直接展示给其他玩家。</view>
+</view>