import React from 'react';
import { Table, Tag } from 'antd';

const QuestionnairAnswer = ({ answer, index }) => {
  // console.log(answer);
  // const columns = [
  //   {
  //     title: 'Name',
  //     dataIndex: 'name',
  //     key: 'name',
  //     render: text => <a>{text}</a>,
  //   },
  //   {
  //     title: 'Age',
  //     dataIndex: 'age',
  //     key: 'age',
  //   },
  //   {
  //     title: 'Address',
  //     dataIndex: 'address',
  //     key: 'address',
  //   },
  return (
    // {`${index + 1}.
    <div style={{ minHeight: 60 }}>
      {answer.answer && (
        <React.Fragment>
          <div style={{ color: '#666' }}>
            {index + 1}、
            {answer.type === 'input'
              ? answer.completionForwards
              : answer.title + ':'}
          </div>
          <div style={{ paddingLeft: 12, color: '#151515' }}>
            {typeof answer.answer[answer.type] !== 'string'
              ? typeof answer.answer[answer.type].optionValue !== 'string'
                ? answer.answer[answer.type].optionValue.map((item, index) => {
                    return (
                      item && (
                        <span key={index} style={{ marginRight: 15 }}>
                          {item}
                        </span>
                      )
                    );
                  })
                : answer.answer[answer.type].optionValue
              : answer.answer[answer.type]}
          </div>
        </React.Fragment>
      )}
    </div>
  );
};

export default QuestionnairAnswer;