import './card-img-select.css'
import {Image} from "antd";
import {errorImage} from "../../util/CommonUtil.ts";
import {Axios} from "../../util/AjaxUtils.ts";

export type ImgSelect = {
    id: string;
    title: string;
    imgs: string;
    selected?: boolean;

    handleClick?(): void;
}

export default function CardImgSelect(props: ImgSelect) {
    const imgSrc = `${Axios.defaults?.baseURL}/route/file/v2/download/true/${props.imgs}`;
    console.log(imgSrc)
    return (
        <div className={props.selected ? 'card-img-select card-img-selected' : 'card-img-select'}
             onClick={props.handleClick}>
            <div className="card-img">
                <Image src={imgSrc} fallback={errorImage} preview={false} width={220} height={120}/>
            </div>
            <div className="card-title">
                <div className="checkbox"></div>
                <div className="text">{props.title ? props.title : '标题'}</div>
            </div>
        </div>
    )
}