Commit 96fbb81b authored by Tim Honcoop's avatar Tim Honcoop
Browse files

Added excluded from breadcrumb

parent a0f2b26f
Pipeline #2522 failed with stages
in 1 minute and 1 second
...@@ -250,7 +250,7 @@ export default { ...@@ -250,7 +250,7 @@ export default {
TopbarNav, TopbarNav,
BackButton, BackButton,
MultiSelect, MultiSelect,
Datepicker, Datepicker
}, },
data() { data() {
return { return {
...@@ -258,7 +258,7 @@ export default { ...@@ -258,7 +258,7 @@ export default {
isPrimary: false, isPrimary: false,
level: 0, level: 0,
top_nav: [], top_nav: [],
level_0: ["/home", "/settings",], level_0: ["/home", "/settings"],
platforms: store.state.platforms, platforms: store.state.platforms,
bottom_nav: nav.bottom_items, bottom_nav: nav.bottom_items,
testCount: 5, testCount: 5,
...@@ -276,7 +276,7 @@ export default { ...@@ -276,7 +276,7 @@ export default {
action: { action: {
date: null, date: null,
title: "", title: "",
description: "", description: ""
}, },
actionToDelete: {}, actionToDelete: {},
...@@ -294,24 +294,24 @@ export default { ...@@ -294,24 +294,24 @@ export default {
filterOptions: [ filterOptions: [
{ {
text: "No filter", text: "No filter",
id: "no_filter", id: "no_filter"
}, },
{ {
text: "Has paid only", text: "Has paid only",
id: "has_paid", id: "has_paid"
}, }
], ],
cohorts: [{ name: "Cohorts not yet implemented", id: "no_cohort", },], cohorts: [{ name: "Cohorts not yet implemented", id: "no_cohort" }],
selectedCohort: "no_cohort", selectedCohort: "no_cohort",
countries: [{ name: "Netherlands", id: 1, }, { name: "Germany", id: 2, },], countries: [{ name: "Netherlands", id: 1 }, { name: "Germany", id: 2 }],
selectedCountries: [], selectedCountries: [],
selectedCourse: settings.course_default, selectedCourse: settings.course_default,
selectedSubitem: "", selectedSubitem: "",
// Mock // Mock
courses: { courses: {
coursera: [], coursera: []
}, }
}; };
}, },
beforeMount() { beforeMount() {
...@@ -325,7 +325,7 @@ export default { ...@@ -325,7 +325,7 @@ export default {
this.courses.coursera.push({ this.courses.coursera.push({
name: course.course_name, name: course.course_name,
description: "", description: "",
slug: course.course_slug, slug: course.course_slug
}); });
} }
util util
...@@ -340,7 +340,7 @@ export default { ...@@ -340,7 +340,7 @@ export default {
}, },
mounted() { mounted() {
this.platformOptions = [ this.platformOptions = [
{ value: settings.platform_default, text: strings.select_platform, }, { value: settings.platform_default, text: strings.select_platform }
]; ];
this.setPlatforms(); this.setPlatforms();
...@@ -358,18 +358,21 @@ export default { ...@@ -358,18 +358,21 @@ export default {
var routes = []; var routes = [];
var path = ""; var path = "";
for (var subroute of this.$route.path.split("/")) { for (var subroute of this.$route.path.split("/")) {
if (subroute !== strings.home && subroute !== "compare") {
path += subroute + "/"; path += subroute + "/";
if (
subroute !== strings.home &&
settings.excludeFromBreadcrumb.indexOf(subroute) === -1
) {
routes.push({ routes.push({
text: subroute.charAt(0).toUpperCase() + subroute.slice(1), text: subroute.charAt(0).toUpperCase() + subroute.slice(1),
to: path.substring(0, path.length - 1), to: path.substring(0, path.length - 1)
}); });
} }
} }
routes[0].text = strings.home; routes[0].text = strings.home;
routes[0].to = "/"; routes[0].to = "/";
return routes; return routes;
}, }
}, },
methods: { methods: {
saveAction() { saveAction() {
...@@ -401,7 +404,7 @@ export default { ...@@ -401,7 +404,7 @@ export default {
this.action = { this.action = {
date: null, date: null,
title: "", title: "",
description: "", description: ""
}; };
this.showAddActionModal = false; this.showAddActionModal = false;
this.showActionsModal = true; this.showActionsModal = true;
...@@ -586,8 +589,8 @@ export default { ...@@ -586,8 +589,8 @@ export default {
this.courseOptions = [ this.courseOptions = [
{ {
value: settings.course_default, value: settings.course_default,
text: strings.select_course, text: strings.select_course
}, }
]; ];
}, },
setPlatforms() { setPlatforms() {
...@@ -595,17 +598,17 @@ export default { ...@@ -595,17 +598,17 @@ export default {
this.top_nav[0].push({ this.top_nav[0].push({
name: strings.home, name: strings.home,
icon: "cui-home", icon: "cui-home",
url: "/home", url: "/home"
}); });
for (var platform of this.platforms) { for (var platform of this.platforms) {
this.top_nav[0].push({ this.top_nav[0].push({
name: platform.name, name: platform.name,
url: "/p/" + platform.id, url: "/p/" + platform.id,
icon: "fa fa-line-chart", icon: "fa fa-line-chart"
}); });
this.platformOptions.push({ this.platformOptions.push({
value: platform.id, value: platform.id,
text: platform.name, text: platform.name
}); });
} }
}, },
...@@ -613,21 +616,21 @@ export default { ...@@ -613,21 +616,21 @@ export default {
this.courseOptions = [ this.courseOptions = [
{ {
value: settings.course_default, value: settings.course_default,
text: strings.select_course, text: strings.select_course
}, }
]; ];
this.top_nav[2] = []; this.top_nav[2] = [];
for (var course of c) { for (var course of c) {
// Push to dropdown // Push to dropdown
this.courseOptions.push({ this.courseOptions.push({
value: course.slug, value: course.slug,
text: course.name, text: course.name
}); });
// Push to navbar // Push to navbar
this.top_nav[2].push({ this.top_nav[2].push({
name: course.name, name: course.name,
url: "/p/" + this.selectedPlatform + "/" + course.slug, url: "/p/" + this.selectedPlatform + "/" + course.slug,
icon: "fa fa-line-chart", icon: "fa fa-line-chart"
}); });
} }
}, },
...@@ -643,7 +646,7 @@ export default { ...@@ -643,7 +646,7 @@ export default {
"/" + "/" +
this.selectedCourse + this.selectedCourse +
"/" + "/" +
coursepPage.slug, coursepPage.slug
}); });
} }
}, },
...@@ -663,7 +666,7 @@ export default { ...@@ -663,7 +666,7 @@ export default {
this.selectedCourse + this.selectedCourse +
"/videos/" + "/videos/" +
video.item_id, video.item_id,
icon: "fa fa-video-camera", icon: "fa fa-video-camera"
}); });
this.$forceUpdate(); this.$forceUpdate();
} }
...@@ -690,7 +693,7 @@ export default { ...@@ -690,7 +693,7 @@ export default {
quiz.base_id + quiz.base_id +
"-" + "-" +
quiz.version, quiz.version,
icon: "fa fa-check ", icon: "fa fa-check "
}); });
this.$forceUpdate(); this.$forceUpdate();
} }
...@@ -718,7 +721,7 @@ export default { ...@@ -718,7 +721,7 @@ export default {
this.selectedCourse + this.selectedCourse +
"/assignments/" + "/assignments/" +
assignment.item_id, assignment.item_id,
icon: "cui-calendar ", icon: "cui-calendar "
}); });
this.$forceUpdate(); this.$forceUpdate();
} }
...@@ -727,8 +730,8 @@ export default { ...@@ -727,8 +730,8 @@ export default {
this.top_nav[4] = []; this.top_nav[4] = [];
console.log(err); console.log(err);
}); });
}, }
}, }
}; };
</script> </script>
......
...@@ -18,7 +18,13 @@ export default { ...@@ -18,7 +18,13 @@ export default {
resources: [{ resources: [{
name: "Coursera for Educators", name: "Coursera for Educators",
link: "https://blog.coursera.org/for-educators/", link: "https://blog.coursera.org/for-educators/",
}, ], },],
// Subroutes excluded the breadcrumb
excludeFromBreadcrumb: [
"compare",
"p",
],
// Constants // Constants
quiz_id: 5, quiz_id: 5,
...@@ -35,5 +41,5 @@ export default { ...@@ -35,5 +41,5 @@ export default {
}, { }, {
name: "Admin", name: "Admin",
id: "admin", id: "admin",
}, ], },],
} }
...@@ -4,13 +4,21 @@ ...@@ -4,13 +4,21 @@
<b-row> <b-row>
<b-col class="title-col" sm="12" md="6" lg="9"> <b-col class="title-col" sm="12" md="6" lg="9">
<h1 v-bind:style="{ 'color': mainColor}">{{ this.courseName }}</h1> <h1 v-bind:style="{ 'color': mainColor}">{{ this.courseName }}</h1>
<a v-bind:style="{ 'color': mainColor}" :href="`https://www.coursera.org/teach/${courseSlug}/content/`" target="_blank">Coursera editing</a> - <a
<a v-bind:style="{ 'color': mainColor}" :href="`https://www.coursera.org/teach/${courseSlug}/analytics/`" target="_blank">Coursera analytics</a> v-bind:style="{ 'color': mainColor}"
:href="`https://www.coursera.org/teach/${courseSlug}/content/`"
target="_blank"
>Coursera editing</a> -
<a
v-bind:style="{ 'color': mainColor}"
:href="`https://www.coursera.org/teach/${courseSlug}/analytics/`"
target="_blank"
>Coursera analytics</a>
</b-col> </b-col>
<!-- Course comparison button --> <!-- Course comparison button -->
<b-col v-if="showCompare" sm="12" md="6" lg="3"> <b-col v-if="showCompare" sm="12" md="6" lg="3">
<div class="link-container"> <div class="link-container">
<router-link :to=compareUrl> <router-link :to="compareUrl">
<b-card class="link-card"> <b-card class="link-card">
<table> <table>
<tr> <tr>
...@@ -35,8 +43,14 @@ ...@@ -35,8 +43,14 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-users icon-color p-4 font-2xl mr-3"></i> <i class="fa fa-users icon-color p-4 font-2xl mr-3"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="enrolled-learners">{{ enrolledStudents }}</div> <div
<div class="text-muted text-uppercase font-weight-bold text-font-size">Enrolled learners</div> v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="enrolled-learners"
>{{ enrolledStudents }}</div>
<div
class="text-muted text-uppercase font-weight-bold text-font-size"
>Enrolled learners</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
</b-col> </b-col>
...@@ -47,13 +61,20 @@ ...@@ -47,13 +61,20 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-user-times icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-user-times icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="leaving-learners">{{ leavingLearners }}</div> <div
<div class="text-muted text-uppercase font-weight-bold text-font-size">Leaving learners</div> v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="leaving-learners"
>{{ leavingLearners }}</div>
<div
class="text-muted text-uppercase font-weight-bold text-font-size"
>Leaving learners</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
<b-tooltip v-if="tooltips" target="leaving-learners-card"> <b-tooltip
{{ strings.leaving_learners_text }} v-if="tooltips"
</b-tooltip> target="leaving-learners-card"
>{{ strings.leaving_learners_text }}</b-tooltip>
</b-col> </b-col>
<b-col sm="12" md="6" lg="3" v-if="qdt"> <b-col sm="12" md="6" lg="3" v-if="qdt">
...@@ -62,7 +83,11 @@ ...@@ -62,7 +83,11 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-money icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-money icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="leaving-learners">{{ payingLearners }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="leaving-learners"
>{{ payingLearners }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Paying learners</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Paying learners</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
...@@ -74,8 +99,14 @@ ...@@ -74,8 +99,14 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-check icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-check icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="finished-learners">{{ finishedLearners }}</div> <div
<div class="text-muted text-uppercase font-weight-bold text-font-size">Finished learners</div> v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="finished-learners"
>{{ finishedLearners }}</div>
<div
class="text-muted text-uppercase font-weight-bold text-font-size"
>Finished learners</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
</b-col> </b-col>
...@@ -86,7 +117,11 @@ ...@@ -86,7 +117,11 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-video-camera icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-video-camera icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-videos">{{ numberOfVideos }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-videos"
>{{ numberOfVideos }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Videos</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Videos</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
...@@ -98,7 +133,11 @@ ...@@ -98,7 +133,11 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-question icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-question icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-quizzes">{{ numberOfQuizzes }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-quizzes"
>{{ numberOfQuizzes }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Quizzes</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Quizzes</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
...@@ -110,7 +149,11 @@ ...@@ -110,7 +149,11 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-pencil icon-color p-4 font-2xl mr-0 float-left"></i> <i class="fa fa-pencil icon-color p-4 font-2xl mr-0 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-assignments">{{ numberOfAssignments }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-assignments"
>{{ numberOfAssignments }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Assignments</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Assignments</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
...@@ -122,7 +165,11 @@ ...@@ -122,7 +165,11 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-th-list icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-th-list icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-modules">{{ numberOfModules }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-modules"
>{{ numberOfModules }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Modules</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Modules</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
...@@ -134,13 +181,15 @@ ...@@ -134,13 +181,15 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-calendar icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-calendar icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-cohorts">{{ numberOfCohorts }}</div> <div
v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-cohorts"
>{{ numberOfCohorts }}</div>
<div class="text-muted text-uppercase font-weight-bold text-font-size">Cohorts</div> <div class="text-muted text-uppercase font-weight-bold text-font-size">Cohorts</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
<b-tooltip v-if="tooltips" target="cohort-card"> <b-tooltip v-if="tooltips" target="cohort-card">{{ strings.cohort_text }}</b-tooltip>
{{ strings.cohort_text }}
</b-tooltip>
</b-col> </b-col>
<b-col sm="12" md="6" lg="3"> <b-col sm="12" md="6" lg="3">
...@@ -149,15 +198,18 @@ ...@@ -149,15 +198,18 @@
<span class="iconsquare" v-bind:style="{ 'background-color': mainColor}"> <span class="iconsquare" v-bind:style="{ 'background-color': mainColor}">
<i class="fa fa-calendar icon-color p-4 font-2xl mr-3 float-left"></i> <i class="fa fa-calendar icon-color p-4 font-2xl mr-3 float-left"></i>
</span> </span>
<div v-bind:style="{ 'color': mainColor}" class="h5 text-color mb-0 pt-3" id="no-cohorts">{{ avgTime }}</div> <div
<div class="text-muted text-uppercase font-weight-bold text-font-size">Average active timespan (in days)</div> v-bind:style="{ 'color': mainColor}"
class="h5 text-color mb-0 pt-3"
id="no-cohorts"
>{{ avgTime }}</div>
<div
class="text-muted text-uppercase font-weight-bold text-font-size"
>Average active timespan (in days)</div>
</b-card-body> </b-card-body>
</b-card> </b-card>
<b-tooltip v-if="tooltips" target="timespan-card"> <b-tooltip v-if="tooltips" target="timespan-card">{{ strings.timespan_text }}</b-tooltip>
{{ strings.timespan_text }}
</b-tooltip>
</b-col> </b-col>
</b-row> </b-row>
<b-row> <b-row>
...@@ -165,7 +217,7 @@ ...@@ -165,7 +217,7 @@
<b-col lg="12" xl="8"> <b-col lg="12" xl="8">
<b-card id="geo-data" header="Geographical location of learners"> <b-card id="geo-data" header="Geographical location of learners">
<div class="chart-wrapper"> <div class="chart-wrapper">
<chart :data=geoData :layout=geoLayout id="graph-5"></chart> <chart :data="geoData" :layout="geoLayout" id="graph-5"></chart>
</div> </div>
</b-card> </b-card>
</b-col> </b-col>
...@@ -173,7 +225,7 @@ ...@@ -173,7 +225,7 @@
<b-col lg="6" xl="4"> <b-col lg="6" xl="4">
<b-card id="dist-eval" header="Distribution of evaluation rating"> <b-card id="dist-eval" header="Distribution of evaluation rating">
<div class="chart-wrapper"> <div class="chart-wrapper">
<chart :data=distEvalRateData :layout=distEvalLayout id="graph-1"></chart> <chart :data="distEvalRateData" :layout="distEvalLayout" id="graph-1"></chart>
</div> </div>
</b-card>