fix: resolve subscription UX issues and add placeholder pages

- Profile: show "未订阅" card when subscription inactive/0 days
- Profile: subscription management navigates to page instead of modal
- Subscribe-plans: data-driven plan cards with mock payment flow
- Subscribe-plans: show current subscription status at top
- Subscribe-prompt: "先使用普通模式" goes to wear-check directly
- Add help and contact placeholder pages
- Fix unbindDevice to work without explicit deviceId

miniprogram/app.json

@@ -14,7 +14,9 @@
     "pages/subscribe-plans/subscribe-plans",
     "pages/subscribe-success/subscribe-success",
     "pages/profile/profile",
-    "pages/history/history"
+    "pages/history/history",
+    "pages/help/help",
+    "pages/contact/contact"
   ],
   "window": {
     "navigationBarBackgroundColor": "#ffffff",

miniprogram/pages/contact/contact.js

@@ -0,0 +1,18 @@
+Page({
+  data: {
+    statusBarHeight: 44
+  },
+
+  onLoad: function () {
+    var app = getApp()
+    this.setData({ statusBarHeight: app.globalData.statusBarHeight })
+  },
+
+  onBack: function () {
+    wx.navigateBack({
+      fail: function () {
+        wx.switchTab({ url: '/pages/profile/profile' })
+      }
+    })
+  }
+})

miniprogram/pages/contact/contact.json

@@ -0,0 +1,4 @@
+{
+  "navigationStyle": "custom",
+  "navigationBarTitleText": "联系我们"
+}

miniprogram/pages/contact/contact.wxml

@@ -0,0 +1,9 @@
+<view class="page">
+  <view class="page-header" style="padding-top: {{statusBarHeight + 24}}px;">
+    <view class="nav-back" bindtap="onBack">‹ 返回</view>
+    <view class="page-header-title">联系我们</view>
+  </view>
+  <view class="page-content">
+    <view class="placeholder">内容建设中...</view>
+  </view>
+</view>

miniprogram/pages/contact/contact.wxss

@@ -0,0 +1,6 @@
+.placeholder {
+  text-align: center;
+  color: #999999;
+  font-size: 28rpx;
+  padding: 80rpx 0;
+}

miniprogram/pages/help/help.js

@@ -0,0 +1,18 @@
+Page({
+  data: {
+    statusBarHeight: 44
+  },
+
+  onLoad: function () {
+    var app = getApp()
+    this.setData({ statusBarHeight: app.globalData.statusBarHeight })
+  },
+
+  onBack: function () {
+    wx.navigateBack({
+      fail: function () {
+        wx.switchTab({ url: '/pages/profile/profile' })
+      }
+    })
+  }
+})

miniprogram/pages/help/help.json

@@ -0,0 +1,4 @@
+{
+  "navigationStyle": "custom",
+  "navigationBarTitleText": "使用帮助"
+}

miniprogram/pages/help/help.wxml

@@ -0,0 +1,9 @@
+<view class="page">
+  <view class="page-header" style="padding-top: {{statusBarHeight + 24}}px;">
+    <view class="nav-back" bindtap="onBack">‹ 返回</view>
+    <view class="page-header-title">使用帮助</view>
+  </view>
+  <view class="page-content">
+    <view class="placeholder">内容建设中...</view>
+  </view>
+</view>

miniprogram/pages/help/help.wxss

@@ -0,0 +1,6 @@
+.placeholder {
+  text-align: center;
+  color: #999999;
+  font-size: 28rpx;
+  padding: 80rpx 0;
+}

miniprogram/pages/profile/profile.js

@@ -60,22 +60,21 @@ Page({
   },
 
   onViewSubscription: function () {
-    if (!this.data.subscription || this.data.subscription.status !== 'active') {
-      wx.navigateTo({ url: '/pages/subscribe-plans/subscribe-plans' })
-    } else {
-      var sub = this.data.subscription
-      wx.showModal({
-        title: '订阅信息',
-        content: '套餐类型：' + (sub.plan || '未知') + '\n剩余天数：' + (sub.remaining_days || 0) + '天',
-        showCancel: false
-      })
-    }
+    wx.navigateTo({ url: '/pages/subscribe-plans/subscribe-plans' })
   },
 
   onViewHistory: function () {
     wx.switchTab({ url: '/pages/history/history' })
   },
 
+  onHelp: function () {
+    wx.navigateTo({ url: '/pages/help/help' })
+  },
+
+  onContact: function () {
+    wx.navigateTo({ url: '/pages/contact/contact' })
+  },
+
   onLogout: function () {
     wx.showModal({
       title: '退出登录',

miniprogram/pages/profile/profile.wxml

@@ -8,12 +8,19 @@
       </view>
     </view>
 
-    <view class="sub-card" wx:if="{{subscription}}">
+    <view class="sub-card" wx:if="{{subscription && subscription.status === 'active' && subRemaining > 0}}">
       <view class="sub-left">
         <view class="sub-name">✨ 智能模式</view>
         <view class="sub-remain">剩余 {{subRemaining}}天</view>
       </view>
-      <text class="status-badge status-badge-gold">试用中</text>
+      <text class="status-badge status-badge-gold">使用中</text>
+    </view>
+    <view class="sub-card sub-card-inactive" wx:else bindtap="onViewSubscription">
+      <view class="sub-left">
+        <view class="sub-name">智能模式</view>
+        <view class="sub-remain">未订阅</view>
+      </view>
+      <text class="status-badge" style="background:#eee;color:#999;">去订阅 ›</text>
     </view>
 
     <view class="menu-list">
@@ -34,12 +41,12 @@
         <view class="menu-text">订阅管理</view>
         <text class="menu-arrow">›</text>
       </view>
-      <view class="menu-item">
+      <view class="menu-item" bindtap="onHelp">
         <view class="menu-icon">❓</view>
         <view class="menu-text">使用帮助</view>
         <text class="menu-arrow">›</text>
       </view>
-      <view class="menu-item">
+      <view class="menu-item" bindtap="onContact">
         <view class="menu-icon">📞</view>
         <view class="menu-text">联系我们</view>
         <text class="menu-arrow">›</text>

miniprogram/pages/profile/profile.wxss

@@ -107,6 +107,11 @@
   color: #999;
 }
 
+.sub-card-inactive {
+  background: #f5f5f5;
+  border: 1px dashed #d9d9d9;
+}
+
 .logout-btn {
   text-align: center;
   color: #ff4d4f;

miniprogram/pages/subscribe-plans/subscribe-plans.js

@@ -1,14 +1,17 @@
-var http = require('../../utils/request')
+var api = require('../../utils/api')
+var config = require('../../config/env')
 
 Page({
   data: {
     statusBarHeight: 44,
     plans: [
-      { plan: 'monthly', price: '¥99', desc: '约3.3元/天' },
-      { plan: 'yearly', price: '¥899', desc: '省¥289' }
+      { key: 'monthly', name: '月卡', price: 99, priceLabel: '¥99', desc: '约3.3元/天' },
+      { key: 'yearly', name: '年卡', price: 899, priceLabel: '¥899', desc: '省¥289', tag: '推荐' }
     ],
     selected: 'yearly',
-    purchasing: false
+    purchasing: false,
+    subscription: null,
+    subRemaining: 0
   },
 
   onBack: function () {
@@ -24,15 +27,59 @@ Page({
     this.setData({ statusBarHeight: app.globalData.statusBarHeight })
   },
 
+  onShow: function () {
+    this.loadSubscription()
+  },
+
+  loadSubscription: function () {
+    var self = this
+    api.getSubscription().then(function (sub) {
+      self.setData({
+        subscription: sub,
+        subRemaining: sub.remaining_days || 0
+      })
+    }).catch(function () {})
+  },
+
   onSelect: function (e) {
     this.setData({ selected: e.currentTarget.dataset.plan })
   },
 
   onPurchase: function () {
+    var self = this
+    var selected = this.data.selected
+    var plan = null
+    for (var i = 0; i < this.data.plans.length; i++) {
+      if (this.data.plans[i].key === selected) {
+        plan = this.data.plans[i]
+        break
+      }
+    }
+    if (!plan) return
+
     wx.showModal({
-      title: '暂未开放',
-      content: '在线购买功能尚未开放，请联系管理员开通订阅。',
-      showCancel: false
+      title: '确认支付',
+      content: '模拟支付 ¥' + plan.price + '？（测试环境）',
+      success: function (res) {
+        if (res.confirm) {
+          self.doPurchase(plan)
+        }
+      }
+    })
+  },
+
+  doPurchase: function (plan) {
+    var self = this
+    self.setData({ purchasing: true })
+    api.purchase(plan.key).then(function (order) {
+      self.setData({ purchasing: false })
+      wx.showToast({ title: '支付成功', icon: 'success' })
+      setTimeout(function () {
+        wx.redirectTo({ url: '/pages/subscribe-success/subscribe-success?plan=' + plan.key })
+      }, 1000)
+    }).catch(function (err) {
+      self.setData({ purchasing: false })
+      wx.showToast({ title: err.message || '支付失败', icon: 'none' })
     })
   }
 })

miniprogram/pages/subscribe-plans/subscribe-plans.wxml

@@ -6,6 +6,18 @@
   </view>
 
   <view class="page-content">
+    <!-- Current subscription status -->
+    <view class="current-sub" wx:if="{{subscription && subscription.status === 'active' && subRemaining > 0}}">
+      <view class="current-sub-row">
+        <text class="current-sub-label">当前套餐</text>
+        <text class="current-sub-value">{{subscription.plan === 'trial' ? '试用' : subscription.plan === 'monthly' ? '月卡' : subscription.plan === 'yearly' ? '年卡' : subscription.plan}}</text>
+      </view>
+      <view class="current-sub-row">
+        <text class="current-sub-label">剩余天数</text>
+        <text class="current-sub-value">{{subRemaining}}天</text>
+      </view>
+    </view>
+
     <view class="page-title">选择订阅套餐</view>
 
     <view class="service-card">
@@ -17,17 +29,11 @@
     </view>
 
     <view class="plans">
-      <view class="plan {{selected === 'monthly' ? 'selected' : ''}}" bindtap="onSelect" data-plan="monthly">
-        <view class="plan-price">¥99</view>
-        <view class="plan-name">月卡</view>
-        <view class="plan-save">约3.3元/天</view>
-      </view>
-      <view class="plan {{selected === 'yearly' ? 'selected' : ''}}" bindtap="onSelect" data-plan="yearly">
-        <view class="plan-tag" wx:if="{{selected !== 'yearly'}}">推荐</view>
-        <view class="plan-tag plan-tag-active" wx:else>推荐</view>
-        <view class="plan-price">¥899</view>
-        <view class="plan-name">年卡</view>
-        <view class="plan-save">省¥289</view>
+      <view class="plan {{selected === item.key ? 'selected' : ''}}" wx:for="{{plans}}" wx:key="key" bindtap="onSelect" data-plan="{{item.key}}">
+        <view class="plan-tag {{selected === item.key ? 'plan-tag-active' : ''}}" wx:if="{{item.tag}}">{{item.tag}}</view>
+        <view class="plan-price">{{item.priceLabel}}</view>
+        <view class="plan-name">{{item.name}}</view>
+        <view class="plan-save">{{item.desc}}</view>
       </view>
     </view>
 

miniprogram/pages/subscribe-plans/subscribe-plans.wxss

@@ -1,3 +1,29 @@
+.current-sub {
+  background: #fff9e6;
+  border: 2rpx solid #DCB982;
+  border-radius: 20rpx;
+  padding: 20rpx 24rpx;
+  margin-bottom: 24rpx;
+}
+
+.current-sub-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8rpx 0;
+}
+
+.current-sub-label {
+  font-size: 24rpx;
+  color: #666666;
+}
+
+.current-sub-value {
+  font-size: 24rpx;
+  color: #333333;
+  font-weight: 600;
+}
+
 .service-card {
   display: flex;
   align-items: center;

miniprogram/pages/subscribe-prompt/subscribe-prompt.js

@@ -18,5 +18,9 @@ Page({
         wx.reLaunch({ url: '/pages/index/index' })
       }
     })
+  },
+
+  onUseFreeMode: function () {
+    wx.redirectTo({ url: '/pages/wear-check/wear-check?mode=0' })
   }
 })

miniprogram/pages/subscribe-prompt/subscribe-prompt.wxml

@@ -30,6 +30,6 @@
     </view>
 
     <button class="btn-primary btn-primary-gold" bindtap="onViewPlans">立即订阅</button>
-    <button class="btn-secondary" bindtap="onBack">先使用普通模式</button>
+    <button class="btn-secondary" bindtap="onUseFreeMode">先使用普通模式</button>
   </view>
 </view>

miniprogram/utils/api.js

@@ -14,7 +14,7 @@ module.exports = {
   bindDevice: function (deviceId) { return http.post('/api/v1/device/bind', { device_id: deviceId }) },
   confirmBind: function (deviceId, token) { return http.post('/api/v1/device/bind/confirm', { device_id: deviceId, bind_token: token }) },
   mockBind: function (deviceId) { return http.post('/api/v1/device/mock-bind', { device_id: deviceId }) },
-  unbindDevice: function (deviceId) { return http.post('/api/v1/device/unbind', { device_id: deviceId }) },
+  unbindDevice: function (deviceId) { return http.post('/api/v1/device/unbind', deviceId ? { device_id: deviceId } : {}) },
 
   // Subscription
   getSubscription: function () { return http.get('/api/v1/subscription') },