sundynix-pets/pets-fe/pages/plan/plan.wxml

<nav-bar title="养宠计划"></nav-bar>

<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
<view class="page-body">
  <view class="page-title">
    <view class="pt-h2">养宠计划</view>
    <view class="pt-p">按宠物查看路线图、日历与 AI 计划。</view>
  </view>

  <pet-switch bind:add="onAddPet"></pet-switch>

  <view class="inline-tabs">
    <view class="it-btn {{planView === 'timeline' ? 'active' : ''}}" data-view="timeline" bindtap="switchPlanView">路线图</view>
    <view class="it-btn {{planView === 'calendar' ? 'active' : ''}}" data-view="calendar" bindtap="switchPlanView">日历</view>
    <view class="it-btn {{planView === 'aiPlan' ? 'active' : ''}}" data-view="aiPlan" bindtap="switchPlanView">AI 计划</view>
  </view>

  <!-- 路线图 -->
  <view wx:if="{{planView === 'timeline'}}">
    <view class="card">
      <view class="section-head">
        <view class="sh-title">{{pet.name}}的 30 天计划</view>
        <view class="tag warn">{{plan.completion_pct || 0}}%</view>
      </view>
      <view class="progress-row"><text>完成度</text><text>{{plan.completion_pct || 0}}%</text></view>
      <view class="bar"><view class="bar-fill" style="width:{{plan.completion_pct || 0}}%"></view></view>
    </view>
    <view class="timeline">
      <view wx:for="{{plan.tasks}}" wx:key="id" class="time-block">
        <view class="time-label">{{item.day_label}}</view>
        <view class="plan-task {{item.done ? 'done' : ''}}">
          <view class="pk-check" catchtap="toggleTimelineTask" data-id="{{item.id}}">{{item.done ? '✓' : ''}}</view>
          <view class="pk-body" data-type="{{item.sheet_type}}" bindtap="openSheet">
            <text class="pk-b">{{item.title}}</text><view class="pk-p">{{item.description}}</view>
          </view>
        </view>
      </view>
      <view wx:if="{{!plan}}" class="pt-p" style="padding:20rpx 0">暂无计划</view>
    </view>
  </view>

  <!-- 日历 -->
  <view wx:elif="{{planView === 'calendar'}}">
    <view class="calendar">
      <view class="cal-head"><text>{{calLabel}}</text><view class="link" data-type="reminders" bindtap="openSheet">提醒</view></view>
      <view class="cal-grid">
        <text class="cal-w">一</text><text class="cal-w">二</text><text class="cal-w">三</text><text class="cal-w">四</text><text class="cal-w">五</text><text class="cal-w">六</text><text class="cal-w">日</text>
        <view wx:for="{{calCells}}" wx:key="index"
              class="cal-cell {{item.today ? 'today' : ''}} {{item.tasked ? 'tasked' : ''}} {{item.day === 0 ? 'blank' : ''}}">{{item.day || ''}}</view>
      </view>
    </view>
  </view>

  <!-- AI 计划 -->
  <view wx:elif="{{planView === 'aiPlan'}}">
    <view class="card">
      <view class="section-head"><view class="sh-title">AI 计划模式</view><view class="tag purple">Plan</view></view>
      <view class="ai-plan-tip">描述 {{pet.name}} 的近况（阶段、近期变化、担心的问题），AI 会提取关键信息并生成可执行计划。</view>
      <textarea class="textarea" placeholder="例如：4 个月，刚换粮有点软便，也快打第二针疫苗" placeholder-class="placeholder" value="{{aiInput}}" bindinput="onAiInput"></textarea>
      <button class="btn btn-primary btn-block" style="margin-top:16rpx" bindtap="genAIPlan" disabled="{{aiBusy}}">{{aiBusy ? '生成中…' : '生成计划'}}</button>
    </view>

    <view wx:if="{{aiPlan}}" class="card">
      <view class="section-head"><view class="sh-title">已提取信息</view></view>
      <view class="extracted">
        <view class="extract"><text class="ex-b">阶段</text>{{aiPlan.extracted.stage}}</view>
        <view class="extract"><text class="ex-b">风险</text>{{aiPlan.extracted.risk}}</view>
        <view class="extract"><text class="ex-b">重点</text>{{aiPlan.extracted.priority}}</view>
        <view class="extract"><text class="ex-b">提醒</text>{{aiPlan.extracted.reminder}}</view>
      </view>
      <view class="section-head" style="margin-top:20rpx"><view class="sh-title">生成的计划</view></view>
      <view class="task-list">
        <view wx:for="{{aiPlan.tasks}}" wx:key="id" class="task">
          <view class="circle"></view>
          <view class="task-text"><text class="tt-b">{{item.day_label}}· {{item.title}}</text><view class="tt-p">{{item.description}}</view></view>
        </view>
      </view>
      <button class="btn btn-primary btn-block" style="margin-top:16rpx" bindtap="applyAIPlan">加入我的计划</button>
    </view>
  </view>
</view>
</scroll-view>

<fab bind:tap="onFab"></fab>
<bottom-sheet show="{{sheetShow}}" type="{{sheetType}}" bind:close="closeSheet"></bottom-sheet>