feat: 修复测试套件问题并添加Woodpecker CI配置

- 修复API测试认证问题:创建全局认证设置,更新Playwright配置
- 优化回归测试稳定性:增加超时时间到15秒,修复定位器
- 创建Woodpecker CI工作流:CI、部署和质量门禁配置
- 添加Jest配置和测试脚本
- 移除登录页面的默认账号密码显示(安全问题修复)
This commit is contained in:
张翔
2026-03-09 10:26:02 +08:00
parent 96c96fe75d
commit 6d92024b63
68 changed files with 5584 additions and 167 deletions
+324
View File
@@ -0,0 +1,324 @@
'use client';
import { useState, useEffect, useCallback } from 'react';
import Link from 'next/link';
import { useSearchParams } from 'next/navigation';
import {
Plus,
Search,
Edit,
Trash2,
FileText,
Loader2
} from 'lucide-react';
interface ContentItem {
id: string;
type: 'news' | 'product' | 'service' | 'case';
title: string;
slug: string;
excerpt: string | null;
status: 'draft' | 'published' | 'archived';
category: string | null;
createdAt: string;
publishedAt: string | null;
}
interface Pagination {
page: number;
limit: number;
total: number;
totalPages: number;
}
const typeLabels: Record<string, string> = {
news: '新闻',
product: '产品',
service: '服务',
case: '案例',
};
const statusLabels: Record<string, string> = {
draft: '草稿',
published: '已发布',
archived: '已归档',
};
const statusColors: Record<string, string> = {
draft: 'bg-yellow-100 text-yellow-800',
published: 'bg-green-100 text-green-800',
archived: 'bg-gray-100 text-gray-800',
};
export default function ContentListPage() {
const searchParams = useSearchParams();
const [items, setItems] = useState<ContentItem[]>([]);
const [pagination, setPagination] = useState<Pagination>({
page: 1,
limit: 20,
total: 0,
totalPages: 0,
});
const [loading, setLoading] = useState(true);
const [search, setSearch] = useState(searchParams.get('search') || '');
const [typeFilter, setTypeFilter] = useState(searchParams.get('type') || '');
const [statusFilter, setStatusFilter] = useState(searchParams.get('status') || '');
const [deleteId, setDeleteId] = useState<string | null>(null);
const [deleting, setDeleting] = useState(false);
const fetchContent = useCallback(async () => {
setLoading(true);
try {
const params = new URLSearchParams();
params.set('page', pagination.page.toString());
params.set('limit', pagination.limit.toString());
if (search) params.set('search', search);
if (typeFilter) params.set('type', typeFilter);
if (statusFilter) params.set('status', statusFilter);
const res = await fetch(`/api/admin/content?${params}`);
const data = await res.json();
if (res.ok) {
setItems(data.items);
setPagination(data.pagination);
}
} catch (error) {
console.error('获取内容列表失败:', error);
} finally {
setLoading(false);
}
}, [pagination.page, pagination.limit, search, typeFilter, statusFilter]);
useEffect(() => {
fetchContent();
}, [fetchContent]);
const handleSearch = (e: React.FormEvent) => {
e.preventDefault();
setPagination(prev => ({ ...prev, page: 1 }));
fetchContent();
};
const handleDelete = async () => {
if (!deleteId) return;
setDeleting(true);
try {
const res = await fetch(`/api/admin/content/${deleteId}`, {
method: 'DELETE',
});
if (res.ok) {
setItems(items.filter(item => item.id !== deleteId));
setDeleteId(null);
}
} catch (error) {
console.error('删除失败:', error);
} finally {
setDeleting(false);
}
};
const formatDate = (dateStr: string) => {
return new Date(dateStr).toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
});
};
return (
<div className="space-y-6">
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
<h1 className="text-2xl font-bold text-gray-900"></h1>
<Link
href="/admin/content/new"
className="inline-flex items-center gap-2 px-4 py-2 bg-[#C41E3A] text-white rounded-lg hover:bg-[#a01830] transition-colors"
>
<Plus className="h-5 w-5" />
</Link>
</div>
<div className="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<form onSubmit={handleSearch} className="flex flex-col sm:flex-row gap-4 mb-6">
<div className="flex-1 relative">
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-5 w-5 text-gray-400" />
<input
type="text"
value={search}
onChange={(e) => setSearch(e.target.value)}
placeholder="搜索标题..."
className="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#C41E3A] focus:border-transparent outline-none"
/>
</div>
<select
value={typeFilter}
onChange={(e) => {
setTypeFilter(e.target.value);
setPagination(prev => ({ ...prev, page: 1 }));
}}
className="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#C41E3A] focus:border-transparent outline-none"
>
<option value=""></option>
{Object.entries(typeLabels).map(([value, label]) => (
<option key={value} value={value}>{label}</option>
))}
</select>
<select
value={statusFilter}
onChange={(e) => {
setStatusFilter(e.target.value);
setPagination(prev => ({ ...prev, page: 1 }));
}}
className="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#C41E3A] focus:border-transparent outline-none"
>
<option value=""></option>
{Object.entries(statusLabels).map(([value, label]) => (
<option key={value} value={value}>{label}</option>
))}
</select>
<button
type="submit"
className="px-6 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 transition-colors"
>
</button>
</form>
{loading ? (
<div className="flex items-center justify-center py-12">
<Loader2 className="h-8 w-8 animate-spin text-[#C41E3A]" />
</div>
) : items.length === 0 ? (
<div className="text-center py-12">
<FileText className="h-12 w-12 text-gray-300 mx-auto mb-4" />
<p className="text-gray-500"></p>
<Link
href="/admin/content/new"
className="inline-block mt-4 text-[#C41E3A] hover:underline"
>
</Link>
</div>
) : (
<>
<div className="overflow-x-auto">
<table className="w-full">
<thead>
<tr className="border-b border-gray-200">
<th className="text-left py-3 px-4 text-sm font-medium text-gray-600"></th>
<th className="text-left py-3 px-4 text-sm font-medium text-gray-600"></th>
<th className="text-left py-3 px-4 text-sm font-medium text-gray-600"></th>
<th className="text-left py-3 px-4 text-sm font-medium text-gray-600"></th>
<th className="text-left py-3 px-4 text-sm font-medium text-gray-600"></th>
<th className="text-right py-3 px-4 text-sm font-medium text-gray-600"></th>
</tr>
</thead>
<tbody>
{items.map((item) => (
<tr key={item.id} className="border-b border-gray-100 hover:bg-gray-50">
<td className="py-4 px-4">
<div>
<p className="font-medium text-gray-900">{item.title}</p>
<p className="text-sm text-gray-500">{item.slug}</p>
</div>
</td>
<td className="py-4 px-4">
<span className="px-2 py-1 text-xs font-medium bg-blue-100 text-blue-800 rounded">
{typeLabels[item.type]}
</span>
</td>
<td className="py-4 px-4">
<span className={`px-2 py-1 text-xs font-medium rounded ${statusColors[item.status]}`}>
{statusLabels[item.status]}
</span>
</td>
<td className="py-4 px-4 text-gray-600">
{item.category || '-'}
</td>
<td className="py-4 px-4 text-gray-600">
{formatDate(item.createdAt)}
</td>
<td className="py-4 px-4">
<div className="flex items-center justify-end gap-2">
<Link
href={`/admin/content/${item.id}`}
className="p-2 text-gray-400 hover:text-[#C41E3A] hover:bg-red-50 rounded-lg transition-colors"
title="编辑"
>
<Edit className="h-5 w-5" />
</Link>
<button
onClick={() => setDeleteId(item.id)}
className="p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-lg transition-colors"
title="删除"
>
<Trash2 className="h-5 w-5" />
</button>
</div>
</td>
</tr>
))}
</tbody>
</table>
</div>
{pagination.totalPages > 1 && (
<div className="flex items-center justify-between mt-6 pt-6 border-t border-gray-200">
<p className="text-sm text-gray-600">
{pagination.total}
</p>
<div className="flex gap-2">
<button
onClick={() => setPagination(prev => ({ ...prev, page: prev.page - 1 }))}
disabled={pagination.page === 1}
className="px-4 py-2 text-sm border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
>
</button>
<button
onClick={() => setPagination(prev => ({ ...prev, page: prev.page + 1 }))}
disabled={pagination.page === pagination.totalPages}
className="px-4 py-2 text-sm border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
>
</button>
</div>
</div>
)}
</>
)}
</div>
{deleteId && (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
<div className="bg-white rounded-xl p-6 max-w-md w-full mx-4">
<h3 className="text-lg font-semibold text-gray-900 mb-2"></h3>
<p className="text-gray-600 mb-6"></p>
<div className="flex gap-3 justify-end">
<button
onClick={() => setDeleteId(null)}
className="px-4 py-2 text-gray-700 hover:bg-gray-100 rounded-lg transition-colors"
>
</button>
<button
onClick={handleDelete}
disabled={deleting}
className="px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50 transition-colors"
>
{deleting ? '删除中...' : '确认删除'}
</button>
</div>
</div>
</div>
)}
</div>
);
}