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: '20px',
        paddingRight: '10px',
        backgroundColor: '#d9e7f9',
        fontSize: String(titleFontSize) + 'px',
        height: String(Number(titleFontSize) + 40) + 'px',
        borderRadius: radius ? '8px 8px 0 0 ' : 'unset',
      }}
    >
      <div>
        <span style={{ border: '2px solid #4a90e2', marginRight: '8px' }} />
        {title}
      </div>
      {showStatus && (
        <div>
          <img
            src={img}
            alt="status"
            style={{
              position: 'relative',
              left: '10px',
              bottom: '10px',
            }}
          />
        </div>
      )}
    </div>
  );
};

export default SubTitle;
