Added Profile page

erpnext/public/js/education/lms/components/ProgressCard.vue

@@ -0,0 +1,69 @@
+<template>
+    <div class='card-deck mt-3'>
+    <div class="card">
+        <div class='card-body'>
+            <div class="row">
+            <div class="course-details col-xs-7 col-sm-8 col-md-9">
+                <router-link :to="'/Program/' + programData.name">
+                    <h5 class='card-title'>{{ programData.program }}</h5>
+                </router-link>
+                <span class="course-list text-muted" id="getting-started">
+                    Courses
+                    <ul class="mb-0 mt-1">
+                        <li v-for="item in programData.progress" :key="item.name">
+                            <span v-if="item.is_complete"><i class="text-success fa fa-check" aria-hidden="true"></i></span> 
+                            <span v-else><i class="text-secondary fa fa-circle-o" aria-hidden="true"></i></span> 
+                            {{ item.course_name }}
+                        </li>
+                    </ul>
+                </span>
+            </div>
+            <div class='course-buttons text-center col-xs-5 col-sm-4 col-md-3'>
+                <a-button
+                    v-if="programData.name == 'ECP2018'"
+                    :type="'success'"
+                    size="sm btn-block"
+                    :route="{name: 'home'}"
+                >
+                    Download Certificate
+                </a-button>
+            </div>
+        </div>
+        </div>
+    </div>
+</div>
+</template>
+<script>
+import AButton from './Button.vue';
+export default {
+    props: ['program'],
+    name: "ProgressCard",
+    data() {
+    	return {
+            programData: {}
+    	};
+    },
+    mounted() {
+        this.getProgramProgress().then(data => this.programData = data)
+    },
+    methods: {
+       getProgramProgress() {
+			return lms.call('get_program_progress', {
+                    program_name: this.program
+				})
+        },
+    },
+    components: {
+        AButton
+    },
+};
+</script>
+<style scoped>
+    a {
+        text-decoration: none;
+    }
+    li {
+        list-style-type: none;
+        padding: 0;
+    }
+</style>

erpnext/public/js/education/lms/pages/ProfilePage.vue

@@ -0,0 +1,93 @@
+<template>
+<div>
+	<section>
+		<div class='container'>
+			<div class="row">
+				<div class="col-sm-3 text-center">
+					<span class="sidebar-standard-image" title="Lorem Ipsum">
+						<div class="standard-image" style="background-color: #fafbfc;">
+							LP
+						</div>
+					</span>
+				</div>
+				<div class="col-sm-9">
+					<div>
+						<h3>Lorem Ipsum</h3>
+						<ul>
+							<li class="row">
+								<div class="col-md-3 col-sm-4 pr-0 text-muted">Email:</div>
+								<div class="col-md-9 col-sm-8">lorem@example.com</div>
+							</li>
+							<li class="row">
+								<div class="col-md-3 col-sm-4 pr-0 text-muted">Date of Joining:</div>
+								<div class="col-md-9 col-sm-8">18th July 2018</div>
+							</li>
+							<!-- <li><span class="text-muted">Date of Joining: </span>3rd July 2018</li> -->
+							<!-- <li><span class="text-muted">Programs Enrolled: </span>ERPNext Certified Professional 2018</li> -->
+							<li class="row">
+								<div class="col-md-3 col-sm-4 pr-0 text-muted">Programs Enrolled:</div>
+								<div class="col-md-9 col-sm-8">
+									<ul>
+										<li>Frappe Certified ERPNext Professional</li>
+										<li>Frappe Certified Developer</li>
+									</ul>
+								</div>
+							</li>
+						</ul>
+					</div>
+					<a href="" class="edit-button text-muted"><i class="fa fa-pencil" aria-hidden="true"></i></a>
+				</div>
+			</div>
+		</div>
+	</section>
+	<CardList :title="'Your Progress'" :description="''">
+        <ProgressCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/>
+    </CardList>
+</div>
+</template>
+<script>
+import Button from '../components/Button.vue';
+import TopSection from "../components/TopSection.vue"
+import CardList from "../components/CardList.vue"
+import ProgressCard from "../components/ProgressCard.vue"
+
+
+export default {
+    name: "ProfilePage",
+    components: {
+        AButton: Button,
+		TopSection,
+		CardList,
+		ProgressCard		
+	},
+	data() {
+		return {
+			enrolledPrograms: {},
+		}
+	},
+	mounted() {
+        this.getEnrolledPrograms().then(data => this.enrolledPrograms = data);
+    },
+    methods: {
+        getEnrolledPrograms() {
+            return lms.call("get_program_enrollments")
+        }
+    }
+};
+</script>
+<style scoped>
+	.edit-button{
+		position:absolute;
+		top:0;
+		right:0;
+	}
+	.standard-image {
+		font-size: 72px;
+		border-radius: 6px;
+	}
+	ul {
+        list-style-type: none;
+        padding: 0;
+		margin: 0
+    }
+</style>

erpnext/public/js/education/lms/routes.js

@@ -2,6 +2,7 @@ import Home from "./pages/Home.vue";
 import ProgramPage from "./pages/ProgramPage.vue";
 import ContentPage from "./pages/ContentPage.vue";
 import ListPage from "./pages/ListPage.vue";
+import ProfilePage from "./pages/ProfilePage.vue";
 
 const routes = [
 	{name: 'home', path: '', component: Home},
@@ -12,7 +13,7 @@ const routes = [
 		component: ContentPage,
 		props: true,
 		beforeEnter: (to, from, next) => {
-			if(!lms.store.isLogin){
+			if(!lms.store.checkLogin()){
 				next({name: 'home'})
 			}
 			else {
@@ -35,6 +36,12 @@ const routes = [
 		component: ListPage,
 		props: true
 	},
+	{
+		name: 'profile',
+		path: '/Profile',
+		component: ProfilePage,
+		props: true
+	}
 ];
 
 export default routes;