miniapp/src/pages/check/loc/edit/components/Question.jsx

import React from 'react';
import Taro from '@tarojs/taro';
import { View, RichText, Text } from '@tarojs/components';
import { CellGroup, Cell, Field, Radio, RadioGroup, Button } from '@antmjs/vantui';
import Uploader from '@/components/Uploader/index';
import { getTaCheckAnswerItem } from '@/services/tacheckansweritem';


export default (props) => {
  const { quInfo, answerItem, readonly, onChange, onLoadingChange } = props;

  const setLoading = (v) => {
    if (onLoadingChange) {
      onLoadingChange(v);
    }
  }

  const setFieldChange = (key, val) => {
    if (readonly) return;

    onChange({
      ...(answerItem || {}),
      quId: quInfo.quId,
      [key]: val,
    })
  }

  React.useEffect(() => {
    if (quInfo?.quId) {
      setLoading(true);
      getTaCheckAnswerItem({ quId: quInfo.quId, isMine: true }).then(res => {
        onChange(res && res.length ? res[0] : {});
        setLoading(false);
      }).catch(() => {
        setLoading(false);
      });
    }
  }, [quInfo?.quId]);
  
  return (
    <View>
      <RadioGroup value={answerItem?.answerCode}>
        <CellGroup>
          <Cell
            border={false}
            renderTitle={(
              <View style={{fontWeight: 'bold'}}>
                <Text>{quInfo?.sortNo}、</Text>
                <Text>{quInfo?.title}</Text>
              </View>
            )}
          />
          {
            quInfo?.quType == 'fill' && (
              <Field
                label="答案:"
                clearable
                readonly={readonly}
                value={answerItem?.answer}
                placeholder="填写数字"
                renderButton={quInfo?.fillUnit}
                onChange={(e) => setFieldChange('answer', e.detail - 0)}
              />
            )
          }
          {
            (quInfo?.answerList || []).map((it) => {              
              return (
                <Cell
                  key={it.answerId}
                  title={it.answer}
                  clickable
                  border={false}
                  onClick={() => setFieldChange('answerCode', it.answerCode)}
                  renderRightIcon={<Radio checkedColor="var(--main-bg-color)" readonly={readonly} name={it.answerCode}></Radio>}
                />
              );
            })
          }
        </CellGroup>
      </RadioGroup>
      <CellGroup style={{marginTop: '20px'}}>
        <Cell title="测评标准" />
        <Cell
          renderTitle={
            <RichText nodes={quInfo?.stand} />
          }
        />
      </CellGroup>
      <CellGroup style={{marginTop: '20px'}}>        
        <Cell title="拍照或视频" border={false} />

        <Cell
          renderTitle={
            <Uploader
              disabled={readonly}
              value={answerItem?.attachList}
              onChange={e => setFieldChange('attachList',e)}
            />
          }
        />
      </CellGroup>
    </View>
  )
}