From 95a9675c7ce50e8b978d18af5bb03f2f5dcbd499 Mon Sep 17 00:00:00 2001 From: valarchie <343928303@qq.com> Date: Fri, 23 Jun 2023 17:03:53 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BD=BF=E7=94=A8=E5=90=8E=E7=AB=AF?= =?UTF-8?q?=E7=9A=84=E9=AA=8C=E8=AF=81=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.development | 3 ++ .env.production | 5 ++- .env.staging | 3 ++ build/index.ts | 3 +- src/api/common.ts | 38 ++++++++++++++++++++ src/components/ReImageVerify/src/hooks.ts | 1 + src/utils/http/index.ts | 3 ++ src/views/login/components/phone.vue | 4 +-- src/views/login/components/qrCode.vue | 2 +- src/views/login/components/register.vue | 12 +++---- src/views/login/components/resetPassword.vue | 4 +-- src/views/login/index.vue | 28 ++++++++++----- types/global.d.ts | 1 + vite.config.ts | 8 ++++- 14 files changed, 90 insertions(+), 25 deletions(-) create mode 100644 src/api/common.ts diff --git a/.env.development b/.env.development index 23138bd..d68d966 100644 --- a/.env.development +++ b/.env.development @@ -6,3 +6,6 @@ VITE_PUBLIC_PATH = ./ # 开发环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"） VITE_ROUTER_HISTORY = "hash" + +# 后端地址 +VITE_APP_BASE_API = '/dev-api' diff --git a/.env.production b/.env.production index ecfb549..6ecab1d 100644 --- a/.env.production +++ b/.env.production @@ -10,4 +10,7 @@ VITE_CDN = false # 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件） # 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认） # 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认） -VITE_COMPRESSION = "none" \ No newline at end of file +VITE_COMPRESSION = "none" + +# 后端地址 +VITE_APP_BASE_API = '/prod-api' \ No newline at end of file diff --git a/.env.staging b/.env.staging index 00db0cc..1aed2ef 100644 --- a/.env.staging +++ b/.env.staging @@ -14,3 +14,6 @@ VITE_CDN = true # 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认） # 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认） VITE_COMPRESSION = "none" + +# 后端地址 +VITE_APP_BASE_API = '/stage-api' \ No newline at end of file diff --git a/build/index.ts b/build/index.ts index 278488f..fbf08a3 100644 --- a/build/index.ts +++ b/build/index.ts @@ -7,7 +7,8 @@ const wrapperEnv = (envConfigs: Recordable): ViteEnv => { VITE_ROUTER_HISTORY: "", VITE_CDN: false, VITE_HIDE_HOME: "false", - VITE_COMPRESSION: "none" + VITE_COMPRESSION: "none", + VITE_APP_BASE_API: "" }; for (const configName of Object.keys(envConfigs)) { diff --git a/src/api/common.ts b/src/api/common.ts new file mode 100644 index 0000000..5fb04d0 --- /dev/null +++ b/src/api/common.ts @@ -0,0 +1,38 @@ +import { http } from "@/utils/http"; + +/** 可以做成泛型 */ +export type CaptchaResult = { + success: boolean; + data: CaptchaDTO; +}; + +export type CaptchaDTO = { + /** 验证码开关 */ + isCaptchaOn: boolean; + /** */ + uuid: string; + /** `token` */ + img: string; +}; + +export type RefreshTokenResult = { + success: boolean; + data: { + /** `token` */ + accessToken: string; + /** 用于调用刷新`accessToken`的接口时所需的`token` */ + refreshToken: string; + /** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */ + expires: Date; + }; +}; + +/** 验证码接口 */ +export const getCaptchaCode = () => { + return http.request("get", "/captchaImage"); +}; + +/** 刷新token */ +export const refreshTokenApi = (data?: object) => { + return http.request("post", "/refreshToken", { data }); +}; diff --git a/src/components/ReImageVerify/src/hooks.ts b/src/components/ReImageVerify/src/hooks.ts index 71fcdfc..ec34c82 100644 --- a/src/components/ReImageVerify/src/hooks.ts +++ b/src/components/ReImageVerify/src/hooks.ts @@ -30,6 +30,7 @@ export const useImageVerify = (width = 120, height = 40) => { }; }; +/** 前端自己生成验证码 */ function randomNum(min: number, max: number) { const num = Math.floor(Math.random() * (max - min) + min); return num; diff --git a/src/utils/http/index.ts b/src/utils/http/index.ts index 3a39993..2d53af7 100644 --- a/src/utils/http/index.ts +++ b/src/utils/http/index.ts @@ -14,10 +14,13 @@ import NProgress from "../progress"; import { getToken, formatToken } from "@/utils/auth"; import { useUserStoreHook } from "@/store/modules/user"; +const { VITE_APP_BASE_API } = import.meta.env; // 相关配置请参考：www.axios-js.com/zh-cn/docs/#axios-request-config-1 const defaultConfig: AxiosRequestConfig = { // 请求超时时间 timeout: 10000, + // 后端请求地址 + baseURL: VITE_APP_BASE_API, headers: { Accept: "application/json, text/plain, */*", "Content-Type": "application/json", diff --git a/src/views/login/components/phone.vue b/src/views/login/components/phone.vue index 2c8fcd3..a4724a1 100644 --- a/src/views/login/components/phone.vue +++ b/src/views/login/components/phone.vue @@ -90,7 +90,7 @@ function onBack() { :loading="loading" @click="onLogin(ruleFormRef)" > - {{ "登录" }} + 登录 @@ -98,7 +98,7 @@ function onBack() { - {{ "返回" }} + 返回 diff --git a/src/views/login/components/qrCode.vue b/src/views/login/components/qrCode.vue index 90eb8d1..4c3e339 100644 --- a/src/views/login/components/qrCode.vue +++ b/src/views/login/components/qrCode.vue @@ -21,7 +21,7 @@ const $pageEmit = defineEmits(["update:currentPage"]); - {{ "返回" }} + 返回 diff --git a/src/views/login/components/register.vue b/src/views/login/components/register.vue index 229ac95..659c7fe 100644 --- a/src/views/login/components/register.vue +++ b/src/views/login/components/register.vue @@ -159,12 +159,8 @@ function onBack() { - - {{ "我已仔细阅读并接受" }} - - - {{ "隐私政策" }} - + 我已仔细阅读并接受 + 隐私政策 @@ -177,7 +173,7 @@ function onBack() { :loading="loading" @click="onUpdate(ruleFormRef)" > - {{ "确定" }} + 确定 @@ -185,7 +181,7 @@ function onBack() { - {{ "返回" }} + 返回 diff --git a/src/views/login/components/resetPassword.vue b/src/views/login/components/resetPassword.vue index 423592a..997fcdc 100644 --- a/src/views/login/components/resetPassword.vue +++ b/src/views/login/components/resetPassword.vue @@ -138,7 +138,7 @@ function onBack() { :loading="loading" @click="onUpdate(ruleFormRef)" > - {{ "确定" }} + 确定 @@ -146,7 +146,7 @@ function onBack() { - {{ "返回" }} + 返回 diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 52ec344..e15c8dd 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -16,7 +16,6 @@ import { useLayout } from "@/layout/hooks/useLayout"; import { useUserStoreHook } from "@/store/modules/user"; import { initRouter, getTopMenu } from "@/router/utils"; import { bg, avatar, illustration } from "./utils/static"; -import { ReImageVerify } from "@/components/ReImageVerify"; import { useRenderIcon } from "@/components/ReIcon/src/hooks"; import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange"; @@ -24,12 +23,13 @@ import dayIcon from "@/assets/svg/day.svg?component"; import darkIcon from "@/assets/svg/dark.svg?component"; import Lock from "@iconify-icons/ri/lock-fill"; import User from "@iconify-icons/ri/user-3-fill"; +import * as CommonAPI from "@/api/common"; defineOptions({ name: "Login" }); -const imgCode = ref(""); +const captchaCodeBase64 = ref(""); const router = useRouter(); const loading = ref(false); const checked = ref(false); @@ -80,7 +80,13 @@ function onkeypress({ code }: KeyboardEvent) { } } -onMounted(() => { +function getCaptchaCode() { + CommonAPI.getCaptchaCode().then(res => { + captchaCodeBase64.value = `data:image/gif;base64,${res.data.img}`; + }); +} + +onMounted(async () => { window.document.addEventListener("keypress", onkeypress); }); @@ -169,7 +175,13 @@ onBeforeUnmount(() => { :prefix-icon="useRenderIcon('ri:shield-keyhole-line')" > @@ -178,11 +190,9 @@ onBeforeUnmount(() => {
- - {{ "记住密码" }} - + 记住密码 - {{ "忘记密码" }} + 忘记密码
{ :loading="loading" @click="onLogin(ruleFormRef)" > - {{ "登录" }} + 登录 diff --git a/types/global.d.ts b/types/global.d.ts index 3f17d2d..dccf2a2 100644 --- a/types/global.d.ts +++ b/types/global.d.ts @@ -64,6 +64,7 @@ declare global { VITE_CDN: boolean; VITE_HIDE_HOME: string; VITE_COMPRESSION: ViteCompression; + VITE_APP_BASE_API: string; } /** diff --git a/vite.config.ts b/vite.config.ts index 7c9d798..78ff3a8 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -43,7 +43,13 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => { port: VITE_PORT, host: "0.0.0.0", // 本地跨域代理 https://cn.vitejs.dev/config/server-options.html#server-proxy - proxy: {} + proxy: { + "/dev-api": { + target: "http://localhost:8080", + changeOrigin: true, + rewrite: path => path.replace(/^\/dev-api/, "") + } + } }, plugins: getPluginsList(command, VITE_CDN, VITE_COMPRESSION), // https://cn.vitejs.dev/config/dep-optimization-options.html#dep-optimization-options