chore: update UI
This commit is contained in:
@@ -3,10 +3,12 @@ import {
|
||||
Modal as RNModal,
|
||||
View,
|
||||
ScrollView,
|
||||
KeyboardAvoidingView,
|
||||
TouchableOpacity,
|
||||
Text,
|
||||
StyleSheet,
|
||||
Animated,
|
||||
Platform,
|
||||
} from "react-native";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { spacing, borderRadius, fontSize } from "../../theme";
|
||||
@@ -133,6 +135,10 @@ export default function Modal({
|
||||
animationType="fade"
|
||||
onRequestClose={onClose}
|
||||
>
|
||||
<KeyboardAvoidingView
|
||||
style={{ flex: 1 }}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<View style={styles.overlay}>
|
||||
<Animated.View
|
||||
style={[
|
||||
@@ -186,6 +192,7 @@ export default function Modal({
|
||||
</ScrollView>
|
||||
</Animated.View>
|
||||
</View>
|
||||
</KeyboardAvoidingView>
|
||||
</RNModal>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -974,9 +974,9 @@ export default function UsersScreen() {
|
||||
{ color: colors.warning },
|
||||
]}
|
||||
>
|
||||
{item.clientData.amende}
|
||||
{item.clientData.amende} €
|
||||
</Text>
|
||||
<Text style={styles.statLabel}>Amendes</Text>
|
||||
<Text style={styles.statLabel}>Amende</Text>
|
||||
</View>
|
||||
)}
|
||||
<View style={styles.stat}>
|
||||
@@ -1456,16 +1456,16 @@ export default function UsersScreen() {
|
||||
Amende actuelle
|
||||
</Text>
|
||||
<Text style={{ color: colors.warning, fontSize: fontSize.lg, fontWeight: "700" }}>
|
||||
{sanctionModal.client?.amende ?? 0} pts
|
||||
{sanctionModal.client?.amende ?? 0} €
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
{/* Ajouter amende */}
|
||||
<TextInput
|
||||
label="Points à ajouter"
|
||||
label="Montant à ajouter (€)"
|
||||
value={amendeAmount}
|
||||
onChangeText={setAmendeAmount}
|
||||
keyboardType="numeric"
|
||||
keyboardType="decimal-pad"
|
||||
icon={<Ionicons name="add-circle-outline" size={18} color={colors.textMuted} />}
|
||||
/>
|
||||
<TextInput
|
||||
|
||||
@@ -150,9 +150,9 @@ export default function UsersScreen() {
|
||||
{appSettings.show_amende_score && (
|
||||
<View style={styles.stat}>
|
||||
<Text style={[styles.statValue, { color: colors.warning }]}>
|
||||
{item.amende}
|
||||
{item.amende} €
|
||||
</Text>
|
||||
<Text style={styles.statLabel}>Amendes</Text>
|
||||
<Text style={styles.statLabel}>Amende</Text>
|
||||
</View>
|
||||
)}
|
||||
<View style={styles.stat}>
|
||||
|
||||
@@ -2,10 +2,13 @@ import React, { type ReactNode, useEffect, useRef } from "react";
|
||||
import {
|
||||
Modal as RNModal,
|
||||
View,
|
||||
ScrollView,
|
||||
KeyboardAvoidingView,
|
||||
TouchableOpacity,
|
||||
Text,
|
||||
StyleSheet,
|
||||
Animated,
|
||||
Platform,
|
||||
} from "react-native";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { spacing, borderRadius, fontSize } from "../../theme";
|
||||
@@ -60,74 +63,86 @@ export default function Modal({
|
||||
animationType="fade"
|
||||
onRequestClose={onClose}
|
||||
>
|
||||
<View style={styles.overlay}>
|
||||
<Animated.View
|
||||
style={[
|
||||
styles.content,
|
||||
{
|
||||
backgroundColor: colors.bgSecondary,
|
||||
borderColor: colors.borderSubtle,
|
||||
shadowColor: colors.accent,
|
||||
transform: [{ scale }],
|
||||
opacity,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<View
|
||||
<KeyboardAvoidingView
|
||||
style={{ flex: 1 }}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<View style={styles.overlay}>
|
||||
<Animated.View
|
||||
style={[
|
||||
styles.accentBar,
|
||||
{ backgroundColor: colors.accent },
|
||||
styles.content,
|
||||
{
|
||||
backgroundColor: colors.bgSecondary,
|
||||
borderColor: colors.borderSubtle,
|
||||
shadowColor: colors.accent,
|
||||
transform: [{ scale }],
|
||||
opacity,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<View style={styles.header}>
|
||||
<View style={styles.titleRow}>
|
||||
{icon && (
|
||||
<View
|
||||
style={[
|
||||
styles.iconCircle,
|
||||
{
|
||||
backgroundColor:
|
||||
(iconColor || colors.accent) +
|
||||
"20",
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Ionicons
|
||||
name={icon}
|
||||
size={20}
|
||||
color={iconColor || colors.accent}
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
{title && (
|
||||
<Text
|
||||
style={[
|
||||
styles.title,
|
||||
{ color: colors.textWhite },
|
||||
]}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
<TouchableOpacity
|
||||
onPress={onClose}
|
||||
>
|
||||
<View
|
||||
style={[
|
||||
styles.closeBtn,
|
||||
{ backgroundColor: colors.borderSubtle },
|
||||
styles.accentBar,
|
||||
{ backgroundColor: colors.accent },
|
||||
]}
|
||||
activeOpacity={0.7}
|
||||
/>
|
||||
<View style={styles.header}>
|
||||
<View style={styles.titleRow}>
|
||||
{icon && (
|
||||
<View
|
||||
style={[
|
||||
styles.iconCircle,
|
||||
{
|
||||
backgroundColor:
|
||||
(iconColor || colors.accent) +
|
||||
"20",
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Ionicons
|
||||
name={icon}
|
||||
size={20}
|
||||
color={iconColor || colors.accent}
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
{title && (
|
||||
<Text
|
||||
style={[
|
||||
styles.title,
|
||||
{ color: colors.textWhite },
|
||||
]}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
<TouchableOpacity
|
||||
onPress={onClose}
|
||||
style={[
|
||||
styles.closeBtn,
|
||||
{ backgroundColor: colors.borderSubtle },
|
||||
]}
|
||||
activeOpacity={0.7}
|
||||
>
|
||||
<Ionicons
|
||||
name="close"
|
||||
size={20}
|
||||
color={colors.textMuted}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<ScrollView
|
||||
style={styles.body}
|
||||
contentContainerStyle={{ paddingBottom: spacing.xl }}
|
||||
showsVerticalScrollIndicator={false}
|
||||
keyboardShouldPersistTaps="handled"
|
||||
>
|
||||
<Ionicons
|
||||
name="close"
|
||||
size={20}
|
||||
color={colors.textMuted}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<View style={styles.body}>{children}</View>
|
||||
</Animated.View>
|
||||
</View>
|
||||
{children}
|
||||
</ScrollView>
|
||||
</Animated.View>
|
||||
</View>
|
||||
</KeyboardAvoidingView>
|
||||
</RNModal>
|
||||
);
|
||||
}
|
||||
@@ -190,6 +205,5 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
body: {
|
||||
paddingHorizontal: spacing.xl,
|
||||
paddingBottom: spacing.xl,
|
||||
},
|
||||
});
|
||||
|
||||
@@ -333,10 +333,10 @@ export default function OrderHistoryScreen() {
|
||||
penaltyCount > 0 && penaltyCount < 3 && { color: colors.warning },
|
||||
]}
|
||||
>
|
||||
{penaltyCount}
|
||||
{penaltyCount} €
|
||||
</Text>
|
||||
<Text style={styles.statLabel}>
|
||||
Score amendes
|
||||
Amende
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user