import { PlusOutlined } from '@ant-design/icons';
import { Button, Card, Descriptions, Alert, Typography } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import { useRequest, useParams } from 'umi';
import { getExaminationById, getRulesById } from './service';
import type { CardListItemDataType } from './data.d';
import styles from './style.less';
import { useEffect, useRef } from 'react';
import type { ProDescriptionsActionType } from '@ant-design/pro-descriptions';
import ProDescriptions from '@ant-design/pro-descriptions';
const { Paragraph } = Typography;
import ProCard from '@ant-design/pro-card';





const CardList = () => {
  const params = useParams();


  // 获取考试详情
  // const { loading: personExaminationLoading, data: examinationInfo = [] } = useRequest(
  //   () => getExaminationById(
  //     {
  //       examination_id: params.examination_id
  //     }), {
  //   formatResult: (result) => {
  //     return result.bean;
  //   }
  // });

  // useEffect(() => {
  //   console.log('examinationInfo', examinationInfo)

  // })



  const actionRef = useRef<ProDescriptionsActionType>();




  return (
    <PageContainer content={''} extraContent={''}>
      <ProCard>
        <ProDescriptions
          actionRef={actionRef}
          title="考试详情"
          request={async () => {
            const examinationInfo = await getExaminationById({ examination_id: params.examination_id })

            const rulesInfo = await getRulesById({ id: examinationInfo.bean.rules_id })

            const exData = { data: { ...examinationInfo.bean, ...rulesInfo.bean } }
            console.log("exData", exData);

            return exData;
          }}
          layout='horizontal'
          columns={[
            {
              title: '考试项目',
              key: 'text',
              dataIndex: 'examination_name',
            },

            {
              title: '考试时间',
              key: 'state2',
              render: (dom, entity, index, action) => {
                return entity.examination_start_time + " - " + entity.examination_end_time
              },
            },
            {
              title: '考试时长',
              key: 'examination_time',
              dataIndex: 'examination_time',
              valueType: 'text',
              render: (dom, entity, index, action) => {
                // return entity.examination_start_time + " - " + entity.examination_start_time
                const d1 = new Date(entity.examination_start_time);
                const d2 = new Date(entity.examination_end_time);
                const examination_time = parseInt((d2 - d1) / 1000 / 60)
                return examination_time + "分钟"
              },
            },
            {
              title: '满分',
              key: 'sum_score',
              dataIndex: 'sum_score',
              valueType: 'text',

            },
            {
              title: '通过标准',
              key: 'pass_score',
              dataIndex: 'pass_score',
              valueType: 'text',
            },

            {
              title: '操作',
              valueType: 'option',
              render: () => [
                <a target="_blank" rel="noopener noreferrer" key="link">
                  链路
                </a>,
                <a target="_blank" rel="noopener noreferrer" key="warning">
                  报警
                </a>,
                <a target="_blank" rel="noopener noreferrer" key="view">
                  查看
                </a>,
              ],
            },
          ]}
          column={1}
        >
          <ProDescriptions.Item >
            <Button type="primary">开始考试</Button>
          </ProDescriptions.Item>
          <ProDescriptions.Item >
            <Alert message="考试开始后，不可随意离开，离开答题页，依然记录时间。" showIcon type="error" style={{ width: "100%" }} />
          </ProDescriptions.Item>

          {/* <ProDescriptions.Item dataIndex="考试项目" layout='horizontal' />
          <ProDescriptions.Item label="考试时间" dataIndex="examination_name" >
            {this.data.id}
          </ProDescriptions.Item>
          <ProDescriptions.Item label="考试时长" dataIndex="examination_name" />
          <ProDescriptions.Item label="满分" dataIndex="sum_score" />
          <ProDescriptions.Item label="通过标准" dataIndex="pass_score" />
          <ProDescriptions.Item label="操作">
            <Button
              type="primary"
              onClick={() => {
                actionRef.current?.reload();
              }}
              key="reload"
            >
              刷新
            </Button>
            <Button key="rest">重置</Button>
          </ProDescriptions.Item> */}
        </ProDescriptions >
      </ProCard>
    </PageContainer >

  );
};

export default CardList;
