General-AI-Platform-Web/src/pages/Project/BusinessProject/components/businessCard.tsx

/*
 * @Author: donghao donghao@supervision.ltd
 * @Date: 2024-04-08 16:57:30
 * @LastEditors: donghao donghao@supervision.ltd
 * @LastEditTime: 2024-05-24 14:21:10
 * @FilePath: \general-ai-manage\src\pages\Project\BusinessProject\components\businessCard.tsx
 * @Description: 企业项目卡片
 */
import TableActionCard, { actionsProps } from '@/components/TableActionCard';
import { useBusinessInfo } from '@/hooks/useBusinessInfo';
import { useMoment } from '@/hooks/useMoment';
import { history } from '@umijs/max';
import businessLogoIcon from '/public/home/business_logo.svg';
import { ReactComponent as DeviceCountIcon } from '/public/home/device_count_icon.svg';
import { ReactComponent as ModelCountIcon } from '/public/home/model_count_icon.svg';
import { ReactComponent as TimeIcon } from '/public/home/time_icon.svg';

type BusinessCardProps = {
  info: Record<string, any>;
  renderActions: actionsProps[];
};

const BusinessCard: React.FC<BusinessCardProps> = ({ info, renderActions }) => {
  const { formatTimeByDateType } = useMoment();
  const { setStoreBusinessInfo } = useBusinessInfo();
  return (
    <div
      className="w-full bp_card_box text_color_1"
      onClick={() => {
        setStoreBusinessInfo(info);
        history.push(`/business/index?id=${info.id}`);
        console.log('跳转企业');
      }}
    >
      <div className="bp_card_body">
        <div className="tag_box">
          <div className="bg_tag_info single_line">{info?.industry}</div>
        </div>
        <div className="flex justify-end items-center pt-[8px]">
          <span className="pr-[14px]">
            <TableActionCard renderActions={renderActions} maxActionCount={1}></TableActionCard>
          </span>
        </div>
        <div className="px-[12px] pt-[12px]">
          <div className="flex items-center logo_name">
            <span className="icon_logo mr-[4px]">
              {/* 空值使用默认图标 */}
              <img src={info.logo || businessLogoIcon} alt="" />
            </span>
            <span className="single_line">{info.name}</span>
          </div>

          <ul className="main_info mt-[8px] ">
            <li className="flex items-center mb-[8px]">
              <span className="icon_box mr-[4px]">
                <ModelCountIcon></ModelCountIcon>
              </span>
              <span className="label_box">模型数量：</span>
              <span>{info.modelCount}</span>
            </li>
            <li className="flex items-center mb-[8px]">
              <span className="icon_box mr-[4px]">
                <DeviceCountIcon></DeviceCountIcon>
              </span>
              <span className="label_box">设备数量： </span>
              <span>{info.deviceCount}</span>
            </li>
            <li className="flex items-center">
              <span className="icon_box mr-[4px]">
                <TimeIcon></TimeIcon>
              </span>
              <span className="label_box">创建时间：</span>
              <span>{formatTimeByDateType(info.create_time)}</span>
            </li>
          </ul>
        </div>
      </div>
    </div>
  );
};

export default BusinessCard;