Tutorials/Quasar_Todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

15.05 Format the Time with a Computed Property

Browse Source
This commit is contained in:
Fredrick W Warren 2021-02-11 16:16:12 -08:00
parent ff3233fa49
commit 2f72c80175
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Tasks/Task.vue
View File

@ -39,7 +39,7 @@
<q-item-label <q-item-label
class="row justify-end" class="row justify-end"
caption> caption>
<small>{{ task.dueTime }}</small> <small>{{ taskDueTime }}</small>
</q-item-label> </q-item-label>
</div> </div>
</div> </div>
@ -72,7 +72,7 @@
</template> </template>
<script> <script>
import { mapState, mapActions } from 'vuex' import { mapState, mapActions, mapGetters } from 'vuex'
import editTask from 'components/Tasks/Modals/EditTask.vue' import editTask from 'components/Tasks/Modals/EditTask.vue'
import { date } from 'quasar' import { date } from 'quasar'
const { formatDate } = date const { formatDate } = date
@ -116,7 +116,17 @@ export default {
} }
}, },
computed: { computed: {
...mapState('tasks', ['search']) ...mapState('tasks', ['search']),
...mapGetters('settings', ['settings']),
taskDueTime () {
if (this.settings.show12HourTimeFormat) {
return formatDate(
this.task.dueDate + ' ' +
this.task.dueTime, 'h:mma')
}
return this.task.dueTime
}
}, },
methods: { methods: {
...mapActions('tasks', ['updateTask', 'deleteTask']), ...mapActions('tasks', ['updateTask', 'deleteTask']),