140 lines
3.0 KiB
TypeScript
140 lines
3.0 KiB
TypeScript
import { Pressable, ScrollView, StyleSheet, Text, View } from 'react-native';
|
||
import { router } from 'expo-router';
|
||
|
||
const ITEMS = [
|
||
{
|
||
key: 'account',
|
||
title: 'Konto',
|
||
subtitle: 'Session, Tenant-Wechsel, Logout',
|
||
href: '/more/account',
|
||
},
|
||
{
|
||
key: 'settings',
|
||
title: 'Einstellungen',
|
||
subtitle: 'Server-Instanz verwalten',
|
||
href: '/more/settings',
|
||
},
|
||
{
|
||
key: 'wiki',
|
||
title: 'Wiki',
|
||
subtitle: 'Wissen und Dokumentation',
|
||
href: '/more/wiki',
|
||
},
|
||
{
|
||
key: 'customers',
|
||
title: 'Kunden',
|
||
subtitle: '',
|
||
href: '/more/customers',
|
||
},
|
||
{
|
||
key: 'plants',
|
||
title: 'Objekte',
|
||
subtitle: '',
|
||
href: '/more/plants',
|
||
},
|
||
{
|
||
key: 'inventory',
|
||
title: 'Kundeninventar',
|
||
subtitle: 'Inventar und Scanner',
|
||
href: '/more/inventory',
|
||
},
|
||
{
|
||
key: 'nimbot',
|
||
title: 'Nimbot M2',
|
||
subtitle: 'Drucker verbinden',
|
||
href: '/more/nimbot',
|
||
},
|
||
];
|
||
|
||
export default function MoreScreen() {
|
||
return (
|
||
<View style={styles.screen}>
|
||
<ScrollView style={styles.list} contentContainerStyle={styles.listContent}>
|
||
<View style={styles.section}>
|
||
<Text style={styles.sectionTitle}>Funktionen</Text>
|
||
<Text style={styles.sectionSubtitle}>Weitere Bereiche und Einstellungen.</Text>
|
||
</View>
|
||
|
||
{ITEMS.map((item, index) => (
|
||
<Pressable key={item.key} style={styles.row} onPress={() => router.push(item.href as any)}>
|
||
<View style={styles.rowMain}>
|
||
<Text style={styles.rowTitle}>{item.title}</Text>
|
||
<Text style={styles.rowSubtitle}>{item.subtitle}</Text>
|
||
</View>
|
||
<Text style={styles.rowArrow}>›</Text>
|
||
{index < ITEMS.length - 1 ? <View style={styles.rowDivider} /> : null}
|
||
</Pressable>
|
||
))}
|
||
</ScrollView>
|
||
</View>
|
||
);
|
||
}
|
||
|
||
const styles = StyleSheet.create({
|
||
screen: {
|
||
flex: 1,
|
||
backgroundColor: '#ffffff',
|
||
},
|
||
list: {
|
||
flex: 1,
|
||
backgroundColor: '#ffffff',
|
||
},
|
||
listContent: {
|
||
paddingBottom: 24,
|
||
},
|
||
section: {
|
||
paddingHorizontal: 16,
|
||
paddingTop: 14,
|
||
paddingBottom: 10,
|
||
borderBottomWidth: 1,
|
||
borderBottomColor: '#e5e7eb',
|
||
},
|
||
sectionTitle: {
|
||
color: '#111827',
|
||
fontSize: 17,
|
||
fontWeight: '700',
|
||
},
|
||
sectionSubtitle: {
|
||
color: '#6b7280',
|
||
fontSize: 13,
|
||
marginTop: 3,
|
||
},
|
||
row: {
|
||
paddingHorizontal: 16,
|
||
paddingVertical: 14,
|
||
backgroundColor: '#ffffff',
|
||
position: 'relative',
|
||
flexDirection: 'row',
|
||
alignItems: 'center',
|
||
justifyContent: 'space-between',
|
||
gap: 10,
|
||
},
|
||
rowMain: {
|
||
flex: 1,
|
||
minWidth: 0,
|
||
},
|
||
rowTitle: {
|
||
color: '#111827',
|
||
fontSize: 15,
|
||
fontWeight: '600',
|
||
},
|
||
rowSubtitle: {
|
||
color: '#6b7280',
|
||
fontSize: 13,
|
||
marginTop: 2,
|
||
},
|
||
rowArrow: {
|
||
color: '#9ca3af',
|
||
fontSize: 24,
|
||
lineHeight: 24,
|
||
},
|
||
rowDivider: {
|
||
position: 'absolute',
|
||
left: 16,
|
||
right: 16,
|
||
bottom: 0,
|
||
height: 1,
|
||
backgroundColor: '#e5e7eb',
|
||
},
|
||
});
|