- {/* 顶部 Banner */}
+ {/* ===== Banner ===== */}
+ {/* 题图底图 或 默认渐变 */}
+ {cover.cover_path ? (
+
+ ) : (
+
+ )}
+ {/* 暗化渐变层 */}
+
+ {/* 右上角 Logo */}
+
{ e.target.style.display = 'none' }}
+ />
+ {/* 左侧文字 */}
-
本月收视最佳
- {bestEpisode ? (
-
- 第 {bestEpisode.episode_number} 期 {bestEpisode.program_name} ·
- 收视份额 {bestEpisode.audience_share}
-
- ) : (
-
暂无收视数据
- )}
+
本月收视最佳·题图
+
+ {cover.episode_number
+ ? `第 ${cover.episode_number} 期`
+ : bestEpisode
+ ? `第 ${bestEpisode.episode_number} 期`
+ : '暂无收视数据'}
+ {cover.episode_title || (bestEpisode ? ` · ${bestEpisode.program_name}` : '')}
+
+
+ {bestEpisode
+ ? `收视份额 ${Number(bestEpisode.audience_share).toFixed(4)} · 当月最高`
+ : '暂无收视数据'}
+
+
建议：可选用近期收视表现好的节目海报
- {/* 题图渐变占位 */}
-
-
- {showChangeCoverBtn && (
-
}
- disabled
- className="change-cover-btn"
- >
- 更换题图
-
+ {/* 右下角换图按钮 */}
+ {showChangeCoverBtn && (
+
}
+ onClick={() => setCoverModalOpen(true)}
+ >
+ 更换题图
+
+ )}
+
+
+ {/* ===== KPI 细条 ===== */}
+
+ {kpiData.map((item, i) => (
+
+
+ {item.icon}
+
+
+
{item.label}
+
{item.value}
+
+
+ ))}
+
+
+ {/* ===== 近9期收视柱图（全宽） ===== */}
+
+
+
近 9 期收视份额
+ 悬浮看编导/期次/收视率·颜色只对收视份额
+
+ {loading ? (
+
加载中...
+ ) : (
+ <>
+
+ {displayEpisodes.map((ep) => {
+ const airYear = new Date(ep.air_date).getFullYear()
+ const color = ep.audience_share != null
+ ? getShareColor(ep.audience_share, targets, airYear)
+ : '#ccc'
+ const colorLabel = ep.audience_share != null
+ ? getColorLabel(ep.audience_share, targets, airYear)
+ : '无数据'
+ const tooltipContent = `
+
第 ${ep.episode_number} 期 · ${ep.program_name}
+ 编导：${ep.editor_name_snapshot || '未知'}
+ 收视份额：${ep.audience_share != null ? Number(ep.audience_share).toFixed(4) : '无数据'}（${colorLabel}）
+ 收视率：${ep.audience_rating != null ? Number(ep.audience_rating).toFixed(4) : '无数据'}
+ `
+ return (
+
+
}>
+
+
+
+ {ep.audience_share != null ? Number(ep.audience_share).toFixed(2) : '--'}
+
+
+ {getShortTitle(ep.program_name)}
+
+
+ )
+ })}
+
+
+
+ 绿=未达基础目标（待提升）
+
+
+ 蓝=未达摸高目标（达标）
+
+
+ 红=超过摸高目标（优秀）
+
+
+
+ )}
+
+
+ {/* ===== 下方两栏 ===== */}
+
+ {/* 左：雷达占位 */}
+
+
军事科技热点雷达
+
+
Phase 4c·占位
+
+
1. 神舟飞船对接空间站
+
2. 新型无人机集群技术
+
+
+
真实抓取 Phase 4c 实现
+
编导个人首页核心功能
+
+
+
+ {/* 右：排播计划 */}
+
+
未来排播计划
+ {loading ? (
+
+ ) : schedules.length > 0 ? (
+
+ {schedules.map((item, i) => (
+ -
+ 第{item.episode_number}期
+ {item.program_name}
+ {item.planned_air_date}
+ {item.editor_name_snapshot || ''}
+
+ ))}
+
+ ) : (
+
)}
-
敬请期待
- {/* KPI Cards */}
-
-
-
-
-
-
-
- {displayEpisodes.filter(e => e.audience_share).length || '--'}
- 近 9 期已录
-
-
-
-
-
-
-
-
-
-
- {bestEpisode ? (bestEpisode.audience_share * 100).toFixed(1) + '%' : '--'}
-
- 最佳收视份额
-
-
-
-
-
-
-
-
-
- {targets.length || '--'}
- 年度目标条数
-
-
-
-
-
- {/* 三卡片区域 */}
-
- {/* 热点雷达 */}
-
-
-
-
-
热点雷达 · Phase 4c
-
编导个人首页核心功能，Phase 4c 实施
-
-
- {displayEpisodes.map((ep) => {
- const airYear = new Date(ep.air_date).getFullYear()
- const color = ep.audience_share != null
- ? getShareColor(ep.audience_share, targets, airYear)
- : '#ccc'
- return (
-
-
-
-
-
{getShortTitle(ep.program_name)}
-
-
- {(ep.editor_name_snapshot || '?')[0]}
-
-
{ep.editor_name_snapshot || '未知'}
-
-
- )
- })}
-
-
- 绿=未达基础目标（待提升）
- 蓝=未达摸高目标（达标）
- 红=超过摸高目标（优秀）
-
-
-
-
排播计划 · Phase 4b
-
甘特图排期使用 frappe-gantt 实现，Phase 4b 开发
-
+ {/* 换图 Modal */}
+
setCoverModalOpen(false)}
+ onUploaded={handleCoverUploaded}
+ episodes={episodes.slice(0, 20)}
+ />
)
}
diff --git a/frontend/src/services/dashboardService.js b/frontend/src/services/dashboardService.js
new file mode 100644
index 0000000..c1daeb5
--- /dev/null
+++ b/frontend/src/services/dashboardService.js
@@ -0,0 +1,38 @@
+import http from './http'
+
+/**
+ * 获取当前题图设置
+ * @returns {Promise<{cover_path: string|null, episode_number: number|null, episode_title: string|null}>}
+ */
+export async function getCurrentCover() {
+ const response = await http.get('/dashboard/cover')
+ return response.data
+}
+
+/**
+ * 上传题图（仅制片人/责编可用）
+ * @param {File} file - 海报图片文件
+ * @param {number} episodeNumber - 关联期次号
+ * @param {string} episodeTitle - 关联期次节目名
+ * @returns {Promise<{success: boolean, cover_path: string}>}
+ */
+export async function uploadCover(file, episodeNumber, episodeTitle) {
+ const formData = new FormData()
+ formData.append('file', file)
+ formData.append('episode_number', String(episodeNumber))
+ formData.append('episode_title', episodeTitle)
+ const response = await http.post('/dashboard/cover', formData, {
+ headers: { 'Content-Type': 'multipart/form-data' },
+ })
+ return response.data
+}
+
+/**
+ * 获取未来排播计划
+ * @param {number} limit - 返回条数，默认6
+ * @returns {Promise
>}
+ */
+export async function getUpcomingSchedules(limit = 6) {
+ const response = await http.get('/schedules/upcoming', { params: { limit } })
+ return response.data
+}
\ No newline at end of file
diff --git a/frontend/vite.config.js b/frontend/vite.config.js
index 733a420..2fb5fba 100644
--- a/frontend/vite.config.js
+++ b/frontend/vite.config.js
@@ -10,6 +10,10 @@ export default defineConfig({
target: 'http://localhost:8000',
changeOrigin: true,
},
+ '/static': {
+ target: 'http://localhost:8000',
+ changeOrigin: true,
+ },
},
},
})
\ No newline at end of file
+