import { UserOutlined } from "@ant-design/icons";
import { Avatar } from "antd";
import { useModel } from "umi";

export default function Header() {
  const { workflow, saveInfo, mode } = useModel("flowModel");

  return (
    <div className="flex justify-between items-center px-24px leading-[60px]">
      <div className="left w-200px text-#666">
        <span className="inline-block mr-4px w-2px h-14px bg-#1dd328"></span>
        {workflow?.model.name}-{workflow?.model.code}
      </div>
      <div className="middle text-24px flex items-center">流程设计器<span className="text-16px text-gray-500">{mode === 'edit' ? '[开发设计]' : '[运维配置]'}</span></div>
      <div className="right w-200px text-right">
        <span className="text-10px text-#999 mr-12px">{saveInfo}</span>
        {/* <Avatar size={32} icon={<UserOutlined />} /> */}
      </div>
    </div>
  );
}
