import React, { Component } from 'react'; import { Nav, NavLink, NavItem, Card, Button, CardTitle, CardText, CardDeck, CardSubtitle, CardBody, } from 'reactstrap'; import axios from 'axios'; import { Link } from 'react-router-dom'; class BodySurveyView extends Component { constructor(props) { super(props); this.state = { items: [], }; [ 'handleClick', ].forEach((v) => { this[v] = this[v].bind(this); }); } componentDidMount() { const datas = [ { username: 'radiancesoft.sby@gmail.com', password: 'warpin1234567890', }, ]; axios({ method: 'post', url: 'https://oc6tq8iop5.execute-api.ap-southeast-1.amazonaws.com/dev/opening/interview', headers: { 'Content-Type': 'application/json', 'x-api-key': 'TUMYmAEXi22OkOnHx8fzoa3F3nR5traDRdcuBy31', 'Access-Control-Allow-Origin': true, }, data: JSON.stringify(datas), }) .then((data) => { this.setState({ items: data.data }); console.log(data); }); } /* eslint-disable react/no-unused-state */ handleClick(item) { console.log('mitra_id: ', item.mitraId); this.setState({ Data: item.mitraId }); } /* eslint-enable react/no-unused-state */ renderData() { const data = this.state.items.map(item => (
<CardDeck key={item.id}>
    <Card>
        <CardBody>
            <CardTitle>
                <div className="row col-md-12">
                    <div className="col-md-6">
                        <h3 className="text-left">Mitra ID :</h3>
                    </div>
                    <div claclassNamess="col-md-6">
                        <p className="text-right"> {item.mitraId}</p>
                    </div>
                </div>
            </CardTitle>
            <CardSubtitle>
                <div clasclassNames="row col-md-12">
                    <div className="col-md-6">
                        <p className="text-left">name :</p>
                    </div>
                    <div className="col-md-6">
                        <p className="text-right"> {item.mitra_name} </p>
                    </div>
                </div>
            </CardSubtitle>
            <CardText>
                <div className="row col-md-12">
                    <div className="col-md-6">
                        <p className="text-left">lokasi Warung :</p>
                    </div>
                    <div className="col-md-6">
                        <p lassName="text-right"> {item.lokasi_warung}</p>
                    </div>
                </div>
            </CardText>
            <CardText>
                <div className="row col-md-12">
                    <div className="col-md-6">
                        <p className="text-left"> Nama Mitra :</p>
                    </div>
                    <div className="col-md-6">
                        <p lassName="text-right"> {item.nama_mitra}</p>
                    </div>
                </div>
            </CardText>
            <Link to={{ pathname: '/BodySurveyForm', state: { Data: item.mitraId, Datas: item.mitra_name, DataName: item.nama_mitra }, }}>
            <Button id="send">
                Survey Sekarang
            </Button>
            </Link>
        </CardBody>
    </Card>
</CardDeck>)); return data; } /* eslint-disable react/no-sequences */ render() { return (
<div className="comp-body-leads-view">
    <div className="card card-body-user-are">
        <Nav className="nav-fill nav-fill-compact">
            <NavItem className="text-left">
                <NavLink className="pl-0"> List Survey </NavLink>
            </NavItem>
        </Nav>
        {this.renderData()}
    </div>
</div>
/* eslint-enable react/no-sequences */ ); } } export default BodySurveyView;