import React, {Component} from 'react'
import todoCss from './item.scss'
import getHighLightText from '../../../../utils/getHighLightText'

export default class TodoItem extends Component {

  //定义tab标签
  constructor(props) {
    super(props);
    this.state = {}

  }

  //转化毫秒为时间
  transTime = (time) => {
    let newTime = new Date(time).toLocaleDateString();
    return newTime.replace(/\//g, '-');
  }


  render() {
    const {noLine, lang, all} = this.props;
    const {
      createTime, id, orderOwnerEmployeeNo, orderOwnerHeadIcon, statusAction,
      systemAlias, systemId, systemName, targetTaskId, taskStatus, todoTaskAppUrl,
      viewUrl, xinViewUrl, titleInfo
    } = this.props.data;
    const {taskDescCn, taskDescEn, taskTitleCn, taskTitleEn} = titleInfo;
    return (

      <li className={all ? todoCss["all-sys-item"] : todoCss["sys-item"]}>
        <p className={todoCss["sys-name"]}>{getHighLightText(systemName)}</p>
        <p className={todoCss["event-name"]}>{getHighLightText(taskTitleCn)}</p>
        <div className={todoCss["todo-detail"]}>
          <span className={todoCss["sub-person"]}>{getHighLightText(taskDescCn)}</span>
        </div>
        <p className={todoCss["sub-date"]}>{this.transTime(createTime)}</p>
        {/*todo这里需要根据状态显示不同的内容*/}
        {statusAction === "已处理" ? <span className={todoCss['already-do']}>{statusAction}</span> :
          <a href={viewUrl} target="view_window"
             className={`${todoCss["sub-approval"]} s-bg-container`}>{statusAction}</a>}


        {noLine ? null : <i className={`${todoCss.bottom} s-b-default`}/>}

      </li>
    )


  }


}

