From d8ef42326909eb6f6c8a7fb5bb9038a47f95e97e Mon Sep 17 00:00:00 2001
From: husq <931347610@qq.com>
Date: Mon, 25 Sep 2023 16:00:57 +0800
Subject: [PATCH] 添加路由权限
---
src/api/http/config.ts | 8 ++--
src/components/MediaPanel.vue | 42 ++++++++++----------
src/pages/page-web/home.vue | 10 ++--
src/main.ts | 11 +++++
src/permission.ts | 28 ++++++++++++++
5 files changed, 69 insertions(+), 30 deletions(-)
diff --git a/src/api/http/config.ts b/src/api/http/config.ts
index d4f85b3..56b0d3d 100644
--- a/src/api/http/config.ts
+++ b/src/api/http/config.ts
@@ -8,13 +8,13 @@
// http
// http://172.16.13.64:8100
// baseURL: 'http://192.168.1.133:6789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
- baseURL: 'http://192.168.1.198:6789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
- // baseURL: 'https://dev.jxpskj.com:36789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
+ // baseURL: 'http://192.168.1.198:6789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
+ baseURL: 'https://dev.jxpskj.com:36789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
// ws: 'ws//127.0.0.1:6789/api/v1/ws',
// ws://192.168.1.198:1883/
- websocketURL: 'ws://192.168.1.198:6789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
+ // websocketURL: 'ws://192.168.1.198:6789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
// websocketURL: 'ws://192.168.1.133:6789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
- // websocketURL: 'wss://dev.jxpskj.com:36789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
+ websocketURL: 'wss://dev.jxpskj.com:36789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
// livestreaming
// RTMP Note: This IP is the address of the streaming server. If you want to see livestream on web page, you need to convert the RTMP stream to WebRTC stream.
diff --git a/src/components/MediaPanel.vue b/src/components/MediaPanel.vue
index cd80ad7..9a25b3a 100644
--- a/src/components/MediaPanel.vue
+++ b/src/components/MediaPanel.vue
@@ -55,16 +55,16 @@
</template>
<script setup lang="ts">
-import {ref} from '@vue/reactivity'
-import {TableState} from 'ant-design-vue/lib/table/interface'
-import {onMounted, reactive} from 'vue'
-import {IPage} from '../api/http/type'
-import {ELocalStorageKey} from '../types/enums'
-import {downloadFile} from '../utils/common'
-import {downloadMediaFile, getMediaFiles, MediaQueryParam} from '/@/api/media'
-import {DownloadOutlined} from '@ant-design/icons-vue'
-import {message, Pagination} from 'ant-design-vue'
-import {TaskStatus, TaskStatusMap} from '/@/types/task'
+import { ref } from '@vue/reactivity'
+import { TableState } from 'ant-design-vue/lib/table/interface'
+import { onMounted, reactive } from 'vue'
+import { IPage } from '../api/http/type'
+import { ELocalStorageKey } from '../types/enums'
+import { downloadFile } from '../utils/common'
+import { downloadMediaFile, getMediaFiles, MediaQueryParam } from '/@/api/media'
+import { DownloadOutlined } from '@ant-design/icons-vue'
+import { message, Pagination } from 'ant-design-vue'
+import { TaskStatus, TaskStatusMap } from '/@/types/task'
const workspaceId = localStorage.getItem(ELocalStorageKey.WorkspaceId)!
const loading = ref(false)
@@ -78,8 +78,8 @@
})
const subFileTypeOptions = [
- {value: 0, label: '普通图片'},
- {value: 1, label: '全景图'},
+ { value: 0, label: '普通图片' },
+ { value: 1, label: '全景图' },
]
const payloadOptions = []
@@ -96,7 +96,7 @@
title: '文件名称',
dataIndex: 'file_name',
ellipsis: true,
- slots: {customRender: 'name'}
+ slots: { customRender: 'name' }
},
// {
// title: '文件路径',
@@ -127,7 +127,7 @@
},
{
title: '操作',
- slots: {customRender: 'action'}
+ slots: { customRender: 'action' }
}
]
const body: IPage = {
@@ -165,27 +165,27 @@
getFiles()
})
-function dateChange(value: any) {
+function dateChange (value: any) {
searchQuery.startTime = value[0]
searchQuery.endTime = value[1]
getFiles()
}
-function subFileTypeChange(value: any) {
+function subFileTypeChange (value: any) {
searchQuery.subFileType = value.join(',')
getFiles()
}
-function payloadChange(value: any) {
+function payloadChange (value: any) {
searchQuery.payload = value.join(',')
getFiles()
}
-function inputChange(searchValue: string) {
+function inputChange (searchValue: string) {
getFiles()
}
-function getFiles() {
+function getFiles () {
getMediaFiles(workspaceId, body, searchQuery).then(res => {
mediaData.data = res.data.list
paginationProp.total = res.data.pagination.total
@@ -194,13 +194,13 @@
})
}
-function refreshData(page: Pagination) {
+function refreshData (page: Pagination) {
body.page = page?.current!
body.page_size = page?.pageSize!
getFiles()
}
-function downloadMedia(media: MediaFile) {
+function downloadMedia (media: MediaFile) {
loading.value = true
downloadMediaFile(workspaceId, media.file_id).then(res => {
if (!res) {
diff --git a/src/main.ts b/src/main.ts
index a9a2568..f0da572 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,3 +1,13 @@
+/*
+ * @Author: husq 931347610@qq.com
+ * @Date: 2023-09-13 18:21:07
+ * @LastEditors: husq 931347610@qq.com
+ * @LastEditTime: 2023-09-25 15:54:31
+ * @FilePath: \Cloud-API-Demo-Web\src\main.ts
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+ */
import App from './App.vue'
import router from './router'
import { antComponents } from './antd'
@@ -5,6 +15,7 @@
import 'virtual:svg-icons-register'
import store, { storeKey } from './store'
import { createInstance } from '/@/root'
+import './permission'
import '/@/styles/index.scss'
const app = createInstance(App) // 引入css
app.use(store, storeKey)
diff --git a/src/pages/page-web/home.vue b/src/pages/page-web/home.vue
index fc9b149..bc0ad4d 100644
--- a/src/pages/page-web/home.vue
+++ b/src/pages/page-web/home.vue
@@ -17,11 +17,11 @@
<script lang="ts" setup>
import zhCN from 'ant-design-vue/es/locale/zh_CN'
import Topbar from '/@/components/common/topbar.vue'
-import {onMounted, reactive, ref, UnwrapRef, watch} from 'vue'
-import {getRoot} from '/@/root'
-import {useRoute} from 'vue-router'
-import {EBizCode, ELocalStorageKey, ERouterName} from '/@/types'
-import {useConnectWebSocket} from '/@/hooks/use-connect-websocket'
+import { onMounted, reactive, ref, UnwrapRef, watch } from 'vue'
+import { getRoot } from '/@/root'
+import { useRoute } from 'vue-router'
+import { EBizCode, ELocalStorageKey, ERouterName } from '/@/types'
+import { useConnectWebSocket } from '/@/hooks/use-connect-websocket'
import EventBus from '/@/event-bus'
interface FormState {
diff --git a/src/permission.ts b/src/permission.ts
new file mode 100644
index 0000000..ef49837
--- /dev/null
+++ b/src/permission.ts
@@ -0,0 +1,28 @@
+import { ELocalStorageKey, ERouterName } from './types/enums'
+import router from '/@/router/index'
+
+const whiteList = ['/' + ERouterName.LOGIN] // 设置白名单
+
+router.beforeEach(async (to, from, next) => {
+ // 确定用户是否已登录过，存在Token
+ const hasToken = localStorage.getItem(ELocalStorageKey.Token)
+
+ if (hasToken) {
+ if (to.path === '/' + ERouterName.LOGIN) {
+ // 如果已登录，请重定向到主页
+ next({ path: '/' + ERouterName.PROJECT_LIST })
+ } else {
+ try {
+ next() // // 如果不传参数就会重新执行路由拦截，重新进到这里
+ } catch (error) {
+ next(`/${ERouterName.LOGIN}?redirect=${to.path}`)
+ }
+ }
+ } else {
+ if (whiteList.indexOf(to.path) !== -1) {
+ next()
+ } else {
+ next(`/${ERouterName.LOGIN}?redirect=${to.path}`)
+ }
+ }
+})
--
Gitblit v1.9.3