comfirm-view.jsx 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. import React from 'react'
  2. import './comfirm-view.scss'
  3. import { defaultTitle, defaultContent } from './comfirm-view.js'
  4. function comfirmView({ show, onClose, onConfirm, onCancel, title = defaultTitle, content = defaultContent }) {
  5. if (!show) {
  6. return null
  7. }
  8. const handleConfirmClick = () => {
  9. if (onConfirm) {
  10. onConfirm()
  11. }
  12. if (onClose) {
  13. onClose()
  14. }
  15. }
  16. const handleCancelClick = () => {
  17. if (onCancel) {
  18. onCancel()
  19. }
  20. if (onClose) {
  21. onClose()
  22. }
  23. }
  24. return (
  25. <div className="comfirm-container">
  26. <div className="alert-bg">
  27. <div className="title">
  28. <label>{title}</label>
  29. </div>
  30. <div className="content">
  31. <label>{content}</label>
  32. </div>
  33. <div className="footer">
  34. <div className="cancel-button" onClick={handleCancelClick}>取消</div>
  35. <div className="confirm-button" onClick={handleConfirmClick}>确定</div>
  36. </div>
  37. </div>
  38. </div>
  39. )
  40. }
  41. export default comfirmView