import React, { Component } from 'react'; import Images from '../assets/Images'; import { Typography } from '@material-ui/core'; export default class PopUpDelete extends Component { render() { return ( <div className="test app-popup-show"> <div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}> <div style={{ display: 'flex', justifyContent: 'center', paddingTop: 20 }}> <img src={Images.failed} /> </div> <div style={{ display: 'grid', justifyContent: 'center', marginTop: 20, paddingBottom: 20 }}> <span style={{ textAlign: 'center', fontSize: 14, fontWeight: 'bold', fontFamily: 'Nunito Sans, sans-serif' }}> {this.props.intent === 'parameter' ? `Delete [${this.props.rowData[2]}, ${this.props.rowData[3]}, ${this.props.rowData[4]}, ${this.props.rowData[7] === "" ? this.props.rowData[8] + ' + ' + this.props.rowData[9] : this.props.rowData[7]}]?` : `Delete ${this.props.name}?` } </span> </div> <div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}> <div className="column-1" style={{ alignSelf: 'center' }}> <button type="button" onClick={() => this.props.onClickClose()} > <div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <span style={{ color: '#354960', fontSize: 11 }}>Cancel</span> </div> </button> </div> <div className="column-2" style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}> <button type="button" onClick={() => this.props.onClickDelete(this.props.rowData)} > <div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <span style={{ color: '#fff', fontSize: 11 }}>Delete</span> </div> </button> </div> </div> </div> </div> ); } }