---
name: dashboard-usage-interaction
overview: 在运营仪表盘新增「今日消耗、COS 图数、点赞/收藏」指标：后端扩展 summary 聚合接口，前端新增展示卡片。
todos:
  - id: add-social-models
    content: 在 business.go 中新增 Like、Collect 表模型镜像
    status: completed
  - id: extend-dto-dao
    content: 扩展 dashboard DTO 并新增 UsageStatsGet/SocialStatsGet 聚合方法
    status: completed
    dependencies:
      - add-social-models
  - id: aggregate-summary
    content: 在 DashboardService.Summary 中聚合 usage 与 social 维度
    status: completed
    dependencies:
      - extend-dto-dao
  - id: extend-frontend-types
    content: 扩展前端 dashboard 类型定义，新增 usage/social 字段
    status: completed
    dependencies:
      - extend-dto-dao
  - id: render-dashboard-metrics
    content: 在仪表盘页新增「今日消耗」「内容互动」两列指标卡片
    status: completed
    dependencies:
      - extend-frontend-types
---

## 产品概述

在现有运营仪表盘基础上，新增「今日消耗」与「内容互动」两组共 6 个运营指标，让运营人员直观掌握每日额度消耗与社区内容互动数据。

## 核心功能

- 今日 AI 推荐消耗次数
- 今日衣柜分享消耗次数
- 今日社区分享消耗次数
- COS 总图数
- 点赞数
- 收藏数

## 展示说明

- 在营收卡片下方、数据趋势面板上方，新增一行两列卡片：「今日消耗」展示 AI 推荐/衣柜分享/社区分享三项今日次数，「内容互动」展示 COS 图数/点赞数/收藏数三项累计值。
- 沿用现有 stat-card / mini-stat 卡片风格与图标配色，保持页面整体视觉一致。

## 技术栈

- 后端：Go + Gin + GORM，复用现有 `StatsDao` / `DashboardService`，不改表结构。
- 前端：Vue 3 + TypeScript + Element Plus，复用现有卡片样式，无需新增依赖。

## 实现方案

扩展现有 `GET /dashboard/summary` 响应的 `DashboardResponse`，新增 `usage`（今日消耗）与 `social`（互动+COS）两个子结构，一次请求返回全部新增指标；前端在 `DashboardView.vue` 中新增一行两列卡片渲染。

数据口径（已通过业务服务源码确认）：

| 指标 | 数据来源 | 统计口径 |
| --- | --- | --- |
| 今日 AI 推荐消耗次数 | `user_daily_usages` | `stat_date = 今日(YYYYMMDD)`，`SUM(ai_recommend_count)` |
| 今日衣柜分享消耗次数 | `user_daily_usages` | `stat_date = 今日(YYYYMMDD)`，`SUM(closet_share_count)` |
| 今日社区分享消耗次数 | `user_daily_usages` | `stat_date = 今日(YYYYMMDD)`，`SUM(outfit_share_count)` |
| COS 总图数 | `clothes` | `processed_image != ''` 的记录数 |
| 点赞数 | `likes` | `status = 1`（已点赞）计数 |
| 收藏数 | `collects` | `status = 1`（已收藏）计数 |


关键决策：

- **今日消耗合并为一次查询**：`user_daily_usages` 一行同时含三项计数字段，直接 `SUM` 三列并 `WHERE stat_date = ?`，避免三次查询。
- **COS 总图数口径**：`clothes.processed_image` 是上传 COS 成功后回填的对象键路径，非空即代表已存图。
- **点赞/收藏按累计总数**：用户未加「今日」前缀，与「今日消耗」形成区分，取 `status=1` 全量计数。
- **Like/Collect 模型镜像补齐**：管理后台 `business.go` 当前缺少这两个表模型，按业务服务字段镜像新增，软删除由 `Model.DeletedAt` 自动过滤。

## 架构设计

沿用现有分层：`DashboardHandler.Summary → DashboardService.Summary → StatsDao → MySQL`。本次仅扩展 summary 聚合链路，不新增路由与 handler。

```mermaid
flowchart LR
  DV[DashboardView.vue] --> API[api/dashboard.ts]
  API --> H[SummaryHandler]
  H --> S[DashboardService.Summary]
  S --> DAO[StatsDao]
  DAO --> M[(MySQL 业务表)]
```

## 目录结构

```
后端 /root/zt-closet-manage-backend/
├── internal/mysqlmodel/business.go   # [MODIFY] 新增 Like、Collect 表模型镜像
├── internal/dto/dashboard.go         # [MODIFY] 新增 DashboardUsage/DashboardSocial 及 DashboardResponse 字段
├── internal/mysqldao/stats.go        # [MODIFY] 新增 UsageStatsGet/SocialStatsGet
└── internal/service/dashboard.go     # [MODIFY] Summary 聚合 usage/social 维度

前端 /root/zt-closet-manage-frontend/
├── src/types/dashboard.ts            # [MODIFY] 新增 DashboardUsage/DashboardSocial 类型及 DashboardSummary 字段
└── src/views/dashboard/DashboardView.vue  # [MODIFY] 新增「今日消耗」「内容互动」两列卡片
```

## 关键代码结构

```
// dto/dashboard.go
type DashboardUsage struct {
	AIRecommend int64 `json:"ai_recommend"` // 今日AI推荐消耗次数
	ClosetShare int64 `json:"closet_share"` // 今日衣柜分享消耗次数
	OutfitShare int64 `json:"outfit_share"` // 今日社区分享消耗次数
}

type DashboardSocial struct {
	CosImageCount int64 `json:"cos_image_count"` // COS总图数
	LikeCount     int64 `json:"like_count"`      // 点赞数
	CollectCount  int64 `json:"collect_count"`   // 收藏数
}

// mysqldao/stats.go
func (d *StatsDao) UsageStatsGet(ctx context.Context, statDate int64) (*UsageStats, error)
func (d *StatsDao) SocialStatsGet(ctx context.Context) (*SocialStats, error)
```

## 实现要点

- `UsageStatsGet` 用单条 `Select("COALESCE(SUM(ai_recommend_count),0), COALESCE(SUM(closet_share_count),0), COALESCE(SUM(outfit_share_count),0)")` 配合 `Where("stat_date = ?", statDate)`，`Scan` 到三个字段。
- `SocialStatsGet` 三条独立计数：`clothes.processed_image <> ''`、`likes.status = 1`、`collects.status = 1`，各自带 `span.RecordError` 与现有 DAO 风格一致。
- `Summary` 内使用已存在的 `todayStatDate()`（service/service.go）计算今日 YYYYMMDD 整数，传给 `UsageStatsGet`。
- 前端新增字段为可选读取（`summary?.usage` / `summary?.social`），旧后端响应未升级时不会报错；采用 6 个 `mini-stat` 数字块，分组放入两个 `panel`。
- 不改动已有接口字段与展示路径，保证向后兼容。