import Timer from '../Timer';
import React, { useEffect, useState } from 'react';
import { connect } from 'umi';
import styles from './index.less';
import { Dropdown, MenuProps, Space } from 'antd';
interface IProps {
  // model: any;
  // menuId: string | number;
  // type: FLOW_TYPE;
}
const TitleBar = () => {
  const [pageName, setPageName] = useState('');

  const items: MenuProps['items'] = [
    {
      label: '问题反馈',
      key: '0',
    },
    {
      label: '修改密码',
      key: '1',
    },
    {
      label: '退出登录',
      key: '2',
    },
  ];
  return (
    <div className={styles.TitleBar}>
      <div style={{ display: 'flex', height: '68px' }}>
        <img
          style={{ flex: '1' }}
          src={require('@/Project/assets/titleBar/bar.png')}
        />
        <img
          style={{ width: '960px' }}
          src={require('@/Project/assets/titleBar/title.png')}
        />
        <img
          style={{ flex: '1' }}
          src={require('@/Project/assets/titleBar/bar.png')}
        />
      </div>
      {/* <img
        style={{ width: '100%' }}
        src={require('@/Project/assets/background/titleBar.png')}
      /> */}
      <div className={styles.TextMain}>
        <span className={styles.pageTitle}>智能水厂双胞胎管理平台</span>
        <span className={styles.title}>
          {'projectDetail.WaterName' || '智能水厂双胞胎管理平台'}
        </span>
        <div className={styles.textRight}>
          <div>{pageName}</div>
          <div className={styles.line} />
          <Timer />
          <div className={styles.line} />
          <Dropdown menu={{ items }}>
            <Space>
              <div>{'currentUser?.CName' || '-'}</div>
              <img src={require('@/Project/assets/titleBar/titleIcon.png')} />
            </Space>
          </Dropdown>
        </div>
      </div>
    </div>
  );
};
export default TitleBar;
// export default connect(
//   ({ model, loading }: { model: any }) => ({
//     model,
//   }),
// )(TitleBar);
