Skip to content

2
20_21-J09
Commit 71980c9f authored by IT17176798_Bhagya Dilhara's avatar IT17176798_Bhagya Dilhara
Browse files
Options

'updated_UI'

parent 790a9991
Show whitespace changes
Inline Side-by-side
Showing with 2458 additions and 383 deletions
.idea/20_21-j09.iml 0 → 100644
View file @ 71980c9f
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<sourceFolder url="file://$MODULE_DIR$/Core/app" isTestSource="false" packagePrefix="App\" />
<sourceFolder url="file://$MODULE_DIR$/Core/database/factories" isTestSource="false" packagePrefix="Database\Factories\" />
<sourceFolder url="file://$MODULE_DIR$/Core/database/seeders" isTestSource="false" packagePrefix="Database\Seeders\" />
<sourceFolder url="file://$MODULE_DIR$/spec" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
.idea/inspectionProfiles/Project_Default.xml 0 → 100644
View file @ 71980c9f
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
</profile>
</component>
\ No newline at end of file
.idea/modules.xml 0 → 100644
View file @ 71980c9f
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/20_21-j09.iml" filepath="$PROJECT_DIR$/.idea/20_21-j09.iml" />
</modules>
</component>
</project>
\ No newline at end of file
.idea/php.xml 0 → 100644
View file @ 71980c9f
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="PhpProjectSharedConfiguration" php_language_level="7.3" />
</project>
\ No newline at end of file
.idea/vcs.xml 0 → 100644
View file @ 71980c9f
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>
\ No newline at end of file
.idea/workspace.xml
View file @ 71980c9f
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="1a1b2fc9-e664-4b80-be31-181ccebefc6b" name="Default Changelist" comment="" />
<list default="true" id="1a1b2fc9-e664-4b80-be31-181ccebefc6b" name="Default Changelist" comment="">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/.gitignore" beforeDir="false" afterPath="$PROJECT_DIR$/UI/.gitignore" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/README.md" beforeDir="false" afterPath="$PROJECT_DIR$/UI/README.md" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/babel.config.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/babel.config.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/UI/package-lock.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/UI/package.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/public/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/UI/public/index.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/App.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/App.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/components/HelloWorld.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/components/HelloWorld.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/config/config.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/config/config.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/main.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/main.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/plugins/vuetify.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/plugins/vuetify.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/router.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/router.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/sass/main.scss" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/sass/main.scss" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/services/api.service.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/services/api.service.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/services/config.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/services/config.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/services/jwt.service.js" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/services/jwt.service.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/layout/Base.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/layout/Base.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/layout/Footer.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/layout/Footer.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/layout/Header.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/layout/Header.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/layout/SideBar.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/layout/SideBar.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/Activity.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/Activity.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/ActivityAnalytics.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/ActivityAnalytics.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/Dashboard.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/Dashboard.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/Login.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/Login.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/Reports.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/Reports.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/Student.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/Student.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/src/view/pages/StudentProfile.vue" beforeDir="false" afterPath="$PROJECT_DIR$/UI/src/view/pages/StudentProfile.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/UI/yarn.lock" beforeDir="false" afterPath="$PROJECT_DIR$/UI/yarn.lock" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="ComposerSettings">
<component name="ComposerSettings" synchronizationState="SYNCHRONIZE">
<pharConfigPath>$PROJECT_DIR$/Core/composer.json</pharConfigPath>
<execution />
</component>
<component name="Git.Settings">
......@@ -24,6 +55,8 @@
<property name="RunOnceActivity.ShowReadmeOnStart" value="true" />
<property name="WebServerToolWindowFactoryState" value="false" />
<property name="last_opened_file_path" value="$PROJECT_DIR$" />
<property name="node.js.detected.package.eslint" value="true" />
<property name="node.js.selected.package.eslint" value="(autodetect)" />
<property name="nodejs_package_manager_path" value="yarn" />
<property name="vue.rearranger.settings.migration" value="true" />
</component>
......@@ -35,7 +68,8 @@
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1613414107534</updated>
<workItem from="1613414111905" duration="649000" />
<workItem from="1613414111905" duration="2105000" />
<workItem from="1620655555354" duration="1293000" />
</task>
<servers />
</component>
......
UI/package.json
View file @ 71980c9f
......@@ -52,7 +52,9 @@
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
"rules": {
"no-debugger":"off"
}
},
"browserslist": [
"> 1%",
......
UI/src/main.js
View file @ 71980c9f
......@@ -2,7 +2,7 @@ import Vue from 'vue'
import App from './App.vue'
import router from "./router";
import vuetify from "./plugins/vuetify";
import { API_URL } from "@/services/config"
//import { API_URL } from "@/services/config"
import ApiService from './services/api.service'
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
......@@ -12,9 +12,6 @@ import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import Chat from 'vue-beautiful-chat'
import ApiService from '@/services/api.service';
ApiService.init();
// Make BootstrapVue available throughout your project
Vue.use(BootstrapVue)
// Optionally install the BootstrapVue icon components plugin
......@@ -22,7 +19,7 @@ Vue.use(IconsPlugin)
Vue.use(Chat)
import './sass/main.scss';
ApiService.init(API_URL)
ApiService.init()
Vue.config.productionTip = false
......
UI/src/router.js
View file @ 71980c9f
......@@ -41,7 +41,7 @@ export default new Router({
component: () => import("@/view/pages/Activity.vue"),
},
{
path: "/activity/analytics",
path: "/activity/analytics/:id",
name: "ActivityAnalytics",
component: () => import("@/view/pages/ActivityAnalytics.vue"),
},
......
UI/src/services/api.service.js
View file @ 71980c9f
<<<<<<< HEAD
import axios from 'axios'
// import { TokenService } from '@/services/token.service'
// import store from '@/store/'
=======
import Vue from "vue";
import axios from "axios";
import VueAxios from "vue-axios";
import JwtService from "./jwt.service";
//import { API_URL } from "@/core/services/config";
>>>>>>> bb6ef00918e4d58139578a3c10c6d8367b83c693
const ApiService = {
<<<<<<< HEAD
// Stores the 401 interceptor position so that it can be later ejected when needed
_401interceptor: null,
init (baseURL) {
axios.defaults.baseURL = baseURL
=======
init() {
Vue.use(VueAxios, axios);
Vue.axios.defaults.baseURL = 'http://localhost:8000/api/';
>>>>>>> bb6ef00918e4d58139578a3c10c6d8367b83c693
init () {
axios.defaults.baseURL = 'http://localhost:8000//api/'
},
setHeader () {
......
UI/src/view/layout/Base.vue
View file @ 71980c9f
......@@ -9,12 +9,12 @@
<router-view />
</v-app>
</transition>
<beautiful-chat :onMessageWasSent="onMessageWasSent" :messageList="messageList"
<!-- <beautiful-chat :onMessageWasSent="onMessageWasSent" :messageList="messageList"
:newMessagesCount="newMessagesCount" :participants="participants" :isOpen="isChatOpen"
:close="closeChat" :open="openChat" :showEmoji="true" :showFile="true" :showEdition="true" :showDeletion="true"
:showTypingIndicator="showTypingIndicator" :showLauncher="true" :showCloseButton="true"
:alwaysScrollToBottom="alwaysScrollToBottom" :messageStyling="messageStyling" @onType="handleOnType"
@edit="editMessage" />
@edit="editMessage" /> -->
<Footer></Footer>
</main>
</div>
......
UI/src/view/layout/Header.vue
View file @ 71980c9f
......@@ -2,9 +2,8 @@
<header>
<b-navbar type="dark" variant="dark">
<b-navbar-nav class="ml-auto">
<b-nav-item-dropdown text="Username" right>
<b-dropdown-item href="#">Settings</b-dropdown-item>
<b-dropdown-item href="#">Logout</b-dropdown-item>
<b-nav-item-dropdown :text="user && user.username" right>
<b-dropdown-item href="/login">Logout</b-dropdown-item>
</b-nav-item-dropdown>
</b-navbar-nav>
......@@ -13,6 +12,13 @@
</template>
<script>
export default {
data() {
return {
user:null
}
},
created() {
this.user = JSON.parse(window.localStorage.getItem('user'));
},
}
</script>
UI/src/view/layout/SideBar.vue
View file @ 71980c9f
......@@ -35,11 +35,11 @@
title: 'Activity Analytics',
icon: 'fas fa-chart-line'
},
{
href: '/reports',
title: 'Reports',
icon: 'fas fa-file-alt'
}
// {
// href: '/reports',
// title: 'Reports',
// icon: 'fas fa-file-alt'
// }
]
}
}
......
UI/src/view/pages/Activity.vue
View file @ 71980c9f
......@@ -3,7 +3,7 @@
<h4 class="text-uppercase mb-4">Activity data analytics</h4>
<div class="row">
<div class="col-12">
<div class="card mb-4">
<!-- <div class="card mb-4">
<div class="card-body">
<h4 class="text-dark font-weight-bold">Search Students</h4>
<b-form>
......@@ -24,8 +24,8 @@
</div>
</b-form>
</div>
</div>
<div class="card">
</div> -->
<!-- <div class="card">
<div class="card-body">
<b-table bordered hover :items="items" :filter="filter">
<template v-slot:cell(quiz_name)="row">
......@@ -33,38 +33,55 @@
</template>
</b-table>
</div>
</div>
</div> -->
<v-card>
<v-card-title>
<v-spacer></v-spacer>
<v-text-field
v-model="search"
append-icon="search"
label="Search"
single-line
hide-details
></v-text-field>
</v-card-title>
<v-data-table
:headers="headers"
:items="items"
:search="search"
>
<template v-slot:[`item.activity_title`]="{ item }">
<b-link href="#" :to="`/activity/analytics/${item.activity_id}`" >{{ item.activity_title }}</b-link>
</template>
</v-data-table>
</v-card>
</div>
</div>
</section>
</template>
<script>
import ApiService from '../../services/api.service'
export default {
components: {
},
data() {
return {
fields: ['ID', 'Quiz Name', 'Lesson', 'Subject', 'No of players'],
items: [{
id: 1,
quiz_name: 'Test 01',
lesson: 'xxx',
subject: 'maths',
no_of_players: 21
},
{
id: 2,
quiz_name: 'Test 02',
lesson: 'xxx',
subject: 'environment',
no_of_players: 55
},
],
search:null,
headers: [{text:'ID',value:'activity_id'}, {text:'Title',value:'activity_title'},
{text: 'Subject',value:'subject'},{text: 'No of players',value:'no_of_students'}],
items: [],
filter: null,
}
},
created() {
ApiService.get('quiz/activity-master')
.then(response => {
this.items = response.data
})
.catch(error => {
console.log(error)
})
},
}
</script>
\ No newline at end of file
UI/src/view/pages/ActivityAnalytics.vue
View file @ 71980c9f
......@@ -6,8 +6,8 @@
<div class="card">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between mb-4">
<h5 class="text-dark mb-o">75% Correct</h5>
<b-button type="button" variant="primary" class="text-white">Play Again</b-button>
<h5 class="text-dark mb-o">{{completed}}% is Completed</h5>
<!-- <b-button type="button" variant="primary" class="text-white">Play Again</b-button> -->
</div>
<canvas id="lastTest"></canvas>
</div>
......@@ -21,21 +21,21 @@
<h3 class="text-dark mb-0"><i class="fas fa-user-friends"></i></h3>
<h5 class="text-dark mb-0 ml-3">Players</h5>
</div>
<p class="text-muted mb-0">35</p>
<p class="text-muted mb-0">{{activity.no_of_students}}</p>
</div>
<div class="d-flex align-items-center border justify-content-between rounded p-3 my-4">
<div class="d-flex align-items-center">
<h3 class="text-dark mb-0"><i class="fas fa-question"></i></h3>
<h5 class="text-dark mb-0 ml-3">Questions</h5>
</div>
<p class="text-muted mb-0">35</p>
<p class="text-muted mb-0">{{activity.no_of_quiz}}</p>
</div>
<div class="d-flex align-items-center border justify-content-between rounded p-3">
<div class="d-flex align-items-center">
<h3 class="text-dark mb-0"><i class="far fa-clock"></i></h3>
<h5 class="text-dark mb-0 ml-3">Avg.time</h5>
</div>
<p class="text-muted mb-0">45 min</p>
<p class="text-muted mb-0">{{activity.avg_time}} min</p>
</div>
</div>
</div>
......@@ -44,17 +44,10 @@
<div class="card">
<div class="card-body">
<h4 class="mb-4">Need Help?</h4>
<div class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<h5 class="text-dark mb-0 ml-3">Dilhara</h5>
<p class="text-muted mb-0">15%</p>
</div>
<div class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<h5 class="text-dark mb-0 ml-3">Chamath</h5>
<p class="text-muted mb-0">23%</p>
</div>
<div class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<h5 class="text-dark mb-0 ml-3">Ajith</h5>
<p class="text-muted mb-0">23%</p>
<div v-for="(student,index) in lowStudents" :key="index"
class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<h5 class="text-dark mb-0 ml-3">{{student.info.first_name}} {{student.info.last_name}}</h5>
<p class="text-muted mb-0">{{student.marks}} - - Grade( {{student.grade}} )</p>
</div>
</div>
</div>
......@@ -63,24 +56,42 @@
<div class="card">
<div class="card-body">
<h4 class="mb-4">Diffcult Questions</h4>
<div class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<div>
<h5 class="text-dark mb-0">1 - quiz</h5>
<p class="text-muted mb-0">What is xxxxxxxxxxxxxxxxx ?</p>
</div>
<div>
<h4>+ 4</h4>
<b-link href="#">See more</b-link>
</div>
</div>
<div class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<div v-for="(quiz,index) in diffQuiz" :key="index"
class="d-flex align-items-center justify-content-between border rounded p-3 mb-3">
<div>
<h5 class="text-dark mb-0">2 - quiz</h5>
<p class="text-muted mb-0">What is xxxxxxxxxxxxxxxxx ?</p>
<h5 class="text-dark mb-0">{{index+1}} - quiz</h5>
<p class="text-muted mb-0" v-html="quiz.question"></p>
<b-link :class="quiz.visible ? null : 'collapsed'"
:aria-expanded="visible ? 'true' : 'false'"
:aria-controls="'collapse-'+ index"
@click="quiz.visible = !quiz.visible" href="#">Show more...</b-link>
<b-collapse :id="'collapse-'+ index" v-model="quiz.visible" class="mt-2">
<b-card>
<p>
<label for="answer1">Answer 1 :</label> <br>
<span v-html="quiz.first_answer"></span>
</p>
<p>
<label for="answer1">Answer 2 :</label> <br>
<span v-html="quiz.second_answer"></span>
</p>
<p>
<label for="answer1">Answer 3 :</label> <br>
<span v-html="quiz.third_answer"></span>
</p>
<p>
<label for="answer1">Answer 4 :</label> <br>
<span v-html="quiz.fourth_answer"></span>
</p>
<p>
<label for="answer1">Answer 5 :</label> <br>
<span v-html="quiz.fifth_answer"></span>
</p>
</b-card>
</b-collapse>
</div>
<div>
<h4>+ 6</h4>
<b-link href="#">See more</b-link>
</div>
</div>
......@@ -92,14 +103,59 @@
</template>
<script>
import Chart from 'chart.js';
import ApiService from '../../services/api.service'
export default {
name: "StudentProfile",
data() {
return {
chartData: [],
chartLabels: [],
activity: {
avg_time: 0,
no_of_students: 0,
no_of_quiz: 0
},
completed: 0,
lowStudents: [],
diffQuiz: []
}
},
created() {
ApiService.get('quiz/activity-master', this.$route.params.id)
.then(response => {
this.activity = response.data
})
.catch(error => {
console.log(error)
})
ApiService.get('quiz/completed', this.$route.params.id)
.then(response => {
this.completed = response.data.count.count
})
.catch(error => {
console.log(error)
})
ApiService.get('/quiz/lowStudents/' + this.$route.params.id)
.then(response => {
this.lowStudents = response.data.students
})
.catch(error => {
console.log(error)
})
ApiService.get('/quiz/diffquiz/' + this.$route.params.id)
.then(response => {
response.data.quiz.forEach(element => {
element.visible = false;
});
this.diffQuiz = response.data.quiz
})
.catch(error => {
console.log(error)
})
},
mounted() {
// this.showStudentProgress()
this.showLastTestPerfomance()
......@@ -110,10 +166,10 @@
new Chart(ctx, {
type: 'line',
data: {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
labels: [],
datasets: [{
label: 'Subjects',
data: [12, 19, 3, 5, 2, 3, 7],
label: 'Grades',
data: [],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
......@@ -133,26 +189,29 @@
borderWidth: 1
}]
},
// options: {
// scales: {
// yAxes: [{
// ticks: {
// beginAtZero: true
// }
// }]
// }
// }
});
},
showLastTestPerfomance() {
ApiService.get('quiz/rankings', this.$route.params.id)
.then(({
data
}) => {
const xAxis = []
const yAxis = []
data.forEach(element => {
xAxis.push(element.grade)
yAxis.push(element.count)
});
var ctx = document.getElementById('lastTest');
new Chart(ctx, {
type: 'pie',
data: {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
labels: xAxis,
datasets: [{
label: 'Subjects',
data: [12, 19, 3, 5, 2, 3, 7],
label: 'Grades',
data: yAxis,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
......@@ -182,6 +241,11 @@
// }
// }
});
})
.catch(error => {
console.log(error)
})
},
},
}
......
UI/src/view/pages/Dashboard.vue
View file @ 71980c9f
......@@ -16,7 +16,7 @@
<div class="card-body">
<p class="text-center text-dark mb-2" style="font-size: 4em;"><i class="fas fa-file-alt"></i></p>
<p class="text-center font-weight-bold text-dark">Activites</p>
<p class="text-center text-muted">110</p>
<p class="text-center text-muted">{{activityCount}}</p>
</div>
</div>
</div>
......@@ -25,7 +25,7 @@
<div class="card-body">
<p class="text-center text-dark mb-2" style="font-size: 4em;"><i class="fas fa-comments"></i></p>
<p class="text-center font-weight-bold text-dark">Comments</p>
<p class="text-center text-muted">256</p>
<p class="text-center text-muted">{{commentCount}}</p>
</div>
</div>
</div>
......@@ -52,6 +52,8 @@
chartData: [],
chartLabels: [],
studentCount: 0,
activityCount:0,
commentCount:0,
}
},
created() {
......@@ -62,14 +64,21 @@
},
methods: {
createChart() {
ApiService.get('common/activity/chart').then(( {data} ) => {
const xAxis =[]
const yAxis=[]
data.counts.forEach(element => {
xAxis.push(element.type)
yAxis.push(element.count)
});
var ctx = document.getElementById('myChart');
new Chart(ctx, {
type: 'bar',
data: {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
labels: xAxis,
datasets: [{
label: 'Subjects',
data: [12, 19, 3, 5, 2, 3, 7],
data: yAxis,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
......@@ -99,6 +108,8 @@
}
}
});
}).catch( e=> { console.log( e ); })
},
getStudentsCount() {
ApiService.get('/students/count').then(( {data} ) => {
......@@ -106,6 +117,16 @@
this.studentCount = data;
}).catch( e=> { console.log( e ); })
ApiService.get('common/activities/count').then(( {data} ) => {
this.activityCount = data.activityCount;
}).catch( e=> { console.log( e ); })
ApiService.get('common/comments/count').then(( {data} ) => {
this.commentCount = data.commentCount;
}).catch( e=> { console.log( e ); })
}
},
}
......
UI/src/view/pages/Login.vue
View file @ 71980c9f
......@@ -6,23 +6,21 @@
<div class="card">
<div class="card-body">
<h5>Log in Form</h5>
<b-link href="#" class="btn btn-danger w-100 mt-4 mb-3">Log in with Google</b-link>
<p class="text-center text-muted">---------------------------- &nbsp; &nbsp; Or &nbsp; &nbsp;----------------------------</p>
<b-form class="my-4">
<b-form-group class="mb-4">
<b-form-input type="email" placeholder="Username or Email" required></b-form-input>
<b-form-input v-model="form.email" type="email" placeholder="Username or Email" required></b-form-input>
</b-form-group>
<b-form-group class="mb-4">
<b-form-input placeholder="Password" required></b-form-input>
<b-form-input v-model="form.password" type="password" placeholder="Password" required></b-form-input>
</b-form-group>
<b-form-group class="mb-4">
<!-- <b-form-group class="mb-4">
<b-link href="#" to="">Forgot your Password?</b-link>
</b-form-group>
</b-form-group> -->
<div class="text-center">
<b-button type="submit" class="text-white px-4" variant="primary">Log in</b-button>
<b-button @click="onSubmit" class="text-white px-4" variant="primary">Log in</b-button>
</div>
</b-form>
</div>
......@@ -32,6 +30,44 @@
</div>
</section>
</template>
<script>
import ApiService from '@/services/api.service';
export default {
data() {
return {
form: {
email: null,
password: null
},
}
},
mounted(){
window.localStorage.removeItem('user');
},
methods: {
onSubmit(){
setTimeout(() => {
// send login request
ApiService.post('login', this.form)
// go to which page after successfully login
.then(({data}) => {
if (data.user != null) {
window.localStorage.setItem('user',JSON.stringify(data.user));
this.$router.push({ name: "dashboard" });
} else {
window.localStorage.removeItem('user');
window.location.reload();
}
})
.catch(() => {
window.localStorage.removeItem('user');
window.location.reload();
});
}, 2000);
}
},
}
</script>
<style>
body {
background: rgb(247 247 247);
......
UI/src/view/pages/Student.vue
View file @ 71980c9f
......@@ -3,81 +3,56 @@
<h4 class="text-uppercase mb-4">student analytics</h4>
<div class="row">
<div class="col-12">
<div class="card mb-4">
<div class="card-body">
<h4 class="text-dark font-weight-bold">Search Students</h4>
<b-form>
<div class="form-row">
<b-form-group label="Student #ID" class="col-4">
<b-form-input></b-form-input>
</b-form-group>
<b-form-group label="Student Name" class="col-4">
<b-form-input v-model="filter"></b-form-input>
</b-form-group>
<b-form-group label="Class #ID" class="col-4">
<b-form-input></b-form-input>
</b-form-group>
</div>
<div class="text-center">
<b-button type="submit" variant="primary" class="text-white">Search <i
class="fas fa-search ml-2"></i></b-button>
</div>
</b-form>
</div>
</div>
<div class="card">
<div class="card-body">
<b-table bordered hover :fields="fields" :items="items" :filter="filter">
<template v-slot:cell(name)="row">
<b-link href="#" :to="'/student/profile/'+ row.item.id">{{ row.item.name }}</b-link>
<v-card>
<v-card-title>
Students
<v-spacer></v-spacer>
<v-text-field
v-model="search"
append-icon="search"
label="Search"
single-line
hide-details
></v-text-field>
</v-card-title>
<v-data-table
:headers="headers"
:items="students"
:search="search"
>
<template v-slot:[`item.first_name`]="{ item }">
<b-link href="#" :to="'/student/profile/'+ item.student_id">{{ item.first_name }}</b-link>
</template>
</b-table>
</div>
</div>
</v-data-table>
</v-card>
</div>
</div>
</section>
</template>
<script>
<<<<<<< HEAD
import ApiService from '../../services/api.service'
export default {
data() {
return {
fields: ['id', 'Name', 'gender', 'branch', 'username'],
=======
import ApiService from '@/services/api.service';
export default {
data() {
return {
fields: ['ID', 'Name', 'Class', 'Contacts', 'Parent'],
>>>>>>> bb6ef00918e4d58139578a3c10c6d8367b83c693
items: [],
search: '',
headers: [
{text:'ID',value:'student_id'},
{text:'First Name',value:'first_name'},
{text:'Last Name',value:'last_name'},
{text:'Email',value:'email'},
{text:'Contact',value:'contact'},
{text:'Gender',value:'gender'},
{text:'Grade',value:'grade'}],
students: [],
filter: null,
}
},
<<<<<<< HEAD
created() {
this.populateStudents()
},
methods: {
populateStudents() {
ApiService.get('/students', 'all')
.then(response => {
this.items = response.data
})
.catch(error => {
console.log(error)
})
}
=======
created() {
ApiService.get('/students/all').then(({data})=>{
this.items = data;
this.students = data.students;
}).catch(e=>{
console.log(e);
......@@ -88,7 +63,6 @@ import ApiService from '../../services/api.service'
},
methods: {
>>>>>>> bb6ef00918e4d58139578a3c10c6d8367b83c693
},
}
</script>
\ No newline at end of file
UI/src/view/pages/StudentProfile.vue
View file @ 71980c9f
......@@ -8,10 +8,12 @@
<div class="d-flex align-items-start">
<img src="@/assets/profile-pic.png" class="img-fluid mr-3 rounded" alt="Student Profile picture">
<div>
<h5 class="text-dark mb-0">{{ student.name }}</h5>
<h5 class="text-dark mb-0">{{ student.first_name }} {{student.last_name}}</h5>
<p class="text-muted mb-0">{{ student.username }}</p>
<p class="text-muted mb-0">{{ student.branch }}</p>
<p class="text-muted mb-0">{{ student.phno }}</p>
<p class="text-muted mb-0">{{ student.email }}</p>
<p class="text-muted mb-0">{{ student.grade }}</p>
<p class="text-muted mb-0">{{ student.contact }}</p>
<p class="text-muted mb-0">Next Level Expectation: {{ nextLevel }}</p>
</div>
</div>
......@@ -24,7 +26,7 @@
<div class="card-body">
<p class="text-center text-dark mb-2" style="font-size: 4em;"><i class="fas fa-users"></i></p>
<p class="text-center font-weight-bold text-dark">Attendance</p>
<p class="text-center text-muted">{{ attendance }}%</p>
<p class="text-center text-muted">{{ attendance }}</p>
</div>
</div>
......@@ -32,9 +34,9 @@
<div class="col-3">
<div class="card mb-4">
<div class="card-body">
<p class="text-center text-dark mb-2" style="font-size: 4em;"><i class="fas fa-users"></i></p>
<p class="text-center text-dark mb-2" style="font-size: 4em;"><i class="fas fa-chart-area"></i></p>
<p class="text-center font-weight-bold text-dark">Works</p>
<p class="text-center text-muted">{{ works }}%</p>
<p class="text-center text-muted">{{ works.grade }}</p>
</div>
</div>
......@@ -72,6 +74,7 @@
works: null,
chartData: [],
chartLabels: [],
nextLevel:0
}
},
created() {
......@@ -84,7 +87,79 @@
},
methods: {
showStudentProgress() {
ApiService.get('/students/prediction/' + this.$route.params.id)
.then(({
data
}) => {
var ctx = document.getElementById('myChart');
if (data.result != null) {
let actual=[]; let predicted = [];
data.result .forEach(element => {
actual.push(element.actual);
predicted.push(element.predicted);
});
this.nextLevel = parseFloat(predicted[predicted.length - 1]) + parseFloat((parseFloat(predicted[predicted.length - 1]) - parseFloat(predicted[predicted.length - 2]))/2)
new Chart(ctx, {
type: 'line',
data: {
labels: ['Case 1', 'Case 2', 'Case 3', 'Case 4', 'Case 5'],
datasets: [{
label: ['Actual'],
data: actual,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
},
{
label: ['Predicted'],
data: predicted,
backgroundColor: [
'rgba(54, 162, 235, 0.2)',
'rgba(255, 99, 132, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(54, 162, 235, 1)',
'rgba(255, 99, 132, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}]
}
}
});
} else {
new Chart(ctx, {
type: 'line',
data: {
......@@ -121,16 +196,30 @@
}
}
});
}
});
},
showLastTestPerfomance() {
ApiService.get('/students/get-last-performance/' + this.$route.params.id)
.then(({
data
}) => {
const xAxis = []
const yAxis = []
data.forEach(element => {
xAxis.push(element.marks)
yAxis.push(element.subject)
});
console.log(data);
var ctx = document.getElementById('lastTest');
new Chart(ctx, {
type: 'pie',
data: {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
labels: yAxis,
datasets: [{
label: 'Subjects',
data: [12, 19, 3, 5, 2, 3, 7],
data: xAxis,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
......@@ -156,6 +245,11 @@
// }
// }
});
})
.catch(error => {
console.log(error)
})
},
populateProfile() {
ApiService.get('/students/view', this.$route.params.id)
......@@ -167,15 +261,15 @@
})
},
populateAttendanceWorks() {
ApiService.get('/students', 'get-attendance')
ApiService.get('/students/get-attendance/' + this.$route.params.id)
.then(response => {
this.attendance = response.data
this.attendance = response.data[0].count
})
.catch(error => {
console.log(error)
})
ApiService.get('/students', 'get-works')
ApiService.get('/students/get-works/'+ this.$route.params.id)
.then(response => {
this.works = response.data
})
......
UI/yarn.lock
View file @ 71980c9f
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment