sokr

SOKR（Skills OKR）是面向运维/工单团队的 OKR 层级管理与知识沉淀工具。
围绕「OKR 目标 → 关键结果 → 技术专项 → 课题 → 工单 → 技能」六层实体链，将每一次故障复盘转化为可复用的团队知识资产，并通过「专项毕业」机制判断何时从孵化进入规模化运营。

🎯 设定目标 (Objective)
  📊 拆解关键结果 (Key Result)        ← 量化衡量，自动计算进度
    📁 发起技术攻坚 (Tech Initiative)  ← 聚焦专项突破，支持毕业/孵化生命周期
      📖 研究课题 (Topic)              ← 细化问题域
        📋 工单复盘 (Ticket)           ← 记录根因与改进
          ✨ 沉淀技能 (Skill)          ← 输出可复用知识资产

为什么选择 SOKR

核心能力

五大专属空间

每种实体都有为其量身的最佳视图，告别"一棵大树看到底"的局限：

所有空间共享：搜索过滤 · 详情侧边栏 · 实时数据同步 · 空状态引导 · 移动端适配

业绩拆解工作台

FDE 现场业绩目标按「方法论 × 模式」拆解为可落地的 OKR 草案，质检后一键生成 OKR 实体，方案自动存档可回看：

实现位置：src/lib/breakdown/（纯函数引擎 + 独立 localStorage 存档，零侵入数据模型）。

岗位 OKR 模板库

「新建 OKR 目标」弹窗内置岗位模板，一键生成带量化 KR 骨架的目标：

选择岗位 → 勾选目标 → 自动预填标题、周期与描述并全选 KR 骨架，生成前可取消勾选不需要的 KR。模板为静态配置，不写入本地数据。

数据分析页

面向管理者的全局决策视图（/analytics），六大区块全部基于现有数据只读聚合，图表 SVG 自绘零依赖：

实现位置：src/lib/analytics/（纯函数聚合层）+ src/components/analytics/（SVG 图表件）。

六层实体全链路管理

创建、编辑、搜索、删除——全闭环操作，覆盖所有 6 种实体类型。树形展示一目了然，详情面板即时编辑。

• 级联删除：软删除父实体自动级联所有子实体
• 操作审计：每次 CRUD 操作自动记录到操作日志
• 自动保存：表单编辑自动保存草稿到 localStorage，刷新不丢失

专项毕业 / 孵化机制

为每个技术专项定义清晰的生命周期闸门：

实现位置：src/lib/initiativeGraduation.ts + EntityDetailPanel 专项详情页。

KR 量化进度追踪

每个关键结果支持 基线值 / 目标值 / 当前值，使用 (current - baseline) / (target - baseline) 公式自动计算完成百分比。所有视图统一使用 computeKrProgress() 确保数值一致。

知识沉淀闭环

从工单复盘到技能输出，支持 draft → confirmed → published 状态流转。质量检查清单确保输出物达标。Skills 支持三种来源（专项 / 课题 / 工单），灵活关联上下文；详情面板支持一键复制 Markdown 或下载 .md / .json，章节结构模板可在系统管理中自定义。

数据安全可靠

可拔插数据源架构

数据访问抽象为 DataSourcePlugin 接口，支持热挂载：

完整导入导出流程：在「系统管理 → 数据源管理」页可一键导出 144 个 mock 实体为 zip（每个实体一个 md 文件，含 frontmatter + 长文本 body），再清空后导入恢复，全程 byte-for-byte 保真。详细测试见 测试报告。

明暗双主题

浅色模式（白天办公）+ 深色模式（夜间值班），一键切换。CSS 变量系统确保一致性，近期已完成主题令牌补全与对比度修复。

开箱即用

首次启动自动种子 3 个 OKR 目标 + 18 个关键结果 + 全量 Mock 数据（15 专项 · 26 课题 · 42 工单 · 50 Skills），无需配置即可体验完整流程。

快速开始

git clone <repository-url> && cd sb-okr
pnpm install
pnpm dev          # → http://localhost:5173

首次启动自动加载种子数据，无需任何配置。

技术架构

┌──────────────────────────────────────────────────────────┐
│                        UI 层                              │
│   React 18 · TypeScript 5.8 (strict) · Vite 6           │
│   Tailwind CSS 3 · Zustand 5 · React Router 7            │
│   12 路由 · 11 页面 · 懒加载 · React.memo · 自动保存表单  │
│   5 专属空间 · 看板/网格/分组列表 · 共享详情面板          │
├──────────────────────────────────────────────────────────┤
│                      数据引擎                             │
│   localStorage · Markdown 序列化                          │
│   WAL + CRC32 + 快照 + 三级恢复                           │
│   原子读-改-写 · 操作审计日志 · Schema 版本管理           │
│   QuotaExceededError 事件通知 · 导入双重校验               │
└──────────────────────────────────────────────────────────┘

页面与路由

采用 Hash 路由（URL 形如 /#/space），兼容纯静态 CDN 托管。下表路径均省略 /# 前缀。

文件结构

src/
  App.tsx                            # 12 路由，懒加载
  main.tsx                           # 入口，错误边界
  index.css                          # 主题令牌，Tailwind 层
  pages/
    WorkbenchPage.tsx                # 工作台
    SpacePage.tsx                    # OKR 空间（树形视图）
    InitiativeSpacePage.tsx          # 专项空间（分组列表）
    TopicSpacePage.tsx               # 课题空间（看板）
    TicketSpacePage.tsx              # 工单空间（看板+复盘）
    SkillSpacePage.tsx               # Skills 空间（卡片网格）
    ReductionWarRoomPage.tsx         # 降量作战室（麦肯锡 7 步法）
    BreakdownPage.tsx                # 业绩拆解工作台
    AnalyticsPage.tsx                # 数据分析仪表盘
    AdminPage.tsx                    # 系统管理
    DataSourcePage.tsx               # 数据源管理（导出/导入/维护）
    datasource/
      OverviewTab.tsx               # 概览 Tab
      ExportTab.tsx                 # 导出 Tab（生成 zip）
      ImportTab.tsx                 # 导入 Tab（解析 + 查重）
      ConflictResolver.tsx          # 冲突解决 UI
      MaintenanceTab.tsx            # 维护 Tab（孤立引用检测）
  components/
    layout/AppShell.tsx              # 全局壳（6 导航标签 + 主题切换）
    space/
      SpaceHeader.tsx                # 空间页头（搜索 + 主/二级筛选）
      StatusBoard.tsx                # 通用看板列组件
      CreateEntityModal.tsx          # 实体创建弹窗
      EntityDetailPanel.tsx          # 实体详情面板（6 种实体 + 毕业指标）
    breakdown/                       # 业绩拆解工作台组件（方法论/模式选择、拆解表单、草案预览、SMART 质检、历史）
    analytics/                       # 数据分析图表组件（DonutChart 环形、BarList 条形、Sparkline 迷你趋势、Timeline 时间线）
    MockBadge.tsx                    # Mock 数据角标 + 工具函数
    ui/                              # Button, Card, Input, Modal, TextArea, Badge
  hooks/
    useSpaceTree.ts                  # OKR 树数据加载 + 订阅
    useEntityList.ts                 # 通用实体列表加载 + 订阅
    useTheme.ts                      # 主题切换
    useAutosaveEntityForm.ts         # 表单自动保存
  lib/
    types.ts                         # 全部领域类型（含 is_mock、lifecycle）
    okr.ts                           # computeKrProgress()
    initiativeGraduation.ts          # 专项毕业判定与指标计算
    utils.ts                         # cn() helper
    localData.ts                     # Barrel 导出
    localModeMarkdown.ts             # Markdown 序列化/反序列化
    breakdown/                       # 业绩拆解引擎（方法论/模式定义、矩阵构建、草案生成、SMART 质检、方案存档）
    analytics/                       # 数据分析纯函数层（完成度/工单/Skill/风险聚合 + KR 进度历史存储）
    localData/
      types.ts                       # LocalDb, WAL, Snapshot 类型
      infra.ts                       # 核心引擎（readDb/writeDb/mutateDb + 缓存）
      crud.ts                        # 全部 CRUD 操作
      seed.ts                        # OKR 种子数据 + 迁移
      mock-seed.ts                   # 全量 Mock 数据（标记 is_mock=true）
      checksum.ts                    # CRC32 完整性
      storage.ts                     # localStorage 安全封装
      markdownEntity.ts              # Per-entity md 序列化
      zipBundle.ts                   # Zip 打包 + manifest
      dedup.ts                       # 查重融合（id_match/fingerprint_match/new）
      datasource/                    # 可拔插数据源插件
        types.ts                     # DataSourcePlugin 接口
        localStorage.ts              # 浏览器本地存储实现
        markdownFile.ts              # Markdown 文件实现
        index.ts                     # 插件注册中心
        entityMeta.ts                # 实体元数据 + 指纹
  store/useAppStore.ts               # Zustand（工作区身份）

质量保障

注：当前工作区 src/lib/supabase.ts 与 src/lib/supabase.test.ts 缺失，测试计数为 330。如需恢复 Supabase 远程模式支持，需重新安装 @supabase/supabase-js 并还原这两个文件。

测试覆盖

项目规模

106 个源文件 · 18,000+ 行代码
24 个测试文件 · 300 个用例 · 100% 通过
 9 个 E2E 套件 · 15 个用例
11 个页面 · 12 条路由 · 9 种实体 · 5 个专属空间
 1 个完整数据引擎 · 1 个可拔插数据源系统 · 1 套专项毕业机制
 1 套业绩拆解矩阵引擎 · 1 个岗位 OKR 模板库 · 1 个数据分析仪表盘

常用命令

部署

文档体系

完整文档入口: docs/README.md

质量文档

产品文档

技术文档

License

Private — Internal Use Only