import React from 'react';
import {inject, observer} from 'mobx-react';
import {toJS} from 'mobx';
import {WeaStepsMenus, WeaTab, WeaLeftRightLayout} from 'ecCom';
import NoRight from "../../public/NoRight";
import NonStand from "../../public/NonStand";

const store = ['inteNCStore'];
@inject(...store)
@observer
export default class K3 extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    this.props.inteNCStore.getMenuList({groupid: 4})
  }

  render() {
    const {inteNCStore} = this.props;
    let {menuList, routeUrl, mainTitle, hasRight, rightLoading, nonStandLoading, hasNonStandard} = inteNCStore;
    menuList = toJS(menuList);

    return (nonStandLoading
      ? null
      : hasNonStandard
        ? rightLoading 
          ? null
          : hasRight 
            ? <div className='wea-inte-NC' style={{height: '100%'}}>
                <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@sprn0x`} datas={[{title: `${mainTitle}`, viewcondition: '1'}]} keyParam="viewcondition" selectedKey={'1'}/>
                <div style={{height: 'calc(100% - 47px)'}}>
                  <WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@5doshx`}
                    isNew={true}
                    showBtn={false}
                    leftWidth={174}
                    leftCom={
                      <div className='wea-inte-NC-left'>
                        {menuList && menuList.length > 0 &&
                        <WeaStepsMenus ecId={`${this && this.props && this.props.ecId || ''}_WeaStepsMenus@yl72db`}
                          datas={menuList}
                          current={21}
                          onChange={v => {
                            inteNCStore.changeUrl(v.routeUrl+"?from=productEntrance&typename=4");
                          }}
                        />}
                      </div>
                    }
                  >
                    <iframe src={routeUrl} width="100%" height="100%" scrolling="yes" frameBorder="0" align="top"></iframe>
                  </WeaLeftRightLayout>
                </div>
              </div> 
            : <NoRight ecId={`${this && this.props && this.props.ecId || ''}_NoRight@leify0`} />
        : <NonStand ecId={`${this && this.props && this.props.ecId || ''}_NonStand@mqvbrd`} />
    )
  }
}

