@yoka-ui/ui 1.0.5 → 1.0.7

package/dist/es/business/YkLoginModule/SmsLoginForm.js

@@ -0,0 +1,178 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/business/YkLoginModule/SmsLoginForm.tsx
+import { LockOutlined, MobileOutlined } from "@ant-design/icons";
+import { ProFormText } from "@ant-design/pro-form";
+import { Button, message } from "antd";
+import React, { useEffect, useState } from "react";
+import styles from "./styles.module.less";
+var SmsLogin = ({ inputClassName, api, appKey }) => {
+  useEffect(() => {
+    const link = document.createElement("link");
+    link.href = "https://captchaoss.sanguosha.com/library/captcha/0.0.5/lib/index.css";
+    link.rel = "stylesheet";
+    document.head.appendChild(link);
+    const script = document.createElement("script");
+    script.src = "https://captchaoss.sanguosha.com/library/captcha/0.0.5/lib/index.js";
+    document.body.appendChild(script);
+    return () => {
+      document.head.removeChild(link);
+      document.body.removeChild(script);
+    };
+  }, []);
+  const [phone, setPhone] = useState("");
+  const [countdown, setCountdown] = useState(0);
+  const [sendStatus, setSendStatus] = useState(false);
+  const disableBtn = countdown > 0 || phone.length !== 11;
+  const sendVerificationCode = () => __async(void 0, null, function* () {
+    try {
+      const phoneNumber = phone;
+      if (!phoneNumber) {
+        message.error("请输入手机号");
+        return;
+      }
+      if (!/^1\d{10}$/.test(phoneNumber)) {
+        message.error("请输入正确的手机号格式");
+        return;
+      }
+      if (!appKey) {
+        message.error("验证码配置缺失，请联系管理员（appKey）");
+        return;
+      }
+      window.sliderVerify(
+        "pop",
+        (captchaRes) => {
+          void api.sendSms(__spreadValues({ phone: phoneNumber }, captchaRes)).then((sendRes) => {
+            if (sendRes.code !== 200) {
+              message.error(sendRes.msg);
+              return;
+            }
+            setSendStatus(true);
+            message.success("验证码发送成功");
+            setCountdown(60);
+            const timer = setInterval(() => {
+              setCountdown((prevCountdown) => {
+                if (prevCountdown <= 1) {
+                  clearInterval(timer);
+                  return 0;
+                }
+                return prevCountdown - 1;
+              });
+            }, 1e3);
+          }).catch(() => {
+            message.error("验证码发送失败，请稍后再试");
+            return;
+          });
+        },
+        {
+          appKey
+        }
+      );
+    } catch (e) {
+      message.error("发送验证码失败，请稍后再试");
+    }
+  });
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    ProFormText,
+    {
+      className: inputClassName,
+      name: "phone",
+      fieldProps: {
+        size: "large",
+        prefix: /* @__PURE__ */ React.createElement(MobileOutlined, null),
+        onChange: (e) => {
+          setPhone(e.target.value);
+        }
+      },
+      placeholder: "请输入手机号",
+      validateTrigger: "onBlur",
+      rules: [
+        {
+          required: true,
+          validator(rule, value, _callback) {
+            if (!value) {
+              return Promise.reject("手机号是必填项!");
+            }
+            if (!/^1\d{10}$/.test(value)) {
+              return Promise.reject("请输入正确的手机号格式");
+            }
+            return Promise.resolve();
+          }
+        }
+      ]
+    }
+  ), /* @__PURE__ */ React.createElement(
+    ProFormText,
+    {
+      className: inputClassName,
+      name: "code",
+      disabled: !sendStatus,
+      fieldProps: {
+        size: "large",
+        prefix: /* @__PURE__ */ React.createElement(LockOutlined, null),
+        suffix: /* @__PURE__ */ React.createElement(
+          Button,
+          {
+            className: styles.captchaBtn,
+            style: { fontSize: 16 },
+            onClick: (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              countdown === 0 && void sendVerificationCode();
+            },
+            type: "link",
+            disabled: disableBtn
+          },
+          countdown > 0 ? `${countdown}秒后重新获取` : "获取验证码"
+        )
+      },
+      placeholder: "请输入验证码",
+      rules: [
+        {
+          required: true,
+          message: "验证码是必填项!"
+        }
+      ]
+    }
+  ));
+};
+var SmsLoginForm_default = SmsLogin;
+export {
+  SmsLoginForm_default as default
+};
+//# sourceMappingURL=SmsLoginForm.js.map

package/dist/es/business/YkLoginModule/SmsLoginForm.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/business/YkLoginModule/SmsLoginForm.tsx"],
+  "sourcesContent": ["import { LockOutlined, MobileOutlined } from '@ant-design/icons';\nimport { ProFormText } from '@ant-design/pro-form';\nimport { Button, message } from 'antd';\nimport React, { useEffect, useState } from 'react';\nimport styles from './styles.module.less';\n\nexport type SmsLoginFormApi = {\n  sendSms: (payload: Record<string, unknown>) => Promise<{ code: number; msg: string }>;\n};\n\ndeclare global {\n  interface Window {\n    sliderVerify: (\n      element: 'pop' | HTMLElement,\n      success: (res: { token: string; captchaVerification: string }) => void,\n      options: { appKey: string; locale?: string },\n    ) => void;\n  }\n}\n\nexport type SmsLoginFormProps = {\n  inputClassName: string;\n  api: SmsLoginFormApi;\n  appKey: string;\n};\n\nconst SmsLogin: React.FC<SmsLoginFormProps> = ({ inputClassName, api, appKey }) => {\n  useEffect(() => {\n    const link = document.createElement('link');\n    link.href = 'https://captchaoss.sanguosha.com/library/captcha/0.0.5/lib/index.css';\n    link.rel = 'stylesheet';\n    document.head.appendChild(link);\n\n    const script = document.createElement('script');\n    script.src = 'https://captchaoss.sanguosha.com/library/captcha/0.0.5/lib/index.js';\n    document.body.appendChild(script);\n    return () => {\n      document.head.removeChild(link);\n      document.body.removeChild(script);\n    };\n  }, []);\n\n  const [phone, setPhone] = useState<string>('');\n  const [countdown, setCountdown] = useState<number>(0);\n  const [sendStatus, setSendStatus] = useState<boolean>(false);\n  const disableBtn = countdown > 0 || phone.length !== 11;\n\n  const sendVerificationCode = async () => {\n    try {\n      const phoneNumber = phone;\n      if (!phoneNumber) {\n        message.error('请输入手机号');\n        return;\n      }\n\n      if (!/^1\\d{10}$/.test(phoneNumber)) {\n        message.error('请输入正确的手机号格式');\n        return;\n      }\n      if (!appKey) {\n        message.error('验证码配置缺失，请联系管理员（appKey）');\n        return;\n      }\n      window.sliderVerify(\n        'pop',\n        (captchaRes: Record<string, unknown>) => {\n          void api\n            .sendSms({ phone: phoneNumber, ...captchaRes })\n            .then((sendRes) => {\n              if (sendRes.code !== 200) {\n                message.error(sendRes.msg);\n                return;\n              }\n              setSendStatus(true);\n              message.success('验证码发送成功');\n              setCountdown(60);\n              const timer = setInterval(() => {\n                setCountdown((prevCountdown) => {\n                  if (prevCountdown <= 1) {\n                    clearInterval(timer);\n                    return 0;\n                  }\n                  return prevCountdown - 1;\n                });\n              }, 1000);\n            })\n            .catch(() => {\n              message.error('验证码发送失败，请稍后再试');\n              return;\n            });\n        },\n        {\n          appKey,\n        },\n      );\n    } catch {\n      message.error('发送验证码失败，请稍后再试');\n    }\n  };\n\n  return (\n    <>\n      <ProFormText\n        className={inputClassName}\n        name='phone'\n        fieldProps={{\n          size: 'large',\n          prefix: <MobileOutlined />,\n          onChange: (e) => {\n            setPhone(e.target.value);\n          },\n        }}\n        placeholder='请输入手机号'\n        validateTrigger='onBlur'\n        rules={[\n          {\n            required: true,\n            validator(rule, value, _callback) {\n              if (!value) {\n                return Promise.reject('手机号是必填项!');\n              }\n              if (!/^1\\d{10}$/.test(value)) {\n                return Promise.reject('请输入正确的手机号格式');\n              }\n              return Promise.resolve();\n            },\n          },\n        ]}\n      />\n      <ProFormText\n        className={inputClassName}\n        name='code'\n        disabled={!sendStatus}\n        fieldProps={{\n          size: 'large',\n          prefix: <LockOutlined />,\n          suffix: (\n            <Button\n              className={styles.captchaBtn}\n              style={{ fontSize: 16 }}\n              onClick={(e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                countdown === 0 && void sendVerificationCode();\n              }}\n              type='link'\n              disabled={disableBtn}\n            >\n              {countdown > 0 ? `${countdown}秒后重新获取` : '获取验证码'}\n            </Button>\n          ),\n        }}\n        placeholder='请输入验证码'\n        rules={[\n          {\n            required: true,\n            message: '验证码是必填项!',\n          },\n        ]}\n      />\n    </>\n  );\n};\n\nexport default SmsLogin;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/es/business/YkLoginModule/index.d.ts

@@ -0,0 +1,48 @@
+import React from 'react';
+import { type SmsLoginFormApi } from './SmsLoginForm';
+export type LoginType = 'qrcode' | 'sms';
+export type LoginTabItem = {
+    key: LoginType;
+    label: React.ReactNode;
+};
+export type QrcodeApi = {
+    getQrcode: () => Promise<{
+        qrcode: string;
+        url: string;
+    }>;
+    scanLogin: (qrcode: string) => Promise<{
+        code: number;
+        data?: {
+            status?: number;
+            msg?: string;
+        };
+    }>;
+};
+export type LoginModuleProps = {
+    title: React.ReactNode;
+    tabs: LoginTabItem[];
+    defaultLoginType: LoginType;
+    containerStyle?: React.CSSProperties;
+    actions?: React.ReactNode | ((loginType: LoginType) => React.ReactNode);
+    className?: string;
+    formClassName?: string;
+    tabsClassName?: string;
+    inputClassName?: string;
+    qrcodeClassName?: string;
+    qrcodeBoxClassName?: string;
+    onFinish: (values: Record<string, unknown>) => Promise<void>;
+    qrcode?: {
+        api: QrcodeApi;
+        icon: string;
+        iconSize?: number;
+        size?: number;
+        wrapStyle?: React.CSSProperties;
+        onSuccess: () => void | Promise<void>;
+    };
+    sms?: {
+        api: SmsLoginFormApi;
+        appKey: string;
+    };
+};
+declare const LoginModule: React.FC<LoginModuleProps>;
+export default LoginModule;

package/dist/es/business/YkLoginModule/index.js

@@ -0,0 +1,198 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/business/YkLoginModule/index.tsx
+import { LoginForm } from "@ant-design/pro-form";
+import { Flex, message, QRCode, Tabs } from "antd";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import SmsLoginForm from "./SmsLoginForm";
+import styles from "./styles.module.less";
+var DEFAULT_QRCODE_WRAP_STYLE = {
+  padding: 10,
+  display: "flex",
+  justifyContent: "center"
+};
+var LoginModule = (props) => {
+  var _a, _b, _c;
+  const {
+    title,
+    tabs,
+    defaultLoginType,
+    containerStyle,
+    actions,
+    onFinish,
+    qrcode,
+    className = styles.root,
+    formClassName = styles.form,
+    tabsClassName = styles.tabs,
+    inputClassName,
+    qrcodeClassName = styles.qrcode,
+    qrcodeBoxClassName = styles.qrcodeBox,
+    sms
+  } = props;
+  const [loginType, setLoginType] = useState(defaultLoginType);
+  const [qrcodeStatus, setQrcodeStatus] = useState("active");
+  const [qrcodeUrl, setQrcodeUrl] = useState("-");
+  const [qrcodeValue, setQrcodeValue] = useState("");
+  const pollIntervalRef = useRef(null);
+  const pollTimeoutRef = useRef(null);
+  const shouldShowSubmitter = loginType !== "qrcode";
+  const resolvedActions = useMemo(() => {
+    if (!actions)
+      return void 0;
+    return typeof actions === "function" ? actions(loginType) : actions;
+  }, [actions, loginType]);
+  const safeClearTimers = useCallback(() => {
+    if (pollIntervalRef.current)
+      clearInterval(pollIntervalRef.current);
+    if (pollTimeoutRef.current)
+      clearTimeout(pollTimeoutRef.current);
+    pollIntervalRef.current = null;
+    pollTimeoutRef.current = null;
+  }, []);
+  const handleQrcodeRefresh = useCallback(() => __async(void 0, null, function* () {
+    if (!qrcode)
+      return;
+    setQrcodeStatus("loading");
+    try {
+      const res = yield qrcode.api.getQrcode();
+      setQrcodeUrl(res.url);
+      setQrcodeValue(res.qrcode);
+      setQrcodeStatus("active");
+    } catch (e) {
+      setQrcodeStatus("expired");
+      message.error("获取二维码失败，请稍后重试");
+    }
+  }), [qrcode]);
+  const enabledTabKeys = useMemo(() => new Set(tabs.map((t) => t.key)), [tabs]);
+  useEffect(() => {
+    var _a2;
+    if (enabledTabKeys.has(defaultLoginType)) {
+      setLoginType(defaultLoginType);
+      return;
+    }
+    const fallback = (_a2 = tabs[0]) == null ? void 0 : _a2.key;
+    if (fallback)
+      setLoginType(fallback);
+  }, [defaultLoginType, enabledTabKeys, tabs]);
+  useEffect(() => {
+    var _a2;
+    if (enabledTabKeys.has(loginType))
+      return;
+    const fallback = (_a2 = tabs[0]) == null ? void 0 : _a2.key;
+    if (fallback)
+      setLoginType(fallback);
+  }, [enabledTabKeys, loginType, tabs]);
+  useEffect(() => {
+    safeClearTimers();
+    if (loginType !== "qrcode") {
+      setQrcodeStatus("expired");
+      return;
+    }
+    if (!qrcode) {
+      setQrcodeStatus("expired");
+      return;
+    }
+    void handleQrcodeRefresh();
+    return safeClearTimers;
+  }, [handleQrcodeRefresh, loginType, qrcode, safeClearTimers]);
+  useEffect(() => {
+    safeClearTimers();
+    if (!qrcode)
+      return;
+    if (loginType !== "qrcode")
+      return;
+    if (qrcodeStatus !== "active")
+      return;
+    if (!qrcodeValue)
+      return;
+    pollIntervalRef.current = setInterval(() => {
+      void qrcode.api.scanLogin(qrcodeValue).then((res) => {
+        var _a2, _b2, _c2;
+        if (res.code !== 200)
+          return;
+        const status = (_a2 = res.data) == null ? void 0 : _a2.status;
+        const msg = (_c2 = (_b2 = res.data) == null ? void 0 : _b2.msg) != null ? _c2 : "扫码遇到问题，稍后重试";
+        if (status === -1)
+          return;
+        if (status !== 1) {
+          safeClearTimers();
+          setQrcodeStatus("expired");
+          message.error(msg, 3);
+          return;
+        }
+        safeClearTimers();
+        void qrcode.onSuccess();
+      }).catch(() => {
+      });
+    }, 1e3);
+    pollTimeoutRef.current = setTimeout(() => {
+      setQrcodeStatus("expired");
+      safeClearTimers();
+    }, 3e4);
+    return safeClearTimers;
+  }, [loginType, qrcode, qrcodeStatus, qrcodeValue, safeClearTimers]);
+  const tabItems = useMemo(() => tabs.map((t) => ({ key: t.key, label: t.label })), [tabs]);
+  return /* @__PURE__ */ React.createElement("div", { className, style: { maxWidth: "500px" } }, /* @__PURE__ */ React.createElement(
+    LoginForm,
+    {
+      className: formClassName,
+      onFinish: (values) => __async(void 0, null, function* () {
+        yield onFinish(values);
+      }),
+      title: typeof title === "string" ? /* @__PURE__ */ React.createElement("div", { className: styles.title }, title) : title,
+      containerStyle,
+      submitter: shouldShowSubmitter ? void 0 : false,
+      actions: resolvedActions
+    },
+    /* @__PURE__ */ React.createElement(
+      Tabs,
+      {
+        className: tabsClassName,
+        centered: true,
+        activeKey: loginType,
+        onChange: (activeKey) => {
+          const next = activeKey;
+          setLoginType(next);
+        },
+        items: tabItems
+      }
+    ),
+    enabledTabKeys.has("qrcode") && loginType === "qrcode" && qrcode && /* @__PURE__ */ React.createElement("div", { style: (_a = qrcode.wrapStyle) != null ? _a : DEFAULT_QRCODE_WRAP_STYLE }, /* @__PURE__ */ React.createElement("div", { className: qrcodeBoxClassName }, /* @__PURE__ */ React.createElement(Flex, { justify: "center", align: "center" }, /* @__PURE__ */ React.createElement("i", { className: "iconfont icon-saoyisao", style: { color: "#999999", marginRight: 10, fontSize: 14 } }), "请使用", /* @__PURE__ */ React.createElement("span", { style: { color: "#0A6BFD" } }, "小闪扫码"), "登录"), /* @__PURE__ */ React.createElement(
+      QRCode,
+      {
+        icon: qrcode.icon,
+        iconSize: (_b = qrcode.iconSize) != null ? _b : 50,
+        className: qrcodeClassName,
+        size: (_c = qrcode.size) != null ? _c : 240,
+        value: qrcodeUrl,
+        status: qrcodeStatus,
+        onRefresh: handleQrcodeRefresh
+      }
+    ))),
+    enabledTabKeys.has("sms") && loginType === "sms" && sms && /* @__PURE__ */ React.createElement(SmsLoginForm, { inputClassName: inputClassName != null ? inputClassName : "", api: sms.api, appKey: sms.appKey })
+  ));
+};
+var YkLoginModule_default = LoginModule;
+export {
+  YkLoginModule_default as default
+};
+//# sourceMappingURL=index.js.map

package/dist/es/business/YkLoginModule/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/business/YkLoginModule/index.tsx"],
+  "sourcesContent": ["import { LoginForm } from '@ant-design/pro-form';\nimport { Flex, message, QRCode, Tabs } from 'antd';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport SmsLoginForm, { type SmsLoginFormApi } from './SmsLoginForm';\nimport styles from './styles.module.less';\n\nexport type LoginType = 'qrcode' | 'sms';\n\nexport type LoginTabItem = {\n  key: LoginType;\n  label: React.ReactNode;\n};\n\nexport type QrcodeApi = {\n  getQrcode: () => Promise<{ qrcode: string; url: string }>;\n  scanLogin: (qrcode: string) => Promise<{\n    code: number;\n    data?: {\n      status?: number;\n      msg?: string;\n    };\n  }>;\n};\n\nexport type LoginModuleProps = {\n  title: React.ReactNode;\n  tabs: LoginTabItem[];\n  defaultLoginType: LoginType;\n  containerStyle?: React.CSSProperties;\n  actions?: React.ReactNode | ((loginType: LoginType) => React.ReactNode);\n  className?: string;\n  formClassName?: string;\n  tabsClassName?: string;\n  inputClassName?: string;\n  qrcodeClassName?: string;\n  qrcodeBoxClassName?: string;\n\n  onFinish: (values: Record<string, unknown>) => Promise<void>;\n\n  qrcode?: {\n    api: QrcodeApi;\n    icon: string;\n    iconSize?: number;\n    size?: number;\n    wrapStyle?: React.CSSProperties;\n    onSuccess: () => void | Promise<void>;\n  };\n\n  sms?: {\n    api: SmsLoginFormApi;\n    appKey: string;\n  };\n};\n\nconst DEFAULT_QRCODE_WRAP_STYLE: React.CSSProperties = {\n  padding: 10,\n  display: 'flex',\n  justifyContent: 'center',\n};\n\nconst LoginModule: React.FC<LoginModuleProps> = (props) => {\n  const {\n    title,\n    tabs,\n    defaultLoginType,\n    containerStyle,\n    actions,\n    onFinish,\n    qrcode,\n    className = styles.root,\n    formClassName = styles.form,\n    tabsClassName = styles.tabs,\n    inputClassName,\n    qrcodeClassName = styles.qrcode,\n    qrcodeBoxClassName = styles.qrcodeBox,\n    sms,\n  } = props;\n\n  const [loginType, setLoginType] = useState<LoginType>(defaultLoginType);\n\n  const [qrcodeStatus, setQrcodeStatus] = useState<'active' | 'expired' | 'loading'>('active');\n  const [qrcodeUrl, setQrcodeUrl] = useState<string>('-');\n  const [qrcodeValue, setQrcodeValue] = useState<string>('');\n  const pollIntervalRef = useRef<ReturnType<typeof setInterval> | null>(null);\n  const pollTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const shouldShowSubmitter = loginType !== 'qrcode';\n\n  const resolvedActions = useMemo(() => {\n    if (!actions) return undefined;\n    return typeof actions === 'function' ? actions(loginType) : actions;\n  }, [actions, loginType]);\n\n  const safeClearTimers = useCallback(() => {\n    if (pollIntervalRef.current) clearInterval(pollIntervalRef.current);\n    if (pollTimeoutRef.current) clearTimeout(pollTimeoutRef.current);\n    pollIntervalRef.current = null;\n    pollTimeoutRef.current = null;\n  }, []);\n\n  const handleQrcodeRefresh = useCallback(async () => {\n    if (!qrcode) return;\n    setQrcodeStatus('loading');\n    try {\n      const res = await qrcode.api.getQrcode();\n      setQrcodeUrl(res.url);\n      setQrcodeValue(res.qrcode);\n      setQrcodeStatus('active');\n    } catch {\n      setQrcodeStatus('expired');\n      message.error('获取二维码失败，请稍后重试');\n    }\n  }, [qrcode]);\n\n  const enabledTabKeys = useMemo(() => new Set(tabs.map((t) => t.key)), [tabs]);\n\n  useEffect(() => {\n    if (enabledTabKeys.has(defaultLoginType)) {\n      setLoginType(defaultLoginType);\n      return;\n    }\n    const fallback = tabs[0]?.key;\n    if (fallback) setLoginType(fallback);\n  }, [defaultLoginType, enabledTabKeys, tabs]);\n\n  useEffect(() => {\n    if (enabledTabKeys.has(loginType)) return;\n    const fallback = tabs[0]?.key;\n    if (fallback) setLoginType(fallback);\n  }, [enabledTabKeys, loginType, tabs]);\n\n  // 切到扫码登录时刷新二维码；离开扫码登录时停止轮询并标记过期\n  useEffect(() => {\n    safeClearTimers();\n    if (loginType !== 'qrcode') {\n      setQrcodeStatus('expired');\n      return;\n    }\n    if (!qrcode) {\n      setQrcodeStatus('expired');\n      return;\n    }\n    void handleQrcodeRefresh();\n    return safeClearTimers;\n  }, [handleQrcodeRefresh, loginType, qrcode, safeClearTimers]);\n\n  // 扫码轮询：仅在二维码“激活 + 有值 + 在扫码 Tab”时启动\n  useEffect(() => {\n    safeClearTimers();\n    if (!qrcode) return;\n    if (loginType !== 'qrcode') return;\n    if (qrcodeStatus !== 'active') return;\n    if (!qrcodeValue) return;\n\n    pollIntervalRef.current = setInterval(() => {\n      void qrcode.api\n        .scanLogin(qrcodeValue)\n        .then((res) => {\n          if (res.code !== 200) return;\n\n          const status = res.data?.status;\n          const msg = res.data?.msg ?? '扫码遇到问题，稍后重试';\n\n          if (status === -1) return;\n          if (status !== 1) {\n            safeClearTimers();\n            setQrcodeStatus('expired');\n            message.error(msg, 3);\n            return;\n          }\n          safeClearTimers();\n          void qrcode.onSuccess();\n        })\n        .catch(() => {\n          // 忽略轮询中的偶发网络错误，保持继续轮询直到超时/成功\n        });\n    }, 1000);\n\n    pollTimeoutRef.current = setTimeout(() => {\n      setQrcodeStatus('expired');\n      safeClearTimers();\n    }, 30000);\n\n    return safeClearTimers;\n  }, [loginType, qrcode, qrcodeStatus, qrcodeValue, safeClearTimers]);\n\n  const tabItems = useMemo(() => tabs.map((t) => ({ key: t.key, label: t.label })), [tabs]);\n\n  return (\n    <div className={className} style={{ maxWidth: '500px' }}>\n      <LoginForm\n        className={formClassName}\n        onFinish={async (values) => {\n          await onFinish(values);\n        }}\n        title={typeof title === 'string' ? <div className={styles.title}>{title}</div> : title}\n        containerStyle={containerStyle}\n        submitter={shouldShowSubmitter ? undefined : (false as const)}\n        actions={resolvedActions}\n      >\n        <Tabs\n          className={tabsClassName}\n          centered\n          activeKey={loginType}\n          onChange={(activeKey) => {\n            const next = activeKey as LoginType;\n            setLoginType(next);\n          }}\n          items={tabItems}\n        />\n\n        {enabledTabKeys.has('qrcode') && loginType === 'qrcode' && qrcode && (\n          <div style={qrcode.wrapStyle ?? DEFAULT_QRCODE_WRAP_STYLE}>\n            <div className={qrcodeBoxClassName}>\n              <Flex justify='center' align='center'>\n                <i className='iconfont icon-saoyisao' style={{ color: '#999999', marginRight: 10, fontSize: 14 }}></i>\n                请使用<span style={{ color: '#0A6BFD' }}>小闪扫码</span>登录\n              </Flex>\n              <QRCode\n                icon={qrcode.icon}\n                iconSize={qrcode.iconSize ?? 50}\n                className={qrcodeClassName}\n                size={qrcode.size ?? 240}\n                value={qrcodeUrl}\n                status={qrcodeStatus}\n                onRefresh={handleQrcodeRefresh}\n              />\n            </div>\n          </div>\n        )}\n\n        {enabledTabKeys.has('sms') && loginType === 'sms' && sms && (\n          <SmsLoginForm inputClassName={inputClassName ?? ''} api={sms.api} appKey={sms.appKey} />\n        )}\n      </LoginForm>\n    </div>\n  );\n};\n\nexport default LoginModule;\n"],
+  "mappings": "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",
+  "names": ["_a", "_b", "_c"]
+}

package/dist/es/business/YkLoginModule/styles.module.less

@@ -0,0 +1,169 @@
+.root {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+
+  :global {
+    @media (max-width: 768px) {
+      .ant-pro-form-login-container {
+        padding: 20px !important;
+        padding-inline: 0;
+        padding-block: 0;
+      }
+    }
+
+    .ant-pro-form-login-container {
+      border: 1px solid #ececec;
+      border-radius: 12px;
+      background: #ffffff;
+
+      .ant-pro-form-login-top {
+        margin-bottom: 54px;
+
+        .ant-pro-form-login-header {
+          justify-content: flex-start;
+          height: 33px;
+          line-height: 33px;
+        }
+      }
+
+      .ant-pro-form-login-main {
+        width: 100% !important;
+        max-width: 500px !important;
+      }
+
+      @media (max-width: 768px) {
+        .ant-pro-form-login-main {
+          width: 100% !important;
+        }
+
+        .ant-form-item-control-input {
+          .ant-input-affix-wrapper {
+            width: 100% !important;
+          }
+        }
+      }
+
+      .ant-pro-form-login-main-other {
+        margin-top: 0;
+      }
+    }
+  }
+}
+
+.title {
+  height: 33px;
+  color: #333333;
+  font-weight: 600;
+  font-size: 24px;
+  line-height: 33px;
+}
+
+.tabs {
+  :global {
+    .ant-tabs-nav {
+      margin: 0 0 30px 0;
+
+      .ant-tabs-nav-wrap {
+        justify-content: left;
+        border-bottom: 1px solid #eeeeee;
+
+        .ant-tabs-nav-list {
+          .ant-tabs-tab {
+            padding: 0 0 15px 0;
+
+            .ant-tabs-tab-btn {
+              color: #666666;
+              font-weight: 400;
+              font-size: 18px;
+              line-height: 25px;
+            }
+
+            &.ant-tabs-tab-active {
+              .ant-tabs-tab-btn {
+                color: #333333;
+                font-weight: 600;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+.form {
+  :global {
+    width: 100%;
+
+    .ant-form-item {
+      margin-bottom: 20px;
+
+      .ant-form-item-row {
+        .ant-form-item-explain-error {
+          font-size: 12px;
+        }
+
+        .ant-form-item-control-input {
+          .ant-input-affix-wrapper {
+            width: 100%;
+            height: 50px;
+            background: #fcfcfc;
+            border: 1px solid #ececec;
+            border-radius: 4px;
+
+            .ant-input-prefix {
+              margin-right: 15px;
+              color: #666;
+              font-size: 20px;
+            }
+
+            input {
+              background: #fcfcfc;
+            }
+          }
+        }
+      }
+    }
+
+    .ant-btn-primary {
+      width: 100%;
+      height: 50px;
+      margin-top: 37px;
+      margin-bottom: 46px;
+      padding: 0;
+      color: #ffffff;
+      font-weight: 600;
+      font-size: 18px;
+      line-height: 50px;
+      background: linear-gradient(131deg, #1d93ff 0%, #0a6bfd 100%);
+      border-radius: 4px;
+    }
+  }
+}
+
+.actions {
+  color: #666666;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 25px;
+}
+
+.qrcodeBox {
+  padding: 20px 24px;
+  border: 1px solid #ececec;
+  border-radius: 12px;
+}
+
+.qrcode {
+  :global {
+    border: none !important;
+  }
+}
+
+.captchaBtn {
+  padding: 0;
+  color: #0a6bfd;
+}
+