Explorar el Código

chore(verify): mark plan complete and configure build/verify commands

- Update plan checkboxes to completed state
- Set build_command and verify_command for Comet guard

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
xuyunhui hace 1 semana
padre
commit
c13ab6b4f5

+ 65 - 65
docs/superpowers/plans/2026-06-25-refine-weapp-ui-style.md

@@ -1,6 +1,6 @@
 # 清道夫 App 全站样式体验优化实施计划
 
-> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [x]`) syntax for tracking.
 
 **Goal:** 在不动业务逻辑和胶囊安全布局的前提下,统一小程序全站卡片/按钮/标签视觉语言,优化首页/任务/排班/我的页样式与点击反馈。
 
@@ -51,7 +51,7 @@
 - Consumes: 父组件通过 `gradient` prop 控制头部模式。
 - Produces: `TopBar` 新增可选 prop `gradient?: boolean`,默认 `false` 保持原白色背景。
 
-- [ ] **Step 1: 新增 gradient prop 与动态类名**
+- [x] **Step 1: 新增 gradient prop 与动态类名**
 
 在 `<script setup>` 的 `props` 中新增 `gradient?: boolean`,默认 `false`:
 
@@ -69,7 +69,7 @@ const props = withDefaults(
 )
 ```
 
-- [ ] **Step 2: 模板根节点使用动态背景类**
+- [x] **Step 2: 模板根节点使用动态背景类**
 
 将根节点 `<view>` 的类名改为:
 
@@ -80,7 +80,7 @@ const props = withDefaults(
 >
 ```
 
-- [ ] **Step 3: 反白渐变模式下的标题与返回按钮**
+- [x] **Step 3: 反白渐变模式下的标题与返回按钮**
 
 在渐变模式下,标题与返回箭头使用白色。将标题 `<text>` 改为:
 
@@ -104,7 +104,7 @@ const props = withDefaults(
 </text>
 ```
 
-- [ ] **Step 4: 本地验证**
+- [x] **Step 4: 本地验证**
 
 运行:
 
@@ -114,7 +114,7 @@ npm run type-check
 
 Expected: 无 TypeScript 错误。
 
-- [ ] **Step 5: 提交**
+- [x] **Step 5: 提交**
 
 ```bash
 git add src/components/common/TopBar.vue
@@ -132,7 +132,7 @@ git commit -m "feat(top-bar): add gradient header mode"
 - Consumes: `props.status`、`props.type`(`'task' | 'project'`),通过 `utils/index.ts` 中的 `getStatusColor` / `getStatusBgColor` 计算颜色。
 - Produces: 渲染统一圆角 `rounded`、内边距 `px-2 py-0.5`、字号 `text-xs` 的标签。
 
-- [ ] **Step 1: 替换模板为 Tailwind 工具类**
+- [x] **Step 1: 替换模板为 Tailwind 工具类**
 
 将 `<template>` 改为:
 
@@ -144,7 +144,7 @@ git commit -m "feat(top-bar): add gradient header mode"
 </template>
 ```
 
-- [ ] **Step 2: 移除 scoped 样式块中的重复定义**
+- [x] **Step 2: 移除 scoped 样式块中的重复定义**
 
 删除 `<style scoped>` 中的 `.tag` 规则,保留文件为空样式块或删除整个 `<style scoped>`。
 
@@ -154,7 +154,7 @@ git commit -m "feat(top-bar): add gradient header mode"
 </style>
 ```
 
-- [ ] **Step 3: 本地验证**
+- [x] **Step 3: 本地验证**
 
 运行:
 
@@ -164,7 +164,7 @@ npm run type-check
 
 Expected: 无 TypeScript 错误。
 
-- [ ] **Step 4: 提交**
+- [x] **Step 4: 提交**
 
 ```bash
 git add src/components/common/StatusTag.vue
@@ -182,7 +182,7 @@ git commit -m "feat(status-tag): unify tag style with Tailwind classes"
 - Consumes: `TopBar` 的 `gradient` prop;`StatusTag` 渲染任务状态。
 - Produces: 销售端首页使用渐变头部、渐变统计卡片、统一快捷入口容器。
 
-- [ ] **Step 1: TopBar 启用渐变模式并反白用户信息**
+- [x] **Step 1: TopBar 启用渐变模式并反白用户信息**
 
 将 `<TopBar title="">` 改为 `<TopBar title="" gradient>`。
 
@@ -205,7 +205,7 @@ git commit -m "feat(status-tag): unify tag style with Tailwind classes"
 </template>
 ```
 
-- [ ] **Step 2: 统计卡片改为渐变背景**
+- [x] **Step 2: 统计卡片改为渐变背景**
 
 将三个统计卡片的容器类从 `bg-surface rounded-xl p-4 text-center` 改为:
 
@@ -229,11 +229,11 @@ git commit -m "feat(status-tag): unify tag style with Tailwind classes"
 </view>
 ```
 
-- [ ] **Step 3: 快捷入口图标容器统一**
+- [x] **Step 3: 快捷入口图标容器统一**
 
 将快捷入口图标容器统一改为 `bg-primary-light rounded-2xl`,已为 `bg-primary-light` 的保持不变;将禁用项的 `bg-surface` 也改为 `bg-primary-light opacity-60`。每个图标容器添加 `active:scale-95 transition-transform duration-150`。
 
-- [ ] **Step 4: 任务提醒按钮改为次要按钮风格**
+- [x] **Step 4: 任务提醒按钮改为次要按钮风格**
 
 将任务提醒按钮从 `bg-primary-light text-primary` 改为:
 
@@ -247,11 +247,11 @@ git commit -m "feat(status-tag): unify tag style with Tailwind classes"
 </button>
 ```
 
-- [ ] **Step 5: 最新任务与通知公告列表项添加点击反馈**
+- [x] **Step 5: 最新任务与通知公告列表项添加点击反馈**
 
 为 `uni-list-item` 外层或自身添加 `active:scale-95 transition-transform duration-150`(若 `uni-list-item` 已支持 `clickable`,可直接给 `uni-list-item` 添加类)。保持原有结构。
 
-- [ ] **Step 6: 本地验证与构建**
+- [x] **Step 6: 本地验证与构建**
 
 运行:
 
@@ -262,7 +262,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 7: 提交**
+- [x] **Step 7: 提交**
 
 ```bash
 git add src/components/home/SalesHome.vue
@@ -280,13 +280,13 @@ git commit -m "feat(home): apply gradient header and stat cards for sales"
 - Consumes: `TopBar` 的 `gradient` prop;`StatusTag` 渲染任务状态。
 - Produces: 调度端首页使用渐变头部、统一统计卡片渐变、快捷入口点击反馈。
 
-- [ ] **Step 1: TopBar 启用渐变模式并反白用户信息**
+- [x] **Step 1: TopBar 启用渐变模式并反白用户信息**
 
 将 `<TopBar title="">` 改为 `<TopBar title="" gradient>`。
 
 将头部左侧区域整体反白,头像容器改为 `bg-white/20`,文字改为白色/白色半透明,通知铃铛按钮改为 `bg-white/20` 并白色图标。
 
-- [ ] **Step 2: 统计卡片改为统一渐变**
+- [x] **Step 2: 统计卡片改为统一渐变**
 
 将三个统计卡片的容器类统一改为蓝紫渐变:
 
@@ -299,13 +299,13 @@ git commit -m "feat(home): apply gradient header and stat cards for sales"
 
 其余两个统计卡片使用相同渐变样式,仅修改文案与数字。
 
-- [ ] **Step 3: 快捷入口与待审核任务卡片添加点击反馈**
+- [x] **Step 3: 快捷入口与待审核任务卡片添加点击反馈**
 
 为快捷入口图标容器添加 `active:scale-95 transition-transform duration-150`。
 
 为待审核任务卡片(`class="card p-3 border-l-4 border-warning cursor-pointer"`)添加 `active:scale-95 transition-transform duration-150`,保持 `border-l-4 border-warning`。
 
-- [ ] **Step 4: 本地验证与构建**
+- [x] **Step 4: 本地验证与构建**
 
 运行:
 
@@ -316,7 +316,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 5: 提交**
+- [x] **Step 5: 提交**
 
 ```bash
 git add src/components/home/DispatchHome.vue
@@ -334,13 +334,13 @@ git commit -m "feat(home): apply gradient header and stat cards for dispatch"
 - Consumes: `TopBar` 的 `gradient` prop;`StatusTag` 渲染任务状态。
 - Produces: 施工端首页使用渐变头部、统一统计卡片渐变、每日任务入口与快捷功能样式。
 
-- [ ] **Step 1: TopBar 启用渐变模式并反白用户信息**
+- [x] **Step 1: TopBar 启用渐变模式并反白用户信息**
 
 将 `<TopBar title="">` 改为 `<TopBar title="" gradient>`。
 
 将头部左侧区域整体反白,与 DispatchHome 一致。
 
-- [ ] **Step 2: 统计卡片改为统一渐变**
+- [x] **Step 2: 统计卡片改为统一渐变**
 
 将三个统计卡片统一改为青蓝渐变:
 
@@ -353,17 +353,17 @@ git commit -m "feat(home): apply gradient header and stat cards for dispatch"
 
 其余两个统计卡片使用相同渐变样式。
 
-- [ ] **Step 3: 每日任务入口卡片样式增强**
+- [x] **Step 3: 每日任务入口卡片样式增强**
 
 将每日任务入口的 `uni-card` 内部容器改为白色卡片,图标容器 `icon-box` 改为 `bg-primary-light rounded-xl`。点击区域添加 `active:scale-95 transition-transform duration-150`。
 
-- [ ] **Step 4: 快捷入口与当前任务卡片添加点击反馈**
+- [x] **Step 4: 快捷入口与当前任务卡片添加点击反馈**
 
 为快捷入口图标容器添加 `active:scale-95 transition-transform duration-150`。
 
 为当前任务卡片(`class="card p-3 cursor-pointer"`)添加 `active:scale-95 transition-transform duration-150`。
 
-- [ ] **Step 5: 本地验证与构建**
+- [x] **Step 5: 本地验证与构建**
 
 运行:
 
@@ -374,7 +374,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 6: 提交**
+- [x] **Step 6: 提交**
 
 ```bash
 git add src/components/home/ConstructionHome.vue
@@ -392,7 +392,7 @@ git commit -m "feat(home): apply gradient header and stat cards for construction
 - Consumes: 无(纯样式修改)。
 - Produces: 筛选标签未选中态为 `bg-surface text-gray-500 rounded-full`,选中态为 `bg-primary text-white`。
 
-- [ ] **Step 1: 更新筛选标签类名**
+- [x] **Step 1: 更新筛选标签类名**
 
 当前模板中已有 `rounded-full` 与 `bg-primary text-white` / `bg-surface text-gray-500`,基本符合要求。需将未选中态的 `transition-colors` 改为 `transition-all duration-150 active:scale-95`,并确认 `bg-surface` 可用。
 
@@ -408,11 +408,11 @@ git commit -m "feat(home): apply gradient header and stat cards for construction
 </view>
 ```
 
-- [ ] **Step 2: 移除外层容器底部边框(可选)**
+- [x] **Step 2: 移除外层容器底部边框(可选)**
 
 若设计文档要求筛选栏更轻量,可删除外层 `border-b border-gray-200`。
 
-- [ ] **Step 3: 本地验证与构建**
+- [x] **Step 3: 本地验证与构建**
 
 运行:
 
@@ -423,7 +423,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 4: 提交**
+- [x] **Step 4: 提交**
 
 ```bash
 git add src/components/task/TaskListView.vue
@@ -441,7 +441,7 @@ git commit -m "feat(task-list): refine filter tab styles and active feedback"
 - Consumes: `props.task`(含 `status`、`type` 字段)。
 - Produces: 卡片根据 `emergency` 类型显示红色左边框,根据 `completed` 状态显示浅绿背景,并带点击反馈。
 
-- [ ] **Step 1: 添加动态卡片背景与左边框**
+- [x] **Step 1: 添加动态卡片背景与左边框**
 
 将根节点 `<view>` 改为:
 
@@ -457,11 +457,11 @@ git commit -m "feat(task-list): refine filter tab styles and active feedback"
 >
 ```
 
-- [ ] **Step 2: 保留原有 borderStyle 计算属性**
+- [x] **Step 2: 保留原有 borderStyle 计算属性**
 
 `borderStyle` 计算属性继续根据状态设置 `borderLeftColor`,但仅在非 emergency 时生效;emergency 时使用 Tailwind `border-red-500`。
 
-- [ ] **Step 3: 本地验证与构建**
+- [x] **Step 3: 本地验证与构建**
 
 运行:
 
@@ -472,7 +472,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 4: 提交**
+- [x] **Step 4: 提交**
 
 ```bash
 git add src/components/task/SalesTaskCard.vue
@@ -490,7 +490,7 @@ git commit -m "feat(task-card): enhance sales task card status styles"
 - Consumes: `props.task`(含 `status`、`type` 字段)。
 - Produces: 卡片根据 `emergency` 类型显示红色左边框,根据 `completed` 状态显示浅绿背景,并带点击反馈。
 
-- [ ] **Step 1: 添加动态卡片背景与左边框**
+- [x] **Step 1: 添加动态卡片背景与左边框**
 
 将根节点 `<view>` 改为:
 
@@ -506,7 +506,7 @@ git commit -m "feat(task-card): enhance sales task card status styles"
 >
 ```
 
-- [ ] **Step 2: 本地验证与构建**
+- [x] **Step 2: 本地验证与构建**
 
 运行:
 
@@ -517,7 +517,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 3: 提交**
+- [x] **Step 3: 提交**
 
 ```bash
 git add src/components/task/DispatchTaskCard.vue
@@ -535,7 +535,7 @@ git commit -m "feat(task-card): enhance dispatch task card status styles"
 - Consumes: `props.task`(含 `status`、`type` 字段)。
 - Produces: 卡片根据 `emergency` 类型显示红色左边框,根据 `completed` 状态显示浅绿背景,并带点击反馈。
 
-- [ ] **Step 1: 添加动态卡片背景与左边框**
+- [x] **Step 1: 添加动态卡片背景与左边框**
 
 将根节点 `<view>` 改为:
 
@@ -550,7 +550,7 @@ git commit -m "feat(task-card): enhance dispatch task card status styles"
 >
 ```
 
-- [ ] **Step 2: 本地验证与构建**
+- [x] **Step 2: 本地验证与构建**
 
 运行:
 
@@ -561,7 +561,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 3: 提交**
+- [x] **Step 3: 提交**
 
 ```bash
 git add src/components/task/ConstructionTaskCard.vue
@@ -579,7 +579,7 @@ git commit -m "feat(task-card): enhance construction task card status styles"
 - Consumes: 无(纯样式修改)。
 - Produces: 日历区域使用 `bg-white rounded-xl shadow-sm p-4` 卡片包裹,日期选中态为蓝色填充白字,今天为浅蓝背景蓝字。
 
-- [ ] **Step 1: 包裹日历为卡片容器**
+- [x] **Step 1: 包裹日历为卡片容器**
 
 将当前日历外层 `<view class="bg-white px-4 py-3">` 改为:
 
@@ -587,7 +587,7 @@ git commit -m "feat(task-card): enhance construction task card status styles"
 <view class="mx-4 mt-4 bg-white rounded-xl shadow-sm p-4">
 ```
 
-- [ ] **Step 2: 更新日期选中态样式**
+- [x] **Step 2: 更新日期选中态样式**
 
 将日期单元格 `:class` 改为:
 
@@ -605,7 +605,7 @@ git commit -m "feat(task-card): enhance construction task card status styles"
 >
 ```
 
-- [ ] **Step 3: 更新日期数字颜色**
+- [x] **Step 3: 更新日期数字颜色**
 
 删除 `<text>` 中复杂的动态颜色类,改为仅根据选中态控制:
 
@@ -622,7 +622,7 @@ git commit -m "feat(task-card): enhance construction task card status styles"
 </text>
 ```
 
-- [ ] **Step 4: 排班标记点样式**
+- [x] **Step 4: 排班标记点样式**
 
 排班标记点保持 `w-2 h-2 rounded-full mt-1`;若选中日期,使用 `bg-white`,否则使用 `bg-primary`:
 
@@ -634,7 +634,7 @@ git commit -m "feat(task-card): enhance construction task card status styles"
 ></view>
 ```
 
-- [ ] **Step 5: 本地验证与构建**
+- [x] **Step 5: 本地验证与构建**
 
 运行:
 
@@ -645,7 +645,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 6: 提交**
+- [x] **Step 6: 提交**
 
 ```bash
 git add src/components/dispatch/ScheduleView.vue
@@ -663,7 +663,7 @@ git commit -m "feat(schedule): card-wrap calendar and refine date selection styl
 - Consumes: `schedule.shiftType`、`schedule.status`。
 - Produces: 列表项根据 `shiftType` 显示蓝色/红色图标背景,弹窗按钮使用 `rounded-xl`。
 
-- [ ] **Step 1: 列表项图标根据排班类型变色**
+- [x] **Step 1: 列表项图标根据排班类型变色**
 
 修改 `getStatusBgClass` 函数,改为根据 `shiftType` 返回图标背景:
 
@@ -689,11 +689,11 @@ function getScheduleIconClass(shiftType: string) {
 </view>
 ```
 
-- [ ] **Step 2: 为列表项添加点击反馈**
+- [x] **Step 2: 为列表项添加点击反馈**
 
 给 `uni-list-item` 添加 `clickable` 与 `active:scale-95 transition-transform duration-150`(若组件支持传递 class,否则在外层包一层 `<view>`)。
 
-- [ ] **Step 3: 弹窗按钮改为 rounded-xl**
+- [x] **Step 3: 弹窗按钮改为 rounded-xl**
 
 将弹窗底部取消/确认按钮的 `rounded-lg` 改为 `rounded-xl`:
 
@@ -702,11 +702,11 @@ function getScheduleIconClass(shiftType: string) {
 <button class="flex-1 py-3 bg-primary text-white rounded-xl text-sm active:bg-blue-600 transition-colors" @click="submitSchedule">{{ isDetail ? '保存' : '确认' }}</button>
 ```
 
-- [ ] **Step 4: 弹窗字段间距统一**
+- [x] **Step 4: 弹窗字段间距统一**
 
 确认每个字段外层使用 `mb-4`;当前为 `mb-3`,可保持或统一为 `mb-4`。将 textarea 最小高度通过内联 `style` 设置:`style="min-height: 80px;"`。
 
-- [ ] **Step 5: 本地验证与构建**
+- [x] **Step 5: 本地验证与构建**
 
 运行:
 
@@ -717,7 +717,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 6: 提交**
+- [x] **Step 6: 提交**
 
 ```bash
 git add src/components/dispatch/ScheduleView.vue
@@ -735,7 +735,7 @@ git commit -m "feat(schedule): style schedule list icons and modal buttons"
 - Consumes: `authStore.user` 提供的用户信息。
 - Produces: 我的页顶部深蓝渐变头部,功能列表统一白色卡片,退出登录红色大圆角按钮。
 
-- [ ] **Step 1: 顶部改为深蓝渐变头部**
+- [x] **Step 1: 顶部改为深蓝渐变头部**
 
 将顶部外层 `<view>` 改为:
 
@@ -757,7 +757,7 @@ git commit -m "feat(schedule): style schedule list icons and modal buttons"
 </view>
 ```
 
-- [ ] **Step 2: 功能列表改为统一白色卡片**
+- [x] **Step 2: 功能列表改为统一白色卡片**
 
 将两个 `uni-card` 外层替换为单个白色卡片容器:
 
@@ -787,7 +787,7 @@ git commit -m "feat(schedule): style schedule list icons and modal buttons"
 </view>
 ```
 
-- [ ] **Step 3: 退出登录按钮样式**
+- [x] **Step 3: 退出登录按钮样式**
 
 将退出登录按钮改为:
 
@@ -797,7 +797,7 @@ git commit -m "feat(schedule): style schedule list icons and modal buttons"
 </button>
 ```
 
-- [ ] **Step 4: 本地验证与构建**
+- [x] **Step 4: 本地验证与构建**
 
 运行:
 
@@ -808,7 +808,7 @@ npm run build:mp-weixin
 
 Expected: 无 TypeScript 错误,构建通过。
 
-- [ ] **Step 5: 提交**
+- [x] **Step 5: 提交**
 
 ```bash
 git add src/components/my/ProfileView.vue
@@ -825,7 +825,7 @@ git commit -m "feat(profile): redesign profile page with gradient header and car
 **Interfaces:**
 - 无。
 
-- [ ] **Step 1: 运行 TypeScript 类型检查**
+- [x] **Step 1: 运行 TypeScript 类型检查**
 
 ```bash
 npm run type-check
@@ -833,7 +833,7 @@ npm run type-check
 
 Expected: 无 TypeScript 错误。
 
-- [ ] **Step 2: 运行微信小程序构建**
+- [x] **Step 2: 运行微信小程序构建**
 
 ```bash
 npm run build:mp-weixin
@@ -841,7 +841,7 @@ npm run build:mp-weixin
 
 Expected: 构建成功退出,控制台无 WXSS 转义选择器报错(如 `~` 选择器、属性选择器异常)。
 
-- [ ] **Step 3: 检查构建产物中的 WXSS**
+- [x] **Step 3: 检查构建产物中的 WXSS**
 
 运行:
 
@@ -851,11 +851,11 @@ grep -R "\\[" dist/build/mp-weixin/pages/ dist/build/mp-weixin/components/ 2>/de
 
 Expected: 无 Tailwind 任意值类残留(如 `max-h-[80vh]`、`w-1.5` 等)。
 
-- [ ] **Step 4: 标记 tasks.md 全部完成**
+- [x] **Step 4: 标记 tasks.md 全部完成**
 
-打开 `openspec/changes/refine-weapp-ui-style/tasks.md`,将所有 `- [ ]` 改为 `- [x]`。
+打开 `openspec/changes/refine-weapp-ui-style/tasks.md`,将所有 `- [x]` 改为 `- [x]`。
 
-- [ ] **Step 5: 提交验证结果**
+- [x] **Step 5: 提交验证结果**
 
 ```bash
 git add openspec/changes/refine-weapp-ui-style/tasks.md

+ 4 - 2
openspec/changes/refine-weapp-ui-style/.comet.yaml

@@ -1,5 +1,5 @@
 workflow: full
-phase: build
+phase: verify
 context_compression: off
 build_mode: subagent-driven-development
 build_pause: null
@@ -7,7 +7,7 @@ subagent_dispatch: confirmed
 tdd_mode: direct
 review_mode: standard
 isolation: branch
-verify_mode: null
+verify_mode: full
 auto_transition: true
 base_ref: 5844ef0cab776011ca091c6a961614d0f69ffb44
 design_doc: docs/superpowers/specs/2026-06-25-refine-weapp-ui-style-design.md
@@ -20,3 +20,5 @@ verified_at: null
 archived: false
 handoff_context: openspec/changes/refine-weapp-ui-style/.comet/handoff/design-context.json
 handoff_hash: bbe42d93a97ebb0ffa5302bc664d4661a79296002655beac09f928dae98a735d
+build_command: npm run build:mp-weixin
+verify_command: npm run build:mp-weixin