Pie.tsx 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import React from 'react'
  2. import { Row, Col, Checkbox } from 'antd'
  3. import { onSectionChange } from './util'
  4. import { ISpecConfig } from '../types'
  5. import styles from '../../../Workbench.less'
  6. interface ISpecSectionPieProps {
  7. spec: ISpecConfig
  8. title: string
  9. onChange: (value: string | number, propPath: string | string[]) => void
  10. }
  11. function SpecSectionPie (props: ISpecSectionPieProps) {
  12. const { spec, title, onChange } = props
  13. const { circle, roseType } = spec
  14. return (
  15. <div className={styles.paneBlock}>
  16. <h4>{title}</h4>
  17. <div className={styles.blockBody}>
  18. <Row gutter={8} type="flex" align="middle" className={styles.blockRow}>
  19. <Col span={10}>
  20. <Checkbox checked={circle} onChange={onSectionChange(onChange, 'circle')}>
  21. 环状
  22. </Checkbox>
  23. </Col>
  24. <Col span={12}>
  25. <Checkbox
  26. checked={roseType}
  27. onChange={onSectionChange(onChange, 'roseType')}
  28. >
  29. 南丁格尔玫瑰
  30. </Checkbox>
  31. </Col>
  32. </Row>
  33. </div>
  34. </div>
  35. )
  36. }
  37. export default SpecSectionPie