From 8633aff6274c192f09aa884d9d0df68d8ac611ec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B4=AB=E6=98=9F?= <1315228475@qq.com> Date: Thu, 24 Oct 2024 10:11:37 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E6=9B=B4=E5=A4=9A=E7=99=BB?= =?UTF-8?q?=E5=BD=95=E6=96=B9=E5=BC=8F=E6=96=B0=E5=A2=9E=E6=9D=A1=E4=BB=B6?= =?UTF-8?q?=E7=BC=96=E8=AF=91=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/components/LoginForm.vue | 11 ++++++++++- src/pages/login/index.vue | 2 ++ 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/pages/login/components/LoginForm.vue b/src/pages/login/components/LoginForm.vue index 4c39df8..5913035 100644 --- a/src/pages/login/components/LoginForm.vue +++ b/src/pages/login/components/LoginForm.vue @@ -40,6 +40,8 @@ 登录 + + 本机号登录 + @@ -129,7 +132,13 @@ console.log(e) }) } else { - uni.navigateTo({ url: '/pages/login/phone-index' }) + uni.login({ + provider: 'univerify', + univerifyStyle: { + fullScreen: true + } + }) + // uni.navigateTo({ url: '/pages/login/phoneIndex' }) } } diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue index 13cfb0b..c61dced 100644 --- a/src/pages/login/index.vue +++ b/src/pages/login/index.vue @@ -26,8 +26,10 @@ + + -- Gitee From 29e50f254f74a95cc4b198be67a7fc41a2d25e0d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=B4=AB=E6=98=9F?= <1315228475@qq.com> Date: Thu, 24 Oct 2024 17:17:40 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E5=AE=8C=E6=88=90=E7=99=BB?= =?UTF-8?q?=E5=BD=95=E7=9A=84TODO?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/interceptors/route.ts | 4 +- src/pages.json | 6 --- src/pages/login/components/Banner.vue | 20 +++---- src/pages/login/components/LoginForm.vue | 63 +++++++++-------------- src/pages/login/components/PhoneLogin.vue | 26 +++++----- src/pages/login/registerCode.vue | 39 +++++++------- src/store/user.ts | 33 +++++++++--- src/types/uni-pages.d.ts | 1 + src/utils/index.ts | 19 ++++--- 9 files changed, 108 insertions(+), 103 deletions(-) diff --git a/src/interceptors/route.ts b/src/interceptors/route.ts index 252855b..d95333e 100644 --- a/src/interceptors/route.ts +++ b/src/interceptors/route.ts @@ -83,7 +83,7 @@ const navigateToInterceptor = { uni.navigateTo({ url: '/pages/login/index' }) return option } - }, + } } export const routeInterceptor = { @@ -91,5 +91,5 @@ export const routeInterceptor = { uni.addInterceptor('navigateTo', navigateToInterceptor) uni.addInterceptor('reLaunch', navigateToInterceptor) uni.addInterceptor('redirectTo', navigateToInterceptor) - }, + } } diff --git a/src/pages.json b/src/pages.json index 9e6ba8b..6551b11 100644 --- a/src/pages.json +++ b/src/pages.json @@ -53,12 +53,6 @@ "text": "我的", "icon": "i-ic-baseline-person", "iconType": "unocss" - }, - { - "pagePath": "pages/person-center/index", - "text": "我的信息", - "icon": "i-ic-baseline-person", - "iconType": "unocss" } ] }, diff --git a/src/pages/login/components/Banner.vue b/src/pages/login/components/Banner.vue index d2c0569..fe70229 100644 --- a/src/pages/login/components/Banner.vue +++ b/src/pages/login/components/Banner.vue @@ -60,16 +60,16 @@ }) // 当前租户 /** 获取租户列表 */ - // TODO @xiaohong：使用 async 改成同步的，减少 callback 哈 - function getTenantList() { - loading.value = true - getTenants() - .then((res: []) => { - tenantList.value = res - }) - .finally(() => { - loading.value = false - }) + async function getTenantList() { + try { + loading.value = true + const res = (await getTenants()) as [] + tenantList.value = res + } catch (error) { + console.log(error) + } finally { + loading.value = false + } } /** 选择租户信息 */ diff --git a/src/pages/login/components/LoginForm.vue b/src/pages/login/components/LoginForm.vue index 21202a8..76f41c9 100644 --- a/src/pages/login/components/LoginForm.vue +++ b/src/pages/login/components/LoginForm.vue @@ -63,7 +63,7 @@ import { useToast } from 'wot-design-uni' import { login } from '@/service/login/LoginAPI' import { useUserStore } from '@/store' - import * as authUtil from '@/utils/auth' + import { currRoute } from '@/utils' const props = defineProps({ tenantId: { @@ -95,7 +95,7 @@ }) /** 执行登录 */ - const handleLogin = (type: string) => { + const handleLogin = async (type: string) => { if (!props.agree) { toast.warning('请阅读并同意《用户协议》和《隐私政策》') return @@ -104,44 +104,31 @@ toast.warning('请先选择租户!') return } - // TODO @xiaohong：建议这种 if (type == 'userinfo') 这种，符合条件，处理完，就 return。就是常说的 if return 原则 - // TODO @xiaohong：改成 await 形式哈；这样 callback 层级浅一点 + const { afterLogin } = useUserStore() if (type === 'userinfo') { - loginForm.value - .validate() - .then(async ({ valid, errors }) => { - if (valid) { - try { - toast.loading('登录中...') - // todo 校验form数据 - const res = await login(loginData.loginForm) - // 设置token - authUtil.setToken(res) - // 获取用户信息，保存到 store - const userStore = useUserStore() - await userStore.setUserInfoAction() - toast.close() - // 暂时先跳到首页 - // TODO @xiaohong：可以研究下，做个登录的 redirect_uri 机制哇？ - uni.switchTab({ - url: '/pages/work/index' - }) - } catch (error) { - toast.close() - } - } - }) - .catch((e) => { - console.log(e) - }) - } else { - uni.login({ - provider: 'univerify', - univerifyStyle: { - fullScreen: true + try { + // 校验表单 + const { valid } = await loginForm.value.validate() + if (valid) { + toast.loading('登录中...') + // 调用登录接口 + const data = ((await login(loginData.loginForm)) as Recordable)?.data + // 登录成功后的回调 + afterLogin(data) } - }) - // uni.navigateTo({ url: '/pages/login/phoneIndex' }) + } catch (error) { + console.log(error) + } finally { + toast.close() + } + return } + uni.login({ + provider: 'univerify', + univerifyStyle: { + fullScreen: true + } + }) + // uni.navigateTo({ url: '/pages/login/phoneIndex' }) } diff --git a/src/pages/login/components/PhoneLogin.vue b/src/pages/login/components/PhoneLogin.vue index 6b35929..4533892 100644 --- a/src/pages/login/components/PhoneLogin.vue +++ b/src/pages/login/components/PhoneLogin.vue @@ -66,7 +66,7 @@ }) /** 获取验证码 */ - function getCode() { + async function getCode() { if (!props.agree) { toast.warning('请阅读并同意《用户协议》和《隐私政策》') return @@ -76,21 +76,19 @@ return } - // TODO @xiaohong：可以 async 改成同步的，减少 callback 哈 - loginForm.value.validate().then(({ valid, errors }) => { + try { + const { valid } = await loginForm.value.validate() if (valid) { toast.loading('获取验证码......') - getCodeApi(loginData.loginForm) - .then((code) => { - console.log(code) - uni.navigateTo({ - url: `/pages/login/registerCode?phoneNo=${loginData.loginForm.phoneNo}&code=${code}` - }) - }) - .finally(() => { - toast.close() - }) + const code = await getCodeApi(loginData.loginForm) + uni.navigateTo({ + url: `/pages/login/registerCode?phoneNo=${loginData.loginForm.phoneNo}&code=${code}` + }) } - }) + } catch (error) { + console.log(error) + } finally { + toast.close() + } } diff --git a/src/pages/login/registerCode.vue b/src/pages/login/registerCode.vue index 7a58b41..d89ab0c 100644 --- a/src/pages/login/registerCode.vue +++ b/src/pages/login/registerCode.vue @@ -11,8 +11,7 @@ 验证手机号 请输入发送至 - - {{ phoneNo.replace(/^(\d{3})(\d{4})(\d{4})$/, '$1****$2') }} + {{ phoneNumber }} 的 6 位验证码,有效期 10 分钟。如未收到,请重新获取验证码 @@ -47,6 +46,10 @@ const codeDisabled = ref(true) const showKeyboard = ref(true) // 数字键盘 + const phoneNumber = computed(() => + phoneNo.value.replace(/^(\d{3})(\d{4})(\d{4})$/, '$1****$2') + ) + function getTime() { loadTime.value-- if (loadTime.value === 0) { @@ -56,23 +59,23 @@ } } - /** 获取验证码 */ - // TODO @xiaohong：使用 async 改成同步的，减少 callback 哈 - function getCode() { - toast.loading('获取验证码......') - getCodeApi({ - phoneNo: phoneNo.value - }) - .then((code) => { - loadTime.value = 60 - codeDisabled.value = true - showKeyboard.value = true - timer.value = setInterval(getTime, 1000) - toast.loading({ msg: '验证码已发送......', duration: 2000 }) - }) - .finally(() => { - // toast.close() + /* + *@Description: 获取验证码 + *@MethodAuthor: xiaohong + *@Date: 2024-10-24 15:53:38 + */ + async function getCode() { + try { + toast.loading('获取验证码......') + const code = await getCodeApi({ + phoneNo: phoneNo.value }) + loadTime.value = 60 + codeDisabled.value = true + showKeyboard.value = true + timer.value = setInterval(getTime, 1000) + toast.loading({ msg: '验证码已发送......', duration: 2000 }) + } catch (error) {} } /** 初始化 */ diff --git a/src/store/user.ts b/src/store/user.ts index 7f65497..9125fec 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -1,9 +1,10 @@ import { defineStore } from 'pinia' import { ref } from 'vue' -import { getAccessToken, removeToken } from '@/utils/auth' +import { getAccessToken, removeToken, setToken } from '@/utils/auth' import { getInfo, loginOut } from '@/service/login/LoginAPI' +import { currRoute } from '@/utils' -const initState = { +const initState: UserInfoVO = { permissions: [], roles: [], isSetUser: false, @@ -24,12 +25,11 @@ export const useUserStore = defineStore( // actions methods const setUserInfoAction = async () => { + // 获取不到accessToken，直接返回 if (!getAccessToken()) { - // 获取不到accessToken，直接返回 resetState() return } - const data = await getInfo() userInfo.value = { ...data, @@ -37,24 +37,42 @@ export const useUserStore = defineStore( } } + // 设置用户头像 const setUserAvatarAction = async (avatar: string) => { userInfo.value.user.avatar = avatar } + // 设置用户昵称 const setUserNicknameAction = async (nickname: string) => { userInfo.value.user.nickname = nickname } + // 退出登录 const LogOut = async () => { await loginOut() removeToken() resetState() } + // 重置userInfo const resetState = () => { - console.log('initState', initState) userInfo.value = initState - console.log('重置userInfo', userInfo.value) + } + + /* + *@Description: 登录后的回调 + *@MethodAuthor: xiaohong + *@Date: 2024-10-24 13:18:58 + */ + const afterLogin = async (params: Recordable) => { + // 设置token + setToken(params) + // 获取用户信息，保存到 store + await setUserInfoAction() + const fullPath = currRoute() + uni.redirectTo({ + url: fullPath.query.redirect || '/pages/work/index' + }) } // 暴露到外面的方法 @@ -64,7 +82,8 @@ export const useUserStore = defineStore( setUserAvatarAction, setUserNicknameAction, LogOut, - resetState + resetState, + afterLogin } }, { diff --git a/src/types/uni-pages.d.ts b/src/types/uni-pages.d.ts index b8fb0e6..6154b0b 100644 --- a/src/types/uni-pages.d.ts +++ b/src/types/uni-pages.d.ts @@ -14,6 +14,7 @@ interface NavigateToOptions { "/pages/message/index" | "/pages/my/index" | "/pages/my-info/index" | + "/pages/person-center/index" | "/pages/role/index"; } interface RedirectToOptions extends NavigateToOptions {} diff --git a/src/utils/index.ts b/src/utils/index.ts index 8283d7d..ffceb39 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -61,7 +61,7 @@ export const getUrlObj = (url: string) => { if (!queryStr) { return { path, - query: {}, + query: {} } } const query: Record = {} @@ -84,8 +84,8 @@ export const getAllPages = (key = 'needLogin') => { .filter((page) => !key || page[key]) .map((page) => ({ ...page, - path: `/${page.path}`, - })), + path: `/${page.path}` + })) ] // 这里处理分包 const subPages: any[] = [] @@ -98,7 +98,7 @@ export const getAllPages = (key = 'needLogin') => { .forEach((page: { path: string } & Record) => { subPages.push({ ...page, - path: `/${root}/${page.path}`, + path: `/${root}/${page.path}` }) }) }) @@ -111,13 +111,16 @@ export const getAllPages = (key = 'needLogin') => { * 得到所有的需要登录的pages，包括主包和分包的 * 只得到 path 数组 */ -export const getNeedLoginPages = (): string[] => getAllPages('needLogin').map((page) => page.path) +export const getNeedLoginPages = (): string[] => + getAllPages('needLogin').map((page) => page.path) /** * 得到所有的需要登录的pages，包括主包和分包的 * 只得到 path 数组 */ -export const needLoginPages: string[] = getAllPages('needLogin').map((page) => page.path) +export const needLoginPages: string[] = getAllPages('needLogin').map( + (page) => page.path +) /** * 根据微信小程序当前环境，判断应该获取的BaseUrl @@ -129,7 +132,7 @@ export const getEvnBaseUrl = () => { // 小程序端环境区分 if (isMp) { const { - miniProgram: { envVersion }, + miniProgram: { envVersion } } = uni.getAccountInfoSync() // 开发、体验、正式版 三种不同的小程序都可以配置不同的后端 url switch (envVersion) { @@ -158,7 +161,7 @@ export const getEvnBaseUploadUrl = () => { // 小程序端环境区分 if (isMp) { const { - miniProgram: { envVersion }, + miniProgram: { envVersion } } = uni.getAccountInfoSync() switch (envVersion) { -- Gitee