Add edit mode for patch list - auto-open edit for developers (level>=9 or id=395552)

This commit is contained in:
backuppc
2025-12-02 17:26:25 +09:00
parent db076d7135
commit 02e718fdb6

View File

@@ -1,5 +1,5 @@
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { FileText, Search, RefreshCw, Calendar, User } from 'lucide-react'; import { FileText, Search, RefreshCw, Calendar, User, Edit3 } from 'lucide-react';
import { comms } from '@/communication'; import { comms } from '@/communication';
import { BoardItem } from '@/types'; import { BoardItem } from '@/types';
@@ -9,11 +9,28 @@ export function PatchList() {
const [searchKey, setSearchKey] = useState(''); const [searchKey, setSearchKey] = useState('');
const [selectedItem, setSelectedItem] = useState<BoardItem | null>(null); const [selectedItem, setSelectedItem] = useState<BoardItem | null>(null);
const [showModal, setShowModal] = useState(false); const [showModal, setShowModal] = useState(false);
const [showEditModal, setShowEditModal] = useState(false);
const [editFormData, setEditFormData] = useState<BoardItem | null>(null);
const [userLevel, setUserLevel] = useState(0);
const [userId, setUserId] = useState('');
useEffect(() => { useEffect(() => {
loadUserInfo();
loadData(); loadData();
}, []); }, []);
const loadUserInfo = async () => {
try {
const response = await comms.checkLoginStatus();
if (response.Success && response.User) {
setUserLevel(response.User.Level);
setUserId(response.User.Id);
}
} catch (error) {
console.error('사용자 정보 로드 오류:', error);
}
};
const loadData = async () => { const loadData = async () => {
setLoading(true); setLoading(true);
try { try {
@@ -43,14 +60,42 @@ export function PatchList() {
const response = await comms.getBoardDetail(item.idx); const response = await comms.getBoardDetail(item.idx);
if (response.Success && response.Data) { if (response.Success && response.Data) {
setSelectedItem(response.Data); setSelectedItem(response.Data);
// 개발자(레벨 >= 9) 또는 사번 395552이면 바로 편집 모드
if (userLevel >= 9 || userId === '395552') {
setEditFormData(response.Data);
setShowEditModal(true);
} else {
setShowModal(true); setShowModal(true);
} }
}
} catch (error) { } catch (error) {
console.error('상세 조회 오류:', error); console.error('상세 조회 오류:', error);
alert('데이터를 불러오는 중 오류가 발생했습니다.'); alert('데이터를 불러오는 중 오류가 발생했습니다.');
} }
}; };
const handleEditClick = () => {
if (selectedItem) {
setEditFormData(selectedItem);
setShowModal(false);
setShowEditModal(true);
}
};
const handleEditSave = async () => {
if (!editFormData) return;
try {
// TODO: Board_Edit API 구현 필요
alert('게시판 수정 API가 아직 구현되지 않았습니다.');
console.log('수정할 데이터:', editFormData);
} catch (error) {
console.error('저장 오류:', error);
alert('저장 중 오류가 발생했습니다.');
}
};
const formatDate = (dateStr: string | null) => { const formatDate = (dateStr: string | null) => {
if (!dateStr) return '-'; if (!dateStr) return '-';
try { try {
@@ -203,7 +248,16 @@ export function PatchList() {
</div> </div>
</div> </div>
<div className="flex items-center justify-end px-6 py-4 border-t border-white/10 bg-white/5"> <div className="flex items-center justify-end gap-2 px-6 py-4 border-t border-white/10 bg-white/5">
{(userLevel >= 9 || userId === '395552') && (
<button
onClick={handleEditClick}
className="px-4 py-2 rounded-lg bg-primary-500 hover:bg-primary-600 text-white transition-colors flex items-center"
>
<Edit3 className="w-4 h-4 mr-2" />
</button>
)}
<button <button
onClick={() => setShowModal(false)} onClick={() => setShowModal(false)}
className="px-4 py-2 rounded-lg bg-white/10 hover:bg-white/20 text-white transition-colors" className="px-4 py-2 rounded-lg bg-white/10 hover:bg-white/20 text-white transition-colors"
@@ -214,6 +268,87 @@ export function PatchList() {
</div> </div>
</div> </div>
)} )}
{/* 편집 모달 */}
{showEditModal && editFormData && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50 backdrop-blur-sm">
<div className="bg-gray-900 rounded-2xl shadow-2xl w-full max-w-4xl max-h-[90vh] overflow-hidden border border-white/10">
<div className="flex items-center justify-between px-6 py-4 border-b border-white/10">
<h2 className="text-xl font-bold text-white flex items-center">
<Edit3 className="w-5 h-5 mr-2" />
</h2>
<button
onClick={() => setShowEditModal(false)}
className="text-white/50 hover:text-white transition-colors"
>
<span className="text-2xl">×</span>
</button>
</div>
<div className="overflow-y-auto max-h-[calc(90vh-180px)] p-6 space-y-4">
<div>
<label className="block text-white/70 text-sm font-medium mb-2"></label>
<input
type="text"
value={editFormData.header || ''}
onChange={(e) => setEditFormData({ ...editFormData, header: e.target.value })}
className="w-full h-10 bg-white/10 border border-white/30 rounded-lg px-3 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400"
placeholder="예: v2.0.0"
/>
</div>
<div>
<label className="block text-white/70 text-sm font-medium mb-2"></label>
<input
type="text"
value={editFormData.cate || ''}
onChange={(e) => setEditFormData({ ...editFormData, cate: e.target.value })}
className="w-full h-10 bg-white/10 border border-white/30 rounded-lg px-3 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400"
placeholder="예: 기능개선"
/>
</div>
<div>
<label className="block text-white/70 text-sm font-medium mb-2"></label>
<input
type="text"
value={editFormData.title || ''}
onChange={(e) => setEditFormData({ ...editFormData, title: e.target.value })}
className="w-full h-10 bg-white/10 border border-white/30 rounded-lg px-3 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400"
placeholder="패치 제목"
/>
</div>
<div>
<label className="block text-white/70 text-sm font-medium mb-2"></label>
<textarea
value={editFormData.contents || ''}
onChange={(e) => setEditFormData({ ...editFormData, contents: e.target.value })}
rows={15}
className="w-full bg-white/10 border border-white/30 rounded-lg px-3 py-2 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400 resize-none"
placeholder="패치 내용을 입력하세요..."
/>
</div>
</div>
<div className="flex items-center justify-end gap-2 px-6 py-4 border-t border-white/10 bg-white/5">
<button
onClick={() => setShowEditModal(false)}
className="px-4 py-2 rounded-lg bg-white/10 hover:bg-white/20 text-white transition-colors"
>
</button>
<button
onClick={handleEditSave}
className="px-4 py-2 rounded-lg bg-primary-500 hover:bg-primary-600 text-white transition-colors"
>
</button>
</div>
</div>
</div>
)}
</div> </div>
); );
} }