AiModelEdit.tsx 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import { useIntl } from "react-intl";
  2. import {
  3. ProForm,
  4. type ProFormInstance,
  5. ProFormText,
  6. ProFormTextArea,
  7. } from "@ant-design/pro-components";
  8. import { message } from "antd";
  9. import { get, put } from "../../request";
  10. import { useRef } from "react";
  11. import type { IAiModelRequest, IAiModelResponse } from "../../api/ai";
  12. import Publicity from "../studio/Publicity";
  13. interface IWidget {
  14. studioName?: string;
  15. modelId?: string;
  16. onChange?: Function;
  17. }
  18. const AiModelEdit = ({ studioName, modelId, onChange }: IWidget) => {
  19. const intl = useIntl();
  20. const formRef = useRef<ProFormInstance | undefined>(undefined);
  21. return (
  22. <ProForm<IAiModelRequest>
  23. formRef={formRef}
  24. onFinish={async (values: IAiModelRequest) => {
  25. if (typeof studioName === "undefined") {
  26. return;
  27. }
  28. const url = `/v2/ai-model/${modelId}`;
  29. console.info("api request", url, values);
  30. const res = await put<IAiModelRequest, IAiModelResponse>(url, values);
  31. console.info("api response", res);
  32. if (res.ok) {
  33. message.success(intl.formatMessage({ id: "flashes.success" }));
  34. onChange && onChange();
  35. } else {
  36. message.error(res.message);
  37. }
  38. }}
  39. request={async () => {
  40. const url = `/v2/ai-model/${modelId}`;
  41. console.info("api request", url);
  42. const res = await get<IAiModelResponse>(url);
  43. console.info("api response", res);
  44. return res.data;
  45. }}
  46. >
  47. <ProForm.Group>
  48. <ProFormText
  49. width="md"
  50. name="name"
  51. required
  52. label={intl.formatMessage({ id: "forms.fields.name.label" })}
  53. rules={[
  54. {
  55. required: true,
  56. message: intl.formatMessage({
  57. id: "channel.create.message.noname",
  58. }),
  59. },
  60. ]}
  61. />
  62. <ProFormText
  63. width="md"
  64. name="studio_name"
  65. initialValue={studioName}
  66. hidden
  67. required
  68. />
  69. </ProForm.Group>
  70. <ProForm.Group>
  71. <ProFormText
  72. width="md"
  73. name="url"
  74. label={intl.formatMessage({ id: "forms.fields.url.label" })}
  75. />
  76. </ProForm.Group>
  77. <ProForm.Group>
  78. <ProFormText
  79. width="md"
  80. name="model"
  81. label={intl.formatMessage({ id: "forms.fields.model.label" })}
  82. />
  83. </ProForm.Group>
  84. <ProForm.Group>
  85. <ProFormText
  86. width="md"
  87. name="key"
  88. label={intl.formatMessage({ id: "forms.fields.key.label" })}
  89. />
  90. </ProForm.Group>
  91. <ProForm.Group>
  92. <Publicity name="privacy" disable={["public_no_list", "blocked"]} />
  93. </ProForm.Group>
  94. <ProForm.Group>
  95. <ProFormTextArea
  96. width="md"
  97. name="description"
  98. label={intl.formatMessage({ id: "forms.fields.description.label" })}
  99. />
  100. </ProForm.Group>
  101. <ProForm.Group>
  102. <ProFormTextArea
  103. width="md"
  104. name="system_prompt"
  105. label={"system_prompt"}
  106. />
  107. </ProForm.Group>
  108. </ProForm>
  109. );
  110. };
  111. export default AiModelEdit;