Dataset Task Mock Data Implementation Plan

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.

Goal: 在数据集管理页的“数据任务”页签展示 4 条任务产出 Mock 数据，并让“本地上传”与“数据任务”按来源稳定分流。

Architecture: 保持 mockDatasets 为唯一数据源，在 DatasetItem 上增加可选来源字段，并由列表页计算属性按来源过滤。使用一个无新增依赖的 Node 回归脚本锁定类型、Mock 数量、数据名称和页签过滤规则。

Tech Stack: Vue 3、TypeScript 5.7、Element Plus、Node.js 回归脚本、Vite 6

Global Constraints

source 只允许 upload 或 task，并保持可选以兼容暂未返回该字段的接口数据。
未携带 source 的数据归入“本地上传”。
现有 6 条 Mock 数据标记为 upload，新增 4 条 Mock 数据标记为 task。
不新增依赖，不修改后端接口，不实现真实的数据任务关联。
搜索、分页、预览、下载和删除按钮保持现有行为。

File Structure

frontend/scripts/regression-dataset-task-tab.mjs：静态回归检查，验证来源类型、Mock 数据和页签过滤规则。
frontend/package.json：注册 test:dataset-task-tab 命令。
frontend/src/types/index.ts：定义 DatasetSource 并扩展 DatasetItem。
frontend/src/mock/data.ts：标记 6 条上传数据并新增 4 条任务数据。
frontend/src/views/dataset/DatasetListView.vue：按 source 过滤两个页签。

Task 1: 数据任务 Mock 数据与页签分流

Files:

Create: frontend/scripts/regression-dataset-task-tab.mjs
Modify: frontend/package.json
Modify: frontend/src/types/index.ts:58-78
Modify: frontend/src/mock/data.ts:100-108
Modify: frontend/src/views/dataset/DatasetListView.vue:16-23

Interfaces:

Consumes: getDatasetList(): Promise<DatasetItem[]> 与现有 DataTablePage 的 data 属性。
Produces: DatasetSource = 'upload' | 'task'、DatasetItem.source?: DatasetSource，以及按来源过滤后的 filteredDataList。
Step 1: 写入会失败的回归检查并注册命令

创建 frontend/scripts/regression-dataset-task-tab.mjs：

import assert from 'node:assert/strict'
import { readFile } from 'node:fs/promises'
import { fileURLToPath } from 'node:url'
import path from 'node:path'

const scriptDir = path.dirname(fileURLToPath(import.meta.url))
const typesPath = path.resolve(scriptDir, '../src/types/index.ts')
const dataPath = path.resolve(scriptDir, '../src/mock/data.ts')
const viewPath = path.resolve(scriptDir, '../src/views/dataset/DatasetListView.vue')

const [typesSource, dataSource, viewSource] = await Promise.all([
  readFile(typesPath, 'utf8'),
  readFile(dataPath, 'utf8'),
  readFile(viewPath, 'utf8'),
])

assert.match(typesSource, /export type DatasetSource = 'upload' \| 'task'/)
assert.match(typesSource, /source\?: DatasetSource/)

assert.equal((dataSource.match(/source: 'upload'/g) || []).length, 6)
assert.equal((dataSource.match(/source: 'task'/g) || []).length, 4)

for (const name of [
  '客服对话清洗集',
  '通用指令构造集',
  '用户反馈脱敏集',
  '多轮对话增强集',
]) {
  assert.ok(dataSource.includes(`name: '${name}'`), `缺少数据任务 Mock：${name}`)
}

assert.match(viewSource, /item\.source === 'task'/)
assert.match(viewSource, /item\.source !== 'task'/)
assert.doesNotMatch(viewSource, /数据任务产生的数据集[\s\S]*?return \[\]/)

console.log('数据任务 Mock 数据与页签分流回归检查通过')

在 frontend/package.json 的 scripts 中加入：

"test:dataset-task-tab": "node scripts/regression-dataset-task-tab.mjs"

Step 2: 运行回归检查并确认红灯

Run: cd frontend && npm run test:dataset-task-tab

Expected: FAIL，首个断言提示缺少 DatasetSource。

Step 3: 增加来源类型

在 frontend/src/types/index.ts 的数据集类型区加入并使用：

export type DatasetType = 'train' | 'test' | 'eval' | 'val' | 'other'
export type DatasetStorage = 'local' | 'cloud' | 'minio'
export type DatasetSource = 'upload' | 'task'

export interface DatasetItem {
  id: number | string
  name: string
  type: DatasetType | string
  storage_type: DatasetStorage | string
  source?: DatasetSource
  size?: string | number
  count?: number
  description?: string
  create_time?: string
  files?: DatasetFile[]
}

Step 4: 标记现有数据并添加 4 条任务数据

将 frontend/src/mock/data.ts 的 mockDatasets 更新为：

export const mockDatasets: DatasetItem[] = [
  { id: 1, name: '金融问答-训练集', type: 'train', storage_type: 'local', source: 'upload', size: '128 MB', count: 8560, description: '金融领域问答对', create_time: '2025-12-20T08:00:00Z' },
  { id: 2, name: '法律文书-训练集', type: 'train', storage_type: 'local', source: 'upload', size: '256 MB', count: 15230, description: '法律文书数据集', create_time: '2025-12-25T10:30:00Z' },
  { id: 3, name: '客服对话-训练集', type: 'train', storage_type: 'minio', source: 'upload', size: '512 MB', count: 24500, description: '客服对话记录', create_time: '2026-01-05T14:20:00Z' },
  { id: 4, name: '金融评测集', type: 'eval', storage_type: 'local', source: 'upload', size: '32 MB', count: 1200, description: '金融领域评测', create_time: '2026-01-10T09:15:00Z' },
  { id: 5, name: '通用能力评测', type: 'eval', storage_type: 'local', source: 'upload', size: '64 MB', count: 3500, description: '通用能力评测数据集', create_time: '2026-01-12T11:30:00Z' },
  { id: 6, name: '医疗问答-训练集', type: 'train', storage_type: 'local', source: 'upload', size: '180 MB', count: 9800, description: '医疗问答对', create_time: '2026-02-01T15:00:00Z' },
  { id: 7, name: '客服对话清洗集', type: 'train', storage_type: 'minio', source: 'task', size: '96 MB', count: 18240, description: '由客服问答数据清洗任务生成', create_time: '2026-07-08T06:28:00Z' },
  { id: 8, name: '通用指令构造集', type: 'train', storage_type: 'local', source: 'task', size: '148 MB', count: 12600, description: '由指令微调数据构造任务生成', create_time: '2026-07-09T01:42:00Z' },
  { id: 9, name: '用户反馈脱敏集', type: 'test', storage_type: 'minio', source: 'task', size: '72 MB', count: 9340, description: '由敏感信息脱敏任务生成', create_time: '2026-07-09T09:18:00Z' },
  { id: 10, name: '多轮对话增强集', type: 'eval', storage_type: 'local', source: 'task', size: '41 MB', count: 2780, description: '由多轮对话拼接任务生成', create_time: '2026-07-10T02:06:00Z' },
]

Step 5: 实现两个页签的来源过滤

将 frontend/src/views/dataset/DatasetListView.vue 的 filteredDataList 更新为：

const filteredDataList = computed(() => {
  if (activeTab.value === 'task') {
    return dataList.value.filter((item) => item.source === 'task')
  }

  return dataList.value.filter((item) => item.source !== 'task')
})

Step 6: 运行针对性回归检查并确认绿灯

Run: cd frontend && npm run test:dataset-task-tab

Expected: PASS，输出 数据任务 Mock 数据与页签分流回归检查通过。

Step 7: 运行类型检查和生产构建

Run: cd frontend && npm run type-check

Expected: PASS；若仓库原有错误仍存在，保存完整输出并确认本任务修改文件不在错误列表中。

Run: cd frontend && npx vite build

Expected: PASS，并生成 dist 产物。

Step 8: 页面烟雾验证

启动开发服务器后打开数据集管理页，验证“本地上传”总数为 6，切换“数据任务”后总数为 4，搜索“脱敏”只显示“用户反馈脱敏集”，且预览、下载、删除按钮可见。

Step 9: 提交实现

git add frontend/package.json \
  frontend/scripts/regression-dataset-task-tab.mjs \
  frontend/src/types/index.ts \
  frontend/src/mock/data.ts \
  frontend/src/views/dataset/DatasetListView.vue
git commit -m "feat: 添加数据任务 mock 数据"

8.2 KiB Raw Blame History Unescape Escape

Dataset Task Mock Data Implementation Plan

Global Constraints

File Structure

Task 1: 数据任务 Mock 数据与页签分流

8.2 KiB

Raw Blame History