refactor: 方案制定页改为分步表单UI，隐藏AI对话界面

- 去掉聊天气泡样式，改为 3 步流程（选报告→提需求→确认方案）
- 步骤指示器 + 卡片式报告选择
- 需求输入区改为标准表单，非对话样式
- LangGraph 调用逻辑不变（aiSendMessage），仅前端 UI 改造
- 方案结果以普通卡片展示，任务列表支持执行人修改

cfc-frontend/pages/health/health-plan-summary.vue

@@ -2,137 +2,182 @@
   <view class="plan-page">
     <!-- 顶部导航 -->
     <view class="nav-bar">
-      <text class="nav-back" @click="goBack">&#8249; 返回</text>
+      <text class="nav-back" @click="goBack">\ue601 返回</text>
       <text class="nav-title">方案制定</text>
       <view class="nav-placeholder"></view>
     </view>
 
-    <!-- 报告选择区 -->
-    <view class="section">
-      <view class="section-title">&#128203; 选择参考报告</view>
-      <view class="report-tags">
-        <view
-          v-for="(r, rIdx) in allReports"
-          :key="r.id"
-          class="report-tag"
-          :class="{ active: selectedReportIds.indexOf(r.id) >= 0 }"
-          @click="toggleReport(r.id)"
-        >
-          <text class="report-member">{{ r.memberName || '未绑定' }}</text>
-          <text class="report-type">{{ r.reportType === 'gut_flora' ? '&#129323;' : '&#128203;' }} {{ r.reportType === 'gut_flora' ? '菌群' : '体检' }}</text>
-          <text class="report-date">{{ formatDate(r.reportDate) }}</text>
-        </view>
-        <view v-if="allReports.length === 0" class="empty-hint">暂无健康报告</view>
+    <!-- 步骤指示器 -->
+    <view class="steps-bar">
+      <view class="step" :class="{ active: step >= 1, done: step > 1 }">
+        <text class="step-num">1</text>
+        <text class="step-label">选报告</text>
+      </view>
+      <view class="step-line" :class="{ done: step > 1 }"></view>
+      <view class="step" :class="{ active: step >= 2, done: step > 2 }">
+        <text class="step-num">2</text>
+        <text class="step-label">提需求</text>
+      </view>
+      <view class="step-line" :class="{ done: step > 2 }"></view>
+      <view class="step" :class="{ active: step >= 3 }">
+        <text class="step-num">3</text>
+        <text class="step-label">确认方案</text>
       </view>
     </view>
 
-    <!-- AI 对话区 -->
-    <view class="section">
-      <view class="section-title">&#128172; 输入您的需求</view>
-      <view class="chat-area">
-        <view v-if="messages.length === 0" class="empty-chat">
-          <text class="empty-chat-text">选择报告后，在这里描述您的需求，AI 将为您生成健康方案</text>
-        </view>
+    <!-- Step 1: 报告选择 -->
+    <view class="section" v-if="step <= 2">
+      <view class="section-title">选择参考报告</view>
+      <view class="hint-text">可多选，支持其他家人的报告</view>
+      <view class="report-list">
         <view
-          v-for="(msg, idx) in messages"
+          v-for="(r, idx) in allReports"
           :key="idx"
-          class="chat-msg"
-          :class="msg.role"
+          class="report-card"
+          :class="{ active: selectedReportIds.indexOf(r.id) >= 0 }"
+          @click="toggleReport(r.id)"
         >
-          <view class="chat-bubble">
-            <text class="chat-content">{{ msg.content }}</text>
+          <view class="report-card-left">
+            <text class="report-card-icon">{{ r.reportType === 'gut_flora' ? '🦠' : '🩺' }}</text>
+            <view class="report-card-info">
+              <text class="report-card-name">{{ r.memberName || '未绑定' }}</text>
+              <text class="report-card-type">{{ r.reportType === 'gut_flora' ? '菌群检测' : '体检报告' }}</text>
+            </view>
           </view>
-        </view>
-        <view v-if="loading" class="chat-msg ai">
-          <view class="chat-bubble typing">
-            <text class="typing-dots">&#46;&#46;&#46;</text>
+          <view class="report-card-right">
+            <text class="report-card-date">{{ formatDate(r.reportDate) }}</text>
+            <text class="report-check" v-if="selectedReportIds.indexOf(r.id) >= 0">&#10003;</text>
           </view>
         </view>
+        <view v-if="allReports.length === 0" class="empty-state">
+          <text class="empty-icon">📋</text>
+          <text class="empty-text">暂无健康报告</text>
+        </view>
       </view>
+      <button class="btn-next" :disabled="selectedReportIds.length === 0 || loading" @click="step = 2">
+        {{ loading ? '生成中...' : '下一步' }}
+      </button>
     </view>
 
-    <!-- 输入框 -->
-    <view class="input-bar" v-if="!taskSubmitted">
+    <!-- Step 2: 输入需求 -->
+    <view class="section" v-if="step === 2">
+      <view class="section-title">描述您的需求</view>
+      <view class="hint-text">请详细说明您希望改善的方向，系统将为您定制方案</view>
       <textarea
-        class="goal-input"
+        class="goal-textarea"
         v-model="userGoal"
-        placeholder="例如：改善孩子睡眠质量、调理脾胃、提升免疫力..."
+        placeholder="例如：孩子最近睡眠不好，总是晚睡早起困难，希望改善睡眠质量；同时想提升免疫力减少生病次数..."
         :maxlength="300"
         auto-height
+        :disabled="loading"
       ></textarea>
-      <view class="send-btn" :class="{ disabled: !canSend || loading }" @click="sendMessage">
-        <text class="send-icon">{{ loading ? '\u23F3' : '\u27A1' }}</text>
+      <view class="goal-footer">
+        <text class="goal-count">{{ userGoal.length }}/300</text>
+        <button
+          class="btn-generate"
+          :class="{ disabled: !canGenerate || loading }"
+          :disabled="!canGenerate || loading"
+          @click="generatePlan"
+        >
+          {{ loading ? '正在生成方案...' : '生成方案' }}
+        </button>
       </view>
+      <view class="back-link" @click="step = 1">\ue601 返回选择报告</view>
     </view>
 
-    <!-- 任务预览区（AI 回复后显示） -->
-    <view class="section task-section" v-if="parsedTasks.length > 0 && !taskSubmitted">
-      <view class="section-title">&#128221; 生成任务单</view>
+    <!-- Step 3: 方案 & 任务 -->
+    <view class="section task-section" v-if="step === 3 && parsedTasks.length > 0 && !taskSubmitted">
+      <view class="section-title">健康方案</view>
+
+      <!-- 方案原文 -->
+      <view class="plan-preview" v-if="planContent">
+        <view class="plan-preview-label">方案详情</view>
+        <text class="plan-preview-text">{{ planContent }}</text>
+      </view>
+
+      <!-- 任务列表 -->
+      <view class="section-title" style="margin-top:24rpx">执行任务</view>
       <view class="task-list">
         <view v-for="(task, tIdx) in parsedTasks" :key="tIdx" class="task-card">
-          <view class="task-header">
-            <text class="task-num">{{ tIdx + 1 }}.</text>
+          <view class="task-num-wrap">
+            <text class="task-num">{{ tIdx + 1 }}</text>
+          </view>
+          <view class="task-body">
             <text class="task-title">{{ task.title }}</text>
+            <text class="task-desc" v-if="task.description">{{ task.description }}</text>
           </view>
-          <view class="task-desc" v-if="task.description">{{ task.description }}</view>
-          <view class="task-footer">
-            <text class="task-exec-label">执行人：</text>
-            <view class="exec-select">
+          <view class="task-exec-row">
+            <text class="task-exec-label">执行人</text>
+            <view class="exec-row">
               <view
                 v-for="m in executors"
                 :key="m.memberId"
                 class="exec-chip"
                 :class="{ active: task.executorId === m.memberId }"
-                @click="setExecutor(tIdx, m)"
+                @click="task.executorId = m.memberId"
               >
                 <text>{{ m.name }}</text>
               </view>
-              <view class="exec-chip no-exec" :class="{ active: task.executorId === '__self__' }" @click="setExecutor(tIdx, {memberId:'__self__',name:'自己'})">
+              <view
+                class="exec-chip no-exec"
+                :class="{ active: task.executorId === '__self__' }"
+                @click="task.executorId = '__self__'"
+              >
                 <text>自己</text>
               </view>
             </view>
           </view>
         </view>
       </view>
+
       <view class="task-actions">
-        <button class="btn-edit" @click="resetTasks">重新生成</button>
-        <button class="btn-confirm" :disabled="!canConfirmTasks" @click="submitTasks">确认并生成任务</button>
+        <button class="btn-edit" @click="regenerate">重新生成</button>
+        <button
+          class="btn-confirm"
+          :class="{ disabled: !canConfirmTasks }"
+          :disabled="!canConfirmTasks"
+          @click="submitTasks"
+        >
+          确认并生成任务单
+        </button>
       </view>
+      <view class="back-link" @click="step = 2">\ue601 返回修改需求</view>
     </view>
 
-    <!-- 成功提示 -->
+    <!-- 成功 -->
     <view v-if="taskSubmitted" class="success-overlay">
-      <text class="success-icon">&#10003;</text>
-      <text class="success-text">{{ taskSubmittedCount }} 个任务已创建</text>
-      <button class="btn-done" @click="goBack">完成</button>
+      <view class="success-card">
+        <text class="success-icon">&#9989;</text>
+        <text class="success-title">方案已确认</text>
+        <text class="success-sub">已为您创建 {{ taskSubmittedCount }} 个执行任务</text>
+        <button class="btn-done" @click="goBack">完成</button>
+      </view>
     </view>
   </view>
 </template>
 
 <script>
-import {
-  getFamilyReports, getFamilyMembers,
-  aiSendMessage, createTask
-} from '../../utils/api'
+import { getFamilyReports, getFamilyMembers, aiSendMessage, createTask } from '../../utils/api'
 
 export default {
   data() {
     return {
+      step: 1,
       initialReportIds: [],
       subjectId: '',
       allReports: [],
       selectedReportIds: [],
       executors: [],
-      messages: [],
       userGoal: '',
       loading: false,
+      planContent: '',
       parsedTasks: [],
       taskSubmitted: false,
       taskSubmittedCount: 0
     }
   },
   computed: {
-    canSend: function() {
+    canGenerate: function() {
       return this.selectedReportIds.length > 0 && this.userGoal && this.userGoal.trim().length > 0 && !this.loading
     },
     canConfirmTasks: function() {
@@ -165,7 +210,6 @@ export default {
           reports.forEach(function(r) {
             if (!r.memberName) {
               var mid = r.subjectId || r.userId
-              var m = self.executors.indexOf ? null : null
               self.executors.forEach(function(e) {
                 if ((e.memberId || e.id) === mid) r.memberName = e.name || '成员'
               })
@@ -191,10 +235,6 @@ export default {
             .map(function(m) {
               return { memberId: m.memberId || m.id, name: m.nickname || m.name || '成员' }
             })
-          // 预选第一个孩子
-          if (self.executors.length > 0 && self.selectedReportIds.length === 0) {
-            self.selectedReportIds = []
-          }
         }
       }).catch(function() { self.executors = [] })
     },
@@ -203,16 +243,12 @@ export default {
       if (idx >= 0) this.selectedReportIds.splice(idx, 1)
       else this.selectedReportIds.push(reportId)
     },
-    sendMessage: function() {
+    generatePlan: function() {
       var self = this
-      if (!self.canSend) return
-      var goal = self.userGoal.trim()
-      self.messages.push({ role: 'user', content: goal })
-      self.userGoal = ''
+      if (!self.canGenerate) return
       self.loading = true
-
       var reportIdsStr = self.selectedReportIds.join(',')
-      aiSendMessage({ query: goal, reportId: reportIdsStr }).then(function(res) {
+      aiSendMessage({ query: self.userGoal.trim(), reportId: reportIdsStr }).then(function(res) {
         self.loading = false
         var answer = ''
         if (res && res.answer) {
@@ -223,23 +259,22 @@ export default {
           answer = res
         }
         if (answer) {
-          self.messages.push({ role: 'ai', content: answer })
+          self.planContent = answer
           self.parseTasksFromPlan(answer)
+          self.step = 3
         } else {
-          self.messages.push({ role: 'ai', content: '未能生成方案，请重试。' })
+          uni.showToast({ title: '生成失败，请重试', icon: 'none' })
         }
       }).catch(function() {
         self.loading = false
-        self.messages.push({ role: 'ai', content: '请求失败，请检查网络后重试。' })
+        uni.showToast({ title: '请求失败，请检查网络', icon: 'none' })
       })
     },
     parseTasksFromPlan: function(planText) {
-      var self = this
       var lines = (planText || '').split('\n')
       var tasks = []
       var currentTask = null
       var taskPattern = /^(?:\d+[\.\u3001\)\]]|[-*•]|\[.+\]|【任务\d+】)[\s　]*([^\n]+)/
-      var descKeywords = '描述说明内容要点细节'.split('')
 
       lines.forEach(function(line) {
         line = line.trim()
@@ -247,8 +282,8 @@ export default {
         var m = line.match(taskPattern)
         if (m) {
           if (currentTask) tasks.push(currentTask)
-          var defExecutor = self.executors.length > 0 ? (self.executors[0].memberId || '') : ''
-          currentTask = { title: m[1].trim(), description: '', executorId: defExecutor }
+          var defExec = self.executors.length > 0 ? (self.executors[0].memberId || '') : ''
+          currentTask = { title: m[1].trim(), description: '', executorId: defExec }
         } else if (currentTask) {
           if (currentTask.description) {
             currentTask.description += ' ' + line
@@ -270,20 +305,16 @@ export default {
       }
       self.parsedTasks = tasks
     },
-    setExecutor: function(taskIdx, member) {
-      this.parsedTasks[taskIdx].executorId = member.memberId
-    },
-    resetTasks: function() {
+    regenerate: function() {
+      this.step = 2
       this.parsedTasks = []
-      this.messages = []
-      this.userGoal = ''
+      this.planContent = ''
     },
     submitTasks: function() {
       var self = this
       var created = 0
       var total = self.parsedTasks.length
       self.loading = true
-      var userId = uni.getStorageSync('userId') || ''
 
       self.parsedTasks.forEach(function(task, idx) {
         var isMemberTask = task.executorId && task.executorId !== '__self__'
@@ -326,6 +357,8 @@ export default {
   background: #F5F7FA;
   padding-bottom: 40rpx;
 }
+
+/* 导航栏 */
 .nav-bar {
   display: flex;
   align-items: center;
@@ -339,7 +372,7 @@ export default {
   z-index: 10;
 }
 .nav-back {
-  font-size: 36rpx;
+  font-size: 32rpx;
   color: #F97316;
 }
 .nav-title {
@@ -349,6 +382,62 @@ export default {
 }
 .nav-placeholder { width: 80rpx; }
 
+/* 步骤条 */
+.steps-bar {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24rpx 40rpx;
+  background: #fff;
+  margin-bottom: 4rpx;
+}
+.step {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6rpx;
+}
+.step-num {
+  width: 44rpx;
+  height: 44rpx;
+  border-radius: 22rpx;
+  background: #e0e0e0;
+  color: #999;
+  font-size: 24rpx;
+  font-weight: bold;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.step.active .step-num {
+  background: #F97316;
+  color: #fff;
+}
+.step.done .step-num {
+  background: #4CAF50;
+  color: #fff;
+}
+.step-label {
+  font-size: 22rpx;
+  color: #999;
+}
+.step.active .step-label,
+.step.done .step-label {
+  color: #333;
+  font-weight: 500;
+}
+.step-line {
+  flex: 1;
+  height: 2rpx;
+  background: #e0e0e0;
+  margin: 0 16rpx;
+  margin-bottom: 28rpx;
+  transition: background 0.3s;
+}
+.step-line.done { background: #4CAF50; }
+
+/* 通用区块 */
 .section {
   margin: 20rpx 30rpx;
   background: #fff;
@@ -360,189 +449,215 @@ export default {
   font-size: 30rpx;
   font-weight: bold;
   color: #333;
+  margin-bottom: 10rpx;
+}
+.hint-text {
+  font-size: 24rpx;
+  color: #999;
   margin-bottom: 20rpx;
 }
 
-/* 报告标签 */
-.report-tags {
+/* 报告卡片列表 */
+.report-list {
   display: flex;
-  flex-wrap: wrap;
-  gap: 16rpx;
+  flex-direction: column;
+  gap: 12rpx;
+  margin-bottom: 24rpx;
 }
-.report-tag {
+.report-card {
   display: flex;
-  flex-direction: column;
-  padding: 16rpx 24rpx;
+  align-items: center;
+  justify-content: space-between;
+  padding: 20rpx 24rpx;
   border-radius: 16rpx;
-  border: 2rpx solid #e0e0e0;
-  background: #fafafa;
-  min-width: 200rpx;
+  border: 2rpx solid #e8e8e8;
+  background: #FAFAFA;
+  transition: all 0.2s;
 }
-.report-tag.active {
+.report-card.active {
   border-color: #F97316;
-  background: #FFF3E0;
+  background: #FFF8F3;
+}
+.report-card-left {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+.report-card-icon {
+  font-size: 40rpx;
+}
+.report-card-info {
+  display: flex;
+  flex-direction: column;
+  gap: 4rpx;
 }
-.report-member {
+.report-card-name {
   font-size: 28rpx;
   font-weight: 600;
   color: #333;
-  margin-bottom: 6rpx;
 }
-.report-type {
-  font-size: 24rpx;
+.report-card-type {
+  font-size: 22rpx;
   color: #F97316;
-  margin-bottom: 4rpx;
 }
-.report-date {
+.report-card-right {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: 4rpx;
+}
+.report-card-date {
   font-size: 22rpx;
   color: #999;
 }
-.empty-hint {
-  font-size: 26rpx;
-  color: #bbb;
-  padding: 20rpx 0;
+.report-check {
+  font-size: 32rpx;
+  color: #F97316;
+  font-weight: bold;
 }
-
-/* 聊天区 */
-.chat-area {
-  min-height: 200rpx;
-  max-height: 500rpx;
-  overflow-y: auto;
+.empty-state {
   display: flex;
   flex-direction: column;
-  gap: 16rpx;
-}
-.empty-chat {
-  display: flex;
   align-items: center;
-  justify-content: center;
-  min-height: 160rpx;
+  padding: 60rpx 0;
 }
-.empty-chat-text {
-  font-size: 26rpx;
-  color: #bbb;
-  text-align: center;
-}
-.chat-msg {
-  display: flex;
-}
-.chat-msg.user {
-  justify-content: flex-end;
-}
-.chat-msg.ai {
-  justify-content: flex-start;
-}
-.chat-bubble {
-  max-width: 85%;
-  padding: 20rpx 28rpx;
-  border-radius: 20rpx;
-  font-size: 28rpx;
-  line-height: 1.7;
-  word-break: break-all;
-}
-.chat-msg.user .chat-bubble {
-  background: #F97316;
+.empty-icon { font-size: 80rpx; margin-bottom: 16rpx; }
+.empty-text { font-size: 26rpx; color: #bbb; }
+
+/* 下一步按钮 */
+.btn-next {
+  width: 100%;
+  height: 88rpx;
+  line-height: 88rpx;
+  background: linear-gradient(135deg, #F97316, #FB923C);
   color: #fff;
-  border-bottom-right-radius: 6rpx;
-}
-.chat-msg.ai .chat-bubble {
-  background: #F0F0F0;
-  color: #333;
-  border-bottom-left-radius: 6rpx;
-}
-.typing { padding: 20rpx 32rpx; }
-.typing-dots {
-  font-size: 40rpx;
-  color: #999;
-  letter-spacing: 4rpx;
-  animation: dots 1.4s infinite;
-}
-@keyframes dots {
-  0%, 20% { opacity: 0.2; }
-  50% { opacity: 1; }
-  80%, 100% { opacity: 0.2; }
+  font-size: 32rpx;
+  border-radius: 44rpx;
+  border: none;
+  text-align: center;
+  margin-top: 8rpx;
 }
+.btn-next[disabled] { opacity: 0.4; }
 
-/* 输入栏 */
-.input-bar {
-  margin: 0 30rpx;
-  background: #fff;
-  border-radius: 24rpx;
-  padding: 20rpx 24rpx;
-  display: flex;
-  align-items: flex-end;
-  gap: 16rpx;
-  box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
-}
-.goal-input {
-  flex: 1;
-  min-height: 80rpx;
-  max-height: 200rpx;
+/* 需求输入区 */
+.goal-textarea {
+  width: 100%;
+  min-height: 200rpx;
   font-size: 28rpx;
   color: #333;
   background: #F5F7FA;
   border: none;
   border-radius: 16rpx;
-  padding: 16rpx 20rpx;
-  line-height: 1.6;
+  padding: 20rpx 24rpx;
+  line-height: 1.7;
+  box-sizing: border-box;
 }
-.send-btn {
-  width: 72rpx;
-  height: 72rpx;
-  border-radius: 36rpx;
-  background: #F97316;
+.goal-footer {
   display: flex;
   align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
+  justify-content: space-between;
+  margin-top: 16rpx;
 }
-.send-btn.disabled { opacity: 0.4; }
-.send-icon { font-size: 32rpx; color: #fff; }
+.goal-count {
+  font-size: 24rpx;
+  color: #bbb;
+}
+.btn-generate {
+  padding: 0 48rpx;
+  height: 80rpx;
+  line-height: 80rpx;
+  background: linear-gradient(135deg, #F97316, #FB923C);
+  color: #fff;
+  font-size: 30rpx;
+  border-radius: 40rpx;
+  border: none;
+  text-align: center;
+}
+.btn-generate.disabled { opacity: 0.4; }
+.back-link {
+  text-align: center;
+  font-size: 26rpx;
+  color: #999;
+  margin-top: 20rpx;
+}
+.back-link:active { opacity: 0.7; }
 
 /* 任务区 */
 .task-section { margin-top: 0; }
-.task-list { display: flex; flex-direction: column; gap: 16rpx; }
+.plan-preview {
+  background: #FFF7ED;
+  border-radius: 12rpx;
+  padding: 20rpx 24rpx;
+  border-left: 4rpx solid #F97316;
+  margin-bottom: 24rpx;
+}
+.plan-preview-label {
+  font-size: 24rpx;
+  color: #F97316;
+  font-weight: 500;
+  margin-bottom: 10rpx;
+}
+.plan-preview-text {
+  font-size: 26rpx;
+  color: #555;
+  line-height: 1.8;
+  word-break: break-all;
+}
+.task-list {
+  display: flex;
+  flex-direction: column;
+  gap: 16rpx;
+  margin-bottom: 24rpx;
+}
 .task-card {
   background: #FAFAFA;
   border-radius: 16rpx;
   padding: 20rpx 24rpx;
   border: 2rpx solid #eee;
+  display: flex;
+  gap: 16rpx;
 }
-.task-header {
+.task-num-wrap {
+  flex-shrink: 0;
+  width: 44rpx;
   display: flex;
   align-items: flex-start;
-  gap: 12rpx;
-  margin-bottom: 8rpx;
+  justify-content: center;
+  padding-top: 4rpx;
 }
 .task-num {
   font-size: 28rpx;
   font-weight: bold;
   color: #F97316;
-  flex-shrink: 0;
 }
+.task-body { flex: 1; }
 .task-title {
   font-size: 28rpx;
   font-weight: 600;
   color: #333;
+  display: block;
+  margin-bottom: 6rpx;
   line-height: 1.5;
 }
 .task-desc {
   font-size: 24rpx;
   color: #888;
   line-height: 1.5;
-  margin-bottom: 12rpx;
+  display: block;
 }
-.task-footer {
+.task-exec-row {
   display: flex;
   align-items: center;
   gap: 12rpx;
+  margin-top: 14rpx;
   flex-wrap: wrap;
 }
 .task-exec-label {
   font-size: 24rpx;
   color: #999;
+  flex-shrink: 0;
 }
-.exec-select {
+.exec-row {
   display: flex;
   flex-wrap: wrap;
   gap: 10rpx;
@@ -561,10 +676,11 @@ export default {
   border-color: #F97316;
 }
 .exec-chip.no-exec { color: #999; }
+
 .task-actions {
   display: flex;
   gap: 16rpx;
-  margin-top: 24rpx;
+  margin-bottom: 16rpx;
 }
 .btn-edit {
   flex: 1;
@@ -588,26 +704,48 @@ export default {
   border-radius: 40rpx;
   text-align: center;
 }
-.btn-confirm[disabled] { opacity: 0.4; }
+.btn-confirm.disabled { opacity: 0.4; }
 
 /* 成功遮罩 */
 .success-overlay {
   position: fixed;
   top: 0; left: 0; right: 0; bottom: 0;
-  background: rgba(0,0,0,0.6);
+  background: rgba(0,0,0,0.55);
   display: flex;
-  flex-direction: column;
   align-items: center;
   justify-content: center;
   z-index: 100;
 }
-.success-icon { font-size: 100rpx; margin-bottom: 20rpx; }
-.success-text { font-size: 32rpx; color: #fff; margin-bottom: 40rpx; }
+.success-card {
+  background: #fff;
+  border-radius: 32rpx;
+  padding: 60rpx 48rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 560rpx;
+}
+.success-icon {
+  font-size: 100rpx;
+  color: #4CAF50;
+  margin-bottom: 20rpx;
+}
+.success-title {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 12rpx;
+}
+.success-sub {
+  font-size: 28rpx;
+  color: #888;
+  margin-bottom: 40rpx;
+}
 .btn-done {
-  width: 300rpx;
+  width: 360rpx;
   height: 88rpx;
   line-height: 88rpx;
-  background: #F97316;
+  background: linear-gradient(135deg, #F97316, #FB923C);
   color: #fff;
   font-size: 30rpx;
   border-radius: 44rpx;