import type { StepsProps } from 'antd'
import { Spin, Steps } from 'antd'

export default function AppSteps({ ...props }: StepsProps) {
  const customDot = (dot, { status }) => {
    const statusMap: any = {
      wait: '待处理',
      process: '处理中',
      finish: '已完成',
    }
    return (
      <>
        <div className="app-progress-step-box">
          {status === 'process' ? <Spin size="large"></Spin> : statusMap[status]}
        </div>
      </>
    )
  }
  return <Steps className="app-process-steps" progressDot={customDot} labelPlacement="vertical" {...props}></Steps>
}
