import React, {Component} from 'react';
import { observer } from 'mobx-react';
import {WeaFormItem, WeaBrowser, WeaTools, WeaLocaleProvider} from 'ecCom';
import FieldList from './FieldList';
const {getIconBGC} = WeaTools;
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class DepartmentField extends Component{
    render(){
        return (
            <div className="tabPane tabPane-include setting_content">
                <div className="fieldList">
                    <FieldList ecId={`${this && this.props && this.props.ecId || ''}_FieldList@n0u5ce`} store={this.props.store}/>
                </div>
                <div className="preview">
                    <div className="preview_content">
                        <div className="title">{getLabel('221','预览') }</div>
                        <div className="item">
                            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@zx5dbv`}
                                label={getLabel('502149','单部门浏览框')}
                                labelCol={{span: 6}}
                                wrapperCol={{span: 18}}
                            >
                                <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@ljfv8l`}
                                    type={4}
                                    textDecoration={true}
                                    {...getIconBGC('hrm')}
                                    title={getLabel('502149','单部门浏览框')}
                                    hasAdvanceSerach={true}
                                    tabs={[{isSearch: false, key: "2", name: getLabel(25332, '组织结构'), selected: false, showOrder: 0}, {dataParams: {list: "1"}, isSearch: true, key: "1", name: getLabel(130619, '按列表'), selected: false, showOrder: 0}]}
                                />
                            </WeaFormItem>
                        </div>
                        <div className="item">
                            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@cslhbb`}
                                label={getLabel('502150','多部门浏览框')}
                                labelCol={{span: 6}}
                                wrapperCol={{span: 18}}
                            >
                                <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@68gca0`}
                                    type={57}
                                    textDecoration={true}
                                    isSingle={false}
                                    {...getIconBGC('hrm')}
                                    title={getLabel('502150','多部门浏览框')}
                                    tabs={[{isSearch: false, key: "2", name: getLabel(25332, '组织结构'), selected: false, showOrder: 0}, {dataParams: {list: "1"}, isSearch: true, key: "1", name: getLabel(130619, '按列表'), selected: false, showOrder: 0}]}
                                />
                            </WeaFormItem>
                        </div>
                        <div className="tips">{getLabel('502156','说明：保存后可点击上述浏览框查看预览效果。')}</div>
                    </div>
                </div>
            </div>
        )
    }
}