Untitled
unknown
javascript
4 years ago
3.7 kB
6
Indexable
import React from 'react'; import { EuiCard, EuiFlexGroup, EuiFlexItem, EuiProgress, EuiSpacer, EuiText, EuiTextAlign, } from '@elastic/eui'; export default (props) => ( console.log("Component progress masuk : " + JSON.stringify(props.data.waInquiry.data.responseData.length)), <EuiFlexGroup gutterSize='none' > <EuiFlexItem > <EuiText > <EuiTextAlign textAlign="left" style={{ fontSize: "30px", color: "grey", paddingBottom: "30px", fontWeight: "700" }}> Running Process Whatsapp Blast </EuiTextAlign> </EuiText> <div className="table_container"> <EuiFlexItem className="dashboard"> <EuiText> <EuiTextAlign textAlign="left">1. Upload Document CSV</EuiTextAlign> </EuiText> <div style={{position:'relative'}}> <EuiProgress className="progress-bar" value={(parseInt(props.data.waInquiry.data.responseData[0].progressUpload.fileNumber) / parseInt(props.data.waInquiry.data.responseData[0].progressUpload.totalOfFiles)) * 100} max={100} size="l" label={"100%"} color='primary' valueText={true} /> <p className="progress-bar_label">{(parseInt(parseInt(props.data.waInquiry.data.responseData[0].progressUpload.fileNumber) / parseInt(props.data.waInquiry.data.responseData[0].progressUpload.totalOfFiles)) * 100)}%</p> </div> <EuiSpacer size="l" /> <EuiText> <EuiTextAlign textAlign="left">2. Verify Contact</EuiTextAlign> </EuiText> <div style={{position:'relative'}}> <EuiProgress className="progress-bar" value={parseInt(props.data.waInquiry.data.responseData[0].progressVerifyContacts.percentage)} max={100} size="l" label={"100%"} color='primary' valueText={true} /> <p className="progress-bar_label">{parseInt(props.data.waInquiry.data.responseData[0].progressVerifyContacts.percentage)}%</p> </div> <EuiSpacer size="l" /> <EuiText> <EuiTextAlign textAlign="left">3. Blast Message</EuiTextAlign> </EuiText> <div style={{position:'relative'}}> <EuiProgress className="progress-bar" value={parseInt(parseInt(props.data.waInquiry.data.responseData[0].progressBlast.sent) + parseInt(props.data.waInquiry.data.responseData[0].progressBlast.failed)) / parseInt(props.data.waInquiry.data.responseData[0].progressBlast.totalDataProcess) * 100} max={100} size="l" label={"50%"} color='primary' valueText={true} /> <p className="progress-bar_label">{parseInt(props.data.waInquiry.data.responseData[0].progressBlast.sent) + parseInt(props.data.waInquiry.data.responseData[0].progressBlast.failed) / parseInt(props.data.waInquiry.data.responseData[0].progressBlast.totalDataProcess) * 100 ? parseInt(parseInt(parseInt(props.data.waInquiry.data.responseData[0].progressBlast.sent) + parseInt(props.data.waInquiry.data.responseData[0].progressBlast.failed)) / parseInt(props.data.waInquiry.data.responseData[0].progressBlast.totalDataProcess) * 100) : 0}%</p> </div> <EuiSpacer size="l" /> <p align="left">Division Name : {props.data.waInquiry.data.responseData[0].namaDivisi}</p> <EuiSpacer size='m' /> <p align="left">Template Name : {props.data.waInquiry.data.responseData[0].namaTemplate}</p> <EuiSpacer size='m' /> <p align="left">Total Data : {props.data.waInquiry.data.responseData[0].progressUpload.totalOfFiles}</p> </EuiFlexItem> </div> </EuiFlexItem> </EuiFlexGroup> );
Editor is loading...