+
@@ -35,7 +34,7 @@
class="event-line"
:key="event.id"
@click="selectLine(event)"
- v-for="event in displayedEvents"
+ v-for="event in filteredEvents"
>
{{ event.date }}
@@ -99,6 +99,8 @@ import PeopleField from '@/components/widgets/PeopleField.vue'
import PeopleName from '@/components/widgets/PeopleName.vue'
import Spinner from '@/components/widgets/Spinner.vue'
+const PAGE_SIZE = 1000
+
export default {
name: 'events',
@@ -114,15 +116,16 @@ export default {
},
data() {
- const PAGE_SIZE = 1000
return {
- PAGE_SIZE,
currentDate: new Date(),
events: [],
- isLoading: true,
+ hasMoreEvents: false,
selectedEvents: {},
selectedPerson: null,
- displayLimit: PAGE_SIZE
+ loading: {
+ events: false,
+ moreEvents: false
+ }
}
},
@@ -145,50 +148,69 @@ export default {
)
}
return events
- },
-
- displayedEvents() {
- return this.filteredEvents.slice(0, this.displayLimit)
- },
-
- hasMoreEvents() {
- return this.filteredEvents.length > this.displayLimit
}
},
methods: {
...mapActions(['loadEvents']),
- loadDayEvents() {
+ async loadDayEvents() {
const before = moment(this.currentDate).add(1, 'days')
const after = moment(this.currentDate)
this.selectedEvents = {}
- this.displayLimit = this.PAGE_SIZE
- this.isLoading = true
- this.loadEvents({
- after: formatFullDateWithRevertedTimezone(after, this.timezone),
- before: formatFullDateWithRevertedTimezone(before, this.timezone)
- })
- .then(events => {
- this.events = events.map(event => {
- const [name, type] = event.name.split(':')
- return {
- id: event.id,
- date: this.formatDate(event.created_at),
- data: event.data,
- name,
- shortType: type.substring(0, 3),
- type,
- user_id: event.user_id
- }
- })
+ this.events = []
+ this.loading.events = true
+ try {
+ const events = await this.loadEvents({
+ after: formatFullDateWithRevertedTimezone(after, this.timezone),
+ before: formatFullDateWithRevertedTimezone(before, this.timezone),
+ limit: PAGE_SIZE
})
- .catch(err => {
- console.error(err)
- })
- .finally(() => {
- this.isLoading = false
+ this.events = this.formatEvents(events)
+ this.hasMoreEvents = events.length >= PAGE_SIZE
+ } catch (err) {
+ console.error(err)
+ } finally {
+ this.loading.events = false
+ }
+ },
+
+ async loadMoreEvents() {
+ if (!this.events.length) return
+
+ this.loading.moreEvents = true
+ const lastEventId = this.events[this.events.length - 1].id
+ const before = moment(this.currentDate).add(1, 'days')
+ const after = moment(this.currentDate)
+ try {
+ const events = await this.loadEvents({
+ after: formatFullDateWithRevertedTimezone(after, this.timezone),
+ before: formatFullDateWithRevertedTimezone(before, this.timezone),
+ lastEventId,
+ limit: PAGE_SIZE
})
+ this.events = [...this.events, ...this.formatEvents(events)]
+ this.hasMoreEvents = events.length >= PAGE_SIZE
+ } catch (err) {
+ console.error(err)
+ } finally {
+ this.loading.moreEvents = false
+ }
+ },
+
+ formatEvents(events) {
+ return events.map(event => {
+ const [name, type] = event.name.split(':')
+ return {
+ id: event.id,
+ date: this.formatDate(event.created_at),
+ data: event.data,
+ name,
+ shortType: type.substring(0, 3),
+ type,
+ user_id: event.user_id
+ }
+ })
},
selectLine(event) {
diff --git a/src/components/pages/logs/PreviewFiles.vue b/src/components/pages/logs/PreviewFiles.vue
index f09f8538a..61644febe 100644
--- a/src/components/pages/logs/PreviewFiles.vue
+++ b/src/components/pages/logs/PreviewFiles.vue
@@ -3,54 +3,68 @@
{{ $t('logs.preview_files.explanation') }}
-
+
+
+
+
+
+
+ {{ $t('logs.preview_files.empty_list') }}
-
- {{ $t('logs.preview_files.empty_list') }}
-
+
+
+
@@ -101,12 +140,12 @@ em {
}
.status[data-status='broken'] {
- color: white;
+ color: $white;
background: $dark-red;
}
.status[data-status='processing'] {
- color: white;
+ color: $white;
background: $blue;
}
diff --git a/src/components/previews/BrowsingBar.vue b/src/components/previews/BrowsingBar.vue
index 47ee1ba0c..1a2b5e1cd 100644
--- a/src/components/previews/BrowsingBar.vue
+++ b/src/components/previews/BrowsingBar.vue
@@ -97,11 +97,7 @@ export default {
},
isMovie() {
- if (this.previews.length < this.currentIndex) {
- return false
- } else {
- return this.previews[this.currentIndex - 1].extension === 'mp4'
- }
+ return this.previews[this.currentIndex - 1]?.extension === 'mp4'
}
}
}
diff --git a/src/components/previews/PdfViewer.vue b/src/components/previews/PdfViewer.vue
index 10946746f..d1a893f45 100644
--- a/src/components/previews/PdfViewer.vue
+++ b/src/components/previews/PdfViewer.vue
@@ -1,17 +1,12 @@