Skip to content

Commit 989dcb9

Browse files
deep9cdeep9c
committed
Projects and Comments modules
1 parent eeeb55e commit 989dcb9

File tree

10 files changed

+328
-27
lines changed

10 files changed

+328
-27
lines changed

‎index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html>
33
<head>
44
<meta charset="utf-8">
5-
<title>intelligent-task-manager</title>
5+
<title>OneTask</title>
66

77
<!-- CSS imports -->
88
<script

‎src/components/Comments.vue‎

Lines changed: 167 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
<template>
2+
<div class="detailBox">
3+
<div class="titleBox">
4+
<label>Comments: {{selectedTask.title}}</label>
5+
<button type="button" class="close" aria-hidden="true">&times;</button>
6+
</div>
7+
<div class="commentBox">
8+
9+
<p class="taskDescription">{{selectedTask.description}}</p>
10+
</div>
11+
<div class="actionBox">
12+
<ul class="commentList">
13+
<li v-for="(comment,index) in taskComments">
14+
<div class="commenterImage">
15+
<img src="https://ssl.gstatic.com/accounts/ui/avatar_2x.png" />
16+
<!-- <i class='glyphicon glyphicon-user'></i> -->
17+
</div>
18+
<div class="commentText"><strong>{{comment.CommenterUserId}}</strong>
19+
<span class="date sub-text">on {{new Date(comment.createdDateTime).toDateString()}}</span>
20+
<p class="">{{comment.content}}.</p>
21+
22+
</div>
23+
</li>
24+
25+
</ul>
26+
<form class="form-inline" role="form">
27+
<div class="form-group">
28+
<input class="form-control" type="text" placeholder="Your comments" v-model="newcomment"/>
29+
</div>
30+
<div class="form-group">
31+
<!-- <button class="btn btn-default" v-on:click='submit($event)'>Add</button> -->
32+
<input type="submit" class="btn btn-default"
33+
value="Add" v-on:click='submit($event)'>
34+
</div>
35+
</form>
36+
</div>
37+
</div>
38+
39+
</template>
40+
41+
<script>
42+
import api from '../utils/api'
43+
44+
export default{
45+
name: 'Comments',
46+
47+
props: {
48+
selectedTask: {
49+
type: Object,
50+
required: true
51+
},
52+
taskComments: {
53+
type: Array,
54+
required: true
55+
},
56+
username: {
57+
type: String,
58+
required: true
59+
}
60+
},
61+
62+
data(){
63+
return{
64+
newcomment: ''
65+
}
66+
},
67+
68+
methods: {
69+
submit(e){
70+
e.preventDefault();
71+
var submitcommentreq = {
72+
content: this.newcomment,
73+
TaskId: this.selectedTask._id,
74+
CommenterUserId: this.username
75+
};
76+
77+
api.createComment(submitcommentreq)
78+
.then((resp)=>{
79+
console.log('createComment resp:- ' + JSON.stringify(resp));
80+
this.taskComments.push(resp.data);
81+
this.newcomment = '';
82+
});
83+
84+
}
85+
},
86+
87+
beforeUpdate(){
88+
89+
},
90+
}
91+
92+
</script>
93+
94+
95+
<style>
96+
.thumbnail {
97+
padding:0px;
98+
}
99+
.detailBox {
100+
position:relative;
101+
border:1px solid #bbb;
102+
}
103+
104+
105+
106+
.titleBox {
107+
background-color:#fdfdfd;
108+
padding:10px;
109+
}
110+
.titleBox label{
111+
color:#444;
112+
margin:0;
113+
display:inline-block;
114+
}
115+
116+
.commentBox {
117+
padding:10px;
118+
border-top:1px dotted #bbb;
119+
}
120+
.commentBox .form-group:first-child, .actionBox .form-group:first-child {
121+
width:80%;
122+
}
123+
.commentBox .form-group:nth-child(2), .actionBox .form-group:nth-child(2) {
124+
width:18%;
125+
}
126+
.actionBox .form-group * {
127+
width:100%;
128+
}
129+
.taskDescription {
130+
margin-top:10px 0;
131+
}
132+
.commentList {
133+
padding:0;
134+
list-style:none;
135+
/*max-height:200px;*/
136+
overflow:auto;
137+
}
138+
.commentList li {
139+
margin:0;
140+
margin-top:10px;
141+
}
142+
.commentList li > div {
143+
display:table-cell;
144+
}
145+
.commenterImage {
146+
width:30px;
147+
margin-right:5px;
148+
height:100%;
149+
float:left;
150+
}
151+
.commenterImage img {
152+
width:100%;
153+
border-radius:50%;
154+
}
155+
.commentText p {
156+
margin:0;
157+
}
158+
.sub-text {
159+
color:#aaa;
160+
font-family:verdana;
161+
font-size:11px;
162+
}
163+
.actionBox {
164+
border-top:1px dotted #bbb;
165+
padding:10px;
166+
}
167+
</style>

‎src/components/CreateProject.vue‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<template>
2+
<div class='ui basic content center aligned segment'>
3+
<button v-on:click="openForm" v-show="!isCreating">
4+
<i class='glyphicon glyphicon-plus'></i>
5+
</button>
6+
<div class='ui centered card' v-show="isCreating">
7+
<div class='content'>
8+
<div class='ui form'>
9+
<div class='field'>
10+
<label>Name</label>
11+
<input v-model="nameText" type='text' ref='title' defaultValue="">
12+
</div>
13+
<div class='field'>
14+
<label>Description</label>
15+
<input v-model="description" type='text' ref='project' defaultValue="">
16+
</div>
17+
<div class='ui two button attached buttons'>
18+
<button class='ui basic blue button' v-on:click="sendForm">
19+
Create
20+
</button>
21+
<button class='ui basic red button' v-on:click="closeForm">
22+
Cancel
23+
</button>
24+
</div>
25+
</div>
26+
</div>
27+
</div>
28+
</div>
29+
</template>
30+
31+
<script>
32+
export default {
33+
name: 'CreateProject',
34+
35+
data() {
36+
return {
37+
nameText: '',
38+
description: '',
39+
isCreating: false,
40+
};
41+
},
42+
methods: {
43+
openForm() {
44+
//console.log("open form");
45+
this.isCreating = true;
46+
},
47+
closeForm() {
48+
this.isCreating = false;
49+
},
50+
sendForm() {
51+
//console.log("send form " + this.nameText.length);
52+
if (this.nameText.length > 0 && this.description.length > 0) {
53+
const name = this.nameText;
54+
const description = this.description;
55+
this.$emit('add-project', {
56+
name,
57+
description,
58+
});
59+
//console.log("add-todo event emitted");
60+
this.newTodoText = '';
61+
this.nameText='';
62+
this.description='';
63+
}
64+
this.isCreating = false;
65+
},
66+
},
67+
};
68+
</script>

‎src/components/Dashboard.vue‎

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -17,23 +17,14 @@
1717

1818
<!-- Panel 1 -->
1919
<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">
20+
<Tasks v-bind:tasks="tasks" v-bind:selectedWsId="selectedWs._id" v-bind:selectedProj="selectedProj"
21+
v-bind:username="user.username" v-on:select-task="selectTask">
2222
</Tasks>
2323
</div>
2424

2525
<!-- Panel 2 -->
2626
<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>
27+
<Comments v-if="selectedTask._id && taskComments.comments" v-bind:selectedTask="selectedTask" v-bind:taskComments="taskComments.comments" v-bind:username="user.username"></Comments>
3728
</div>
3829
</div>
3930
</div>
@@ -51,6 +42,7 @@ import CreateTodo from './CreateTodo'
5142
import Navbar from './Navbar'
5243
import Sidebar from './Sidebar'
5344
import Tasks from './Tasks'
45+
import Comments from './Comments'
5446
import api from '../utils/api'
5547
5648
export default {
@@ -60,7 +52,8 @@ export default {
6052
CreateTodo,
6153
Navbar,
6254
Sidebar,
63-
Tasks
55+
Tasks,
56+
Comments
6457
},
6558
data () {
6659
return {
@@ -73,6 +66,8 @@ export default {
7366
selectedWs: {},
7467
selectedProj: {},
7568
tasks: {},
69+
selectedTask: {},
70+
taskComments: {},
7671
};
7772
},
7873
created(){
@@ -128,9 +123,18 @@ export default {
128123
.then((resp)=>{
129124
//console.log('getTasks resp::- ' + JSON.stringify(resp.data));
130125
this.tasks = resp.data;
126+
this.taskComments = {};
131127
});
132128
},
133-
129+
selectTask(task){
130+
console.log('showcom called' + JSON.stringify(task));
131+
this.selectedTask = task;
132+
api.getComments(task._id)
133+
.then((resp)=>{
134+
console.log('getComments resp:- '+JSON.stringify(resp));
135+
this.taskComments = resp.data;
136+
});
137+
}
134138
},
135139
136140
}

‎src/components/Register.vue‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,29 @@
44
<p>{{ error }}</p>
55
</div>
66
<div class="form-group">
7-
<input type="text"required name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value="" v-model="user.username">
7+
<input type="text"required name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value=""
8+
v-model="user.username">
89
</div>
910
<div class="form-group">
1011
<input type="text"required name="name" id="name" tabindex="1" class="form-control" placeholder="Name" value="" v-model="user.name">
1112
</div>
1213
<div class="form-group">
13-
<input type="email"required name="email" id="email" tabindex="1" class="form-control" placeholder="Email Address" value="" v-model="user.email">
14+
<input type="email"required name="email" id="email" tabindex="1" class="form-control" placeholder="Email Address" value=""
15+
v-model="user.email">
1416
</div>
1517
<div class="form-group">
16-
<input type="password"required name="password" id="password" tabindex="2" class="form-control" placeholder="Password" v-model="user.password">
18+
<input type="password"required name="password" id="password" tabindex="2" class="form-control" placeholder="Password"
19+
v-model="user.password">
1720
</div>
1821
<div class="form-group">
19-
<input type="password"required name="confirm-password" id="confirm-password" tabindex="2" class="form-control" placeholder="Confirm Password" ref="confirmpwd" v-on:keyup='validateForm'>
22+
<input type="password"required name="confirm-password" id="confirm-password" tabindex="2" class="form-control"
23+
placeholder="Confirm Password" ref="confirmpwd" v-on:keyup='validateForm'>
2024
</div>
2125
<div class="form-group">
2226
<div class="row">
2327
<div class="col-sm-6 col-sm-offset-3">
24-
<input type="submit" name="register-submit" id="register-submit" tabindex="4" class="form-control btn btn-register" value="Register Now" v-on:click='submit($event)'>
28+
<input type="submit" name="register-submit" id="register-submit" tabindex="4" class="form-control btn btn-register"
29+
value="Register Now" v-on:click='submit($event)'>
2530
</div>
2631
</div>
2732
</div>
@@ -56,7 +61,7 @@
5661
this.$refs.confirmpwd.setCustomValidity('');
5762
}
5863
},
59-
submit(e){
64+
submit(e){
6065
if($('#register-form')[0].checkValidity()){
6166
e.preventDefault();
6267
api.register(this.user)

0 commit comments

Comments
 (0)