Refactor frontend-mobile

2026-07-07 18:08:44 +02:00
parent 69d66729aa
commit 9949b85001
14 changed files with 771 additions and 100 deletions
@@ -0,0 +1,81 @@
+import React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
+import { Ionicons } from '@expo/vector-icons';
+import { useRouter } from 'expo-router';
+import { colors, spacing, borderRadius, shadows } from '../../constants/theme';
+
+export default function ScanTabScreen() {
+  const router = useRouter();
+
+  return (
+    <View style={styles.container}>
+      <View style={styles.content}>
+        <View style={styles.iconContainer}>
+          <Ionicons name="scan" size={64} color={colors.scanButton} />
+        </View>
+        <Text style={styles.title}>Escanear TSI</Text>
+        <Text style={styles.description}>
+          Escanea el código de barras de tu tarjeta sanitaria para encontrar tus medicamentos
+        </Text>
+        <TouchableOpacity
+          style={[styles.button, shadows.scanButton]}
+          activeOpacity={0.85}
+          onPress={() => router.push('/scanner')}
+        >
+          <Ionicons name="scan" size={24} color="#ffffff" />
+          <Text style={styles.buttonText}>Iniciar escaneo</Text>
+        </TouchableOpacity>
+      </View>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: colors.background,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  content: {
+    alignItems: 'center',
+    paddingHorizontal: spacing.xl,
+    gap: spacing.md,
+  },
+  iconContainer: {
+    width: 100,
+    height: 100,
+    borderRadius: 50,
+    backgroundColor: colors.primaryContainer,
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginBottom: spacing.sm,
+  },
+  title: {
+    fontSize: 22,
+    fontWeight: 'bold',
+    color: colors.text,
+  },
+  description: {
+    fontSize: 15,
+    color: colors.textSecondary,
+    textAlign: 'center',
+    lineHeight: 22,
+    maxWidth: 280,
+  },
+  button: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: spacing.sm,
+    backgroundColor: colors.scanButton,
+    borderRadius: borderRadius.lg,
+    paddingVertical: spacing.md,
+    paddingHorizontal: spacing.xl,
+    marginTop: spacing.md,
+  },
+  buttonText: {
+    fontSize: 17,
+    fontWeight: '600',
+    color: '#ffffff',
+  },
+});