TokenModal.tsx 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { useEffect, useState } from "react";
  2. import { Modal } from "antd";
  3. import type { ArticleType } from "./Article"
  4. import Token from "./Token";
  5. interface IWidget {
  6. channelId?: string;
  7. articleId?: string;
  8. type?: ArticleType;
  9. trigger?: React.ReactNode;
  10. open?: boolean;
  11. onClose?: Function;
  12. }
  13. const TokenModal = ({
  14. channelId,
  15. articleId,
  16. type,
  17. trigger,
  18. open = false,
  19. onClose,
  20. }: IWidget) => {
  21. const [isModalOpen, setIsModalOpen] = useState(open);
  22. useEffect(() => setIsModalOpen(open), [open]);
  23. const showModal = () => {
  24. setIsModalOpen(true);
  25. };
  26. const handleOk = () => {
  27. if (typeof onClose !== "undefined") {
  28. onClose(false);
  29. }
  30. setIsModalOpen(false);
  31. };
  32. const handleCancel = () => {
  33. if (typeof onClose !== "undefined") {
  34. onClose(false);
  35. }
  36. setIsModalOpen(false);
  37. };
  38. return (
  39. <>
  40. <span onClick={showModal}>{trigger}</span>
  41. <Modal
  42. width={500}
  43. title="token"
  44. footer={false}
  45. open={isModalOpen}
  46. onOk={handleOk}
  47. onCancel={handleCancel}
  48. >
  49. <Token channelId={channelId} articleId={articleId} type={type} />
  50. </Modal>
  51. </>
  52. );
  53. };
  54. export default TokenModal;