/*
 * @Author: 吴永生 15770852798@163.com
 * @Date: 2022-10-17 14:35:11
 * @LastEditors: 吴永生 15770852798@163.com
 * @LastEditTime: 2022-10-19 21:08:31
 * @FilePath: /bkunyun/src/views/ResourceCenter/UserResources/WorkflowOperator/index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

import styles from "./index.module.css";
import { IOperatorInfo } from "../../interface";

interface IProps {
	operatorInfo: IOperatorInfo;
}

const OperatorCard = (props: IProps) => {
	const {
		operatorInfo: { title = "", type, version },
	} = props;

	return (
		<div className={styles.itemBox}>
			<div className={styles.itemHeaderBox}>
				<img alt="" style={{ width: 36, height: 36 }} />
				<div>
					<b className={styles.titleBox}>{title}</b>
					<span className={styles.operatorTypeBox}>批算子</span>
				</div>
			</div>
			<div className={styles.itemContentBox}>
				<p className={styles.infoBox}>
					所属产品：<span>{type}</span>
				</p>
				<p className={styles.infoBox}>
					算子版本：<span>{`V${version}`}</span>
				</p>
				<p className={styles.infoBox}>
					创建时间：<span>2022-10-11</span>
				</p>
			</div>
		</div>
	);
};

export default OperatorCard;
