{% extends 'base.html' %}

{% block title %}Submission: {{ submission.tracking_id }} | Admin | {{ settings.site_name }}{% endblock %}

{% block content %}
<section class="section-light py-4">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-1">
                <li class="breadcrumb-item"><a href="{{ url_for('admin.dashboard') }}">Dashboard</a></li>
                <li class="breadcrumb-item"><a href="{{ url_for('admin.submissions') }}">Submissions</a></li>
                <li class="breadcrumb-item active">{{ submission.tracking_id }}</li>
            </ol>
        </nav>
        <div class="d-flex justify-content-between align-items-center">
            <h1 class="h3 mb-0">Review Submission</h1>
            <span class="badge fs-6
                {% if submission.status == 'pending' %}bg-warning
                {% elif submission.status == 'under_review' %}bg-info
                {% elif submission.status == 'revision_requested' %}bg-secondary
                {% elif submission.status == 'accepted' %}bg-success
                {% elif submission.status == 'rejected' %}bg-danger
                {% elif submission.status == 'published' %}bg-primary
                {% else %}bg-secondary{% endif %}">
                {{ submission.status|replace('_', ' ')|title }}
            </span>
        </div>
    </div>
</section>

<section class="section">
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
                <!-- Submission Details -->
                <div class="card border-0 shadow-sm mb-4">
                    <div class="card-header bg-transparent">
                        <h5 class="mb-0">Submission Details</h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-4">
                            <label class="text-muted small">Title</label>
                            <h4>{{ submission.title }}</h4>
                        </div>
                        
                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="text-muted small">Tracking ID</label>
                                <div><code class="fs-5">{{ submission.tracking_id }}</code></div>
                            </div>
                            <div class="col-md-6">
                                <label class="text-muted small">Submitted</label>
                                <div>{{ submission.created_at.strftime('%B %d, %Y at %I:%M %p') }}</div>
                            </div>
                        </div>
                        
                        <hr>
                        
                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="text-muted small">Authors</label>
                                <div>{{ submission.authors }}</div>
                            </div>
                            <div class="col-md-6">
                                <label class="text-muted small">Contact Email</label>
                                <div><a href="mailto:{{ submission.contact_email }}">{{ submission.contact_email }}</a></div>
                            </div>
                        </div>
                        
                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="text-muted small">Affiliation</label>
                                <div>{{ submission.affiliation or 'Not provided' }}</div>
                            </div>
                            <div class="col-md-6">
                                <label class="text-muted small">ORCID</label>
                                <div>{{ submission.orcid or 'Not provided' }}</div>
                            </div>
                        </div>
                        
                        {% if submission.co_authors %}
                        <div class="mb-3">
                            <label class="text-muted small">Co-Authors</label>
                            <div>{{ submission.co_authors }}</div>
                        </div>
                        {% endif %}
                        
                        <hr>
                        
                        <div class="mb-3">
                            <label class="text-muted small">Target Journal</label>
                            <div>
                                {% if submission.journal %}
                                <a href="{{ url_for('main.journal_detail', slug=submission.journal.slug) }}" target="_blank">
                                    {{ submission.journal.name }}
                                </a>
                                {% else %}
                                Not specified
                                {% endif %}
                            </div>
                        </div>
                        
                        {% if submission.keywords %}
                        <div class="mb-3">
                            <label class="text-muted small">Keywords</label>
                            <div>
                                {% for keyword in submission.keywords.split(',') %}
                                <span class="badge bg-light text-dark me-1">{{ keyword.strip() }}</span>
                                {% endfor %}
                            </div>
                        </div>
                        {% endif %}
                        
                        <div class="mb-3">
                            <label class="text-muted small">Abstract</label>
                            <div class="bg-light p-3 rounded">{{ submission.abstract }}</div>
                        </div>
                        
                        {% if submission.cover_letter %}
                        <div class="mb-3">
                            <label class="text-muted small">Cover Letter</label>
                            <div class="bg-light p-3 rounded">{{ submission.cover_letter }}</div>
                        </div>
                        {% endif %}
                        
                        {% if submission.file_path %}
                        <div class="mb-3">
                            <label class="text-muted small">Manuscript File</label>
                            <div>
                                <a href="{{ url_for('main.uploaded_file', filename=submission.file_path) }}" 
                                   class="btn btn-outline-primary" target="_blank">
                                    <i class="fas fa-download me-2"></i>Download Manuscript
                                </a>
                            </div>
                        </div>
                        {% endif %}
                    </div>
                </div>
                
                <!-- Status History -->
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-transparent">
                        <h5 class="mb-0"><i class="fas fa-history me-2"></i>Status History</h5>
                    </div>
                    <div class="card-body">
                        {% if submission.status_updates.count() %}
                        <div class="timeline">
                            {% for update in submission.status_updates.all() %}
                            <div class="timeline-item">
                                <div class="timeline-marker 
                                    {% if update.new_status == 'pending' %}bg-warning
                                    {% elif update.new_status == 'under_review' %}bg-info
                                    {% elif update.new_status == 'revision_requested' %}bg-secondary
                                    {% elif update.new_status == 'accepted' %}bg-success
                                    {% elif update.new_status == 'rejected' %}bg-danger
                                    {% elif update.new_status == 'published' %}bg-primary
                                    {% else %}bg-secondary{% endif %}">
                                    <i class="fas fa-check text-white" style="font-size: 10px;"></i>
                                </div>
                                <div class="timeline-content">
                                    <div class="d-flex justify-content-between">
                                        <strong>{{ update.new_status|replace('_', ' ')|title }}</strong>
                                        <small class="text-muted">{{ update.created_at.strftime('%b %d, %Y %I:%M %p') }}</small>
                                    </div>
                                    {% if update.notes %}
                                    <p class="text-muted mb-0 mt-1">{{ update.notes }}</p>
                                    {% endif %}
                                    {% if update.updated_by %}
                                    <small class="text-muted">By {{ update.updated_by.name }}</small>
                                    {% endif %}
                                </div>
                            </div>
                            {% endfor %}
                        </div>
                        {% else %}
                        <p class="text-muted mb-0">No status updates recorded.</p>
                        {% endif %}
                    </div>
                </div>
            </div>
            
            <div class="col-lg-4">
                <!-- Update Status -->
                <div class="card border-0 shadow-sm mb-4">
                    <div class="card-header bg-transparent">
                        <h5 class="mb-0"><i class="fas fa-edit me-2"></i>Update Status</h5>
                    </div>
                    <div class="card-body">
                        <form action="{{ url_for('admin.update_submission_status', id=submission.id) }}" method="POST">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                            
                            <div class="mb-3">
                                <label for="status" class="form-label">New Status</label>
                                <select class="form-select" id="status" name="status" required>
                                    <option value="pending" {% if submission.status == 'pending' %}selected{% endif %}>Pending</option>
                                    <option value="under_review" {% if submission.status == 'under_review' %}selected{% endif %}>Under Review</option>
                                    <option value="revision_requested" {% if submission.status == 'revision_requested' %}selected{% endif %}>Revision Requested</option>
                                    <option value="accepted" {% if submission.status == 'accepted' %}selected{% endif %}>Accepted</option>
                                    <option value="rejected" {% if submission.status == 'rejected' %}selected{% endif %}>Rejected</option>
                                    <option value="published" {% if submission.status == 'published' %}selected{% endif %}>Published</option>
                                </select>
                            </div>
                            
                            <div class="mb-3">
                                <label for="notes" class="form-label">Notes for Author</label>
                                <textarea class="form-control" id="notes" name="notes" rows="4"
                                          placeholder="Add notes or feedback for the author..."></textarea>
                            </div>
                            
                            <div class="form-check mb-3">
                                <input class="form-check-input" type="checkbox" id="notify_author" 
                                       name="notify_author" checked>
                                <label class="form-check-label" for="notify_author">
                                    Notify author via email
                                </label>
                            </div>
                            
                            <button type="submit" class="btn btn-primary w-100">
                                <i class="fas fa-save me-2"></i>Update Status
                            </button>
                        </form>
                    </div>
                </div>
                
                <!-- Convert to Article -->
                {% if submission.status in ['accepted', 'published'] %}
                <div class="card border-0 shadow-sm mb-4">
                    <div class="card-header bg-success text-white">
                        <h5 class="mb-0"><i class="fas fa-magic me-2"></i>Convert to Article</h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted small">
                            Create a published article from this submission.
                        </p>
                        <a href="{{ url_for('admin.convert_to_article', id=submission.id) }}" class="btn btn-success w-100">
                            <i class="fas fa-file-export me-2"></i>Convert to Article
                        </a>
                    </div>
                </div>
                {% endif %}
                
                <!-- Quick Actions -->
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-transparent">
                        <h5 class="mb-0"><i class="fas fa-bolt me-2"></i>Quick Actions</h5>
                    </div>
                    <div class="card-body">
                        <div class="d-grid gap-2">
                            <a href="mailto:{{ submission.contact_email }}" class="btn btn-outline-primary">
                                <i class="fas fa-envelope me-2"></i>Email Author
                            </a>
                            <a href="{{ url_for('admin.submissions') }}" class="btn btn-outline-secondary">
                                <i class="fas fa-arrow-left me-2"></i>Back to List
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}