Spaces:
Sleeping
Sleeping
File size: 7,796 Bytes
7cb4836 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 | {% extends "base.html" %}
{% block title %}Learning Progress - Dify AI Learning{% endblock %}
{% block content %}
<div class="container py-4">
<div class="row">
<div class="col-12">
<h1 class="page-title">
<i data-feather="trending-up" class="me-2"></i>
Your Learning Progress
</h1>
<p class="page-subtitle">Track your journey through Dify AI mastery</p>
</div>
</div>
<!-- Progress Overview -->
<div class="row mb-5">
<div class="col-md-3 col-6 mb-3">
<div class="card stats-card">
<div class="card-body text-center">
<div class="stats-icon">
<i data-feather="book-open"></i>
</div>
<h3 class="stats-number">{{ progress_data|selectattr('progress')|list|length }}</h3>
<p class="stats-label">Started</p>
</div>
</div>
</div>
<div class="col-md-3 col-6 mb-3">
<div class="card stats-card">
<div class="card-body text-center">
<div class="stats-icon">
<i data-feather="check-circle"></i>
</div>
<h3 class="stats-number">{{ progress_data|selectattr('progress.completed')|list|length }}</h3>
<p class="stats-label">Completed</p>
</div>
</div>
</div>
<div class="col-md-3 col-6 mb-3">
<div class="card stats-card">
<div class="card-body text-center">
<div class="stats-icon">
<i data-feather="play-circle"></i>
</div>
<h3 class="stats-number">{{ progress_data|rejectattr('progress')|list|length }}</h3>
<p class="stats-label">Not Started</p>
</div>
</div>
</div>
<div class="col-md-3 col-6 mb-3">
<div class="card stats-card">
<div class="card-body text-center">
<div class="stats-icon">
<i data-feather="clock"></i>
</div>
<h3 class="stats-number">
{{ (progress_data|selectattr('progress.completed')|map(attribute='tutorial.estimated_time')|sum) or 0 }}
</h3>
<p class="stats-label">Minutes Learned</p>
</div>
</div>
</div>
</div>
<!-- Progress Timeline -->
<div class="row">
<div class="col-12">
<h2 class="section-title">
<i data-feather="list" class="me-2"></i>
Tutorial Progress
</h2>
<div class="progress-timeline">
{% for item in progress_data %}
<div class="progress-item">
<div class="progress-marker">
{% if item.progress and item.progress.completed %}
<div class="marker completed">
<i data-feather="check"></i>
</div>
{% elif item.progress %}
<div class="marker in-progress">
<span>{{ item.progress.current_step + 1 }}</span>
</div>
{% else %}
<div class="marker not-started">
<i data-feather="circle"></i>
</div>
{% endif %}
</div>
<div class="progress-content">
<div class="card">
<div class="card-body">
<div class="d-flex justify-content-between align-items-start">
<div>
<h5 class="card-title">{{ item.tutorial.title }}</h5>
<p class="card-text">{{ item.tutorial.description }}</p>
<div class="tutorial-meta">
<span class="badge bg-{{ item.tutorial.difficulty_color }}">
{{ item.tutorial.difficulty }}
</span>
<span class="text-muted ms-2">
<i data-feather="clock" class="small me-1"></i>
{{ item.tutorial.estimated_time }} min
</span>
{% if item.progress and item.progress.completed %}
<span class="text-success ms-2">
<i data-feather="calendar" class="small me-1"></i>
Completed {{ item.progress.completion_date.strftime('%b %d') }}
</span>
{% endif %}
</div>
</div>
<div class="progress-actions">
{% if item.progress and item.progress.completed %}
<a href="{{ url_for('tutorial', slug=item.tutorial.slug) }}"
class="btn btn-outline-primary btn-sm">
Review
</a>
{% elif item.progress %}
<a href="{{ url_for('tutorial', slug=item.tutorial.slug) }}"
class="btn btn-primary btn-sm">
Continue
</a>
{% else %}
<a href="{{ url_for('tutorial', slug=item.tutorial.slug) }}"
class="btn btn-outline-primary btn-sm">
Start
</a>
{% endif %}
</div>
</div>
{% if item.progress and not item.progress.completed %}
<div class="tutorial-progress mt-3">
<div class="progress">
<div class="progress-bar" role="progressbar"
style="width: {{ (item.progress.current_step / item.tutorial.total_steps * 100)|round }}%">
</div>
</div>
<small class="text-muted">
Step {{ item.progress.current_step + 1 }} of {{ item.tutorial.total_steps }}
</small>
</div>
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
{% endblock %}
|