Rebuild as InnungsApp project: replace stadtwerke analysis with full documentation
- PRD: vollständige Produktspezifikation (5 Module, Scope, Akzeptanzkriterien) - ARCHITECTURE: Tech Stack, Ordnerstruktur, Multi-Tenancy, Push, Kosten - DATABASE_SCHEMA: Vollständiges SQL-Schema mit RLS Policies und Views - USER_STORIES: 40+ Stories nach Rolle (Admin, Mitglied, Azubi, Obermeister) - PERSONAS: 5 detaillierte Nutzerprofile mit Alltag, Zitaten und Erwartungen - BUSINESS_MODEL: Preistabellen, Unit Economics, Revenue-Projektionen, Distribution - ROADMAP: 6 Phasen, Sprint-Planung, Meilensteine und KPIs - COMPETITIVE_ANALYSIS: Wettbewerbsmatrix, USPs, Preispositionierung - API_DESIGN: Supabase Query Patterns, Edge Functions, Realtime Subscriptions - ONBOARDING_FLOWS: 7 User Flows von Setup bis Fehlerfall - GTM_STRATEGY: 3-Phasen-Vertrieb, Outreach-Sequenz, Einwandbehandlung - AZUBI_MODULE: Video-Feed, 1-Click-Apply, Chat, Berichtsheft, Quiz - DSGVO_KONZEPT: Rechtsgrundlagen, TOMs, AVV, Minderjährige, Incident Response - FEATURES_BACKLOG: 72 Features nach MoSCoW + Technische Schulden Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
107
innungsapp/apps/mobile/app/(app)/members/[id].tsx
Normal file
107
innungsapp/apps/mobile/app/(app)/members/[id].tsx
Normal file
@@ -0,0 +1,107 @@
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
ScrollView,
|
||||
TouchableOpacity,
|
||||
Linking,
|
||||
ActivityIndicator,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useLocalSearchParams, useRouter } from 'expo-router'
|
||||
import { trpc } from '@/lib/trpc'
|
||||
import { Avatar } from '@/components/ui/Avatar'
|
||||
|
||||
export default function MemberDetailScreen() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>()
|
||||
const router = useRouter()
|
||||
const { data: member, isLoading } = trpc.members.byId.useQuery({ id })
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<SafeAreaView className="flex-1 bg-white items-center justify-center">
|
||||
<ActivityIndicator size="large" color="#E63946" />
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
if (!member) return null
|
||||
|
||||
return (
|
||||
<SafeAreaView className="flex-1 bg-gray-50" edges={['top']}>
|
||||
{/* Header */}
|
||||
<View className="flex-row items-center px-4 py-3 bg-white border-b border-gray-100">
|
||||
<TouchableOpacity onPress={() => router.back()} className="mr-3">
|
||||
<Text className="text-brand-500 text-base">← Zurück</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<ScrollView>
|
||||
{/* Profile Header */}
|
||||
<View className="bg-white px-6 py-8 items-center border-b border-gray-100">
|
||||
<Avatar
|
||||
name={member.name}
|
||||
imageUrl={member.avatarUrl ?? undefined}
|
||||
size={80}
|
||||
/>
|
||||
<Text className="text-2xl font-bold text-gray-900 mt-4">{member.name}</Text>
|
||||
<Text className="text-gray-500 mt-1">{member.betrieb}</Text>
|
||||
{member.istAusbildungsbetrieb && (
|
||||
<View className="mt-2 bg-green-100 px-3 py-1 rounded-full">
|
||||
<Text className="text-green-700 text-xs font-medium">
|
||||
🎓 Ausbildungsbetrieb
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
{/* Details */}
|
||||
<View className="bg-white mx-4 mt-4 rounded-2xl overflow-hidden border border-gray-100">
|
||||
<InfoRow label="Sparte" value={member.sparte} />
|
||||
<InfoRow label="Ort" value={member.ort} />
|
||||
{member.seit && (
|
||||
<InfoRow label="Mitglied seit" value={String(member.seit)} />
|
||||
)}
|
||||
</View>
|
||||
|
||||
{/* Contact Buttons */}
|
||||
<View className="mx-4 mt-4 gap-3">
|
||||
{member.telefon && (
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL(`tel:${member.telefon}`)}
|
||||
className="bg-brand-500 rounded-2xl py-4 flex-row items-center justify-center gap-2"
|
||||
>
|
||||
<Text className="text-white text-xl">📞</Text>
|
||||
<Text className="text-white font-semibold text-base">
|
||||
Anrufen
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
<TouchableOpacity
|
||||
onPress={() =>
|
||||
Linking.openURL(
|
||||
`mailto:${member.email}?subject=InnungsApp%20Anfrage`
|
||||
)
|
||||
}
|
||||
className="bg-white border border-gray-200 rounded-2xl py-4 flex-row items-center justify-center gap-2"
|
||||
>
|
||||
<Text className="text-gray-900 text-xl">✉️</Text>
|
||||
<Text className="text-gray-900 font-semibold text-base">
|
||||
E-Mail senden
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<View className="h-8" />
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
function InfoRow({ label, value }: { label: string; value: string }) {
|
||||
return (
|
||||
<View className="flex-row items-center px-4 py-3 border-b border-gray-50 last:border-0">
|
||||
<Text className="text-sm text-gray-500 w-32">{label}</Text>
|
||||
<Text className="text-sm text-gray-900 font-medium flex-1">{value}</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user