mirror of
				https://github.com/HKUDS/LightRAG.git
				synced 2025-11-04 03:39:35 +00:00 
			
		
		
		
	Update index.html
This commit is contained in:
		
							parent
							
								
									8653e0d410
								
							
						
					
					
						commit
						eddd1c23bd
					
				@ -3,8 +3,9 @@
 | 
				
			|||||||
<head>
 | 
					<head>
 | 
				
			||||||
  <meta charset="UTF-8">
 | 
					  <meta charset="UTF-8">
 | 
				
			||||||
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | 
					  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | 
				
			||||||
  <title>LightRAG WebUI</title>
 | 
					  <title>RAG WebUI</title>
 | 
				
			||||||
  <script src="https://cdn.tailwindcss.com"></script>
 | 
					  <script src="https://cdn.tailwindcss.com"></script>
 | 
				
			||||||
 | 
					  <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> <!-- Include Marked.js -->
 | 
				
			||||||
</head>
 | 
					</head>
 | 
				
			||||||
<body class="bg-gray-100 min-h-screen flex flex-col items-center justify-center p-4">
 | 
					<body class="bg-gray-100 min-h-screen flex flex-col items-center justify-center p-4">
 | 
				
			||||||
  <div class="w-full max-w-4xl bg-white shadow-md rounded-lg p-6 relative">
 | 
					  <div class="w-full max-w-4xl bg-white shadow-md rounded-lg p-6 relative">
 | 
				
			||||||
@ -39,6 +40,12 @@
 | 
				
			|||||||
        <button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Upload</button>
 | 
					        <button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Upload</button>
 | 
				
			||||||
      </form>
 | 
					      </form>
 | 
				
			||||||
      <div id="uploadStatus" class="mt-2 text-sm text-gray-600"></div>
 | 
					      <div id="uploadStatus" class="mt-2 text-sm text-gray-600"></div>
 | 
				
			||||||
 | 
					      <div id="progressContainer" class="mt-4 hidden">
 | 
				
			||||||
 | 
					        <div id="progressBar" class="w-full bg-gray-200 rounded h-4">
 | 
				
			||||||
 | 
					          <div class="bg-blue-500 h-4 rounded" style="width: 0%;"></div>
 | 
				
			||||||
 | 
					        </div>
 | 
				
			||||||
 | 
					        <p id="progressText" class="text-sm text-gray-600 mt-2"></p>
 | 
				
			||||||
 | 
					      </div>
 | 
				
			||||||
    </div>
 | 
					    </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    <!-- Query Section -->
 | 
					    <!-- Query Section -->
 | 
				
			||||||
@ -93,6 +100,9 @@
 | 
				
			|||||||
    const uploadForm = document.getElementById('uploadForm');
 | 
					    const uploadForm = document.getElementById('uploadForm');
 | 
				
			||||||
    const fileInput = document.getElementById('fileInput');
 | 
					    const fileInput = document.getElementById('fileInput');
 | 
				
			||||||
    const uploadStatus = document.getElementById('uploadStatus');
 | 
					    const uploadStatus = document.getElementById('uploadStatus');
 | 
				
			||||||
 | 
					    const progressContainer = document.getElementById('progressContainer');
 | 
				
			||||||
 | 
					    const progressBar = document.getElementById('progressBar').firstElementChild;
 | 
				
			||||||
 | 
					    const progressText = document.getElementById('progressText');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    uploadForm.addEventListener('submit', async (e) => {
 | 
					    uploadForm.addEventListener('submit', async (e) => {
 | 
				
			||||||
      e.preventDefault();
 | 
					      e.preventDefault();
 | 
				
			||||||
@ -102,31 +112,46 @@
 | 
				
			|||||||
        return;
 | 
					        return;
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
      const formData = new FormData();
 | 
					      progressContainer.classList.remove('hidden');
 | 
				
			||||||
      for (const file of files) {
 | 
					      uploadStatus.textContent = "Uploading files...";
 | 
				
			||||||
 | 
					      let uploadedCount = 0;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      for (const [index, file] of Array.from(files).entries()) {
 | 
				
			||||||
 | 
					        const formData = new FormData();
 | 
				
			||||||
        formData.append('file', file);
 | 
					        formData.append('file', file);
 | 
				
			||||||
      }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
      uploadStatus.textContent = "Uploading...";
 | 
					        try {
 | 
				
			||||||
      try {
 | 
					          const response = await fetch('/documents/upload', {
 | 
				
			||||||
        const response = await fetch('/documents/upload', {
 | 
					            method: 'POST',
 | 
				
			||||||
          method: 'POST',
 | 
					            body: formData,
 | 
				
			||||||
          body: formData,
 | 
					            headers: {
 | 
				
			||||||
          headers: {
 | 
					              'Authorization': `Bearer ${localStorage.getItem('bearerKey') || ''}`
 | 
				
			||||||
            'Authorization': `Bearer ${localStorage.getItem('bearerKey') || ''}`
 | 
					            }
 | 
				
			||||||
 | 
					          });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					          if (response.ok) {
 | 
				
			||||||
 | 
					            uploadedCount++;
 | 
				
			||||||
 | 
					            const progress = Math.round((uploadedCount / files.length) * 100);
 | 
				
			||||||
 | 
					            progressBar.style.width = `${progress}%`;
 | 
				
			||||||
 | 
					            progressText.textContent = `Uploading file ${index + 1} of ${files.length} (${progress}%)`;
 | 
				
			||||||
 | 
					          } else {
 | 
				
			||||||
 | 
					            const error = await response.json();
 | 
				
			||||||
 | 
					            uploadStatus.textContent = `Error uploading file ${file.name}: ${error.detail}`;
 | 
				
			||||||
 | 
					            break;
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
        });
 | 
					        } catch (err) {
 | 
				
			||||||
 | 
					          uploadStatus.textContent = `Error uploading file ${file.name}: ${err.message}`;
 | 
				
			||||||
        if (response.ok) {
 | 
					          break;
 | 
				
			||||||
          const data = await response.json();
 | 
					 | 
				
			||||||
          uploadStatus.textContent = `Upload successful! Indexed ${data.total_documents} documents.`;
 | 
					 | 
				
			||||||
        } else {
 | 
					 | 
				
			||||||
          const error = await response.json();
 | 
					 | 
				
			||||||
          uploadStatus.textContent = `Error: ${error.detail}`;
 | 
					 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      } catch (err) {
 | 
					 | 
				
			||||||
        uploadStatus.textContent = `Error: ${err.message}`;
 | 
					 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      if (uploadedCount === files.length) {
 | 
				
			||||||
 | 
					        uploadStatus.textContent = "All files uploaded successfully!";
 | 
				
			||||||
 | 
					      } else {
 | 
				
			||||||
 | 
					        uploadStatus.textContent = "File upload interrupted.";
 | 
				
			||||||
 | 
					      }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      progressContainer.classList.add('hidden');
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // Query Handler
 | 
					    // Query Handler
 | 
				
			||||||
@ -155,7 +180,7 @@
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
        if (response.ok) {
 | 
					        if (response.ok) {
 | 
				
			||||||
          const data = await response.json();
 | 
					          const data = await response.json();
 | 
				
			||||||
          queryResponse.textContent = `Response: ${data.response}`;
 | 
					          queryResponse.innerHTML = marked(data.response); // Render Markdown as HTML
 | 
				
			||||||
        } else {
 | 
					        } else {
 | 
				
			||||||
          const error = await response.json();
 | 
					          const error = await response.json();
 | 
				
			||||||
          queryResponse.textContent = `Error: ${error.detail}`;
 | 
					          queryResponse.textContent = `Error: ${error.detail}`;
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user