|
|
@ -1,5 +1,5 @@ |
|
|
|
import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react'; |
|
|
|
import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react'; |
|
|
|
import { Icon, Card, Text, Avatar, useTheme, IconButton, MD3Colors, Button } from 'react-native-paper'; |
|
|
|
import { Icon, Card, Text, Avatar, useTheme, IconButton, MD3Colors, Button, TouchableRipple } from 'react-native-paper'; |
|
|
|
import { RefreshControl, StyleSheet, View, ScrollView, Image, Dimensions } from 'react-native'; |
|
|
|
import { RefreshControl, StyleSheet, View, ScrollView, Image, Dimensions } from 'react-native'; |
|
|
|
import ilustration from '../assets/images/checked.png'; |
|
|
|
import ilustration from '../assets/images/checked.png'; |
|
|
|
import danger from '../assets/images/danger.png'; |
|
|
|
import danger from '../assets/images/danger.png'; |
|
|
@ -14,6 +14,7 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<View style={styles.container}> |
|
|
|
<View style={styles.container}> |
|
|
|
<Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, marginTop: 10, backgroundColor: colors.beanRed }}> |
|
|
|
<Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, marginTop: 10, backgroundColor: colors.beanRed }}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('IncidentScreen') }}> |
|
|
|
<View style={styles.cardContent}> |
|
|
|
<View style={styles.cardContent}> |
|
|
|
<View style={styles.leftContent}> |
|
|
|
<View style={styles.leftContent}> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text> |
|
|
@ -31,10 +32,12 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
/> |
|
|
|
/> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card> |
|
|
|
</Card> |
|
|
|
|
|
|
|
|
|
|
|
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10 }}> |
|
|
|
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10 }}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('ActivityScreen') }}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<Image |
|
|
|
<Image |
|
|
|
alt="Activity" |
|
|
|
alt="Activity" |
|
|
@ -44,12 +47,14 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
/> |
|
|
|
/> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text> |
|
|
|
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text> |
|
|
|
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text> |
|
|
|
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}> |
|
|
|
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('ActivityScreen') }}> |
|
|
|
ISI |
|
|
|
ISI |
|
|
|
</Button> |
|
|
|
</Button> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card > |
|
|
|
</Card > |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('DailyReportScreen') }}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<Image |
|
|
|
<Image |
|
|
|
alt="ilustration" |
|
|
|
alt="ilustration" |
|
|
@ -59,15 +64,17 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
/> |
|
|
|
/> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Harian</Text> |
|
|
|
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Harian</Text> |
|
|
|
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib di isi setiap hari</Text> |
|
|
|
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib di isi setiap hari</Text> |
|
|
|
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}> |
|
|
|
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DailyReportScreen') }}> |
|
|
|
ISI |
|
|
|
ISI |
|
|
|
</Button> |
|
|
|
</Button> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card > |
|
|
|
</Card > |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
|
|
|
|
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10, marginTop: 5 }}> |
|
|
|
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10, marginTop: 5 }}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('PatroliScreen') }}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<Image |
|
|
|
<Image |
|
|
|
alt="patroli" |
|
|
|
alt="patroli" |
|
|
@ -81,8 +88,10 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
ISI |
|
|
|
ISI |
|
|
|
</Button> |
|
|
|
</Button> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card > |
|
|
|
</Card > |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
<Card elevation={4} style={styles.card}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('PresenceScreen') }}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<Image |
|
|
|
<Image |
|
|
|
alt="calender" |
|
|
|
alt="calender" |
|
|
@ -96,10 +105,12 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
ISI |
|
|
|
ISI |
|
|
|
</Button> |
|
|
|
</Button> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card > |
|
|
|
</Card > |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
|
|
|
|
<Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, backgroundColor: colors.beanRed }}> |
|
|
|
<Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, backgroundColor: colors.beanRed }}> |
|
|
|
|
|
|
|
<TouchableRipple onPress={() => { navigation.navigate('DialogFormIncident') }}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<View style={styles.cardContentIncident}> |
|
|
|
<Image |
|
|
|
<Image |
|
|
|
alt="danger-2" |
|
|
|
alt="danger-2" |
|
|
@ -113,6 +124,7 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
TEKAN |
|
|
|
TEKAN |
|
|
|
</Button> |
|
|
|
</Button> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
|
|
|
|
</TouchableRipple> |
|
|
|
</Card> |
|
|
|
</Card> |
|
|
|
</View > |
|
|
|
</View > |
|
|
|
) |
|
|
|
) |
|
|
@ -121,7 +133,8 @@ export default function ServiceScreen({ route, navigation }) { |
|
|
|
const styles = StyleSheet.create({ |
|
|
|
const styles = StyleSheet.create({ |
|
|
|
container: { |
|
|
|
container: { |
|
|
|
flex: 1, |
|
|
|
flex: 1, |
|
|
|
marginTop: 30 |
|
|
|
marginTop: 30, |
|
|
|
|
|
|
|
backgroundColor: colors.pureWhite |
|
|
|
}, |
|
|
|
}, |
|
|
|
Text: { |
|
|
|
Text: { |
|
|
|
fontSize: 16, |
|
|
|
fontSize: 16, |
|
|
|