human_evaluator / templates /upload_documents.html
iyadsultan's picture
Add document upload functionality via web interface
4a7a70e
<!DOCTYPE html>
<html>
<head>
<title>Upload Documents CSV</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<style>
.upload-container {
max-width: 600px;
margin: 50px auto;
padding: 30px;
background-color: white;
border-radius: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.1);
}
.upload-form {
text-align: center;
}
.file-input-wrapper {
margin: 30px 0;
padding: 20px;
border: 2px dashed #ddd;
border-radius: 10px;
background-color: #f9f9f9;
}
.file-input {
margin: 10px 0;
}
.upload-btn {
background-color: #28a745;
color: white;
padding: 12px 30px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
margin: 20px 10px;
}
.upload-btn:hover {
background-color: #218838;
}
.back-btn {
background-color: #6c757d;
color: white;
padding: 12px 30px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
text-decoration: none;
display: inline-block;
margin: 20px 10px;
}
.back-btn:hover {
background-color: #5a6268;
}
.instructions {
background-color: #e9ecef;
padding: 20px;
border-radius: 5px;
margin: 20px 0;
text-align: left;
}
.instructions h3 {
margin-top: 0;
color: #495057;
}
.instructions ul {
margin: 10px 0;
padding-left: 20px;
}
.warning {
background-color: #fff3cd;
border: 1px solid #ffeaa7;
padding: 15px;
border-radius: 5px;
margin: 20px 0;
}
</style>
</head>
<body>
<div class="upload-container">
<h1>Upload Documents CSV File</h1>
<div class="warning">
<strong>Alternative Upload Method:</strong> Use this if you're having permission issues with the HF Spaces file upload interface.
</div>
<div class="instructions">
<h3>File Requirements:</h3>
<ul>
<li>File must be in CSV format</li>
<li>Required columns: filename, note, description, mrn</li>
<li>Each row represents one document to be evaluated</li>
<li>Use UTF-8 encoding for best compatibility</li>
</ul>
</div>
<form method="POST" enctype="multipart/form-data" class="upload-form">
<div class="file-input-wrapper">
<h3>Select your documents.csv file:</h3>
<div class="file-input">
<input type="file" name="file" accept=".csv" required>
</div>
<p><em>Only CSV files are accepted</em></p>
</div>
<div class="form-buttons">
<button type="submit" class="upload-btn">Upload Documents</button>
<a href="{{ url_for('index') }}" class="back-btn">Back to Home</a>
</div>
</form>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<div class="alert">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
</div>
</body>
</html>