dashboard: improve overall design
This commit is contained in:
parent
e9a08dde9e
commit
25183e2248
@ -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}">
|
||||
💻
|
||||
</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>
|
||||
|
@ -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
|
||||
});
|
||||
}
|
||||
|
Reference in New Issue
Block a user