TransferCreate.tsx 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. import { ModalForm, ProForm } from "@ant-design/pro-components";
  2. import { Alert, Form, message, notification } from "antd";
  3. import { post } from "../../request";
  4. import type {
  5. ITransferCreateResponse,
  6. ITransferRequest,
  7. } from "../../api/Transfer";
  8. import { useIntl } from "react-intl";
  9. import { useEffect, useState } from "react";
  10. import UserSelect from "../users/UserSelect";
  11. import type { TResType } from "../../api/discussion";
  12. interface IWidget {
  13. studioName?: string;
  14. resType: TResType;
  15. resId?: string[];
  16. resName?: string;
  17. open?: boolean;
  18. onOpenChange?: (visible: boolean) => void;
  19. onCreate?: () => void;
  20. }
  21. const TransferCreateWidget = ({
  22. resType,
  23. resId,
  24. resName,
  25. open = false,
  26. onOpenChange,
  27. onCreate,
  28. }: IWidget) => {
  29. const intl = useIntl();
  30. const [form] = Form.useForm<{ studio: string }>();
  31. const [modalVisit, setModalVisit] = useState(open);
  32. useEffect(() => {
  33. setModalVisit(open);
  34. }, [open]);
  35. const strTransfer = intl.formatMessage({
  36. id: `columns.studio.transfer.title`,
  37. });
  38. return (
  39. <ModalForm<{
  40. studio: string;
  41. }>
  42. open={modalVisit}
  43. onOpenChange={(visible) => {
  44. if (typeof onOpenChange !== "undefined") {
  45. onOpenChange(visible);
  46. }
  47. }}
  48. title={intl.formatMessage({
  49. id: `columns.studio.transfer.title`,
  50. })}
  51. form={form}
  52. autoFocusFirstInput
  53. modalProps={{
  54. destroyOnClose: true,
  55. onCancel: () => console.log("run"),
  56. }}
  57. submitTimeout={2000}
  58. onFinish={async (values) => {
  59. console.log(values);
  60. if (typeof resId === "undefined") {
  61. console.error("res id is undefined");
  62. return;
  63. }
  64. const data = {
  65. res_type: resType,
  66. res_id: resId,
  67. new_owner: values.studio,
  68. };
  69. const res = await post<ITransferRequest, ITransferCreateResponse>(
  70. `/api/v2/transfer`,
  71. data
  72. );
  73. if (res.ok) {
  74. if (typeof onCreate === "undefined") {
  75. notification.open({
  76. message: strTransfer,
  77. description: `${resType} ${resName} 等 ${res.data} 个资源已经转出。请等待对方确认。可以在转移管理中查看状态或取消。`,
  78. duration: 0,
  79. });
  80. } else {
  81. onCreate();
  82. }
  83. } else {
  84. message.error(res.message, 10);
  85. }
  86. return true;
  87. }}
  88. >
  89. <Alert
  90. title={`将${resName} ${strTransfer}下面的用户。操作后需要等待对方确认后,资源才会被转移。可以在${strTransfer}查看和取消`}
  91. />
  92. <ProForm.Group>
  93. <UserSelect name="studio" multiple={false} />
  94. </ProForm.Group>
  95. </ModalForm>
  96. );
  97. };
  98. export default TransferCreateWidget;