feat(tri): mémoriser les préférences de tri

app/pages/component-catalog.vue

@@ -140,19 +140,34 @@
 <script setup lang="ts">
 import { computed, onMounted, ref } from 'vue'
 import { useComposants } from '~/composables/useComposants'
+import { useComponentTypes } from '~/composables/useComponentTypes'
 import { useToast } from '~/composables/useToast'
+import { usePersistedSort } from '~/composables/usePersistedSort'
 import DocumentThumbnail from '~/components/DocumentThumbnail.vue'
 import { isImageDocument, isPdfDocument } from '~/utils/documentPreview'
 
 const { showError } = useToast()
 const { composants, loadComposants, loading: loadingComposantsRef, deleteComposant } = useComposants()
+const { componentTypes, loadComponentTypes } = useComponentTypes()
 const loadingComposants = computed(() => loadingComposantsRef.value)
-const composantsList = computed(() => composants.value || [])
+
+// Enrichir les composants avec les types de composants complets
+const composantsList = computed(() => {
+  return (composants.value || []).map((composant) => {
+    const typeComposant = componentTypes.value.find(t => t.id === composant.typeComposantId)
+    return {
+      ...composant,
+      typeComposant: typeComposant || composant.typeComposant || null
+    }
+  })
+})
 const composantsTotal = computed(() => composantsList.value.length)
 
 const searchTerm = ref('')
-const sortField = ref<'name' | 'createdAt'>('name')
-const sortDirection = ref<'asc' | 'desc'>('asc')
+const { sortField, sortDirection } = usePersistedSort<'name' | 'createdAt', 'asc' | 'desc'>(
+  'component-catalog',
+  { field: 'name', direction: 'asc' },
+)
 
 const resolvePrimaryDocument = (component: Record<string, any>) => {
   const documents = Array.isArray(component?.documents) ? component.documents : []
@@ -298,6 +313,9 @@ const handleDeleteComponent = async (component: Record<string, any>) => {
 }
 
 onMounted(async () => {
-  await loadComposants()
+  await Promise.all([
+    loadComposants(),
+    loadComponentTypes()
+  ])
 })
 </script>

app/pages/constructeurs.vue

@@ -122,6 +122,7 @@ import FieldEmail from '~/components/form/FieldEmail.vue'
 import FieldPhone from '~/components/form/FieldPhone.vue'
 import { useConstructeurs } from '~/composables/useConstructeurs'
 import { useToast } from '~/composables/useToast'
+import { usePersistedValue } from '~/composables/usePersistedValue'
 import { formatPhone } from '~/utils/formatters/phone'
 import IconLucidePlus from '~icons/lucide/plus'
 
@@ -129,7 +130,7 @@ const { constructeurs, loading, searchConstructeurs, createConstructeur, updateC
 const { showError, showSuccess } = useToast()
 
 const searchTerm = ref('')
-const sortKey = ref('name')
+const sortKey = usePersistedValue('constructeurs-sort', 'name')
 const modalOpen = ref(false)
 const saving = ref(false)
 const editingConstructeur = ref(null)

app/pages/pieces-catalog.vue

@@ -162,19 +162,34 @@
 <script setup lang="ts">
 import { computed, onMounted, ref } from 'vue'
 import { usePieces } from '~/composables/usePieces'
+import { usePieceTypes } from '~/composables/usePieceTypes'
 import { useToast } from '~/composables/useToast'
+import { usePersistedSort } from '~/composables/usePersistedSort'
 import DocumentThumbnail from '~/components/DocumentThumbnail.vue'
 import { isImageDocument, isPdfDocument } from '~/utils/documentPreview'
 
 const { showError } = useToast()
 const { pieces, loadPieces, loading: loadingPiecesRef, deletePiece } = usePieces()
+const { pieceTypes, loadPieceTypes } = usePieceTypes()
 const loadingPieces = computed(() => loadingPiecesRef.value)
-const piecesList = computed(() => pieces.value || [])
+
+// Enrichir les pièces avec les types de pièces complets
+const piecesList = computed(() => {
+  return (pieces.value || []).map((piece) => {
+    const typePiece = pieceTypes.value.find(t => t.id === piece.typePieceId)
+    return {
+      ...piece,
+      typePiece: typePiece || piece.typePiece || null
+    }
+  })
+})
 const piecesTotal = computed(() => piecesList.value.length)
 
 const searchTerm = ref('')
-const sortField = ref<'name' | 'createdAt'>('name')
-const sortDirection = ref<'asc' | 'desc'>('asc')
+const { sortField, sortDirection } = usePersistedSort<'name' | 'createdAt', 'asc' | 'desc'>(
+  'pieces-catalog',
+  { field: 'name', direction: 'asc' },
+)
 
 const resolvePrimaryDocument = (piece: Record<string, any>) => {
   const documents = Array.isArray(piece?.documents) ? piece.documents : []
@@ -413,6 +428,9 @@ const handleDeletePiece = async (piece: Record<string, any>) => {
 }
 
 onMounted(async () => {
-  await loadPieces()
+  await Promise.all([
+    loadPieces(),
+    loadPieceTypes()
+  ])
 })
 </script>

app/pages/product-catalog.vue

@@ -164,7 +164,9 @@
 import { computed, onMounted, ref } from 'vue'
 import { useHead } from '#imports'
 import { useProducts } from '~/composables/useProducts'
+import { useProductTypes } from '~/composables/useProductTypes'
 import { useToast } from '~/composables/useToast'
+import { usePersistedSort } from '~/composables/usePersistedSort'
 import DocumentThumbnail from '~/components/DocumentThumbnail.vue'
 import { isImageDocument, isPdfDocument } from '~/utils/documentPreview'
 
@@ -181,13 +183,25 @@ const {
   loadProducts,
   deleteProduct,
 } = useProducts()
+const { productTypes, loadProductTypes } = useProductTypes()
 const toast = useToast()
 
 const searchTerm = ref('')
-const sortField = ref<'name' | 'createdAt'>('name')
-const sortDirection = ref<'asc' | 'desc'>('asc')
+const { sortField, sortDirection } = usePersistedSort<'name' | 'createdAt', 'asc' | 'desc'>(
+  'product-catalog',
+  { field: 'name', direction: 'asc' },
+)
 
-const normalizedProducts = computed(() => (Array.isArray(products.value) ? products.value : []))
+// Enrichir les produits avec les types de produits complets
+const normalizedProducts = computed(() => {
+  return (Array.isArray(products.value) ? products.value : []).map((product) => {
+    const typeProduct = productTypes.value.find(t => t.id === product.typeProductId)
+    return {
+      ...product,
+      typeProduct: typeProduct || product.typeProduct || null
+    }
+  })
+})
 const hasLoaded = computed(() => loaded.value)
 const errorMessage = computed(() => (typeof error.value === 'string' && error.value.length ? error.value : null))
 
@@ -383,6 +397,9 @@ const confirmDelete = async (product: Record<string, any>) => {
 }
 
 onMounted(async () => {
-  await loadProducts()
+  await Promise.all([
+    loadProducts(),
+    loadProductTypes()
+  ])
 })
 </script>