import { MyBetaModalFormProps } from '@/common';
import React from 'react';

import { ProCard, ProDescriptions } from '@ant-design/pro-components';
import { useNavigate } from '@umijs/max';
import { Form, Space, Steps } from 'antd';

export default function Update(props: MyBetaModalFormProps) {
  const [form] = Form.useForm();
  const navigate = useNavigate();

  return (
    <>
      <Space direction="vertical" style={{ width: '100%' }}>
        <ProCard title="审批流程" size="small">
          <ProDescriptions.Item label="审核记录">
            <Space direction="vertical" style={{ width: '100%' }}>
              <Steps
                progressDot
                direction="vertical"
                current={props?.item?.approval_records.length - 1}
                items={props?.item?.approval_records.map((item: any) =>
                  item?.node_type === 'Approver'
                    ? {
                        title: `${item.company_employee?.name || '-'}-${
                          item?.company_employee?.phone
                        }`,
                        description: `${
                          item.status === 'Approved'
                            ? `通过 - ${item.opinion || '-'} - ${
                                item.created_at || '-'
                              }`
                            : item.status === 'Rejected'
                            ? `拒绝 - ${item.opinion || '-'} - ${
                                item.created_at || '-'
                              }`
                            : '待审核'
                        }`,
                      }
                    : '',
                )}
              />
            </Space>
          </ProDescriptions.Item>
          {props?.item?.approval_records?.filter(
            (item: any) => item?.node_type === 'CC',
          ).length > 0 && (
            <ProDescriptions.Item label="抄送对象">
              {props?.item?.approval_records
                .filter((item: any) => item?.node_type === 'CC')
                .map((item: any, index: number) => (
                  <React.Fragment key={index}>
                    {index > 0 && '；'}
                    {item.company_employee?.name || '-'}-
                    {item?.company_employee?.phone || '-'}
                  </React.Fragment>
                ))}
            </ProDescriptions.Item>
          )}
        </ProCard>
      </Space>
    </>
  );
}
