From 5463796f52fd64a050ec5143ecf818007e2c04f7 Mon Sep 17 00:00:00 2001
From: zizi <ChocoBunrpd@catlover.com>
Date: Tue, 16 Jun 2026 07:19:07 +0000
Subject: [PATCH] =?UTF-8?q?feat(studio):=20=E5=88=9B=E4=BD=9C=E8=80=85?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=9C=8B=E6=9D=BF(P-OPS-01/02)=E2=80=94?=
 =?UTF-8?q?=E2=80=94=E6=8C=87=E6=A0=87=E5=8D=A1=E6=8E=A5=E7=9C=9F=20+=20?=
 =?UTF-8?q?=E8=B6=8B=E5=8A=BF=E8=AF=9A=E5=AE=9E=E5=8D=A0=E4=BD=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 看板视图(views/dashboard):累计播放/点赞(project /my 聚合)+已发布数(community /level)+累计奖励(community /rewards)接真;完玩率/广告收益/七日趋势=诚实占位"数据接口建设中"(契约无创作者侧读端点,不伪造)
- 入口:个人中心"创作数据"→/dashboard(requiresAuth+hideTabBar)
- 实证缺口:契约仅 admin-api 有 telemetry game-stat / ad revenue(RBAC=admin),无 /app-api 创作者侧;建议后端补 /app-api/telemetry/my/{summary,trend}(creator 归属隔离)

verify-as-you-go:vite build + vue-tsc 双绿;接的3端点逐条命中契约;3处gap逐条grep证伪;真机走查留合并点
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 game-studio/src/router/index.ts               |   8 +
 game-studio/src/views/dashboard/Dashboard.vue | 432 ++++++++++++++++++
 game-studio/src/views/profile/Profile.vue     |  11 +
 3 files changed, 451 insertions(+)
 create mode 100644 game-studio/src/views/dashboard/Dashboard.vue

diff --git a/game-studio/src/router/index.ts b/game-studio/src/router/index.ts
index 5b920fbd..09743258 100644
--- a/game-studio/src/router/index.ts
+++ b/game-studio/src/router/index.ts
@@ -111,6 +111,14 @@ const routes: RouteRecordRaw[] = [
     // requiresAuth：我的项目区为登录态私有数据，未真实登录跳 /login（§9.3）
     meta: { title: '我的项目', tab: 'project', requiresAuth: true },
   },
+  {
+    path: '/dashboard',
+    name: 'dashboard',
+    component: () => import('../views/dashboard/Dashboard.vue'), // L0 创作者数据看板（P-OPS-01/02）
+    // requiresAuth：看板为创作者私有数据（归属隔离在后端），未真实登录跳 /login（§9.3）；
+    // hideTabBar：二级沉浸页，自带返回按钮（与 publish 同口径），归属「我的」Tab。
+    meta: { title: '创作数据', tab: 'project', hideTabBar: true, requiresAuth: true },
+  },
   {
     path: '/project/:id',
     name: 'project-detail',
diff --git a/game-studio/src/views/dashboard/Dashboard.vue b/game-studio/src/views/dashboard/Dashboard.vue
new file mode 100644
index 00000000..ee3bcee7
--- /dev/null
+++ b/game-studio/src/views/dashboard/Dashboard.vue
@@ -0,0 +1,432 @@
+<script setup lang="ts">
+/**
+ * Dashboard.vue —— 「创作者数据看板」（P-OPS-01 数据看板 / P-OPS-02 七日留存与播放趋势）。
+ *
+ * 闭环职责（严格贴 contracts，只消费创作者侧 /app-api 读端点，不发明端点）：
+ *  - 核心指标卡（P-OPS-01）：
+ *      · 累计播放 / 累计点赞 = 聚合 projectApi.getMy() 各作品 playCount/likeCount（创作者私有，归属隔离在后端）。
+ *      · 已发布作品数 = communityApi.getLevel().publishedCount（计数权威源；getMy 不可得时用项目里 status=4 数兜底）。
+ *      · 累计奖励 = communityApi.getRewards() 各条 rewardAmount 求和（P-INC-01；当前唯一创作者可见的收益型数据）。
+ *  - 诚实缺口（无创作者侧 /app-api 数据源，前端只占位、不伪造）：
+ *      · 完玩率：仅 admin 侧 telemetry/game-stat 的 completedCount 有，/app-api 无 → 占位「数据接口建设中」。
+ *      · 广告收益：仅 /admin-api/ad/revenue/page，且契约注明 ad/income 聚合为 Wave2 变现范围外 → 占位。
+ *      · 七日留存 + 播放趋势（P-OPS-02）：无任何创作者侧时序读端点（GameStatRespVO 含 statDate 但在 admin-api）
+ *        → 趋势区整体占位「数据接口建设中」，并在交付中明确建议后端补 /app-api 创作者侧 stats 读端点。
+ *
+ * 入口：个人中心「创作数据」二级入口 → /dashboard（requiresAuth，私有数据）。
+ *
+ * 边缘失败（与既有视图同口径）：
+ *  - 任一数据源失败由 request.ts 拦截器统一 Toast，不白屏；指标缺值兜底 0 或占位，不抛断页面。
+ *  - 未登录 → 路由守卫前置拦截跳登录（本页 requiresAuth）。
+ *
+ * 契约纪律：仅消费 projectApi（project.yaml）+ communityApi（community.yaml），均为已封装的创作者侧读端点。
+ */
+import { computed, onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import * as projectApi from '../../api/project'
+import * as communityApi from '../../api/community'
+import { LoadingBar } from '../../components'
+import type { Project, CommunityLevel, CommunityReward } from '../../api/types'
+
+const router = useRouter()
+
+/** 我的项目全量（聚合累计播放/点赞用；一次性拉取，分页上限内足够看板聚合） */
+const projects = ref<Project[]>([])
+/** 创作者等级（已发布作品数权威源；失败保持 null，回退项目内 status=4 计数） */
+const level = ref<CommunityLevel | null>(null)
+/** 我的奖励触发记录（累计奖励额度求和；失败保持空数组，奖励指标显 0） */
+const rewards = ref<CommunityReward[]>([])
+/** 首屏加载中（控制骨架/加载条） */
+const loading = ref(true)
+
+/** 累计播放数 = 各作品 playCount 求和（缺值按 0） */
+const totalPlay = computed(() =>
+  projects.value.reduce((sum, p) => sum + (p.playCount ?? 0), 0),
+)
+/** 累计点赞数 = 各作品 likeCount 求和（缺值按 0） */
+const totalLike = computed(() =>
+  projects.value.reduce((sum, p) => sum + (p.likeCount ?? 0), 0),
+)
+/**
+ * 已发布作品数：优先 community.level.publishedCount（计数权威源）；
+ * level 未就绪时回退「项目列表里 status=4 已发布」的计数（兜底，不伪造）。
+ */
+const publishedCount = computed(() => {
+  if (level.value) return level.value.publishedCount
+  return projects.value.filter((p) => p.status === 4).length
+})
+/**
+ * 累计奖励额度（分=现金 / 曝光量=流量包，单位混合，看板按「奖励点数」汇总展示）。
+ * 说明：这是当前唯一创作者侧可见的收益型数据；真实现金收益（广告分成）端点为 Wave2，暂缺。
+ */
+const totalRewardAmount = computed(() =>
+  rewards.value.reduce((sum, r) => sum + (r.rewardAmount ?? 0), 0),
+)
+
+/**
+ * 大数格式化：≥1万显示「x.x万」，否则原值带千分位。
+ * 仅用于指标卡展示，降低视觉噪声。
+ * @param n 原始数值
+ */
+function formatNum(n: number): string {
+  if (n >= 10000) return (n / 10000).toFixed(1).replace(/\.0$/, '') + '万'
+  return n.toLocaleString('zh-CN')
+}
+
+/**
+ * 拉取看板数据：项目全量 + 创作者等级 + 奖励记录。
+ * 三个数据源相互独立、并发拉取；任一失败由各自 catch 静默降级（拦截器已 Toast），不互相阻断。
+ */
+async function fetchAll() {
+  loading.value = true
+  await Promise.all([
+    // 我的项目全量：聚合累计播放/点赞（请求一页足量上限，看板不做分页）
+    projectApi
+      .getMy(undefined, { pageNo: 1, pageSize: 100 })
+      .then((resp) => {
+        projects.value = resp.list
+      })
+      .catch(() => {
+        // 失败：项目聚合指标显 0（拦截器已 Toast），不白屏
+        projects.value = []
+      }),
+    // 创作者等级：已发布作品数权威源
+    communityApi
+      .getLevel()
+      .then((lv) => {
+        level.value = lv
+      })
+      .catch(() => {
+        // 失败：回退项目内 status=4 计数（computed 已处理 null）
+        level.value = null
+      }),
+    // 奖励记录：累计奖励额度
+    communityApi
+      .getRewards()
+      .then((list) => {
+        rewards.value = list
+      })
+      .catch(() => {
+        // 失败：奖励指标显 0
+        rewards.value = []
+      }),
+  ])
+  loading.value = false
+}
+
+/** 返回个人中心 */
+function goBack() {
+  router.back()
+}
+
+/** 去「我的项目」查看单作品明细（看板汇总，明细仍在项目页） */
+function goProjects() {
+  router.push('/project')
+}
+
+/** 首屏加载 */
+onMounted(() => {
+  fetchAll()
+})
+</script>
+
+<template>
+  <div class="dash">
+    <!-- 顶部标题栏（返回 + 标题） -->
+    <header class="dash__head">
+      <button class="dash__back" aria-label="返回" @click="goBack">‹</button>
+      <h1 class="dash__title">创作数据</h1>
+    </header>
+
+    <!-- 首屏加载条 -->
+    <div v-if="loading" class="dash__loading">
+      <LoadingBar indeterminate />
+    </div>
+
+    <main class="dash__body">
+      <!-- ============ P-OPS-01 核心指标卡 ============ -->
+      <section class="dash__section">
+        <h2 class="dash__section-title">核心指标</h2>
+        <div class="dash__grid">
+          <!-- 累计播放（真实：聚合 project.playCount） -->
+          <div class="metric">
+            <span class="metric__icon">▶</span>
+            <span class="metric__val">{{ formatNum(totalPlay) }}</span>
+            <span class="metric__label">累计播放</span>
+          </div>
+          <!-- 累计点赞（真实：聚合 project.likeCount） -->
+          <div class="metric">
+            <span class="metric__icon metric__icon--pink">♥</span>
+            <span class="metric__val">{{ formatNum(totalLike) }}</span>
+            <span class="metric__label">累计点赞</span>
+          </div>
+          <!-- 已发布作品（真实：community.level.publishedCount，兜底 status=4 计数） -->
+          <div class="metric">
+            <span class="metric__icon metric__icon--green">◰</span>
+            <span class="metric__val">{{ formatNum(publishedCount) }}</span>
+            <span class="metric__label">已发布作品</span>
+          </div>
+          <!-- 累计奖励（真实：community.rewards 求和；现金收益端点 Wave2 暂缺，此为奖励点数） -->
+          <div class="metric">
+            <span class="metric__icon metric__icon--amber">★</span>
+            <span class="metric__val">{{ formatNum(totalRewardAmount) }}</span>
+            <span class="metric__label">累计奖励</span>
+          </div>
+        </div>
+      </section>
+
+      <!-- ============ 待后端补端点的指标（诚实占位，不伪造数据） ============ -->
+      <section class="dash__section">
+        <h2 class="dash__section-title">运营指标</h2>
+        <div class="dash__pending-list">
+          <!-- 完玩率：仅 admin 侧 telemetry/game-stat 有 completedCount，创作者侧 /app-api 无 -->
+          <div class="pending-row">
+            <span class="pending-row__label">完玩率</span>
+            <span class="pending-row__hint">数据接口建设中</span>
+          </div>
+          <!-- 广告收益：仅 /admin-api/ad/revenue/page，且契约注明 ad/income 聚合为 Wave2 变现范围外 -->
+          <div class="pending-row">
+            <span class="pending-row__label">广告收益</span>
+            <span class="pending-row__hint">数据接口建设中</span>
+          </div>
+        </div>
+        <p class="dash__note">
+          完玩率与广告收益需后端补创作者侧聚合读端点（当前仅运营后台 admin-api 可见），稍后开放。
+        </p>
+      </section>
+
+      <!-- ============ P-OPS-02 七日留存与播放趋势（诚实占位） ============ -->
+      <section class="dash__section">
+        <h2 class="dash__section-title">七日趋势</h2>
+        <!-- 占位图：无创作者侧时序读端点（GameStatRespVO 含 statDate 但在 admin-api）→ 不画假折线 -->
+        <div class="trend-placeholder">
+          <!-- 静态网格底纹，明确标注「建设中」，避免误导为真实数据 -->
+          <div class="trend-placeholder__grid">
+            <span v-for="i in 7" :key="i" class="trend-placeholder__bar"></span>
+          </div>
+          <div class="trend-placeholder__mask">
+            <span class="trend-placeholder__icon">📈</span>
+            <p class="trend-placeholder__title">七日留存与播放趋势</p>
+            <p class="trend-placeholder__desc">数据接口建设中，开放后将展示每日播放与留存曲线</p>
+          </div>
+        </div>
+      </section>
+
+      <!-- 去项目页查看单作品明细 -->
+      <div class="dash__more">
+        <button class="dash__more-btn" @click="goProjects">查看单作品明细 ›</button>
+      </div>
+    </main>
+  </div>
+</template>
+
+<style scoped>
+.dash {
+  display: flex;
+  flex-direction: column;
+  min-height: 100%;
+  background: var(--bg);
+  color: var(--ink);
+}
+
+/* 顶部标题栏 */
+.dash__head {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 14px 12px 8px;
+}
+.dash__back {
+  flex: 0 0 32px;
+  width: 32px;
+  height: 32px;
+  font-size: 26px;
+  line-height: 1;
+  color: var(--ink);
+  background: transparent;
+}
+.dash__title {
+  font-size: var(--fs-h2);
+  font-weight: 700;
+  margin: 0;
+}
+
+.dash__loading {
+  padding: 4px 16px 8px;
+}
+
+.dash__body {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 4px 12px 24px;
+}
+
+/* 区块 */
+.dash__section {
+  margin-bottom: 18px;
+}
+.dash__section-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--muted);
+  margin: 0 4px 10px;
+}
+
+/* —— 核心指标卡（2 列网格）—— */
+.dash__grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+}
+.metric {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 16px 14px;
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+}
+.metric__icon {
+  font-size: 18px;
+  color: var(--cyan);
+  line-height: 1;
+}
+.metric__icon--pink {
+  color: var(--pink);
+}
+.metric__icon--green {
+  color: var(--green);
+}
+.metric__icon--amber {
+  color: var(--amber);
+}
+.metric__val {
+  font-size: 24px;
+  font-weight: 800;
+  color: var(--ink);
+  line-height: 1.1;
+}
+.metric__label {
+  font-size: var(--fs-caption);
+  color: var(--muted);
+}
+
+/* —— 待补指标行 —— */
+.dash__pending-list {
+  display: flex;
+  flex-direction: column;
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  overflow: hidden;
+}
+.pending-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 46px;
+  padding: 0 14px;
+  border-bottom: 1px solid var(--border);
+}
+.pending-row:last-child {
+  border-bottom: none;
+}
+.pending-row__label {
+  font-size: 14px;
+  color: var(--ink);
+}
+/* 占位提示：弱化 + 虚线徽标，明确「非真实数据」 */
+.pending-row__hint {
+  font-size: 12px;
+  color: var(--muted);
+  padding: 2px 8px;
+  border: 1px dashed var(--border);
+  border-radius: var(--radius);
+}
+.dash__note {
+  margin: 8px 4px 0;
+  font-size: var(--fs-caption);
+  color: var(--muted);
+  line-height: 1.5;
+}
+
+/* —— 七日趋势占位 —— */
+.trend-placeholder {
+  position: relative;
+  height: 160px;
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  overflow: hidden;
+}
+/* 底层静态柱状网格（纯装饰，弱透明，绝不可被误读为真实数据） */
+.trend-placeholder__grid {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-around;
+  padding: 16px;
+  opacity: 0.14;
+}
+.trend-placeholder__bar {
+  flex: 0 0 18px;
+  background: var(--cyan);
+  border-radius: 4px 4px 0 0;
+}
+/* 高度做出错落感（纯静态装饰，不代表任何数据） */
+.trend-placeholder__bar:nth-child(1) { height: 40%; }
+.trend-placeholder__bar:nth-child(2) { height: 65%; }
+.trend-placeholder__bar:nth-child(3) { height: 50%; }
+.trend-placeholder__bar:nth-child(4) { height: 80%; }
+.trend-placeholder__bar:nth-child(5) { height: 55%; }
+.trend-placeholder__bar:nth-child(6) { height: 70%; }
+.trend-placeholder__bar:nth-child(7) { height: 45%; }
+/* 上层蒙层文案（明确建设中） */
+.trend-placeholder__mask {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  text-align: center;
+  padding: 0 24px;
+}
+.trend-placeholder__icon {
+  font-size: 28px;
+  opacity: 0.8;
+}
+.trend-placeholder__title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--ink);
+  margin: 4px 0 0;
+}
+.trend-placeholder__desc {
+  font-size: var(--fs-caption);
+  color: var(--muted);
+  margin: 0;
+  max-width: 240px;
+}
+
+/* 查看明细入口 */
+.dash__more {
+  margin-top: 4px;
+}
+.dash__more-btn {
+  width: 100%;
+  height: 44px;
+  font-size: 14px;
+  color: var(--cyan);
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+}
+.dash__more-btn:active {
+  background: var(--panel-2);
+}
+</style>
diff --git a/game-studio/src/views/profile/Profile.vue b/game-studio/src/views/profile/Profile.vue
index a3d9a4e7..8b8a3788 100644
--- a/game-studio/src/views/profile/Profile.vue
+++ b/game-studio/src/views/profile/Profile.vue
@@ -86,6 +86,11 @@ function goProjects() {
   router.push('/project')
 }
 
+/** 跳「创作数据」看板（P-OPS-01/02：核心指标卡 + 七日趋势，创作者私有数据） */
+function goDashboard() {
+  router.push('/dashboard')
+}
+
 /** 跳「消息」中心 */
 function goMessages() {
   router.push('/message')
@@ -175,6 +180,12 @@ onMounted(() => {
         <span class="profile__item-label">我的项目</span>
         <span class="profile__item-chevron">›</span>
       </button>
+      <!-- 创作数据看板（P-OPS-01/02：累计播放/点赞/作品/奖励 + 七日趋势占位） -->
+      <button class="profile__item" @click="goDashboard">
+        <span class="profile__item-icon">▤</span>
+        <span class="profile__item-label">创作数据</span>
+        <span class="profile__item-chevron">›</span>
+      </button>
       <!-- 消息（与底部 Tab 同入口，带未读角标，方便从个人中心进入） -->
       <button class="profile__item" @click="goMessages">
         <span class="profile__item-icon">✉</span>