user_details.html.twig 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. {% import '@ChamiloTheme/Macros/box.html.twig' as display %}
  2. {% autoescape false %}
  3. {% if title %}
  4. <h2 class="details-title"><img src="{{ 'course.png'|icon(32) }}"> {{ title }}</h2>
  5. {% endif %}
  6. <div class="page-header">
  7. <h3>{{ user.complete_name }}</h3>
  8. </div>
  9. <!-- NO DETAILS -->
  10. {% if details != true %}
  11. <div class="no-details">
  12. {% set user_content %}
  13. <div class="row">
  14. <div class="col-md-4">
  15. <div class="user text-center">
  16. <div class="avatar">
  17. <img width="128px" src="{{ user.avatar }}" class="img-responsive">
  18. </div>
  19. <div class="name">
  20. <h3>{{ user.complete_name_link }}</h3>
  21. <p class="email">{{ user.email }}</p>
  22. </div>
  23. </div>
  24. </div>
  25. <div class="col-md-4">
  26. {{ display.reporting_user_details(user) }}
  27. </div>
  28. <div class="col-md-4">
  29. {{ display.card_widget('FirstLoginInPlatform'|get_lang, user.first_connection, 'calendar') }}
  30. {{ display.card_widget('LatestLoginInPlatform'|get_lang, user.last_connection, 'calendar') }}
  31. {% if user.legal %}
  32. {{ display.card_widget('LegalAccepted'|get_lang, user.legal.datetime, 'gavel', user.legal.icon) }}
  33. {% endif %}
  34. </div>
  35. </div>
  36. {% endset %}
  37. {{ display.panel('', user_content) }}
  38. </div>
  39. <!-- DETAILS -->
  40. {% else %}
  41. <div class="details">
  42. <div class="row">
  43. <div class="col-md-4">
  44. {{ display.panel('', display.reporting_user_box(user), '') }}
  45. </div>
  46. <div class="col-md-8">
  47. <div class="row">
  48. <div class="col-md-8">
  49. <div class="row">
  50. <div class="col-md-6">
  51. <div class="easy-donut">
  52. <div id="easypiechart-blue" title="{{ 'Progress'|get_lang }}" class="easypiechart"
  53. data-percent="{{ user.student_progress }}">
  54. <span class="percent">{{ user.student_progress }}%</span>
  55. </div>
  56. <div class="easypiechart-legend">
  57. {{ 'ScormAndLPProgressTotalAverage'|get_lang }}
  58. </div>
  59. </div>
  60. </div>
  61. <div class="col-md-6">
  62. <div class="easy-donut">
  63. <div id="easypiechart-red" title="{{ 'Score'|get_lang }}" class="easypiechart"
  64. data-percent="{{ user.student_score }}">
  65. <span class="percent">{{ user.student_score }} </span>
  66. </div>
  67. <div class="easypiechart-legend">
  68. {{ 'ScormAndLPTestTotalAverage'|get_lang }}
  69. </div>
  70. </div>
  71. </div>
  72. </div>
  73. <div class="row">
  74. <div class="col-md-6">
  75. <div class="card box-widget">
  76. <div class="card-body">
  77. <div class="stat-widget-five">
  78. <i class="fa fa-globe" aria-hidden="true"></i>
  79. {{ user.tools.links }}
  80. <div class="box-name">
  81. {{ 'LinksDetails'|get_lang }}
  82. </div>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="card box-widget">
  87. <div class="card-body">
  88. <div class="stat-widget-five">
  89. <i class="fa fa-download" aria-hidden="true"></i>
  90. {{ user.tools.documents }}
  91. <div class="box-name">
  92. {{ 'DocumentsDetails'|get_lang }}
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. <div class="card box-widget">
  98. <div class="card-body">
  99. <div class="stat-widget-five">
  100. <i class="fa fa-pencil" aria-hidden="true"></i>
  101. {{ user.tools.tasks }}
  102. <div class="box-name">
  103. {{ 'Student_publication'|get_lang }}
  104. </div>
  105. </div>
  106. </div>
  107. </div>
  108. </div>
  109. <div class="col-md-6">
  110. <div class="card box-widget">
  111. <div class="card-body">
  112. <div class="stat-widget-five">
  113. <i class="fa fa-comments-o" aria-hidden="true"></i>
  114. {{ user.tools.messages }}
  115. <div class="box-name">
  116. {{ 'NumberOfPostsForThisUser'|get_lang }}
  117. </div>
  118. </div>
  119. </div>
  120. </div>
  121. <div class="card box-widget">
  122. <div class="card-body">
  123. <div class="stat-widget-five">
  124. <i class="fa fa-paper-plane" aria-hidden="true"></i>
  125. {{ user.tools.upload_documents }}
  126. <div class="box-name">
  127. {{ 'UploadedDocuments'|get_lang }}
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. <div class="card box-widget">
  133. <div class="card-body">
  134. <div class="stat-widget-five">
  135. <i class="fa fa-plug" aria-hidden="true"></i>
  136. <span class="date" title="{{ user.tools.chat_connection }}">
  137. {% if user.tools.chat_connection != '' %}
  138. {{ user.tools.chat_connection }}
  139. {% else %}
  140. {{ 'NotRegistered'|get_lang }}
  141. {% endif %}
  142. </span>
  143. <div class="box-name">
  144. {{ 'ChatLastConnection'|get_lang }}
  145. </div>
  146. </div>
  147. </div>
  148. </div>
  149. </div>
  150. </div>
  151. </div>
  152. <div class="col-md-4">
  153. {{ display.card_widget('FirstLoginInPlatform'|get_lang, user.first_connection, 'calendar') }}
  154. {{ display.card_widget('LatestLoginInPlatform'|get_lang, user.last_connection, 'calendar') }}
  155. {% if(user.time_spent_course) %}
  156. {{ display.card_widget('TimeSpentInTheCourse'|get_lang, user.time_spent_course, 'clock-o') }}
  157. {% endif %}
  158. {% if user.legal %}
  159. {{ display.card_widget('LegalAccepted'|get_lang, user.legal.datetime, 'gavel', user.legal.icon) }}
  160. {% endif %}
  161. </div>
  162. </div>
  163. </div>
  164. </div>
  165. </div>
  166. {% endif %}
  167. <script>
  168. $(function () {
  169. $('#easypiechart-blue').easyPieChart({
  170. scaleColor: false,
  171. barColor: '#30a5ff',
  172. lineWidth: 8,
  173. trackColor: '#f2f2f2'
  174. });
  175. $('#easypiechart-red').easyPieChart({
  176. scaleColor: false,
  177. barColor: '#f9243f',
  178. lineWidth: 8,
  179. trackColor: '#f2f2f2'
  180. });
  181. });
  182. </script>
  183. {% endautoescape %}