feat: add filter to journal (#6758)

Co-authored-by: Alexis Saettler <alexis@saettler.org>
This commit is contained in:
khalil Abu jayab
2023-11-06 23:12:59 +02:00
committed by GitHub
parent e4a41d8314
commit 6ec0735a22
29 changed files with 292 additions and 20 deletions
+18 -2
View File
@@ -28,10 +28,26 @@ class JournalController extends Controller
*
* @return array
*/
public function list()
public function list(Request $request)
{
$startDate = $request->input('start_date');
$endDate = $request->input('end_date');
$sortBy = $request->input('sort_by', 'created_at');
$sortOrder = $request->input('sort_order', 'desc');
$perPage = $request->input('per_page', 30);
$entries = collect([]);
$journalEntries = auth()->user()->account->journalEntries()->paginate(30);
$journalEntriesQuery = auth()->user()->account->journalEntries();
if ($startDate && $endDate) {
$journalEntriesQuery->whereDate('date', '>=', $startDate)
->whereDate('date', '<=', $endDate);
}
$journalEntries = $journalEntriesQuery->orderBy($sortBy, $sortOrder)
->paginate($perPage);
// this is needed to determine if we need to display the calendar
// (month + year) next to the journal entry
+85 -18
View File
@@ -1,29 +1,74 @@
<style scoped>
.fade-enter-active,
.fade-leave-active {
transition: opacity .4s
transition: opacity .4s
}
</style>
<template>
<div class="mw9 center">
<!-- Left sidebar -->
<div :class="[ dirltr ? 'fl' : 'fr' ]" class="w-70-ns w-100 pa2">
<div :class="[dirltr ? 'fl' : 'fr']" class="w-70-ns w-100 pa2">
<!-- Filters -->
<div class="filter mb-4">
<div class="d-flex pb-2">
<div class="dt">
<label for="start-date">{{ $t('journal.start_date') }}:</label>
<input id="start-date" v-model="startDate" type="date" class="form-control" />
</div>
<div class="dt pl-2">
<label for="end-date py-2">{{ $t('journal.end_date') }}:</label>
<input id="end-date" v-model="endDate" type="date" class="form-control" />
</div>
<div class="dt pl-2">
<label for="per-page">{{ $t('journal.per_page') }}:</label>
<input id="per-page" v-model="perPage" type="number" class="form-control" />
</div>
<div class="dt pl-2">
<label for="sort-order">{{ $t('journal.sort_order') }} :</label>
<select id="sort-order" v-model="sortOrder" class="form-control">
<option value="asc">
{{ $t('journal.ascending') }}
</option>
<option value="desc">
{{ $t('journal.descending') }}
</option>
</select>
</div>
</div>
<button class="btn btn-primary" @click="getEntries">
{{ $t('journal.apply_filter') }}
</button>
</div>
<!-- How was your day -->
<journal-rate-day @hasRated="hasRated" />
<!-- Logs -->
<div v-if="journalEntries.data" v-cy-name="'journal-entries-body'" v-cy-items="journalEntries.data.map(j => j.id)" :cy-object-items="journalEntries.data.map(j => j.object.id)">
<div v-for="journalEntry in journalEntries.data" :key="journalEntry.id" v-cy-name="'entry-body-' + journalEntry.id" class="cf">
<journal-content-rate v-if="journalEntry.journalable_type === 'App\\Models\\Journal\\Day'" :journal-entry="journalEntry" @deleteJournalEntry="deleteJournalEntry" />
<div v-if="journalEntries.data" v-cy-name="'journal-entries-body'" v-cy-items="journalEntries.data.map(j => j.id)"
:cy-object-items="journalEntries.data.map(j => j.object.id)"
>
<div v-for="journalEntry in journalEntries.data" :key="journalEntry.id"
v-cy-name="'entry-body-' + journalEntry.id" class="cf"
>
<journal-content-rate v-if="journalEntry.journalable_type === 'App\\Models\\Journal\\Day'"
:journal-entry="journalEntry" @deleteJournalEntry="deleteJournalEntry"
/>
<journal-content-activity v-else-if="journalEntry.journalable_type === 'App\\Models\\Account\\Activity'" :journal-entry="journalEntry" />
<journal-content-activity v-else-if="journalEntry.journalable_type === 'App\\Models\\Account\\Activity'"
:journal-entry="journalEntry"
/>
<journal-content-entry v-else-if="journalEntry.journalable_type === 'App\\Models\\Journal\\Entry'" :journal-entry="journalEntry" @deleteJournalEntry="deleteJournalEntry" />
<journal-content-entry v-else-if="journalEntry.journalable_type === 'App\\Models\\Journal\\Entry'"
:journal-entry="journalEntry" @deleteJournalEntry="deleteJournalEntry"
/>
</div>
</div>
<div v-if="(journalEntries.per_page * journalEntries.current_page) <= journalEntries.total" class="br3 ba b--gray-monica bg-white pr3 pb3 pt3 mb3 tc">
<div v-if="(journalEntries.per_page * journalEntries.current_page) <= journalEntries.total"
class="br3 ba b--gray-monica bg-white pr3 pb3 pt3 mb3 tc"
>
<p class="mb0 pointer" @click="loadMore()">
<span v-if="!loadingMore">
{{ $t('app.load_more') }}
@@ -34,7 +79,9 @@
</p>
</div>
<div v-if="journalEntries.total === 0" v-cy-name="'journal-blank-state'" class="br3 ba b--gray-monica bg-white pr3 pb3 pt3 mb3 tc">
<div v-if="journalEntries.total === 0" v-cy-name="'journal-blank-state'"
class="br3 ba b--gray-monica bg-white pr3 pb3 pt3 mb3 tc"
>
<div class="tc mb4">
<img src="img/journal/blank.svg" :alt="$t('journal.journal_empty')" />
</div>
@@ -46,7 +93,7 @@
</div>
<!-- Right sidebar -->
<div :class="[ dirltr ? 'fl' : 'fr' ]" class="w-30-ns w-100 pa2">
<div :class="[dirltr ? 'fl' : 'fr']" class="w-30-ns w-100 pa2">
<a v-cy-name="'add-entry-button'" href="journal/add" class="btn btn-primary w-100 mb4">
{{ $t('journal.journal_add') }}
</a>
@@ -68,7 +115,11 @@ export default {
showSadSmileyColor: false,
showHappySmileyColor: false,
loadingMore: false,
startDate: '',
endDate: '',
sortBy: 'created_at', // Specify the field to sort by (e.g., 'created_at', 'updated_at')
sortOrder: 'desc', // Specify the sort order ('asc' or 'desc')
perPage: 30, // Specify the number of entries per page
};
},
@@ -76,7 +127,7 @@ export default {
dirltr() {
return this.$root.htmldir === 'ltr';
},
hasMorePage: function() {
hasMorePage: function () {
var total = this.journalEntries.per_page * this.journalEntries.current_page;
if (total >= this.journalEntries.total) {
@@ -97,7 +148,15 @@ export default {
},
getEntries() {
axios.get('journal/entries')
axios.get('journal/entries', {
params: {
start_date: this.startDate,
end_date: this.endDate,
per_page: this.perPage,
sort_order: this.sortOrder,
sort_by: this.sortBy,
},
})
.then(response => {
this.journalEntries = response.data;
this.journalEntries.current_page = response.data.current_page;
@@ -109,28 +168,36 @@ export default {
},
// This event is omited from the child component
deleteJournalEntry: function($journalEntryId) {
deleteJournalEntry: function ($journalEntryId) {
// check if the deleted entry date is today. If that's the case
// we need to put back the Rate box. This is only necessary if
// the user does all his actions on the same page without ever
// reloading the page.
this.journalEntries.data.filter(function(obj) {
this.journalEntries.data.filter(function (obj) {
return obj.id === $journalEntryId;
});
// Filter out the array without the deleted Journal Entry
this.journalEntries.data = this.journalEntries.data.filter(function(element) {
this.journalEntries.data = this.journalEntries.data.filter(function (element) {
return element.id !== $journalEntryId;
});
},
hasRated: function(journalObject) {
hasRated: function (journalObject) {
this.journalEntries.data.unshift(journalObject);
},
loadMore() {
this.loadingMore = true;
axios.get('journal/entries?page=' + (this.journalEntries.current_page + 1))
axios.get('journal/entries?page=' + (this.journalEntries.current_page + 1),{
params: {
start_date: this.startDate,
end_date: this.endDate,
per_page: this.perPage,
sort_order: this.sortOrder,
sort_by: this.sortBy,
},
})
.then(response => {
this.journalEntries.current_page = response.data.current_page;
this.journalEntries.next_page_url = response.data.next_page_url;
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'قم بتدوين مذكرتك الأولى',
'journal_blank_description' => 'المذكرة تدَعُك تدون الأحداث التي حصلت لك، لتتذكرها.',
'delete_confirmation' => 'هل أنت متأكد من حذف تدوين هذه المذكرة؟',
'apply_filter' => 'طبق الفلترة',
"start_date" => "تاريخ البدء" ,
"end_date" => "تاريخ الانتهاء" ,
"per_page" => "لكل صفحة" ,
'Sort_order' => 'فرز حسب تاريخ الإنشاء',
"ascending" => "تصاعدي" ,
"descending" => "تنازلي" ,
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Přidej svůj první deníkový záznam',
'journal_blank_description' => 'Deník umožňuje zaznamenávání událostí které se staly a ulehčuje jejich zapamatování.',
'delete_confirmation' => 'Opravdu chcete smazat tento deníkový záznam?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Schreibe deinen ersten Eintrag',
'journal_blank_description' => 'Im Tagebuch kannst du deine Erlebnisse festhalten und dich später an sie erinnern.',
'delete_confirmation' => 'Willst du diesen Eintrag wirklich löschen?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Προσθέστε την πρώτη καταχώρηση ημερολογίου',
'journal_blank_description' => 'Το ημερολόγιο σας επιτρέπει να γράφετε γεγονότα που σας συνέβησαν και να τα θυμάστε.',
'delete_confirmation' => 'Είστε βέβαιοι ότι θέλετε να διαγράψετε αυτή την καταχώρηση ημερολογίου;',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Añade tu primera entrada de diario',
'journal_blank_description' => 'El diario te permite escribir eventos que te han pasado y recordarlos.',
'delete_confirmation' => '¿Seguro que deseas eliminar esta entrada de tu diario?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Ajouter votre première entrée dans le journal',
'journal_blank_description' => 'Le journal vous permet de vous rappeler d’évènements passés, ou à venir.',
'delete_confirmation' => 'Êtes-vous sûr de vouloir supprimer cette entrée ?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'ניתן להוסיף את רשומת היומן הראשונה שלך',
'journal_blank_description' => 'היומן מאפשר לך לכתוב אירועים שעברו עליך ולזכור אותם.',
'delete_confirmation' => 'למחוק את הרשומה הזאת ביומן?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Tambahkan entri jurnal pertama Anda',
'journal_blank_description' => 'Jurnal memungkinkan Anda menulis peristiwa yang terjadi pada Anda, dan mengingatnya.',
'delete_confirmation' => 'Apakah Anda yakin ingin menghapus entri jurnal ini?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Scrivi qualcosa nel diario',
'journal_blank_description' => 'Il diario ti permette di appuntare cose che ti succedono, e ricordarle.',
'delete_confirmation' => 'Sei sicuro di voler rimuovere questa pagina dal diario?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Voeg je eerst dagboek-invoer toe',
'journal_blank_description' => 'Het dagboek laat je gebeurtenissen registreren, zodat je ze kunt onthouden.',
'delete_confirmation' => 'Weet je zeker dat je deze dagboek-invoer wilt verwijderen?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Legg til din første journaloppføring',
'journal_blank_description' => 'Journalen lar deg skrive innlegg slik at du husker hva som skjer i løpet av en dag.',
'delete_confirmation' => 'Er du sikker på at du vil slette denne journaloppføringen?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Adicione sua primeira informação no diário',
'journal_blank_description' => 'O diário permite que você escreva eventos que aconteceram com você para que lembre-se deles.',
'delete_confirmation' => 'Tem certeza que deseja excluir este registro do diário?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Adicione seu primeiro registro no diário',
'journal_blank_description' => 'O diário permite que você escreva eventos que aconteceram com você, para te lembrar.',
'delete_confirmation' => 'Tem certeza que quer apagar esta entrada de diário?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Добавить вашу первую запись в журнал',
'journal_blank_description' => 'В журнал вы можете добавлять записи о событиях в вашей жизни, чтобы сохранить их.',
'delete_confirmation' => 'Вы уверены что хотите удалить эту запись?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Lägg till din första journalpost',
'journal_blank_description' => 'Tidskriften låter dig skriva händelser som hände dig, och kom ihåg dem.',
'delete_confirmation' => 'Är du säker på att du vill ta bort denna journalpost?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'İlk günlük içeriğini yaz',
'journal_blank_description' => 'Günlük başından geçen olayları yazmanı ve onları tekrar hatırlamanı sağlar.',
'delete_confirmation' => 'Bu girdiyi silmek istediğinizden emin misiniz?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Add your first journal entry',
'journal_blank_description' => 'The journal lets you write events that happened to you, and remember them.',
'delete_confirmation' => 'Are you sure you want to delete this journal entry?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => 'Thêm mục nhật ký đầu tiên của bạn',
'journal_blank_description' => 'Nhật ký cho phép bạn viết sự kiện đã xảy ra với bạn, và ghi nhớ chúng.',
'delete_confirmation' => 'Bạn chắc chắn muốn xóa mục nhật ký này?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => '新增您的第一個記錄條目',
'journal_blank_description' => '記錄允許您編寫發生在您身上的事件, 並記住它們。',
'delete_confirmation' => '您確定要刪除此條目嗎?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];
+7
View File
@@ -28,4 +28,11 @@ return [
'journal_blank_cta' => '添加您的第一个记录条目',
'journal_blank_description' => '记录允许您编写发生在您身上的事件, 并记住它们。',
'delete_confirmation' => '您确定要删除此条目吗?',
'apply_filter' => 'Apply filter',
'start_date' => 'Start Date',
'end_date' => 'End Date',
'per_page' => 'Per Page',
'sort_order' => 'Sort By Created At',
'ascending' => 'Ascending',
'descending' => 'Descending',
];