🎈 perf(登录页面): 完善登陆页面

This commit is contained in:
xuan 2022-09-13 15:37:37 +08:00
parent 0ef88a4490
commit b328419b96
5 changed files with 117 additions and 108 deletions

View File

@ -6,8 +6,14 @@ import './app.scss'
import Taro, { onAppShow, useDidShow } from '@tarojs/taro' import Taro, { onAppShow, useDidShow } from '@tarojs/taro'
import { shareShop } from './common/util' import { shareShop } from './common/util'
type ParamsType = {
children?: React.ReactNode
}
const store = configStore() const store = configStore()
const App: FC = (params) => { const App: FC<ParamsType> = (params) => {
const { children } = params
Taro.showShareMenu({ Taro.showShareMenu({
withShareTicket: true, withShareTicket: true,
}) })
@ -41,7 +47,7 @@ const App: FC = (params) => {
return ( return (
<ContextBlueTooth> <ContextBlueTooth>
<Provider store={store}>{params.children}</Provider> <Provider store={store}>{children}</Provider>
</ContextBlueTooth> </ContextBlueTooth>
) )
} }

View File

@ -76,6 +76,7 @@ const Login: FC = () => {
} }
} }
return ( return (
<View className={styles.login}> <View className={styles.login}>
<Image className='full-100' mode='widthFix' src='https://s1.ax1x.com/2022/09/08/vqiVZF.png'></Image> <Image className='full-100' mode='widthFix' src='https://s1.ax1x.com/2022/09/08/vqiVZF.png'></Image>

View File

@ -140,7 +140,7 @@ const UserInfo: FC = () => {
</View> </View>
<View className={styles.bottomBar}> <View className={styles.bottomBar}>
<Tag type='primary' size='normal' circle customStyle={{ marginRight: '10px' }}> <Tag type='primary' size='normal' circle customStyle={{ marginRight: '10px' }}>
IT部门 {userInfo.userInfo.department_name}
</Tag> </Tag>
<Divider direction='vertical'></Divider> <Divider direction='vertical'></Divider>
<Text className={styles.userTitle}>IT-</Text> <Text className={styles.userTitle}>IT-</Text>

View File

@ -181,7 +181,14 @@ export const useRequest = (
removeToken() removeToken()
// removeSessionKey() // removeSessionKey()
removeUserInfo() removeUserInfo()
login() // 跳转回登录页面
login().catch((err)=>{
if (err){
Taro.reLaunch({
url: '/pages/login/index',
})
}
})
} else { } else {
Taro.showToast({ Taro.showToast({
title: `错误:${showStatus(statusCode)}`, title: `错误:${showStatus(statusCode)}`,

View File

@ -1,113 +1,108 @@
import {BASE_URL, WX_APPID } from "@/common/constant" import { BASE_URL, WX_APPID } from '@/common/constant'
import Taro, { useRouter } from "@tarojs/taro" import Taro, { useRouter } from '@tarojs/taro'
import { useRef, useState } from "react" import { useRef, useState } from 'react'
import qs from 'qs' import qs from 'qs'
import useUserInfo from "./useUserInfo" import useUserInfo from './useUserInfo'
import useLogin from "./useLogin" import useLogin from './useLogin'
//开这个hook 主要是为了让useHttp 能够调用 //开这个hook 主要是为了让useHttp 能够调用
type Param = {success: true|false, data: any, msg: string, code: null|number, loading: false|true} type Param = { success: boolean; data: any; msg: string; code: null | number; loading: boolean }
let loginStatus = false //登录状态true登录中 let loginStatus = false //登录状态true登录中
export default () => { export default () => {
let initData = {
let initData = { success: false,
success: false, data: null,
data: null, msg: '',
msg: '', code: null,
code: null, loading: false,
loading: false }
} let loginData = useRef<Param>(initData)
let loginData = useRef<Param>(initData) const { setToken, setSessionKey } = useUserInfo()
const {setToken, setSessionKey} = useUserInfo() const router = useRouter()
const router = useRouter() //微信登录请求v2
//微信登录请求v2 const fetchDataLogin = async (login_code) => {
const fetchDataLogin = async (login_code) => { const q = {
const q = { url: BASE_URL + '/v1/mall/login',
url: BASE_URL + '/v1/mall/login', header: {
header: { Platform: 3,
"Platform": 3, Appid: WX_APPID,
"Appid": WX_APPID, },
}, method: 'post',
method: 'post', data: { js_code: login_code },
data:{js_code: login_code} }
} try {
try{ const result = await Taro.request(q as any)
const result = await Taro.request(q as any) const { code, data, msg } = result.data
const {code, data, msg} = result.data if (result.statusCode === 200) {
if(result.statusCode === 200) { loginData.current.success = code === 0 ? true : false
loginData.current.success = (code === 0 ? true : false) loginData.current.code = code
loginData.current.code = code loginData.current.msg = msg
loginData.current.msg = msg loginData.current.data = data
loginData.current.data = data } else {
} else { Taro.showToast({
Taro.showToast({ title: `错误:登录失败`,
title: `错误:登录失败`, icon: 'none',
icon: 'none' })
}) console.log('登录错误:', result.errMsg)
console.log('登录错误:', result.errMsg) }
} catch (e) {
} Taro.showToast({
}catch(e) { title: `错误:登录失败`,
Taro.showToast({ icon: 'none',
title: `错误:登录失败`, })
icon: 'none' console.log('登录错误:', e.errMsg)
}
return loginData.current
}
//微信登录
const login = () => {
return new Promise((resolve, reject) => {
if (loginStatus) return reject(false)
loginStatus = true
Taro.login({
success: async (res) => {
if (res.code) {
const { data, success, msg } = await fetchDataLogin(res.code)
if (success) {
setToken(data.token)
setSessionKey(data.session_key)
resolve(data)
let params = router.params
delete params.$taroTimestamp
if (router.path === '/pages/index/index' || router.path === '/pages/user/index') {
Taro.reLaunch({
url: router.path + '?' + qs.stringify(params),
}) })
console.log('登录错误:', e.errMsg) } else {
} Taro.redirectTo({
return loginData.current url: router.path + '?' + qs.stringify(params),
}
//微信登录
const login = () => {
if(loginStatus) return false
loginStatus = true
return new Promise((reslove, reject) => {
Taro.login({
success: async (res) => {
if (res.code) {
const {data, success, msg} = await fetchDataLogin(res.code)
if(success) {
setToken(data.token)
setSessionKey(data.session_key)
reslove(data)
let params = router.params
delete params.$taroTimestamp
if(router.path === '/pages/index/index' || router.path === '/pages/user/index') {
Taro.reLaunch({
url: router.path +'?' + qs.stringify(params)
})
} else {
Taro.redirectTo({
url: router.path +'?' + qs.stringify(params)
})
}
} else {
Taro.showToast({
title:'登录失败',
icon:"none"
})
reject(msg)
}
} else {
console.log('登录失败!' + res.errMsg)
reject(res.errMsg)
}
loginStatus = false
},
fail: function(e) {
console.log('登录失败!::',e)
reject(e)
loginStatus = false
}
}) })
}) }
} else {
} Taro.showToast({
title: '登录失败',
return { icon: 'none',
login })
} reject(msg)
}
} else {
console.log('登录失败!' + res.errMsg)
reject(res.errMsg)
}
loginStatus = false
},
fail: function (e) {
console.log('登录失败!::', e)
reject(e)
loginStatus = false
},
})
})
}
return {
login,
}
} }