add loading in done button

dashboard-v4/dashboard/src/components/task/TaskBuilderChapter.tsx

@@ -30,7 +30,7 @@ import {
   ITokenData,
   TPower,
 } from "../api/token";
-const { Text } = Typography;
+const { Text, Paragraph } = Typography;
 
 interface IModal {
   studioName?: string;
@@ -93,6 +93,7 @@ const TaskBuilderChapter = ({
   const [messages, setMessages] = useState<string[]>([]);
   const [prop, setProp] = useState<IProp[]>();
   const [title, setTitle] = useState<string>();
+  const [loading, setLoading] = useState(false);
 
   const steps = [
     {
@@ -179,10 +180,33 @@ const TaskBuilderChapter = ({
     {
       title: "生成",
       content: (
-        <div>
-          {messages?.map((item, id) => {
-            return <div key={id}>{item}</div>;
-          })}
+        <div style={{ padding: 8 }}>
+          <div>
+            <Space>
+              <Text type="secondary">title</Text>
+              <Text>{title}</Text>
+            </Space>
+          </div>
+          <div>
+            <Space>
+              <Text type="secondary">新增任务组</Text>
+              <Text>{chapter?.length}</Text>
+            </Space>
+          </div>
+          <div>
+            <Space>
+              <Text type="secondary">每个任务组任务数量</Text>
+              <Text>{workflow?.length}</Text>
+            </Space>
+          </div>
+          <div>
+            <Paragraph>点击生成按钮生成</Paragraph>
+          </div>
+          <div>
+            {messages?.map((item, id) => {
+              return <div key={id}>{item}</div>;
+            })}
+          </div>
         </div>
       ),
     },
@@ -220,11 +244,15 @@ const TaskBuilderChapter = ({
         )}
         {current === steps.length - 1 && (
           <Button
+            loading={loading}
+            disabled={loading}
             type="primary"
             onClick={async () => {
               if (!studioName || !chapter) {
+                console.error("缺少参数", studioName, chapter);
                 return;
               }
+              setLoading(true);
               //生成projects
               setMessages((origin) => [...origin, "正在生成任务组……"]);
               const url = "/v2/project-tree";
@@ -340,7 +368,12 @@ const TaskBuilderChapter = ({
                   ...origin,
                   "生成任务关联" + taskRes.data.taskRelationCount,
                 ]);
+                setMessages((origin) => [
+                  ...origin,
+                  "打开译经楼-我的任务查看已经生成的任务",
+                ]);
               }
+              setLoading(false);
             }}
           >
             Done

dashboard-v4/dashboard/src/components/task/TaskBuilderProjects.tsx

@@ -4,6 +4,7 @@ import {
   Input,
   message,
   Modal,
+  Space,
   Steps,
   Tag,
   Typography,
@@ -24,7 +25,7 @@ import {
 import { post } from "../../request";
 import TaskBuilderProp, { IParam, IProp } from "./TaskBuilderProp";
 
-const { Paragraph } = Typography;
+const { Paragraph, Text } = Typography;
 
 interface IBuildProjects {
   onChange?: (titles: string[]) => void;
@@ -163,7 +164,7 @@ const TaskBuilderProjects = ({
   const [workflow, setWorkflow] = useState<ITaskData[]>();
   const [projectsTitle, setProjectsTitle] = useState<string[]>();
   const [prop, setProp] = useState<IProp[]>();
-
+  const [loading, setLoading] = useState(false);
   const [messages, setMessages] = useState<string[]>([]);
   const steps = [
     {
@@ -195,7 +196,13 @@ const TaskBuilderProjects = ({
       content: (
         <div>
           <div>
-            <Paragraph>新增任务组：{projectsTitle?.length}</Paragraph>
+            <Space>
+              <Text type="secondary">title</Text>
+              <Text>{projectsTitle}</Text>
+            </Space>
+          </div>
+          <div>
+            <Paragraph>新增任务组：{projectsTitle}</Paragraph>
             <Paragraph>每个任务组任务数量：{workflow?.length}</Paragraph>
             <Paragraph>点击生成按钮生成</Paragraph>
           </div>
@@ -242,11 +249,14 @@ const TaskBuilderProjects = ({
         {current === steps.length - 1 && (
           <Button
             type="primary"
+            loading={loading}
+            disabled={loading}
             onClick={async () => {
               if (!studioName || !parentId || !projectsTitle) {
                 console.error("缺少参数", studioName, parentId, projectsTitle);
                 return;
               }
+              setLoading(true);
               //生成projects
               setMessages((origin) => [...origin, "正在生成任务组……"]);
               const url = "/v2/project-tree";
@@ -329,6 +339,10 @@ const TaskBuilderProjects = ({
                   ...origin,
                   "生成任务关联" + taskRes.data.taskRelationCount,
                 ]);
+                setMessages((origin) => [
+                  ...origin,
+                  "打开译经楼-我的任务查看已经生成的任务",
+                ]);
                 onDone && onDone();
               } else {
                 setMessages((origin) => [
@@ -336,6 +350,7 @@ const TaskBuilderProjects = ({
                   "生成任务失败。错误信息：" + taskRes.data,
                 ]);
               }
+              setLoading(false);
             }}
           >
             Done