human_evaluator / templates /evaluate.html
iyadsultan's picture
Refactor evaluation process and enhance navigation controls
d016624
<!-- templates/evaluate.html -->
<!DOCTYPE html>
<html>
<head>
<title>Evaluate Document</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<style>
.form-section {
margin: 20px 0;
padding: 15px;
background-color: #f5f5f5;
border-radius: 8px;
}
.origin-options {
display: flex;
flex-direction: column;
gap: 10px;
}
.origin-option {
display: flex;
align-items: center;
gap: 10px;
}
.origin-option input[type="radio"] {
margin: 0;
}
.top-navigation-buttons {
display: flex;
gap: 10px;
justify-content: flex-end;
margin-bottom: 20px;
padding: 15px;
background-color: #f8f9fa;
border-radius: 8px;
border: 1px solid #dee2e6;
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<h1>Document Evaluation</h1>
<div class="header-links">
<a href="{{ url_for('view_instructions') }}" class="instructions-btn">Instructions</a>
<a href="{{ url_for('results') }}" class="results-btn">View Results</a>
<a href="{{ url_for('index') }}" class="evaluate-btn">Back to Home</a>
</div>
</div>
<div class="evaluator-info">
<p><strong>Evaluator:</strong> {{ evaluator_name }}</p>
</div>
<div class="progress-bar-container">
<div class="progress-info">
<p>Session Progress: <strong>{{ evaluated_docs }} of {{ total_docs }}</strong> documents processed ({{ progress }}%)</p>
<p>Current Document: <strong>{{ current_note_number }} of {{ total_docs }}</strong></p>
</div>
<div class="progress-bar">
<div class="progress-fill" style="width: {{ progress }}%;"></div>
</div>
</div>
<!-- Top navigation buttons for Skip and Exit -->
<div class="top-navigation-buttons">
<form method="POST" action="{{ url_for('evaluate') }}" style="display: inline;">
<button type="submit" name="action" value="skip" class="skip-btn">Skip Document</button>
</form>
<form method="POST" action="{{ url_for('evaluate') }}" style="display: inline;">
<button type="submit" name="action" value="stop_save" class="stop-save-btn">Exit and Save Progress</button>
</form>
<form method="POST" action="{{ url_for('jump_to_document') }}" class="jump-form" style="display: inline; margin-left: 20px;">
<label for="document_number">Jump to Note:</label>
<input type="number" id="document_number" name="document_number"
min="1" max="{{ total_docs }}" value="{{ current_note_number }}" required>
<button type="submit" class="jump-btn">Jump</button>
</form>
</div>
<div class="note-container">
<h2>Document Content:</h2>
<div class="doc-info">
{% if mrn %}
<div class="info-item mrn-info">
<strong>MRN:</strong> {{ mrn }}
</div>
{% endif %}
</div>
<div class="note-content">
{{ note }}
</div>
</div>
<!-- Single form for evaluation data -->
<form method="POST" action="{{ url_for('evaluate') }}" id="evaluation-form">
<div class="criteria-container">
{% for i in range(criteria|length) %}
<div class="criteria-group">
<h3>{{ i+1 }}. {{ criteria[i] }}</h3>
<p class="description">{{ descriptions[i] }}</p>
<div class="likert-scale">
<span>Not at all</span>
{% for score in score_range %}
<div class="radio-group">
<input type="radio" id="criteria_{{i}}_{{score}}"
name="criteria_{{i}}" value="{{score}}" required>
<label for="criteria_{{i}}_{{score}}">{{score}}</label>
</div>
{% endfor %}
<span>Extremely</span>
</div>
</div>
{% endfor %}
</div>
<div class="form-section">
<h3>Note Origin Assessment *</h3>
<div class="origin-options">
{% for origin in note_origins %}
<div class="origin-option">
<input type="radio" id="origin_{{ loop.index }}" name="note_origin"
value="{{ origin }}" required>
<label for="origin_{{ loop.index }}">{{ origin }}</label>
</div>
{% endfor %}
</div>
</div>
<div class="form-buttons">
<button type="submit" name="action" value="submit" class="submit-btn">Submit Evaluation</button>
</div>
</form>
<div class="resource-links">
<p>
<strong>Resources:</strong>
<a href="{{ url_for('download_instructions') }}">Download Instructions</a> |
<a href="{{ url_for('download_template') }}">Download Template CSV</a>
</p>
</div>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<div class="alert">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
</div>
</body>
</html>