import React, {Component} from 'react';
import {observer} from 'mobx-react';
import {WeaDialog, WeaNewScroll} from 'ecCom';
import {Button} from 'antd';
import {i18n} from '../../public/i18n';
// import {Tabs, FormInfo} from 'weaHrmComsPublic';
import {Tabs, FormInfo} from '../../../hrmComsPublic/index';

@observer
export default class Edit extends Component{
    render(){
        // const {Tabs, FormInfo} = window.weaHrmComsPublic;
        const {
			store
        } = this.props;
        const {
            dialogParams,
            formTarget,
            itemRender,
            childrenComponents,
            save,
            custLabelCol,
            multiColumn,
            canAdd
        } = store;
        const {
            baseForm: form,
            baseFormFields: fields
        } = formTarget;
        const generateDialogParams = () =>{
            const props = {...dialogParams, hasScroll: true};
            let buttons = canAdd ? [<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@en9yz3`} type='primary' op='save' onClick={() => save()}>{i18n.label.save()}</Button>] : [];
            if(canAdd && dialogParams.opType === 'create'){
                buttons.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@f3u8h3`} type='primary' op='entry' onClick={() => save(true)}>{i18n.label.saveAndSetting()}</Button>)
            }
            Object.assign(props, {
                buttons,
                moreBtn: {datas: store.convertToMenus(buttons)}
            })
            return props;
        }
        
        const getContent = () => {
            if(dialogParams.opType === 'create'){
                return (
                    <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@pkca14`} height={'100%'}>
                        <FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@usxccp`} 
                            className='formComponent' 
                            center={false} 
                            custLabelCol={custLabelCol} 
                            form={form} 
                            formFields={fields} 
                            itemRender={itemRender}
                            childrenComponents={childrenComponents}/>
                    </WeaNewScroll>
                );
            }else{
                const tabConfig = store.toJS(store.editTabConfig);
                const tabProps = {
                    tabConfig: tabConfig,
                    tabChangeHandle: tabConfig.tabChangeHandle,
                    activeTabInfo: {
                        activeTabKey: tabConfig.activeTabKey,
                        activeTabIndex: store.getTabIndex(tabConfig.tabs, tabConfig.activeTabKey)
                    },
                    store: store
                }
                return (
                    <Tabs ecId={`${this && this.props && this.props.ecId || ''}_Tabs@f2on28`} {...tabProps}>
                        <div className='tabPane tabPane-dialog'>
                            <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@1gwr32`} height={'100%'}>
                                <FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@40saja`} 
                                    className='formComponent' 
                                    center={false} 
                                    custLabelCol={custLabelCol} 
                                    form={form} 
                                    formFields={fields} 
                                    itemRender={itemRender}
                                    childrenComponents={childrenComponents}/>
                            </WeaNewScroll>
                        </div>
                        <div className='tabPane tabPane-dialog'>
                            <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@of8x61`} height={'100%'}>
                                <FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@ie9si3`} 
                                        className='formComponent'
                                        center={false} 
                                        custLabelCol={custLabelCol} 
                                        form={formTarget.settingForm} 
                                        formFields={formTarget.settingFormFields} 
                                        itemRender={itemRender}
                                        multiColumn={multiColumn}
                                        childrenComponents={childrenComponents}/>
                            </WeaNewScroll>
                        </div>
                    </Tabs>
                );
            }
        }
        
        return (
            <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@q46azy`} {...generateDialogParams()}>
                {getContent()}
            </WeaDialog>
        )
    }
}