diff --git a/src/screens/incident-page/dialogForm.js b/src/screens/incident-page/dialogForm.js
new file mode 100644
index 0000000..81be85d
--- /dev/null
+++ b/src/screens/incident-page/dialogForm.js
@@ -0,0 +1,144 @@
+import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react';
+import { StatusBar } from 'react-native';
+import { Button, Text, Appbar, } from 'react-native-paper';
+import { StyleSheet, View, } from 'react-native';
+import { colors } from '../../utils/color';
+import { strings } from '../../utils/i18n';
+import StepIndicator from 'react-native-step-indicator';
+import TimeComponent from './stepComponent/time'
+import LocationScreen from './stepComponent/location';
+import ReportScreen from './stepComponent/report';
+import IncidentScreen from './stepComponent/incident';
+import ChronologyScreen from './stepComponent/chronology';
+import MediaScreen from './stepComponent/media';
+
+export default function DialogForm({ route, navigation }) {
+ const [active, setActive] = useState(0);
+ const labels = ["Waktu", "Lokasi", "Pelapor", "Kejadian", "Kronologis", "Media"];
+
+ const renderStepContent = useMemo(() => {
+ switch (active) {
+ case 0:
+ return ;
+ case 1:
+ return ;
+ case 2:
+ return ;
+ case 3:
+ return ;
+ case 4:
+ return ;
+ case 5:
+ return ;
+ default:
+ return null;
+ }
+ }, [active]);
+
+ const handleBack = () => {
+ if (active > 0) {
+ setActive(active - 1);
+ }
+ };
+
+ const handleNext = () => {
+ if (active < labels.length - 1) {
+ setActive(active + 1);
+ }
+ };
+ return (
+
+
+
+ { navigation.goBack() }} />
+
+
+
+ setActive(position)}
+ />
+
+
+ {renderStepContent}
+
+
+
+ {active === labels.length - 1 ?
+ (
+
+ )
+ : (
+
+ )}
+
+
+
+ )
+}
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ marginTop: 20,
+ backgroundColor: colors.pureWhite
+ },
+ cardView: {
+ marginTop: 10,
+ },
+ card: {
+ marginTop: 10,
+ marginHorizontal: 10,
+ backgroundColor: '#1C1B40',
+ },
+ button: {
+ flex: 1,
+ margin: 5,
+ borderRadius: 5
+ },
+ contentContainer: {
+ flex: 1,
+ },
+ buttonContainer: {
+ flexDirection: 'row',
+ justifyContent: 'space-between',
+ padding: 10,
+ paddingBottom: 20,
+ },
+
+})
+
+const stepIndicatorStyles = {
+
+ stepIndicatorSize: 25,
+ currentStepIndicatorSize: 30,
+ separatorStrokeWidth: 2,
+ currentStepStrokeWidth: 2,
+ stepIndicatorCurrentColor: colors.beanRed,
+ stepStrokeCurrentColor: colors.beanRed,
+ stepStrokeWidth: 1,
+ stepStrokeFinishedColor: colors.beanRed,
+ stepStrokeUnFinishedColor: colors.semiRed,
+ separatorFinishedColor: colors.beanRed,
+ separatorUnFinishedColor: colors.semiRed,
+ stepIndicatorFinishedColor: colors.beanRed,
+ stepIndicatorUnFinishedColor: colors.semiRed,
+ stepIndicatorCurrentColor: colors.beanRed,
+ stepIndicatorLabelFontSize: 12,
+ currentStepIndicatorLabelFontSize: 12,
+ stepIndicatorLabelCurrentColor: colors.pureWhite,
+ stepIndicatorLabelFinishedColor: colors.pureWhite,
+ stepIndicatorLabelUnFinishedColor: colors.beanRed,
+ labelColor: colors.semiRed,
+ labelSize: 12,
+ currentStepLabelColor: colors.beanRed
+}
\ No newline at end of file
diff --git a/src/screens/incident-page/index.js b/src/screens/incident-page/index.js
index 3fa7047..1654132 100644
--- a/src/screens/incident-page/index.js
+++ b/src/screens/incident-page/index.js
@@ -1,5 +1,5 @@
import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react';
-import { Card, Text, Avatar, useTheme, IconButton, Appbar, Button } from 'react-native-paper';
+import { Card, Text, Avatar, useTheme, IconButton, Appbar, Button, TouchableRipple } from 'react-native-paper';
import { RefreshControl, StyleSheet, View, ScrollView, Image, Dimensions, StatusBar } from 'react-native';
import { colors } from '../../utils/color';
import Icon from 'react-native-vector-icons/AntDesign';
@@ -21,7 +21,7 @@ export default function IncidentScreen({ route, navigation }) {
{ navigation.goBack() }} />
-
+
@@ -32,22 +32,24 @@ export default function IncidentScreen({ route, navigation }) {
{incidentData.map((incident) => (
-
-
-
-
+ { navigation.navigate('DialogFormIncident') }}>
+
+
+
+
+
+
+ {incident.date}
+ {incident.location}
+ {incident.company}
+ {incident.icn} - {incident.sicn}
+
+
+
+
-
- {incident.date}
- {incident.location}
- {incident.company}
- {incident.icn} - {incident.sicn}
-
-
-
-
-
-
+
+
))}
diff --git a/src/screens/incident-page/stepComponent/chronology.js b/src/screens/incident-page/stepComponent/chronology.js
index 9e1cf1e..de962d1 100644
--- a/src/screens/incident-page/stepComponent/chronology.js
+++ b/src/screens/incident-page/stepComponent/chronology.js
@@ -114,8 +114,6 @@ export default function ChronologyScreen({ route, navigation }) {
"Almost Certain": 'Sudah pasti',
}
- console.log("incidentRiskPotential", incidentRiskPotential);
-
const renderImpact = (data) => (
handleSelectImpact(data)}>
@@ -287,13 +285,6 @@ export default function ChronologyScreen({ route, navigation }) {
}
const styles = StyleSheet.create({
- containerModal: {
- flex: 1,
- padding: 24,
- justifyContent: 'center',
- backgroundColor: 'grey',
- },
-
contentContainer: {
flex: 1,
alignItems: 'center',
@@ -314,7 +305,6 @@ const styles = StyleSheet.create({
marginVertical: 10,
marginHorizontal: 10
},
-
Text: {
fontSize: 16,
fontWeight: 'bold',
@@ -330,7 +320,6 @@ const styles = StyleSheet.create({
fontSize: 12,
color: colors.blue
},
-
row: {
flexDirection: 'row',
justifyContent: 'space-between',
@@ -352,10 +341,5 @@ const styles = StyleSheet.create({
justifyContent: 'flex-start',
alignItems: 'flex-start',
},
- rightContent: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'flex-end',
- marginRight: 15,
- },
+
});
diff --git a/src/screens/incident-page/stepComponent/containedAction.js b/src/screens/incident-page/stepComponent/containedAction.js
index 2fb8a9a..37a9a88 100644
--- a/src/screens/incident-page/stepComponent/containedAction.js
+++ b/src/screens/incident-page/stepComponent/containedAction.js
@@ -38,7 +38,7 @@ export default function ReportScreen({ route, navigation }) {
<>
{ navigation.goBack() }} />
-
+
diff --git a/src/screens/incident-page/stepComponent/location.js b/src/screens/incident-page/stepComponent/location.js
index 37222e5..ac7590b 100644
--- a/src/screens/incident-page/stepComponent/location.js
+++ b/src/screens/incident-page/stepComponent/location.js
@@ -18,7 +18,6 @@ export default function LocationScreen() {
...prevState,
[name]: !prevState[name]
}));
- setBottomSheetIndex(0);
};
console.log("Area :", area);
const handleProjectSelect = (project) => {
@@ -113,9 +112,11 @@ export default function LocationScreen() {
uncheckedColor={colors.amethystSmoke}
onPress={() => handleCheckboxArea({ name: 'internal', checked: !area.internal })}
/>
-
- Internal (Didalam area/kawasan/parimeter Project)
-
+ handleCheckboxArea({ name: 'internal', checked: !area.internal })}>
+
+ Internal (Didalam area/kawasan/parimeter Project)
+
+
handleCheckboxArea({ name: 'external', checked: !area.external })}
/>
-
- External (Diluar area/kawasan/parimeter Project)
-
+ handleCheckboxArea({ name: 'external', checked: !area.internal })}>
+
+ External (Diluar area/kawasan/parimeter Project)
+
+
diff --git a/src/screens/incident-page/stepComponent/media.js b/src/screens/incident-page/stepComponent/media.js
index 9c5aa94..b07a5ca 100644
--- a/src/screens/incident-page/stepComponent/media.js
+++ b/src/screens/incident-page/stepComponent/media.js
@@ -135,7 +135,7 @@ export default function MediaScreen() {
const saveToTemporaryFolder = async (markedImage, imageObject) => {
try {
- const tempPath = `file://${RNFS.TemporaryDirectoryPath}/presensi/${imageObject.drop_point_id}_${moment().format('YYYYMMDDHHmmss')}.jpg`;
+ const tempPath = `file://${RNFS.TemporaryDirectoryPath}/presensi/${moment().format('YYYYMMDDHHmmss')}.jpg`;
if (!requestAccessStoragePermission()) {
return;
@@ -172,7 +172,7 @@ export default function MediaScreen() {
}