Initial Commit

pages/account-sync/phone-binding/phone-binding.wxml

@@ -0,0 +1,141 @@
+<!--手机号绑定页面-->
+<view class="container" style="height: {{windowHeight}}px;">
+  
+  <!-- 自定义导航栏 -->
+  <view class="custom-navbar" style="height: {{navBarHeight}}px; padding-top: {{statusBarHeight}}px;">
+    <view class="navbar-content">
+      <view class="navbar-left" bindtap="goBack">
+        <text class="back-icon">←</text>
+      </view>
+      <view class="navbar-title">绑定手机号</view>
+      <view class="navbar-right"></view>
+    </view>
+  </view>
+
+  <!-- 主要内容 -->
+  <view class="main-content">
+    
+    <!-- 头部说明 -->
+    <view class="header-section">
+      <view class="header-icon">📱</view>
+      <view class="header-title">绑定手机号</view>
+      <view class="header-desc">为了更好的使用体验和账号安全，请绑定您的手机号</view>
+    </view>
+
+    <!-- 表单区域 -->
+    <view class="form-section">
+      
+      <!-- 手机号输入 -->
+      <view class="input-group">
+        <text class="input-label">手机号</text>
+        <view class="input-container">
+          <view class="input-icon">📱</view>
+          <input 
+            class="phone-input" 
+            type="number" 
+            placeholder="请输入手机号" 
+            maxlength="11"
+            value="{{phoneNumber}}"
+            bindinput="onPhoneInput"
+            placeholder-class="input-placeholder"
+          />
+        </view>
+      </view>
+
+      <!-- 验证码输入 -->
+      <view class="input-group">
+        <text class="input-label">验证码</text>
+        <view class="input-container code-container">
+          <view class="input-icon">🔐</view>
+          <input 
+            class="code-input" 
+            type="number" 
+            placeholder="请输入验证码" 
+            maxlength="6"
+            value="{{verifyCode}}"
+            bindinput="onCodeInput"
+            placeholder-class="input-placeholder"
+          />
+          <view 
+            class="code-button {{canSendCode ? 'active' : 'disabled'}}" 
+            bindtap="sendVerifyCode"
+          >
+            <text class="code-button-text">{{codeButtonText}}</text>
+          </view>
+        </view>
+      </view>
+
+      <!-- 绑定按钮 -->
+      <view 
+        class="bind-button {{canBind ? 'active' : 'disabled'}}" 
+        bindtap="handleBind"
+      >
+        <view class="bind-content">
+          <view class="bind-icon" wx:if="{{isBinding}}">⏳</view>
+          <view class="bind-icon" wx:else>🔗</view>
+          <text class="bind-text">{{isBinding ? '绑定中...' : '立即绑定'}}</text>
+        </view>
+      </view>
+
+    </view>
+
+    <!-- 温馨提示 -->
+    <view class="tips-section">
+      <view class="tips-title">温馨提示</view>
+      <view class="tips-item">• 绑定手机号后可以更安全地管理您的账号</view>
+      <view class="tips-item">• 如果该手机号已关联其他账号，系统会提示您进行账号合并</view>
+      <view class="tips-item">• 账号合并后，所有数据将统一到当前账号</view>
+    </view>
+
+  </view>
+
+  <!-- 账号合并对话框 -->
+  <view class="merge-dialog-mask" wx:if="{{showMergeDialog}}" bindtap="closeMergeDialog">
+    <view class="merge-dialog" catchtap="">
+      
+      <view class="dialog-header">
+        <view class="dialog-title">发现可合并的账号</view>
+        <view class="dialog-close" bindtap="closeMergeDialog">×</view>
+      </view>
+
+      <view class="dialog-content">
+        <view class="dialog-desc">该手机号已关联以下账号，请选择处理方式：</view>
+        
+        <!-- 候选账号列表 -->
+        <view class="candidates-list">
+          <view
+            class="candidate-item"
+            wx:for="{{mergeCandidates}}"
+            wx:key="customId"
+          >
+            <view class="candidate-info">
+              <view class="candidate-name">{{item.nickname || '未知用户'}}</view>
+              <view class="candidate-detail">
+                <text class="detail-item">注册时间：{{item.registerTime}}</text>
+                <text class="detail-item">匹配原因：{{item.matchReason}}</text>
+                <text class="detail-item">可信度：{{item.confidence}}%</text>
+              </view>
+            </view>
+            <view
+              class="merge-btn"
+              data-custom-id="{{item.customId}}"
+              bindtap="mergeSpecificAccount"
+            >
+              合并此账号
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <view class="dialog-actions">
+        <view class="action-btn cancel-btn" bindtap="closeMergeDialog">取消</view>
+        <view class="action-btn auto-btn" bindtap="autoMergeAll">自动合并所有</view>
+      </view>
+
+    </view>
+  </view>
+
+  <!-- 安全区域占位 -->
+  <view style="height: {{safeAreaBottom}}px;"></view>
+
+</view>