init
This commit is contained in:
234
app/(tabs)/investisseurs.tsx
Normal file
234
app/(tabs)/investisseurs.tsx
Normal file
@ -0,0 +1,234 @@
|
||||
import { useState } from 'react';
|
||||
import {
|
||||
Alert,
|
||||
FlatList,
|
||||
Modal,
|
||||
Pressable,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
} from 'react-native';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { LabeledField } from '../../src/components/LabeledField';
|
||||
import { PrimaryButton } from '../../src/components/PrimaryButton';
|
||||
import { useApp } from '../../src/context/AppContext';
|
||||
import { colors } from '../../src/theme/colors';
|
||||
import type { InvestisseurRow } from '../../src/data/types';
|
||||
import { router } from 'expo-router';
|
||||
|
||||
function parseNum(s: string): number | null {
|
||||
const v = Number(s.replace(',', '.').replace(/\s/g, ''));
|
||||
return Number.isFinite(v) ? v : null;
|
||||
}
|
||||
|
||||
export default function InvestisseursScreen() {
|
||||
const insets = useSafeAreaInsets();
|
||||
const app = useApp();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [editing, setEditing] = useState<InvestisseurRow | null>(null);
|
||||
const [name, setName] = useState('');
|
||||
const [email, setEmail] = useState('');
|
||||
const [phone, setPhone] = useState('');
|
||||
const [minMargin, setMinMargin] = useState('12');
|
||||
const [maxTicket, setMaxTicket] = useState('');
|
||||
const [zones, setZones] = useState('');
|
||||
|
||||
const cloudNeedsAuth = app.runtimeMode === 'cloud' && !app.user;
|
||||
|
||||
const openNew = () => {
|
||||
setEditing(null);
|
||||
setName('');
|
||||
setEmail('');
|
||||
setPhone('');
|
||||
setMinMargin('12');
|
||||
setMaxTicket('');
|
||||
setZones('');
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
const openEdit = (row: InvestisseurRow) => {
|
||||
setEditing(row);
|
||||
setName(row.display_name);
|
||||
setEmail(row.email ?? '');
|
||||
setPhone(row.phone ?? '');
|
||||
setMinMargin(String(row.min_margin_pct));
|
||||
setMaxTicket(row.max_ticket_eur != null ? String(row.max_ticket_eur) : '');
|
||||
setZones((row.zones ?? []).join(', '));
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
const save = async () => {
|
||||
if (!app.user) {
|
||||
router.push('/auth/login');
|
||||
return;
|
||||
}
|
||||
const uid = app.user.id;
|
||||
const mm = parseNum(minMargin) ?? 12;
|
||||
const mt = maxTicket.trim() ? parseNum(maxTicket) : null;
|
||||
const z = zones
|
||||
.split(',')
|
||||
.map((s) => s.trim())
|
||||
.filter(Boolean);
|
||||
await app.upsertInvestisseur({
|
||||
id: editing?.id,
|
||||
user_id: uid,
|
||||
display_name: name.trim() || 'Investisseur',
|
||||
email: email.trim() || null,
|
||||
phone: phone.trim() || null,
|
||||
min_margin_pct: mm,
|
||||
max_ticket_eur: mt,
|
||||
zones: z.length ? z : null,
|
||||
strategies: null,
|
||||
notes: null,
|
||||
});
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
if (cloudNeedsAuth) {
|
||||
return (
|
||||
<View style={[styles.center, { paddingTop: insets.top }]}>
|
||||
<Text style={styles.muted}>Connectez-vous pour gérer vos investisseurs.</Text>
|
||||
<PrimaryButton title="Connexion" onPress={() => router.push('/auth/login')} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={styles.root}>
|
||||
<FlatList
|
||||
data={app.investisseurs}
|
||||
keyExtractor={(i) => i.id}
|
||||
contentContainerStyle={{
|
||||
padding: 16,
|
||||
paddingBottom: insets.bottom + 80,
|
||||
}}
|
||||
ListEmptyComponent={
|
||||
<Text style={styles.muted}>
|
||||
Ajoutez des profils pour le module « Investisseur flash » (matching
|
||||
marge / ticket / zones).
|
||||
</Text>
|
||||
}
|
||||
renderItem={({ item }) => (
|
||||
<Pressable style={styles.card} onPress={() => openEdit(item)}>
|
||||
<Text style={styles.name}>{item.display_name}</Text>
|
||||
<Text style={styles.meta}>
|
||||
Marge mini {item.min_margin_pct}% — ticket max{' '}
|
||||
{item.max_ticket_eur != null
|
||||
? `${item.max_ticket_eur.toLocaleString('fr-FR')} €`
|
||||
: '—'}
|
||||
</Text>
|
||||
{item.zones?.length ? (
|
||||
<Text style={styles.meta}>Zones : {item.zones.join(', ')}</Text>
|
||||
) : null}
|
||||
</Pressable>
|
||||
)}
|
||||
/>
|
||||
<View style={[styles.fabRow, { bottom: insets.bottom + 16 }]}>
|
||||
<PrimaryButton title="Nouvel investisseur" onPress={openNew} />
|
||||
</View>
|
||||
|
||||
<Modal visible={open} animationType="slide" transparent>
|
||||
<View style={styles.modalBackdrop}>
|
||||
<View style={[styles.modalCard, { paddingBottom: insets.bottom + 16 }]}>
|
||||
<Text style={styles.modalTitle}>
|
||||
{editing ? 'Modifier investisseur' : 'Nouvel investisseur'}
|
||||
</Text>
|
||||
<LabeledField label="Nom" value={name} onChangeText={setName} />
|
||||
<LabeledField
|
||||
label="E-mail"
|
||||
autoCapitalize="none"
|
||||
value={email}
|
||||
onChangeText={setEmail}
|
||||
/>
|
||||
<LabeledField label="Téléphone" value={phone} onChangeText={setPhone} />
|
||||
<LabeledField
|
||||
label="Marge nette minimum (%)"
|
||||
keyboardType="decimal-pad"
|
||||
value={minMargin}
|
||||
onChangeText={setMinMargin}
|
||||
/>
|
||||
<LabeledField
|
||||
label="Ticket max (€) — optionnel"
|
||||
keyboardType="number-pad"
|
||||
value={maxTicket}
|
||||
onChangeText={setMaxTicket}
|
||||
/>
|
||||
<LabeledField
|
||||
label="Zones (ville ou CP, séparés par des virgules)"
|
||||
value={zones}
|
||||
onChangeText={setZones}
|
||||
/>
|
||||
<PrimaryButton title="Enregistrer" onPress={() => void save()} />
|
||||
{editing ? (
|
||||
<PrimaryButton
|
||||
title="Supprimer"
|
||||
variant="danger"
|
||||
containerStyle={{ marginTop: 10 }}
|
||||
onPress={() => {
|
||||
Alert.alert(
|
||||
'Supprimer',
|
||||
'Confirmer la suppression ?',
|
||||
[
|
||||
{ text: 'Annuler', style: 'cancel' },
|
||||
{
|
||||
text: 'Supprimer',
|
||||
style: 'destructive',
|
||||
onPress: () => {
|
||||
void app.deleteInvestisseur(editing.id).then(() =>
|
||||
setOpen(false),
|
||||
);
|
||||
},
|
||||
},
|
||||
],
|
||||
);
|
||||
}}
|
||||
/>
|
||||
) : null}
|
||||
<PrimaryButton
|
||||
title="Fermer"
|
||||
variant="ghost"
|
||||
containerStyle={{ marginTop: 12 }}
|
||||
onPress={() => setOpen(false)}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</Modal>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
root: { flex: 1, backgroundColor: colors.bg },
|
||||
center: { flex: 1, padding: 20, backgroundColor: colors.bg, gap: 12 },
|
||||
muted: { color: colors.textMuted, textAlign: 'center', lineHeight: 20 },
|
||||
card: {
|
||||
backgroundColor: colors.bgCard,
|
||||
borderRadius: 14,
|
||||
padding: 16,
|
||||
marginBottom: 12,
|
||||
borderWidth: 1,
|
||||
borderColor: colors.border,
|
||||
},
|
||||
name: { color: colors.text, fontSize: 17, fontWeight: '700' },
|
||||
meta: { color: colors.textMuted, marginTop: 6, fontSize: 13 },
|
||||
fabRow: { position: 'absolute', left: 16, right: 16 },
|
||||
modalBackdrop: {
|
||||
flex: 1,
|
||||
backgroundColor: 'rgba(0,0,0,0.55)',
|
||||
justifyContent: 'flex-end',
|
||||
},
|
||||
modalCard: {
|
||||
backgroundColor: colors.bgCard,
|
||||
borderTopLeftRadius: 18,
|
||||
borderTopRightRadius: 18,
|
||||
padding: 20,
|
||||
borderWidth: 1,
|
||||
borderColor: colors.border,
|
||||
},
|
||||
modalTitle: {
|
||||
color: colors.text,
|
||||
fontSize: 20,
|
||||
fontWeight: '700',
|
||||
marginBottom: 16,
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user