Merge branch 'main' of http://39.117.244.52:3000/kjs/ERP-node into feature/dashboard

This commit is contained in:
dohyeons 2025-10-14 17:25:43 +09:00
commit bed23e256b
19 changed files with 2926 additions and 1 deletions

12
backend-node/.env.example Normal file
View File

@ -0,0 +1,12 @@
# ==================== 운영/작업 지원 위젯 데이터 소스 설정 ====================
# 옵션: file | database | memory
# - file: 파일 기반 (빠른 개발/테스트)
# - database: PostgreSQL DB (실제 운영)
# - memory: 메모리 목 데이터 (테스트)
TODO_DATA_SOURCE=file
BOOKING_DATA_SOURCE=file
MAINTENANCE_DATA_SOURCE=memory
DOCUMENT_DATA_SOURCE=memory

View File

@ -0,0 +1,35 @@
[
{
"id": "773568c7-0fc8-403d-ace2-01a11fae7189",
"customerName": "김철수",
"customerPhone": "010-1234-5678",
"pickupLocation": "서울시 강남구 역삼동 123",
"dropoffLocation": "경기도 성남시 분당구 정자동 456",
"scheduledTime": "2025-10-14T10:03:32.556Z",
"vehicleType": "truck",
"cargoType": "전자제품",
"weight": 500,
"status": "accepted",
"priority": "urgent",
"createdAt": "2025-10-14T08:03:32.556Z",
"updatedAt": "2025-10-14T08:06:45.073Z",
"estimatedCost": 150000,
"acceptedAt": "2025-10-14T08:06:45.073Z"
},
{
"id": "0751b297-18df-42c0-871c-85cded1f6dae",
"customerName": "이영희",
"customerPhone": "010-9876-5432",
"pickupLocation": "서울시 송파구 잠실동 789",
"dropoffLocation": "인천시 남동구 구월동 321",
"scheduledTime": "2025-10-14T12:03:32.556Z",
"vehicleType": "van",
"cargoType": "가구",
"weight": 300,
"status": "pending",
"priority": "normal",
"createdAt": "2025-10-14T07:53:32.556Z",
"updatedAt": "2025-10-14T07:53:32.556Z",
"estimatedCost": 80000
}
]

View File

@ -0,0 +1 @@
[]

View File

@ -52,6 +52,8 @@ import reportRoutes from "./routes/reportRoutes";
import openApiProxyRoutes from "./routes/openApiProxyRoutes"; // 날씨/환율 API
import deliveryRoutes from "./routes/deliveryRoutes"; // 배송/화물 관리
import riskAlertRoutes from "./routes/riskAlertRoutes"; // 리스크/알림 관리
import todoRoutes from "./routes/todoRoutes"; // To-Do 관리
import bookingRoutes from "./routes/bookingRoutes"; // 예약 요청 관리
import { BatchSchedulerService } from "./services/batchSchedulerService";
// import collectionRoutes from "./routes/collectionRoutes"; // 임시 주석
// import batchRoutes from "./routes/batchRoutes"; // 임시 주석
@ -198,6 +200,8 @@ app.use("/api/admin/reports", reportRoutes);
app.use("/api/open-api", openApiProxyRoutes); // 날씨/환율 외부 API
app.use("/api/delivery", deliveryRoutes); // 배송/화물 관리
app.use("/api/risk-alerts", riskAlertRoutes); // 리스크/알림 관리
app.use("/api/todos", todoRoutes); // To-Do 관리
app.use("/api/bookings", bookingRoutes); // 예약 요청 관리
// app.use("/api/collections", collectionRoutes); // 임시 주석
// app.use("/api/batch", batchRoutes); // 임시 주석
// app.use('/api/users', userRoutes);

View File

@ -0,0 +1,80 @@
import { Request, Response } from "express";
import { BookingService } from "../services/bookingService";
import { logger } from "../utils/logger";
const bookingService = BookingService.getInstance();
/**
*
*/
export const getBookings = async (req: Request, res: Response): Promise<void> => {
try {
const { status, priority } = req.query;
const result = await bookingService.getAllBookings({
status: status as string,
priority: priority as string,
});
res.status(200).json({
success: true,
data: result.bookings,
newCount: result.newCount,
});
} catch (error) {
logger.error("❌ 예약 목록 조회 실패:", error);
res.status(500).json({
success: false,
message: "예약 목록 조회에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
*
*/
export const acceptBooking = async (req: Request, res: Response): Promise<void> => {
try {
const { id } = req.params;
const booking = await bookingService.acceptBooking(id);
res.status(200).json({
success: true,
data: booking,
message: "예약이 수락되었습니다.",
});
} catch (error) {
logger.error("❌ 예약 수락 실패:", error);
res.status(500).json({
success: false,
message: "예약 수락에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
*
*/
export const rejectBooking = async (req: Request, res: Response): Promise<void> => {
try {
const { id } = req.params;
const { reason } = req.body;
const booking = await bookingService.rejectBooking(id, reason);
res.status(200).json({
success: true,
data: booking,
message: "예약이 거절되었습니다.",
});
} catch (error) {
logger.error("❌ 예약 거절 실패:", error);
res.status(500).json({
success: false,
message: "예약 거절에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};

View File

@ -0,0 +1,132 @@
import { Request, Response } from "express";
import { TodoService } from "../services/todoService";
import { logger } from "../utils/logger";
const todoService = TodoService.getInstance();
/**
* To-Do
*/
export const getTodos = async (req: Request, res: Response): Promise<void> => {
try {
const { status, priority, assignedTo } = req.query;
const result = await todoService.getAllTodos({
status: status as string,
priority: priority as string,
assignedTo: assignedTo as string,
});
res.status(200).json({
success: true,
data: result.todos,
stats: result.stats,
});
} catch (error) {
logger.error("❌ To-Do 목록 조회 실패:", error);
res.status(500).json({
success: false,
message: "To-Do 목록 조회에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
* To-Do
*/
export const createTodo = async (req: Request, res: Response): Promise<void> => {
try {
const newTodo = await todoService.createTodo(req.body);
res.status(201).json({
success: true,
data: newTodo,
message: "To-Do가 생성되었습니다.",
});
} catch (error) {
logger.error("❌ To-Do 생성 실패:", error);
res.status(500).json({
success: false,
message: "To-Do 생성에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
* To-Do
*/
export const updateTodo = async (req: Request, res: Response): Promise<void> => {
try {
const { id } = req.params;
const updatedTodo = await todoService.updateTodo(id, req.body);
res.status(200).json({
success: true,
data: updatedTodo,
message: "To-Do가 수정되었습니다.",
});
} catch (error) {
logger.error("❌ To-Do 수정 실패:", error);
res.status(500).json({
success: false,
message: "To-Do 수정에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
* To-Do
*/
export const deleteTodo = async (req: Request, res: Response): Promise<void> => {
try {
const { id } = req.params;
await todoService.deleteTodo(id);
res.status(200).json({
success: true,
message: "To-Do가 삭제되었습니다.",
});
} catch (error) {
logger.error("❌ To-Do 삭제 실패:", error);
res.status(500).json({
success: false,
message: "To-Do 삭제에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};
/**
* To-Do
*/
export const reorderTodos = async (req: Request, res: Response): Promise<void> => {
try {
const { todoIds } = req.body;
if (!Array.isArray(todoIds)) {
res.status(400).json({
success: false,
message: "todoIds는 배열이어야 합니다.",
});
return;
}
await todoService.reorderTodos(todoIds);
res.status(200).json({
success: true,
message: "To-Do 순서가 변경되었습니다.",
});
} catch (error) {
logger.error("❌ To-Do 순서 변경 실패:", error);
res.status(500).json({
success: false,
message: "To-Do 순서 변경에 실패했습니다.",
error: error instanceof Error ? error.message : String(error),
});
}
};

View File

@ -0,0 +1,20 @@
import { Router } from "express";
import * as bookingController from "../controllers/bookingController";
import { authenticateToken } from "../middleware/authMiddleware";
const router = Router();
// 모든 라우트에 인증 미들웨어 적용
router.use(authenticateToken);
// 예약 목록 조회
router.get("/", bookingController.getBookings);
// 예약 수락
router.post("/:id/accept", bookingController.acceptBooking);
// 예약 거절
router.post("/:id/reject", bookingController.rejectBooking);
export default router;

View File

@ -0,0 +1,26 @@
import { Router } from "express";
import * as todoController from "../controllers/todoController";
import { authenticateToken } from "../middleware/authMiddleware";
const router = Router();
// 모든 라우트에 인증 미들웨어 적용
router.use(authenticateToken);
// To-Do 목록 조회
router.get("/", todoController.getTodos);
// To-Do 생성
router.post("/", todoController.createTodo);
// To-Do 수정
router.put("/:id", todoController.updateTodo);
// To-Do 삭제
router.delete("/:id", todoController.deleteTodo);
// To-Do 순서 변경
router.post("/reorder", todoController.reorderTodos);
export default router;

View File

@ -0,0 +1,334 @@
import * as fs from "fs";
import * as path from "path";
import { v4 as uuidv4 } from "uuid";
import { logger } from "../utils/logger";
import { query } from "../database/db";
const BOOKING_DIR = path.join(__dirname, "../../data/bookings");
const BOOKING_FILE = path.join(BOOKING_DIR, "bookings.json");
// 환경 변수로 데이터 소스 선택
const DATA_SOURCE = process.env.BOOKING_DATA_SOURCE || "file";
export interface BookingRequest {
id: string;
customerName: string;
customerPhone: string;
pickupLocation: string;
dropoffLocation: string;
scheduledTime: string;
vehicleType: "truck" | "van" | "car";
cargoType?: string;
weight?: number;
status: "pending" | "accepted" | "rejected" | "completed";
priority: "normal" | "urgent";
createdAt: string;
updatedAt: string;
acceptedAt?: string;
rejectedAt?: string;
completedAt?: string;
notes?: string;
estimatedCost?: number;
}
/**
* (File/DB )
*/
export class BookingService {
private static instance: BookingService;
private constructor() {
if (DATA_SOURCE === "file") {
this.ensureDataDirectory();
this.generateMockData();
}
logger.info(`📋 예약 요청 데이터 소스: ${DATA_SOURCE.toUpperCase()}`);
}
public static getInstance(): BookingService {
if (!BookingService.instance) {
BookingService.instance = new BookingService();
}
return BookingService.instance;
}
private ensureDataDirectory(): void {
if (!fs.existsSync(BOOKING_DIR)) {
fs.mkdirSync(BOOKING_DIR, { recursive: true });
logger.info(`📁 예약 데이터 디렉토리 생성: ${BOOKING_DIR}`);
}
if (!fs.existsSync(BOOKING_FILE)) {
fs.writeFileSync(BOOKING_FILE, JSON.stringify([], null, 2));
logger.info(`📄 예약 파일 생성: ${BOOKING_FILE}`);
}
}
private generateMockData(): void {
const bookings = this.loadBookingsFromFile();
if (bookings.length > 0) return;
const mockBookings: BookingRequest[] = [
{
id: uuidv4(),
customerName: "김철수",
customerPhone: "010-1234-5678",
pickupLocation: "서울시 강남구 역삼동 123",
dropoffLocation: "경기도 성남시 분당구 정자동 456",
scheduledTime: new Date(Date.now() + 2 * 60 * 60 * 1000).toISOString(),
vehicleType: "truck",
cargoType: "전자제품",
weight: 500,
status: "pending",
priority: "urgent",
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
estimatedCost: 150000,
},
{
id: uuidv4(),
customerName: "이영희",
customerPhone: "010-9876-5432",
pickupLocation: "서울시 송파구 잠실동 789",
dropoffLocation: "인천시 남동구 구월동 321",
scheduledTime: new Date(Date.now() + 4 * 60 * 60 * 1000).toISOString(),
vehicleType: "van",
cargoType: "가구",
weight: 300,
status: "pending",
priority: "normal",
createdAt: new Date(Date.now() - 10 * 60 * 1000).toISOString(),
updatedAt: new Date(Date.now() - 10 * 60 * 1000).toISOString(),
estimatedCost: 80000,
},
];
this.saveBookingsToFile(mockBookings);
logger.info(`✅ 예약 목 데이터 생성: ${mockBookings.length}`);
}
public async getAllBookings(filter?: {
status?: string;
priority?: string;
}): Promise<{ bookings: BookingRequest[]; newCount: number }> {
try {
const bookings = DATA_SOURCE === "database"
? await this.loadBookingsFromDB(filter)
: this.loadBookingsFromFile(filter);
bookings.sort((a, b) => {
if (a.priority !== b.priority) return a.priority === "urgent" ? -1 : 1;
return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
});
const fiveMinutesAgo = new Date(Date.now() - 5 * 60 * 1000);
const newCount = bookings.filter(
(b) => b.status === "pending" && new Date(b.createdAt) > fiveMinutesAgo
).length;
return { bookings, newCount };
} catch (error) {
logger.error("❌ 예약 목록 조회 오류:", error);
throw error;
}
}
public async acceptBooking(id: string): Promise<BookingRequest> {
try {
if (DATA_SOURCE === "database") {
return await this.acceptBookingDB(id);
} else {
return this.acceptBookingFile(id);
}
} catch (error) {
logger.error("❌ 예약 수락 오류:", error);
throw error;
}
}
public async rejectBooking(id: string, reason?: string): Promise<BookingRequest> {
try {
if (DATA_SOURCE === "database") {
return await this.rejectBookingDB(id, reason);
} else {
return this.rejectBookingFile(id, reason);
}
} catch (error) {
logger.error("❌ 예약 거절 오류:", error);
throw error;
}
}
// ==================== DATABASE 메서드 ====================
private async loadBookingsFromDB(filter?: {
status?: string;
priority?: string;
}): Promise<BookingRequest[]> {
let sql = `
SELECT
id, customer_name as "customerName", customer_phone as "customerPhone",
pickup_location as "pickupLocation", dropoff_location as "dropoffLocation",
scheduled_time as "scheduledTime", vehicle_type as "vehicleType",
cargo_type as "cargoType", weight, status, priority,
created_at as "createdAt", updated_at as "updatedAt",
accepted_at as "acceptedAt", rejected_at as "rejectedAt",
completed_at as "completedAt", notes, estimated_cost as "estimatedCost"
FROM booking_requests
WHERE 1=1
`;
const params: any[] = [];
let paramIndex = 1;
if (filter?.status) {
sql += ` AND status = $${paramIndex++}`;
params.push(filter.status);
}
if (filter?.priority) {
sql += ` AND priority = $${paramIndex++}`;
params.push(filter.priority);
}
const rows = await query(sql, params);
return rows.map((row: any) => ({
...row,
scheduledTime: new Date(row.scheduledTime).toISOString(),
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
acceptedAt: row.acceptedAt ? new Date(row.acceptedAt).toISOString() : undefined,
rejectedAt: row.rejectedAt ? new Date(row.rejectedAt).toISOString() : undefined,
completedAt: row.completedAt ? new Date(row.completedAt).toISOString() : undefined,
}));
}
private async acceptBookingDB(id: string): Promise<BookingRequest> {
const rows = await query(
`UPDATE booking_requests
SET status = 'accepted', accepted_at = NOW(), updated_at = NOW()
WHERE id = $1
RETURNING
id, customer_name as "customerName", customer_phone as "customerPhone",
pickup_location as "pickupLocation", dropoff_location as "dropoffLocation",
scheduled_time as "scheduledTime", vehicle_type as "vehicleType",
cargo_type as "cargoType", weight, status, priority,
created_at as "createdAt", updated_at as "updatedAt",
accepted_at as "acceptedAt", notes, estimated_cost as "estimatedCost"`,
[id]
);
if (rows.length === 0) {
throw new Error(`예약을 찾을 수 없습니다: ${id}`);
}
const row = rows[0];
logger.info(`✅ 예약 수락: ${id} - ${row.customerName}`);
return {
...row,
scheduledTime: new Date(row.scheduledTime).toISOString(),
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
acceptedAt: new Date(row.acceptedAt).toISOString(),
};
}
private async rejectBookingDB(id: string, reason?: string): Promise<BookingRequest> {
const rows = await query(
`UPDATE booking_requests
SET status = 'rejected', rejected_at = NOW(), updated_at = NOW(), rejection_reason = $2
WHERE id = $1
RETURNING
id, customer_name as "customerName", customer_phone as "customerPhone",
pickup_location as "pickupLocation", dropoff_location as "dropoffLocation",
scheduled_time as "scheduledTime", vehicle_type as "vehicleType",
cargo_type as "cargoType", weight, status, priority,
created_at as "createdAt", updated_at as "updatedAt",
rejected_at as "rejectedAt", notes, estimated_cost as "estimatedCost"`,
[id, reason]
);
if (rows.length === 0) {
throw new Error(`예약을 찾을 수 없습니다: ${id}`);
}
const row = rows[0];
logger.info(`✅ 예약 거절: ${id} - ${row.customerName}`);
return {
...row,
scheduledTime: new Date(row.scheduledTime).toISOString(),
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
rejectedAt: new Date(row.rejectedAt).toISOString(),
};
}
// ==================== FILE 메서드 ====================
private loadBookingsFromFile(filter?: {
status?: string;
priority?: string;
}): BookingRequest[] {
try {
const data = fs.readFileSync(BOOKING_FILE, "utf-8");
let bookings: BookingRequest[] = JSON.parse(data);
if (filter?.status) {
bookings = bookings.filter((b) => b.status === filter.status);
}
if (filter?.priority) {
bookings = bookings.filter((b) => b.priority === filter.priority);
}
return bookings;
} catch (error) {
logger.error("❌ 예약 파일 로드 오류:", error);
return [];
}
}
private saveBookingsToFile(bookings: BookingRequest[]): void {
try {
fs.writeFileSync(BOOKING_FILE, JSON.stringify(bookings, null, 2));
} catch (error) {
logger.error("❌ 예약 파일 저장 오류:", error);
throw error;
}
}
private acceptBookingFile(id: string): BookingRequest {
const bookings = this.loadBookingsFromFile();
const booking = bookings.find((b) => b.id === id);
if (!booking) {
throw new Error(`예약을 찾을 수 없습니다: ${id}`);
}
booking.status = "accepted";
booking.acceptedAt = new Date().toISOString();
booking.updatedAt = new Date().toISOString();
this.saveBookingsToFile(bookings);
logger.info(`✅ 예약 수락: ${id} - ${booking.customerName}`);
return booking;
}
private rejectBookingFile(id: string, reason?: string): BookingRequest {
const bookings = this.loadBookingsFromFile();
const booking = bookings.find((b) => b.id === id);
if (!booking) {
throw new Error(`예약을 찾을 수 없습니다: ${id}`);
}
booking.status = "rejected";
booking.rejectedAt = new Date().toISOString();
booking.updatedAt = new Date().toISOString();
if (reason) {
booking.notes = reason;
}
this.saveBookingsToFile(bookings);
logger.info(`✅ 예약 거절: ${id} - ${booking.customerName}`);
return booking;
}
}

View File

@ -0,0 +1,282 @@
import { logger } from "../utils/logger";
import { query } from "../database/db";
// 환경 변수로 데이터 소스 선택
const DATA_SOURCE = process.env.DOCUMENT_DATA_SOURCE || "memory";
export interface Document {
id: string;
name: string;
category: "계약서" | "보험" | "세금계산서" | "기타";
fileSize: number;
filePath: string;
mimeType?: string;
uploadDate: string;
description?: string;
uploadedBy?: string;
relatedEntityType?: string;
relatedEntityId?: string;
tags?: string[];
isArchived: boolean;
archivedAt?: string;
}
// 메모리 목 데이터
const mockDocuments: Document[] = [
{
id: "doc-1",
name: "2025년 1월 세금계산서.pdf",
category: "세금계산서",
fileSize: 1258291,
filePath: "/uploads/documents/tax-invoice-202501.pdf",
uploadDate: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString(),
description: "1월 매출 세금계산서",
uploadedBy: "admin",
isArchived: false,
},
{
id: "doc-2",
name: "차량보험증권_서울12가3456.pdf",
category: "보험",
fileSize: 876544,
filePath: "/uploads/documents/insurance-vehicle-1.pdf",
uploadDate: new Date(Date.now() - 10 * 24 * 60 * 60 * 1000).toISOString(),
description: "1톤 트럭 종합보험",
uploadedBy: "admin",
isArchived: false,
},
{
id: "doc-3",
name: "운송계약서_ABC물류.pdf",
category: "계약서",
fileSize: 2457600,
filePath: "/uploads/documents/contract-abc-logistics.pdf",
uploadDate: new Date(Date.now() - 15 * 24 * 60 * 60 * 1000).toISOString(),
description: "ABC물류 연간 운송 계약",
uploadedBy: "admin",
isArchived: false,
},
{
id: "doc-4",
name: "2024년 12월 세금계산서.pdf",
category: "세금계산서",
fileSize: 1124353,
filePath: "/uploads/documents/tax-invoice-202412.pdf",
uploadDate: new Date(Date.now() - 40 * 24 * 60 * 60 * 1000).toISOString(),
uploadedBy: "admin",
isArchived: false,
},
{
id: "doc-5",
name: "화물배상책임보험증권.pdf",
category: "보험",
fileSize: 720384,
filePath: "/uploads/documents/cargo-insurance.pdf",
uploadDate: new Date(Date.now() - 50 * 24 * 60 * 60 * 1000).toISOString(),
description: "화물 배상책임보험",
uploadedBy: "admin",
isArchived: false,
},
{
id: "doc-6",
name: "차고지 임대계약서.pdf",
category: "계약서",
fileSize: 1843200,
filePath: "/uploads/documents/garage-lease-contract.pdf",
uploadDate: new Date(Date.now() - 60 * 24 * 60 * 60 * 1000).toISOString(),
uploadedBy: "admin",
isArchived: false,
},
];
/**
* (Memory/DB )
*/
export class DocumentService {
private static instance: DocumentService;
private constructor() {
logger.info(`📂 문서 관리 데이터 소스: ${DATA_SOURCE.toUpperCase()}`);
}
public static getInstance(): DocumentService {
if (!DocumentService.instance) {
DocumentService.instance = new DocumentService();
}
return DocumentService.instance;
}
public async getAllDocuments(filter?: {
category?: string;
searchTerm?: string;
uploadedBy?: string;
}): Promise<Document[]> {
try {
const documents = DATA_SOURCE === "database"
? await this.loadDocumentsFromDB(filter)
: this.loadDocumentsFromMemory(filter);
// 최신순 정렬
documents.sort((a, b) =>
new Date(b.uploadDate).getTime() - new Date(a.uploadDate).getTime()
);
return documents;
} catch (error) {
logger.error("❌ 문서 목록 조회 오류:", error);
throw error;
}
}
public async getDocumentById(id: string): Promise<Document> {
try {
if (DATA_SOURCE === "database") {
return await this.getDocumentByIdDB(id);
} else {
return this.getDocumentByIdMemory(id);
}
} catch (error) {
logger.error("❌ 문서 조회 오류:", error);
throw error;
}
}
public async getStatistics(): Promise<{
total: number;
byCategory: Record<string, number>;
totalSize: number;
}> {
try {
const documents = await this.getAllDocuments();
const byCategory: Record<string, number> = {
"계약서": 0,
"보험": 0,
"세금계산서": 0,
"기타": 0,
};
documents.forEach((doc) => {
byCategory[doc.category] = (byCategory[doc.category] || 0) + 1;
});
const totalSize = documents.reduce((sum, doc) => sum + doc.fileSize, 0);
return {
total: documents.length,
byCategory,
totalSize,
};
} catch (error) {
logger.error("❌ 문서 통계 조회 오류:", error);
throw error;
}
}
// ==================== DATABASE 메서드 ====================
private async loadDocumentsFromDB(filter?: {
category?: string;
searchTerm?: string;
uploadedBy?: string;
}): Promise<Document[]> {
let sql = `
SELECT
id, name, category, file_size as "fileSize", file_path as "filePath",
mime_type as "mimeType", upload_date as "uploadDate",
description, uploaded_by as "uploadedBy",
related_entity_type as "relatedEntityType",
related_entity_id as "relatedEntityId",
tags, is_archived as "isArchived", archived_at as "archivedAt"
FROM document_files
WHERE is_archived = false
`;
const params: any[] = [];
let paramIndex = 1;
if (filter?.category) {
sql += ` AND category = $${paramIndex++}`;
params.push(filter.category);
}
if (filter?.searchTerm) {
sql += ` AND (name ILIKE $${paramIndex} OR description ILIKE $${paramIndex})`;
params.push(`%${filter.searchTerm}%`);
paramIndex++;
}
if (filter?.uploadedBy) {
sql += ` AND uploaded_by = $${paramIndex++}`;
params.push(filter.uploadedBy);
}
const rows = await query(sql, params);
return rows.map((row: any) => ({
...row,
uploadDate: new Date(row.uploadDate).toISOString(),
archivedAt: row.archivedAt ? new Date(row.archivedAt).toISOString() : undefined,
}));
}
private async getDocumentByIdDB(id: string): Promise<Document> {
const rows = await query(
`SELECT
id, name, category, file_size as "fileSize", file_path as "filePath",
mime_type as "mimeType", upload_date as "uploadDate",
description, uploaded_by as "uploadedBy",
related_entity_type as "relatedEntityType",
related_entity_id as "relatedEntityId",
tags, is_archived as "isArchived", archived_at as "archivedAt"
FROM document_files
WHERE id = $1`,
[id]
);
if (rows.length === 0) {
throw new Error(`문서를 찾을 수 없습니다: ${id}`);
}
const row = rows[0];
return {
...row,
uploadDate: new Date(row.uploadDate).toISOString(),
archivedAt: row.archivedAt ? new Date(row.archivedAt).toISOString() : undefined,
};
}
// ==================== MEMORY 메서드 ====================
private loadDocumentsFromMemory(filter?: {
category?: string;
searchTerm?: string;
uploadedBy?: string;
}): Document[] {
let documents = mockDocuments.filter((d) => !d.isArchived);
if (filter?.category) {
documents = documents.filter((d) => d.category === filter.category);
}
if (filter?.searchTerm) {
const term = filter.searchTerm.toLowerCase();
documents = documents.filter(
(d) =>
d.name.toLowerCase().includes(term) ||
d.description?.toLowerCase().includes(term)
);
}
if (filter?.uploadedBy) {
documents = documents.filter((d) => d.uploadedBy === filter.uploadedBy);
}
return documents;
}
private getDocumentByIdMemory(id: string): Document {
const document = mockDocuments.find((d) => d.id === id);
if (!document) {
throw new Error(`문서를 찾을 수 없습니다: ${id}`);
}
return document;
}
}

View File

@ -0,0 +1,267 @@
import { logger } from "../utils/logger";
import { query } from "../database/db";
// 환경 변수로 데이터 소스 선택
const DATA_SOURCE = process.env.MAINTENANCE_DATA_SOURCE || "memory";
export interface MaintenanceSchedule {
id: string;
vehicleNumber: string;
vehicleType: string;
maintenanceType: "정기점검" | "수리" | "타이어교체" | "오일교환" | "기타";
scheduledDate: string;
status: "scheduled" | "in_progress" | "completed" | "overdue";
notes?: string;
estimatedCost?: number;
actualCost?: number;
createdAt: string;
updatedAt: string;
startedAt?: string;
completedAt?: string;
mechanicName?: string;
location?: string;
}
// 메모리 목 데이터
const mockSchedules: MaintenanceSchedule[] = [
{
id: "maint-1",
vehicleNumber: "서울12가3456",
vehicleType: "1톤 트럭",
maintenanceType: "정기점검",
scheduledDate: new Date(Date.now() + 2 * 24 * 60 * 60 * 1000).toISOString(),
status: "scheduled",
notes: "6개월 정기점검",
estimatedCost: 300000,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
location: "본사 정비소",
},
{
id: "maint-2",
vehicleNumber: "경기34나5678",
vehicleType: "2.5톤 트럭",
maintenanceType: "오일교환",
scheduledDate: new Date(Date.now() + 1 * 24 * 60 * 60 * 1000).toISOString(),
status: "scheduled",
estimatedCost: 150000,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
location: "본사 정비소",
},
{
id: "maint-3",
vehicleNumber: "인천56다7890",
vehicleType: "라보",
maintenanceType: "타이어교체",
scheduledDate: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),
status: "overdue",
notes: "긴급",
estimatedCost: 400000,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
location: "외부 정비소",
},
{
id: "maint-4",
vehicleNumber: "부산78라1234",
vehicleType: "1톤 트럭",
maintenanceType: "수리",
scheduledDate: new Date().toISOString(),
status: "in_progress",
notes: "엔진 점검 중",
estimatedCost: 800000,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
startedAt: new Date().toISOString(),
location: "본사 정비소",
},
];
/**
* (Memory/DB )
*/
export class MaintenanceService {
private static instance: MaintenanceService;
private constructor() {
logger.info(`🔧 정비 일정 데이터 소스: ${DATA_SOURCE.toUpperCase()}`);
}
public static getInstance(): MaintenanceService {
if (!MaintenanceService.instance) {
MaintenanceService.instance = new MaintenanceService();
}
return MaintenanceService.instance;
}
public async getAllSchedules(filter?: {
status?: string;
vehicleNumber?: string;
}): Promise<MaintenanceSchedule[]> {
try {
const schedules = DATA_SOURCE === "database"
? await this.loadSchedulesFromDB(filter)
: this.loadSchedulesFromMemory(filter);
// 자동으로 overdue 상태 업데이트
const now = new Date();
schedules.forEach((s) => {
if (s.status === "scheduled" && new Date(s.scheduledDate) < now) {
s.status = "overdue";
}
});
// 정렬: 지연 > 진행중 > 예정 > 완료
schedules.sort((a, b) => {
const statusOrder = { overdue: 0, in_progress: 1, scheduled: 2, completed: 3 };
if (a.status !== b.status) {
return statusOrder[a.status] - statusOrder[b.status];
}
return new Date(a.scheduledDate).getTime() - new Date(b.scheduledDate).getTime();
});
return schedules;
} catch (error) {
logger.error("❌ 정비 일정 조회 오류:", error);
throw error;
}
}
public async updateScheduleStatus(
id: string,
status: MaintenanceSchedule["status"]
): Promise<MaintenanceSchedule> {
try {
if (DATA_SOURCE === "database") {
return await this.updateScheduleStatusDB(id, status);
} else {
return this.updateScheduleStatusMemory(id, status);
}
} catch (error) {
logger.error("❌ 정비 상태 업데이트 오류:", error);
throw error;
}
}
// ==================== DATABASE 메서드 ====================
private async loadSchedulesFromDB(filter?: {
status?: string;
vehicleNumber?: string;
}): Promise<MaintenanceSchedule[]> {
let sql = `
SELECT
id, vehicle_number as "vehicleNumber", vehicle_type as "vehicleType",
maintenance_type as "maintenanceType", scheduled_date as "scheduledDate",
status, notes, estimated_cost as "estimatedCost", actual_cost as "actualCost",
created_at as "createdAt", updated_at as "updatedAt",
started_at as "startedAt", completed_at as "completedAt",
mechanic_name as "mechanicName", location
FROM maintenance_schedules
WHERE 1=1
`;
const params: any[] = [];
let paramIndex = 1;
if (filter?.status) {
sql += ` AND status = $${paramIndex++}`;
params.push(filter.status);
}
if (filter?.vehicleNumber) {
sql += ` AND vehicle_number = $${paramIndex++}`;
params.push(filter.vehicleNumber);
}
const rows = await query(sql, params);
return rows.map((row: any) => ({
...row,
scheduledDate: new Date(row.scheduledDate).toISOString(),
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
startedAt: row.startedAt ? new Date(row.startedAt).toISOString() : undefined,
completedAt: row.completedAt ? new Date(row.completedAt).toISOString() : undefined,
}));
}
private async updateScheduleStatusDB(
id: string,
status: MaintenanceSchedule["status"]
): Promise<MaintenanceSchedule> {
let additionalSet = "";
if (status === "in_progress") {
additionalSet = ", started_at = NOW()";
} else if (status === "completed") {
additionalSet = ", completed_at = NOW()";
}
const rows = await query(
`UPDATE maintenance_schedules
SET status = $1, updated_at = NOW() ${additionalSet}
WHERE id = $2
RETURNING
id, vehicle_number as "vehicleNumber", vehicle_type as "vehicleType",
maintenance_type as "maintenanceType", scheduled_date as "scheduledDate",
status, notes, estimated_cost as "estimatedCost",
created_at as "createdAt", updated_at as "updatedAt",
started_at as "startedAt", completed_at as "completedAt",
mechanic_name as "mechanicName", location`,
[status, id]
);
if (rows.length === 0) {
throw new Error(`정비 일정을 찾을 수 없습니다: ${id}`);
}
const row = rows[0];
return {
...row,
scheduledDate: new Date(row.scheduledDate).toISOString(),
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
startedAt: row.startedAt ? new Date(row.startedAt).toISOString() : undefined,
completedAt: row.completedAt ? new Date(row.completedAt).toISOString() : undefined,
};
}
// ==================== MEMORY 메서드 ====================
private loadSchedulesFromMemory(filter?: {
status?: string;
vehicleNumber?: string;
}): MaintenanceSchedule[] {
let schedules = [...mockSchedules];
if (filter?.status) {
schedules = schedules.filter((s) => s.status === filter.status);
}
if (filter?.vehicleNumber) {
schedules = schedules.filter((s) => s.vehicleNumber === filter.vehicleNumber);
}
return schedules;
}
private updateScheduleStatusMemory(
id: string,
status: MaintenanceSchedule["status"]
): MaintenanceSchedule {
const schedule = mockSchedules.find((s) => s.id === id);
if (!schedule) {
throw new Error(`정비 일정을 찾을 수 없습니다: ${id}`);
}
schedule.status = status;
schedule.updatedAt = new Date().toISOString();
if (status === "in_progress") {
schedule.startedAt = new Date().toISOString();
} else if (status === "completed") {
schedule.completedAt = new Date().toISOString();
}
return schedule;
}
}

View File

@ -0,0 +1,449 @@
import * as fs from "fs";
import * as path from "path";
import { v4 as uuidv4 } from "uuid";
import { logger } from "../utils/logger";
import { query } from "../database/db";
const TODO_DIR = path.join(__dirname, "../../data/todos");
const TODO_FILE = path.join(TODO_DIR, "todos.json");
// 환경 변수로 데이터 소스 선택 (file | database)
const DATA_SOURCE = process.env.TODO_DATA_SOURCE || "file";
export interface TodoItem {
id: string;
title: string;
description?: string;
priority: "urgent" | "high" | "normal" | "low";
status: "pending" | "in_progress" | "completed";
assignedTo?: string;
dueDate?: string;
createdAt: string;
updatedAt: string;
completedAt?: string;
isUrgent: boolean;
order: number;
}
export interface TodoListResponse {
todos: TodoItem[];
stats: {
total: number;
pending: number;
inProgress: number;
completed: number;
urgent: number;
overdue: number;
};
}
/**
* To-Do (File/DB )
*/
export class TodoService {
private static instance: TodoService;
private constructor() {
if (DATA_SOURCE === "file") {
this.ensureDataDirectory();
}
logger.info(`📋 To-Do 데이터 소스: ${DATA_SOURCE.toUpperCase()}`);
}
public static getInstance(): TodoService {
if (!TodoService.instance) {
TodoService.instance = new TodoService();
}
return TodoService.instance;
}
/**
* ( )
*/
private ensureDataDirectory(): void {
if (!fs.existsSync(TODO_DIR)) {
fs.mkdirSync(TODO_DIR, { recursive: true });
logger.info(`📁 To-Do 데이터 디렉토리 생성: ${TODO_DIR}`);
}
if (!fs.existsSync(TODO_FILE)) {
fs.writeFileSync(TODO_FILE, JSON.stringify([], null, 2));
logger.info(`📄 To-Do 파일 생성: ${TODO_FILE}`);
}
}
/**
* To-Do
*/
public async getAllTodos(filter?: {
status?: string;
priority?: string;
assignedTo?: string;
}): Promise<TodoListResponse> {
try {
const todos = DATA_SOURCE === "database"
? await this.loadTodosFromDB(filter)
: this.loadTodosFromFile(filter);
// 정렬: 긴급 > 우선순위 > 순서
todos.sort((a, b) => {
if (a.isUrgent !== b.isUrgent) return a.isUrgent ? -1 : 1;
const priorityOrder = { urgent: 0, high: 1, normal: 2, low: 3 };
if (a.priority !== b.priority) return priorityOrder[a.priority] - priorityOrder[b.priority];
return a.order - b.order;
});
const stats = this.calculateStats(todos);
return { todos, stats };
} catch (error) {
logger.error("❌ To-Do 목록 조회 오류:", error);
throw error;
}
}
/**
* To-Do
*/
public async createTodo(todoData: Partial<TodoItem>): Promise<TodoItem> {
try {
const newTodo: TodoItem = {
id: uuidv4(),
title: todoData.title || "",
description: todoData.description,
priority: todoData.priority || "normal",
status: "pending",
assignedTo: todoData.assignedTo,
dueDate: todoData.dueDate,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
isUrgent: todoData.isUrgent || false,
order: 0, // DB에서 자동 계산
};
if (DATA_SOURCE === "database") {
await this.createTodoDB(newTodo);
} else {
const todos = this.loadTodosFromFile();
newTodo.order = todos.length > 0 ? Math.max(...todos.map((t) => t.order)) + 1 : 0;
todos.push(newTodo);
this.saveTodosToFile(todos);
}
logger.info(`✅ To-Do 생성: ${newTodo.id} - ${newTodo.title}`);
return newTodo;
} catch (error) {
logger.error("❌ To-Do 생성 오류:", error);
throw error;
}
}
/**
* To-Do
*/
public async updateTodo(id: string, updates: Partial<TodoItem>): Promise<TodoItem> {
try {
if (DATA_SOURCE === "database") {
return await this.updateTodoDB(id, updates);
} else {
return this.updateTodoFile(id, updates);
}
} catch (error) {
logger.error("❌ To-Do 수정 오류:", error);
throw error;
}
}
/**
* To-Do
*/
public async deleteTodo(id: string): Promise<void> {
try {
if (DATA_SOURCE === "database") {
await this.deleteTodoDB(id);
} else {
this.deleteTodoFile(id);
}
logger.info(`✅ To-Do 삭제: ${id}`);
} catch (error) {
logger.error("❌ To-Do 삭제 오류:", error);
throw error;
}
}
/**
* To-Do
*/
public async reorderTodos(todoIds: string[]): Promise<void> {
try {
if (DATA_SOURCE === "database") {
await this.reorderTodosDB(todoIds);
} else {
this.reorderTodosFile(todoIds);
}
logger.info(`✅ To-Do 순서 변경: ${todoIds.length}개 항목`);
} catch (error) {
logger.error("❌ To-Do 순서 변경 오류:", error);
throw error;
}
}
// ==================== DATABASE 메서드 ====================
private async loadTodosFromDB(filter?: {
status?: string;
priority?: string;
assignedTo?: string;
}): Promise<TodoItem[]> {
let sql = `
SELECT
id, title, description, priority, status,
assigned_to as "assignedTo",
due_date as "dueDate",
created_at as "createdAt",
updated_at as "updatedAt",
completed_at as "completedAt",
is_urgent as "isUrgent",
display_order as "order"
FROM todo_items
WHERE 1=1
`;
const params: any[] = [];
let paramIndex = 1;
if (filter?.status) {
sql += ` AND status = $${paramIndex++}`;
params.push(filter.status);
}
if (filter?.priority) {
sql += ` AND priority = $${paramIndex++}`;
params.push(filter.priority);
}
if (filter?.assignedTo) {
sql += ` AND assigned_to = $${paramIndex++}`;
params.push(filter.assignedTo);
}
sql += ` ORDER BY display_order ASC`;
const rows = await query(sql, params);
return rows.map((row: any) => ({
...row,
dueDate: row.dueDate ? new Date(row.dueDate).toISOString() : undefined,
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
completedAt: row.completedAt ? new Date(row.completedAt).toISOString() : undefined,
}));
}
private async createTodoDB(todo: TodoItem): Promise<void> {
// 현재 최대 order 값 조회
const maxOrderRows = await query(
"SELECT COALESCE(MAX(display_order), -1) + 1 as next_order FROM todo_items"
);
const nextOrder = maxOrderRows[0].next_order;
await query(
`INSERT INTO todo_items (
id, title, description, priority, status, assigned_to, due_date,
created_at, updated_at, is_urgent, display_order
) VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11)`,
[
todo.id,
todo.title,
todo.description,
todo.priority,
todo.status,
todo.assignedTo,
todo.dueDate ? new Date(todo.dueDate) : null,
new Date(todo.createdAt),
new Date(todo.updatedAt),
todo.isUrgent,
nextOrder,
]
);
}
private async updateTodoDB(id: string, updates: Partial<TodoItem>): Promise<TodoItem> {
const setClauses: string[] = ["updated_at = NOW()"];
const params: any[] = [];
let paramIndex = 1;
if (updates.title !== undefined) {
setClauses.push(`title = $${paramIndex++}`);
params.push(updates.title);
}
if (updates.description !== undefined) {
setClauses.push(`description = $${paramIndex++}`);
params.push(updates.description);
}
if (updates.priority !== undefined) {
setClauses.push(`priority = $${paramIndex++}`);
params.push(updates.priority);
}
if (updates.status !== undefined) {
setClauses.push(`status = $${paramIndex++}`);
params.push(updates.status);
if (updates.status === "completed") {
setClauses.push(`completed_at = NOW()`);
}
}
if (updates.assignedTo !== undefined) {
setClauses.push(`assigned_to = $${paramIndex++}`);
params.push(updates.assignedTo);
}
if (updates.dueDate !== undefined) {
setClauses.push(`due_date = $${paramIndex++}`);
params.push(updates.dueDate ? new Date(updates.dueDate) : null);
}
if (updates.isUrgent !== undefined) {
setClauses.push(`is_urgent = $${paramIndex++}`);
params.push(updates.isUrgent);
}
params.push(id);
const sql = `
UPDATE todo_items
SET ${setClauses.join(", ")}
WHERE id = $${paramIndex}
RETURNING
id, title, description, priority, status,
assigned_to as "assignedTo",
due_date as "dueDate",
created_at as "createdAt",
updated_at as "updatedAt",
completed_at as "completedAt",
is_urgent as "isUrgent",
display_order as "order"
`;
const rows = await query(sql, params);
if (rows.length === 0) {
throw new Error(`To-Do 항목을 찾을 수 없습니다: ${id}`);
}
const row = rows[0];
return {
...row,
dueDate: row.dueDate ? new Date(row.dueDate).toISOString() : undefined,
createdAt: new Date(row.createdAt).toISOString(),
updatedAt: new Date(row.updatedAt).toISOString(),
completedAt: row.completedAt ? new Date(row.completedAt).toISOString() : undefined,
};
}
private async deleteTodoDB(id: string): Promise<void> {
const rows = await query("DELETE FROM todo_items WHERE id = $1 RETURNING id", [id]);
if (rows.length === 0) {
throw new Error(`To-Do 항목을 찾을 수 없습니다: ${id}`);
}
}
private async reorderTodosDB(todoIds: string[]): Promise<void> {
for (let i = 0; i < todoIds.length; i++) {
await query(
"UPDATE todo_items SET display_order = $1, updated_at = NOW() WHERE id = $2",
[i, todoIds[i]]
);
}
}
// ==================== FILE 메서드 ====================
private loadTodosFromFile(filter?: {
status?: string;
priority?: string;
assignedTo?: string;
}): TodoItem[] {
try {
const data = fs.readFileSync(TODO_FILE, "utf-8");
let todos: TodoItem[] = JSON.parse(data);
if (filter?.status) {
todos = todos.filter((t) => t.status === filter.status);
}
if (filter?.priority) {
todos = todos.filter((t) => t.priority === filter.priority);
}
if (filter?.assignedTo) {
todos = todos.filter((t) => t.assignedTo === filter.assignedTo);
}
return todos;
} catch (error) {
logger.error("❌ To-Do 파일 로드 오류:", error);
return [];
}
}
private saveTodosToFile(todos: TodoItem[]): void {
try {
fs.writeFileSync(TODO_FILE, JSON.stringify(todos, null, 2));
} catch (error) {
logger.error("❌ To-Do 파일 저장 오류:", error);
throw error;
}
}
private updateTodoFile(id: string, updates: Partial<TodoItem>): TodoItem {
const todos = this.loadTodosFromFile();
const index = todos.findIndex((t) => t.id === id);
if (index === -1) {
throw new Error(`To-Do 항목을 찾을 수 없습니다: ${id}`);
}
const updatedTodo: TodoItem = {
...todos[index],
...updates,
updatedAt: new Date().toISOString(),
};
if (updates.status === "completed" && todos[index].status !== "completed") {
updatedTodo.completedAt = new Date().toISOString();
}
todos[index] = updatedTodo;
this.saveTodosToFile(todos);
return updatedTodo;
}
private deleteTodoFile(id: string): void {
const todos = this.loadTodosFromFile();
const filteredTodos = todos.filter((t) => t.id !== id);
if (todos.length === filteredTodos.length) {
throw new Error(`To-Do 항목을 찾을 수 없습니다: ${id}`);
}
this.saveTodosToFile(filteredTodos);
}
private reorderTodosFile(todoIds: string[]): void {
const todos = this.loadTodosFromFile();
todoIds.forEach((id, index) => {
const todo = todos.find((t) => t.id === id);
if (todo) {
todo.order = index;
todo.updatedAt = new Date().toISOString();
}
});
this.saveTodosToFile(todos);
}
// ==================== 공통 메서드 ====================
private calculateStats(todos: TodoItem[]): TodoListResponse["stats"] {
const now = new Date();
return {
total: todos.length,
pending: todos.filter((t) => t.status === "pending").length,
inProgress: todos.filter((t) => t.status === "in_progress").length,
completed: todos.filter((t) => t.status === "completed").length,
urgent: todos.filter((t) => t.isUrgent).length,
overdue: todos.filter((t) => t.dueDate && new Date(t.dueDate) < now && t.status !== "completed").length,
};
}
}

View File

@ -37,6 +37,26 @@ const RiskAlertWidget = dynamic(() => import("@/components/dashboard/widgets/Ris
loading: () => <div className="flex h-full items-center justify-center text-sm text-gray-500"> ...</div>,
});
const TodoWidget = dynamic(() => import("@/components/dashboard/widgets/TodoWidget"), {
ssr: false,
loading: () => <div className="flex h-full items-center justify-center text-sm text-gray-500"> ...</div>,
});
const BookingAlertWidget = dynamic(() => import("@/components/dashboard/widgets/BookingAlertWidget"), {
ssr: false,
loading: () => <div className="flex h-full items-center justify-center text-sm text-gray-500"> ...</div>,
});
const MaintenanceWidget = dynamic(() => import("@/components/dashboard/widgets/MaintenanceWidget"), {
ssr: false,
loading: () => <div className="flex h-full items-center justify-center text-sm text-gray-500"> ...</div>,
});
const DocumentWidget = dynamic(() => import("@/components/dashboard/widgets/DocumentWidget"), {
ssr: false,
loading: () => <div className="flex h-full items-center justify-center text-sm text-gray-500"> ...</div>,
});
// 시계 위젯 임포트
import { ClockWidget } from "./widgets/ClockWidget";
// 달력 위젯 임포트
@ -488,6 +508,26 @@ export function CanvasElement({
}}
/>
</div>
) : element.type === "widget" && element.subtype === "todo" ? (
// To-Do 위젯 렌더링
<div className="widget-interactive-area h-full w-full">
<TodoWidget />
</div>
) : element.type === "widget" && element.subtype === "booking-alert" ? (
// 예약 요청 알림 위젯 렌더링
<div className="widget-interactive-area h-full w-full">
<BookingAlertWidget />
</div>
) : element.type === "widget" && element.subtype === "maintenance" ? (
// 정비 일정 위젯 렌더링
<div className="widget-interactive-area h-full w-full">
<MaintenanceWidget />
</div>
) : element.type === "widget" && element.subtype === "document" ? (
// 문서 다운로드 위젯 렌더링
<div className="widget-interactive-area h-full w-full">
<DocumentWidget />
</div>
) : (
// 기타 위젯 렌더링
<div

View File

@ -169,6 +169,46 @@ export function DashboardSidebar() {
/>
</div>
</div>
{/* 운영/작업 지원 섹션 */}
<div className="mb-8">
<h3 className="mb-4 border-b-2 border-green-500 pb-3 text-lg font-semibold text-gray-800">📋 / </h3>
<div className="space-y-3">
<DraggableItem
icon="✅"
title="To-Do / 긴급 지시"
type="widget"
subtype="todo"
onDragStart={handleDragStart}
className="border-l-4 border-blue-600"
/>
<DraggableItem
icon="🔔"
title="예약 요청 알림"
type="widget"
subtype="booking-alert"
onDragStart={handleDragStart}
className="border-l-4 border-rose-600"
/>
<DraggableItem
icon="🔧"
title="정비 일정 관리"
type="widget"
subtype="maintenance"
onDragStart={handleDragStart}
className="border-l-4 border-teal-600"
/>
<DraggableItem
icon="📂"
title="문서 다운로드"
type="widget"
subtype="document"
onDragStart={handleDragStart}
className="border-l-4 border-purple-600"
/>
</div>
</div>
</div>
);
}

View File

@ -21,7 +21,11 @@ export type ElementSubtype =
| "vehicle-map"
| "delivery-status"
| "risk-alert"
| "driver-management"; // 위젯 타입
| "driver-management"
| "todo"
| "booking-alert"
| "maintenance"
| "document"; // 위젯 타입
export interface Position {
x: number;

View File

@ -0,0 +1,308 @@
"use client";
import React, { useState, useEffect } from "react";
import { Check, X, Phone, MapPin, Package, Clock, AlertCircle } from "lucide-react";
interface BookingRequest {
id: string;
customerName: string;
customerPhone: string;
pickupLocation: string;
dropoffLocation: string;
scheduledTime: string;
vehicleType: "truck" | "van" | "car";
cargoType?: string;
weight?: number;
status: "pending" | "accepted" | "rejected" | "completed";
priority: "normal" | "urgent";
createdAt: string;
estimatedCost?: number;
}
export default function BookingAlertWidget() {
const [bookings, setBookings] = useState<BookingRequest[]>([]);
const [newCount, setNewCount] = useState(0);
const [loading, setLoading] = useState(true);
const [filter, setFilter] = useState<"all" | "pending" | "accepted">("pending");
const [showNotification, setShowNotification] = useState(false);
useEffect(() => {
fetchBookings();
const interval = setInterval(fetchBookings, 10000); // 10초마다 갱신
return () => clearInterval(interval);
}, [filter]);
const fetchBookings = async () => {
try {
const token = localStorage.getItem("authToken");
const filterParam = filter !== "all" ? `?status=${filter}` : "";
const response = await fetch(`http://localhost:9771/api/bookings${filterParam}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.ok) {
const result = await response.json();
const newBookings = result.data || [];
// 신규 예약이 있으면 알림 표시
if (result.newCount > 0 && newBookings.length > bookings.length) {
setShowNotification(true);
setTimeout(() => setShowNotification(false), 5000);
}
setBookings(newBookings);
setNewCount(result.newCount);
}
} catch (error) {
// console.error("예약 로딩 오류:", error);
} finally {
setLoading(false);
}
};
const handleAccept = async (id: string) => {
if (!confirm("이 예약을 수락하시겠습니까?")) return;
try {
const token = localStorage.getItem("authToken");
const response = await fetch(`http://localhost:9771/api/bookings/${id}/accept`, {
method: "POST",
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.ok) {
fetchBookings();
}
} catch (error) {
// console.error("예약 수락 오류:", error);
}
};
const handleReject = async (id: string) => {
const reason = prompt("거절 사유를 입력하세요:");
if (!reason) return;
try {
const token = localStorage.getItem("authToken");
const response = await fetch(`http://localhost:9771/api/bookings/${id}/reject`, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify({ reason }),
});
if (response.ok) {
fetchBookings();
}
} catch (error) {
// console.error("예약 거절 오류:", error);
}
};
const getVehicleIcon = (type: string) => {
switch (type) {
case "truck":
return "🚚";
case "van":
return "🚐";
case "car":
return "🚗";
default:
return "🚗";
}
};
const getTimeStatus = (scheduledTime: string) => {
const now = new Date();
const scheduled = new Date(scheduledTime);
const diff = scheduled.getTime() - now.getTime();
const hours = Math.floor(diff / (1000 * 60 * 60));
if (hours < 0) return { text: "⏰ 시간 초과", color: "text-red-600" };
if (hours < 2) return { text: `⏱️ ${hours}시간 후`, color: "text-red-600" };
if (hours < 4) return { text: `⏱️ ${hours}시간 후`, color: "text-orange-600" };
return { text: `📅 ${hours}시간 후`, color: "text-gray-600" };
};
const isNew = (createdAt: string) => {
const fiveMinutesAgo = new Date(Date.now() - 5 * 60 * 1000);
return new Date(createdAt) > fiveMinutesAgo;
};
if (loading) {
return (
<div className="flex h-full items-center justify-center">
<div className="text-gray-500"> ...</div>
</div>
);
}
return (
<div className="flex h-full flex-col bg-gradient-to-br from-slate-50 to-rose-50">
{/* 신규 알림 배너 */}
{showNotification && newCount > 0 && (
<div className="animate-pulse border-b border-rose-300 bg-rose-100 px-4 py-2 text-center">
<span className="font-bold text-rose-700">🔔 {newCount} !</span>
</div>
)}
{/* 헤더 */}
<div className="border-b border-gray-200 bg-white px-4 py-3">
<div className="mb-3 flex items-center justify-between">
<div className="flex items-center gap-2">
<h3 className="text-lg font-bold text-gray-800">🔔 </h3>
{newCount > 0 && (
<span className="flex h-6 w-6 items-center justify-center rounded-full bg-red-500 text-xs font-bold text-white">
{newCount}
</span>
)}
</div>
<button
onClick={fetchBookings}
className="rounded-lg bg-primary px-3 py-1.5 text-sm text-white transition-colors hover:bg-primary/90"
>
🔄
</button>
</div>
{/* 필터 */}
<div className="flex gap-2">
{(["pending", "accepted", "all"] as const).map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`rounded px-3 py-1 text-xs font-medium transition-colors ${
filter === f ? "bg-primary text-white" : "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
{f === "pending" ? "대기중" : f === "accepted" ? "수락됨" : "전체"}
</button>
))}
</div>
</div>
{/* 예약 리스트 */}
<div className="flex-1 overflow-y-auto p-4">
{bookings.length === 0 ? (
<div className="flex h-full items-center justify-center text-gray-400">
<div className="text-center">
<div className="mb-2 text-4xl">📭</div>
<div> </div>
</div>
</div>
) : (
<div className="space-y-3">
{bookings.map((booking) => (
<div
key={booking.id}
className={`group relative rounded-lg border-2 bg-white p-4 shadow-sm transition-all hover:shadow-md ${
booking.priority === "urgent" ? "border-red-400" : "border-gray-200"
} ${booking.status !== "pending" ? "opacity-60" : ""}`}
>
{/* NEW 뱃지 */}
{isNew(booking.createdAt) && booking.status === "pending" && (
<div className="absolute -right-2 -top-2 animate-bounce">
<span className="flex h-12 w-12 items-center justify-center rounded-full bg-red-500 text-xs font-bold text-white shadow-lg">
🆕
</span>
</div>
)}
{/* 우선순위 표시 */}
{booking.priority === "urgent" && (
<div className="mb-2 flex items-center gap-1 text-sm font-bold text-red-600">
<AlertCircle className="h-4 w-4" />
</div>
)}
{/* 고객 정보 */}
<div className="mb-3 flex items-start justify-between">
<div className="flex-1">
<div className="mb-1 flex items-center gap-2">
<span className="text-2xl">{getVehicleIcon(booking.vehicleType)}</span>
<div>
<div className="font-bold text-gray-800">{booking.customerName}</div>
<div className="flex items-center gap-1 text-xs text-gray-600">
<Phone className="h-3 w-3" />
{booking.customerPhone}
</div>
</div>
</div>
</div>
{booking.status === "pending" && (
<div className="flex gap-1">
<button
onClick={() => handleAccept(booking.id)}
className="flex items-center gap-1 rounded bg-green-500 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-green-600"
>
<Check className="h-4 w-4" />
</button>
<button
onClick={() => handleReject(booking.id)}
className="flex items-center gap-1 rounded bg-red-500 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-red-600"
>
<X className="h-4 w-4" />
</button>
</div>
)}
{booking.status === "accepted" && (
<span className="rounded bg-green-100 px-2 py-1 text-xs font-medium text-green-700">
</span>
)}
</div>
{/* 경로 정보 */}
<div className="mb-3 space-y-2 border-t border-gray-100 pt-3">
<div className="flex items-start gap-2 text-sm">
<MapPin className="mt-0.5 h-4 w-4 flex-shrink-0 text-blue-600" />
<div className="flex-1">
<div className="font-medium text-gray-700"></div>
<div className="text-gray-600">{booking.pickupLocation}</div>
</div>
</div>
<div className="flex items-start gap-2 text-sm">
<MapPin className="mt-0.5 h-4 w-4 flex-shrink-0 text-rose-600" />
<div className="flex-1">
<div className="font-medium text-gray-700"></div>
<div className="text-gray-600">{booking.dropoffLocation}</div>
</div>
</div>
</div>
{/* 상세 정보 */}
<div className="grid grid-cols-2 gap-2 text-xs">
<div className="flex items-center gap-1">
<Package className="h-3 w-3 text-gray-500" />
<span className="text-gray-600">
{booking.cargoType} ({booking.weight}kg)
</span>
</div>
<div className={`flex items-center gap-1 ${getTimeStatus(booking.scheduledTime).color}`}>
<Clock className="h-3 w-3" />
<span className="font-medium">{getTimeStatus(booking.scheduledTime).text}</span>
</div>
{booking.estimatedCost && (
<div className="col-span-2 font-bold text-primary">
: {booking.estimatedCost.toLocaleString()}
</div>
)}
</div>
</div>
))}
</div>
)}
</div>
</div>
);
}

View File

@ -0,0 +1,242 @@
"use client";
import React, { useState } from "react";
import { FileText, Download, Calendar, Folder, Search } from "lucide-react";
interface Document {
id: string;
name: string;
category: "계약서" | "보험" | "세금계산서" | "기타";
size: string;
uploadDate: string;
url: string;
description?: string;
}
// 목 데이터
const mockDocuments: Document[] = [
{
id: "1",
name: "2025년 1월 세금계산서.pdf",
category: "세금계산서",
size: "1.2 MB",
uploadDate: "2025-01-05",
url: "/documents/tax-invoice-202501.pdf",
description: "1월 매출 세금계산서",
},
{
id: "2",
name: "차량보험증권_서울12가3456.pdf",
category: "보험",
size: "856 KB",
uploadDate: "2024-12-20",
url: "/documents/insurance-vehicle-1.pdf",
description: "1톤 트럭 종합보험",
},
{
id: "3",
name: "운송계약서_ABC물류.pdf",
category: "계약서",
size: "2.4 MB",
uploadDate: "2024-12-15",
url: "/documents/contract-abc-logistics.pdf",
description: "ABC물류 연간 운송 계약",
},
{
id: "4",
name: "2024년 12월 세금계산서.pdf",
category: "세금계산서",
size: "1.1 MB",
uploadDate: "2024-12-05",
url: "/documents/tax-invoice-202412.pdf",
},
{
id: "5",
name: "화물배상책임보험증권.pdf",
category: "보험",
size: "720 KB",
uploadDate: "2024-11-30",
url: "/documents/cargo-insurance.pdf",
description: "화물 배상책임보험",
},
{
id: "6",
name: "차고지 임대계약서.pdf",
category: "계약서",
size: "1.8 MB",
uploadDate: "2024-11-15",
url: "/documents/garage-lease-contract.pdf",
},
];
export default function DocumentWidget() {
const [documents] = useState<Document[]>(mockDocuments);
const [filter, setFilter] = useState<"all" | Document["category"]>("all");
const [searchTerm, setSearchTerm] = useState("");
const filteredDocuments = documents.filter((doc) => {
const matchesFilter = filter === "all" || doc.category === filter;
const matchesSearch =
searchTerm === "" ||
doc.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
doc.description?.toLowerCase().includes(searchTerm.toLowerCase());
return matchesFilter && matchesSearch;
});
const getCategoryIcon = (category: Document["category"]) => {
switch (category) {
case "계약서":
return "📄";
case "보험":
return "🛡️";
case "세금계산서":
return "💰";
case "기타":
return "📁";
}
};
const getCategoryColor = (category: Document["category"]) => {
switch (category) {
case "계약서":
return "bg-blue-100 text-blue-700";
case "보험":
return "bg-green-100 text-green-700";
case "세금계산서":
return "bg-amber-100 text-amber-700";
case "기타":
return "bg-gray-100 text-gray-700";
}
};
const handleDownload = (doc: Document) => {
// 실제로는 백엔드 API 호출
alert(`다운로드: ${doc.name}\n(실제 구현 시 파일 다운로드 처리)`);
};
const stats = {
total: documents.length,
contract: documents.filter((d) => d.category === "계약서").length,
insurance: documents.filter((d) => d.category === "보험").length,
tax: documents.filter((d) => d.category === "세금계산서").length,
};
return (
<div className="flex h-full flex-col bg-gradient-to-br from-slate-50 to-blue-50">
{/* 헤더 */}
<div className="border-b border-gray-200 bg-white px-4 py-3">
<div className="mb-3 flex items-center justify-between">
<h3 className="text-lg font-bold text-gray-800">📂 </h3>
<button className="rounded-lg bg-primary px-3 py-1.5 text-sm text-white transition-colors hover:bg-primary/90">
+
</button>
</div>
{/* 통계 */}
<div className="mb-3 grid grid-cols-4 gap-2 text-xs">
<div className="rounded bg-gray-50 px-2 py-1.5 text-center">
<div className="font-bold text-gray-700">{stats.total}</div>
<div className="text-gray-600"></div>
</div>
<div className="rounded bg-blue-50 px-2 py-1.5 text-center">
<div className="font-bold text-blue-700">{stats.contract}</div>
<div className="text-blue-600"></div>
</div>
<div className="rounded bg-green-50 px-2 py-1.5 text-center">
<div className="font-bold text-green-700">{stats.insurance}</div>
<div className="text-green-600"></div>
</div>
<div className="rounded bg-amber-50 px-2 py-1.5 text-center">
<div className="font-bold text-amber-700">{stats.tax}</div>
<div className="text-amber-600"></div>
</div>
</div>
{/* 검색 */}
<div className="mb-3 relative">
<Search className="absolute left-3 top-2.5 h-4 w-4 text-gray-400" />
<input
type="text"
placeholder="문서명 검색..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="w-full rounded border border-gray-300 py-2 pl-10 pr-3 text-sm focus:border-primary focus:outline-none"
/>
</div>
{/* 필터 */}
<div className="flex gap-2">
{(["all", "계약서", "보험", "세금계산서", "기타"] as const).map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`rounded px-3 py-1 text-xs font-medium transition-colors ${
filter === f ? "bg-primary text-white" : "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
{f === "all" ? "전체" : f}
</button>
))}
</div>
</div>
{/* 문서 리스트 */}
<div className="flex-1 overflow-y-auto p-4">
{filteredDocuments.length === 0 ? (
<div className="flex h-full items-center justify-center text-gray-400">
<div className="text-center">
<div className="mb-2 text-4xl">📭</div>
<div> </div>
</div>
</div>
) : (
<div className="space-y-2">
{filteredDocuments.map((doc) => (
<div
key={doc.id}
className="group flex items-center gap-3 rounded-lg border border-gray-200 bg-white p-3 shadow-sm transition-all hover:border-primary hover:shadow-md"
>
{/* 아이콘 */}
<div className="flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-lg bg-gray-50 text-2xl">
{getCategoryIcon(doc.category)}
</div>
{/* 정보 */}
<div className="flex-1 min-w-0">
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">
<div className="truncate font-medium text-gray-800">{doc.name}</div>
{doc.description && (
<div className="mt-0.5 truncate text-xs text-gray-600">{doc.description}</div>
)}
<div className="mt-1 flex items-center gap-3 text-xs text-gray-500">
<span className={`rounded px-2 py-0.5 ${getCategoryColor(doc.category)}`}>
{doc.category}
</span>
<span className="flex items-center gap-1">
<Calendar className="h-3 w-3" />
{new Date(doc.uploadDate).toLocaleDateString()}
</span>
<span>{doc.size}</span>
</div>
</div>
</div>
</div>
{/* 다운로드 버튼 */}
<button
onClick={() => handleDownload(doc)}
className="flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg bg-primary text-white transition-colors hover:bg-primary/90"
title="다운로드"
>
<Download className="h-4 w-4" />
</button>
</div>
))}
</div>
)}
</div>
</div>
);
}

View File

@ -0,0 +1,244 @@
"use client";
import React, { useState } from "react";
import { Calendar, Wrench, Truck, Check, Clock, AlertTriangle } from "lucide-react";
interface MaintenanceSchedule {
id: string;
vehicleNumber: string;
vehicleType: string;
maintenanceType: "정기점검" | "수리" | "타이어교체" | "오일교환" | "기타";
scheduledDate: string;
status: "scheduled" | "in_progress" | "completed" | "overdue";
notes?: string;
estimatedCost?: number;
}
// 목 데이터
const mockSchedules: MaintenanceSchedule[] = [
{
id: "1",
vehicleNumber: "서울12가3456",
vehicleType: "1톤 트럭",
maintenanceType: "정기점검",
scheduledDate: new Date(Date.now() + 2 * 24 * 60 * 60 * 1000).toISOString(),
status: "scheduled",
notes: "6개월 정기점검",
estimatedCost: 300000,
},
{
id: "2",
vehicleNumber: "경기34나5678",
vehicleType: "2.5톤 트럭",
maintenanceType: "오일교환",
scheduledDate: new Date(Date.now() + 1 * 24 * 60 * 60 * 1000).toISOString(),
status: "scheduled",
estimatedCost: 150000,
},
{
id: "3",
vehicleNumber: "인천56다7890",
vehicleType: "라보",
maintenanceType: "타이어교체",
scheduledDate: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),
status: "overdue",
notes: "긴급",
estimatedCost: 400000,
},
{
id: "4",
vehicleNumber: "부산78라1234",
vehicleType: "1톤 트럭",
maintenanceType: "수리",
scheduledDate: new Date().toISOString(),
status: "in_progress",
notes: "엔진 점검 중",
estimatedCost: 800000,
},
];
export default function MaintenanceWidget() {
const [schedules] = useState<MaintenanceSchedule[]>(mockSchedules);
const [filter, setFilter] = useState<"all" | MaintenanceSchedule["status"]>("all");
const [selectedDate, setSelectedDate] = useState<Date>(new Date());
const filteredSchedules = schedules.filter(
(s) => filter === "all" || s.status === filter
);
const getStatusBadge = (status: MaintenanceSchedule["status"]) => {
switch (status) {
case "scheduled":
return <span className="rounded bg-blue-100 px-2 py-1 text-xs font-medium text-blue-700"></span>;
case "in_progress":
return <span className="rounded bg-amber-100 px-2 py-1 text-xs font-medium text-amber-700"></span>;
case "completed":
return <span className="rounded bg-green-100 px-2 py-1 text-xs font-medium text-green-700"></span>;
case "overdue":
return <span className="rounded bg-red-100 px-2 py-1 text-xs font-medium text-red-700"></span>;
}
};
const getMaintenanceIcon = (type: MaintenanceSchedule["maintenanceType"]) => {
switch (type) {
case "정기점검":
return "🔍";
case "수리":
return "🔧";
case "타이어교체":
return "⚙️";
case "오일교환":
return "🛢️";
default:
return "🔧";
}
};
const getDaysUntil = (date: string) => {
const now = new Date();
const scheduled = new Date(date);
const diff = scheduled.getTime() - now.getTime();
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
if (days < 0) return `${Math.abs(days)}일 지연`;
if (days === 0) return "오늘";
if (days === 1) return "내일";
return `${days}일 후`;
};
const stats = {
total: schedules.length,
scheduled: schedules.filter((s) => s.status === "scheduled").length,
inProgress: schedules.filter((s) => s.status === "in_progress").length,
overdue: schedules.filter((s) => s.status === "overdue").length,
};
return (
<div className="flex h-full flex-col bg-gradient-to-br from-slate-50 to-teal-50">
{/* 헤더 */}
<div className="border-b border-gray-200 bg-white px-4 py-3">
<div className="mb-3 flex items-center justify-between">
<h3 className="text-lg font-bold text-gray-800">🔧 </h3>
<button className="rounded-lg bg-primary px-3 py-1.5 text-sm text-white transition-colors hover:bg-primary/90">
+
</button>
</div>
{/* 통계 */}
<div className="mb-3 grid grid-cols-4 gap-2 text-xs">
<div className="rounded bg-blue-50 px-2 py-1.5 text-center">
<div className="font-bold text-blue-700">{stats.scheduled}</div>
<div className="text-blue-600"></div>
</div>
<div className="rounded bg-amber-50 px-2 py-1.5 text-center">
<div className="font-bold text-amber-700">{stats.inProgress}</div>
<div className="text-amber-600"></div>
</div>
<div className="rounded bg-red-50 px-2 py-1.5 text-center">
<div className="font-bold text-red-700">{stats.overdue}</div>
<div className="text-red-600"></div>
</div>
<div className="rounded bg-gray-50 px-2 py-1.5 text-center">
<div className="font-bold text-gray-700">{stats.total}</div>
<div className="text-gray-600"></div>
</div>
</div>
{/* 필터 */}
<div className="flex gap-2">
{(["all", "scheduled", "in_progress", "overdue"] as const).map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`rounded px-3 py-1 text-xs font-medium transition-colors ${
filter === f ? "bg-primary text-white" : "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
{f === "all" ? "전체" : f === "scheduled" ? "예정" : f === "in_progress" ? "진행중" : "지연"}
</button>
))}
</div>
</div>
{/* 일정 리스트 */}
<div className="flex-1 overflow-y-auto p-4">
{filteredSchedules.length === 0 ? (
<div className="flex h-full items-center justify-center text-gray-400">
<div className="text-center">
<div className="mb-2 text-4xl">📅</div>
<div> </div>
</div>
</div>
) : (
<div className="space-y-3">
{filteredSchedules.map((schedule) => (
<div
key={schedule.id}
className={`group rounded-lg border-2 bg-white p-4 shadow-sm transition-all hover:shadow-md ${
schedule.status === "overdue" ? "border-red-300" : "border-gray-200"
}`}
>
<div className="mb-2 flex items-start justify-between">
<div className="flex items-center gap-2">
<span className="text-2xl">{getMaintenanceIcon(schedule.maintenanceType)}</span>
<div>
<div className="font-bold text-gray-800">{schedule.vehicleNumber}</div>
<div className="text-xs text-gray-600">{schedule.vehicleType}</div>
</div>
</div>
{getStatusBadge(schedule.status)}
</div>
<div className="mb-3 rounded bg-gray-50 p-2">
<div className="text-sm font-medium text-gray-700">{schedule.maintenanceType}</div>
{schedule.notes && <div className="mt-1 text-xs text-gray-600">{schedule.notes}</div>}
</div>
<div className="grid grid-cols-2 gap-2 text-xs">
<div className="flex items-center gap-1 text-gray-600">
<Calendar className="h-3 w-3" />
{new Date(schedule.scheduledDate).toLocaleDateString()}
</div>
<div
className={`flex items-center gap-1 font-medium ${
schedule.status === "overdue" ? "text-red-600" : "text-blue-600"
}`}
>
<Clock className="h-3 w-3" />
{getDaysUntil(schedule.scheduledDate)}
</div>
{schedule.estimatedCost && (
<div className="col-span-2 font-bold text-primary">
: {schedule.estimatedCost.toLocaleString()}
</div>
)}
</div>
{/* 액션 버튼 */}
{schedule.status === "scheduled" && (
<div className="mt-3 flex gap-2">
<button className="flex-1 rounded bg-blue-500 px-3 py-1.5 text-xs font-medium text-white hover:bg-blue-600">
</button>
<button className="flex-1 rounded bg-gray-200 px-3 py-1.5 text-xs font-medium text-gray-700 hover:bg-gray-300">
</button>
</div>
)}
{schedule.status === "in_progress" && (
<div className="mt-3">
<button className="w-full rounded bg-green-500 px-3 py-1.5 text-xs font-medium text-white hover:bg-green-600">
<Check className="mr-1 inline h-3 w-3" />
</button>
</div>
)}
</div>
))}
</div>
)}
</div>
</div>
);
}

View File

@ -0,0 +1,405 @@
"use client";
import React, { useState, useEffect } from "react";
import { Plus, Check, X, Clock, AlertCircle, GripVertical, ChevronDown } from "lucide-react";
interface TodoItem {
id: string;
title: string;
description?: string;
priority: "urgent" | "high" | "normal" | "low";
status: "pending" | "in_progress" | "completed";
assignedTo?: string;
dueDate?: string;
createdAt: string;
updatedAt: string;
completedAt?: string;
isUrgent: boolean;
order: number;
}
interface TodoStats {
total: number;
pending: number;
inProgress: number;
completed: number;
urgent: number;
overdue: number;
}
export default function TodoWidget() {
const [todos, setTodos] = useState<TodoItem[]>([]);
const [stats, setStats] = useState<TodoStats | null>(null);
const [loading, setLoading] = useState(true);
const [filter, setFilter] = useState<"all" | "pending" | "in_progress" | "completed">("all");
const [showAddForm, setShowAddForm] = useState(false);
const [newTodo, setNewTodo] = useState({
title: "",
description: "",
priority: "normal" as TodoItem["priority"],
isUrgent: false,
dueDate: "",
assignedTo: "",
});
useEffect(() => {
fetchTodos();
const interval = setInterval(fetchTodos, 30000); // 30초마다 갱신
return () => clearInterval(interval);
}, [filter]);
const fetchTodos = async () => {
try {
const token = localStorage.getItem("authToken");
const filterParam = filter !== "all" ? `?status=${filter}` : "";
const response = await fetch(`http://localhost:9771/api/todos${filterParam}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.ok) {
const result = await response.json();
setTodos(result.data || []);
setStats(result.stats);
}
} catch (error) {
// console.error("To-Do 로딩 오류:", error);
} finally {
setLoading(false);
}
};
const handleAddTodo = async () => {
if (!newTodo.title.trim()) return;
try {
const token = localStorage.getItem("authToken");
const response = await fetch("http://localhost:9771/api/todos", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify(newTodo),
});
if (response.ok) {
setNewTodo({
title: "",
description: "",
priority: "normal",
isUrgent: false,
dueDate: "",
assignedTo: "",
});
setShowAddForm(false);
fetchTodos();
}
} catch (error) {
// console.error("To-Do 추가 오류:", error);
}
};
const handleUpdateStatus = async (id: string, status: TodoItem["status"]) => {
try {
const token = localStorage.getItem("authToken");
const response = await fetch(`http://localhost:9771/api/todos/${id}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify({ status }),
});
if (response.ok) {
fetchTodos();
}
} catch (error) {
// console.error("상태 업데이트 오류:", error);
}
};
const handleDelete = async (id: string) => {
if (!confirm("이 To-Do를 삭제하시겠습니까?")) return;
try {
const token = localStorage.getItem("authToken");
const response = await fetch(`http://localhost:9771/api/todos/${id}`, {
method: "DELETE",
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.ok) {
fetchTodos();
}
} catch (error) {
// console.error("To-Do 삭제 오류:", error);
}
};
const getPriorityColor = (priority: TodoItem["priority"]) => {
switch (priority) {
case "urgent":
return "bg-red-100 text-red-700 border-red-300";
case "high":
return "bg-orange-100 text-orange-700 border-orange-300";
case "normal":
return "bg-blue-100 text-blue-700 border-blue-300";
case "low":
return "bg-gray-100 text-gray-700 border-gray-300";
}
};
const getPriorityIcon = (priority: TodoItem["priority"]) => {
switch (priority) {
case "urgent":
return "🔴";
case "high":
return "🟠";
case "normal":
return "🟡";
case "low":
return "🟢";
}
};
const getTimeRemaining = (dueDate: string) => {
const now = new Date();
const due = new Date(dueDate);
const diff = due.getTime() - now.getTime();
const hours = Math.floor(diff / (1000 * 60 * 60));
const days = Math.floor(hours / 24);
if (diff < 0) return "⏰ 기한 초과";
if (days > 0) return `📅 ${days}일 남음`;
if (hours > 0) return `⏱️ ${hours}시간 남음`;
return "⚠️ 오늘 마감";
};
if (loading) {
return (
<div className="flex h-full items-center justify-center">
<div className="text-gray-500"> ...</div>
</div>
);
}
return (
<div className="flex h-full flex-col bg-gradient-to-br from-slate-50 to-blue-50">
{/* 헤더 */}
<div className="border-b border-gray-200 bg-white px-4 py-3">
<div className="mb-3 flex items-center justify-between">
<h3 className="text-lg font-bold text-gray-800"> To-Do / </h3>
<button
onClick={() => setShowAddForm(!showAddForm)}
className="flex items-center gap-1 rounded-lg bg-primary px-3 py-1.5 text-sm text-white transition-colors hover:bg-primary/90"
>
<Plus className="h-4 w-4" />
</button>
</div>
{/* 통계 */}
{stats && (
<div className="grid grid-cols-4 gap-2 text-xs">
<div className="rounded bg-blue-50 px-2 py-1.5 text-center">
<div className="font-bold text-blue-700">{stats.pending}</div>
<div className="text-blue-600"></div>
</div>
<div className="rounded bg-amber-50 px-2 py-1.5 text-center">
<div className="font-bold text-amber-700">{stats.inProgress}</div>
<div className="text-amber-600"></div>
</div>
<div className="rounded bg-red-50 px-2 py-1.5 text-center">
<div className="font-bold text-red-700">{stats.urgent}</div>
<div className="text-red-600"></div>
</div>
<div className="rounded bg-rose-50 px-2 py-1.5 text-center">
<div className="font-bold text-rose-700">{stats.overdue}</div>
<div className="text-rose-600"></div>
</div>
</div>
)}
{/* 필터 */}
<div className="mt-3 flex gap-2">
{(["all", "pending", "in_progress", "completed"] as const).map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`rounded px-3 py-1 text-xs font-medium transition-colors ${
filter === f
? "bg-primary text-white"
: "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
{f === "all" ? "전체" : f === "pending" ? "대기" : f === "in_progress" ? "진행중" : "완료"}
</button>
))}
</div>
</div>
{/* 추가 폼 */}
{showAddForm && (
<div className="border-b border-gray-200 bg-white p-4">
<div className="space-y-2">
<input
type="text"
placeholder="할 일 제목*"
value={newTodo.title}
onChange={(e) => setNewTodo({ ...newTodo, title: e.target.value })}
className="w-full rounded border border-gray-300 px-3 py-2 text-sm focus:border-primary focus:outline-none"
/>
<textarea
placeholder="상세 설명 (선택)"
value={newTodo.description}
onChange={(e) => setNewTodo({ ...newTodo, description: e.target.value })}
className="w-full rounded border border-gray-300 px-3 py-2 text-sm focus:border-primary focus:outline-none"
rows={2}
/>
<div className="grid grid-cols-2 gap-2">
<select
value={newTodo.priority}
onChange={(e) => setNewTodo({ ...newTodo, priority: e.target.value as TodoItem["priority"] })}
className="rounded border border-gray-300 px-3 py-2 text-sm focus:border-primary focus:outline-none"
>
<option value="low">🟢 </option>
<option value="normal">🟡 </option>
<option value="high">🟠 </option>
<option value="urgent">🔴 </option>
</select>
<input
type="datetime-local"
value={newTodo.dueDate}
onChange={(e) => setNewTodo({ ...newTodo, dueDate: e.target.value })}
className="rounded border border-gray-300 px-3 py-2 text-sm focus:border-primary focus:outline-none"
/>
</div>
<div className="flex items-center gap-2">
<label className="flex items-center gap-2 text-sm">
<input
type="checkbox"
checked={newTodo.isUrgent}
onChange={(e) => setNewTodo({ ...newTodo, isUrgent: e.target.checked })}
className="h-4 w-4 rounded border-gray-300"
/>
<span className="text-red-600 font-medium"> </span>
</label>
</div>
<div className="flex gap-2">
<button
onClick={handleAddTodo}
className="flex-1 rounded bg-primary px-4 py-2 text-sm text-white hover:bg-primary/90"
>
</button>
<button
onClick={() => setShowAddForm(false)}
className="rounded bg-gray-200 px-4 py-2 text-sm text-gray-700 hover:bg-gray-300"
>
</button>
</div>
</div>
</div>
)}
{/* To-Do 리스트 */}
<div className="flex-1 overflow-y-auto p-4">
{todos.length === 0 ? (
<div className="flex h-full items-center justify-center text-gray-400">
<div className="text-center">
<div className="mb-2 text-4xl">📝</div>
<div> </div>
</div>
</div>
) : (
<div className="space-y-2">
{todos.map((todo) => (
<div
key={todo.id}
className={`group relative rounded-lg border-2 bg-white p-3 shadow-sm transition-all hover:shadow-md ${
todo.isUrgent ? "border-red-400" : "border-gray-200"
} ${todo.status === "completed" ? "opacity-60" : ""}`}
>
<div className="flex items-start gap-3">
{/* 우선순위 아이콘 */}
<div className="mt-1 text-lg">{getPriorityIcon(todo.priority)}</div>
{/* 내용 */}
<div className="flex-1">
<div className="flex items-start justify-between gap-2">
<div className="flex-1">
<div className={`font-medium ${todo.status === "completed" ? "line-through" : ""}`}>
{todo.isUrgent && <span className="mr-1 text-red-600"></span>}
{todo.title}
</div>
{todo.description && (
<div className="mt-1 text-xs text-gray-600">{todo.description}</div>
)}
{todo.dueDate && (
<div className="mt-1 text-xs text-gray-500">{getTimeRemaining(todo.dueDate)}</div>
)}
</div>
{/* 액션 버튼 */}
<div className="flex gap-1">
{todo.status !== "completed" && (
<button
onClick={() => handleUpdateStatus(todo.id, "completed")}
className="rounded p-1 text-green-600 hover:bg-green-50"
title="완료"
>
<Check className="h-4 w-4" />
</button>
)}
<button
onClick={() => handleDelete(todo.id)}
className="rounded p-1 text-red-600 hover:bg-red-50"
title="삭제"
>
<X className="h-4 w-4" />
</button>
</div>
</div>
{/* 상태 변경 */}
{todo.status !== "completed" && (
<div className="mt-2 flex gap-1">
<button
onClick={() => handleUpdateStatus(todo.id, "pending")}
className={`rounded px-2 py-1 text-xs ${
todo.status === "pending"
? "bg-blue-100 text-blue-700"
: "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
</button>
<button
onClick={() => handleUpdateStatus(todo.id, "in_progress")}
className={`rounded px-2 py-1 text-xs ${
todo.status === "in_progress"
? "bg-amber-100 text-amber-700"
: "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
</button>
</div>
)}
</div>
</div>
</div>
))}
</div>
)}
</div>
</div>
);
}