import React from 'react';
import styles from './index.css';
import EditTpl from "../edit/index";
import Title from "../Title/index.jsx";
import BgTextList from "../BgTextList/index.jsx";

class TitleBgTextList extends React.Component {
    state = {
        config: {
            data: {
                title: "",
                list: []
            }
        }
    }
    componentWillReceiveProps(props) {
        const {data} = props;
        this.upData(data);
    }
    upData = data => {
        this.setState({config: data});
    }
    render() {
        const {
            config,
            config: {
                mName = "",
                data: {
                    title = "",
                    list = [],
                }
            }
        } = this.state;
        const {children,...othprops} = this.props;
        return (
            <div {...othprops} className={`${styles.Box} ${this.props.className}`}>
                <EditTpl data={config} mName={mName} upData={config => this.upData(config)}></EditTpl>
                <Title>{title}</Title>
                <BgTextList className={styles.List} data={list}></BgTextList>
            </div>
        )
    }
}
export {TitleBgTextList}
export default TitleBgTextList;