system-copyright-react/src/components/card/CardProjDownload.tsx

import './card-proj-download.css';
import { IProjDownload } from "../../interfaces/card/ICardProj.ts";

export default function CardProjDownload(props: IProjDownload) {
    return (
        // <div className="card-proj-download">
        <div className={props.canBtnClick ? 'card-proj-download' : 'card-proj-nodownload'}>
            <div className="cpDown-title">{props.title}</div>
            <div className='cpDown-bot'>
                <div className="cpDown-desc">{props.desc}</div>
                <div className="cpDown-option">
                    {
                        props.canBtnClick ? (
                            <div>
                                <div style={{ display: props.title == '申请表' || props.title == '代码压缩包' ||props.title == '证书下载' ? 'unset' : 'none' }}>
                                    <a href="/#" className="cpDown-edit" style={{ minWidth: 30 }} onClick={(e) => {
                                        e.preventDefault();
                                        props.handleDownload();
                                    }}>下载</a>
                                </div>
                                <div style={{ display: props.title == '操作手册' || props.title == '源代码' ? 'unset' : 'none' }}>
                                    下载 ：
                                    <a href="/#" className="cpDown-edit" style={{ minWidth: 30 }} onClick={(e) => {
                                        e.preventDefault();
                                        props.handleDownload();
                                    }}>word</a>
                                    <a href="/#" className="cpDown-edit" style={{ minWidth: 30, marginLeft: 5 }} onClick={(e) => {
                                        e.preventDefault();
                                        props.downPdf();
                                    }}>pdf</a>
                                </div>
                            </div>
                        ) : (
                            // <a href="/#" className="cpDown-noedit"  style={{ color: '#c2c2c2',minWidth:30 }} onClick={(e) => {
                            //     e.preventDefault();
                            // }}>下载</a>
                            <div>
                                <div style={{ display: props.title == '申请表' || props.title == '代码压缩包' ? 'unset' : 'none' }}>
                                    <a href="/#" className="cpDown-noedit" style={{ color: '#c2c2c2', minWidth: 30 }} onClick={(e) => {
                                        e.preventDefault();
                                    }}>下载</a>
                                </div>
                                <div style={{ display: props.title == '操作手册' || props.title == '源代码' ? 'unset' : 'none' }}>
                                    
                                    <div style={{ color: '#c2c2c2' }}>下载 ：<a href="/#" className="cpDown-noedit" style={{ color: '#c2c2c2', minWidth: 30 }} onClick={(e) => {
                                        e.preventDefault();
                                    }} >word</a> <a href="/#" className="cpDown-noedit" style={{ color: '#c2c2c2', minWidth: 30 }} onClick={(e) => {
                                        e.preventDefault();
                                    }}>pdf</a></div>
                                </div>
                            </div>
                        )
                    }

                </div>
            </div>
            <div className='downBoxx'></div>
        </div>
    )
}