admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

customize confirm modal

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-07 16:23:35 +05:30
parent cf0a0f00b2
commit 9682de0854
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/common/ConfirmModal.jsx
View File

@ -1,11 +1,11 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => { const ConfirmModal = ({ type, onSubmit, onClose, message, loading ,header}) => {
const TypeofIcon = (type) => { const TypeofIcon = (type) => {
switch (type) { switch (type) {
case "delete": 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: default:
return null; return null;
} }
@ -34,9 +34,15 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
aria-label="Close" aria-label="Close"
onClick={onClose} onClick={onClose}
/> />
<div className="text-center mb-1"> <div className="text-start mb-1">
<p className='fs-6'>{TypeofIcon(type)} <span className='fs-6'>{message}</span></p>
<div className='d-flex justify-content-evenly'>
{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 <button
className='btn btn-primary btn-sm' className='btn btn-primary btn-sm'
onClick={onSubmit} onClick={onSubmit}
@ -45,7 +51,7 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
{loading ? "Please Wait..." : "Yes"} {loading ? "Please Wait..." : "Yes"}
</button> </button>
<button <button
className='btn btn-secondary btn-sm' className='btn btn-secondary ms-4 btn-sm'
onClick={onClose} onClick={onClose}
disabled={loading} disabled={loading}
> >
@ -54,6 +60,10 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>