import './proj-edit.css';
import {Link, useNavigate} from "react-router-dom";
import {Breadcrumb, Button} from "antd";
import StepProjEdit from "../../components/step/StepProjEdit.tsx";
import CardProjEdit from "../../components/card/CardProjEdit.tsx";
import {Process} from "../../interfaces/step/IStepProj.ts";
import CardProjLoading from "../../components/card/CardProjLoading.tsx";
import CardProjResult from "../../components/card/CardProjResult.tsx";
import CardProjDownload from "../../components/card/CardProjDownload.tsx";
import CardProjJump from "../../components/card/CardProjJump.tsx";


export default function ProjEdit() {
    const nav = useNavigate();
    const height = window.innerHeight - 240;
    return (
        <>
            <Breadcrumb
                items={[
                    {title: <Link to={'/'}>首页</Link>},
                    {title: <Link to={'/proj-create'}>创建项目</Link>},
                    {title: '编辑项目'},
                ]}
            />
            <div className="proj-edit" style={{height: `${height}px`}}>
                <StepProjEdit step={1} process={Process.COMPLETE} descTitle="完善信息"
                              descDetail="123123123123123123123123123123123123123123123123"
                              hasNext={true}>
                    <CardProjEdit title="软件基本信息"
                                  desc="请完善软件的介绍、详介绍等基本信息"
                                  handleEdit={() => {

                                  }}
                    />
                </StepProjEdit>
                <StepProjEdit step={2} process={Process.PROCESSING} descTitle="功能设置" hasNext={true}>
                    <CardProjEdit title="软件基本信息"
                                  desc="请完善软件的介绍、详介绍等基本信息"
                                  handleEdit={() => {

                                  }}
                    />
                </StepProjEdit>
                <StepProjEdit step={3} process={Process.PENDING} descTitle="资料生成" hasNext={true}>
                    <CardProjEdit title="软件基本信息"
                                  desc="请完善软件的介绍、详介绍等基本信息"
                                  handleEdit={() => {
                                      console.log('编辑')
                                  }}
                    />
                    <CardProjLoading title="正在排队"
                                     desc="资料正在排队，预计等待600秒"
                    />
                    <CardProjResult title="生成成功"
                                    isSuccess={true}
                                    handleFeedback={() => {
                                        console.log('反馈')
                                    }}
                    />
                </StepProjEdit>
                <StepProjEdit step={4} process={Process.PENDING} descTitle="资料下载">
                    <CardProjDownload title="软件基本信息"
                                      desc="请完善软件的介绍，详细介绍等基本信息"
                                      handleDownload={() => {
                                          console.log('下载')
                                      }}
                    />
                    <CardProjJump title="跳转"
                                  desc="请完善软件的介绍，详细介绍等基本信息"
                                  handleJump={() => {
                                      console.log('跳转');
                                  }}
                    />
                </StepProjEdit>
            </div>
            <div className="btn-container">
                <Button size="large" style={{width: '200px', fontSize: '14px', backgroundColor: 'var(--color-blue)', color: 'var(--color-light)'}} onClick={() => {
                    nav(-1);
                }}>返回</Button>
            </div>
        </>
    )
}