Skip to content

Commit eeeb55e

Browse files
deep9cdeep9c
committed
Projects and Tasks modules
1 parent a02bff9 commit eeeb55e

File tree

10 files changed

+498
-82
lines changed

10 files changed

+498
-82
lines changed

‎src/components/CreateTodo.vue‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@
1111
<input v-model="titleText" type='text' ref='title' defaultValue="">
1212
</div>
1313
<div class='field'>
14-
<label>Project</label>
15-
<input v-model="projectText" type='text' ref='project' defaultValue="">
14+
<label>Description</label>
15+
<input v-model="description" type='text' ref='project' defaultValue="">
1616
</div>
1717
<div class='ui two button attached buttons'>
1818
<button class='ui basic blue button' v-on:click="sendForm">
@@ -33,33 +33,32 @@ export default {
3333
data() {
3434
return {
3535
titleText: '',
36-
projectText: '',
36+
description: '',
3737
isCreating: false,
3838
};
3939
},
4040
methods: {
4141
openForm() {
42-
console.log("open form");
42+
//console.log("open form");
4343
this.isCreating = true;
4444
},
4545
closeForm() {
4646
this.isCreating = false;
4747
},
4848
sendForm() {
49-
console.log("send form " + this.titleText.length);
50-
if (this.titleText.length > 0 && this.projectText.length > 0) {
51-
console.log("inside if");
49+
//console.log("send form " + this.titleText.length);
50+
if (this.titleText.length > 0 && this.description.length > 0) {
5251
const title = this.titleText;
53-
const project = this.projectText;
52+
const description = this.description;
5453
this.$emit('add-todo', {
5554
title,
56-
project,
57-
done: false,
55+
description,
56+
status: 'pending',
5857
});
59-
console.log("add-todo event emitted");
58+
//console.log("add-todo event emitted");
6059
this.newTodoText = '';
6160
this.titleText='';
62-
this.projectText='';
61+
this.description='';
6362
}
6463
this.isCreating = false;
6564
},

‎src/components/Dashboard.vue‎

Lines changed: 213 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,104 +1,258 @@
11
<template>
2-
<div id="app">
2+
<div id="wrapper">
33
<!--<img src="./assets/logo.png">-->
4-
<!--<router-view></router-view>-->
5-
<p>Welcome {{user.username}}</p>
6-
<nav class="navbar navbar-default">
7-
<div class="container">
8-
<ul class="nav navbar-nav">
9-
<li><router-link to="/dashboard">Dashboard</router-link></li>
10-
<li><router-link to="/login" v-if="!user.authenticated">Login</router-link></li>
11-
<li><router-link to="/login" v-if="user.authenticated" v-on:click.native="logout">Logout</router-link></li>
12-
<li v-if="enrolledWorkspaces[selectedWorkspaceIndex]">{{enrolledWorkspaces[selectedWorkspaceIndex].name}}</li>
13-
</ul>
14-
</div>
15-
</nav>
16-
<todo-list v-bind:todos="todosarray"></todo-list>
17-
<create-todo v-on:add-todo="addTodo"></create-todo>
4+
<!--<router-view></router-view>-->
5+
6+
<!-- Top Navbar -->
7+
<Navbar v-bind:username="user.username" v-bind:selectedWsName="selectedWsName"></Navbar>
8+
9+
<!-- Projects in Sidebar -->
10+
<Sidebar v-bind:selectedWs="selectedWs" v-on:select-proj="selectProj"></Sidebar>
11+
12+
<!-- Page content -->
13+
<div id="page-content-wrapper">
14+
<div class="page-content">
15+
<div class="container-fluid">
16+
<div class="row">
17+
18+
<!-- Panel 1 -->
19+
<div class="col-md-6">
20+
<Tasks v-bind:tasks="tasks" v-bind:selectedWsId="selectedWs._id"
21+
v-bind:selectedProj="selectedProj" v-bind:username="user.username">
22+
</Tasks>
23+
</div>
24+
25+
<!-- Panel 2 -->
26+
<div class="col-md-6">
27+
<div class="panel panel-success">
28+
<div class="panel-heading">
29+
<!-- Panel 2 -->
30+
Comments
31+
</div>
32+
<div class="panel-body">
33+
<!-- content body -->
34+
Comments body
35+
</div>
36+
</div>
37+
</div>
38+
</div>
39+
</div>
40+
</div>
41+
</div>
42+
43+
1844
</div>
1945
</template>
2046

2147
<script>
2248
2349
import TodoList from './TodoList'
2450
import CreateTodo from './CreateTodo'
51+
import Navbar from './Navbar'
52+
import Sidebar from './Sidebar'
53+
import Tasks from './Tasks'
2554
import api from '../utils/api'
2655
2756
export default {
2857
name: 'Dashboard',
2958
components: {
3059
TodoList,
31-
CreateTodo
60+
CreateTodo,
61+
Navbar,
62+
Sidebar,
63+
Tasks
3264
},
3365
data () {
3466
return {
35-
todosarray: [
36-
{
37-
title: 'Todo A',
38-
project: 'Project 1',
39-
done: false
40-
},
41-
{
42-
title: 'Todo B',
43-
project: 'Project 2',
44-
done: false
45-
},
46-
{
47-
title: 'Todo C',
48-
project: 'Project 2',
49-
done: true
50-
},
51-
{
52-
title: 'Todo D',
53-
project: 'Project 3',
54-
done: false
55-
}
56-
],
67+
5768
//username: '',
5869
user: api.user,
5970
enrolledWorkspaces: [],
60-
selectedWorkspaceIndex: 0
71+
selectedWorkspaceIndex: -1,
72+
selectedWsName: '',
73+
selectedWs: {},
74+
selectedProj: {},
75+
tasks: {},
6176
};
6277
},
63-
beforeMount(){
78+
created(){
79+
//console.log('beforeCreate of Dashboard starts');
6480
this.user = api.user;
6581
//console.log('dashhhh:: ' + JSON.stringify(api.user.user));
66-
this.user.userdetails.user.WorkspaceIds.map((workspace,index)=>{
67-
api.getWorkspace(workspace.workspaceId)
82+
83+
84+
85+
var promise1 = this.user.userdetails.user.WorkspaceIds.map((workspace,index)=>{
86+
return api.getWorkspace(workspace.workspaceId)
6887
.then((resp)=>{
69-
console.log('getWorkspace response:-> ' + JSON.stringify(resp.data));
88+
//console.log('getWorkspace response:-> ' + JSON.stringify(resp.data));
7089
this.enrolledWorkspaces.push(resp.data);
71-
console.log('enrolledWorkspace ' +index+ ':: ' + JSON.stringify(this.enrolledWorkspaces));
90+
//console.log('enrolledWorkspace ' +index+ ':: ' + JSON.stringify(this.enrolledWorkspaces));
7291
});
7392
});
93+
7494
this.selectedWorkspaceIndex = this.user.userdetails.user.WorkspaceIds.findIndex((ws)=>{
75-
return ws.selected;
95+
return ws.selected; //return first index where workspace.selected=true
96+
});
97+
98+
Promise.all(promise1).then((results)=> {
99+
this.selectedWsName = this.enrolledWorkspaces[this.selectedWorkspaceIndex].name;
100+
this.selectedWs = this.enrolledWorkspaces[this.selectedWorkspaceIndex];
101+
var selectedProjIndex = this.enrolledWorkspaces[this.selectedWorkspaceIndex].projects.findIndex((proj)=>{
102+
return proj.selected;
103+
});
104+
this.selectedProj = this.enrolledWorkspaces[this.selectedWorkspaceIndex].projects[selectedProjIndex];
105+
106+
//console.log('getTasks req::-- ' + this.selectedWs._id+ '...' + this.selectedProj._id + '...' + this.user.username);
107+
api.getTasks(this.selectedWs._id,this.selectedProj._id, this.user.username)
108+
.then((resp)=>{
109+
//console.log('getTasks resp::- ' + JSON.stringify(resp.data));
110+
this.tasks = resp.data;
111+
});
112+
76113
});
114+
77115
116+
117+
//console.log('beforeCreate of Dashboard ends');
78118
},
79119
methods: {
80-
addTodo(newtodo) {
81-
console.log("addTodo() called");
82-
this.todosarray.push(newtodo);
120+
toggleMenu(e){
121+
e.preventDefault();
122+
$("#wrapper").toggleClass("active");
83123
},
84-
logout() {
85-
api.logout()
86-
.then((response)=>{
87-
this.$router.push('/login');
88-
});
124+
selectProj(index){
125+
//console.log('selectProj called with index = ' + index);
126+
this.selectedProj = this.enrolledWorkspaces[this.selectedWorkspaceIndex].projects[index];
127+
api.getTasks(this.selectedWs._id,this.selectedProj._id, this.user.username)
128+
.then((resp)=>{
129+
//console.log('getTasks resp::- ' + JSON.stringify(resp.data));
130+
this.tasks = resp.data;
131+
});
89132
},
133+
90134
},
91135
92136
}
93137
</script>
94138

95139
<style>
96-
#app {
97-
font-family: 'Avenir', Helvetica, Arial, sans-serif;
98-
-webkit-font-smoothing: antialiased;
99-
-moz-osx-font-smoothing: grayscale;
140+
#wrapper {
141+
padding-left: 250px;
142+
transition: all 0.4s ease 0s;
143+
}
144+
145+
#sidebar-wrapper {
146+
margin-left: -250px;
147+
top: 51px;
148+
left: 250px;
149+
width: 250px;
150+
background: #000;
151+
position: fixed;
152+
height: 100%;
153+
overflow-y: auto;
154+
z-index: 1000;
155+
transition: all 0.4s ease 0s;
156+
}
157+
158+
#wrapper.active {
159+
padding-left: 0;
160+
}
161+
162+
#wrapper.active #sidebar-wrapper {
163+
left: 0;
164+
}
165+
166+
#page-content-wrapper {
167+
width: 100%;
168+
padding-top: 70px;
169+
transition: all 0.4s ease 0s;
170+
}
171+
172+
.sidebar-nav {
173+
position: absolute;
174+
top: 0;
175+
width: 250px;
176+
list-style: none;
177+
margin: 0;
178+
padding: 0;
179+
}
180+
181+
.sidebar-nav li {
182+
line-height: 40px;
183+
text-indent: 20px;
184+
}
185+
186+
.sidebar-nav li a {
187+
color: #999999;
188+
display: block;
189+
text-decoration: none;
190+
padding-left: 60px;
191+
}
192+
193+
.sidebar-nav li a span:before {
194+
position: absolute;
195+
left: 0;
196+
color: #41484c;
100197
text-align: center;
101-
color: #2c3e50;
102-
margin-top: 60px;
198+
width: 20px;
199+
line-height: 18px;
200+
}
201+
202+
.sidebar-nav li a:hover,
203+
.sidebar-nav li.active {
204+
color: #fff;
205+
background: rgba(255,255,255,0.2);
206+
text-decoration: none;
207+
}
208+
209+
.sidebar-nav li a:active,
210+
.sidebar-nav li a:focus {
211+
text-decoration: none;
212+
}
213+
214+
.sidebar-nav > .sidebar-brand {
215+
height: 65px;
216+
line-height: 60px;
217+
font-size: 18px;
218+
}
219+
220+
.sidebar-nav > .sidebar-brand a {
221+
color: #999999;
222+
}
223+
224+
.sidebar-nav > .sidebar-brand a:hover {
225+
color: #fff;
226+
background: none;
103227
}
228+
229+
230+
231+
@media (max-width:767px) {
232+
233+
#wrapper {
234+
padding-left: 0;
235+
}
236+
237+
#sidebar-wrapper {
238+
left: 0;
239+
}
240+
241+
#wrapper.active {
242+
position: relative;
243+
left: 250px;
244+
}
245+
246+
#wrapper.active #sidebar-wrapper {
247+
left: 250px;
248+
width: 250px;
249+
transition: all 0.4s ease 0s;
250+
}
251+
252+
#menu-toggle {
253+
display: inline-block;
254+
}
255+
256+
}
257+
104258
</style>

‎src/components/GetStarted.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="panel-heading">
66
<div class="row">
77
<div class="col-xs-6">
8-
<a href="#" class="active" id="login-form-link" v-on:click="showLoginForm($event,this)">Login</a>
8+
<a href="#" class="active" id="login-form-link" v-on:click="showLoginForm($event)">Login</a>
99
</div>
1010
<div class="col-xs-6">
1111
<a href="#" id="register-form-link" v-on:click="showRegisterForm($event)">Register</a>

0 commit comments

Comments
 (0)