/*
 * @Author: code4eat awesomedema@gmail.com
 * @Date: 2022-05-30 09:50:41
 * @LastEditors: code4eat awesomedema@gmail.com
 * @LastEditTime: 2022-07-14 17:04:40
 * @FilePath: /KC-MiddlePlatform/src/pages/index/components/RecentlyVisited/index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */




//消息记录模块

import { useEffect, useState } from 'react';
import './style.less';

import { Empty } from 'antd';


export type MsgRecordItemType = {
      title:string;
      date:string;
      resolveTime:string;
      isProcess:number;
      content:string;
}

export interface MsgRecordType {
      list:MsgRecordItemType[]
}

export const MsgRecord = (props:MsgRecordType) => {
    
    const {list:data} = props

    const [list, set_list] = useState<MsgRecordItemType[]>([]);

    useEffect(()=>{
        set_list(data);
    },[props])

    return (
        <div className='msgRecord'>
                <div className='topTitle'>
                    <span className='name'>消息记录</span>
                </div>
                <div className='wrap'>
                    {
                        list.map((val,index)=>(
                              <div className='list' key={index}>
                                    <div className='msgTitle' dangerouslySetInnerHTML={{__html:val.content}}></div>
                                    {/* <div className='msgTitle'>{`${val.title}审核${val.isProcess?'已通过':'未通过'}`}</div> */}
                                    <div className='msgDate'>
                                        <span>{val.resolveTime}</span>
                                        <span>{`审核${val.isProcess?'已通过':'未通过'}`}</span>
                                    </div>
                              </div>
                        ))
                    }
                    {
                        list.length == 0 && (
                            <div className='empty'>
                                <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
                            </div>
                        )
                    }
                </div>
        </div>
    )
}