feat: 分享的文案 + 点击头像看模卡 + 提现文案 + 协议弹窗 + 进群限制

src/components/login-button/index.tsx

@@ -1,11 +1,12 @@
-import { Button, ButtonProps } from '@tarojs/components';
+import { Button, ButtonProps, ITouchEvent } from '@tarojs/components';
 
 import classNames from 'classnames';
 import { useCallback, useState } from 'react';
 
+import { AgreementPopup } from '@/components/agreement-popup';
 import LoginDialog from '@/components/login-dialog';
 import useUserInfo from '@/hooks/use-user-info';
-import { getAgreementSigned, isNeedLogin } from '@/utils/user';
+import { getAgreementSigned, isNeedLogin, setAgreementSigned } from '@/utils/user';
 
 import './index.less';
 
@@ -17,6 +18,7 @@ export enum BindPhoneStatus {
 
 export interface ILoginButtonProps extends ButtonProps {
   needPhone?: boolean;
+  needAssignment?: boolean;
 }
 
 const PREFIX = 'login-button';
@@ -24,13 +26,50 @@ const PREFIX = 'login-button';
 function LoginButton(props: ILoginButtonProps) {
   const { className, children, needPhone, onClick, ...otherProps } = props;
   const userInfo = useUserInfo();
-  const [visible, setVisible] = useState(false);
+  const [loginVisible, setLoginVisible] = useState(false);
+  const [assignVisible, setAssignVisible] = useState(false);
   const needLogin = isNeedLogin(userInfo);
-  const needSign = !getAgreementSigned();
+  // 点击按钮时，协议同意也手机也授权了 -> 下一步
+  //
+  // 点击按钮时，协议同意但是手机授权没给 ->  弹登录
+  //   -> 如果授权了手机号就进行下一步
+  //   -> 不给授权没下一步
+  //
+  // 点击按钮时，协议不同意 ->  弹协议窗口
+  //   -> 如果同意就进行下一步
+  //   -> 不同意没下一步
+  const handleClick = useCallback(
+    (e: ITouchEvent) => {
+      if (!getAgreementSigned()) {
+        setAssignVisible(true);
+      } else if (needLogin) {
+        setLoginVisible(true);
+      } else if (onClick) {
+        onClick(e);
+      }
+    },
+    [needLogin, onClick]
+  );
 
-  const onSuccess = useCallback(
+  const handleConfirm = useCallback(
+    (e: ITouchEvent) => {
+      setAssignVisible(false);
+      setAgreementSigned(true);
+      if (onClick) {
+        onClick(e);
+      }
+    },
+    [onClick]
+  );
+
+  const handleCancel = useCallback(() => {
+    setAgreementSigned(false);
+    setAssignVisible(false);
+  }, []);
+
+  const handleLoginSuccess = useCallback(
     e => {
-      setVisible(false);
+      setLoginVisible(false);
       onClick?.(e);
     },
     [onClick]
@@ -38,15 +77,17 @@ function LoginButton(props: ILoginButtonProps) {
 
   return (
     <>
-      <Button
-        {...otherProps}
-        className={classNames(PREFIX, className)}
-        onClick={needLogin || needSign ? () => setVisible(true) : onClick}
-      >
+      <Button {...otherProps} className={classNames(PREFIX, className)} onClick={handleClick}>
         {children}
       </Button>
-      {visible && (
-        <LoginDialog disableCheck onCancel={() => setVisible(false)} onSuccess={onSuccess} needPhone={needPhone} />
+      <AgreementPopup
+        open={assignVisible}
+        onCancel={handleCancel}
+        onConfirm={handleConfirm}
+        needBindPhone={needLogin}
+      />
+      {loginVisible && (
+        <LoginDialog onCancel={() => setLoginVisible(false)} onSuccess={handleLoginSuccess} needPhone={needPhone} />
       )}
     </>
   );