constructor(props) {
    super(props);
    this.state = {
        appointments: []
    }
}

loadConstruction(id) {
    // axios.get('/construction/' + id)
    //   .then( construction => {
    //     this.setState({ construction: construction.data })
    //   })
    //   .catch( error => {
    //     console.log('error: ', error);
    //   })

    console.log(id);

    const APIFETCH = '/appointment-medical-records/' + id;
    const FULLPATH = `${API.domain}${API.admin_path}${APIFETCH}`
    const token = localStorage.getItem('token');
    fetch(FULLPATH, {
        method: "get",
        headers: new Headers({
            'Authorization': `Bearer ${token}`,
            'Content-Type': 'application/json'
        }),
    }).then(response => response.json()).then(res => this.setState({ appointments: res.data }))
        .catch(error => {
            console.log('error: ', error);
        });


}


componentDidMount() {


    const id = this.props.match.params.id;
    this.loadConstruction(id);

    console.log(this.props);

}

render() {

    const {
        appointments = [],
        record = []
    } = this.state;

    let appointmentsArr = appointments.map((appointment) => {
        return (
            {
                id: appointment.id,

            }
        )
    });
    return (

        <List filters={<ReportListFilter />}  {...this.props} bulkActionButtons={false} actions={null} pagination={null} >

            <Datagrid rowClick="edit">
                <TextField label="Id" source="id" sortable={false} />
                <TextField label="Type" source="record_type.name" sortable={false} />
                <TextField label="Hospital" source="hospital.name" sortable={false} />
                {/*<TextField label="Doctor" source="doctor.user_profile.full_name" />*/}
                <TextField label="Uploaded By" source="patient.user_profile.full_name" sortable={false} />
                {/* <BooleanField label="Is Approved ?" source="is_approved" /> */}
                <ChipField source="approval_status" sortable={false} />

                {/* <CreateRelatedCommentButton /> */}
                <ArrayField source="tags">
                    <SingleFieldList>
                        <TextField source="tags.name" />
                    </SingleFieldList>
                </ArrayField>

                <TextField label="Purpose" source="appointment.purpose" sortable={false} />


                {/* <FileField label="Medical Reports" source="documents" src="record_full_path" title="View" options={{ multiple: true }}/> */}




                {/* <FileField  label="Medical Reports" source="documents.record_full_path" title="desc" sortable={false} /> */}


                <ShowButton />
            </Datagrid>
        </List>


    );
}

<SimpleShowLayout>

            <ImageField source="documents" src="record_full_path"  />

            </SimpleShowLayout>


</Show>