view model

Author: chyld

data/priorities.json

@@ -1,5 +1,5 @@
 [
-  { "name": "High", "color": "red", "value": 10 },
-  { "name": "Medium", "color": "yellow", "value": 5 },
-  { "name": "Low", "color": "blue", "value": 1 }
+  { "name": "High", "color": "#FF4136", "value": 10 },
+  { "name": "Medium", "color": "#FFDC00", "value": 5 },
+  { "name": "Low", "color": "#7FDBFF", "value": 1 }
 ]

src/controllers/tasks.js

@@ -1,12 +1,18 @@
-/* eslint-disable new-cap */
+/* eslint-disable new-cap, array-callback-return, no-param-reassign */
 
 import express from 'express';
 import Priority from '../models/priority';
 import Category from '../models/category';
+import Task from '../models/task';
+import ViewTask from '../models/view-task';
 const router = module.exports = express.Router();
 
 router.get('/', (req, res) => {
-  res.render('tasks/index');
+  Task.find((err, tasks) => {
+    const priorities = Priority.find();
+    const viewTasks = tasks.map(t => new ViewTask(t, priorities));
+    res.render('tasks/index', { viewTasks });
+  });
 });
 
 router.get('/new', (req, res) => {
@@ -16,7 +22,10 @@ router.get('/new', (req, res) => {
 });
 
 router.post('/', (req, res) => {
-  res.redirect('/tasks');
+  const task = new Task(req.body);
+  task.save(() => {
+    res.redirect('/tasks');
+  });
 });
 
 router.post('/:id/complete', (req, res) => {

src/models/task.js

@@ -0,0 +1,13 @@
+import mongoose from 'mongoose';
+const Schema = mongoose.Schema;
+
+const taskSchema = new Schema({
+  name: String,
+  due: Date,
+  priority: Number,
+  category: String,
+  isComplete: { type: Boolean, default: false },
+  createdAt: { type: Date, default: Date.now },
+});
+
+module.exports = mongoose.model('Task', taskSchema);

src/models/view-task.js

@@ -0,0 +1,10 @@
+function ViewTask(task, priorities) {
+  this.name = task.name;
+  this.due = task.due.toLocaleDateString();
+  this.priority = priorities.find(p => p.value === task.priority);
+  this.category = task.category;
+  this.isComplete = task.isComplete;
+  this.createdAt = task.createdAt.toLocaleDateString();
+}
+
+module.exports = ViewTask;

views/shared/template.pug

@@ -17,3 +17,4 @@ html(lang='en')
 
     script(src='/vendor/jquery/dist/jquery.min.js')
     script(src='/vendor/bootstrap/dist/js/bootstrap.min.js')
+    script(src='/vendor/moment/min/moment.min.js')

views/tasks/index.pug

@@ -1,3 +1,26 @@
 extends ../shared/template
 block content
   h1 Tasks
+
+  table.table.table-striped
+    thead
+      tr
+        th Name
+        th Due
+        th Priority
+        th Category
+        th Complete?
+        th Created
+    tbody
+      each task in viewTasks
+        tr(style='background-color:' + task.priority.color)
+          td= task.name
+          td= task.due
+          td= task.priority.name
+          td= task.category
+          td
+            if task.isComplete
+              i.fa.fa-check-square-o.fa-fw
+            else
+              i.fa.fa-square-o.fa-fw
+          td= task.createdAt