Merge pull request #1496 from visuddhinanda/agile

#1489

dashboard/src/assets/icon/index.tsx

@@ -305,6 +305,32 @@ const ThemeOutlined = () => (
   </svg>
 );
 
+const TemplateOutLined = () => (
+  <svg
+    viewBox="0 0 1045 1024"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    p-id="4076"
+    width="1em"
+    height="1em"
+  >
+    <path
+      d="M853.333333 10.666667H341.333333A117.333333 117.333333 0 0 0 224 128v42.666667A32 32 0 0 0 256 202.666667h448l3.477333 0.085333C734.976 204.117333 757.333333 227.541333 757.333333 256v597.333333a32 32 0 0 0 32 32h64a117.333333 117.333333 0 0 0 117.333334-117.333333V128A117.333333 117.333333 0 0 0 853.333333 10.666667z m-512 64h512A53.333333 53.333333 0 0 1 906.666667 128v640l-0.106667 3.498667A53.333333 53.333333 0 0 1 853.333333 821.333333h-32V256a117.333333 117.333333 0 0 0-111.509333-117.184l-5.034667-0.149333H288V128A53.333333 53.333333 0 0 1 341.333333 74.666667z"
+      fill="currentColor"
+      p-id="4077"
+    ></path>
+    <path
+      d="M704 138.666667H192A117.333333 117.333333 0 0 0 74.666667 256v640A117.333333 117.333333 0 0 0 192 1013.333333h512a117.333333 117.333333 0 0 0 117.333333-117.333333V256A117.333333 117.333333 0 0 0 704 138.666667z m-512 64h512a53.333333 53.333333 0 0 1 53.333333 53.333333v640a53.333333 53.333333 0 0 1-53.333333 53.333333H192A53.333333 53.333333 0 0 1 138.666667 896V256A53.333333 53.333333 0 0 1 192 202.666667z"
+      fill="currentColor"
+      p-id="4078"
+    ></path>
+    <path
+      d="M618.666667 554.666667a32 32 0 0 1 3.072 63.850666L618.666667 618.666667H277.333333a32 32 0 0 1-3.072-63.850667L277.333333 554.666667h341.333334zM448 746.666667a32 32 0 0 1 3.072 63.850666L448 810.666667h-170.666667a32 32 0 0 1-3.072-63.850667L277.333333 746.666667h170.666667zM618.666667 362.666667a32 32 0 0 1 3.072 63.850666L618.666667 426.666667H277.333333a32 32 0 0 1-3.072-63.850667L277.333333 362.666667h341.333334z"
+      fill="currentColor"
+      p-id="4079"
+    ></path>
+  </svg>
+);
 export const DictIcon = (props: Partial<CustomIconComponentProps>) => (
   <Icon component={DictSvg} {...props} />
 );
@@ -366,3 +392,7 @@ export const JsonOutlinedIcon = (props: Partial<CustomIconComponentProps>) => (
 export const ThemeOutlinedIcon = (props: Partial<CustomIconComponentProps>) => (
   <Icon component={ThemeOutlined} {...props} />
 );
+
+export const TemplateOutlinedIcon = (
+  props: Partial<CustomIconComponentProps>
+) => <Icon component={TemplateOutLined} {...props} />;

dashboard/src/components/api/Comment.ts

@@ -10,6 +10,7 @@ export interface ICommentRequest {
   content?: string;
   content_type?: TContentType;
   parent?: string;
+  tpl_id?: string;
   status?: "active" | "close";
   editor?: IUserApiData;
   created_at?: string;
@@ -24,6 +25,7 @@ export interface ICommentApiData {
   content?: string;
   content_type?: TContentType;
   parent?: string;
+  tpl_id?: string;
   status?: "active" | "close";
   children_count?: number;
   editor: IUserApiData;

dashboard/src/components/discussion/DiscussionBox.tsx

@@ -23,6 +23,7 @@ export interface IAnswerCount {
 const DiscussionBoxWidget = () => {
   const [childrenDrawer, setChildrenDrawer] = useState(false);
   const [topicId, setTopicId] = useState<string>();
+  const [topic, setTopic] = useState<IComment>();
   const [answerCount, setAnswerCount] = useState<IAnswerCount>();
   const [currTopic, setCurrTopic] = useState<IComment>();
 
@@ -41,7 +42,13 @@ const DiscussionBoxWidget = () => {
 
   const showChildrenDrawer = (comment: IComment) => {
     setChildrenDrawer(true);
-    setTopicId(comment.id);
+    if (comment.id) {
+      setTopicId(comment.id);
+      setTopic(undefined);
+    } else {
+      setTopicId(undefined);
+      setTopic(comment);
+    }
   };
 
   return (
@@ -72,6 +79,7 @@ const DiscussionBoxWidget = () => {
           <DiscussionTopic
             resType={discussionMessage?.resType}
             topicId={topicId}
+            topic={topic}
             focus={discussionMessage?.comment}
             onItemCountChange={(count: number, parent: string) => {
               setAnswerCount({ id: parent, count: count });

dashboard/src/components/discussion/DiscussionCreate.tsx

@@ -23,6 +23,7 @@ interface IWidget {
   resId?: string;
   resType?: string;
   parent?: string;
+  topic?: IComment;
   onCreated?: Function;
   contentType?: TContentType;
 }
@@ -31,6 +32,7 @@ const DiscussionCreateWidget = ({
   resType,
   contentType = "html",
   parent,
+  topic,
   onCreated,
 }: IWidget) => {
   const intl = useIntl();
@@ -50,6 +52,28 @@ const DiscussionCreateWidget = ({
               //新建
               console.log("create", resId, resType, parent);
               console.log("value", values);
+              if (typeof parent === "undefined") {
+                if (typeof topic !== "undefined" && topic.tplId) {
+                  const newTopic = await post<
+                    ICommentRequest,
+                    ICommentResponse
+                  >(`/v2/discussion`, {
+                    res_id: resId,
+                    res_type: resType,
+                    title: topic.title,
+                    tpl_id: topic.tplId,
+                    content: topic.content,
+                    content_type: "markdown",
+                  });
+                  if (newTopic.ok) {
+                    parent = newTopic.data.id;
+                  } else {
+                    console.error("no parent id");
+                    return;
+                  }
+                }
+              }
+              console.log("parent", parent);
               post<ICommentRequest, ICommentResponse>(`/v2/discussion`, {
                 res_id: resId,
                 res_type: resType,
@@ -102,13 +126,16 @@ const DiscussionCreateWidget = ({
               <ProFormText
                 name="title"
                 width={"lg"}
-                hidden={typeof parent !== "undefined"}
+                hidden={
+                  typeof parent !== "undefined" ||
+                  typeof topic?.tplId !== "undefined"
+                }
                 label={intl.formatMessage({ id: "forms.fields.title.label" })}
                 tooltip="最长为 24 位"
                 placeholder={intl.formatMessage({
                   id: "forms.message.question.required",
                 })}
-                rules={[{ required: parent ? false : true }]}
+                rules={[{ required: parent || topic?.tplId ? false : true }]}
               />
             </ProForm.Group>
             <ProForm.Group>
@@ -153,9 +180,16 @@ const DiscussionCreateWidget = ({
               ) : contentType === "markdown" ? (
                 <Form.Item
                   name="content"
-                  rules={[{ required: typeof parent !== "undefined" }]}
+                  rules={[
+                    {
+                      required:
+                        typeof parent !== "undefined" ||
+                        typeof topic?.tplId !== "undefined",
+                    },
+                  ]}
                   label={
-                    typeof parent === "undefined"
+                    typeof parent === "undefined" &&
+                    typeof topic?.tplId === "undefined"
                       ? intl.formatMessage({
                           id: "forms.message.question.description.option",
                         })
@@ -167,7 +201,10 @@ const DiscussionCreateWidget = ({
                   <MDEditor
                     placeholder={
                       "问题的详细描述" +
-                      (typeof parent !== "undefined" ? "" : "（选填）")
+                      (typeof parent !== "undefined" &&
+                      typeof topic?.tplId !== "undefined"
+                        ? ""
+                        : "（选填）")
                     }
                   />
                 </Form.Item>

dashboard/src/components/discussion/DiscussionItem.tsx

@@ -9,6 +9,7 @@ export interface IComment {
   id?: string; //id未提供为新建
   resId?: string;
   resType?: TResType;
+  tplId?: string;
   user: IUser;
   parent?: string | null;
   title?: string;
@@ -16,6 +17,7 @@ export interface IComment {
   status?: "active" | "close";
   children?: IComment[];
   childrenCount?: number;
+  newTpl?: boolean;
   createdAt?: string;
   updatedAt?: string;
 }

dashboard/src/components/discussion/DiscussionListCard.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef, useState } from "react";
-import { Space, Typography } from "antd";
+import { Button, Space, Typography } from "antd";
 import { CommentOutlined } from "@ant-design/icons";
 
 import { get } from "../../request";
@@ -10,6 +10,10 @@ import { ActionType, ProList } from "@ant-design/pro-components";
 import { renderBadge } from "../channel/ChannelTable";
 import DiscussionCreate from "./DiscussionCreate";
 import User from "../auth/User";
+import { IArticleListResponse } from "../api/Article";
+import { useAppSelector } from "../../hooks";
+import { currentUser as _currentUser } from "../../reducers/current-user";
+import { TemplateOutlinedIcon } from "../../assets/icon";
 
 const { Link } = Typography;
 
@@ -38,6 +42,7 @@ const DiscussionListCardWidget = ({
   const [activeNumber, setActiveNumber] = useState<number>(0);
   const [closeNumber, setCloseNumber] = useState<number>(0);
   const [count, setCount] = useState<number>(0);
+  const user = useAppSelector(_currentUser);
 
   useEffect(() => {
     ref.current?.reload();
@@ -74,8 +79,10 @@ const DiscussionListCardWidget = ({
             render(dom, entity, index, action, schema) {
               return (
                 <>
-                  <Link
-                    strong
+                  <Button
+                    size="small"
+                    type="link"
+                    icon={entity.newTpl ? <TemplateOutlinedIcon /> : undefined}
                     onClick={(event) => {
                       if (typeof onSelect !== "undefined") {
                         onSelect(event, entity);
@@ -83,7 +90,7 @@ const DiscussionListCardWidget = ({
                     }}
                   >
                     {entity.title}
-                  </Link>
+                  </Button>
                 </>
               );
             },
@@ -134,6 +141,7 @@ const DiscussionListCardWidget = ({
               user: item.editor,
               title: item.title,
               parent: item.parent,
+              tplId: item.tpl_id,
               content: item.content,
               status: item.status,
               childrenCount: item.children_count,
@@ -141,12 +149,45 @@ const DiscussionListCardWidget = ({
               updatedAt: item.updated_at,
             };
           });
+
+          let topicTpl: IComment[] = [];
+          if (activeKey !== "close") {
+            const urlTpl = `/v2/article?view=studio&name=${user?.realName}&subtitle=_template_discussion_topic_&content=true`;
+            const resTpl = await get<IArticleListResponse>(urlTpl);
+            if (resTpl.ok) {
+              console.log("resTpl.data.rows", resTpl.data.rows);
+              topicTpl = resTpl.data.rows
+                .filter(
+                  (value) =>
+                    items.findIndex((old) => old.tplId === value.uid) === -1
+                )
+                .map((item, index) => {
+                  return {
+                    tplId: item.uid,
+                    resId: resId,
+                    resType: resType,
+                    user: item.editor
+                      ? item.editor
+                      : { id: "", userName: "", nickName: "" },
+                    title: item.title,
+                    parent: null,
+                    content: item.content,
+                    status: "active",
+                    childrenCount: 0,
+                    newTpl: true,
+                    createdAt: item.created_at,
+                    updatedAt: item.updated_at,
+                  };
+                });
+            }
+          }
+
           setActiveNumber(res.data.active);
           setCloseNumber(res.data.close);
           return {
             total: res.data.count,
             succcess: true,
-            data: items,
+            data: [...topicTpl, ...items],
           };
         }}
         bordered

dashboard/src/components/discussion/DiscussionTopic.tsx

@@ -8,6 +8,7 @@ import { TResType } from "./DiscussionListCard";
 interface IWidget {
   resType?: TResType;
   topicId?: string;
+  topic?: IComment;
   focus?: string;
   onItemCountChange?: Function;
   onTopicReady?: Function;
@@ -15,21 +16,23 @@ interface IWidget {
 const DiscussionTopicWidget = ({
   resType,
   topicId,
+  topic,
   focus,
   onTopicReady,
   onItemCountChange,
 }: IWidget) => {
   const [count, setCount] = useState<number>();
   const [currResId, setCurrResId] = useState<string>();
-  const [topic, setTopic] = useState<IComment>();
+  const [currTopic, setCurrTopic] = useState<IComment | undefined>(topic);
   return (
     <>
       <DiscussionTopicInfo
         topicId={topicId}
+        topic={topic}
         childrenCount={count}
         onReady={(value: IComment) => {
           setCurrResId(value.resId);
-          setTopic(value);
+          setCurrTopic(value);
           console.log("onReady", value);
           if (typeof onTopicReady !== "undefined") {
             onTopicReady(value);
@@ -37,8 +40,8 @@ const DiscussionTopicWidget = ({
         }}
       />
       <DiscussionTopicChildren
-        topic={topic}
-        resId={currResId}
+        topic={currTopic}
+        resId={currTopic?.resId}
         resType={resType}
         focus={focus}
         topicId={topicId}

dashboard/src/components/discussion/DiscussionTopicChildren.tsx

@@ -40,10 +40,10 @@ const DiscussionTopicChildrenWidget = ({
 }: IWidget) => {
   const intl = useIntl();
   const [data, setData] = useState<IComment[]>([]);
-  const [loading, setLoading] = useState(true);
+  const [loading, setLoading] = useState(false);
   const [history, setHistory] = useState<ISentHistoryData[]>([]);
   const [items, setItems] = useState<IItem[]>();
-
+  console.log("topicId", topicId);
   useEffect(() => {
     if (loading === false) {
       const ele = document.getElementById(`answer-${focus}`);
@@ -129,20 +129,23 @@ const DiscussionTopicChildrenWidget = ({
   useEffect(() => {
     if (resType === "sentence" && resId) {
       let url = `/v2/sent_history?view=sentence&id=${resId}&order=created_at&dir=asc`;
-      get<ISentHistoryListResponse>(url).then((res) => {
-        if (res.ok) {
-          setHistory(res.data.rows);
-        }
-      });
+      setLoading(true);
+      get<ISentHistoryListResponse>(url)
+        .then((res) => {
+          if (res.ok) {
+            setHistory(res.data.rows);
+          }
+        })
+        .finally(() => setLoading(false));
     }
   }, [resId, resType]);
 
   useEffect(() => {
+    console.log("topicId", topicId);
     if (typeof topicId === "undefined") {
       return;
     }
     setLoading(true);
-
     get<ICommentListResponse>(`/v2/discussion?view=answer&id=${topicId}`)
       .then((json) => {
         if (json.ok) {
@@ -217,8 +220,11 @@ const DiscussionTopicChildrenWidget = ({
         />
       )}
       <DiscussionCreate
+        resId={resId}
+        resType={resType}
         contentType="markdown"
         parent={topicId}
+        topic={topic}
         onCreated={(e: IComment) => {
           const newData = JSON.parse(JSON.stringify(e));
           setData([...data, newData]);

dashboard/src/components/discussion/DiscussionTopicInfo.tsx

@@ -7,6 +7,7 @@ import DiscussionItem, { IComment } from "./DiscussionItem";
 
 interface IWidget {
   topicId?: string;
+  topic?: IComment;
   childrenCount?: number;
   onDelete?: Function;
   onReply?: Function;
@@ -15,13 +16,14 @@ interface IWidget {
 }
 const DiscussionTopicInfoWidget = ({
   topicId,
+  topic,
   childrenCount,
   onReady,
   onDelete,
   onReply,
   onClose,
 }: IWidget) => {
-  const [data, setData] = useState<IComment>();
+  const [data, setData] = useState<IComment | undefined>(topic);
 
   useEffect(() => {
     setData((origin) => {