Note.tsx 869 B

1234567891011121314151617181920212223242526272829303132333435
  1. import { Popover } from "antd";
  2. import { InfoCircleOutlined } from "@ant-design/icons";
  3. import { Typography } from "antd";
  4. const { Link } = Typography;
  5. interface IWidgetNoteCtl {
  6. trigger?: string; //界面上显示的文字
  7. note?: string; //note内容
  8. children?: React.ReactNode;
  9. }
  10. const NoteCtl = ({ trigger, _____note, children }: IWidgetNoteCtl) => {
  11. const show = trigger ? trigger : <InfoCircleOutlined />;
  12. return (
  13. <>
  14. <Popover
  15. content={<div style={{ width: 500 }}>{children}</div>}
  16. placement="bottom"
  17. >
  18. <Link>{show}</Link>
  19. </Popover>
  20. </>
  21. );
  22. };
  23. interface IWidget {
  24. props: string;
  25. children?: React.ReactNode;
  26. }
  27. const Widget = ({ props, children }: IWidget) => {
  28. const prop = JSON.parse(atob(props)) as IWidgetNoteCtl;
  29. return <NoteCtl {...prop}>{children}</NoteCtl>;
  30. };
  31. export default Widget;