import { Form, Input, Modal } from "antd"
import React, { useEffect } from "react"
import pageBg from '../../../../images/answer/bg.png'

const { TextArea } = Input;

interface QuestDetailProps {
  modalVisible: boolean;
  questData: any;
  onCancel: () => void;
}

const layout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 15 },
};

const QuestDetail: React.FC<QuestDetailProps> = (props) => {
  const { modalVisible, questData, onCancel } = props;
  const [form] = Form.useForm();

  useEffect(() => {
    Int();
  }, [questData?.id]);

  const Int = () => {
    form.setFieldsValue({
      ...questData
    })
  };

  const getFollow = async () => { // 跟进
    window.open(`/QuestAnswer/Answer?code=${questData?.id}`);
  }

  return (
    <>
      <Modal
        className="model-container"
        destroyOnClose={true}
        getContainer={false}
        title='参与调研'
        visible={modalVisible}
        onOk={() => getFollow()}
        onCancel={() => onCancel()}
        width={800}
        centered
        okText='参与'
        cancelText='返回'
      >
        <Form
          name="basic"
          form={form}
        >

          <Form.Item
            name="title"
            className="model-title"
          >
            <Input readOnly bordered={false} />
          </Form.Item>
          <Form.Item
            label="截止时间"
            name="endTime"
            className="model-time"
          >
            <Input readOnly bordered={false} />
          </Form.Item>
          <Form.Item
            name="desc"
          >
            <TextArea className="remarks" readOnly bordered={false} autoSize />
          </Form.Item>
        </Form>
        <div><img src={pageBg} /></div>
      </Modal>
    </>
  )
}

export default QuestDetail