Merge branch 'master' of https://github.com/sagidayan/SE-Hub into API_Dev

This commit is contained in:
Aran Zaiger 2015-07-02 21:42:55 +03:00
commit 259479cbee
15 changed files with 319 additions and 186 deletions

View file

@ -205,11 +205,55 @@ def oauth(oauth_token):
def login():
return github.authorize()
debug = True # Change In Production
if debug:
counter = 300
@app.route('/debug/login')
def set_local_token_view():
return app.send_static_file('DEBUG_Views/set_cookie.html')
@auto.doc()
@app.route('/debug/login')
def set_local_token_view():
"""
<span class="card-title">Go To This URL To Set The SE-Token Cookie</span>
<br>
<b>Route Parameters</b><br>
- token: None<br>
<br>
<b>Payload</b><br>
- None
<b>Response</b>
<br>
None.
"""
return app.send_static_file('DEBUG_Views/set_cookie.html')
@auto.doc()
@app.route('/debug/createUser/<string:gitHubUserName>')
def createUser(gitHubUserName):
"""
<span class="card-title">Go To This URL To Set The SE-Token Cookie</span>
<br>
<p>This User Will Automatically be added to JCE Campus as a Lecturer</p>
<b>Route Parameters</b><br>
- gitHubUserName: A Username<br>
<br>
<b>Payload</b><br>
- None
<b>Response</b>
<br>
None.
"""
try:
query = Campus.all().filter('title =', 'JCE')
for c in query.run(limit=1):
campus = c
user = User(name=";", username=gitHubUserName, isFirstLogin=False,
avatar_url='http://placekitten.com/g/200/'+str(counter), accessToken="RandomGitHubToken",
email='username@mailservice.com', campuses_id_list=[str(campus.key().id())],
seToken=str(uuid.uuid4()), isLecturer=True)
db.put(user)
return created(gitHubUserName + 'Was Created. Token: ' + user.seToken)
except Exception as e:
return bad_request(str(e))
@app.route('/api/qa/init')
def init_QA():

View file

@ -354,6 +354,51 @@ def getCoursesByUser(token, userId):
return Response(response='[]',
status=200,
mimetype="application/json")
@course_routes.route('/api/courses/getCoursesById/<string:token>/<string:courseId>', methods=['GET'])
@auto.doc()
def getCoursesByID(token, courseId):
"""
<span class="card-title">This Call will return A Course By ID</span>
<br>
<b>Route Parameters</b><br>
- seToken: 'seToken'<br>
- courseId: 1234354543<br>
<br>
<br>
<b>Payload</b><br>
- NONE <br>
<br>
<br>
<b>Response</b>
<br>
200 - JSON Array, Example:<br>
{ <br>
'title': 'JCE',<br>
'email_ending': '@post.jce.ac.il',<br>
'master_user_id': 123453433341, (User that created the campus)<br>
'avatar_url': 'http://some.domain.com/imagefile.jpg',<br>
'id' : 1234567890<br>
}<br>
<br>
403 - Invalid Token<br>
"""
user = get_user_by_token(token)
if user is None:
return bad_request("Bad user Token")
try:
course = Course.get_by_id(int(courseId))
except Exception as e:
return bad_request("Bad id format")
if course is None:
return bad_request("Bad Course Id")
return Response(response=course.to_JSON(),
status=200,
mimetype="application/json")
#----------------------------------------------------------
# PUT
#----------------------------------------------------------

View file

@ -77,8 +77,9 @@ def make_micro(stats, issues):
def get_issue_num(issues, user):
numOfIssues = 0
for issue in issues:
if issue['user']['login'] == user:
numOfIssues += 1
if issue['assignee']:
if issue['assignee']['login'] == user:
numOfIssues += 1
return numOfIssues
def get_github_data(repo_url, project_id):

View file

@ -143,7 +143,21 @@ def getMessagesByGroup(token, groupId):
},<br>
'id' : 1234567890,<br>
'master_id' : 1234567890,<br>
'isProject' : false<br>
'isProject' : false,<br>
'user': {<br>
'username': 'DarkLord',<br>
'name': 'Darth Vader',<br>
'email': 'darkLord@death.planet,<br>
'isLecturer': 'True',<br>
'seToken': 'xxxxxx-xxxxx-xxxxx-xxxxxx',<br>
'avatar_url': 'http://location.git.com/somthing'<br>
'isFirstLogin': False,<br>
'campuses_id_list': [43243532532,5325325325,532532342],<br>
'courses_id_list': [53523,43432423,432432432432]<br>
'id': 1234567890 <br>
},<br>
'group': {The Group Object Project OR Campus (according to isProject)}<br><br>
}<br>
</code>
<br>
@ -155,7 +169,7 @@ def getMessagesByGroup(token, groupId):
query = Message.all()
try:
query.filter("groupId = ", int(groupId))
query.filter("groupId =", int(groupId))
except Exception as e:
return bad_request("Bad id format")

View file

@ -2,6 +2,9 @@ import json
__author__ = 'Aran'
from google.appengine.ext import db
from models.User import User
from models.Project import Project
from models.Course import Course
class Message(db.Model):
groupId = db.IntegerProperty(required=True)
@ -11,6 +14,11 @@ class Message(db.Model):
isProject = db.BooleanProperty(default=False)
def to_JSON(self):
user = User.get_by_id(self.master_id)
if self.isProject:
group = Project.get_by_id(self.groupId)
else:
group = Course.get_by_id(self.groupId)
data = {
'groupId' : self.groupId,
'message' : self.message,
@ -23,6 +31,8 @@ class Message(db.Model):
},
'id' : self.key().id(),
'master_id' : self.master_id,
'isProject' : self.isProject
'isProject' : self.isProject,
'user': json.loads(user.to_JSON()),
'group': json.loads(group.to_JSON())
}
return json.dumps(data)

View file

@ -9,7 +9,7 @@ class Project(db.Model):
courseId = db.IntegerProperty(required=True)
master_id = db.IntegerProperty(required=True)
grade = db.IntegerProperty(required=True, default=0)
logo_url = db.StringProperty(required=False)
logo_url = db.StringProperty(required=False, default=None)
gitRepository = db.StringProperty(required=True)
membersId = db.StringListProperty(required=True)
info = db.TextProperty(required=False, default="{}")

View file

@ -424,11 +424,18 @@ body.noscroll
.messagesContent .msgSent
{
word-break: break-word;
padding-top: 2em;
}
.tabDesign
{
padding-left: 4px;
padding-right: 4px;
margin: 5px;
/*background-color: #f5f5f5;*/
overflow: scroll;
height:500;
/*width:690;*/
}
.tasksContent
@ -439,7 +446,7 @@ body.noscroll
background-color: aliceblue;
overflow: scroll;
overflow-y: visible;
height:250;
height:500;
width:340;
}
.messagesContent
@ -447,10 +454,10 @@ body.noscroll
padding-left: 4px;
padding-right: 4px;
margin: 5px;
background-color: #f5f5f5;
overflow: scroll;
height:250;
width:690;
/*background-color: #f5f5f5;*/
/*overflow: scroll;*/
height:500;
/*width:690;*/
}
p.tasksFeed
{

View file

@ -73,7 +73,7 @@ angular.module('SeHub')
jsonNewProj.logo_url = $scope.project.logoUrl;
apiService.create(token, jsonNewProj).success(function(data)
apiService.createProject(token, jsonNewProj).success(function(data)
{
loadingData = false;
projectId = data.id;

View file

@ -6,27 +6,21 @@ angular.module('SeHub')
$scope.msgToPost = "";
$scope.oldText = "";
$scope.messages = [];
$scope.messagesDisplay = [];
$scope.courses = [];
$scope.campuses = [];
$scope.msg = {};
$scope.courseObj = {};
// $scope.course = ""; // should be "" ? // {} ??
$rootScope.seToken = $cookies['com.sehub.www'];
var token = $rootScope.seToken;
var imagePath = $scope.user.avatar_url;
//var campusName = '';
// $scope.campusName = '';
$scope.phones = [
{ type: 'Home', number: '(972) 865-82861' },
{ type: 'Cell', number: '(972) 5251-32309' },
];
if($scope.user.isLecturer)
{
$scope.isStudent = false;
console.log("Lecturer Mode!");
// console.log($scope.campusName);
}
else
{
@ -40,31 +34,33 @@ angular.module('SeHub')
}
$scope.postMessageClicked = function() // Posting the message itself
{
if($scope.msg.msgToAdd != null)
console.log($scope.courseObj);
if($scope.msg.msgToAdd != null && $scope.courseObj.courseName)
{
console.log("NOW");
jsonNewMsg = {
'courseName': 'Math', // TODO Should be ===> $scope.course.courseName
'groupId': $scope.courseObj.id, // TODO Should be ===> $scope.courseObj.id
'message': $scope.msg.msgToAdd
};
// console.log("J: " + jsonNewMsg.toString() + "msg: " + $scope.msg.msgToAdd);
// apiService.createMessage(token, jsonNewMsg).success(function(data)
// {
// console.log("create Msg!");
// }).error(function(err)
// {
// console.log("Error: " + err);
// });
/*
'courseName': 'Advance Math',
'message': 'The lecture today is canceled'
*/
apiService.createMessage(token, jsonNewMsg).success(function(data)
{
console.log("create Msg!");
}).error(function(err)
{
console.log("Error Below");
console.log(err);
});
console.log($scope.msg.msgToAdd);
$scope.messages.push({"text": $scope.msg.msgToAdd});
}
else
{
$mdDialog.show($mdDialog.alert().title('Error Creating Message').content('Message content or Course is missing')
.ariaLabel('Send Message alert dialog').ok('Try Again!').targetEvent()); // Pop-up alert
}
$scope.msg.msgToAdd = null;
}
@ -81,22 +77,54 @@ angular.module('SeHub')
}
$scope.getCourses = function()
$scope.displayMessages = function()
{
// apiService.getAllCoursesByCampus(token, campusId).success(function(data) // Shows all classes from this campus
// apiService.getMessagesByGroupId(token, $scope.courseObj.id).success(function(data)
// {
// $scope.loadingData = false;
// $scope.courses = data;
// console.log("success " + $scope.courses);
// init(); // Executing the function to initialize course display
// if($scope.courses && $scope.courses.length > 0)
// {
// $scope.coursesEmpty = false;
// }
// $scope.messages = data;
// console.log($scope.messages);
// }).error(function(err)
// {
// console.log("error: " + err);
// });
// console.log(err);
// });
}
$scope.getCampuses = function()
{
apiService.getCampusesByUser(token).success(function(data)
{
$scope.campuses = data;
$scope.getCourses(); // Get all the courses info
if($scope.messages)
{
$scope.displayMessages(); // // Display all messages in message feed and the latest one
}
}).error(function(err)
{
console.log("Error: " + err);
});
}
$scope.getCourses = function()
{
for(var i = 0; i < $scope.campuses.length; i++)
{
apiService.getAllCoursesByCampus(token, $scope.campuses[i].id).success(function(data) // Shows all classes from this campus
{
$scope.loadingData = false;
$scope.courses = data;
// console.log($scope.courses);
if($scope.courses && $scope.courses.length > 0)
{
$scope.coursesEmpty = false;
}
}).error(function(err)
{
console.log("Error: " + err);
});
}
}
$scope.clearAllClicked = function() // Clear Screen from text
@ -106,16 +134,49 @@ angular.module('SeHub')
$scope.chooseCourseClicked = function()
{
console.log("choose course Clicked!!");
// console.log($scope.courseObj);
if($scope.courseObj)
{
for(var i = 0; i < $scope.courses.length; i++)
{
if($scope.courses[i].courseName === $scope.courseObj.name)
{
$scope.courseObj = $scope.courses[i];
}
}
}
console.log($scope.courseObj);
}
// $scope.chooseCourseClicked = function()
// {
// console.log("Click ");
// console.log($scope.choosenCourse);
// if($scope.choosenCourse)
// {
// console.log("here");
// $scope.courseObj = null;
// for(var i = 0; i < $scope.courses.length; i++)
// {
// if($scope.courses[i].courseName === $scope.choosenCourse)
// {
// $scope.courseObj = $scope.courses[i];
// console.log($scope.courseObj);
// }
// }
// }
// }
$scope.chooseProjectClicked = function()
{
console.log("choose project Clicked!!");
}
$scope.getCampuses(); // Get all the campuses info
// animation
// $scope.displayTasks(); // Display all tasks in task feed and the latest one
$scope.isEnterd = top.setIsEnterd;
$scope.getCourses(); // Get all the courses info
$scope.displayTasks(); // Display all tasks in task feed
}]);

View file

@ -1,5 +1,6 @@
angular.module('SeHub')
.controller('registerController', ['$scope', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', function($scope, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService, $rootScope) {
.controller('registerController', ['$scope', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope',
function($scope, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService, $rootScope) {
$scope.userHasNoName = false;
$scope.campusChecked = false;
$scope.createCampusClicked = false;
@ -36,7 +37,8 @@ angular.module('SeHub')
});
$scope.dropdownClicked = function() {
if ($scope.campus) {
$scope.createCampusClicked = false;
if($scope.campus) {
$scope.campusChecked = true;
$scope.campusObj = null;
for (var i = $scope.campuses.length - 1; i >= 0; i--) {
@ -46,7 +48,6 @@ angular.module('SeHub')
}
};
};
};
$scope.submitClicked = function(ev) {
@ -54,12 +55,8 @@ angular.module('SeHub')
if ($scope.user.AcMail != null) {
var fullMail = $scope.user.AcMail + $scope.campusObj.email_ending; // Holds the full academic email of the user
apiService.updateUser(token, $scope.user).success(function(data) {
}).error(function() {
// TODO Error
console.log("Error occured on updateUser");
});
console.log("Mail: " + fullMail);
@ -73,7 +70,6 @@ angular.module('SeHub')
.ok('Got it!')
.targetEvent(ev))
.then(function() {
// TODO ADD- delete cookies and redirect only after pressed 'Got it'
$cookieStore.remove("com.sehub.www"); // Removing the cookies
$window.location.href = 'http://se-hub.appspot.com'; // Reference to 'welcome' page
@ -114,7 +110,6 @@ angular.module('SeHub')
console.log("DONE - 200");
$mdDialog.show($mdDialog.alert().title('E-mail Verification').content('A verification e-mail has been sent to your email address.')
.ariaLabel('Email verification alert dialog').ok('Got it!').targetEvent(email)); // Pop-up alert for e-mail verification
// TODO ADD delete cookies and redirect only after pressed 'Got it'
$cookieStore.remove("com.sehub.www"); // Removing the cookies
$window.location.href = 'http://se-hub.appspot.com'; // Reference to 'welcome' page
}).error(function() {

View file

@ -53,8 +53,8 @@ service.factory('apiService', ['$http', function($http) {
};
return $http(req);
},
getAllMessages: function(token){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/courses/getAllMessages/" + token;
getMessagesByGroupId: function(token, groupId){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/messages/getMessagesByGroup/" + token + "/" + groupId;
req = {
method : "GET",
url : url
@ -134,7 +134,7 @@ service.factory('apiService', ['$http', function($http) {
};
return $http(req);
},
create: function(token, payLoad){ // createProject
createProject: function(token, payLoad){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/projects/create/" + token;
req = {
method : "POST",
@ -143,15 +143,6 @@ service.factory('apiService', ['$http', function($http) {
};
return $http(req);
},
createMessage: function(token, payLoad){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/courses/createMessage/" + token;
req = {
method : "POST",
url : url,
data: payLoad
};
return $http(req);
},
sendValidationMail: function(token, email){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/validation/sendmail/" + token;
payload = {
@ -189,6 +180,14 @@ service.factory('apiService', ['$http', function($http) {
data: payLoad
};
return $http(req);
},
getCampuseById: function(token, id){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/courses/getCoursesById/" + id;
req = {
method: "GET",
url: url
};
return $http(req);
}
};
}]);

View file

@ -34,7 +34,7 @@
<div ng-if="!isInCourse" layout-padding layout-margin>
<md-button ng-click = "joinCourse()" ng class = "md-raised md-primary"> Join Class</md-button>
</div>
<div ng-if = "user.isLecturer">
<!-- <div ng-if = "user.isLecturer"> -->
<md-content layout-padding layout-margin>
<md-button ng-click="createProjectClicked()" ng class="md-raised md-primary">Create Project</md-button>
</md-content>
@ -84,7 +84,7 @@
</div>
</md-card>
</div>
</div>
<!-- </div> -->
<div layout-margin>
</div>

View file

@ -1,8 +1,8 @@
<div layout-padding layout-margin>
<div>
<div class="loader" ng-if="loadingData">
<md-progress-circular md-mode="indeterminate"></md-progress-circular>
</div>
<md-content >
<md-content>
<md-card class="gray-font fadeOutUp" ng-if="isEnterd">
<div layout="row">
<div class="spacer"></div>
@ -25,75 +25,31 @@
<md-content>
<h1 style="margin-left:15px;"><i class="fa fa-dashboard"></i> Dash Board</h1>
</md-content>
<div layout = "column" flex = 90 layout-margin>
<div>
Closest Task-
<md-card layout-margin layout-padding>
Will Be Here
</md-card>
</div>
<div>
Latest Message-
<md-card layout-margin layout-padding>
Will Be Here
</md-card>
</div>
</div>
<div ng-if="user.isLecturer"> <!-- Lecturer Mode -->
<md-content>
<div layout="row">
<div flex="65">
<md-card>
<p class = "messagesFeed">Messages</p>
</md-card>
</div>
<div flex="34">
<md-card>
<p class = "tasksFeed">Tasks</p>
</md-card>
</div>
</div>
<div layout="row">
<div flex="65">
<md-card>
<div class = "messagesContent">
<md-card ng-repeat = "msg in messages">
<div layout="column">
<div layout="row" layout-margin layout-padding>
<div flex="10" class="md-avatar">
<img ng-src="{{user.avatar_url}}" style="width:100%">
</div>
<div flex>
<div layout = "column">
<div>
<b>{{user.name}}</b>
</div>
<div>
class_name
</div>
</div>
</div>
</div>
<div>
<div flex="69" class="msgSent" layout-margin layout-padding>
{{msg.text}}
</div>
</div>
</div>
</md-card>
</div>
</md-card>
</div>
<div flex="34">
<md-card>
<p class = "tasksContent">
For Task 3 Press: <a href="http://localhost:8080/home#/tasks">Task #3</a>
<br></br>
For Task 4 Press: <a href="http://localhost:8080/home#/home">Task #4</a>
<br></br>
For Task 5 Press: <a href="http://localhost:8080/home#/home">Task #5</a>
<br></br>
For Task 6 Press: <a href="http://localhost:8080/home#/home">Task #6</a>
<br></br>
For Task 7 Press: <a href="http://localhost:8080/home#/home">Task #7</a>
<br></br>
For Task 8 Press: <a href="http://localhost:8080/home#/home">Task #8</a>
</p>
</md-card>
</div>
</div>
<md-card height="70%">
<md-content class="md-padding">
<md-card>
<div flex = 90>
<md-content>
<md-tabs md-dynamic-height md-border-bottom>
<md-tab label="Messages">
<md-content class="md-padding">
<div class = "messagesContent">
<md-content class="tabDesign">
<md-content class="messagesContent">
<!-- <div class = "messagesContent"> -->
<md-card ng-repeat = "msg in messages">
<div layout="column">
<div layout="row" layout-margin layout-padding>
@ -106,24 +62,25 @@
<b>{{user.name}}</b>
</div>
<div>
class_name
{{c.courseName}}
</div>
</div>
</div>
</div>
<div>
<div flex="69" class="msgSent" layout-margin layout-padding>
<div flex="70" class="msgSent" layout-margin layout-padding>
{{msg.text}}
</div>
</div>
</div>
</md-card>
</div>
</md-content>
<!-- </div> -->
</md-content>
</md-tab>
<md-tab label="one">
<md-tab label="Tasks">
<md-content class="md-padding">
<h1 class="md-display-2">Tab One</h1>
<h1 class="md-display-2">Tasks</h1>
One
</md-content>
</md-tab>
@ -135,31 +92,34 @@
</md-tab>
</md-tabs>
</md-content>
</md-card>
<div class ="addMessage" layout="row" layout-margin layout padding>
<div>
<md-button ng-click="addMessageClicked()" ng class="md-raised md-primary"><i class="fa fa-comments"></i></md-button>
</div>
</md-card>
<div class ="addMessage" layout="row" layout-margin layout padding>
<div>
<md-button ng-click="addMessageClicked()" ng class="md-raised md-primary"><i class="fa fa-comments"></i></md-button>
</div>
</div>
<div ng-if="addMsg">
<div layout = "row" layout-margin layout padding layout-align = "left center">
<md-button ng-click="postMessageClicked()" ng class="md-raised md-primary">Post</md-button>
<md-button ng-click="clearAllClicked()" ng class="md-raised md-primary">Clear All</md-button>
</div>
<div class="port_spacer"></div>
<div layout-padding layout = "row">
<div flex = "60">
<md-input-container>
<label> Write Your Desired Message Here And Press Post</label>
<input type="text" minlength="1" ng-model="msg.msgToAdd" required></input>
</md-input-container>
</div>
<div flex = "30">
<md-select placeholder="Choose Course" ng-model="courseObj.name" ng-change="chooseCourseClicked()" style="z-index: 300" class="courseDropDown" required>
<md-option ng-repeat="c in courses" value="{{c.courseName}}">{{c.courseName}}</md-option>
</md-select>
</div>
</div>
<div ng-if="addMsg">
<div layout = "row" layout-margin layout padding layout-align = "left center">
<md-button ng-click="postMessageClicked()" ng class="md-raised md-primary">Post</md-button>
<md-button ng-click="clearAllClicked()" ng class="md-raised md-primary">Clear All</md-button>
</div>
<div class="port_spacer"></div>
<div layout-padding layout = "row">
<div flex = "60">
<md-input-container>
<label> Write Your Desired Message Here And Press Post</label>
<input type="text" minlength="1" ng-model="msg.msgToAdd" required></input>
</md-input-container>
</div>
<div flex = "30">
<md-select placeholder="Choose Course" ng-model="course" ng-click="chooseCourseClicked()" style="z-index: 300" class="courseDropDown"></md-select>
</div>
</div>
</div>
</md-content>
</div>
<!-- </md-content> -->
</div>
<div ng-if="isStudent"> <!-- Student Mode -->
<md-content>
@ -225,9 +185,9 @@
</div>
</div>
<!-- <md-button ng-click="chooseCourseClicked()" ng class="md-raised md-primary">Choose Course</md-button> -->
<md-select placeholder="Choose Course" ng-model="course" ng-click="chooseCourseClicked()" style="z-index: 300">
<!-- <md-select placeholder="Choose Course" ng-model="course" ng-click="chooseCourseClicked()" style="z-index: 300"> -->
<!-- <md-option ng-switch="user.isLecturer" ng-repeat="c in courses" value="{{c.title}}">{{c.title}}</md-option> -->
</md-select>
<!-- </md-select> -->
</md-content>
</div>
</div>

View file

@ -67,8 +67,8 @@
</md-content>
</md-tab>
<md-tab label="Commits">
<md-content class="md-padding">
<table style="width:100%;" border = "1" class = "tabDesign">
<md-content class="tabDesign">
<table style="width:100%;" border = "1">
<tr>
<th>Message</th>
<th style = "width:20%;">Date</th>
@ -98,7 +98,7 @@
</md-content>
</md-tab>
<md-tab label="Issues">
<md-content class="md-padding" style="overflow:scroll;">
<md-content class="tabDesign">
<table style="width:100%;" border = "1">
<tr>
<th>Title</th>

View file

@ -6,17 +6,14 @@
<md-content class="md-padding">
<md-tabs md-dynamic-height md-border-bottom>
<md-tab label="" <i class="fa fa-check"></i>
<md-content class="md-padding">
<table style="width:100%;" border = "1" class = "tabDesign">
<md-content class = "tabDesign">
<table style="width:100%;" border = "1">
<tr>
<th style = "width:20%">Task Name</th>
<th style = "width:20%">Date</th>
<th style = "width:20%">Grade</th>
</tr>
</table>
</md-content>
</md-tab>
<md-tab label="Delayed">