import styles from "./index.module.less";
import store from "@/store";
import logo from "@/assets/logo.png";
import { proxyApi } from "@/apis";
import { definePageConfig, history } from "ice";
import { Button, Result, Typography, message } from "antd";
import { FormilyForm } from "@/components/Formily";
import { FormSchema, FormScope } from "./config";
import { useMemo, useRef } from "react";
import { Form } from "@formily/core";
import { useDebounceFn } from "ahooks";
import { generateFormData } from "@/utils/behavior";
import { DesignerStatus } from "@/data/status";
import { convertSettleInFormData } from "@/data/convertdata";

const SettleIn: React.FC = () => {
  const [userState, userDispatcher] = store.useModel("user");
  const currentUser = userState.currentUser;
  const formRef = useRef<Form>();

  const { run: submit } = useDebounceFn(() => {
    generateFormData(formRef, (values) => {
      const convertValues = convertSettleInFormData(values);
      proxyApi.designer.settleIn(convertValues).then((data) => {
        if (data) {
          message.success("信息提交成功,等待审核中,审核成功后会有邮箱通知！");
          userDispatcher.updateUserStatus(data);
        }
      });
    });
  });

  const renderContent = useMemo(() => {
    if (currentUser.status == null) {
      return (
        <>
          <Typography.Title level={4}>
            欢迎您加入春天小猪设计者
          </Typography.Title>
          <FormilyForm
            schema={FormSchema}
            schemaProps={{
              scope: FormScope,
            }}
            className={styles.settleInForm}
            formRef={formRef}
            formInitProps={{
              initialValues: {
                email: currentUser.email,
              },
            }}
          />
          <Button onClick={submit} type="primary">
            确认入驻春天小猪设计者
          </Button>
        </>
      );
    }
    return (
      <Result
        status={currentUser.status == 1 ? "success" : "warning"}
        title={DesignerStatus[currentUser.status]}
        subTitle={
          currentUser.status == 2 ||
          currentUser.status == 3 ||
          currentUser.status == 4
            ? currentUser.reason
            : currentUser.status == 0
            ? "当前正在审核中,请耐心等待"
            : "您已成为春天小猪设计者中的一员啦，去提交自己的第一个作品吧"
        }
        extra={
          currentUser.status == 1 ? (
            <Button
              type="primary"
              onClick={() => {
                history?.replace("/designdraft/add");
              }}
            >
              去提交作品
            </Button>
          ) : null
        }
      ></Result>
    );
  }, [currentUser]);

  return <div className={styles.container}>{renderContent}</div>;
};

export const pageConfig = definePageConfig(() => {
  return {
    title: "春天小猪设计者入驻",
  };
});

export default SettleIn;