import React from 'react'
import { Button } from 'tdesign-react'
import { useNavigate } from 'react-router-dom'
import MeasurementStep from '../../components/Steps/MeasurementStep'
import '../../assets/css/diagnosis.css'
import vidio from '../../mp4/demo.mp4' 

export default function Diagnosis() {
  const navigate = useNavigate()

  return (
    <>
      <div style={{ padding: '10px 20px' }}>
        <MeasurementStep current={1} />

        <div className='diagnosis-box'>
          <video width="1280" height="960" controls>
            <source src={vidio} type="video/mp4" />
          </video>
        </div>

        <Button block variant="base" style={{ width: '30%', margin: '40px auto' }}
          onClick={() => {
            navigate('/result_m', {
              replace: true
            })
          }}
        > 下一步 </Button>
      </div>
    </>
  )
}
