From d5fc8142b2040cbb382b9e7774b69b3e7edcd1a1 Mon Sep 17 00:00:00 2001
From: Julien Aldon <julien2.aldon@epitech.eu>
Date: Tue, 13 Jan 2026 15:26:11 +0100
Subject: [PATCH] fix front pagination and search

---
 .env.example                              | 17 ++++++++------
 README.md                                 | 27 +++++++++--------------
 front/src/components/PaginationFooter.vue |  8 +++----
 front/src/components/SearchHeader.vue     |  2 ++
 front/src/config.js                       |  4 ++--
 5 files changed, 29 insertions(+), 29 deletions(-)

diff --git a/.env.example b/.env.example
index a2e1b0c..3a66661 100644
--- a/.env.example
+++ b/.env.example
@@ -1,7 +1,10 @@
-SERVICE_ORIGIN
-DB_HOST
-MARIADB_USER
-SERVICE_SECRET_KEY
-MARIADB_PASSWORD
-MARIADB_ROOT_PASSWORD
-MARIADB_DATABASE
\ No newline at end of file
+DB_HOST=database
+MARIADB_USER=root
+# openssl rand -hex 32
+SERVICE_SECRET_KEY=xxxx
+# openssl rand -hex 12
+MARIADB_PASSWORD=xxxx
+# openssl rand -hex 12
+MARIADB_ROOT_PASSWORD=xxxx
+MARIADB_DATABASE=bookshelf
+SERVICE_ORIGIN=http://localhost:8080
\ No newline at end of file
diff --git a/README.md b/README.md
index 6d191bf..5d3d671 100644
--- a/README.md
+++ b/README.md
@@ -3,27 +3,22 @@ Ce projet est un gestionnaire de base de données pour la bibliotèque de la mai
 
 L'outil permet l'ajout, la modification, la suppression et de consulter les livres présents dans la base de donnée.
 
-## Deploiement
+## Développement local
 ### Avec Docker Compose
 ```sh
-docker-compose up --build -d
+docker compose -f docker-compose.dev.yml down -v
+docker compose -f docker-compose.dev.yml up
 
-# Init database
+# Init database (if database not initialized)
 docker-compose exec database mariadb -u root -p
 $>source /docker-entrypoint-initdb.d/*.sql
-
-# SSL https://certbot-dns-ovh.readthedocs.io/en/stable/
-# Create certificates
-certbot certonly --dns-ovh --dns-ovh-credentials ~/.secrets/certbot/ovh.ini -d home.aldon.fr
 ```
 
-# Set env variables inside secrets action
+## Déploiement
 ```sh
-SERVICE_ORIGIN
-DB_HOST
-SERVICE_SECRET_KEY
-MARIADB_USER
-MARIADB_PASSWORD
-MARIADB_ROOT_PASSWORD
-MARIADB_DATABASE
-```
\ No newline at end of file
+# SSL https://certbot-dns-ovh.readthedocs.io/en/stable/
+# Create certificates
+certbot certonly --dns-ovh --dns-ovh-credentials ~/.secrets/certbot/ovh.ini -d bookshelf.aldon.fr
+```
+## TODO
+Change `front/src/config.js` : Variabilize `ROOT_FQDN`
\ No newline at end of file
diff --git a/front/src/components/PaginationFooter.vue b/front/src/components/PaginationFooter.vue
index baa612a..cce87b0 100644
--- a/front/src/components/PaginationFooter.vue
+++ b/front/src/components/PaginationFooter.vue
@@ -4,18 +4,18 @@
         <button class="page" v-for="index in $store.getters.getBookCurrentPage + 1" :key="index">{{ index }}</button>
     </footer>
     <footer v-else>
-        <button @click="$store.dispatch('fetchPageBooks', {page: 0, nooption: false})" class="page"> {{ '<<' }} </button>
+        <button @click="$store.dispatch('fetchPageBooks', {page: 0, nooption: false, ...$route.query})" class="page"> {{ '<<' }} </button>
         <button
             class="page"
             :class="{ 'red': $store.getters.getBookCurrentPage - Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) === index}" 
             v-for="(n, index) in (Math.max(5, Math.min($store.getters.getBookCurrentPage + 2, $store.getters.getBookPageNb)) - Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)))"
             :key="index"
-            @click="$store.dispatch('fetchPageBooks', {page: Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index, nooption: false})">
+            @click="$store.dispatch('fetchPageBooks', {page: Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index, nooption: false, ...$route.query})">
             {{ Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index }}
         </button>
         <p v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="elipsis">...</p>
-        <button v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="page" @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false})">{{ $store.getters.getBookPageNb }}</button>
-        <button @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false})" class="page"> >> </button>
+        <button v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="page" @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false, ...$route.query})">{{ $store.getters.getBookPageNb }}</button>
+        <button @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false, ...$route.query})" class="page"> >> </button>
     </footer>
 </div>
 </template>
diff --git a/front/src/components/SearchHeader.vue b/front/src/components/SearchHeader.vue
index 4267b85..03cd753 100644
--- a/front/src/components/SearchHeader.vue
+++ b/front/src/components/SearchHeader.vue
@@ -5,6 +5,7 @@
     </div>
 </template>
 <script>
+import router from '@/router';
 export default {
     props: {
         page: String,
@@ -12,6 +13,7 @@ export default {
     watch: {
         search: function() {
             this.$emit('changeSearch', this.search);
+            router.push({ path: 'books', query: { search: this.search }})
             this.$store.dispatch('fetchPage'+this.page, {page: 0, nooption: false, search: this.search, order: this.order})
         }
     },
diff --git a/front/src/config.js b/front/src/config.js
index 31082c1..bdb925b 100644
--- a/front/src/config.js
+++ b/front/src/config.js
@@ -1,5 +1,5 @@
-const ROOT_FQDN = 'https://bookshelf.aldon.fr/api';
-// const ROOT_FQDN = 'http://localhost:8000/api';
+// const ROOT_FQDN = 'https://bookshelf.aldon.fr/api';
+const ROOT_FQDN = 'http://localhost:8000/api';
 
 export {
     ROOT_FQDN