dashboard: improve overall design

This commit is contained in:
nemunaire 2019-03-26 02:23:04 +01:00
parent e9a08dde9e
commit 25183e2248
2 changed files with 23 additions and 14 deletions

View File

@ -8,7 +8,7 @@
.login {
overflow-x: hidden;
text-overflow: ellipsis;
max-width: 52%;
max-width: 84%;
display: inline-block;
vertical-align: middle;
white-space: nowrap;
@ -22,12 +22,15 @@
background-position: center;
background-repeat: no-repeat;
background-size: cover;
height: 8rem;
margin-bottom: -70px
height: 8.5rem;
margin-bottom: -60px;
}
.card-title {
margin-bottom: 0;
}
.student {
margin-left: 3px;
width: 250px;
margin-left: 0.3%;
width: 16.3%;
}
</style>
<base href="/">
@ -35,21 +38,17 @@
<body>
<div ng-controller="StudentsController" ng-cloak>
<div class="card float-left mt-1 student" ng-repeat="student in students">
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/{{ student.login | lowercase }}')"></div>
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/{{ student.login | lowercase }}')" ng-if="student.login != 'nemunaire'"></div>
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/mercie_d')" ng-if="student.login == 'nemunaire'"></div>
<div class="card-body">
<h5 class="card-title" ng-controller="PingController">
<span class="login" title="{{ student.login }}">{{ student.login }}</span>
<span class="badge badge-success float-right" ng-if="PING">
Reachable
</span>
<span class="badge badge-danger float-right" ng-if="!PING">
Unreachable
<span class="badge float-right" ng-class="{'badge-success': PING, 'badge-danger': !PING}">
&#x1f4bb;
</span>
</h5>
<div ng-controller="ProgressionController">
<span class="badge ml-1" ng-repeat="(ch,t) in tuto_progress[1]" ng-class="{'badge-success': mychallenges[ch], 'badge-danger': !mychallenges[ch]}">
<span title="{{ t.title }}" ng-bind="t.label"></span>
</span>
<span class="badge ml-1" ng-repeat="(ch,t) in tuto_progress[tutoid]" ng-class="{'badge-success': mychallenges[ch] && mychallenges[ch].recent, 'badge-warning': mychallenges[ch] && !mychallenges[ch].recent, 'badge-danger': !mychallenges[ch]}" title="{{ t.title }} @ {{ mychallenges[ch].time | date: 'medium' }}" ng-bind="t.label"></span>
</div>
</div>
</div>

View File

@ -31,6 +31,9 @@ angular.module("AdLinApp", ["ngResource", "ngSanitize"])
});
angular.module("AdLinApp")
.run(function($rootScope, $location) {
$rootScope.tutoid = 1;
})
.controller("StudentsController", function($scope, $interval, Student) {
$scope.students = Student.query();
var refreshStd = function() {
@ -62,7 +65,14 @@ angular.module("AdLinApp")
$scope.tuto_progress = tuto_progress;
$scope.mychallenges = {};
var refreshChal = function() {
var recent = new Date(Date.now() - 120000);
$http.get("/api/students/" + $scope.student.id + "/progress").then(function(response) {
angular.forEach(response.data, function(ch, chid) {
if (ch.time) {
response.data[chid].time = new Date(ch.time);
response.data[chid].recent = recent < response.data[chid].time;
}
});
$scope.mychallenges = response.data
});
}