feat(r6): R6.2 — Parc sur mobile (Sites, Ascenseurs)

useLocations() mobile ; écran Sites (premier niveau) ; fiche site
(identité, zones, ascenseurs du site — consultation seule, D4, pas de
carte ni d'édition sur mobile pour l'instant) ; écran Ascenseurs (parc
complet déjà préchargé, D1) ouvrant la fiche appareil R4 telle quelle
(déjà générique, aucune modification nécessaire). Menu : Ascenseurs/Sites
routent réellement au lieu de « à venir » ; Catégories reste à venir
(admin, hors périmètre R6.2).

Exécution directe de la maquette R6 déjà validée, patrons visuels
réutilisés (Carte/LigneInfo/EnteteFiche) — pas de nouveau tour de design.

Typecheck propre, 17 tests Jest, lint 5/5 paquets.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

apps/mobile/app/(tabs)/menu.tsx

@@ -37,8 +37,8 @@ const GROUPES: { titre: string; liens: LienMenu[] }[] = [
   {
     titre: 'Parc',
     liens: [
-      { libelle: 'Ascenseurs', ico: '▣', permission: ['ASSETS', 'view'], aVenir: 'La liste du parc en mobilité arrive dans une prochaine étape — en attendant, le Scanner et les fiches OT y mènent déjà.' },
-      { libelle: 'Sites', ico: '◫', permission: ['LOCATIONS', 'view'], aVenir: 'La liste des sites en mobilité arrive dans une prochaine étape.' },
+      { libelle: 'Ascenseurs', ico: '▣', permission: ['ASSETS', 'view'], route: '/ascenseurs' },
+      { libelle: 'Sites', ico: '◫', permission: ['LOCATIONS', 'view'], route: '/sites' },
       { libelle: 'Catégories', ico: '▤', permission: ['SETTINGS', 'view'], aVenir: 'L’administration des catégories reste sur le grand écran pour l’instant.' },
     ],
   },

apps/mobile/app/ascenseurs/index.tsx

@@ -0,0 +1,90 @@
+import { router } from 'expo-router';
+import { FlatList, Pressable, Text, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { ASSET_STATUS_LABELS, type AssetStatus } from '@siop/shared';
+import { useAssets } from '@/api/exploitation';
+import { EnteteFiche } from '@/composants/ui';
+import { useTokens, type Tokens } from '@/theme/tokens';
+
+/** Ascenseurs — R6.2 (Parc). Le parc complet, déjà préchargé (D1 lecture
+ *  locale) — même donnée que le Scanner, présentée en liste plutôt qu'en
+ *  résolution QR. Ouvre la fiche R4 telle quelle (écran 5). */
+export default function PageAscenseurs() {
+  const t = useTokens();
+  const { data: assets } = useAssets();
+  const appareils = [...(assets ?? [])].sort((a, b) => a.reference.localeCompare(b.reference));
+
+  return (
+    <SafeAreaView style={{ flex: 1, backgroundColor: t.fond }} edges={['top']}>
+      <View style={{ flex: 1, padding: 14, gap: 10 }}>
+        <EnteteFiche titre="Ascenseurs" />
+        <FlatList
+          data={appareils}
+          keyExtractor={(a) => a.id}
+          contentContainerStyle={{ gap: 8, paddingBottom: 12 }}
+          ListEmptyComponent={
+            <Text style={{ color: t.encre3, fontFamily: 'Manrope_600SemiBold', padding: 16, textAlign: 'center' }}>
+              Aucun appareil accessible.
+            </Text>
+          }
+          renderItem={({ item: a }) => (
+            <Pressable
+              accessibilityRole="button"
+              onPress={() => router.push(`/ascenseur/${a.id}`)}
+              style={{
+                backgroundColor: t.surface,
+                borderColor: t.bordure,
+                borderWidth: 1,
+                borderRadius: 12,
+                padding: 12,
+                gap: 2,
+              }}
+            >
+              <View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
+                <Text
+                  style={{
+                    fontFamily: 'Manrope_700Bold',
+                    fontSize: 10.5,
+                    letterSpacing: 0.6,
+                    textTransform: 'uppercase',
+                    color: t.encre2,
+                    flex: 1,
+                  }}
+                >
+                  {a.reference}
+                </Text>
+                <ChipStatutAppareil statut={a.status} t={t} />
+              </View>
+              <Text style={{ fontFamily: 'Manrope_700Bold', fontSize: 14, color: t.encre }}>
+                {a.brand} {a.model ?? ''}
+              </Text>
+              <Text style={{ fontFamily: 'Manrope_400Regular', fontSize: 12, color: t.encre2 }}>
+                {a.siteName} — {a.locationName}
+              </Text>
+            </Pressable>
+          )}
+        />
+      </View>
+    </SafeAreaView>
+  );
+}
+
+function ChipStatutAppareil({ statut, t }: { statut: AssetStatus; t: Tokens }) {
+  const enService = statut === 'IN_SERVICE';
+  return (
+    <Text
+      style={{
+        fontFamily: 'Manrope_700Bold',
+        fontSize: 10.5,
+        color: enService ? t.stTermine : t.stAttente,
+        backgroundColor: enService ? t.stTermineFond : t.stAttenteFond,
+        paddingHorizontal: 8,
+        paddingVertical: 2,
+        borderRadius: 999,
+        overflow: 'hidden',
+      }}
+    >
+      {ASSET_STATUS_LABELS[statut]}
+    </Text>
+  );
+}

apps/mobile/app/sites/[id].tsx

@@ -0,0 +1,99 @@
+import { router, useLocalSearchParams } from 'expo-router';
+import { Pressable, ScrollView, Text } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { ASSET_STATUS_LABELS, type AssetStatus } from '@siop/shared';
+import { useAssets, useLocations } from '@/api/exploitation';
+import { Carte, EnteteFiche, LigneInfo } from '@/composants/ui';
+import { useTokens, type Tokens } from '@/theme/tokens';
+
+/** Fiche site — R6.2. Consultation seule (D4) : identité, zones, ascenseurs
+ *  du site. Pas de carte interactive ni d'édition sur mobile pour l'instant
+ *  (réservé au web) — même filtre appareils↔site que fiche-site.tsx (web) :
+ *  par nom, la liste étant déjà plate côté serveur. */
+export default function PageFicheSite() {
+  const t = useTokens();
+  const { id } = useLocalSearchParams<{ id: string }>();
+  const { data: locations } = useLocations();
+  const { data: assets } = useAssets();
+
+  const site = (locations ?? []).find((l) => l.id === id);
+  if (!site) return null;
+
+  const zones = (locations ?? []).filter((l) => l.parentId === site.id);
+  const appareils = (assets ?? []).filter((a) => a.siteName === site.name);
+
+  return (
+    <SafeAreaView style={{ flex: 1, backgroundColor: t.fond }} edges={['top']}>
+      <ScrollView contentContainerStyle={{ padding: 14, gap: 10 }}>
+        <EnteteFiche titre={site.name} />
+
+        <Carte titre="Identité">
+          <LigneInfo nom="Adresse" valeur={[site.address, site.city].filter(Boolean).join(' — ') || '—'} />
+          <LigneInfo nom="Gardien" valeur={site.guardianName ?? '—'} />
+          {site.guardianPhone ? <LigneInfo nom="Téléphone" valeur={site.guardianPhone} /> : null}
+          <LigneInfo nom="Client / syndic" valeur={site.partnerName ?? '—'} />
+          <LigneInfo nom="Appareils" valeur={String(site.assetCount)} />
+        </Carte>
+
+        {zones.length ? (
+          <Carte titre="Emplacements">
+            {zones.map((z) => (
+              <LigneInfo
+                key={z.id}
+                nom={z.name}
+                valeur={appareils.filter((a) => a.locationId === z.id).map((a) => a.reference).join(' · ') || '—'}
+              />
+            ))}
+          </Carte>
+        ) : null}
+
+        <Carte titre={`Ascenseurs du site (${appareils.length})`}>
+          {appareils.map((a) => (
+            <Pressable
+              key={a.id}
+              accessibilityRole="button"
+              onPress={() => router.push(`/ascenseur/${a.id}`)}
+              style={{ flexDirection: 'row', alignItems: 'center', gap: 8, paddingVertical: 3 }}
+            >
+              <Text style={{ fontFamily: 'Manrope_700Bold', fontSize: 12.5, color: t.primaire }}>
+                {a.reference}
+              </Text>
+              <Text
+                numberOfLines={1}
+                style={{ flex: 1, fontFamily: 'Manrope_400Regular', fontSize: 12.5, color: t.encre }}
+              >
+                {a.brand} {a.model ?? ''}
+              </Text>
+              <ChipStatutAppareil statut={a.status} t={t} />
+            </Pressable>
+          ))}
+          {!appareils.length ? (
+            <Text style={{ color: t.encre3, fontFamily: 'Manrope_400Regular', fontSize: 12.5 }}>
+              Aucun appareil rattaché.
+            </Text>
+          ) : null}
+        </Carte>
+      </ScrollView>
+    </SafeAreaView>
+  );
+}
+
+function ChipStatutAppareil({ statut, t }: { statut: AssetStatus; t: Tokens }) {
+  const enService = statut === 'IN_SERVICE';
+  return (
+    <Text
+      style={{
+        fontFamily: 'Manrope_700Bold',
+        fontSize: 10.5,
+        color: enService ? t.stTermine : t.stAttente,
+        backgroundColor: enService ? t.stTermineFond : t.stAttenteFond,
+        paddingHorizontal: 8,
+        paddingVertical: 2,
+        borderRadius: 999,
+        overflow: 'hidden',
+      }}
+    >
+      {ASSET_STATUS_LABELS[statut]}
+    </Text>
+  );
+}

apps/mobile/app/sites/index.tsx

@@ -0,0 +1,69 @@
+import { router } from 'expo-router';
+import { FlatList, Pressable, Text, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { useLocations } from '@/api/exploitation';
+import { EnteteFiche } from '@/composants/ui';
+import { useTokens } from '@/theme/tokens';
+
+/** Sites — R6.2 (Parc). Liste plate → sites de premier niveau seulement
+ *  (une zone n'a jamais de fiche propre, elle suit son site — même règle
+ *  que le web, sites.tsx). */
+export default function PageSites() {
+  const t = useTokens();
+  const { data: locations } = useLocations();
+  const sites = (locations ?? []).filter((l) => l.parentId === null);
+
+  return (
+    <SafeAreaView style={{ flex: 1, backgroundColor: t.fond }} edges={['top']}>
+      <View style={{ flex: 1, padding: 14, gap: 10 }}>
+        <EnteteFiche titre="Sites" />
+        <FlatList
+          data={sites}
+          keyExtractor={(s) => s.id}
+          contentContainerStyle={{ gap: 8, paddingBottom: 12 }}
+          ListEmptyComponent={
+            <Text style={{ color: t.encre3, fontFamily: 'Manrope_600SemiBold', padding: 16, textAlign: 'center' }}>
+              Aucun site accessible.
+            </Text>
+          }
+          renderItem={({ item: s }) => (
+            <Pressable
+              accessibilityRole="button"
+              onPress={() => router.push(`/sites/${s.id}`)}
+              style={{
+                backgroundColor: t.surface,
+                borderColor: t.bordure,
+                borderWidth: 1,
+                borderRadius: 12,
+                padding: 12,
+                gap: 2,
+              }}
+            >
+              <View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
+                <Text style={{ flex: 1, fontFamily: 'Manrope_700Bold', fontSize: 14, color: t.encre }}>
+                  {s.name}
+                </Text>
+                <Text
+                  style={{
+                    fontFamily: 'Manrope_700Bold',
+                    fontSize: 10.5,
+                    color: t.encre2,
+                    backgroundColor: t.surface2,
+                    paddingHorizontal: 8,
+                    paddingVertical: 2,
+                    borderRadius: 999,
+                  }}
+                >
+                  {s.assetCount} appareil{s.assetCount > 1 ? 's' : ''}
+                </Text>
+              </View>
+              <Text style={{ fontFamily: 'Manrope_400Regular', fontSize: 12, color: t.encre2 }}>
+                {[s.address, s.city].filter(Boolean).join(' — ') || '—'}
+              </Text>
+            </Pressable>
+          )}
+        />
+      </View>
+    </SafeAreaView>
+  );
+}