import React from 'react';
import { toJS } from 'mobx';
import loadjs from 'loadjs';
import { inject, observer } from 'mobx-react';
import { message, Row, Col, Button } from 'antd';
import { WeaSwitch, WeaLogView, WeaTableNew } from 'comsMobx';
import {
    WeaTools,
    WeaCollect,
    WeaBrowser,
    WeaFormItem,
    WeaErrorPage,
    WeaAlertPage,
    WeaRightMenu,
    WeaSearchGroup,
    WeaLocaleProvider,
} from 'ecCom';
const getKey = WeaTools.getKey;

import * as allStore from '../stores/index';
import { WeaDialog } from '../../pc4backstage/workflow/components/pathSet/nodeSet/signInput/SignSet';
import TransferComs from '../../pc4backstage/workflow/components/pathSet/nodeSet/signInput/TransferComs';
// import {UserPhraseEdit} from './UserPhraseEdit';

const getLabel = WeaLocaleProvider.getLabel;
const WeaTable = WeaTableNew.WeaTable;
// const _this_ = this;
@inject('weaworkflow_userdefault_store')
// @inject('weaworkflow_userphrase_store')
@observer
class UserDefaultSetting extends React.Component {
	constructor(props) {
        super(props);
        this.getBtns.bind(this);
        this.state = {
            hasLoad: false,
            store: null,
        };
    }

    componentDidMount() {
        const init = () => {
            const { weaworkflow_userdefault_store } = this.props;
            weaworkflow_userdefault_store.getConditionInfo();
            const { UserPhraseEditStore } = window.weaWorkflowPublic;
            const weaworkflow_userphrase_store = new UserPhraseEditStore();
            window.weaworkflow_userphrase_store = weaworkflow_userphrase_store;
            this.setState({ hasLoad: true, store: weaworkflow_userphrase_store });

            window.wf_userDefaultSetting_this_ = this;
        };
        loadjs.isDefined('workflowPublic') ? loadjs.ready('workflowPublic', init) : loadjs([
            '/spa/workflow/static4public/index.js',
            '/spa/workflow/static4public/index.css',
        ], 'workflowPublic', init);
	}

  varTemp = {
    btns: [],
    rowSelectionObj: {onChange: () => {}},
    formParams: {}
  }
    render() {
        const { hasLoad, store } = this.state;
        if (hasLoad) {
            const { weaworkflow_userdefault_store } = this.props;
            const { form, conditions, showColl, tableStore, setVisiableAdd, visiableAdd, weaworkflow_userphrase_store } = weaworkflow_userdefault_store;
            const { UserPhraseEdit } = window.weaWorkflowPublic;
            const formParamsTemp = form.getFormParams();
            for(var i in formParamsTemp) {
              this.varTemp.formParams[i] = formParamsTemp[i];
            }
            // 基础设置页面信息
            let conditionGroup = [];
            this.varTemp.btns = [],
            this.varTemp.btns = this.getBtns();
            if(this.rowSelection.onChange) {
              this.rowSelectionObj.onChange =  this.rowSelection().onChange
            }
            mobx.toJS(conditions).map((g, index) => {
                index == 1 &&
                    conditionGroup.push(
                        <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@wireqd@${index}`}
                          needTigger={true}
                          title={g.title}
                          showGroup={g.defaultshow}
                          customComponent={this.varTemp.btns}
                        >
                            <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@xvj5ax@${index}`} comsWeaTableStore={tableStore}
                              // needScroll={true}
                                rowSelection={{
                                    onChange: (selectedRowKeys) => {
                                        const { weaworkflow_userdefault_store } = this.props;
                                        const { updateSelectedRows } = weaworkflow_userdefault_store;
                                        updateSelectedRows(toJS(selectedRowKeys));
                                    }
                                }}
                            />
                        </WeaSearchGroup>,
                    );
            });
            let conditionGroup4DefSet = [];
            mobx.toJS(conditions).map((g, index) => {
                index == 0 && g && g.items.map((fields, index) => {

                    if(getKey(fields) == 'showSwitchBar') {

                    }else if(getKey(fields) == 'isOpenContinnuationProcess') {
                        const switchItem = g.items[index + 1];
                        conditionGroup4DefSet.push({
                            com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@1ubv5n@${index}`}
                              label={`${fields.label}`}
                              labelCol={{ span: 8 }}
                              wrapperCol={{ span: 16 }}
                              error={form.getError(fields)}
                              tipPosition="bottom"
                            >
                                <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@wvbgm1@${getKey(fields)}`} span={4}>
                                    <WeaSwitch 
                                        ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@8ezz2x@${index}`} 
                                        fieldConfig={fields} 
                                        form={form}
                                        formParams={ this.varTemp.formParams}
                                    />
                                </Col>
                                {this.varTemp.formParams.isOpenContinnuationProcess == '1' &&
                                    <div style={{width : '400px'}}>
                                        <Col style={{marginLeft : '25px'}} ecId={`${this && this.props && this.props.ecId || ''}_Col@2e9w29@${getKey(fields)}`} span={1}><WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@wccgro@${getKey(switchItem)}`} fieldConfig={switchItem} form={form} /></Col>
                                        <Col style={{paddingTop : '5px', marginLeft : '5px'}} ecId={`${this && this.props && this.props.ecId || ''}_Col@vyjm33@${getKey(switchItem)}`} span={16}><div>{switchItem.label}</div></Col>
                                    </div>
                                }
                            </WeaFormItem>),
                            colSpan: 1,
                        });
                    } else {
                        conditionGroup4DefSet.push({
                            com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@1ubv5n@${index}`}
                              label={`${fields.label}`}
                              labelCol={{ span: 8 }}
                              wrapperCol={{ span: 16 }}
                              error={form.getError(fields)}
                              tipPosition="bottom"
                            >
                                <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@rae50v@${index}`} fieldConfig={fields} form={form} formParams={ this.varTemp.formParams} onClick={v => this.getDialog(v)} />
                            </WeaFormItem>),
                            colSpan: 1,
                        });
                    }
                });
            });
            const _this = this;
            return (
                <div>
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@vbmy65`}
                      datas={weaworkflow_userdefault_store.getRightMenu()}
                    >
                        {/* {form.render({ center: true, needTigger: true })} */}
                        <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@c7j98i`} col={1} needTigger={true} center={true} title={getLabel(385267, '格式设置')} showGroup={true} items={conditionGroup4DefSet} />
                        {conditionGroup}
                        <UserPhraseEdit ecId={`${this && this.props && this.props.ecId || ''}_UserPhraseEdit@6q9x5r`} store={store}
                          visiable={visiableAdd}
                          setVisiable={(val) => {
                                setVisiableAdd(val);
                            }}
                          saveCallBack={() => {
                                weaworkflow_userdefault_store.getConditionInfo();
                                setVisiableAdd(false);
                            }}
                        />
                    </WeaRightMenu>
                    {/* 收藏 */}
                    <WeaCollect ecId={`${this && this.props && this.props.ecId || ''}_WeaCollect@w2kxi4`}
                      visible={showColl}
                      favouritetype={'2'}
                      objid={''}
                      importantlevel={1}
                      onClose={() => { weaworkflow_userdefault_store.closeColl(); }}
                    />
                </div>
            );
        }
            return <div>........</div>;
    }


    /**
     * 获取操作菜单
     */
    getBtns() {
        const { weaworkflow_userdefault_store } = this.props;
        const { selectedRows, setVisiableAdd } = weaworkflow_userdefault_store;
        const { store } = this.state;
        const _this = this;
        return (
            <span>
                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ht2r4e`}
                  style={{
                        border: 'none',
padding: '0px',
fontSize: '20px',
lineHeight: '1',
                        color: '#55a1f8',
marginLeft: '10px',
backgroundColor: '#fff',
                    }}
                  type="primary"
                  title={getLabel(611, '添加')}
                  size="small"
                  disabled={0}
                  onClick={() => {
                        store.onEdit();
                        setVisiableAdd(true);
                    }}
                >
                    <span className="icon-coms-Add-to-hot" />
                </Button>
                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@hqtken`}
                  style={{
                        border: 'none',
padding: '0px',
fontSize: '20px',
lineHeight: '1',
                        color: selectedRows.length <= 0 ? '#d8d8d8' : '#55a1f8',
marginLeft: '10px',
backgroundColor: '#fff',
                    }}
                  type="primary"
                  title={getLabel(91, '删除')}
                  size="small"
                  disabled={selectedRows.length <= 0}
                  onClick={() => { weaworkflow_userdefault_store.onDel(); }}
                >
                        <span className="icon-coms-form-delete-hot" />
                </Button>
         </span>
        );
    }

    rowSelection() {
        const { weaworkflow_userdefault_store } = this.props;
        const { updateSelectedRows } = weaworkflow_userdefault_store;
        return {
            onChange: (selectedRowKeys) => {
                updateSelectedRows(toJS(selectedRowKeys));
            },
        };
    }
}


export default WeaTools.tryCatch(React,
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@prtoo4`} msg={props.error ? props.error : '对不起，该页面异常，请联系管理员！'} />,
    { error: '' },
)(UserDefaultSetting);


window.userDefaultUtil = (() => ({
        onDel: (id) => {
            allStore.default.weaworkflow_userdefault_store.onDel(id);
        },
        onEdit: (id) => {
            wf_userDefaultSetting_this_.state.store.onEdit(id);
            wf_userDefaultSetting_this_.props.weaworkflow_userdefault_store.setVisiableAdd(true);
        },
        onHide: (id, groupid) => {
            allStore.default.weaworkflow_userdefault_store.changeDisplay({ id, groupid: groupid.split('+')[0], status: groupid.split('+')[1] });
        },
        onDisplay: (id, groupid) => {
            allStore.default.weaworkflow_userdefault_store.changeDisplay({ id, groupid: groupid.split('+')[0], status: groupid.split('+')[1] });
        },
    }))();