Browse Source

fix(serivce): change layout view service page

master
farhantock 4 months ago
parent
commit
23e9167a79
  1. 21
      src/screens/Service.js

21
src/screens/Service.js

@ -1,5 +1,5 @@
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 ilustration from '../assets/images/checked.png';
import danger from '../assets/images/danger.png';
@ -14,6 +14,7 @@ export default function ServiceScreen({ route, navigation }) {
return (
<View style={styles.container}>
<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.leftContent}>
<Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text>
@ -31,10 +32,12 @@ export default function ServiceScreen({ route, navigation }) {
/>
</View>
</View>
</TouchableRipple>
</Card>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10 }}>
<Card elevation={4} style={styles.card}>
<TouchableRipple onPress={() => { navigation.navigate('ActivityScreen') }}>
<View style={styles.cardContentIncident}>
<Image
alt="Activity"
@ -44,12 +47,14 @@ export default function ServiceScreen({ route, navigation }) {
/>
<Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan 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
</Button>
</View>
</TouchableRipple>
</Card >
<Card elevation={4} style={styles.card}>
<TouchableRipple onPress={() => { navigation.navigate('DailyReportScreen') }}>
<View style={styles.cardContentIncident}>
<Image
alt="ilustration"
@ -59,15 +64,17 @@ export default function ServiceScreen({ route, navigation }) {
/>
<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>
<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
</Button>
</View>
</TouchableRipple>
</Card >
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10, marginTop: 5 }}>
<Card elevation={4} style={styles.card}>
<TouchableRipple onPress={() => { navigation.navigate('PatroliScreen') }}>
<View style={styles.cardContentIncident}>
<Image
alt="patroli"
@ -81,8 +88,10 @@ export default function ServiceScreen({ route, navigation }) {
ISI
</Button>
</View>
</TouchableRipple>
</Card >
<Card elevation={4} style={styles.card}>
<TouchableRipple onPress={() => { navigation.navigate('PresenceScreen') }}>
<View style={styles.cardContentIncident}>
<Image
alt="calender"
@ -96,10 +105,12 @@ export default function ServiceScreen({ route, navigation }) {
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}>
<Image
alt="danger-2"
@ -113,6 +124,7 @@ export default function ServiceScreen({ route, navigation }) {
TEKAN
</Button>
</View>
</TouchableRipple>
</Card>
</View >
)
@ -121,7 +133,8 @@ export default function ServiceScreen({ route, navigation }) {
const styles = StyleSheet.create({
container: {
flex: 1,
marginTop: 30
marginTop: 30,
backgroundColor: colors.pureWhite
},
Text: {
fontSize: 16,

Loading…
Cancel
Save