|
|
<!DOCTYPE html> |
|
|
<html lang="ko"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>RAG μ±λ΄ - μ§μλ² μ΄μ€</title> |
|
|
<link rel="stylesheet" href="/static/css/style.css"> |
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"> |
|
|
|
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
|
|
|
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.css"> |
|
|
</head> |
|
|
<body> |
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark"> |
|
|
<div class="container"> |
|
|
<a class="navbar-brand" href="/"> |
|
|
<i class="fas fa-robot me-2"></i>RAG μ±λ΄ |
|
|
</a> |
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"> |
|
|
<span class="navbar-toggler-icon"></span> |
|
|
</button> |
|
|
<div class="collapse navbar-collapse" id="navbarNav"> |
|
|
<ul class="navbar-nav ms-auto"> |
|
|
<li class="nav-item"> |
|
|
<a class="nav-link" href="/"><i class="fas fa-home me-1"></i>ν</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a class="nav-link" href="/chat"><i class="fas fa-comments me-1"></i>μ±ν
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a class="nav-link active" href="/knowledge"><i class="fas fa-database me-1"></i>μ§μλ² μ΄μ€</a> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
<div class="container mt-4"> |
|
|
<div class="row"> |
|
|
|
|
|
<div class="col-md-6"> |
|
|
<div class="card shadow-sm mb-4"> |
|
|
<div class="card-header bg-success text-white"> |
|
|
<i class="fas fa-upload me-2"></i>λ¬Έμ μ
λ‘λ |
|
|
</div> |
|
|
<div class="card-body"> |
|
|
<p class="card-text">μ±λ΄μ μ§μμ μ 곡ν λ¬Έμλ₯Ό μ
λ‘λνμΈμ. ν
μ€νΈ κΈ°λ° λ¬Έμ(TXT, MD, PDF, DOCX, CSV)λ₯Ό μ§μν©λλ€.</p> |
|
|
|
|
|
<form id="documentUploadForm" class="dropzone mt-3"> |
|
|
<div class="dz-message needsclick"> |
|
|
<i class="fas fa-cloud-upload-alt fa-3x mb-3"></i> |
|
|
<h4>μ¬κΈ°μ νμΌμ λμ΄λ€ λκ±°λ ν΄λ¦νμ¬ μ ννμΈμ</h4> |
|
|
<span class="text-muted">μ΅λ 10MB, ν
μ€νΈ κΈ°λ° λ¬Έμ νμΌλ§ νμ©</span> |
|
|
</div> |
|
|
</form> |
|
|
|
|
|
<div class="alert alert-success mt-3 d-none" id="uploadSuccess"> |
|
|
<i class="fas fa-check-circle me-2"></i> |
|
|
<span id="uploadSuccessMessage">λ¬Έμκ° μ±κ³΅μ μΌλ‘ μ
λ‘λλμμ΅λλ€.</span> |
|
|
</div> |
|
|
|
|
|
<div class="alert alert-danger mt-3 d-none" id="uploadError"> |
|
|
<i class="fas fa-exclamation-circle me-2"></i> |
|
|
<span id="uploadErrorMessage">μ
λ‘λ μ€ μ€λ₯κ° λ°μνμ΅λλ€.</span> |
|
|
</div> |
|
|
|
|
|
<button id="uploadButton" class="btn btn-success mt-3" disabled> |
|
|
<i class="fas fa-upload me-2"></i>μ
λ‘λ |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="card shadow-sm"> |
|
|
<div class="card-header bg-dark text-white"> |
|
|
<i class="fas fa-info-circle me-2"></i>μ¬μ© μλ΄ |
|
|
</div> |
|
|
<div class="card-body"> |
|
|
<h5>μ§μλλ νμΌ νμ</h5> |
|
|
<ul> |
|
|
<li>ν
μ€νΈ νμΌ (.txt)</li> |
|
|
<li>λ§ν¬λ€μ΄ νμΌ (.md)</li> |
|
|
<li>PDF λ¬Έμ (.pdf)</li> |
|
|
<li>MS Word λ¬Έμ (.docx)</li> |
|
|
<li>CSV λ°μ΄ν° (.csv)</li> |
|
|
</ul> |
|
|
<h5>μλ λ°©μ</h5> |
|
|
<p>μ
λ‘λλ λ¬Έμλ μ μ ν ν¬κΈ°λ‘ λΆν λμ΄ μλ² λ©λ ν λ²‘ν° λ°μ΄ν°λ² μ΄μ€μ μ μ₯λ©λλ€. μ΄ λ°μ΄ν°λ μ¬μ©μμ μ§λ¬Έμ λν κ΄λ ¨ μ 보λ₯Ό κ²μνλ λ° μ¬μ©λ©λλ€.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="col-md-6"> |
|
|
<div class="card shadow-sm mb-4"> |
|
|
<div class="card-header bg-primary text-white"> |
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
<div> |
|
|
<i class="fas fa-database me-2"></i>μ§μλ² μ΄μ€ μν |
|
|
</div> |
|
|
<div> |
|
|
<button id="refreshStatus" class="btn btn-sm btn-light"> |
|
|
<i class="fas fa-sync-alt me-1"></i>μλ‘κ³ μΉ¨ |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="card-body"> |
|
|
<div id="databaseStats"> |
|
|
<div class="d-flex justify-content-center align-items-center" style="height: 100px;"> |
|
|
<div class="spinner-border text-primary" role="status"> |
|
|
<span class="visually-hidden">Loading...</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="card shadow-sm"> |
|
|
<div class="card-header bg-primary text-white"> |
|
|
<i class="fas fa-file-alt me-2"></i>λ¬Έμ λͺ©λ‘ |
|
|
</div> |
|
|
<div class="card-body p-0"> |
|
|
<div id="documentsContainer"> |
|
|
<div class="text-center p-4"> |
|
|
<div class="spinner-border text-primary" role="status"> |
|
|
<span class="visually-hidden">Loading...</span> |
|
|
</div> |
|
|
<p class="mt-2">λ¬Έμ λͺ©λ‘μ λΆλ¬μ€λ μ€...</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<footer class="bg-dark text-white text-center py-3 mt-5"> |
|
|
<div class="container"> |
|
|
<p class="mb-0">RAG μ±λ΄ ν΄λΌμ΄μΈνΈ © 2025</p> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
|
|
|
<template id="documentItemTemplate"> |
|
|
<div class="list-group-item"> |
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
<div class="d-flex align-items-center"> |
|
|
<i class="fas fa-file-alt me-3 text-primary"></i> |
|
|
<div> |
|
|
<h6 class="mb-0 document-name">λ¬Έμλͺ
</h6> |
|
|
<div class="small text-muted"> |
|
|
λ¬Έμ μ²ν¬: <span class="document-chunks">0</span> κ° |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<span class="badge bg-primary document-type">TXT</span> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script> |
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.js"></script> |
|
|
|
|
|
<script src="/static/js/knowledge.js"></script> |
|
|
</body> |
|
|
</html> |
|
|
|
