import {
	observer,
} from 'mobx-react';
import Card from "./card/index.js";
import Slide from "./slide/index.js";
import "../../style/body.less";

@observer
export default class Body extends React.Component {
	handleClick = (e) => {
		const {
			setTextToCard,
			setVisible,
			setType,
		} = this.props.store;

		//当前点击的节点为本节点(id为body的节点)：
		//1. 获取富文本的值，并显示在卡片上
		//2. 关闭侧边栏
		//3. 取消卡片元素选中状态
		//4. 重置侧边栏标识type
		if (e.target === e.currentTarget) {
			setTextToCard()
			setVisible(false);
			setType("");
		}
	}

	render() {
		const {
			store
		} = this.props, {
			is_head_bar_show
		} = store;

		return (
			<div className={`birth-editor-body${is_head_bar_show ? "" : " full"}`} id="body" onClick={this.handleClick} >
				<Card ecId={`${this && this.props && this.props.ecId || ''}_Card@g7p8ad`} store={store}/>
				<Slide ecId={`${this && this.props && this.props.ecId || ''}_Slide@8e3hkv`} store={store}/>
			</div>
		);
	}
}