封版手机一键登录

src/passport/wxLogin.tsx

@@ -1,16 +1,81 @@
 import {useEffect, useState} from "react";
 import Taro from '@tarojs/taro'
 import {Radio, Button} from '@nutui/nutui-react-taro'
+import { createWxLoginHandler } from '@/utils/wxLogin'
+import {TenantId} from "@/utils/config";
 
 const Login = () => {
   const [isAgree, setIsAgree] = useState(false)
+
   const reload = () => {
     Taro.hideTabBar()
-  }
+  };
+
+  const showAuthModal = () => {
+    Taro.showModal({
+      title: '授权提示',
+      content: '需要获取您的用户信息',
+      confirmText: '去授权',
+      cancelText: '取消',
+      success: (res) => {
+        if (res.confirm) {
+          // 用户点击确认，打开授权设置页面
+          openSetting();
+        }
+      }
+    });
+  };
+
+  const openSetting = () => {
+    // Taro.openSetting：调起客户端小程序设置界面，返回用户设置的操作结果。设置界面只会出现小程序已经向用户请求过的权限。
+    Taro.openSetting({
+      success: (res) => {
+        if (res.authSetting['scope.userInfo']) {
+          // 用户授权成功，可以获取用户信息
+          reload();
+        } else {
+          // 用户拒绝授权，提示授权失败
+          Taro.showToast({
+            title: '授权失败',
+            icon: 'none'
+          });
+        }
+      }
+    });
+  };
+
+  // 创建微信登录处理函数
+  const handleGetPhoneNumber = createWxLoginHandler({
+    onSuccess: (user) => {
+      console.log('登录成功:', user);
+      // 可以在这里添加额外的成功处理逻辑
+    },
+    onError: (error) => {
+      console.error('登录失败:', error);
+    },
+    showToast: true,
+    navigateBack: true,
+    tenantId: TenantId
+  });
+
 
   useEffect(() => {
     reload()
-  }, [])
+    // Taro.getSetting：获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
+    Taro.getSetting({
+      success: (res) => {
+        if (res.authSetting['scope.userInfo']) {
+          // 用户已经授权过，可以直接获取用户信息
+          console.log('用户已经授权过，可以直接获取用户信息')
+          reload();
+        } else {
+          // 用户未授权，需要弹出授权窗口
+          console.log('用户未授权，需要弹出授权窗口')
+          showAuthModal();
+        }
+      }
+    });
+  }, []);
 
   return (
     <>
@@ -20,15 +85,8 @@ const Login = () => {
         <>
           <div className={'flex justify-center my-5'}>
             <Button type="info" size={'large'} className={'w-full rounded-lg p-2'}
-                    disabled={!isAgree}>手机号一键登录</Button>
+                    disabled={!isAgree} open-type="getPhoneNumber" onGetPhoneNumber={handleGetPhoneNumber}>手机号一键登录</Button>
           </div>
-          {/*<div className={'my-2 flex fixed justify-center bottom-20 left-0 text-sm items-center text-center w-full'}>*/}
-          {/*  <Button onClick={() => Taro.navigateTo({url: '/passport/setting'})}>服务配置</Button>*/}
-          {/*</div>*/}
-          {/*<div className={'w-full fixed bottom-20 my-2 flex justify-center text-sm items-center text-center'}>*/}
-          {/*  没有账号？<a href={''} onClick={() => Taro.navigateTo({url: '/passport/register'})}*/}
-          {/*              className={'text-blue-600'}>立即注册</a>*/}
-          {/*</div>*/}
         </>
 
         <div className={'my-2 flex text-sm items-center px-1'}>