增加首页背景图设置

This commit is contained in:
mtvpls
2026-04-23 12:05:51 +08:00
parent f1da246712
commit a0f9a0398b
6 changed files with 157 additions and 6 deletions
+79 -1
View File
@@ -7329,6 +7329,7 @@ const ThemeConfigComponent = ({
});
const [loginBackgroundImages, setLoginBackgroundImages] = useState<string[]>(['']);
const [registerBackgroundImages, setRegisterBackgroundImages] = useState<string[]>(['']);
const [homeBackgroundImages, setHomeBackgroundImages] = useState<string[]>(['']);
useEffect(() => {
if (config?.ThemeConfig) {
@@ -7363,6 +7364,16 @@ const ThemeConfigComponent = ({
} else {
setRegisterBackgroundImages(['']);
}
if (config.ThemeConfig.homeBackgroundImage) {
const urls = config.ThemeConfig.homeBackgroundImage
.split('\n')
.map((url) => url.trim())
.filter((url) => url !== '');
setHomeBackgroundImages(urls.length > 0 ? urls : ['']);
} else {
setHomeBackgroundImages(['']);
}
}
}, [config]);
@@ -7403,6 +7414,22 @@ const ThemeConfigComponent = ({
}
}
const validHomeUrls = homeBackgroundImages
.map((url) => url.trim())
.filter((url) => url !== '');
for (const url of validHomeUrls) {
if (!url.startsWith('http://') && !url.startsWith('https://')) {
showAlert({
type: 'error',
title: '格式错误',
message: `首页背景图URL格式错误:${url}\n每个URL必须以http://或https://开头`,
showConfirm: true,
});
return;
}
}
const response = await fetch('/api/admin/theme', {
method: 'POST',
headers: {
@@ -7412,6 +7439,7 @@ const ThemeConfigComponent = ({
...themeSettings,
loginBackgroundImage: validLoginUrls.join('\n'),
registerBackgroundImage: validRegisterUrls.join('\n'),
homeBackgroundImage: validHomeUrls.join('\n'),
}),
});
@@ -7766,9 +7794,59 @@ const ThemeConfigComponent = ({
</button>
</div>
</div>
{/* 首页背景图 */}
<div>
<label className='block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2'>
</label>
<div className='space-y-2'>
{homeBackgroundImages.map((url, index) => (
<div key={index} className='flex gap-2'>
<input
type='text'
value={url}
onChange={(e) => {
const newImages = [...homeBackgroundImages];
newImages[index] = e.target.value;
setHomeBackgroundImages(newImages);
}}
placeholder='请输入首页背景图URL (http:// 或 https://)'
className='flex-1 px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-blue-500 focus:border-transparent font-mono text-sm'
/>
{homeBackgroundImages.length > 1 && (
<button
type='button'
onClick={() => {
setHomeBackgroundImages(
homeBackgroundImages.filter((_, i) => i !== index)
);
}}
className='px-3 py-2 text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition-colors'
title='删除'
>
<svg className='w-5 h-5' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path strokeLinecap='round' strokeLinejoin='round' strokeWidth={2} d='M6 18L18 6M6 6l12 12' />
</svg>
</button>
)}
</div>
))}
<button
type='button'
onClick={() => setHomeBackgroundImages([...homeBackgroundImages, ''])}
className='flex items-center gap-2 px-4 py-2 text-blue-600 dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition-colors'
>
<svg className='w-5 h-5' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path strokeLinecap='round' strokeLinejoin='round' strokeWidth={2} d='M12 4v16m8-8H4' />
</svg>
<span>URL</span>
</button>
</div>
</div>
</div>
<p className='mt-4 text-sm text-gray-600 dark:text-gray-400'>
使
使
</p>
</div>
+19
View File
@@ -36,6 +36,7 @@ export async function POST(request: NextRequest) {
cacheMinutes,
loginBackgroundImage,
registerBackgroundImage,
homeBackgroundImage,
progressThumbType,
progressThumbPresetId,
progressThumbCustomUrl,
@@ -47,6 +48,7 @@ export async function POST(request: NextRequest) {
cacheMinutes: number;
loginBackgroundImage?: string;
registerBackgroundImage?: string;
homeBackgroundImage?: string;
progressThumbType?: 'default' | 'preset' | 'custom';
progressThumbPresetId?: string;
progressThumbCustomUrl?: string;
@@ -96,6 +98,22 @@ export async function POST(request: NextRequest) {
}
}
if (homeBackgroundImage && homeBackgroundImage.trim() !== '') {
const urls = homeBackgroundImage
.split('\n')
.map((url) => url.trim())
.filter((url) => url !== '');
for (const url of urls) {
if (!url.startsWith('http://') && !url.startsWith('https://')) {
return NextResponse.json(
{ error: `首页背景图URL格式错误:${url},每个URL必须以http://或https://开头` },
{ status: 400 }
);
}
}
}
const adminConfig = await getConfig();
// 权限校验 - 使用v2用户系统
@@ -124,6 +142,7 @@ export async function POST(request: NextRequest) {
cacheVersion: cssChanged ? currentVersion + 1 : currentVersion,
loginBackgroundImage: loginBackgroundImage?.trim() || undefined,
registerBackgroundImage: registerBackgroundImage?.trim() || undefined,
homeBackgroundImage: homeBackgroundImage?.trim() || undefined,
progressThumbType: progressThumbType || 'default',
progressThumbPresetId: progressThumbPresetId?.trim() || undefined,
progressThumbCustomUrl: progressThumbCustomUrl?.trim() || undefined,
+1
View File
@@ -61,6 +61,7 @@ export async function GET(request: NextRequest) {
DanmakuAutoLoadDefault: config.SiteConfig.DanmakuAutoLoadDefault !== false,
loginBackgroundImage: config.ThemeConfig?.loginBackgroundImage || '',
registerBackgroundImage: config.ThemeConfig?.registerBackgroundImage || '',
homeBackgroundImage: config.ThemeConfig?.homeBackgroundImage || '',
progressThumbType: config.ThemeConfig?.progressThumbType || 'default',
progressThumbPresetId: config.ThemeConfig?.progressThumbPresetId || '',
progressThumbCustomUrl: config.ThemeConfig?.progressThumbCustomUrl || '',
+6 -3
View File
@@ -1,13 +1,13 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
import type { Metadata, Viewport } from 'next';
import { cookies } from 'next/headers';
import { Inter } from 'next/font/google';
import { cookies } from 'next/headers';
import './globals.css';
import { getConfig } from '@/lib/config';
import { parseAuthInfo } from '@/lib/auth';
import { getConfig } from '@/lib/config';
import { getUserFeatureAccess } from '@/lib/permissions';
import { listEnabledSourceScripts } from '@/lib/source-script';
@@ -15,11 +15,11 @@ import { StartupCacheCleanup } from '../components/DanmakuCacheCleanup';
import { DownloadBubble } from '../components/DownloadBubble';
import { DownloadPanel } from '../components/DownloadPanel';
import { GlobalErrorIndicator } from '../components/GlobalErrorIndicator';
import RouteScrollReset from '../components/RouteScrollReset';
import { SiteProvider } from '../components/SiteProvider';
import { ThemeProvider } from '../components/ThemeProvider';
import { TokenRefreshManager } from '../components/TokenRefreshManager';
import TopProgressBar from '../components/TopProgressBar';
import RouteScrollReset from '../components/RouteScrollReset';
import ChatFloatingWindow from '../components/watch-room/ChatFloatingWindow';
import { WatchRoomProvider } from '../components/WatchRoomProvider';
import { DownloadProvider } from '../contexts/DownloadContext';
@@ -76,6 +76,7 @@ export default async function RootLayout({
let xiaoyaEnabled = false;
let loginBackgroundImage = '';
let registerBackgroundImage = '';
let homeBackgroundImage = '';
let progressThumbType = 'default';
let progressThumbPresetId = '';
let progressThumbCustomUrl = '';
@@ -139,6 +140,7 @@ export default async function RootLayout({
tmdbApiKey = config.SiteConfig.TMDBApiKey || '';
loginBackgroundImage = config.ThemeConfig?.loginBackgroundImage || '';
registerBackgroundImage = config.ThemeConfig?.registerBackgroundImage || '';
homeBackgroundImage = config.ThemeConfig?.homeBackgroundImage || '';
progressThumbType = config.ThemeConfig?.progressThumbType || 'default';
progressThumbPresetId = config.ThemeConfig?.progressThumbPresetId || '';
progressThumbCustomUrl = config.ThemeConfig?.progressThumbCustomUrl || '';
@@ -226,6 +228,7 @@ export default async function RootLayout({
(xiaoyaEnabled && userFeatureAccess.xiaoya),
LOGIN_BACKGROUND_IMAGE: loginBackgroundImage,
REGISTER_BACKGROUND_IMAGE: registerBackgroundImage,
HOME_BACKGROUND_IMAGE: homeBackgroundImage,
PROGRESS_THUMB_TYPE: progressThumbType,
PROGRESS_THUMB_PRESET_ID: progressThumbPresetId,
PROGRESS_THUMB_CUSTOM_URL: progressThumbCustomUrl,