Bladeren bron

fix: 修改oss接口不会动态更改的问题

奔跑的面条 3 jaren geleden
bovenliggende
commit
2ceca7287f

+ 4 - 1
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()
 </script>

+ 2 - 0
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`,
 ]

+ 1 - 1
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,

+ 2 - 0
src/api/path/index.ts

@@ -0,0 +1,2 @@
+export * from '@/api/path/project.api'
+export * from '@/api/path/system.api'

+ 9 - 9
src/api/path/project.ts → 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();

+ 12 - 2
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();

+ 2 - 1
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'
+export * from '@/hooks/useChartDataFetch.hook'
+export * from '@/hooks/useSystemInit.hook'

+ 23 - 0
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()
+}

+ 1 - 1
src/settings/httpSetting.ts

@@ -1,2 +1,2 @@
 // 请求前缀
-export const axiosPre = '/goview'
+export const axiosPre = '/api/goview'

+ 9 - 1
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
 }

+ 13 - 3
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<T extends keyof SystemStoreType, K extends SystemStoreType[T]>(key: T, value: K): void {
       this.$patch(state => {
-        state[key]= value
+        state[key] = value
       });
       setLocalStorage(GO_SYSTEM_STORE, this.$state)
     }

+ 1 - 1
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'
 
 /**
  * * 根据名字跳转路由

+ 8 - 2
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(

+ 1 - 1
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'
 

+ 10 - 2
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({

+ 13 - 14
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()
 })
 </script>
@@ -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;
     }

+ 1 - 1
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'
 

+ 1 - 1
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