kibin/territory-log
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Sprint 5 - Toast, ConfirmDialog, EmptyStates, Settings, Export/Import, Accessibility (TERLOG-52/53/54/55/56/57/58/59)

Browse Source
This commit is contained in:
root
2026-02-19 22:05:40 +08:00
parent 6fe6ebef13
commit c8fe67f346
20 changed files with 1416 additions and 619 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
components/visits/LogVisitSheet.tsx
View File

@@ -64,9 +64,16 @@ export function LogVisitSheet({ contactId, contactName, visible, onClose, onSave
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} className="flex-1">
<View className="flex-1 bg-secondary">
<View className="flex-row items-center justify-between px-4 py-4 border-b border-gray-200 bg-white">
<TouchableOpacity onPress={() => { reset(); onClose(); }}><X size={22} color="#2C3E50" /></TouchableOpacity>
<TouchableOpacity
onPress={() => { reset(); onClose(); }}
accessibilityRole="button"
accessibilityLabel="Close"
style={{ minWidth: 44, minHeight: 44, alignItems: 'center', justifyContent: 'center' }}
>
<X size={22} color="#2C3E50" />
</TouchableOpacity>
<Text className="text-charcoal font-semibold text-lg">Log Visit</Text>
<View style={{ width: 22 }} />
<View style={{ width: 44 }} />
</View>
<ScrollView className="flex-1 px-4 pt-4" keyboardShouldPersistTaps="handled">
@@ -78,7 +85,15 @@ export function LogVisitSheet({ contactId, contactName, visible, onClose, onSave
<Text className="text-charcoal font-medium mb-2">Response</Text>
<View className="flex-row flex-wrap gap-2 mb-4">
{RESPONSE_OPTIONS.map((r) => (
<TouchableOpacity key={r} onPress={() => setResponse(r === response ? '' : r)} className={`px-3 py-1.5 rounded-full border ${response === r ? 'bg-primary border-primary' : 'bg-white border-gray-200'}`}>
<TouchableOpacity
key={r}
onPress={() => setResponse(r === response ? '' : r)}
className={`px-3 py-1.5 rounded-full border ${response === r ? 'bg-primary border-primary' : 'bg-white border-gray-200'}`}
accessibilityRole="button"
accessibilityLabel={r}
accessibilityState={{ selected: response === r }}
style={{ minHeight: 36 }}
>
<Text className={`text-sm ${response === r ? 'text-white' : 'text-charcoal'}`}>{r}</Text>
</TouchableOpacity>
))}

32
components/visits/TopicSelector.tsx
View File

@@ -40,7 +40,14 @@ export function TopicSelector({ value, onChange }: Props) {
return (
<View className="mb-4">
<Text className="text-charcoal font-medium mb-1">Topic</Text>
<TouchableOpacity onPress={() => setShow(true)} className="flex-row items-center border border-gray-200 rounded-xl px-4 py-3 bg-white">
<TouchableOpacity
onPress={() => setShow(true)}
className="flex-row items-center border border-gray-200 rounded-xl px-4 py-3 bg-white"
accessibilityRole="button"
accessibilityLabel={value ? `Selected topic: ${value}` : 'Select topic'}
accessibilityHint="Opens topic selector"
style={{ minHeight: 48 }}
>
<Text className={`flex-1 ${value ? 'text-charcoal' : 'text-gray-400'}`}>{value || 'Select topic...'}</Text>
<ChevronDown size={16} color="#9CA3AF" />
</TouchableOpacity>
@@ -48,9 +55,16 @@ export function TopicSelector({ value, onChange }: Props) {
<Modal visible={show} animationType="slide" presentationStyle="pageSheet">
<View className="flex-1 bg-secondary">
<View className="flex-row items-center justify-between px-4 py-4 border-b border-gray-200 bg-white">
<TouchableOpacity onPress={() => setShow(false)}><X size={22} color="#2C3E50" /></TouchableOpacity>
<TouchableOpacity
onPress={() => setShow(false)}
accessibilityRole="button"
accessibilityLabel="Close topic selector"
style={{ minWidth: 44, minHeight: 44, alignItems: 'center', justifyContent: 'center' }}
>
<X size={22} color="#2C3E50" />
</TouchableOpacity>
<Text className="text-charcoal font-semibold text-lg">Select Topic</Text>
<View style={{ width: 22 }} />
<View style={{ width: 44 }} />
</View>
<View className="px-4 pt-3 pb-2">
@@ -66,7 +80,13 @@ export function TopicSelector({ value, onChange }: Props) {
onChangeText={setNewTopic}
onSubmitEditing={addCustomTopic}
/>
<TouchableOpacity onPress={addCustomTopic} className="bg-primary rounded-xl px-3 items-center justify-center">
<TouchableOpacity
onPress={addCustomTopic}
className="bg-primary rounded-xl px-3 items-center justify-center"
accessibilityRole="button"
accessibilityLabel="Add custom topic"
style={{ minWidth: 44, minHeight: 44 }}
>
<Plus size={18} color="white" />
</TouchableOpacity>
</View>
@@ -80,6 +100,10 @@ export function TopicSelector({ value, onChange }: Props) {
<TouchableOpacity
onPress={() => { onChange(item.name); setShow(false); }}
className={`bg-white rounded-xl px-4 py-3 flex-row items-center justify-between ${value === item.name ? 'border-2 border-primary' : 'border border-gray-100'}`}
accessibilityRole="button"
accessibilityLabel={item.name}
accessibilityState={{ selected: value === item.name }}
style={{ minHeight: 48 }}
>
<Text className="text-charcoal">{item.name}</Text>
{item.is_default === 1 && <Text className="text-xs text-gray-400">Default</Text>}