import React, { Fragment, useState, useEffect, useLayoutEffect } from 'react';
import Styled from 'styled-components/native';
import fetchGet, { fetchPost, fetchDelete } from '~/Utils/fetch';
import { useToast, confirm } from '~/Components/UIControls/Message';
import Form from '~/Components/Form';
import WebView from 'react-native-webview';
import { Config } from '~/Configuration';
import Button from '~/Components/UIControls/Button';

const Container = Styled.View`
    flex: 1;
    flex-direction: column;
    background-color: #ffffff;
`;

const Screen = ({ navigation }) => {
    const siteId = navigation.getParam('siteId', '');
    const accidentId = navigation.getParam('accidentId', '');
    const { showMessage } = useToast();

    const reportUrl = `${Config.BASE_URL}/report/index.html?report=DetailAccident&siteId=${siteId}&detailId=${accidentId}`;

    //console.log('print-url:', reportUrl);

    return (
        <Container>
            <WebView
                source={{ uri: reportUrl }}
                onError={(event) => {
                    console.log('error', event);
                }}
                onHttpError={(event) => {
                    console.log('http-error', event);
                }}
            />
        </Container>
    );
};

Screen.navigationOptions = ({ navigation }) => {
    const action = navigation.getParam('action', Form.VIEW); // create, edit, view

    return {
        header: () => <Header navigation={navigation} title={`리포트 조회`} main={false} buttons={<></>} />,
    };
};

export default Screen;
