@@ -443,7 +444,7 @@ export default function Admin() {
{/* Playlist */}
diff --git a/src/pages/Screen.jsx b/src/pages/Screen.jsx
index 236972e..5a22126 100644
--- a/src/pages/Screen.jsx
+++ b/src/pages/Screen.jsx
@@ -1,5 +1,6 @@
import { useState, useEffect, useRef, useCallback } from 'react';
import * as api from '../utils/api';
+import { API_BASE } from '../utils/api';
import '../styles/screen.css';
/* ============ Loader ============ */
@@ -59,7 +60,7 @@ export default function Screen() {
useEffect(() => { soundBlockedRef.current = soundBlocked; }, [soundBlocked]);
const getUrl = useCallback((item) => {
- return item.source === 'url' ? item.relative_path : `/file/${item.relative_path}`;
+ return item.source === 'url' ? item.relative_path : `${API_BASE}/file/${item.relative_path}`;
}, []);
// ============ 核心播放控制 ============
@@ -103,12 +104,12 @@ export default function Screen() {
const item = list[index];
if (!item) return;
- // 同步状态到后端
+ // 同步状态到后端(字段名 type 与 Rust PlaybackState 的 #[serde(rename = "type")] 匹配)
api.updateState({
status: 'playing',
index,
name: item.name || '',
- media_type: item.type || '',
+ type: item.type || '',
}).catch(() => {});
if (item.type === 'video') {
@@ -208,7 +209,7 @@ export default function Screen() {
// SSE 连接
useEffect(() => {
- const es = new EventSource('/api/events');
+ const es = new EventSource(`${API_BASE}/api/events`);
es.onmessage = (e) => {
try {
const msg = JSON.parse(e.data);
@@ -362,7 +363,7 @@ export default function Screen() {
{/* Corner Info — Now Playing */}
-
{currentItem ? currentItem.name : '就绪'}
+
{'昆明市大学生创业园'}
{/* Connection Indicator */}
@@ -382,7 +383,7 @@ export default function Screen() {
{/* Sound Hint */}
- 点击启用声音
+ 声音
);
diff --git a/src/styles/admin.css b/src/styles/admin.css
index d84afbd..7e4cc3f 100644
--- a/src/styles/admin.css
+++ b/src/styles/admin.css
@@ -696,6 +696,46 @@ button { font-family: "Poppins", "PingFang SC", sans-serif; cursor: pointer; tra
display: block;
cursor: pointer;
}
+.thumb-video-wrap {
+ position: relative;
+ width: 100%;
+ height: 108px;
+ overflow: hidden;
+ cursor: pointer;
+ background: #111;
+}
+.thumb-video-wrap .thumb {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ display: block;
+ background: #111;
+}
+.play-badge {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ background: rgba(0,0,0,0.55);
+ color: rgba(255,255,255,0.85);
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ backdrop-filter: blur(4px);
+ border: 1.5px solid rgba(255,255,255,0.15);
+ transition: all 0.2s ease;
+ pointer-events: none;
+}
+.thumb-video-wrap:hover .play-badge {
+ background: rgba(0, 189, 125, 0.75);
+ color: #fff;
+ transform: translate(-50%, -50%) scale(1.1);
+ border-color: rgba(255,255,255,0.3);
+}
.media-card .thumb-placeholder {
width: 100%;
height: 108px;
@@ -926,6 +966,7 @@ button { font-family: "Poppins", "PingFang SC", sans-serif; cursor: pointer; tra
.form-inline { flex-direction: column; gap: var(--space-16); }
.media-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-8); }
.media-card .thumb { height: 88px; }
+ .thumb-video-wrap { height: 88px; }
.media-card .body { padding: var(--space-8); }
.media-card .body .name { font-size: 12px; }
.media-card .body .actions button { font-size: 11px; padding: var(--space-4) var(--space-8); }
diff --git a/src/utils/api.js b/src/utils/api.js
index 0d171c3..cc41be0 100644
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -1,7 +1,9 @@
// API 基地址:Tauri 生产环境使用绝对路径,浏览器环境使用相对路径
+// 导出供 SSE、媒体文件等非 fetch 场景使用
const BASE = window.location.protocol === 'http:' || window.location.protocol === 'https:'
? '' // 浏览器环境 — 同源请求
: 'http://localhost:10801'; // Tauri 生产环境 (tauri://)
+export const API_BASE = BASE;
async function request(url, options = {}) {
const res = await fetch(`${BASE}${url}`, {