index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. import { Input, InputNumber, Select, DatePicker, Rate } from 'antd';
  2. import TableField from './TableField';
  3. import PhoneField from './PhoneField';
  4. import InnerContactField from './InnerContactField';
  5. import DepartmentField from './DepartmentField';
  6. import ProjectField from './ProjectField';
  7. import ManufacturerField from './ManufacturerField';
  8. import DDMultiSelectField from './DDMultiSelectField';
  9. import NumberField from './NumberField';
  10. import DDPhotoField from './DDPhotoField';
  11. import DDSelectField from './DDSelectField';
  12. import DDDateField from './DDDateField';
  13. import DDDateRangeField from './DDDateRangeField';
  14. import DDAttachment from './DDAttachment';
  15. import TextNote from './TextNote';
  16. export default function DDComponents(props) {
  17. const { item, onChange } = props;
  18. const { placeholder, options, format, unit, disabled, notUpper } = item.props;
  19. let component = null;
  20. switch (item.componentName) {
  21. case 'TextField': //单行输入
  22. component = (
  23. <Input
  24. disabled={disabled}
  25. placeholder={placeholder}
  26. onChange={(e) => onChange?.(e.target.value)}
  27. />
  28. );
  29. break;
  30. case 'TextareaField': //多行输入
  31. component = (
  32. <Input.TextArea
  33. disabled={disabled}
  34. placeholder={placeholder}
  35. onChange={(e) => onChange?.(e.target.value)}
  36. />
  37. );
  38. break;
  39. case 'NumberField': //数字输入
  40. component = (
  41. <NumberField disabled={disabled} unit={unit} onChange={onChange} />
  42. );
  43. break;
  44. case 'DDSelectField': //单选框
  45. component = (
  46. <DDSelectField
  47. options={options}
  48. onChange={onChange}
  49. disabled={disabled}
  50. />
  51. );
  52. break;
  53. case 'DDMultiSelectField': //多选框
  54. component = (
  55. <DDMultiSelectField
  56. disabled={disabled}
  57. options={options}
  58. onChange={onChange}
  59. />
  60. );
  61. break;
  62. case 'DDDateField': //日期控件
  63. component = (
  64. <DDDateField
  65. placeholder={placeholder}
  66. format={format}
  67. disabled={disabled}
  68. onChange={onChange}
  69. />
  70. );
  71. break;
  72. case 'DDDateRangeField': //时间区间控件
  73. component = (
  74. <DDDateRangeField
  75. format={format}
  76. disabled={disabled}
  77. onChange={onChange}
  78. />
  79. );
  80. break;
  81. case 'TextNote': //文本说明控件
  82. component = <TextNote value={placeholder} />;
  83. break;
  84. case 'PhoneField': //电话控件
  85. component = <PhoneField onChange={onChange} />;
  86. break;
  87. case 'DDPhotoField': //图片控件
  88. component = <DDPhotoField />;
  89. break;
  90. case 'MoneyField': //金额控件
  91. component = <Input placeholder={placeholder} onChange={onChange} />;
  92. break;
  93. case 'TableField': //明细控件
  94. component = <TableField item={item} />;
  95. break;
  96. case 'DDAttachment': //附件
  97. component = <DDAttachment onChange={onChange} />;
  98. // component = '附件控件未渲染!'
  99. console.info('附件控件未渲染!');
  100. break;
  101. case 'InnerContactField': //联系人控件
  102. component = <InnerContactField onChange={onChange}></InnerContactField>;
  103. break;
  104. case 'DepartmentField': //部门控件
  105. component = <DepartmentField onChange={onChange} />;
  106. break;
  107. case 'ProjectField':
  108. component = <ProjectField onChange={onChange} />;
  109. break;
  110. case 'ManufacturerField':
  111. component = <ManufacturerField onChange={onChange} />;
  112. break;
  113. case 'RelateField': //关联审批单
  114. component = '关联审批单控件未渲染!';
  115. break;
  116. case 'AddressField': //省市区控件
  117. component = '省市区控件未渲染!';
  118. break;
  119. case 'StarRatingField': //评分控件
  120. component = '评分控件未渲染!';
  121. break;
  122. case 'FormRelateField': //关联控件
  123. component = '关联控件未渲染!';
  124. break;
  125. }
  126. return (
  127. <>
  128. {component}
  129. {notUpper == 1 && <p>大写</p>}
  130. </>
  131. );
  132. }