tracking_course_overview.html.twig 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. {% import '@ChamiloTheme/Macros/box.html.twig' as display %}
  2. {% set content %}
  3. <div class="summary-course" id="summary-{{ data.id }}">
  4. <div class="row">
  5. <div class="col-md-2">
  6. <div class="course">
  7. <h4 class="title">{{ data.title }}</h4>
  8. <div class="image">
  9. <img src="{{ data.image_small }}" class="img-responsive"/>
  10. </div>
  11. <div class="info">
  12. {% if data.course_code %}
  13. <p><strong>{{ 'WantedCourseCode'|get_lang }}</strong><br>{{ data.course_code }}</p>
  14. {% endif %}
  15. {% if data.category %}
  16. <p><strong>{{ 'CourseFaculty'|get_lang }}</strong><br>{{ data.category }}</p>
  17. {% endif %}
  18. </div>
  19. </div>
  20. </div>
  21. <div class="col-md-2">
  22. <div class="state">
  23. <div class="stat-text">
  24. <i class="fa fa-clock-o" aria-hidden="true"></i> {{ data.time_spent }}
  25. </div>
  26. <div class="stat-heading">
  27. {{ 'TimeSpentInTheCourse'|get_lang }}
  28. </div>
  29. </div>
  30. <div class="state">
  31. <div class="stat-text">
  32. {{ data.total_score }}
  33. </div>
  34. <div class="stat-heading">
  35. {{ 'TotalExercisesScoreObtained'|get_lang }}
  36. </div>
  37. </div>
  38. </div>
  39. <div class="col-md-4">
  40. <div class="list-donut">
  41. <div class="easy-donut">
  42. <div class="easypiechart-blue easypiechart" title="{{ 'Progress'|get_lang }}" data-percent="{{ data.avg_progress }}">
  43. <span class="percent">{{ data.avg_progress }}%</span>
  44. </div>
  45. <div class="easypiechart-legend">
  46. {{ 'AvgStudentsProgress'|get_lang }}
  47. </div>
  48. </div>
  49. <div class="easy-donut">
  50. <div class="easypiechart-red easypiechart" title="{{ 'Progress'|get_lang }}" data-percent="{{ data.avg_score }}">
  51. <span class="percent">{{ data.avg_score }}%</span>
  52. </div>
  53. <div class="easypiechart-legend">
  54. {{ 'AvgCourseScore'|get_lang }}
  55. </div>
  56. </div>
  57. </div>
  58. </div>
  59. <div class="col-md-4">
  60. <dl class="dl-horizontal list-info">
  61. <dt>
  62. <span title="{{ 'TotalNumberOfMessages'|get_lang }}">{{ 'TotalNumberOfMessages'|get_lang }}</span>
  63. </dt>
  64. <dd>
  65. <span class="text-color"><i class="fa fa-comments" aria-hidden="true"></i></span>
  66. <span class="text-color">{{ data.number_message }}</span>
  67. </dd>
  68. <dt>
  69. <span title="{{ 'TotalNumberOfAssignments'|get_lang }}">{{ 'TotalNumberOfAssignments'|get_lang }}</span>
  70. </dt>
  71. <dd>
  72. <span class="text-color"><i class="fa fa-pencil" aria-hidden="true"></i></span>
  73. <span class="text-color">{{ data.number_assignments }}</span>
  74. </dd>
  75. <dt>
  76. <span title="{{ 'TotalExercisesAnswered'|get_lang }}">{{ 'TotalExercisesAnswered'|get_lang }}</span>
  77. </dt>
  78. <dd>
  79. <span class="text-color"><i class="fa fa-file-text" aria-hidden="true"></i></span>
  80. <span class="text-color">{{ data.questions_answered }}</span>
  81. </dd>
  82. <dt>
  83. <span title="{{ 'LatestLogin'|get_lang }}">{{ 'LatestLogin'|get_lang }}</span>
  84. </dt>
  85. <dd>
  86. <span class="text-color"><i class="fa fa-clock-o" aria-hidden="true"></i></span>
  87. <span class="text-color">{{ data.last_login }}</span>
  88. </dd>
  89. </dl>
  90. </div>
  91. </div>
  92. </div>
  93. {% endset %}
  94. {% autoescape false %}
  95. {{ display.panel('',content ,'') }}
  96. {% endautoescape %}