ordo
/
mobile-nawakara
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix(serivce): change layout view service page

master
farhantock 4 months ago
parent
24676f52a1
commit
23e9167a79
1 changed files with 94 additions and 81 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 175
      src/screens/Service.js

175
src/screens/Service.js
Unescape View File

@ -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,105 +14,117 @@ 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 }}>
<View style={styles.cardContent}> <TouchableRipple onPress={() => { navigation.navigate('IncidentScreen') }}>
<View style={styles.leftContent}> <View style={styles.cardContent}>
<Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text> <View style={styles.leftContent}>
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Laporan kejadian wajib diisi jika ada kejadian di tempat project</Text> <Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 7, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('IncidentScreen') }}> <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Laporan kejadian wajib diisi jika ada kejadian di tempat project</Text>
ISI <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 7, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('IncidentScreen') }}>
</Button> ISI
</Button>
</View>
<View style={styles.rightContent}>
<Image
alt="danger"
source={danger}
style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
resizeMode="contain"
/>
</View>
</View> </View>
<View style={styles.rightContent}> </TouchableRipple>
<Image
alt="danger"
source={danger}
style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
resizeMode="contain"
/>
</View>
</View>
</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}>
<View style={styles.cardContentIncident}> <TouchableRipple onPress={() => { navigation.navigate('ActivityScreen') }}>
<Image <View style={styles.cardContentIncident}>
alt="Activity" <Image
source={activity} alt="Activity"
style={{ width: '100%', height: Dimensions.get('window').height / 15 }} source={activity}
resizeMode="contain" style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
/> resizeMode="contain"
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text> />
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text> <Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}> <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text>
ISI <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('ActivityScreen') }}>
</Button> ISI
</View> </Button>
</View>
</TouchableRipple>
</Card > </Card >
<Card elevation={4} style={styles.card}> <Card elevation={4} style={styles.card}>
<View style={styles.cardContentIncident}> <TouchableRipple onPress={() => { navigation.navigate('DailyReportScreen') }}>
<Image <View style={styles.cardContentIncident}>
alt="ilustration" <Image
source={ilustration} alt="ilustration"
style={{ width: '100%', height: Dimensions.get('window').height / 15 }} source={ilustration}
resizeMode="contain" style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
/> resizeMode="contain"
<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 style={[styles.Text, { color: colors.pureWhite }]}>Laporan Harian</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}> <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib di isi setiap hari</Text>
ISI <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DailyReportScreen') }}>
</Button> ISI
</View> </Button>
</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}>
<View style={styles.cardContentIncident}> <TouchableRipple onPress={() => { navigation.navigate('PatroliScreen') }}>
<Image <View style={styles.cardContentIncident}>
alt="patroli" <Image
source={patroli} alt="patroli"
style={{ width: '100%', height: Dimensions.get('window').height / 15 }} source={patroli}
resizeMode="contain" style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
/> resizeMode="contain"
<Text style={[styles.Text, { color: colors.pureWhite }]}>Patroli</Text> />
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Patroli setiap Pos</Text> <Text style={[styles.Text, { color: colors.pureWhite }]}>Patroli</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PatroliScreen') }}> <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Patroli setiap Pos</Text>
ISI <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PatroliScreen') }}>
</Button> ISI
</View> </Button>
</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}>
<Image
alt="calender"
source={calender}
style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
resizeMode="contain"
/>
<Text style={[styles.Text, { color: colors.pureWhite }]}>Kehadiran</Text>
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Lihat riwayat kehadiran</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PresenceScreen') }}>
ISI
</Button>
</View>
</TouchableRipple>
</Card >
</View>
<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="calender" alt="danger-2"
source={calender} source={danger2}
style={{ width: '100%', height: Dimensions.get('window').height / 15 }} style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
resizeMode="contain" resizeMode="contain"
/> />
<Text style={[styles.Text, { color: colors.pureWhite }]}>Kehadiran</Text> <Text style={[styles.Text, { color: colors.pureWhite }]}>TOMBOL PANIK</Text>
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Lihat riwayat kehadiran</Text> <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Tekan tombol ini jika terjadi insiden</Text>
<Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PresenceScreen') }}> <Button mode="contained" style={{ marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%', borderRadius: 10 }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
ISI TEKAN
</Button> </Button>
</View> </View>
</Card > </TouchableRipple>
</View>
<Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, backgroundColor: colors.beanRed }}>
<View style={styles.cardContentIncident}>
<Image
alt="danger-2"
source={danger2}
style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
resizeMode="contain"
/>
<Text style={[styles.Text, { color: colors.pureWhite }]}>TOMBOL PANIK</Text>
<Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Tekan tombol ini jika terjadi insiden</Text>
<Button mode="contained" style={{ marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%', borderRadius: 10 }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
TEKAN
</Button>
</View>
</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,

Write Preview
Loading…
Cancel
Save