import { AppstoreOutlined, DownOutlined, TeamOutlined } from '@ant-design/icons';
import type { MenuProps } from 'antd';
import { Dropdown, Space } from 'antd';
import { useState } from 'react';
import { FormattedMessage, useHistory, useLocation } from 'umi';
import { vanManagerDomainMap } from '../utils/const';
export default () => {
  const subfix = document.documentElement.dataset.vanEnv || 'stg';
  // const host = document.documentElement.dataset.vanIdc || 'cn';
  const history = useHistory();
  const [open, setOpen] = useState(false);
  const location = useLocation();
  const currentPath = location.pathname;

  const items: MenuProps['items'] = [
    {
      key: '/administrator/apply',
      label: <FormattedMessage id="menu.administrator.applyAdmin" defaultMessage="应用管理员" />,
      icon: <AppstoreOutlined />,
      onClick: () => {
        window.open(`${vanManagerDomainMap[subfix]}/administrator/apply`, '_blank');
      },
    },
    {
      key: '/administrator/section',
      label: <FormattedMessage id="menu.administrator.sectionAdmin" defaultMessage="应用管理员" />,
      icon: <TeamOutlined />,
      onClick: () => {
        window.open(`${vanManagerDomainMap[subfix]}/administrator/section`, '_blank');
      },
    },
  ];

  return (
    <Dropdown
      menu={{ items, selectable: true, selectedKeys: [currentPath] }}
      onOpenChange={setOpen}
      open={open}
      overlayStyle={{ width: '140px' }}
    >
      <Space style={{ cursor: 'pointer' }}>
        <FormattedMessage id="menu.administrator" defaultMessage="我是管理员" />
        <DownOutlined
          style={{ transition: 'transform 0.1s', transform: open ? 'rotate(180deg)' : '' }}
        />
      </Space>
    </Dropdown>
  );
};