DiscussionTopicInfo.tsx 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. import { message } from "antd";
  2. import { useEffect, useState } from "react";
  3. import { get } from "../../request";
  4. import type { ICommentResponse } from "../../api/Comment";
  5. import DiscussionItem, { type IComment } from "./DiscussionItem";
  6. import type { TDiscussionType } from "./Discussion";
  7. interface IWidget {
  8. topicId?: string;
  9. topic?: IComment;
  10. childrenCount?: number;
  11. hideTitle?: boolean;
  12. onDelete?: Function;
  13. onReply?: Function;
  14. onClose?: Function;
  15. onReady?: Function;
  16. onConvert?: Function;
  17. }
  18. const DiscussionTopicInfoWidget = ({
  19. topicId,
  20. topic,
  21. childrenCount,
  22. hideTitle = false,
  23. onReady,
  24. onDelete,
  25. onReply,
  26. onClose,
  27. onConvert,
  28. }: IWidget) => {
  29. const [data, setData] = useState<IComment | undefined>(topic);
  30. useEffect(() => {
  31. setData(topic);
  32. }, [topic]);
  33. useEffect(() => {
  34. setData((origin) => {
  35. if (typeof origin !== "undefined") {
  36. origin.childrenCount = childrenCount;
  37. return origin;
  38. }
  39. });
  40. }, [childrenCount]);
  41. useEffect(() => {
  42. if (typeof topicId === "undefined") {
  43. return;
  44. }
  45. const url = `/v2/discussion/${topicId}`;
  46. console.info("discussion api request", url);
  47. get<ICommentResponse>(url)
  48. .then((json) => {
  49. console.debug("api response", json);
  50. if (json.ok) {
  51. const item = json.data;
  52. const discussion: IComment = {
  53. id: item.id,
  54. resId: item.res_id,
  55. resType: item.res_type,
  56. type: item.type,
  57. parent: item.parent,
  58. user: item.editor,
  59. title: item.title,
  60. content: item.content,
  61. html: item.html,
  62. status: item.status,
  63. childrenCount: item.children_count,
  64. createdAt: item.created_at,
  65. updatedAt: item.updated_at,
  66. };
  67. setData(discussion);
  68. if (typeof onReady !== "undefined") {
  69. console.log("discussion on ready");
  70. onReady(discussion);
  71. }
  72. } else {
  73. message.error(json.message);
  74. }
  75. })
  76. .catch((e) => {
  77. message.error(e.message);
  78. });
  79. }, [topicId]);
  80. return (
  81. <div>
  82. {data ? (
  83. <DiscussionItem
  84. data={data}
  85. hideTitle={hideTitle}
  86. onDelete={() => {
  87. if (typeof onDelete !== "undefined") {
  88. onDelete(data.id);
  89. }
  90. }}
  91. onReply={() => {
  92. if (typeof onReply !== "undefined") {
  93. onReply(data);
  94. }
  95. }}
  96. onClose={() => {
  97. if (typeof onClose !== "undefined") {
  98. onClose(data);
  99. }
  100. }}
  101. onConvert={(value: TDiscussionType) => {
  102. if (typeof onConvert !== "undefined") {
  103. onConvert(value);
  104. }
  105. }}
  106. />
  107. ) : (
  108. <></>
  109. )}
  110. </div>
  111. );
  112. };
  113. export default DiscussionTopicInfoWidget;