import React from 'react';

interface IPropsType {
  title: string;
  statusStr?: string;
  showStatus?: boolean;
  titleFontSize?: number | string;
  radius?: boolean;
}

const SubTitle: React.FC<IPropsType> = ({
  title,
  statusStr = '',
  showStatus = false,
  titleFontSize = '30',
  radius = false,
}) => {
  const img = require('@/assets/TaskManage/yiwancheng.png');
  return (
    <div
      style={{
        border: 0,
        margin: 0,
        display: 'flex',
        justifyContent: 'space-between',
        alignItems: 'center',
        paddingLeft: '0.2rem',
        paddingRight: '0.1rem',
        // backgroundColor: '#d9e7f9',
        fontSize: String(Number(titleFontSize) / 100) + 'rem',
        height: String((Number(titleFontSize) + 40) / 100) + 'rem',
        // borderRadius: radius ? '8px 8px 0 0 ' : 'unset',
      }}
    >
      <div style={{ display: 'flex', alignItems: 'center' }}>
        <div
          style={{
            background: 'rgba(23, 85, 255, 1)',
            width: '0.1rem',
            height: '0.1rem',
            borderRadius: '0.1rem',
            marginRight: '0.08rem',
          }}
        />
        <span style={{ color: 'rgba(97, 93, 93, 1)', fontWeight: '600' }}>
          {title}
        </span>
      </div>
      {showStatus && (
        <div>
          <img
            src={img}
            alt="status"
            style={{
              position: 'relative',
              left: '0.1rem',
              bottom: '0.1rem',
            }}
          />
        </div>
      )}
    </div>
  );
};

export default SubTitle;
