建立成功后清空form

dashboard/src/components/anthology/AnthologyCreate.tsx

@@ -1,10 +1,15 @@
-import { ProForm, ProFormText } from "@ant-design/pro-components";
+import {
+  ProForm,
+  ProFormInstance,
+  ProFormText,
+} from "@ant-design/pro-components";
 import { useIntl } from "react-intl";
 import { message } from "antd";
 
 import LangSelect from "../general/LangSelect";
 import { IAnthologyCreateRequest, IAnthologyResponse } from "../api/Article";
 import { post } from "../../request";
+import { useRef } from "react";
 
 interface IFormData {
   title: string;
@@ -12,17 +17,22 @@ interface IFormData {
   studio: string;
 }
 
-type IWidgetAnthologyCreate = {
+interface IWidget {
   studio?: string;
-};
-const Widget = (prop: IWidgetAnthologyCreate) => {
+  onSuccess?: Function;
+}
+const Widget = ({ studio, onSuccess }: IWidget) => {
   const intl = useIntl();
+  const formRef = useRef<ProFormInstance>();
 
   return (
     <ProForm<IFormData>
+      formRef={formRef}
       onFinish={async (values: IFormData) => {
-        // TODO
-        values.studio = prop.studio ? prop.studio : "";
+        if (typeof studio === "undefined") {
+          return;
+        }
+        values.studio = studio;
         console.log(values);
         const res = await post<IAnthologyCreateRequest, IAnthologyResponse>(
           `/v2/anthology`,
@@ -31,6 +41,10 @@ const Widget = (prop: IWidgetAnthologyCreate) => {
         console.log(res);
         if (res.ok) {
           message.success(intl.formatMessage({ id: "flashes.success" }));
+          if (typeof onSuccess !== "undefined") {
+            onSuccess();
+            formRef.current?.resetFields(["title"]);
+          }
         } else {
           message.error(res.message);
         }

dashboard/src/components/article/ArticleCreate.tsx

@@ -1,10 +1,15 @@
 import { useIntl } from "react-intl";
-import { ProForm, ProFormText } from "@ant-design/pro-components";
+import {
+  ProForm,
+  ProFormInstance,
+  ProFormText,
+} from "@ant-design/pro-components";
 import { message } from "antd";
 
 import { post } from "../../request";
 import { IArticleCreateRequest, IArticleResponse } from "../api/Article";
 import LangSelect from "../general/LangSelect";
+import { useRef } from "react";
 
 interface IFormData {
   title: string;
@@ -12,17 +17,23 @@ interface IFormData {
   studio: string;
 }
 
-type IWidgetArticleCreate = {
+interface IWidget {
   studio?: string;
-};
-const Widget = (prop: IWidgetArticleCreate) => {
+  onSuccess?: Function;
+}
+const Widget = ({ studio, onSuccess }: IWidget) => {
   const intl = useIntl();
+  const formRef = useRef<ProFormInstance>();
 
   return (
     <ProForm<IFormData>
+      formRef={formRef}
       onFinish={async (values: IFormData) => {
         console.log(values);
-        values.studio = prop.studio ? prop.studio : "";
+        if (typeof studio === "undefined") {
+          return;
+        }
+        values.studio = studio;
         const res = await post<IArticleCreateRequest, IArticleResponse>(
           `/v2/article`,
           values
@@ -30,6 +41,10 @@ const Widget = (prop: IWidgetArticleCreate) => {
         console.log(res);
         if (res.ok) {
           message.success(intl.formatMessage({ id: "flashes.success" }));
+          if (typeof onSuccess !== "undefined") {
+            onSuccess();
+            formRef.current?.resetFields(["title"]);
+          }
         } else {
           message.error(res.message);
         }

dashboard/src/components/channel/ChannelCreate.tsx

@@ -1,11 +1,16 @@
 import { useIntl } from "react-intl";
-import { ProForm, ProFormText } from "@ant-design/pro-components";
+import {
+  ProForm,
+  ProFormInstance,
+  ProFormText,
+} from "@ant-design/pro-components";
 import { message } from "antd";
 
 import { post } from "../../request";
 import { IApiResponseChannel } from "../api/Channel";
 import ChannelTypeSelect from "./ChannelTypeSelect";
 import LangSelect from "../general/LangSelect";
+import { useRef } from "react";
 
 interface IFormData {
   name: string;
@@ -14,22 +19,29 @@ interface IFormData {
   studio: string;
 }
 
-type IWidgetChannelCreate = {
-  studio: string | undefined;
-};
-const Widget = (prop: IWidgetChannelCreate) => {
+interface IWidget {
+  studio?: string;
+  onSuccess?: Function;
+}
+const Widget = ({ studio, onSuccess }: IWidget) => {
   const intl = useIntl();
+  const formRef = useRef<ProFormInstance>();
 
   return (
     <ProForm<IFormData>
+      formRef={formRef}
       onFinish={async (values: IFormData) => {
-        // TODO
-        console.log(values);
-        values.studio = prop.studio ? prop.studio : "";
+        if (typeof studio === "undefined") {
+          return;
+        }
+        values.studio = studio;
         const res: IApiResponseChannel = await post(`/v2/channel`, values);
-        console.log(res);
         if (res.ok) {
           message.success(intl.formatMessage({ id: "flashes.success" }));
+          if (typeof onSuccess !== "undefined") {
+            onSuccess();
+            formRef.current?.resetFields(["name"]);
+          }
         } else {
           message.error(res.message);
         }

dashboard/src/components/group/GroupCreate.tsx

@@ -1,8 +1,13 @@
 import { useIntl } from "react-intl";
-import { ProForm, ProFormText } from "@ant-design/pro-components";
+import {
+  ProForm,
+  ProFormInstance,
+  ProFormText,
+} from "@ant-design/pro-components";
 import { message } from "antd";
 import { post } from "../../request";
 import { IGroupRequest, IGroupResponse } from "../api/Group";
+import { useRef } from "react";
 
 interface IFormData {
   name: string;
@@ -14,9 +19,11 @@ interface IWidgetGroupCreate {
 }
 const Widget = ({ studio, onCreate }: IWidgetGroupCreate) => {
   const intl = useIntl();
+  const formRef = useRef<ProFormInstance>();
 
   return (
     <ProForm<IFormData>
+      formRef={formRef}
       onFinish={async (values: IFormData) => {
         // TODO
         if (typeof studio === "undefined") {
@@ -32,6 +39,7 @@ const Widget = ({ studio, onCreate }: IWidgetGroupCreate) => {
           message.success(intl.formatMessage({ id: "flashes.success" }));
           if (typeof onCreate !== "undefined") {
             onCreate();
+            formRef.current?.resetFields();
           }
         } else {
           message.error(res.message);