From 2ceca7287ff178baf3709fd68fc1ba3a23608fef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A5=94=E8=B7=91=E7=9A=84=E9=9D=A2=E6=9D=A1?= <1262327911@qq.com> Date: Tue, 31 May 2022 11:18:34 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9oss=E6=8E=A5=E5=8F=A3?= =?UTF-8?q?=E4=B8=8D=E4=BC=9A=E5=8A=A8=E6=80=81=E6=9B=B4=E6=94=B9=E7=9A=84?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 5 +++- src/api/axios.config.ts | 2 ++ src/api/http.ts | 2 +- src/api/path/index.ts | 2 ++ src/api/path/{project.ts => project.api.ts} | 18 ++++++------- src/api/path/system.api.ts | 14 ++++++++-- src/hooks/index.ts | 3 ++- src/hooks/useSystemInit.hook.ts | 23 ++++++++++++++++ src/settings/httpSetting.ts | 2 +- .../modules/systemStore/systemStore.d.ts | 10 ++++++- src/store/modules/systemStore/systemStore.ts | 16 ++++++++--- src/utils/router.ts | 2 +- .../components/CanvasPage/index.vue | 10 +++++-- .../chart/ContentHeader/headerTitle/index.vue | 2 +- src/views/chart/hooks/useSync.hook.ts | 12 +++++++-- src/views/login/index.vue | 27 +++++++++---------- .../ProjectItemsList/hooks/useData.hook.ts | 2 +- .../components/CreateModal/index.vue | 2 +- 18 files changed, 113 insertions(+), 41 deletions(-) create mode 100644 src/api/path/index.ts rename src/api/path/{project.ts => project.api.ts} (58%) create mode 100644 src/hooks/useSystemInit.hook.ts diff --git a/src/App.vue b/src/App.vue index 1865e459..29687f9a 100644 --- a/src/App.vue +++ b/src/App.vue @@ -18,7 +18,7 @@ import { zhCN, dateZhCN, NConfigProvider } from 'naive-ui' import { GoAppProvider } from '@/components/GoAppProvider' import { I18n } from '@/components/I18n' -import { useDarkThemeHook, useThemeOverridesHook, useCode } from '@/hooks' +import { useSystemInit, useDarkThemeHook, useThemeOverridesHook, useCode } from '@/hooks' // 暗黑主题 const darkTheme = useDarkThemeHook() @@ -28,4 +28,7 @@ const overridesTheme = useThemeOverridesHook() // 代码主题 const hljsTheme = useCode() + +// 系统全局数据初始化 +useSystemInit() diff --git a/src/api/axios.config.ts b/src/api/axios.config.ts index c42121c0..5c976c7c 100644 --- a/src/api/axios.config.ts +++ b/src/api/axios.config.ts @@ -4,6 +4,8 @@ import { ModuleTypeEnum } from '@/enums/httpEnum' export const fetchAllowList = [ // 登录 `${ModuleTypeEnum.SYSTEM}/login`, + // 获取 OSS 接口 + `${ModuleTypeEnum.SYSTEM}/getOssInfo`, // 预览获取数据 `${ModuleTypeEnum.PROJECT}/getData`, ] diff --git a/src/api/http.ts b/src/api/http.ts index ff1bf95e..6f3b2eff 100644 --- a/src/api/http.ts +++ b/src/api/http.ts @@ -20,7 +20,7 @@ export const post = (url: string, data?: object, headersType?: string) => { }) } -export const put = (url: string, data?: object, headersType?: string) => { +export const put = (url: string, data?: object, headersType?: ContentTypeEnum) => { return axiosInstance({ url: url, method: RequestHttpEnum.PUT, diff --git a/src/api/path/index.ts b/src/api/path/index.ts new file mode 100644 index 00000000..66594d27 --- /dev/null +++ b/src/api/path/index.ts @@ -0,0 +1,2 @@ +export * from '@/api/path/project.api' +export * from '@/api/path/system.api' \ No newline at end of file diff --git a/src/api/path/project.ts b/src/api/path/project.api.ts similarity index 58% rename from src/api/path/project.ts rename to src/api/path/project.api.ts index 6d05ced8..5123ff2f 100644 --- a/src/api/path/project.ts +++ b/src/api/path/project.api.ts @@ -5,7 +5,7 @@ import { ContentTypeEnum, RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEn // * 项目列表 export const projectListApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.PROJECT}/list`, data); + const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/list`, data); return res; } catch { httpErrorHandle(); @@ -15,7 +15,7 @@ export const projectListApi = async (data: object) => { // * 新增项目 export const createProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/create`, data); + const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/create`, data); return res; } catch { httpErrorHandle(); @@ -25,7 +25,7 @@ export const createProjectApi = async (data: object) => { // * 获取项目 export const fetchProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.PROJECT}/getData`, data); + const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/getData`, data); return res; } catch { httpErrorHandle(); @@ -35,7 +35,7 @@ export const fetchProjectApi = async (data: object) => { // * 保存项目 export const saveProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/save/data`, data, ContentTypeEnum.FORM_URLENCODED); + const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/save/data`, data, ContentTypeEnum.FORM_URLENCODED); return res; } catch { httpErrorHandle(); @@ -45,7 +45,7 @@ export const saveProjectApi = async (data: object) => { // * 修改项目基础信息 export const updateProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/edit`, data); + const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/edit`, data); return res; } catch { httpErrorHandle(); @@ -56,7 +56,7 @@ export const updateProjectApi = async (data: object) => { // * 删除项目 export const deleteProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.DELETE)(`/api/goview/${ModuleTypeEnum.PROJECT}/delete`, data); + const res = await http(RequestHttpEnum.DELETE)(`${ModuleTypeEnum.PROJECT}/delete`, data); return res; } catch { httpErrorHandle(); @@ -66,7 +66,7 @@ export const deleteProjectApi = async (data: object) => { // * 修改发布状态 [-1未发布,1发布] export const changeProjectReleaseApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.PUT)(`/api/goview/${ModuleTypeEnum.PROJECT}/publish`, data); + const res = await http(RequestHttpEnum.PUT)(`${ModuleTypeEnum.PROJECT}/publish`, data); return res; } catch { httpErrorHandle(); @@ -74,9 +74,9 @@ export const changeProjectReleaseApi = async (data: object) => { } // * 上传文件 -export const uploadFile = async (data: object) => { +export const uploadFile = async (url:string, data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`oss/object/v2-cloud`, data, ContentTypeEnum.FORM_DATA); + const res = await http(RequestHttpEnum.POST)(url, data, ContentTypeEnum.FORM_DATA); return res; } catch { httpErrorHandle(); diff --git a/src/api/path/system.api.ts b/src/api/path/system.api.ts index 522c17c9..499194c7 100644 --- a/src/api/path/system.api.ts +++ b/src/api/path/system.api.ts @@ -5,7 +5,7 @@ import { RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEnum' // * 登录 export const loginApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.SYSTEM}/login`, data); + const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.SYSTEM}/login`, data); return res; } catch(err) { httpErrorHandle(); @@ -15,7 +15,17 @@ export const loginApi = async (data: object) => { // * 登出 export const logoutApi = async () => { try { - const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.SYSTEM}/logout`); + const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/logout`); + return res; + } catch(err) { + httpErrorHandle(); + } +} + +// * 获取 oss 上传接口 +export const ossUrlApi = async (data: object) => { + try { + const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/getOssInfo`, data); return res; } catch(err) { httpErrorHandle(); diff --git a/src/hooks/index.ts b/src/hooks/index.ts index 16b0bb69..c1d5037b 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1,4 +1,5 @@ export * from '@/hooks/useTheme.hook' export * from '@/hooks/usePreviewScale.hook' export * from '@/hooks/useCode.hook' -export * from '@/hooks/useChartDataFetch.hook' \ No newline at end of file +export * from '@/hooks/useChartDataFetch.hook' +export * from '@/hooks/useSystemInit.hook' \ No newline at end of file diff --git a/src/hooks/useSystemInit.hook.ts b/src/hooks/useSystemInit.hook.ts new file mode 100644 index 00000000..7e8f7573 --- /dev/null +++ b/src/hooks/useSystemInit.hook.ts @@ -0,0 +1,23 @@ +import { useSystemStore } from '@/store/modules/systemStore/systemStore' +import { SystemStoreEnum } from '@/store/modules/systemStore/systemStore.d' +import { ResultEnum } from '@/enums/httpEnum' +import { ossUrlApi } from '@/api/path/' + + +// * 初始化 +export const useSystemInit = async () => { + const systemStore = useSystemStore() + + // 获取 OSS 信息 + const getOssUrl = async () => { + const res: any = await ossUrlApi({}) + if (res.code === ResultEnum.SUCCESS) { + systemStore.setItem(SystemStoreEnum.FETCH_INFO, { + OSSUrl: res.data?.bucketURL + }) + } + } + + // 执行 + getOssUrl() +} \ No newline at end of file diff --git a/src/settings/httpSetting.ts b/src/settings/httpSetting.ts index 7b3962d4..9e9334bf 100644 --- a/src/settings/httpSetting.ts +++ b/src/settings/httpSetting.ts @@ -1,2 +1,2 @@ // 请求前缀 -export const axiosPre = '/goview' \ No newline at end of file +export const axiosPre = '/api/goview' \ No newline at end of file diff --git a/src/store/modules/systemStore/systemStore.d.ts b/src/store/modules/systemStore/systemStore.d.ts index acdc8120..77f5c348 100644 --- a/src/store/modules/systemStore/systemStore.d.ts +++ b/src/store/modules/systemStore/systemStore.d.ts @@ -12,10 +12,18 @@ export interface UserInfoType { [SystemStoreUserInfoEnum.NICK_NAME]?: string, } +export interface FetchInfoType { + OSSUrl?: string, +} + export enum SystemStoreEnum { - USER_INFO = 'userInfo' + // 用户 + USER_INFO = 'userInfo', + // 请求 + FETCH_INFO = 'fetchInfo' } export interface SystemStoreType { [SystemStoreEnum.USER_INFO]: UserInfoType + [SystemStoreEnum.FETCH_INFO]: FetchInfoType } \ No newline at end of file diff --git a/src/store/modules/systemStore/systemStore.ts b/src/store/modules/systemStore/systemStore.ts index a1e11b15..bb507f2a 100644 --- a/src/store/modules/systemStore/systemStore.ts +++ b/src/store/modules/systemStore/systemStore.ts @@ -1,5 +1,5 @@ import { defineStore } from 'pinia' -import { SystemStoreType, SystemStoreEnum } from './systemStore.d' +import { SystemStoreType, UserInfoType, FetchInfoType } from './systemStore.d' import { setLocalStorage, getLocalStorage } from '@/utils' import { StorageEnum } from '@/enums/storageEnum' @@ -16,13 +16,23 @@ export const useSystemStore = defineStore({ userName: undefined, userToken: undefined, nickName: undefined + }, + fetchInfo: { + OSSUrl: undefined } }, - getters: {}, + getters: { + getUserInfo(): UserInfoType { + return this.userInfo + }, + getFetchInfo(): FetchInfoType { + return this.fetchInfo + }, + }, actions: { setItem(key: T, value: K): void { this.$patch(state => { - state[key]= value + state[key] = value }); setLocalStorage(GO_SYSTEM_STORE, this.$state) } diff --git a/src/utils/router.ts b/src/utils/router.ts index db3d6134..4fd5bb9a 100644 --- a/src/utils/router.ts +++ b/src/utils/router.ts @@ -6,7 +6,7 @@ import { SystemStoreEnum, SystemStoreUserInfoEnum } from '@/store/modules/system import { StorageEnum } from '@/enums/storageEnum' import { clearLocalStorage, getLocalStorage, clearCookie } from './storage' import router from '@/router' -import { logoutApi } from '@/api/path/system.api' +import { logoutApi } from '@/api/path' /** * * 根据名字跳转路由 diff --git a/src/views/chart/ContentConfigurations/components/CanvasPage/index.vue b/src/views/chart/ContentConfigurations/components/CanvasPage/index.vue index 8964c093..25a75aac 100644 --- a/src/views/chart/ContentConfigurations/components/CanvasPage/index.vue +++ b/src/views/chart/ContentConfigurations/components/CanvasPage/index.vue @@ -128,18 +128,20 @@ import { backgroundImageSize } from '@/settings/designSetting' import { FileTypeEnum } from '@/enums/fileTypeEnum' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { EditCanvasConfigEnum } from '@/store/modules/chartEditStore/chartEditStore.d' +import { useSystemStore } from '@/store/modules/systemStore/systemStore' import { StylesSetting } from '@/components/Pages/ChartItemSetting' import { UploadCustomRequestOptions } from 'naive-ui' import { fileToUrl, loadAsyncComponent, fetchRouteParamsLocation } from '@/utils' import { PreviewScaleEnum } from '@/enums/styleEnum' import { ResultEnum } from '@/enums/httpEnum' import { icon } from '@/plugins' -import { uploadFile} from '@/api/path/project' +import { uploadFile} from '@/api/path' const { ColorPaletteIcon } = icon.ionicons5 const { ZAxisIcon, ScaleIcon, FitToScreenIcon, FitToHeightIcon, FitToWidthIcon } = icon.carbon const chartEditStore = useChartEditStore() +const systemStore = useSystemStore() const canvasConfig = chartEditStore.getEditCanvasConfig const editCanvas = chartEditStore.getEditCanvas @@ -273,6 +275,10 @@ const switchSelectColorHandle = () => { const customRequest = (options: UploadCustomRequestOptions) => { const { file } = options nextTick(async () => { + if(!systemStore.getFetchInfo.OSSUrl) { + window['$message'].error('添加图片失败，请刷新页面重试！') + return + } if (file.file) { // 修改名称 const newNameFile = new File( @@ -282,7 +288,7 @@ const customRequest = (options: UploadCustomRequestOptions) => { ) let uploadParams = new FormData() uploadParams.append('object', newNameFile) - const uploadRes:any = await uploadFile(uploadParams) + const uploadRes:any = await uploadFile(systemStore.getFetchInfo.OSSUrl ,uploadParams) if(uploadRes.code === ResultEnum.SUCCESS) { chartEditStore.setEditCanvasConfig( diff --git a/src/views/chart/ContentHeader/headerTitle/index.vue b/src/views/chart/ContentHeader/headerTitle/index.vue index a56f2556..87c7884c 100644 --- a/src/views/chart/ContentHeader/headerTitle/index.vue +++ b/src/views/chart/ContentHeader/headerTitle/index.vue @@ -29,7 +29,7 @@ import { ResultEnum } from '@/enums/httpEnum' import { fetchRouteParamsLocation, httpErrorHandle } from '@/utils' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { ProjectInfoEnum } from '@/store/modules/chartEditStore/chartEditStore.d' -import { updateProjectApi } from '@/api/path/project' +import { updateProjectApi } from '@/api/path' import { useSync } from '../../hooks/useSync.hook' import { icon } from '@/plugins' diff --git a/src/views/chart/hooks/useSync.hook.ts b/src/views/chart/hooks/useSync.hook.ts index 6022bf16..3c1acb17 100644 --- a/src/views/chart/hooks/useSync.hook.ts +++ b/src/views/chart/hooks/useSync.hook.ts @@ -4,13 +4,14 @@ import { getUUID, httpErrorHandle, fetchRouteParamsLocation, base64toFile } from import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { EditCanvasTypeEnum, ChartEditStoreEnum, ProjectInfoEnum, ChartEditStorage } from '@/store/modules/chartEditStore/chartEditStore.d' import { useChartHistoryStore } from '@/store/modules/chartHistoryStore/chartHistoryStore' +import { useSystemStore } from '@/store/modules/systemStore/systemStore' import { fetchChartComponent, createComponent } from '@/packages/index' import { CreateComponentType } from '@/packages/index.d' import { saveInterval } from '@/settings/designSetting' // 接口状态 import { ResultEnum } from '@/enums/httpEnum' // 接口 -import { saveProjectApi, fetchProjectApi, uploadFile, updateProjectApi } from '@/api/path/project' +import { saveProjectApi, fetchProjectApi, uploadFile, updateProjectApi } from '@/api/path' // 画布枚举 import { SyncEnum } from '@/enums/editPageEnum' @@ -18,6 +19,7 @@ import { SyncEnum } from '@/enums/editPageEnum' export const useSync = () => { const chartEditStore = useChartEditStore() const chartHistoryStore = useChartHistoryStore() + const systemStore = useSystemStore() /** * * 组件动态注册 @@ -112,6 +114,12 @@ export const useSync = () => { // * 数据保存 const dataSyncUpdate = async () => { if(!fetchRouteParamsLocation()) return + + if(!systemStore.getFetchInfo.OSSUrl) { + window['$message'].error('数据保存失败，请刷新页面重试！') + return + } + chartEditStore.setEditCanvas(EditCanvasTypeEnum.SAVE_STATUS, SyncEnum.START) // 获取缩略图片 @@ -127,7 +135,7 @@ export const useSync = () => { // 上传预览图 let uploadParams = new FormData() uploadParams.append('object', base64toFile(canvasImage.toDataURL(), `${fetchRouteParamsLocation()}_index_preview.png`)) - const uploadRes:any = await uploadFile(uploadParams) + const uploadRes:any = await uploadFile(systemStore.getFetchInfo.OSSUrl, uploadParams) // 保存预览图 if(uploadRes.code === ResultEnum.SUCCESS) { await updateProjectApi({ diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 616ecae8..6a881a6e 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -119,16 +119,16 @@ import { reactive, ref, onMounted } from 'vue' import shuffle from 'lodash/shuffle' import { carouselInterval } from '@/settings/designSetting' import { useSystemStore } from '@/store/modules/systemStore/systemStore' -import { SystemStoreEnum, SystemStoreUserInfoEnum } from '@/store/modules/systemStore/systemStore.d' +import { SystemStoreEnum } from '@/store/modules/systemStore/systemStore.d' import { GoThemeSelect } from '@/components/GoThemeSelect' import { GoLangSelect } from '@/components/GoLangSelect' import { LayoutHeader } from '@/layout/components/LayoutHeader' import { LayoutFooter } from '@/layout/components/LayoutFooter' import { PageEnum } from '@/enums/pageEnum' -import { icon } from '@/plugins' import { StorageEnum } from '@/enums/storageEnum' +import { icon } from '@/plugins' import { routerTurnByName } from '@/utils' -import { loginApi } from '@/api/path/system.api' +import { loginApi } from '@/api/path' interface FormState { username: string @@ -147,15 +147,6 @@ const systemStore = useSystemStore() const t = window['$t'] -onMounted(() => { - setTimeout(() => { - show.value = true - }, 300) - setTimeout(() => { - showBg.value = true - }, 100) -}) - const formInline = reactive({ username: 'admin', password: 'admin', @@ -198,7 +189,7 @@ const getImageUrl = (name: string, folder: string) => { return new URL(`../../assets/images/${folder}/${name}.png`, import.meta.url).href } -// 打乱 +// 打乱图片顺序 const shuffleHandle = () => { shuffleTimiing.value = setInterval(() => { bgList.value = shuffle(bgList.value) @@ -239,6 +230,14 @@ const handleSubmit = async (e: Event) => { } onMounted(() => { + setTimeout(() => { + show.value = true + }, 300) + + setTimeout(() => { + showBg.value = true + }, 100) + shuffleHandle() }) @@ -326,7 +325,7 @@ $carousel-image-height: 60vh; align-items: center; width: 100vw; height: 100vh; - background: url('../../assets/images/login/login-bg.png') no-repeat 0 -120px; + background: url('@/assets/images/login/login-bg.png') no-repeat 0 -120px; .bg-slot { width: $carousel-width; } diff --git a/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts b/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts index ef8e050d..29a87f1f 100644 --- a/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts +++ b/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts @@ -1,7 +1,7 @@ import { ref, reactive } from 'vue'; import { goDialog, httpErrorHandle } from '@/utils' import { DialogEnum } from '@/enums/pluginEnum' -import { projectListApi, deleteProjectApi, changeProjectReleaseApi } from '@/api/path/project' +import { projectListApi, deleteProjectApi, changeProjectReleaseApi } from '@/api/path' import { Chartype, ChartList } from '../../../index.d' import { ResultEnum } from '@/enums/httpEnum' diff --git a/src/views/project/layout/components/ProjectLayoutCreate/components/CreateModal/index.vue b/src/views/project/layout/components/ProjectLayoutCreate/components/CreateModal/index.vue index 4c77f4ac..6d6384e0 100644 --- a/src/views/project/layout/components/ProjectLayoutCreate/components/CreateModal/index.vue +++ b/src/views/project/layout/components/ProjectLayoutCreate/components/CreateModal/index.vue @@ -40,7 +40,7 @@ import { icon } from '@/plugins' import { PageEnum, ChartEnum } from '@/enums/pageEnum' import { ResultEnum } from '@/enums/httpEnum' import { fetchPathByName, routerTurnByPath, renderLang, getUUID } from '@/utils' -import { createProjectApi } from '@/api/path/project' +import { createProjectApi } from '@/api/path' const { FishIcon, CloseIcon } = icon.ionicons5 const { StoreIcon, ObjectStorageIcon } = icon.carbon