feat ：init

miniprogram/pages/member/bind/bind.wxml

@@ -0,0 +1,271 @@
+<!--pages/member/bind/bind.wxml-->
+<view class="container">
+  <!-- 页面标题 -->
+  <view class="page-header">
+    <view class="header-content">
+      <image class="header-icon" src="/images/bind/member-icon.png" mode="aspectFit"></image>
+      <view class="header-text">
+        <view class="header-title">会员绑定</view>
+        <view class="header-desc">绑定会员账号，享受专属权益</view>
+      </view>
+    </view>
+  </view>
+
+  <!-- 当前状态卡片 -->
+  <view class="status-card card">
+    <view class="status-content">
+      <view class="status-icon">
+        <image src="{{statusInfo.icon}}" mode="aspectFit"></image>
+      </view>
+      <view class="status-text">
+        <view class="status-title">{{statusInfo.title}}</view>
+        <view class="status-desc">{{statusInfo.desc}}</view>
+      </view>
+      <view class="status-badge {{statusInfo.badgeClass}}" wx:if="{{statusInfo.badge}}">
+        {{statusInfo.badge}}
+      </view>
+    </view>
+  </view>
+
+  <!-- 绑定表单 -->
+  <view class="bind-form card" wx:if="{{!memberInfo.isBound}}">
+    <view class="card-header">
+      <text class="text-lg font-bold">绑定会员账号</text>
+    </view>
+    <view class="card-body">
+      <form bindsubmit="handleSubmit">
+        <!-- 手机号输入 -->
+        <view class="form-group">
+          <view class="form-label">手机号码</view>
+          <view class="input-group">
+            <input 
+              class="form-input" 
+              type="number" 
+              placeholder="请输入手机号码"
+              value="{{formData.phone}}"
+              bindinput="onPhoneInput"
+              maxlength="11"
+            />
+            <view class="input-suffix" wx:if="{{formData.phone && isValidPhone}}">
+              <image src="/images/icons/check-green.png" mode="aspectFit"></image>
+            </view>
+          </view>
+          <view class="form-error" wx:if="{{errors.phone}}">{{errors.phone}}</view>
+        </view>
+
+        <!-- 验证码输入 -->
+        <view class="form-group">
+          <view class="form-label">验证码</view>
+          <view class="input-group">
+            <input 
+              class="form-input flex-1" 
+              type="number" 
+              placeholder="请输入验证码"
+              value="{{formData.verifyCode}}"
+              bindinput="onVerifyCodeInput"
+              maxlength="6"
+            />
+            <button 
+              class="verify-btn {{canSendCode ? 'active' : 'disabled'}}" 
+              bindtap="sendVerifyCode"
+              disabled="{{!canSendCode}}"
+            >
+              {{verifyCodeText}}
+            </button>
+          </view>
+          <view class="form-error" wx:if="{{errors.verifyCode}}">{{errors.verifyCode}}</view>
+        </view>
+
+        <!-- 会员卡号输入 -->
+        <view class="form-group">
+          <view class="form-label">会员卡号</view>
+          <view class="input-group">
+            <input 
+              class="form-input" 
+              type="text" 
+              placeholder="请输入会员卡号"
+              value="{{formData.memberCard}}"
+              bindinput="onMemberCardInput"
+            />
+            <view class="input-suffix" bindtap="scanMemberCard">
+              <image src="/images/icons/scan.png" mode="aspectFit"></image>
+            </view>
+          </view>
+          <view class="form-error" wx:if="{{errors.memberCard}}">{{errors.memberCard}}</view>
+        </view>
+
+        <!-- 密码输入 -->
+        <view class="form-group">
+          <view class="form-label">会员密码</view>
+          <view class="input-group">
+            <input 
+              class="form-input" 
+              type="{{showPassword ? 'text' : 'password'}}" 
+              placeholder="请输入会员密码"
+              value="{{formData.password}}"
+              bindinput="onPasswordInput"
+            />
+            <view class="input-suffix" bindtap="togglePassword">
+              <image src="/images/icons/{{showPassword ? 'eye-off' : 'eye'}}.png" mode="aspectFit"></image>
+            </view>
+          </view>
+          <view class="form-error" wx:if="{{errors.password}}">{{errors.password}}</view>
+        </view>
+
+        <!-- 协议同意 -->
+        <view class="agreement-group">
+          <label class="agreement-item">
+            <checkbox 
+              value="agree" 
+              checked="{{agreeTerms}}" 
+              bindchange="onAgreeChange"
+            />
+            <text class="agreement-text">
+              我已阅读并同意
+              <text class="link" bindtap="showTerms">《会员服务协议》</text>
+              和
+              <text class="link" bindtap="showPrivacy">《隐私政策》</text>
+            </text>
+          </label>
+        </view>
+
+        <!-- 提交按钮 -->
+        <button 
+          class="btn btn-primary btn-block btn-large {{canSubmit ? '' : 'btn-disabled'}}" 
+          form-type="submit"
+          disabled="{{!canSubmit || submitting}}"
+        >
+          {{submitting ? '绑定中...' : '立即绑定'}}
+        </button>
+      </form>
+    </view>
+  </view>
+
+  <!-- 已绑定状态 -->
+  <view class="bound-info card" wx:if="{{memberInfo.isBound}}">
+    <view class="card-header">
+      <text class="text-lg font-bold">会员信息</text>
+    </view>
+    <view class="card-body">
+      <view class="member-details">
+        <view class="detail-item">
+          <view class="detail-label">会员等级</view>
+          <view class="detail-value">
+            <view class="member-badge {{memberInfo.level}}">{{memberInfo.levelText}}</view>
+          </view>
+        </view>
+        <view class="detail-item">
+          <view class="detail-label">会员卡号</view>
+          <view class="detail-value">{{memberInfo.memberCard}}</view>
+        </view>
+        <view class="detail-item">
+          <view class="detail-label">绑定手机</view>
+          <view class="detail-value">{{memberInfo.phone}}</view>
+        </view>
+        <view class="detail-item">
+          <view class="detail-label">绑定时间</view>
+          <view class="detail-value">{{memberInfo.bindTimeText}}</view>
+        </view>
+        <view class="detail-item" wx:if="{{memberInfo.expireTime}}">
+          <view class="detail-label">到期时间</view>
+          <view class="detail-value {{memberInfo.expireInfo.isExpired ? 'text-danger' : 'text-success'}}">
+            {{memberInfo.expireInfo.text}}
+          </view>
+        </view>
+      </view>
+
+      <!-- 操作按钮 -->
+      <view class="action-buttons">
+        <button class="btn btn-outline btn-block" bindtap="showUnbindConfirm">
+          解除绑定
+        </button>
+        <button class="btn btn-primary btn-block mt-2" bindtap="navigateToCenter">
+          查看权益
+        </button>
+      </view>
+    </view>
+  </view>
+
+  <!-- 绑定说明 -->
+  <view class="help-card card">
+    <view class="card-header">
+      <text class="text-lg font-bold">绑定说明</text>
+    </view>
+    <view class="card-body">
+      <view class="help-list">
+        <view class="help-item">
+          <view class="help-icon">
+            <image src="/images/icons/info.png" mode="aspectFit"></image>
+          </view>
+          <view class="help-text">绑定后可享受会员专属权益和服务</view>
+        </view>
+        <view class="help-item">
+          <view class="help-icon">
+            <image src="/images/icons/security.png" mode="aspectFit"></image>
+          </view>
+          <view class="help-text">您的个人信息将被严格保护</view>
+        </view>
+        <view class="help-item">
+          <view class="help-icon">
+            <image src="/images/icons/support.png" mode="aspectFit"></image>
+          </view>
+          <view class="help-text">如有问题请联系客服：400-123-4567</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</view>
+
+<!-- 解绑确认弹窗 -->
+<view class="unbind-modal" wx:if="{{showUnbindModal}}" bindtap="hideUnbindConfirm">
+  <view class="modal-content" catchtap="stopPropagation">
+    <view class="modal-header">
+      <text class="modal-title">确认解除绑定</text>
+    </view>
+    <view class="modal-body">
+      <view class="unbind-warning">
+        <image class="warning-icon" src="/images/icons/warning.png" mode="aspectFit"></image>
+        <view class="warning-text">
+          <view class="warning-title">解除绑定后将失去以下权益：</view>
+          <view class="warning-list">
+            <text>• 会员专属功能和服务</text>
+            <text>• 积分和优惠券</text>
+            <text>• 会员等级和特权</text>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="modal-footer">
+      <button class="btn btn-secondary" bindtap="hideUnbindConfirm">取消</button>
+      <button class="btn btn-danger ml-2" bindtap="confirmUnbind">确认解绑</button>
+    </view>
+  </view>
+</view>
+
+<!-- 协议弹窗 -->
+<view class="agreement-modal" wx:if="{{showAgreementModal}}" bindtap="hideAgreement">
+  <view class="modal-content" catchtap="stopPropagation">
+    <view class="modal-header">
+      <text class="modal-title">{{agreementTitle}}</text>
+      <view class="modal-close" bindtap="hideAgreement">
+        <image src="/images/icons/close.png" mode="aspectFit"></image>
+      </view>
+    </view>
+    <view class="modal-body">
+      <scroll-view class="agreement-content" scroll-y="true">
+        <rich-text nodes="{{agreementContent}}"></rich-text>
+      </scroll-view>
+    </view>
+    <view class="modal-footer">
+      <button class="btn btn-primary btn-block" bindtap="hideAgreement">我知道了</button>
+    </view>
+  </view>
+</view>
+
+<!-- 加载状态 -->
+<view class="loading-overlay" wx:if="{{loading}}">
+  <view class="loading-content">
+    <view class="loading-spinner"></view>
+    <text>{{loadingText}}</text>
+  </view>
+</view>