fix(tkqc): 사진 silent data loss 차단 + 관리함 사진 보충 기능
근본 원인: 2026-04-01 보안 패치(f09c86e)에서 system3-api Dockerfile에
USER appuser 추가했으나, named volume(tkqc-package_uploads)이 root 소유로
남아있어 appuser(999)가 /app/uploads 에 쓰기 실패. 하지만 file_service.py
가 except → return None 으로 silent failure 처리해서 system2는 200 OK 로
인식. 결과: 4/1 이후 qc_issues.id=185~191 사진이 전부 photo_path=NULL.
조치:
1. system3 Dockerfile: entrypoint.sh 추가 → 시작 시 chown 후 gosu appuser 강등
(named volume 이 restart 후에도 root로 돌아가는 문제 영구 해결)
2. file_service.py: save_base64_image 실패 시 RuntimeError raise (silent 금지)
3. system2 workIssueController: sendToMProject 실패/예외 시 system 알림 발송
4. 관리함 (desktop + mobile): 이슈 상세/편집 모달에 원본 사진 보충 UI 추가
- 빈 슬롯(photo_path{N}=NULL)에만 자동 채움, 기존 사진 유지
- ManagementUpdateRequest 스키마에 photo/photo2~5 필드 추가
- update_issue_management 엔드포인트에 사진 저장 루프 추가
런타임 chown 으로 immediate data loss 는 이미 차단됨 (09:28 KST).
이 커밋은 재발 방지 + 데이터 복구 UI 제공.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Hyungi Ahn
@@ -265,9 +265,59 @@ function openEditMgmtSheet(issueId) {
|
||||
document.getElementById('editResponsibleDept').value = issue.responsible_department || '';
|
||||
document.getElementById('editResponsiblePerson').value = issue.responsible_person || '';
|
||||
document.getElementById('editExpectedDate').value = issue.expected_completion_date ? issue.expected_completion_date.split('T')[0] : '';
|
||||
|
||||
// 원본 사진 보충 UI 초기화
|
||||
var slotKeys = ['photo_path', 'photo_path2', 'photo_path3', 'photo_path4', 'photo_path5'];
|
||||
var existingPhotos = slotKeys.map(function (k) { return issue[k]; }).filter(function (p) { return p; });
|
||||
var emptyCount = 5 - existingPhotos.length;
|
||||
|
||||
var existingEl = document.getElementById('editExistingPhotos');
|
||||
existingEl.innerHTML = existingPhotos.length
|
||||
? existingPhotos.map(function (p) {
|
||||
return '<img src="' + escapeHtml(p) + '" style="width:52px;height:52px;object-fit:cover;border-radius:6px;border:1px solid #d1d5db" alt="기존 사진">';
|
||||
}).join('')
|
||||
: '<span style="font-size:12px;color:#9ca3af">기존 사진 없음</span>';
|
||||
|
||||
var slotInfoEl = document.getElementById('editPhotoSlotInfo');
|
||||
slotInfoEl.textContent = emptyCount > 0 ? '(남은 슬롯: ' + emptyCount + '장)' : '(가득 참)';
|
||||
|
||||
var photoInput = document.getElementById('editPhotoInput');
|
||||
photoInput.value = '';
|
||||
photoInput.disabled = (emptyCount === 0);
|
||||
document.getElementById('editPhotoPreview').innerHTML = '';
|
||||
|
||||
openSheet('editMgmt');
|
||||
}
|
||||
|
||||
// 파일 input change 시 미리보기 렌더
|
||||
function previewEditPhotos(event) {
|
||||
var files = event.target.files;
|
||||
var preview = document.getElementById('editPhotoPreview');
|
||||
preview.innerHTML = '';
|
||||
if (!files || !files.length) return;
|
||||
|
||||
Array.prototype.forEach.call(files, function (file) {
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
var img = document.createElement('img');
|
||||
img.src = e.target.result;
|
||||
img.style.cssText = 'width:52px;height:52px;object-fit:cover;border-radius:6px;border:2px solid #10b981';
|
||||
img.alt = '추가 예정';
|
||||
preview.appendChild(img);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
});
|
||||
}
|
||||
|
||||
function fileToBase64(file) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) { resolve(e.target.result); };
|
||||
reader.onerror = reject;
|
||||
reader.readAsDataURL(file);
|
||||
});
|
||||
}
|
||||
|
||||
async function saveManagementEdit() {
|
||||
if (!currentIssueId) return;
|
||||
try {
|
||||
@@ -278,6 +328,34 @@ async function saveManagementEdit() {
|
||||
expected_completion_date: document.getElementById('editExpectedDate').value ? document.getElementById('editExpectedDate').value + 'T00:00:00' : null
|
||||
};
|
||||
|
||||
// 원본 사진 보충 — 빈 슬롯에만 채움
|
||||
var photoInput = document.getElementById('editPhotoInput');
|
||||
if (photoInput && photoInput.files && photoInput.files.length > 0) {
|
||||
var currentIssue = issues.find(function (i) { return i.id === currentIssueId; });
|
||||
if (currentIssue) {
|
||||
var slotKeys = ['photo_path', 'photo_path2', 'photo_path3', 'photo_path4', 'photo_path5'];
|
||||
var emptySlots = [];
|
||||
slotKeys.forEach(function (k, idx) { if (!currentIssue[k]) emptySlots.push(idx + 1); });
|
||||
|
||||
if (emptySlots.length === 0) {
|
||||
showToast('원본 사진 슬롯이 가득 찼습니다', 'warning');
|
||||
return;
|
||||
}
|
||||
|
||||
var filesToUpload = Array.prototype.slice.call(photoInput.files, 0, emptySlots.length);
|
||||
if (photoInput.files.length > emptySlots.length) {
|
||||
showToast('빈 슬롯 ' + emptySlots.length + '장 중 처음 ' + emptySlots.length + '장만 업로드됩니다', 'info');
|
||||
}
|
||||
|
||||
for (var i = 0; i < filesToUpload.length; i++) {
|
||||
var base64 = await fileToBase64(filesToUpload[i]);
|
||||
var slotNum = emptySlots[i];
|
||||
var fieldName = slotNum === 1 ? 'photo' : 'photo' + slotNum;
|
||||
updates[fieldName] = base64;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 프로젝트 변경 확인
|
||||
var newProjectId = parseInt(document.getElementById('editProject').value);
|
||||
var issue = issues.find(function (i) { return i.id === currentIssueId; });
|
||||
|
||||
@@ -1153,25 +1153,39 @@ function createModalContent(issue, project) {
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">업로드 사진</label>
|
||||
${(() => {
|
||||
const photos = [
|
||||
const photoSlots = [
|
||||
issue.photo_path,
|
||||
issue.photo_path2,
|
||||
issue.photo_path3,
|
||||
issue.photo_path4,
|
||||
issue.photo_path5
|
||||
].filter(p => p);
|
||||
];
|
||||
const filled = photoSlots.filter(p => p);
|
||||
const emptyCount = 5 - filled.length;
|
||||
|
||||
if (photos.length === 0) {
|
||||
return '<div class="w-20 h-20 bg-gray-200 rounded flex items-center justify-center text-gray-500 text-xs">없음</div>';
|
||||
}
|
||||
const existingHtml = filled.length === 0
|
||||
? '<div class="w-20 h-20 bg-gray-200 rounded flex items-center justify-center text-gray-500 text-xs">없음</div>'
|
||||
: `<div class="flex flex-wrap gap-2">
|
||||
${filled.map((path, idx) => `
|
||||
<img src="${path}" class="w-20 h-20 object-cover rounded cursor-pointer border-2 border-gray-300 hover:border-blue-400 transition-colors" onclick="openPhotoModal('${path}')" alt="업로드 사진 ${idx + 1}">
|
||||
`).join('')}
|
||||
</div>`;
|
||||
|
||||
return `
|
||||
<div class="flex flex-wrap gap-2">
|
||||
${photos.map((path, idx) => `
|
||||
<img src="${path}" class="w-20 h-20 object-cover rounded cursor-pointer border-2 border-gray-300 hover:border-blue-400 transition-colors" onclick="openPhotoModal('${path}')" alt="업로드 사진 ${idx + 1}">
|
||||
`).join('')}
|
||||
// 사진 보충 업로드 UI (빈 슬롯에만 채움)
|
||||
const uploadHtml = emptyCount > 0 ? `
|
||||
<div class="mt-3 pt-3 border-t border-gray-200">
|
||||
<label class="block text-xs font-medium text-gray-600 mb-1">
|
||||
<i class="fas fa-plus-circle text-blue-500 mr-1"></i>사진 보충 (남은 슬롯: ${emptyCount}장)
|
||||
</label>
|
||||
<input type="file" id="modal_original_photo" accept="image/*" multiple
|
||||
class="block w-full text-xs text-gray-500 file:mr-3 file:py-1.5 file:px-3 file:rounded-md file:border-0 file:text-xs file:font-semibold file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100">
|
||||
<p class="text-xs text-gray-400 mt-1">※ 비어있는 슬롯에만 자동으로 채워집니다 (기존 사진은 유지)</p>
|
||||
</div>
|
||||
` : `
|
||||
<p class="text-xs text-gray-400 mt-2"><i class="fas fa-info-circle mr-1"></i>5장 모두 찬 상태입니다</p>
|
||||
`;
|
||||
|
||||
return existingHtml + uploadHtml;
|
||||
})()}
|
||||
</div>
|
||||
</div>
|
||||
@@ -1294,6 +1308,37 @@ async function saveModalChanges() {
|
||||
|
||||
}
|
||||
|
||||
// 원본 사진 보충 처리 — 빈 슬롯에만 채움 (기존 사진 유지)
|
||||
const originalPhotoInput = document.getElementById('modal_original_photo');
|
||||
if (originalPhotoInput && originalPhotoInput.files && originalPhotoInput.files.length > 0) {
|
||||
const currentIssue = issues.find(i => i.id === currentModalIssueId);
|
||||
if (currentIssue) {
|
||||
// 빈 슬롯 번호 수집 (1~5)
|
||||
const slotKeys = ['photo_path', 'photo_path2', 'photo_path3', 'photo_path4', 'photo_path5'];
|
||||
const emptySlots = [];
|
||||
slotKeys.forEach((key, idx) => {
|
||||
if (!currentIssue[key]) emptySlots.push(idx + 1);
|
||||
});
|
||||
|
||||
if (emptySlots.length === 0) {
|
||||
alert('원본 사진 슬롯이 모두 찼습니다. 보충할 수 없습니다.');
|
||||
return;
|
||||
}
|
||||
|
||||
const files = Array.from(originalPhotoInput.files).slice(0, emptySlots.length);
|
||||
if (originalPhotoInput.files.length > emptySlots.length) {
|
||||
alert(`빈 슬롯은 ${emptySlots.length}개인데 ${originalPhotoInput.files.length}개를 선택하셨습니다. 처음 ${emptySlots.length}장만 업로드됩니다.`);
|
||||
}
|
||||
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
const slotNum = emptySlots[i];
|
||||
const base64 = await fileToBase64(files[i]);
|
||||
const fieldName = slotNum === 1 ? 'photo' : `photo${slotNum}`;
|
||||
updates[fieldName] = base64;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log('Modal sending updates:', updates);
|
||||
|
||||
// API 호출
|
||||
|
||||
Reference in New Issue
Block a user