添加新discussion完成

dashboard/src/components/comment/CommentCreate.tsx

@@ -10,20 +10,25 @@ import { Col, Row, Space } from "antd";
 import { IComment } from "./CommentItem";
 import { post } from "../../request";
 import { ICommentRequest, ICommentResponse } from "../api/Comment";
+import { useAppSelector } from "../../hooks";
+import { currentUser as _currentUser } from "../../reducers/current-user";
 
 interface IWidget {
-  data: IComment;
+  resId: string;
+  resType: string;
+  parent?: string;
   onCreated?: Function;
 }
-const Widget = ({ data, onCreated }: IWidget) => {
+const Widget = ({ resId, resType, parent, onCreated }: IWidget) => {
   const intl = useIntl();
-
+  const _currUser = useAppSelector(_currentUser);
   const formItemLayout = {
     labelCol: { span: 4 },
     wrapperCol: { span: 20 },
   };
   return (
     <div>
+      <div>{_currUser?.nickName}:</div>
       <ProForm<IComment>
         {...formItemLayout}
         layout="horizontal"
@@ -40,18 +45,41 @@ const Widget = ({ data, onCreated }: IWidget) => {
         }}
         onFinish={async (values) => {
           //新建
+          console.log("create", resId, resType, parent);
+
           post<ICommentRequest, ICommentResponse>(`/v2/discussion`, {
-            res_id: data.resId,
-            res_type: data.resType,
+            res_id: resId,
+            res_type: resType,
+            parent: parent,
             title: values.title,
             content: values.content,
           })
             .then((json) => {
-              console.log(json);
+              console.log("new discussion", json);
               if (json.ok) {
                 message.success(intl.formatMessage({ id: "flashes.success" }));
                 if (typeof onCreated !== "undefined") {
-                  onCreated(json.data);
+                  onCreated({
+                    id: json.data.id,
+                    resId: json.data.res_id,
+                    resType: json.data.res_type,
+                    user: {
+                      id: json.data.editor?.id ? json.data.editor.id : "null",
+                      nickName: json.data.editor?.nickName
+                        ? json.data.editor.nickName
+                        : "null",
+                      realName: json.data.editor?.userName
+                        ? json.data.editor.userName
+                        : "null",
+                      avatar: json.data.editor?.avatar
+                        ? json.data.editor.avatar
+                        : "null",
+                    },
+                    title: json.data.title,
+                    content: json.data.content,
+                    createdAt: json.data.created_at,
+                    updatedAt: json.data.updated_at,
+                  });
                 }
               } else {
                 message.error(json.message);
@@ -62,11 +90,8 @@ const Widget = ({ data, onCreated }: IWidget) => {
             });
         }}
         params={{}}
-        request={async () => {
-          return data;
-        }}
       >
-        {data.parent ? (
+        {parent ? (
           <></>
         ) : (
           <ProFormText

dashboard/src/components/comment/CommentItem.tsx

@@ -13,25 +13,25 @@ export interface IComment {
   title?: string;
   content?: string;
   children?: IComment[];
+  childrenCount?: number;
   createdAt?: string;
   updatedAt?: string;
 }
 interface IWidget {
   data: IComment;
-  create?: boolean;
   onSelect?: Function;
   onCreated?: Function;
 }
-const Widget = ({ data, create = false, onSelect, onCreated }: IWidget) => {
+const Widget = ({ data, onSelect, onCreated }: IWidget) => {
   const [edit, setEdit] = useState(false);
-
+  console.log(data);
   return (
     <div style={{ display: "flex" }}>
       <div style={{ width: "auto", padding: 8 }}>
-        <Avatar>{data.user.nickName.slice(0, 1)}</Avatar>
+        <Avatar>{data.user?.nickName?.slice(0, 1)}</Avatar>
       </div>
       <div style={{ flex: "auto" }}>
-        {edit || create ? (
+        {edit ? (
           <CommentEdit
             data={data}
             onCreated={(e: IComment) => {

dashboard/src/components/comment/CommentList.tsx

@@ -22,9 +22,13 @@ const Widget = ({ data, onSelect }: IWidget) => {
         renderItem={(item) => (
           <List.Item
             actions={[
-              <Space>
-                <MessageOutlined /> {"5"}
-              </Space>,
+              item.childrenCount ? (
+                <Space>
+                  <MessageOutlined /> {item.childrenCount}
+                </Space>
+              ) : (
+                <></>
+              ),
             ]}
           >
             <List.Item.Meta

dashboard/src/components/comment/CommentListCard.tsx

@@ -1,12 +1,12 @@
-import { Card, message } from "antd";
 import { useState, useEffect } from "react";
 import { useIntl } from "react-intl";
+import { Card, message } from "antd";
+
 import { useAppSelector } from "../../hooks";
 import { currentUser as _currentUser } from "../../reducers/current-user";
 import { get } from "../../request";
 import { ICommentListResponse } from "../api/Comment";
 import CommentCreate from "./CommentCreate";
-
 import { IComment } from "./CommentItem";
 import CommentList from "./CommentList";
 
@@ -21,8 +21,9 @@ const Widget = ({ resId, resType, onSelect, onItemCountChange }: IWidget) => {
   const [data, setData] = useState<IComment[]>([]);
 
   const _currUser = useAppSelector(_currentUser);
+
   useEffect(() => {
-    get<ICommentListResponse>(`/v2/discussion?view=res_id&id=${resId}`)
+    get<ICommentListResponse>(`/v2/discussion?view=question&id=${resId}`)
       .then((json) => {
         console.log(json);
         if (json.ok) {
@@ -40,6 +41,7 @@ const Widget = ({ resId, resType, onSelect, onItemCountChange }: IWidget) => {
               },
               title: item.title,
               content: item.content,
+              childrenCount: item.children_count,
               createdAt: item.created_at,
               updatedAt: item.updated_at,
             };
@@ -52,7 +54,7 @@ const Widget = ({ resId, resType, onSelect, onItemCountChange }: IWidget) => {
       .catch((e) => {
         message.error(e.message);
       });
-  }, [intl]);
+  }, [resId]);
 
   if (typeof resId === "undefined") {
     return <div>该资源尚未创建，不能发表讨论。</div>;
@@ -72,27 +74,22 @@ const Widget = ({ resId, resType, onSelect, onItemCountChange }: IWidget) => {
           }}
           data={data}
         />
-        {
+        {resId && resType ? (
           <CommentCreate
-            data={{
-              resId: resId,
-              resType: resType,
-              user: {
-                id: "string",
-                nickName: _currUser ? _currUser.nickName : "Visuddhinanda",
-                realName: _currUser ? _currUser.realName : "Visuddhinanda",
-                avatar: _currUser ? _currUser.avatar : "",
-              },
-            }}
+            resId={resId}
+            resType={resType}
             onCreated={(e: IComment) => {
-              // const orgData = JSON.parse(JSON.stringify(data));
+              const newData = JSON.parse(JSON.stringify(e));
+              console.log("create", e);
               if (typeof onItemCountChange !== "undefined") {
                 onItemCountChange(data.length + 1);
               }
-              setData([...data, e]);
+              setData([...data, newData]);
             }}
           />
-        }
+        ) : (
+          <></>
+        )}
       </Card>
     </div>
   );

dashboard/src/components/comment/CommentTopic.tsx

@@ -1,9 +1,13 @@
-import { useState } from "react";
-import { Divider } from "antd";
+import { useEffect, useState } from "react";
+import { Divider, message } from "antd";
 
 import CommentItem, { IComment } from "./CommentItem";
 import CommentTopicList from "./CommentTopicList";
 import CommentTopicHead from "./CommentTopicHead";
+import { get } from "../../request";
+import { ICommentListResponse } from "../api/Comment";
+import { useIntl } from "react-intl";
+import CommentCreate from "./CommentCreate";
 
 const defaultData: IComment[] = Array(5)
   .fill(3)
@@ -23,17 +27,63 @@ const defaultData: IComment[] = Array(5)
 
 interface IWidget {
   resId: string;
+  resType: string;
   comment?: IComment;
+  onItemCountChange?: Function;
 }
-const Widget = ({ resId, comment }: IWidget) => {
+const Widget = ({ resId, resType, comment, onItemCountChange }: IWidget) => {
+  const intl = useIntl();
   const [childrenData, setChildrenData] = useState<IComment[]>(defaultData);
-
+  useEffect(() => {
+    get<ICommentListResponse>(`/v2/discussion?view=answer&id=${comment?.id}`)
+      .then((json) => {
+        console.log(json);
+        if (json.ok) {
+          message.success(intl.formatMessage({ id: "flashes.success" }));
+          const discussions: IComment[] = json.data.rows.map((item) => {
+            return {
+              id: item.id,
+              resId: item.res_id,
+              resType: item.res_type,
+              user: {
+                id: item.editor?.id ? item.editor.id : "null",
+                nickName: item.editor?.nickName ? item.editor.nickName : "null",
+                realName: item.editor?.userName ? item.editor.userName : "null",
+                avatar: item.editor?.avatar ? item.editor.avatar : "null",
+              },
+              title: item.title,
+              content: item.content,
+              createdAt: item.created_at,
+              updatedAt: item.updated_at,
+            };
+          });
+          setChildrenData(discussions);
+        } else {
+          message.error(json.message);
+        }
+      })
+      .catch((e) => {
+        message.error(e.message);
+      });
+  }, [comment]);
   return (
     <div>
       <CommentTopicHead data={comment} />
       <Divider />
       <CommentTopicList data={childrenData} />
-      {comment ? <CommentItem data={comment} create={true} /> : undefined}
+      <CommentCreate
+        resId={resId}
+        resType={resType}
+        parent={comment?.id}
+        onCreated={(e: IComment) => {
+          console.log("create", e);
+          const newData = JSON.parse(JSON.stringify(e));
+          if (typeof onItemCountChange !== "undefined") {
+            onItemCountChange(childrenData.length + 1);
+          }
+          setChildrenData([...childrenData, newData]);
+        }}
+      />
     </div>
   );
 };