From d2083ffb2e4b1e8dc0f1660cac99c79ed035abac Mon Sep 17 00:00:00 2001 From: mfajri Date: Sat, 22 Feb 2025 02:00:45 +0700 Subject: [PATCH] update draft --- App.tsx | 16 +- src/component/collectLinescreen.tsx | 7 +- src/component/collectPolygonscreen.tsx | 6 +- src/component/collectscreen.tsx | 6 +- src/component/draftPDAM.tsx | 5 +- src/component/draftPJU.tsx | 2 +- src/component/draftPermit.tsx | 4 +- src/component/editLinescreen.tsx | 33 +- src/component/resendPDAM.tsx | 141 +++-- src/component/resendPJU.tsx | 20 +- src/component/resendPermit.tsx | 806 +++++++++++++++++++++++++ 11 files changed, 926 insertions(+), 120 deletions(-) create mode 100644 src/component/resendPermit.tsx diff --git a/App.tsx b/App.tsx index 5288687..436843b 100644 --- a/App.tsx +++ b/App.tsx @@ -48,6 +48,7 @@ import MyAccount from './src/component/myAccount'; import ChangePass from './src/component/changePassword'; import ResendPJU from './src/component/resendPJU'; import ResendPDAM from './src/component/resendPDAM'; +import ResendLandPermit from './src/component/resendPermit'; import { USER_API_URL } from "../SurveyApp/urlConfig"; import { PermissionsAndroid } from 'react-native'; @@ -551,7 +552,7 @@ export const Nav = () => { fontSize:20 } }}/> - { fontSize:20 } }}/> - + { - Alert.alert("Success") - navigation.navigate('Survey Pipa PDAM', { screen: 'Survey Pipa PDAM'}) - setAlertOnline(false); + } ) }); diff --git a/src/component/collectPolygonscreen.tsx b/src/component/collectPolygonscreen.tsx index 6438ac1..222d7a5 100644 --- a/src/component/collectPolygonscreen.tsx +++ b/src/component/collectPolygonscreen.tsx @@ -242,6 +242,9 @@ export default function CollectPolygonScreen({route,navigation}:collectPolygonSc } }; storeData() + setAlertOnline(false); + Alert.alert("Success") + navigation.navigate('Survey Land Permit', { screen: 'Survey Land Permit'}) } }) } catch (error) { @@ -273,9 +276,6 @@ export default function CollectPolygonScreen({route,navigation}:collectPolygonSc }, JSON.stringify({permit_id:json[0].id, file:file.file, mimetype:file.file_type, size:file.fileSize}) ).then(async (resp) => { - Alert.alert("Success") - navigation.navigate('Survey Land Permit', { screen: 'Survey Land Permit'}) - setAlertOnline(false); } ) }); diff --git a/src/component/collectscreen.tsx b/src/component/collectscreen.tsx index 466b00b..e69a421 100644 --- a/src/component/collectscreen.tsx +++ b/src/component/collectscreen.tsx @@ -265,6 +265,9 @@ function CollectScreen({route,navigation}: collectScreenProps) { } }; storeData() + setAlertOnline(false); + Alert.alert("Success") + navigation.navigate('Survey Penerangan Jalan Umum', { screen: 'Survey Penerangan Jalan Umum'}) } }) } catch (error) { @@ -327,9 +330,6 @@ function CollectScreen({route,navigation}: collectScreenProps) { mimetype:file.file_type, size:file.fileSize}) ).then(async (resp) => { - Alert.alert("Success") - setAlertOnline(false); - navigation.navigate('Survey Penerangan Jalan Umum', { screen: 'Survey Penerangan Jalan Umum'}) } ) }); diff --git a/src/component/draftPDAM.tsx b/src/component/draftPDAM.tsx index e52b235..c7c5741 100644 --- a/src/component/draftPDAM.tsx +++ b/src/component/draftPDAM.tsx @@ -133,7 +133,7 @@ function DraftPDAM({route,navigation}: sendListDataProps) { setLocalStorage([]) try { const jsonValue = await AsyncStorage.getAllKeys() - // console.log("All Key",jsonValue.length) + // console.log("All Key",jsonValue) if(jsonValue.length != 0) { jsonValue.map((item) => { if(item != "USER_DATA" && item != "my-jwt"){ @@ -402,11 +402,12 @@ function DraftPDAM({route,navigation}: sendListDataProps) { { - navigation.navigate('Resend PDAM',{ screen: 'Resend PDAM',data: { + navigation.navigate('Resend Survey Pipa PDAM',{ screen: 'Resend Survey Pipa PDAM',data: { nama:item.pipe_name, jenis:item.pipe_type, tanggal_installasi:item.installation_date, status:item.status, + keterangan:item.keterangan, geom:item.geom }}); }} diff --git a/src/component/draftPJU.tsx b/src/component/draftPJU.tsx index dd72712..65a58f6 100644 --- a/src/component/draftPJU.tsx +++ b/src/component/draftPJU.tsx @@ -405,7 +405,7 @@ function DraftPJU({route,navigation}: sendListDataProps) { { - navigation.navigate('Resend PJU',{ screen: 'Resend PJU',data: { + navigation.navigate('Resend Survey PJU',{ screen: 'Resend Survey PJU',data: { nama:item.pju_name, jenis:item.pju_type, tanggal_installasi:item.installation_date, diff --git a/src/component/draftPermit.tsx b/src/component/draftPermit.tsx index f1bcbef..425f6da 100644 --- a/src/component/draftPermit.tsx +++ b/src/component/draftPermit.tsx @@ -409,11 +409,11 @@ function DraftPermit({route,navigation}: sendListDataProps) { { - navigation.navigate('Permit Editing',{ screen: 'Edit',data: { - id:item.id, + navigation.navigate('Resend Survey Land Permit',{ screen: 'Resend Survey Land Permit',data: { company_name:item.company_name, permit_status:item.permit_status, location:item.location, + geom:item.geom }}); }} children={ diff --git a/src/component/editLinescreen.tsx b/src/component/editLinescreen.tsx index 555568c..721d3d0 100644 --- a/src/component/editLinescreen.tsx +++ b/src/component/editLinescreen.tsx @@ -121,6 +121,8 @@ export default function EditLineScreen({route,navigation}:collectLineScreenProps return [Number(item.long),Number(item.lat)] }) let centCord = turfcenter(points(arr)); + console.log(coordinates); + console.log("center pertama",centCord.geometry.coordinates); setCenterCoords(centCord.geometry.coordinates); setLoadGeom(false); @@ -334,38 +336,7 @@ export default function EditLineScreen({route,navigation}:collectLineScreenProps } catch (error) { } - // const geom = coordinates.map((item:any)=>{ - // return String(item).replace(',',' ') - // }) - // // console.log("geom",geom); - // const obj = { - // nama: pipeName, - // jenis: selectedPipeType, - // tanggal_installasi: momentDate, - // status: checkedStatus, - // keterangan: Information, - // geom: `MULTILINESTRING((${geom}))`, - // id:data.id - // } - // console.log(obj); - - // let result = await fetch(`${PDAM_API_URL}/updateData`, { - // method: "POST", - // headers: { - // "Content-Type": "application/json" - // }, - // body: JSON.stringify(obj) - // }) - - // // const json = await result.json(); - // const status = result.status - // if (status == 201) { - // insertAttachment(files) - // } - // else { - // Alert.alert("Internal Server Error") - // } }; const collectDataOffline = () => { setAlertOnline(false); diff --git a/src/component/resendPDAM.tsx b/src/component/resendPDAM.tsx index 82bc0ed..2ea2c60 100644 --- a/src/component/resendPDAM.tsx +++ b/src/component/resendPDAM.tsx @@ -15,6 +15,7 @@ import turfcenter from '@turf/center'; const {points,polygon,lineString} = require('@turf/helpers'); import RNFetchBlob from 'rn-fetch-blob'; import Modal from "react-native-modal"; +import AsyncStorage from '@react-native-async-storage/async-storage'; @@ -27,6 +28,8 @@ type collectLineScreenProps = {route: any,navigation: any}; export default function ResendPDAM({route,navigation}:collectLineScreenProps) { // console.log("route",route.params); const {data,coors} = route.params; + console.log(data); + const apiKey = "JoJs2pcDv5o0yQlQLMfI"; const [basemap, setBasemap] = useState("streets-v2"); const styleURL = `https://api.maptiler.com/maps/${basemap}/style.json?key=${apiKey}`; @@ -60,17 +63,25 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { const isFocused = useIsFocused(); const [centerCoords,setCenterCoords] = useState([]); const [ModalAttachment, setModalAttachment] = useState(false); + const [userID,setUserID] = useState(); useEffect(()=>{ if (isFocused) { - console.log(data); + const getKey = async () =>{ + const jsonValue = await AsyncStorage.getItem('USER_DATA') + console.log(JSON.parse(jsonValue!)); + const data = JSON.parse(jsonValue!); + console.log("user_data",data.id); + setUserID(data.id) + }; + getKey(); if (coors === undefined) { getData() - fetchData() + // fetchData() } else{ - console.log("kedua",coors); + // console.log("kedua",coors); let centCord = turfcenter(points(coors)); - console.log("center kedua",centCord); + // console.log("center kedua",centCord); setCenterCoords(centCord.geometry.coordinates); setLoadGeom(false); setCoordinates(coors) @@ -108,24 +119,36 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { },[isFocused]) const getData = async () => { try { - const url = `${PDAM_API_URL}/${route.params.data.id}`; - await RNFetchBlob.config({ - trusty : true - }).fetch('GET', url - ).then(async (resp) => { - const json = resp.json(); - const arr = json.map((item:any)=>{ - // console.log(item.long); + const arr = data.geom.map((item:any)=> { + // console.log("item",item); + const str = item.split(" "); + setCoordinates(oldArray => [...oldArray,[Number(str[0]),Number(str[1])]]) + // console.log("a",typeof(item)); + // console.log("b",str[0]); + return [Number(str[0]),Number(str[1])] + }); + let centCord = turfcenter(points(arr)); + // console.log("center pertama",centCord.geometry.coordinates); + setCenterCoords(centCord.geometry.coordinates); + setLoadGeom(false); + // const url = `${PDAM_API_URL}/${route.params.data.id}`; + // await RNFetchBlob.config({ + // trusty : true + // }).fetch('GET', url + // ).then(async (resp) => { + // const json = resp.json(); + // const arr = json.map((item:any)=>{ + // // console.log(item.long); - setCoordinates(oldArray => [...oldArray,[Number(item.long),Number(item.lat)]]) - return [Number(item.long),Number(item.lat)] - }) - let centCord = turfcenter(points(arr)); - console.log("center pertama",centCord.geometry.coordinates); - setCenterCoords(centCord.geometry.coordinates); - setLoadGeom(false); - } - ) + // setCoordinates(oldArray => [...oldArray,[Number(item.long),Number(item.lat)]]) + // return [Number(item.long),Number(item.lat)] + // }) + // let centCord = turfcenter(points(arr)); + // console.log("center pertama",centCord.geometry.coordinates); + // setCenterCoords(centCord.geometry.coordinates); + // setLoadGeom(false); + // } + // ) } catch (e) { console.log("error",e); @@ -276,7 +299,7 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { const handleCancelAlertOffline = () => { setAlertOffline(false); }; - const insertAttachment = (files: any) => { + const insertAttachment = (json:any,files: any) => { try { files.forEach(async function(file:any) { const url = `${PDAM_API_URL}/addAttachment`; @@ -285,7 +308,7 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { }).fetch('POST', url,{ "Content-Type": "application/json", }, - JSON.stringify({pdam_id:data.id, file:file.file, mimetype:file.file_type, size:file.fileSize}) + JSON.stringify({pdam_id:json[0].id, file:file.file, mimetype:file.file_type, size:file.fileSize}) ).then(async (resp) => { } @@ -297,6 +320,16 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { }; const collectDataOnline = async () => { try { + let date = new Date(); + const milliseconds = Date.UTC( + date.getFullYear(), + date.getMonth(), + date.getDate(), + date.getHours(), + date.getMinutes(), + date.getSeconds(), + ); + const localTime = new Date(milliseconds); const geom = coordinates.map((item:any)=>{ return String(item).replace(',',' ') }); @@ -307,9 +340,10 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { status: checkedStatus, keterangan: Information, geom: `MULTILINESTRING((${geom}))`, - id:data.id + created_by: userID, + created_at:localTime }; - const url = `${PDAM_API_URL}/updateData`; + const url = `${PDAM_API_URL}/addData`; await RNFetchBlob.config({ trusty : true }).fetch('POST', url,{ @@ -317,12 +351,14 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { }, JSON.stringify(obj) ).then(async (resp) => { + const json = resp.json() const status = resp.respInfo.status if (status == 201) { - insertAttachment(files) + insertAttachment(json,files) Alert.alert("Success") setAlertOnline(false); - navigation.navigate('Inbox Pipa PDAM', { screen: 'Inbox Pipa PDAM'}) + removeValue(data.nama+" / "+data.jenis+" / "+data.tanggal_installasi+" / "+data.status+" / "+data.keterangan+" / "+data.geom+" / draftPDAM"); + navigation.navigate('Draft Pipa PDAM', { screen: 'Draft Pipa PDAM'}) } else { Alert.alert("Internal Server Error") @@ -330,42 +366,17 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { } ) - } catch (error) { } - // const geom = coordinates.map((item:any)=>{ - // return String(item).replace(',',' ') - // }) - // // console.log("geom",geom); - - // const obj = { - // nama: pipeName, - // jenis: selectedPipeType, - // tanggal_installasi: momentDate, - // status: checkedStatus, - // keterangan: Information, - // geom: `MULTILINESTRING((${geom}))`, - // id:data.id - // } - // console.log(obj); - - // let result = await fetch(`${PDAM_API_URL}/updateData`, { - // method: "POST", - // headers: { - // "Content-Type": "application/json" - // }, - // body: JSON.stringify(obj) - // }) - - // // const json = await result.json(); - // const status = result.status - // if (status == 201) { - // insertAttachment(files) - // } - // else { - // Alert.alert("Internal Server Error") - // } + }; + const removeValue = async (key:string) => { + try { + // console.log("keyDelete",key); + await AsyncStorage.removeItem(key) + // await getCount(); + } catch(e) { + } }; const collectDataOffline = () => { setAlertOnline(false); @@ -412,7 +423,7 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { "properties": {}, "geometry": { "type": "LineString", - "coordinates": [data.geom] + "coordinates": coordinates } } ] @@ -633,21 +644,21 @@ export default function ResendPDAM({route,navigation}:collectLineScreenProps) { /> - UPDATE + RESEND {/* Online Mode Alert */} { handleCancelAlertOnline(); diff --git a/src/component/resendPJU.tsx b/src/component/resendPJU.tsx index ab42fbe..4b52b4b 100644 --- a/src/component/resendPJU.tsx +++ b/src/component/resendPJU.tsx @@ -207,6 +207,7 @@ function ResendPJU({route,navigation}: editScreenProps) { } },[isFocused]); + const fetchData = async () => { try { await RNFetchBlob.config({ @@ -256,9 +257,11 @@ function ResendPJU({route,navigation}: editScreenProps) { created_at: localTime }) ).then(async (resp) => { + const json = resp.json() const status = resp.respInfo.status if (status == 201) { - insertAttachment(files) + insertAttachment(json,files) + removeValue(data.nama+" / "+data.jenis+" / "+data.tanggal_installasi+" / "+data.status+" / "+data.keterangan+" / "+data.long+" / "+data.lat+" / draftPJU"); Alert.alert("Success") setAlertOnline(false); navigation.navigate('Draft Penerangan Jalan Umum', { screen: 'Draft Penerangan Jalan Umum'}) @@ -281,13 +284,14 @@ function ResendPJU({route,navigation}: editScreenProps) { // read error } } - const removeValue = async () => { + const removeValue = async (key:string) => { try { - await AsyncStorage.removeItem('Test by mobile / Lampu 20 W / 2024-11-14 / Baik / draftJPU') + // console.log("keyDelete",key); + await AsyncStorage.removeItem(key) + // await getCount(); } catch(e) { - // remove error } - } + }; const getAllKeys = async () => { // let keys = [] try { @@ -300,7 +304,7 @@ function ResendPJU({route,navigation}: editScreenProps) { // example console.log result: // ['@MyApp_user', '@MyApp_key'] } - const insertAttachment = (files: any) => { + const insertAttachment = (json:any,files: any) => { try { files.forEach(async function(file:any) { const url = `${PJU_API_URL}/addAttachment`; @@ -309,7 +313,7 @@ function ResendPJU({route,navigation}: editScreenProps) { }).fetch('POST', url,{ "Content-Type": "application/json", }, - JSON.stringify({pju_id:data.id, file:file.file, mimetype:file.file_type, size:file.fileSize}) + JSON.stringify({pju_id:json[0].id, file:file.file, mimetype:file.file_type, size:file.fileSize}) ).then(async (resp) => { const status = resp.respInfo.status } @@ -643,7 +647,7 @@ function ResendPJU({route,navigation}: editScreenProps) { ([]); + + + const ref = useRef(); + const [connected, setConnected] = useState(true); + const [currentIndex, setCurrentIndex] = useState(0); + const [imgUrl, setImgUrl] = useState([]); + const [files, setFiles] = useState([]); + const [fileDocument, setFileDocument] = useState([]); + const [companyName, setCompanyName] = useState(data.company_name); + const [checkedStatus, setCheckedStatus] = useState(data.permit_status); + const [approvedBy,setApprovedBy] = useState(''); + const [location, setLocation] = useState(data.location); + const [open, setOpen] = useState(false); + const [install_date, setInstallDate] = useState(new Date()); + const momentDate = Moment(install_date).format('YYYY-MM-DD'); + const [alertOnline, setAlertOnline] = useState(false); + const [alertOffline, setAlertOffline] = useState(false); + const [companyNameError, setCompanyNameError] = useState(false); + const [permitStatusError, setPermitStatusError] = useState(false); + const [locationError, setLocationError] = useState(false); + + const [coordinates,setCoordinates] = useState([]); + const [loadGeom,setLoadGeom] = useState(true); + const [delay,setDelay] = useState(false); + const [secondPress,setSecondPress] = useState(false); + const isFocused = useIsFocused(); + const [userID,setUserID] = useState(); + useEffect(()=>{ + if (isFocused) { + const getKey = async () =>{ + const jsonValue = await AsyncStorage.getItem('USER_DATA') + console.log(JSON.parse(jsonValue!)); + const data = JSON.parse(jsonValue!); + console.log("user_data",data.id); + setUserID(data.id) + }; + getKey(); + if (coors === undefined) { + console.log("awal"); + getData() + } + else{ + console.log("kedua",coors); + let centCord = turfcenter(points(coors)); + console.log("center kedua",centCord); + setCenterCoords(centCord.geometry.coordinates); + setLoadGeom(false); + setCoordinates(coors) + setSecondPress(true) + + } + } + const unmount = navigation.addListener('beforeRemove', (e:any)=> { + console.log("Event",e); + if (e.data.action.type !== "NAVIGATE"){ + e.preventDefault(); + Alert.alert( + 'Unsave Case', + 'There are unsave case. Please chose what you want.', + [ + { + text: 'Ok', + onPress: () => navigation.dispatch(e.data.action) + }, + { + text: 'Continue', + style: 'cancel' + } + ] + ) + } + }) + const unsubscribe = NetInfo.addEventListener((state) => { + setConnected(state.isConnected!) + }); + return () => { + unmount(); + unsubscribe(); + }; + },[isFocused]) + const openCameraLib = async () => { + const result = await launchCamera({ + mediaType: 'photo', + quality: 1, + includeBase64: true, + saveToPhotos: true + }); + const newObj = { + file_type: result?.assets![0]?.type, + file: result?.assets![0]?.base64, + fileSize: result?.assets![0]?.fileSize, + } + setFiles([...files,newObj]); + setImgUrl([...imgUrl,result?.assets![0]?.base64]); + }; + const openLib = async () => { + const result = await launchImageLibrary({ + quality: 1, + mediaType: 'photo', + selectionLimit: 0, + includeExtra: true, + includeBase64: true + }); + result?.assets?.forEach(asset => { + const newObj = { + file_type: asset.type, + file: asset.base64, + fileSize: asset.fileSize + } + setFiles(oldArray => [...oldArray,newObj]); + setImgUrl(oldArray => [...oldArray,asset.base64]); + }); + }; + const PrevImg = ({isIndex}) => { + if(isIndex===0){ + return ( + + + + ) + } + return ( + { + setCurrentIndex(currentIndex-1) + ref.current.scrollToIndex({ + animated: true, + index: currentIndex-1 + }); + }}> + + + ) + }; + const NextImg = ({isIndex}) => { + if(imgUrl.length<=1){ + return ( + + + + ) + } + else{ + if (isIndex === (imgUrl.length-1)) { + return ( + + + + ) + } + else{ + return ( + { + setCurrentIndex(currentIndex+1) + ref.current.scrollToIndex({ + animated: true, + index: currentIndex+1 + }); + }}> + + + ) + } + } + }; + const showDialog = () => { + if(!companyName){ + setCompanyNameError(true) + }else{ + setCompanyNameError(false) + } + if(!checkedStatus){ + setPermitStatusError(true) + }else{ + setPermitStatusError(false) + } + if(!location){ + setLocationError(true) + }else{ + setLocationError(false) + } + if(!companyName || !checkedStatus || !location) { + return false + } + + if(connected){ + setAlertOnline(true); + } + else{ + setAlertOffline(true) + } + }; + const handleCancelAlertOnline = () => { + setAlertOnline(false); + }; + const handleCancelAlertOffline = () => { + setAlertOffline(false); + }; + const removeValue = async (key:string) => { + try { + // console.log("keyDelete",key); + await AsyncStorage.removeItem(key) + // await getCount(); + } catch(e) { + } + }; + const collectDataOnline = async () => { + try { + let date = new Date(); + const milliseconds = Date.UTC( + date.getFullYear(), + date.getMonth(), + date.getDate(), + date.getHours(), + date.getMinutes(), + date.getSeconds(), + ); + const localTime = new Date(milliseconds); + const geom = coordinates.map((item:any)=>{ + return String(item).replace(',',' ') + }) + const obj = { + company_name: companyName, + location: location, + permit_status: checkedStatus, + geom: "", + created_by:userID, + created_at:localTime + } + if(!secondPress){ + obj.geom = `MULTIPOLYGON (((${geom},${String(geom[0]).replace(","," ")})))` + } + else{ + obj.geom = `MULTIPOLYGON (((${geom},${String(coordinates[0]).replace(","," ")})))` + } + + await RNFetchBlob.config({ + trusty : true + }).fetch('POST',`${PERMIT_API_URL}/addData`, + { + "Content-Type": "application/json", + }, + JSON.stringify(obj) + ).then(async (resp) => { + const json = resp.json() + const status = resp.respInfo.status + if (status == 201) { + insertAttachment(json,files) + removeValue(data.company_name+" / "+data.permit_status+" / "+data.location+" / "+data.geom+" / draftPermit"); + Alert.alert("Success") + setAlertOnline(false); + navigation.navigate('Draft Land Permit', { screen: 'Draft Land Permit'}) + } + else { + Alert.alert("Internal Server Error") + } + }) + } catch (error) { + Alert.alert('Internal Server Error') + } + }; + const collectDataOffline = () => { + const geom = route.params.coordinates.map((item:any)=>{ + return String(item).replace(',',' ') + }) + const storeData = async () => { + try { + await AsyncStorage.setItem(companyName+" / "+checkedStatus+" / "+location+" / "+geom+" / draftPermit","Value"); + } catch (e) { + } + }; + storeData() + setAlertOffline(false); + navigation.navigate('Property Survey', { screen: 'Property Survey'}) + }; + const insertAttachment = async (json:any,files: any) => { + try { + files.forEach(async function(file:any){ + const url = `${PERMIT_API_URL}/addAttachment`; + await RNFetchBlob.config({ + trusty : true + }).fetch('POST',url,{ + "Content-Type": "application/json", + }, + JSON.stringify({permit_id:json[0].id, file:file.file, mimetype:file.file_type, size:file.fileSize}) + ).then(async(resp) => { + const status = resp.respInfo.status + }) + }); + } catch (error) { + + } + + } + const deleteByIndex = (index:number) => { + setFileDocument(oldValues => { + return oldValues.filter((_: any, i: number) => i !== index) + }) + } + const uploadFileOnHandler = async () => { + try { + const pickedFile = await DocumentPicker.pickSingle({ + type: [DocumentPicker.types.pdf,DocumentPicker.types.doc,DocumentPicker.types.docx], + // allowMultiSelection:true + }) + await RNFS.readFile(pickedFile.uri, 'base64').then(data => { + const newObj = { + file_type: pickedFile.type, + file: data, + fileSize: pickedFile.size + + } + setFiles([...files,newObj]); + setFileDocument([...fileDocument,pickedFile]); + }); + } catch (error) { + console.error(error) + } + }; + const cek = () => { + console.log(coordinates); + }; + const getData = async () => { + try { + const arr = data.geom.map((item:any)=> { + const str = item.split(" "); + setCoordinates(oldArray => [...oldArray,[Number(str[0]),Number(str[1])]]) + return [Number(str[0]),Number(str[1])] + }) + let centCord = turfcenter(points(arr)); + console.log("center pertama",centCord.geometry.coordinates); + setCenterCoords(centCord.geometry.coordinates); + setLoadGeom(false); + } catch (e) { + console.log("error",e); + + // error reading value + } + }; + const renderItem = ({item,index}:any) => { + return ( + + {item.name} + + ); + }; + return ( + + + + + + + + + + { + !loadGeom ? + <> + + + + + + : + null + } + + { + coordinates.map((item:any,index:number)=>( + + + + + + )) + } + + {!secondPress ? + { + navigation.navigate('Map View Polygon', { + screen: 'Map View Polygon', + data: { + id:data.id, + company_name:companyName, + permit_status:checkedStatus, + location:location, + geom:coordinates + } + }); + }} + > + Change Location + + : + { + navigation.navigate('Map View Polygon', { + screen: 'Map View Polygon', + data: { + id:data.id, + company_name:companyName, + permit_status:checkedStatus, + location:location, + geom:[...coordinates,coordinates[0]] + } + }); + }} + > + Change Location + + } + + + + {/* Name* */} + Company Name + { + setCompanyName(text) + }} + onChange={()=> { + setCompanyNameError(false) + }} + defaultValue={companyName} + /> + {companyNameError ? Company Name is Required!:null} + + + + {/* Status* */} + Permit Status + + {setCheckedStatus('Approved'); setPermitStatusError(false)}} + /> + Approved + + + {setCheckedStatus('Under Review'); setPermitStatusError(false); }} + /> + Under Review + + {permitStatusError ? Status is Required!:null} + + + { + checkedStatus === 'Approved' ? + + + Approved By* + { + setApprovedBy(text); + } } + /> + + + + : + null + } + + Location Detail + { + setLocation(text) + }} + onChange={()=> { + setLocationError(false) + }} + defaultValue={location} + /> + {locationError ? Information is Required!:null} + + + + Survey Date + setOpen(true)} + value={String(momentDate)} + /> + { + setOpen(false) + setInstallDate(survey_date) + }} + onCancel={() => { + setOpen(false) + }} + /> + + + + Attachment + Lampirkan dokumen + { + fileDocument.length === 0 ? + + + + Klik untuk menambahkan dokumen + + + : + + + + + Klik untuk menambahkan dokumen + + + } + contentContainerStyle={{flexDirection:'column',columnGap:25,rowGap:10}} + data={fileDocument} + renderItem={({item,index})=>renderItem({item,index})} + /> + } + + + + + RESEND + + + + { + handleCancelAlertOnline(); + }} + onConfirmPressed={() => { + collectDataOnline(); + // cek() + }} + overlayStyle={{width:'100%'}} + contentContainerStyle={{width:'70%',borderRadius:10}} + titleStyle={{fontSize:20}} + messageStyle={{fontSize:16}} + /> + + {/* Offline Mode Alert */} + { + handleCancelAlertOffline(); + }} + onConfirmPressed={() => { + collectDataOffline(); + }} + overlayStyle={{width:'100%'}} + contentContainerStyle={{width:'70%',borderRadius:10}} + titleStyle={{fontSize:20}} + messageStyle={{fontSize:16}} + /> + + ) +}; + +const styles = StyleSheet.create({ + errorInput: { + color: 'red', + marginLeft: 20 + }, + inputLong: { + height: 40, + borderWidth: 1, + padding: 10, + width: 180, + marginRight: 20 + }, + inputLat: { + height: 40, + borderWidth: 1, + padding: 10, + borderRadius: 50, + width: 180, + color: 'black' + }, + input: { + width:352, + height: 45, + borderWidth: 1, + padding: 10, + borderRadius: 10, + color: '#6B5E5E', + borderColor:'#A6A6A6' + }, + container: { + padding: 10, + flexGrow: 1 + }, + mainContainer: { + flex: 1, + }, + label: { + fontSize: 16, + fontWeight:'semibold', + color: '#434343', + // marginBottom: 20 + }, + title: { + alignItems: 'center', + justifyContent: 'center', + alignSelf: 'center', + fontWeight: 'bold', + fontSize: 22, + color: 'black', + marginBottom: 10 + }, + borderImg: { + borderColor: 'black', + borderWidth: 1, + borderRadius: 20, + }, + img: { + width: 295, + height: 500, + borderRadius: 6, + }, + btnCameraContainer: { + flexDirection: 'row', + justifyContent: 'space-around', + top:10, + + }, + btnCamera: { + alignItems: 'center', + justifyContent: 'center', + alignSelf: 'center', + width: 100, + height: 40, + bottom:20, + borderRadius: 6, + backgroundColor: '#80CBD3' + }, + textBtn: { + color: '#fff' + }, + buttonImageIconStyle: { + padding: 10, + margin: 5, + height: 25, + width: 25, + resizeMode: 'stretch', + }, +}); +