import React from 'react';
import { Space, Tag, Tooltip, Typography } from 'antd';
import ImgBox from '../../imgBox';
const { Link } = Typography;
export default function Render(props) {
    const { methods, data: oakData } = props;
    const { value, type, color, linkUrl } = oakData;
    if (value === null || value === '' || value === undefined) {
        return <>--</>;
    }
    // 属性类型是enum要使用标签
    else if (type === 'enum') {
        let renderColor = color || 'default';
        // web端的Tag组件没有primary 和 danger
        if (renderColor === 'primary') {
            renderColor = 'processing';
        }
        if (renderColor === 'danger') {
            renderColor = 'error';
        }
        return <Tag color={renderColor}>{value}</Tag>;
    }
    else if (type === 'image') {
        if (value instanceof Array) {
            return (<Space>
                    {value.map((ele) => (<ImgBox key={ele} src={ele} width={120} height={70}/>))}
                </Space>);
        }
        return <ImgBox src={value} width={120} height={70}/>;
    }
    else if (type === 'link') {
        let href = linkUrl;
        if (value instanceof Array) {
            return (<Space direction="vertical">
                    {value.map((ele) => {
                    href = ele;
                    if (linkUrl) {
                        href = linkUrl;
                    }
                    return <Link key={ele} href={href}>{ele}</Link>;
                })}
                </Space>);
        }
        return <Link href={href}>{value}</Link>;
    }
    return (<Tooltip placement="topLeft" title={value}>
            {value}
        </Tooltip>);
}