feat: 管理后台补齐完整功能

- 页面切换卡片:数据大屏/数字孪生/AI 助手/媒体轮播 → MQTT navigate 控制所有大屏
- 立即播放:新增 POST /api/playlist/play(加入播放列表 + MQTT play_target),
  MediaScreen 监听 play_target 跳转并播放指定媒体
- 远程 URL 支持两种操作:添加到媒体库 / 加入播放列表
- 本地媒体卡片显示 FastAPI 输出 URL(/file/...)+ 一键复制
- 预览弹窗增加「立即播放」;新增 page-switch/media-url/copy-btn 样式
This commit is contained in:
Pine
2026-08-17 21:38:04 +08:00
parent 00cb76c73f
commit 1a95ecbacb
6 changed files with 173 additions and 8 deletions
+64
View File
@@ -1123,3 +1123,67 @@ button { font-family: "Poppins", "PingFang SC", sans-serif; cursor: pointer; tra
.form-inline { gap: var(--space-8); align-items: stretch; }
.form-group { margin-bottom: var(--space-8); }
}
/* =========================================================
管理后台增强:页面切换 / 立即播放 / URL 展示
========================================================= */
.page-switch-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 8px;
}
.page-switch-btn {
padding: 12px 6px;
font-size: 13px;
font-weight: 600;
color: var(--primary, #00BD7D);
background: var(--primary-subtle, rgba(0,189,125,0.07));
border: 1px solid rgba(0, 189, 125, 0.28);
border-radius: 10px;
cursor: pointer;
transition: all 0.2s;
}
.page-switch-btn:hover {
background: rgba(0, 189, 125, 0.14);
transform: translateY(-1px);
}
.media-url {
display: flex;
align-items: center;
gap: 6px;
margin: 4px 0 6px;
padding: 3px 6px;
min-width: 0;
background: rgba(0, 189, 125, 0.05);
border: 1px solid rgba(0, 189, 125, 0.14);
border-radius: 6px;
}
.media-url span {
flex: 1;
min-width: 0;
font-size: 10px;
font-family: "SF Mono", "JetBrains Mono", Menlo, monospace;
color: #6b7280;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.copy-btn {
flex-shrink: 0;
padding: 2px 7px;
font-size: 10px;
border: none;
border-radius: 5px;
background: rgba(0, 189, 125, 0.14);
color: var(--primary, #00BD7D);
cursor: pointer;
transition: all 0.2s;
}
.copy-btn:hover { background: rgba(0, 189, 125, 0.24); }
.media-card .actions {
flex-wrap: wrap;
gap: 5px;
}
@media (max-width: 900px) {
.page-switch-grid { grid-template-columns: repeat(2, 1fr); }
}