import React,{ useState,useEffect,useRef } from 'react';

import {situationList} from "@/api/situation.js";
// // import {getOutpatientList} from "@/api/checkCondition.js";
// import { Button,Form,Input,Select} from 'antd';

import ModalWrap from '@/components/Modal/modal.js';
import './situationList.less';

import checkStatusIcon from '../../../../assets/images/checkStatusIcon.jpg';
import nextCheckTime from '../../../../assets/images/nextCheckTime.jpg';
import situationCase from '../../../../assets/images/situation-case.jpg';
import situationSystem from '../../../../assets/images/situation-system.jpg';


const SituationList = (props)=>{

    const [situationArr,set_situationArr] = useState([]);

    const getSituationList = async ()=>{
        let data = await situationList();
        
        set_situationArr(data.data.data);
        console.log({data});
    }

    const addSituationhandle = ()=>{
        const {updateSituationCreateModState} = props;
        if(updateSituationCreateModState){
            updateSituationCreateModState({key:'isAdd',value:true});
        }
    }

    useEffect(()=>{
        getSituationList();
    },[]);

    return (
        <div className="situationListMod">
               <h1>情境列表</h1>
               <div className="listWrap">
                   <div className="hoverAddBtn" onClick={addSituationhandle}>+</div>
                   {
                        situationArr.map((item,index)=>{
                              return (
                                    <div key={index} className="situation">
                                             <img className="topic" src={item.topic?situationCase:situationSystem}  />
                                             <h3>{item.name}</h3>
                                             <h4>{item.checkGroupName}</h4>
                                             <div className="checkStatus"><img src={checkStatusIcon} />{item.checkStatus}</div>
                                             <div className="nextCheckTime"><img src={nextCheckTime} />{item.nextCheckTime}</div>
                                    </div>
                              )
                        })
                   }
               </div>
        </div>
    )
}


export default SituationList;


