import { LockOutlined, UserOutlined } from '@ant-design/icons';
import { message } from 'antd';
import React, { useState } from 'react';
import md5 from 'md5';
import ProForm, { ProFormText } from '@ant-design/pro-form';
import { useIntl, Link, history, FormattedMessage, useModel } from 'umi';
import Footer from '@/components/Footer';
import { login } from '@/services/user';
import styles from './index.less';

const Login = () => {
  const [submitting, setSubmitting] = useState(false);
  const { setInitialState } = useModel('@@initialState');
  const intl = useIntl();

  const handleSubmit = async (values) => {
    setSubmitting(true);
    try {
      // 登录
      const { user, menu,report_url,roleAlias } = await login({ ...values, password: md5(values.password) });

      await setInitialState((s) => ({ ...s, currentUser: user, menuAccess: menu,report_url:report_url,roleAlias:roleAlias }));
      message.success('登录成功！');
      /** 此方法会跳转到 redirect 参数所在的位置 */
      if (!history) return;
      const { query } = history.location;
      const { redirect } = query;
      history.push(redirect || '/');
      return;
    } catch (error) {
      console.error(error);
    }
    setSubmitting(false);
  };

  return (
    <div className={styles.container}>
      <div className={styles.leftback} />
      <div className={styles.rightSide} >
        <div>
          <div className={styles.content}>
            <div className={styles.top}>
              <div className={styles.header}>
                <Link to="/">
                  {/* <img alt="logo" className={styles.logo} src="/logo.svg" /> */}
                  <span className={styles.title}>复工复产申报系统</span>
                </Link>
              </div>
              <div className={styles.desc}> </div>
            </div>

            <div className={styles.main}>
              <ProForm
                isKeyPressSubmit
                initialValues={{
                  autoLogin: true,
                }}
                submitter={{
                  searchConfig: {
                    submitText: intl.formatMessage({
                      id: 'pages.login.submit',
                      defaultMessage: '登录',
                    }),
                  },
                  render: (_, dom) => dom.pop(),
                  submitButtonProps: {
                    loading: submitting,
                    size: 'large',
                    style: {
                      width: '100%',
                    },
                  },
                }}
                onFinish={async (values) => {
                  handleSubmit(values);
                }}
              >
                <ProFormText
                  name="userName"
                  fieldProps={{
                    size: 'large',
                    prefix: <UserOutlined className={styles.prefixIcon} />,
                  }}
                  placeholder="用户名"
                  rules={[
                    {
                      required: true,
                      message: (
                        <FormattedMessage
                          id="pages.login.username.required"
                          defaultMessage="请输入用户名!"
                        />
                      ),
                    },
                  ]}
                />
                <ProFormText.Password
                  name="password"
                  fieldProps={{
                    size: 'large',
                    prefix: <LockOutlined className={styles.prefixIcon} />,
                  }}
                  placeholder="密码"
                  rules={[
                    {
                      required: true,
                      message: (
                        <FormattedMessage
                          id="pages.login.password.required"
                          defaultMessage="请输入密码！"
                        />
                      ),
                    },
                  ]}

                />
              </ProForm>
            </div>
          </div>
          <Footer />
        </div>
      </div>
    </div>
  );
};

export default Login;
