import React from 'react'
import { PageHeader, Card } from 'antd';
import Floor from "./Floor";
import Room from "./Room";
import Unit from './Unit';


export default function(props) {
  const blockList = props.dataset || []
  
  // 仅仅是一个函数, 不是函数式组件
  function renderRoom(room) {
    return (<Room dataset={room} hotType={props.hotType} />)
  }

  // 仅仅是一个函数, 不是函数式组件
  function renderFloor(floor) {
    return (<Floor key={floor.floorId} dataset={floor} render={renderRoom} />)
  }

  return (
    <div>
      {
        blockList.map((block) => (
          <div key={block.blockId} style={{marginTop: '20px', overflowX: 'auto'}}>
            <PageHeader title={`${block.termName} ${block.blockName}`} backIcon={false} />
            <div style={{ display: 'flex', padding: '10px' }}>
            {
              (block.unitList || []).map((unit) => (<div key={unit.unitId} style={{ flex: 'auto', marginRight: '30px' }} ><Unit dataset={unit} render={renderFloor} /></div>))
            }
            </div>
          </div>
        ))
      }
    </div>
  )
}
