Starting with VueJS
diff --git a/erpnext/public/js/education/web-academy.js b/erpnext/public/js/education/web-academy.js
index 1bf325b..f37b8f0 100644
--- a/erpnext/public/js/education/web-academy.js
+++ b/erpnext/public/js/education/web-academy.js
@@ -8,9 +8,9 @@
Vue.use(VueRouter)
const routes = [
- {path: '', component: AcademyHome},
- {path: '/Program/:code', component: AcademyProgramPage, props: true},
- {path: '/Course', component: AcademyCoursePage},
+ {name: 'home', path: '', component: AcademyHome},
+ {name: 'program', path: '/Program/:code', component: AcademyProgramPage, props: true},
+ {name: 'content', path: '/Program/:code/:course/:type/:content', component: AcademyCoursePage, props: true},
];
const router = new VueRouter({
@@ -18,7 +18,7 @@
});
frappe.ready(() => {
- new Vue({
+ window.v = new Vue({
el: "#web-academy",
router: router,
template: "<academy-root/>",
diff --git a/erpnext/public/js/education/web-academy/AcademyRoot.vue b/erpnext/public/js/education/web-academy/AcademyRoot.vue
index e5edfb6..a6bfb98 100644
--- a/erpnext/public/js/education/web-academy/AcademyRoot.vue
+++ b/erpnext/public/js/education/web-academy/AcademyRoot.vue
@@ -1,6 +1,6 @@
<template>
<div id="academy-root">
- <router-view></router-view>
+ <router-view :key="$route.fullPath"></router-view>
</div>
</template>
<script>
diff --git a/erpnext/public/js/education/web-academy/pages/AcademyHome.vue b/erpnext/public/js/education/web-academy/pages/AcademyHome.vue
index 0a57ef2..b2a1ff1 100644
--- a/erpnext/public/js/education/web-academy/pages/AcademyHome.vue
+++ b/erpnext/public/js/education/web-academy/pages/AcademyHome.vue
@@ -1,17 +1,36 @@
<template>
<div>
- <AcademyTopSection/>
- <AcademyCardList/>
+ <AcademyTopSection :title="title" :description="description"/>
+ <AcademyList :title="'Featured Programs'" :description="'Master ERPNext'">
+ <AcademyProgramCard v-for="program in featured_programs" :key="program.name" :program_code="program"/>
+ </AcademyList>
</div>
</template>
<script>
import AcademyTopSection from "../components/AcademyTopSection.vue"
-import AcademyCardList from "../components/AcademyCardList.vue"
+import AcademyList from "../components/AcademyList.vue"
+import AcademyProgramCard from "../components/AcademyProgramCard.vue"
export default {
name: "AcademyHome",
+ data() {
+ return{
+ title: '',
+ description: '',
+ featured_programs: []
+ }
+ },
components: {
- AcademyTopSection, AcademyCardList
- }
+ AcademyTopSection, AcademyList, AcademyProgramCard
+ },
+ mounted() {
+ frappe.call("erpnext.www.academy.get_portal_details").then(r => {
+ this.title = r.message.title,
+ this.description = r.message.description
+ });
+ frappe.call("erpnext.www.academy.get_featured_programs").then(r => {
+ this.featured_programs = r.message
+ });
+ },
};
</script>
\ No newline at end of file