From d3af477f86b3ff1aa0587d7f9ab9be54381292b7 Mon Sep 17 00:00:00 2001
From: Fredrick W Warren <fredwarren@gmail.com>
Date: Thu, 11 Feb 2021 10:23:05 -0800
Subject: [PATCH] 14.06 Filter - Format the Date Nicely

---
 src/components/Tasks/Task.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/Tasks/Task.vue b/src/components/Tasks/Task.vue
index 62fdbfa..ac1b9fe 100644
--- a/src/components/Tasks/Task.vue
+++ b/src/components/Tasks/Task.vue
@@ -33,7 +33,7 @@
           <q-item-label
             class="row justify-end"
             caption>
-            {{ task.dueDate }}
+            {{ task.dueDate | niceDate }}
           </q-item-label>
           <q-item-label
             class="row justify-end"
@@ -73,6 +73,8 @@
 <script>
 import { mapActions } from 'vuex'
 import editTask from 'components/Tasks/Modals/EditTask.vue'
+import { date } from 'quasar'
+const { formatDate } = date
 
 export default {
   name: 'Task',
@@ -85,6 +87,11 @@ export default {
       showEditTask: false
     }
   },
+  filters: {
+    niceDate (value) {
+      return formatDate(value, 'MMM D')
+    }
+  },
   methods: {
     ...mapActions('tasks', ['updateTask', 'deleteTask']),
     promptToDelete (id) {