customize confirm modal

This commit is contained in:
Pramod Mahajan 2025-05-07 16:23:35 +05:30
parent cf0a0f00b2
commit 9682de0854

View File

@ -1,11 +1,11 @@
import React, { useState } from 'react';
const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
const ConfirmModal = ({ type, onSubmit, onClose, message, loading ,header}) => {
const TypeofIcon = (type) => {
switch (type) {
case "delete":
return <i className='bx bx-x-circle text-danger bx-lg'></i>;
return <i className='bx bx-x-circle text-danger ' style={{fontSize:"60px"}} ></i>;
default:
return null;
}
@ -34,9 +34,15 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
aria-label="Close"
onClick={onClose}
/>
<div className="text-center mb-1">
<p className='fs-6'>{TypeofIcon(type)} <span className='fs-6'>{message}</span></p>
<div className='d-flex justify-content-evenly'>
<div className="text-start mb-1">
{header && < strong className='mb-0 font-weight-bold'>{header }</strong>}
<div className='row'>
<div className='col-4 col-sm-2'> {TypeofIcon(type)}</div>
<div className='col-8 col-sm-10 py-sm-2 py-1 text-sm-end'>
<span className='fs-6 text'>{message}</span>
<div className='d-flex justify-content-center mt-4'>
<button
className='btn btn-primary btn-sm'
onClick={onSubmit}
@ -45,13 +51,17 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
{loading ? "Please Wait..." : "Yes"}
</button>
<button
className='btn btn-secondary btn-sm'
className='btn btn-secondary ms-4 btn-sm'
onClick={onClose}
disabled={loading}
>
Cancel
</button>
</div>
</div>
</div>
</div>
</div>
</div>