初步完成用户验证和登陆信息获取

src/stores/AuthStore.js

@@ -2,6 +2,8 @@ import { create } from 'zustand'
 import { devtools } from 'zustand/middleware'
 import { fetchJSON, postJSON } from '@/utils/request'
 
+const API_HOST = 'https://p9axztuwd7x8a7.mycht.cn/whatsapp_server'
+
 const useAuthStore = create((set, get) => ({
 
   loginUser: {
@@ -15,6 +17,43 @@ const useAuthStore = create((set, get) => ({
     // permissionList: ['view_chat', 'send_msg'],
   },
 
+  loginStatus: 0,
+
+  fetchUser: async (authCode) => {
+
+    const { saveUserSession } = get()
+
+    set(() => ({
+      loginStatus: 200
+    }))
+
+    const json = await fetchJSON(`https://p9axztuwd7x8a7.mycht.cn/dingtalk/dingtalkwork/WhatsAppAuth`, { authCode })
+
+    if (json.errcode === 0) {
+      set(() => ({
+        loginUser: {
+          userId: json.result.opisn,
+          accountName: json.result.opicode,
+          username: json.result.nick,
+          avatarUrl: json.result.avatarUrl,
+          mobile: '+' + json.result.stateCode + '-' + json.result.mobile,
+          email: json.result.email,
+          openId: json.result.openId,
+          accountList: json.result.accountlist,
+        }
+      }))
+      saveUserSession()
+
+      set(() => ({
+        loginStatus: 302
+      }))
+    } else {
+      set(() => ({
+        loginStatus: 403
+      }))
+    }
+  },
+
   loadUser: () => {
     const sessionData = window.sessionStorage.getItem('GLOBAL_SALES_LOGIN_USER')
     let userData = {
@@ -34,7 +73,7 @@ const useAuthStore = create((set, get) => ({
     return userData
   },
 
-  saveUser: () => {
+  saveUserSession: () => {
     const { loginUser } = get()
     window.sessionStorage.setItem('GLOBAL_SALES_LOGIN_USER', JSON.stringify(loginUser))
   },

src/stores/OrderStore.js

@@ -2,7 +2,7 @@ import { create } from 'zustand'
 import { devtools } from 'zustand/middleware'
 import { fetchJSON, postJSON } from '@/utils/request'
 
-const API_HOST = 'https://p9axztuwd7x8a7.mycht.cn/whatsapp_server';
+const API_HOST = 'https://p9axztuwd7x8a7.mycht.cn/whatsapp_server'
 
 const useOrderStore = create((set, get) => ({
 

src/views/AccountProfile.jsx

@@ -5,10 +5,10 @@ import {
 import {
   UserOutlined
 } from '@ant-design/icons'
-import { useAuthContext } from '@/stores/AuthContext'
+import useAuthStore from '@/stores/AuthStore'
 
 function AccountProfile() {
-  const { loginUser } = useAuthContext()
+  const { loginUser } = useAuthStore()
 
   useEffect(() => {
     // 测试错误捕获：

src/views/AuthApp.jsx

@@ -22,8 +22,7 @@ function AuthApp() {
   const navigate = useNavigate()
 
   const { colorPrimary, borderRadius } = useThemeContext()
-  const { loadUser
+  const { loadUser } = useAuthStore()
-  } = useAuthStore()
 
   const loginUser = loadUser()
 

src/views/DingdingQRCode.jsx

@@ -1,8 +1,7 @@
 import { Result, Spin, Flex, Typography } from 'antd'
 import React, { useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
-
+import useAuthStore from '@/stores/AuthStore'
-import { useAuthContext } from '@/stores/AuthContext'
 
 const { Title } = Typography
 
@@ -11,8 +10,8 @@ const { Title } = Typography
 function DingdingQRCode() {
 
   const navigate = useNavigate()
-  const { loginUser } = useAuthContext()
+  // const { loginUser } = useAuthContext()  
-  const [loginStatus, setLoginStatus] = useState(0)
+  const { loginStatus, fetchUser } = useAuthStore()
 
   useEffect(() => {
     import('https://g.alicdn.com/dingding/h5-dingtalk-login/0.21.0/ddlogin.js').then(() => {
@@ -32,29 +31,9 @@ function DingdingQRCode() {
         },
         (loginResult) => {
           const { authCode } = loginResult
-          console.log(loginResult)
+          fetchUser(authCode)
-          setLoginStatus(200)
-
-          fetch(`https://p9axztuwd7x8a7.mycht.cn/dingtalk/dingtalkwork/WhatsAppAuth?authCode=${authCode}`)
-            .then(response => response.json())
-            .then(json => {
-              if (json.errcode === 0) {
-                loginUser.userId = json.result.opisn
-                loginUser.accountName = json.result.opicode
-                loginUser.username = json.result.nick
-                loginUser.avatarUrl = json.result.avatarUrl
-                loginUser.mobile = '+' + json.result.stateCode + '-' + json.result.mobile
-                loginUser.email = json.result.email
-                loginUser.openId = json.result.openId
-                loginUser.accountList = json.result.accountlist
-                navigate('/account/profile')
-              } else {
-                setLoginStatus(403)
-              }
-            })
         },
         (errorMsg) => {
-          setLoginStatus(403)
           console.error(`Login Error: ${errorMsg}`)
         },
       )
@@ -74,6 +53,8 @@ function DingdingQRCode() {
         />
       </Flex>
     )
+  } else if (loginStatus === 302) {
+    navigate('/account/profile')
   } else if (loginStatus === 403) {
     return (
       <Flex justify='center' align='center' gap='middle' vertical>

src/views/OrderFollow.jsx

@@ -6,7 +6,7 @@ import { memo, useCallback, useEffect, useState } from 'react'
 import { Link } from 'react-router-dom'
 import dayjs from 'dayjs'
 import { Conditional } from '@/components/Conditional'
-import { useAuthContext } from '@/stores/AuthContext'
+import useAuthStore from '@/stores/AuthStore'
 import { prepareUrl, isNotEmpty } from '@/utils/commons'
 
 const { RangePicker } = DatePicker
@@ -204,7 +204,7 @@ function OrderList({ formValues }) {
   const { notification } = App.useApp()
   const [orderData, setOrderData] = useState([])
   const [loading, setLoading] = useState(false)
-  const { loginUser } = useAuthContext()
+  const { loginUser } = useAuthStore()
   let fetchOrderUrl = `https://p9axztuwd7x8a7.mycht.cn/whatsapp_server/getwlorder?opisn=${loginUser.userId}&otype=${formValues.type}`
 
   if (formValues.type === 'advance') {