From 40350f05558fca740463b083dca2611ec8f29e8e Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Thu, 1 Mar 2018 23:46:32 +0100
Subject: [PATCH] Redraw ago datetime every minute
---
front/src/App.vue | 4 ++++
front/src/components/common/HumanDate.vue | 16 ++++++++++++++--
front/src/store/index.js | 2 ++
front/src/store/ui.js | 12 ++++++++++++
4 files changed, 32 insertions(+), 2 deletions(-)
create mode 100644 front/src/store/ui.js
diff --git a/front/src/App.vue b/front/src/App.vue
index 3e39d726..d60f82fe 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -44,6 +44,10 @@ export default {
},
created () {
this.$store.dispatch('instance/fetchSettings')
+ setInterval(() => {
+ // used to redraw ago dates every minute
+ self.$store.commit('ui/computeLastDate')
+ }, 1000 * 60)
}
}
</script>
diff --git a/front/src/components/common/HumanDate.vue b/front/src/components/common/HumanDate.vue
index ff6ff5c7..9ff8e48b 100644
--- a/front/src/components/common/HumanDate.vue
+++ b/front/src/components/common/HumanDate.vue
@@ -1,8 +1,20 @@
<template>
- <time :datetime="date" :title="date | moment">{{ date | ago }}</time>
+ <time :datetime="date" :title="date | moment">{{ realDate | ago }}</time>
</template>
<script>
+import {mapState} from 'vuex'
export default {
- props: ['date']
+ props: ['date'],
+ computed: {
+ ...mapState({
+ lastDate: state => state.ui.lastDate
+ }),
+ realDate () {
+ if (this.lastDate) {
+ // dummy code to trigger a recompute to update the ago render
+ }
+ return this.date
+ }
+ }
}
</script>
diff --git a/front/src/store/index.js b/front/src/store/index.js
index 74f9d42b..e111966a 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -8,11 +8,13 @@ import instance from './instance'
import queue from './queue'
import radios from './radios'
import player from './player'
+import ui from './ui'
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
+ ui,
auth,
favorites,
instance,
diff --git a/front/src/store/ui.js b/front/src/store/ui.js
new file mode 100644
index 00000000..f0935e49
--- /dev/null
+++ b/front/src/store/ui.js
@@ -0,0 +1,12 @@
+
+export default {
+ namespaced: true,
+ state: {
+ lastDate: new Date()
+ },
+ mutations: {
+ computeLastDate: (state) => {
+ state.lastDate = new Date()
+ }
+ }
+}
--
GitLab