import React from 'react';
import { Tabs, message } from 'antd';
import {
  MobileOutlined,
  ConsoleSqlOutlined,
  CodeOutlined,
  IdcardOutlined,
} from '@ant-design/icons';
import Zan from 'editorComponents/Zan';
import styles from './index.less';

const { TabPane } = Tabs;

const Home = (props) => {
  const handleGo = (type: string) => {
    if (type === 'H5') {
      props.history.push('/editorWap/2960');
    } else if (type === 'PC') {
      props.history.push('/editorPc/2960');
    } else if (type === 'miniApp') {
      props.history.push('/editorWap/2960?mode=miniApp');
    } else {
      props.history.push('/ide');
    }
  };
  return (
    <div className={styles.homeWrap}>
      {/* <div className={styles.leftArea}>
        <Tabs defaultActiveKey="1">
          <TabPane
            tab={
              <span>
                <MobileOutlined />
                我的H5
              </span>
            }
            key="1"
          >
            正在开发...
          </TabPane>
          <TabPane
            tab={
              <span>
                <ConsoleSqlOutlined />
                我的大屏
              </span>
            }
            key="2"
          >
            正在开发...
          </TabPane>
          <TabPane
            tab={
              <span>
                <IdcardOutlined />
                我的可视化
              </span>
            }
            key="3"
          >
            正在开发...
          </TabPane>
        </Tabs>
      </div> */}
      <div className={styles.contentArea}>
        <div className={styles.logoTip}>
          <div className={styles.logo}>
            丽维家编辑器
          </div>
        </div>
        <div className={styles.operation}>
          <div className={styles.card} onClick={() => handleGo('PC')}>
            <MobileOutlined />
            <div>制作pc页面</div>
          </div>
          <div className={styles.card} onClick={() => handleGo('H5')}>
            <MobileOutlined />
            <div>制作wap页面</div>
          </div>
          <div className={styles.card} onClick={() => handleGo('miniApp')}>
            <MobileOutlined />
            <div>制作小程序页面</div>
          </div>
          {/* <div className={styles.card} onClick={() => handleGo('online')}>
            <CodeOutlined />
            <div>在线编程</div>
          </div>
          <div className={styles.card} onClick={() => handleGo('PC')}>
            <ConsoleSqlOutlined />
            <div>制作可视化大屏</div>
          </div>
        */}
        </div>
      </div>
    </div>
  );
};

export default Home;