LangSelect.tsx 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. import { useIntl } from "react-intl";
  2. import { ProFormSelect } from "@ant-design/pro-components";
  3. export const LangValueEnum = () => {
  4. const intl = useIntl();
  5. return {
  6. all: {
  7. text: intl.formatMessage({
  8. id: "forms.fields.publicity.all.label",
  9. }),
  10. status: "Default",
  11. },
  12. en: {
  13. text: "English",
  14. },
  15. "zh-Hans": { text: "简体中文" },
  16. "zh-Hant": {
  17. text: "繁体中文",
  18. },
  19. my: {
  20. text: "缅文",
  21. },
  22. };
  23. };
  24. interface IWidget {
  25. width?: number | "md" | "sm" | "xl" | "xs" | "lg";
  26. label?: string;
  27. disabled?: boolean;
  28. required?: boolean;
  29. name?: string;
  30. readonly?: boolean;
  31. }
  32. const LangSelectWidget = ({
  33. width,
  34. label,
  35. disabled = false,
  36. required = true,
  37. name = "lang",
  38. readonly,
  39. }: IWidget) => {
  40. const intl = useIntl();
  41. const langOptions = [
  42. {
  43. value: "en-US",
  44. label: "English",
  45. },
  46. {
  47. value: "zh-Hans",
  48. label: "简体中文 zh-Hans",
  49. },
  50. {
  51. value: "zh-Hant",
  52. label: "繁体中文 zh-Hant",
  53. },
  54. {
  55. value: "my",
  56. label: "缅文 my",
  57. },
  58. ];
  59. return (
  60. <ProFormSelect
  61. options={langOptions}
  62. width={width}
  63. name={name}
  64. readonly={readonly}
  65. showSearch
  66. debounceTime={300}
  67. allowClear={false}
  68. disabled={disabled}
  69. label={
  70. label ? label : intl.formatMessage({ id: "forms.fields.lang.label" })
  71. }
  72. rules={[
  73. {
  74. required: required,
  75. message: intl.formatMessage({
  76. id: "forms.message.lang.required",
  77. }),
  78. },
  79. ]}
  80. />
  81. );
  82. };
  83. export default LangSelectWidget;