feat: add issue creation and resolution features
- CreateIssueForm component with validation - Issue creation button in task detail page - Issue resolution button for unresolved issues - Real-time issue list refresh after create/resolve - Improved task detail page UI with issue management
This commit is contained in:
Xiaoxia AI
@@ -48,19 +48,22 @@
|
||||
- ✅ API 文档（Swagger）
|
||||
|
||||
### 测试与质量
|
||||
- ✅ **15 个集成测试全绿**（素材管理 8 个 + 项目管理 7 个）
|
||||
- ✅ **16 个集成测试全绿**（素材管理 8 个 + 项目管理 8 个）
|
||||
- ✅ 测试策略：集成测试优先，覆盖核心业务流程
|
||||
|
||||
---
|
||||
|
||||
## 进行中
|
||||
|
||||
### 项目推进器前端页面
|
||||
- 🔄 Next.js 页面设计与开发（下一步）
|
||||
- 🔄 树形任务视图
|
||||
### 项目推进器前端功能扩展
|
||||
- ✅ 任务创建表单
|
||||
- ✅ 任务详情页
|
||||
- ✅ 任务列表链接跳转
|
||||
- ✅ 实时 API 集成
|
||||
- 🔄 任务编辑功能（下一步）
|
||||
- 🔄 里程碑管理页面
|
||||
- 🔄 问题卡点创建与解决
|
||||
- 🔄 甘特图视图
|
||||
- 🔄 里程碑时间轴
|
||||
- 🔄 问题卡点面板
|
||||
|
||||
### 稳定化与部署打磨
|
||||
- 🔄 Gitea workflows 持续优化
|
||||
@@ -136,7 +139,7 @@
|
||||
- **本地路径**: `F:\openclaw-saas`
|
||||
- **远程仓库**: `xiaoxia-server:/var/lib/xiaoxia-ci/xiaoxia-saas.git`
|
||||
- **分支**: `main`
|
||||
- **最新提交**: `355dd0f feat: add project management module (tasks, milestones, issues)`
|
||||
- **最新提交**: `ef4cd8a feat: add GET task detail endpoint and use case`
|
||||
|
||||
---
|
||||
|
||||
|
||||
@@ -0,0 +1,147 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
|
||||
const API_BASE = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8000';
|
||||
|
||||
interface CreateIssueFormProps {
|
||||
taskId: string;
|
||||
projectId: string;
|
||||
workspaceId: string;
|
||||
onSuccess: () => void;
|
||||
onCancel: () => void;
|
||||
}
|
||||
|
||||
export default function CreateIssueForm({ taskId, projectId, workspaceId, onSuccess, onCancel }: CreateIssueFormProps) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState('');
|
||||
const [formData, setFormData] = useState({
|
||||
title: '',
|
||||
description: '',
|
||||
});
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
setError('');
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_BASE}/api/v1/project-management/issues`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
task_id: taskId,
|
||||
project_id: projectId,
|
||||
workspace_id: workspaceId,
|
||||
...formData,
|
||||
}),
|
||||
});
|
||||
|
||||
if (!res.ok) {
|
||||
const data = await res.json();
|
||||
throw new Error(data.detail || '创建失败');
|
||||
}
|
||||
|
||||
onSuccess();
|
||||
} catch (err: any) {
|
||||
setError(err.message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit} style={{
|
||||
background: 'var(--bg-white)',
|
||||
padding: '20px',
|
||||
borderRadius: '8px',
|
||||
border: '1px solid var(--border)',
|
||||
}}>
|
||||
{error && (
|
||||
<div style={{
|
||||
padding: '12px',
|
||||
background: '#FFECE8',
|
||||
border: '1px solid var(--error)',
|
||||
borderRadius: '4px',
|
||||
color: 'var(--error)',
|
||||
marginBottom: '16px',
|
||||
}}>
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div style={{ marginBottom: '12px' }}>
|
||||
<label style={{ display: 'block', marginBottom: '6px', fontWeight: '500' }}>
|
||||
问题标题 <span style={{ color: 'var(--error)' }}>*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
required
|
||||
value={formData.title}
|
||||
onChange={(e) => setFormData({ ...formData, title: e.target.value })}
|
||||
style={{
|
||||
width: '100%',
|
||||
padding: '8px 12px',
|
||||
border: '1px solid var(--border)',
|
||||
borderRadius: '4px',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
placeholder="简要描述问题"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: '16px' }}>
|
||||
<label style={{ display: 'block', marginBottom: '6px', fontWeight: '500' }}>
|
||||
详细描述
|
||||
</label>
|
||||
<textarea
|
||||
value={formData.description}
|
||||
onChange={(e) => setFormData({ ...formData, description: e.target.value })}
|
||||
rows={3}
|
||||
style={{
|
||||
width: '100%',
|
||||
padding: '8px 12px',
|
||||
border: '1px solid var(--border)',
|
||||
borderRadius: '4px',
|
||||
fontSize: '14px',
|
||||
resize: 'vertical',
|
||||
}}
|
||||
placeholder="详细说明问题情况"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style={{ display: 'flex', gap: '10px' }}>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '8px',
|
||||
borderRadius: '4px',
|
||||
border: 'none',
|
||||
background: loading ? '#ccc' : 'var(--primary)',
|
||||
color: 'white',
|
||||
fontWeight: 'bold',
|
||||
cursor: loading ? 'not-allowed' : 'pointer',
|
||||
}}
|
||||
>
|
||||
{loading ? '创建中...' : '创建问题'}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onCancel}
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: '8px',
|
||||
borderRadius: '4px',
|
||||
border: '1px solid var(--border)',
|
||||
background: 'white',
|
||||
cursor: 'pointer',
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
@@ -3,6 +3,7 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import CreateIssueForm from '../../components/CreateIssueForm';
|
||||
|
||||
interface Task {
|
||||
id: string;
|
||||
@@ -43,6 +44,7 @@ export default function TaskDetailPage() {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState('');
|
||||
const [updating, setUpdating] = useState(false);
|
||||
const [showIssueForm, setShowIssueForm] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
fetchTaskDetail();
|
||||
@@ -180,7 +182,39 @@ export default function TaskDetailPage() {
|
||||
|
||||
{/* 问题卡点列表 */}
|
||||
<div style={{ background: 'var(--bg-white)', padding: '24px', borderRadius: '8px' }}>
|
||||
<h2 style={{ fontSize: '18px', fontWeight: 'bold', marginBottom: '16px' }}>问题卡点 ({issues.length})</h2>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '16px' }}>
|
||||
<h2 style={{ fontSize: '18px', fontWeight: 'bold' }}>问题卡点 ({issues.length})</h2>
|
||||
<button
|
||||
onClick={() => setShowIssueForm(!showIssueForm)}
|
||||
style={{
|
||||
padding: '6px 12px',
|
||||
borderRadius: '4px',
|
||||
border: 'none',
|
||||
background: 'var(--primary)',
|
||||
color: 'white',
|
||||
cursor: 'pointer',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
>
|
||||
{showIssueForm ? '取消' : '+ 添加问题'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{showIssueForm && (
|
||||
<div style={{ marginBottom: '16px' }}>
|
||||
<CreateIssueForm
|
||||
taskId={taskId}
|
||||
projectId={task.project_id}
|
||||
workspaceId={task.workspace_id}
|
||||
onSuccess={() => {
|
||||
setShowIssueForm(false);
|
||||
fetchTaskIssues();
|
||||
}}
|
||||
onCancel={() => setShowIssueForm(false)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{issues.length === 0 ? (
|
||||
<p style={{ color: 'var(--text-secondary)' }}>暂无问题</p>
|
||||
) : (
|
||||
@@ -203,6 +237,23 @@ export default function TaskDetailPage() {
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
{!issue.resolved && (
|
||||
<button
|
||||
onClick={() => resolveIssue(issue.id)}
|
||||
disabled={updating}
|
||||
style={{
|
||||
padding: '4px 12px',
|
||||
borderRadius: '4px',
|
||||
border: '1px solid var(--success)',
|
||||
background: 'white',
|
||||
color: 'var(--success)',
|
||||
cursor: updating ? 'not-allowed' : 'pointer',
|
||||
fontSize: '12px',
|
||||
}}
|
||||
>
|
||||
标记已解决
|
||||
</button>
|
||||
)}
|
||||
<span style={{ fontSize: '12px', color: 'var(--text-secondary)' }}>
|
||||
{issue.resolved ? '已解决' : '未解决'}
|
||||
</span>
|
||||
|
||||
Reference in New Issue
Block a user