LocForm.jsx 3.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. import React from 'react';
  2. import Taro from '@tarojs/taro';
  3. import { View, CoverView } from '@tarojs/components';
  4. import { CellGroup, Cell, Field, RadioGroup, Radio, Icon } from '@antmjs/vantui';
  5. import Map from '@/components/map';
  6. import { getTaCheckItemAnswer } from '@/services/tacheckitem';
  7. import mapIcon from '@/assets/icons/marker.png';
  8. import AgePicker from './AgePicker';
  9. export default (props) => {
  10. const { checkItemInfo, checkType, answer, readonly, onChange, onLoadingChange } = props;
  11. const [showAgePicker, setShowAgePicker] = React.useState(false);
  12. const setLoading = (v) => {
  13. if (onLoadingChange) {
  14. onLoadingChange(v)
  15. }
  16. }
  17. const setFieldChange = (key, val) => {
  18. onChange({
  19. ...answer || {},
  20. [key]: val,
  21. })
  22. }
  23. // // 获取答题主记录信息
  24. // React.useEffect(() => {
  25. // if (checkItemInfo?.itemId) {
  26. // setLoading(true);
  27. // getTaCheckItemAnswer(checkItemInfo?.itemId).then((res) => {
  28. // if (res) {
  29. // onChange(res);
  30. // }
  31. // setLoading(false);
  32. // }).catch(() => {
  33. // setLoading(false);
  34. // });
  35. // }
  36. // }, [checkItemInfo?.itemId])
  37. // console.log('answer', answer);
  38. return (
  39. <View>
  40. <Map
  41. readOnly={readonly}
  42. location={answer?.location}
  43. onChange={e => setFieldChange('location', e)}
  44. />
  45. <CellGroup>
  46. {
  47. checkType == 'loc' && (
  48. <Cell
  49. title="点位"
  50. value={checkItemInfo?.name}
  51. />
  52. )
  53. }
  54. {
  55. checkType == 'survey' && (
  56. <Field
  57. label="社区"
  58. placeholder="请填写社区名称"
  59. readonly={readonly}
  60. value={answer?.communityName}
  61. onChange={e => setFieldChange('communityName', e.detail)}
  62. />
  63. )
  64. }
  65. <Field
  66. readonly={readonly}
  67. label={checkType == 'loc' ? '地址' : '小区'}
  68. placeholder={checkType == 'loc' ? '请输入地址' : '请填写小区名称'}
  69. value={answer?.addr}
  70. onChange={e => setFieldChange('addr', e.detail)}
  71. />
  72. </CellGroup>
  73. {
  74. checkType == 'survey' && (
  75. <CellGroup style={{ marginTop: '20px' }}>
  76. <Cell title="性别">
  77. <View style={{ textAlign: 'right' }}>
  78. <RadioGroup
  79. disabled={readonly}
  80. direction="horizontal"
  81. value={answer?.sex}
  82. style={{ display: 'inline-flex' }}
  83. onChange={(e) => setFieldChange('sex', e.detail)}
  84. >
  85. <Radio name="1" checkedColor="var(--main-bg-color)">男</Radio>
  86. <Radio name="2" checkedColor="red">女</Radio>
  87. </RadioGroup>
  88. </View>
  89. </Cell>
  90. <Cell
  91. title="年龄"
  92. isLink
  93. value={answer?.age}
  94. onClick={() => !readonly && setShowAgePicker(true)}
  95. />
  96. <AgePicker
  97. show={showAgePicker}
  98. onShowChange={setShowAgePicker}
  99. onChange={(e) => setFieldChange('age', e)}
  100. />
  101. </CellGroup>
  102. )
  103. }
  104. <CellGroup style={{ marginTop: '20px' }}>
  105. <Field
  106. value="您已完成X份"
  107. inputAlign="center"
  108. readonly
  109. />
  110. </CellGroup>
  111. </View >
  112. )
  113. }