ethanfly/weekreport
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: ethanfly:main
Branches Tags
ethanfly:main
ethanfly:zs96
..
compare: ethanfly:zs96
Branches Tags
ethanfly:main
ethanfly:zs96

No commits in common. "main" and "zs96" have entirely different histories.
main ... zs96

2 changed files with 182 additions and 257 deletions
Show Stats Expand all files Collapse all files

36
app/Http/Controllers/WeekReportController.php
View File

@ -58,8 +58,7 @@ class WeekReportController extends Controller
$request->validate([ $request->validate([
'tasks' => 'required|array|min:1', 'tasks' => 'required|array|min:1',
'tasks.*.description' => 'required|string|max:2000', 'tasks.*.description' => 'required|string|max:2000',
'tasks.*.images' => 'nullable|array', // 支持多图 'tasks.*.image' => 'nullable|string',
'tasks.*.images.*' => 'nullable|string', // 每张图片路径
'week_start' => 'nullable|date', 'week_start' => 'nullable|date',
'week_end' => 'nullable|date', 'week_end' => 'nullable|date',
'author' => 'nullable|string|max:100', 'author' => 'nullable|string|max:100',
@ -107,10 +106,7 @@ class WeekReportController extends Controller
foreach ($tasks as $index => $task) { foreach ($tasks as $index => $task) {
$num = $index + 1; $num = $index + 1;
$desc = trim($task['description']); $desc = trim($task['description']);
// 支持多图：检查 images 数组 $hasImage = !empty($task['image']) ? '（有截图）' : '';
$images = $task['images'] ?? [];
$imageCount = count(array_filter($images));
$hasImage = $imageCount > 0 ? "（有{$imageCount}张截图）" : '';
$list[] = "{$num}. {$desc}{$hasImage}"; $list[] = "{$num}. {$desc}{$hasImage}";
} }
return implode("\n", $list); return implode("\n", $list);
@ -169,12 +165,10 @@ class WeekReportController extends Controller
4. 不要使用"高效完成"、"圆满完成"、"取得显著成效"等套话 4. 不要使用"高效完成"、"圆满完成"、"取得显著成效"等套话
5. 每个任务用简短的一两句话描述即可，说清楚做了什么 5. 每个任务用简短的一两句话描述即可，说清楚做了什么
6. 可以按项目或类型简单分组，但不要过度分类 6. 可以按项目或类型简单分组，但不要过度分类
7. 【重要】只有标注了"（有截图）"的任务才在该任务描述后紧接着添加"[图片占位符-任务X]"（X是原始任务序号），其他任务不要添加{$nextWeekRequirement} 7. 【重要】只有标注了"（有截图）"的任务才添加"[图片占位符-任务X]"，其他任务不要添加{$nextWeekRequirement}
9. 【重要】不要添加任何总结、小结、回顾等内容 9. 总结部分一两句话概括即可，不要写得太官方
10. 不要出现具体的完成时间、耗时等信息 10. 不要出现具体的完成时间、耗时等信息
11. 整体篇幅适中，不要太长 11. 整体篇幅适中，不要太长
12. 【重要】图片占位符的序号要与原始任务序号的序号一致，不要出现错位
直接输出周报内容： 直接输出周报内容：
PROMPT; PROMPT;
@ -230,11 +224,10 @@ PROMPT;
} }
/** /**
* 在报告中插入图片（支持多图） * 在报告中插入图片
*/ */
private function insertImagesToReport(string $report, array $tasks): string private function insertImagesToReport(string $report, array $tasks): string
{ {
// 首先尝试替换AI生成的占位符
foreach ($tasks as $index => $task) { foreach ($tasks as $index => $task) {
$num = $index + 1; $num = $index + 1;
@ -248,22 +241,11 @@ PROMPT;
"【图片占位符{$num}】", "【图片占位符{$num}】",
]; ];
// 获取该任务的所有图片 if (!empty($task['image'])) {
$images = $task['images'] ?? []; $imageUrl = asset('storage/' . $task['image']);
$validImages = array_filter($images); $imageMarkdown = "\n\n![任务{$num}截图]({$imageUrl})\n";
if (!empty($validImages)) {
// 构建多图Markdown
$imagesMarkdown = "\n\n";
foreach ($validImages as $imgIndex => $imagePath) {
$imageUrl = asset('storage/' . $imagePath);
$imgNum = $imgIndex + 1;
$imagesMarkdown .= "![任务{$num}-截图{$imgNum}]({$imageUrl})\n\n";
}
// 替换占位符
foreach ($placeholders as $placeholder) { foreach ($placeholders as $placeholder) {
$report = str_replace($placeholder, $imagesMarkdown, $report); $report = str_replace($placeholder, $imageMarkdown, $report);
} }
} else { } else {
// 没有图片时移除所有占位符 // 没有图片时移除所有占位符

371
resources/views/weekreport/index.blade.php
View File

@ -6,8 +6,8 @@
<meta name="csrf-token" content="{{ csrf_token() }}"> <meta name="csrf-token" content="{{ csrf_token() }}">
<title>智能周报生成器</title> <title>智能周报生成器</title>
<link href="https://cdn.bootcdn.net/ajax/libs/remixicon/3.5.0/remixicon.css" rel="stylesheet"> <link href="https://cdn.bootcdn.net/ajax/libs/remixicon/3.5.0/remixicon.css" rel="stylesheet">
<script src="https://unpkg.com/marked@9.1.6/marked.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/marked/9.1.6/marked.min.js"></script>
<script src="https://unpkg.com/html2pdf.js@0.10.1/dist/html2pdf.bundle.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
<style> <style>
:root { :root {
@ -353,32 +353,24 @@
display: none; display: none;
} }
.image-preview-list { .image-preview {
display: flex; position: relative;
flex-wrap: wrap;
gap: 10px;
margin-top: 10px; margin-top: 10px;
} }
.image-preview-item { .image-preview img {
position: relative; max-width: 100%;
display: inline-block; max-height: 150px;
}
.image-preview-item img {
max-width: 120px;
max-height: 100px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
border: 1px solid var(--border); border: 1px solid var(--border);
object-fit: cover;
} }
.image-preview-item .remove-image { .image-preview .remove-image {
position: absolute; position: absolute;
top: -8px; top: -8px;
right: -8px; right: -8px;
width: 22px; width: 24px;
height: 22px; height: 24px;
background: var(--danger); background: var(--danger);
border: none; border: none;
border-radius: 50%; border-radius: 50%;
@ -387,26 +379,14 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 0.8rem; font-size: 0.9rem;
transition: transform 0.2s ease; transition: transform 0.2s ease;
} }
.image-preview-item .remove-image:hover { .image-preview .remove-image:hover {
transform: scale(1.1); transform: scale(1.1);
} }
.image-count-badge {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 2px 8px;
background: var(--primary);
color: white;
border-radius: 10px;
font-size: 0.75rem;
margin-left: 8px;
}
/* 按钮样式 */ /* 按钮样式 */
.btn { .btn {
display: inline-flex; display: inline-flex;
@ -1160,8 +1140,8 @@
tasks.push({ tasks.push({
id: Date.now() + Math.random(), id: Date.now() + Math.random(),
description: task.description, description: task.description,
images: [], image: null,
imagePaths: [], imagePath: '',
zentaoId: task.id zentaoId: task.id
}); });
}); });
@ -1255,8 +1235,8 @@
tasks.push({ tasks.push({
id: taskId, id: taskId,
description: '', description: '',
images: [], // 支持多图 image: null,
imagePaths: [] // 对应的URL列表 imagePath: ''
}); });
renderTasks(); renderTasks();
updateTaskCount(); updateTaskCount();
@ -1280,35 +1260,11 @@
container.innerHTML = ''; container.innerHTML = '';
tasks.forEach((task, index) => { tasks.forEach((task, index) => {
// 生成多图预览HTML
let imagesPreviewHtml = '';
if (task.imagePaths && task.imagePaths.length > 0) {
imagesPreviewHtml = `
<div class="image-preview-list">
${task.imagePaths.map((url, imgIndex) => `
<div class="image-preview-item">
<img src="${url}" alt="截图${imgIndex + 1}">
<button class="remove-image" onclick="removeImage(${task.id}, ${imgIndex})">
<i class="ri-close-line"></i>
</button>
</div>
`).join('')}
</div>
`;
}
const imageCountBadge = task.imagePaths && task.imagePaths.length > 0
? `<span class="image-count-badge"><i class="ri-image-line"></i>${task.imagePaths.length}</span>`
: '';
const taskEl = document.createElement('div'); const taskEl = document.createElement('div');
taskEl.className = 'task-item'; taskEl.className = 'task-item';
taskEl.innerHTML = ` taskEl.innerHTML = `
<div class="task-header"> <div class="task-header">
<div style="display: flex; align-items: center;"> <span class="task-number">${index + 1}</span>
<span class="task-number">${index + 1}</span>
${imageCountBadge}
</div>
<button class="task-delete" onclick="deleteTask(${task.id})" title="删除任务"> <button class="task-delete" onclick="deleteTask(${task.id})" title="删除任务">
<i class="ri-delete-bin-line"></i> <i class="ri-delete-bin-line"></i>
</button> </button>
@ -1326,12 +1282,19 @@
ondragover="handleDragOver(event, this)" ondragover="handleDragOver(event, this)"
ondragleave="handleDragLeave(event, this)" ondragleave="handleDragLeave(event, this)"
ondrop="handleDrop(event, ${task.id}, this)"> ondrop="handleDrop(event, ${task.id}, this)">
<input type="file" id="image-input-${task.id}" accept="image/*" multiple <input type="file" id="image-input-${task.id}" accept="image/*"
onchange="handleImageSelect(${task.id}, this)" hidden> onchange="handleImageSelect(${task.id}, this)" hidden>
<i class="ri-image-add-line"></i> <i class="ri-image-add-line"></i>
<span>点击或拖拽上传任务截图（支持多张，可选）</span> <span>点击或拖拽上传任务截图（可选）</span>
</div> </div>
${imagesPreviewHtml} ${task.imagePath ? `
<div class="image-preview">
<img src="${task.imagePath}" alt="任务截图">
<button class="remove-image" onclick="removeImage(${task.id})">
<i class="ri-close-line"></i>
</button>
</div>
` : ''}
</div> </div>
`; `;
container.appendChild(taskEl); container.appendChild(taskEl);
@ -1360,76 +1323,56 @@
e.preventDefault(); e.preventDefault();
el.classList.remove('dragover'); el.classList.remove('dragover');
const files = e.dataTransfer.files; const files = e.dataTransfer.files;
// 支持拖拽多张图片 if (files.length > 0 && files[0].type.startsWith('image/')) {
const imageFiles = Array.from(files).filter(f => f.type.startsWith('image/')); uploadImage(taskId, files[0]);
if (imageFiles.length > 0) {
uploadImages(taskId, imageFiles);
} }
} }
// 选择图片（支持多选） // 选择图片
function handleImageSelect(taskId, input) { function handleImageSelect(taskId, input) {
if (input.files.length > 0) { if (input.files.length > 0) {
uploadImages(taskId, Array.from(input.files)); uploadImage(taskId, input.files[0]);
} }
} }
// 批量上传图片 // 上传图片
async function uploadImages(taskId, files) { async function uploadImage(taskId, file) {
const task = tasks.find(t => t.id === taskId); const formData = new FormData();
if (!task) return; formData.append('image', file);
// 初始化数组（兼容旧数据） try {
if (!task.images) task.images = []; const response = await fetch('/upload', {
if (!task.imagePaths) task.imagePaths = []; method: 'POST',
headers: {
'X-CSRF-TOKEN': csrfToken
},
body: formData
});
let successCount = 0; const data = await response.json();
let failCount = 0;
for (const file of files) { if (data.success) {
const formData = new FormData(); const task = tasks.find(t => t.id === taskId);
formData.append('image', file); if (task) {
task.image = data.path;
try { task.imagePath = data.url;
const response = await fetch('/upload', { renderTasks();
method: 'POST', showToast('图片上传成功', 'success');
headers: {
'X-CSRF-TOKEN': csrfToken
},
body: formData
});
const data = await response.json();
if (data.success) {
task.images.push(data.path);
task.imagePaths.push(data.url);
successCount++;
} else {
failCount++;
} }
} catch (error) { } else {
failCount++; showToast(data.message || '图片上传失败', 'error');
console.error('图片上传失败:', error);
} }
} } catch (error) {
showToast('图片上传失败: ' + error.message, 'error');
renderTasks();
if (successCount > 0) {
showToast(`成功上传 ${successCount} 张图片`, 'success');
}
if (failCount > 0) {
showToast(`${failCount} 张图片上传失败`, 'error');
} }
} }
// 移除指定索引的图片 // 移除图片
function removeImage(taskId, imageIndex) { function removeImage(taskId) {
const task = tasks.find(t => t.id === taskId); const task = tasks.find(t => t.id === taskId);
if (task && task.images && task.imagePaths) { if (task) {
task.images.splice(imageIndex, 1); task.image = null;
task.imagePaths.splice(imageIndex, 1); task.imagePath = '';
renderTasks(); renderTasks();
} }
} }
@ -1460,7 +1403,7 @@
body: JSON.stringify({ body: JSON.stringify({
tasks: validTasks.map(t => ({ tasks: validTasks.map(t => ({
description: t.description, description: t.description,
images: t.images || [] // 支持多图 image: t.image
})), })),
week_start: weekStart, week_start: weekStart,
week_end: weekEnd, week_end: weekEnd,
@ -1492,20 +1435,7 @@
document.getElementById('preview-placeholder').style.display = 'none'; document.getElementById('preview-placeholder').style.display = 'none';
const previewEl = document.getElementById('markdown-preview'); const previewEl = document.getElementById('markdown-preview');
previewEl.style.display = 'block'; previewEl.style.display = 'block';
previewEl.innerHTML = marked.parse(markdown);
// 检查 marked 是否可用
if (typeof marked !== 'undefined') {
previewEl.innerHTML = marked.parse(markdown);
} else {
// 简单的Markdown转换
previewEl.innerHTML = markdown
.replace(/^### (.*$)/gim, '<h3>$1</h3>')
.replace(/^## (.*$)/gim, '<h2>$1</h2>')
.replace(/^# (.*$)/gim, '<h1>$1</h1>')
.replace(/\*\*(.*)\*\*/gim, '<strong>$1</strong>')
.replace(/\*(.*)\*/gim, '<em>$1</em>')
.replace(/\n/gim, '<br>');
}
document.getElementById('download-buttons').style.display = 'flex'; document.getElementById('download-buttons').style.display = 'flex';
document.getElementById('copy-btn').disabled = false; document.getElementById('copy-btn').disabled = false;
@ -1587,90 +1517,103 @@
document.querySelector('.loading-text').textContent = '正在生成PDF...'; document.querySelector('.loading-text').textContent = '正在生成PDF...';
try { try {
// 转换Markdown为HTML // 创建临时容器用于PDF生成
let htmlContent = ''; const tempDiv = document.createElement('div');
if (typeof marked !== 'undefined') { tempDiv.id = 'pdf-content';
htmlContent = marked.parse(generatedReport); tempDiv.innerHTML = `
} else { <div class="pdf-wrapper">
htmlContent = generatedReport ${marked.parse(generatedReport)}
.replace(/^### (.*$)/gim, '<h3>$1</h3>') </div>
.replace(/^## (.*$)/gim, '<h2>$1</h2>') `;
.replace(/^# (.*$)/gim, '<h1>$1</h1>') tempDiv.style.cssText = `
.replace(/\*\*(.*)\*\*/gim, '<strong>$1</strong>') position: absolute;
.replace(/\*(.*)\*/gim, '<em>$1</em>') left: -9999px;
.replace(/\n/gim, '<br>'); top: 0;
} width: 210mm;
background: white;
font-family: "Microsoft YaHei", "SimHei", "PingFang SC", -apple-system, sans-serif;
font-size: 12pt;
line-height: 1.6;
color: #333;
`;
// 使用新窗口打印方式生成PDF // 添加内联样式
const printWindow = window.open('', '_blank'); const style = document.createElement('style');
printWindow.document.write(` style.textContent = `
<!DOCTYPE html> #pdf-content .pdf-wrapper {
<html> padding: 15mm 20mm;
<head> box-sizing: border-box;
<meta charset="UTF-8"> }
<title>周报_${document.getElementById('week-start').value}</title> #pdf-content h1 {
<style> font-size: 18pt;
@media print { color: #1a1a1a;
body { margin: 0; padding: 20mm; } border-bottom: 2px solid #4a90d9;
} padding-bottom: 8px;
body { margin: 0 0 15px 0;
font-family: "Microsoft YaHei", "SimHei", "PingFang SC", sans-serif; }
font-size: 12pt; #pdf-content h2 {
line-height: 1.8; font-size: 14pt;
color: #333; color: #2c3e50;
padding: 20mm; margin: 20px 0 10px 0;
max-width: 210mm; padding-left: 10px;
margin: 0 auto; border-left: 4px solid #4a90d9;
background: white; }
} #pdf-content h3 {
h1 { font-size: 12pt;
font-size: 18pt; color: #34495e;
color: #1a1a1a; margin: 15px 0 8px 0;
border-bottom: 2px solid #3b82f6; }
padding-bottom: 8px; #pdf-content p {
margin: 0 0 16px 0; margin: 0 0 10px 0;
} text-align: justify;
h2 { }
font-size: 14pt; #pdf-content ul, #pdf-content ol {
color: #1e40af; margin: 0 0 10px 20px;
margin: 20px 0 10px 0; padding: 0;
padding-left: 10px; }
border-left: 4px solid #3b82f6; #pdf-content li {
} margin-bottom: 5px;
h3 { }
font-size: 12pt; #pdf-content img {
color: #374151; max-width: 100%;
margin: 16px 0 8px 0; height: auto;
font-weight: 600; margin: 10px 0;
} border: 1px solid #ddd;
p { margin: 0 0 10px 0; } border-radius: 4px;
ul, ol { margin: 0 0 10px 20px; padding: 0; } }
li { margin-bottom: 5px; } #pdf-content strong {
strong { color: #1e40af; } color: #2c3e50;
img { max-width: 100%; height: auto; margin: 10px 0; } }
blockquote { #pdf-content blockquote {
margin: 10px 0; margin: 10px 0;
padding: 10px 15px; padding: 10px 15px;
border-left: 4px solid #3b82f6; border-left: 4px solid #4a90d9;
background: #f0f9ff; background: #f8f9fa;
} }
</style> `;
</head> tempDiv.prepend(style);
<body>
${htmlContent}
<script>
window.onload = function() {
setTimeout(function() {
window.print();
}, 300);
};
<\/script>
</body>
</html>
`);
printWindow.document.close();
showToast('请在打印对话框中选择"另存为PDF"', 'info'); document.body.appendChild(tempDiv);
const opt = {
margin: 0,
filename: `周报_${document.getElementById('week-start').value}.pdf`,
image: { type: 'jpeg', quality: 0.98 },
html2canvas: {
scale: 2,
useCORS: true,
logging: false,
width: tempDiv.querySelector('.pdf-wrapper').scrollWidth,
windowWidth: tempDiv.querySelector('.pdf-wrapper').scrollWidth
},
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' },
pagebreak: { mode: ['avoid-all', 'css', 'legacy'] }
};
await html2pdf().set(opt).from(tempDiv.querySelector('.pdf-wrapper')).save();
document.body.removeChild(tempDiv);
showToast('PDF 下载成功', 'success');
} catch (error) { } catch (error) {
showToast('下载失败: ' + error.message, 'error'); showToast('下载失败: ' + error.message, 'error');
console.error('PDF生成错误:', error); console.error('PDF生成错误:', error);