feat: Oauth

src/store/app.js

@@ -7,7 +7,7 @@ import ru from 'element-plus/es/locale/lang/ru'
 import fr from 'element-plus/es/locale/lang/fr'
 import es from 'element-plus/es/locale/lang/es'
 import zhTw from 'element-plus/es/locale/lang/zh-tw'
-import { admin, app } from '@/api/config'
+import { admin, app, server } from '@/api/config'
 
 const langs = {
   'zh-CN': { name: '中文', value: zhCn, sideBarWidth: '210px' },
@@ -33,6 +33,12 @@ export const useAppStore = defineStore({
       appConfig: {
         web_client: 1,
       },
+      rustdeskConfig: {
+        'id_server': '',
+        'key': '',
+        'relay_server': '',
+        'api_server': '',
+      },
     },
   }),
 
@@ -52,6 +58,7 @@ export const useAppStore = defineStore({
     loadConfig () {
       this.getAppConfig()
       this.getAdminConfig()
+      this.loadRustdeskConfig()
     },
     getAppConfig () {
       console.log('getAppConfig')
@@ -70,6 +77,18 @@ export const useAppStore = defineStore({
       document.title = document.title.replace(`- ${this.setting.title}`, `- ${newTitle}`)
       this.setting.title = newTitle
     },
+    async loadRustdeskConfig () {
+      console.log('loadRustdeskConfig')
+      const res = await server().catch(_ => false)
+      if (res) {
+        this.setting.rustdeskConfig = res.data
+        const prefix = 'wc-'
+        localStorage.setItem(`${prefix}custom-rendezvous-server`, res.data.id_server)
+        localStorage.setItem(`${prefix}key`, res.data.key)
+        localStorage.setItem(`${prefix}api-server`, res.data.api_server)
+      }
+
+    },
   },
 })
 

src/utils/webclient.js

@@ -1,40 +1,22 @@
-import { ref } from 'vue'
-import { server } from '@/api/config'
 import Websock from '@/utils/webclient/websock'
 import * as rendezvous from '@/utils/webclient/rendezvous'
 import * as message from '@/utils/webclient/message'
 import { ElMessageBox } from 'element-plus'
 import { T } from '@/utils/i18n'
+import { useAppStore } from '@/store/app'
 
-const prefix = 'wc-'
+
+
+const app = useAppStore()
 
 export const toWebClientLink = (row) => {
   //v2
-  window.open(`${rustdeskConfig.value.api_server}/webclient2/#/${row.id}`)
+  console.log(app.setting.rustdeskConfig)
+  window.open(`${app.setting.rustdeskConfig.api_server}/webclient2/#/${row.id}`)
 }
 
-export const rustdeskConfig = ref({})
-
-export async function loadRustdeskConfig () {
-  console.log('loadRustdeskConfig')
-  if (rustdeskConfig.value.id_server === undefined || rustdeskConfig.value.key === undefined) {
-    const res = await server().catch(_ => false)
-    if (res) {
-      rustdeskConfig.value = res.data
-      localStorage.setItem(`${prefix}custom-rendezvous-server`, res.data.id_server)
-      localStorage.setItem(`${prefix}key`, res.data.key)
-      localStorage.setItem(`${prefix}api-server`, res.data.api_server)
-    }
-  }
-  return {
-    rustdeskConfig,
-  }
-}
-
-loadRustdeskConfig()
-
 export async function getPeerSlat (id) {
-  const [addr, port] = rustdeskConfig.value.id_server.split(':')
+  const [addr, port] = app.setting.rustdeskConfig.value.id_server.split(':')
   if (!addr) {
     return
   }
@@ -45,7 +27,7 @@ export async function getPeerSlat (id) {
   const nat_type = rendezvous.NatType.SYMMETRIC
   const punch_hole_request = rendezvous.PunchHoleRequest.fromPartial({
     id,
-    licence_key: rustdeskConfig.value.key || undefined,
+    licence_key: app.setting.rustdeskConfig.value.key || undefined,
     conn_type,
     nat_type,
     token: undefined,
@@ -87,7 +69,7 @@ export async function getPeerSlat (id) {
     await _ws.open()
     console.log(new Date() + ': Connected to relay server')
     const request_relay = rendezvous.RequestRelay.fromPartial({
-      licence_key: rustdeskConfig.value.key || undefined,
+      licence_key: app.setting.rustdeskConfig.value.key || undefined,
       uuid,
     })
     _ws.sendRendezvous({ request_relay })
@@ -112,5 +94,5 @@ export async function getPeerSlat (id) {
 }
 
 export function getV2ShareUrl (token) {
-  return `${rustdeskConfig.value.api_server}/webclient2/#/?share_token=${token}`
+  return `${app.setting.rustdeskConfig.value.api_server}/webclient2/#/?share_token=${token}`
 }

src/views/oauth/index.vue

@@ -65,12 +65,7 @@
           </el-input>
         </el-form-item>
         <el-form-item label="RedirectUrl" prop="redirect_url">
-          <el-input
-            v-model="formData.redirect_url"
-            readonly
-            suffix-icon="el-icon-document-copy"
-            @click="copyRedirectUrl"
-          />
+          <div @click="copyRedirectUrl">{{formData.redirect_url}} <el-icon><CopyDocument></CopyDocument></el-icon></div>
         </el-form-item>
         <el-form-item label="PkceEnable" prop="pkce_enable">
           <el-switch v-model="formData.pkce_enable"
@@ -106,11 +101,13 @@
   import { list, create, update, detail, remove } from '@/api/oauth'
   import { ElMessage, ElMessageBox } from 'element-plus'
   import { T } from '@/utils/i18n'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { useAppStore } from '@/store/app'
+  import { CopyDocument } from '@element-plus/icons'
 
-  const copyRedirectUrl = () => {
-    navigator.clipboard.writeText(formData.redirect_url)
-      .then(() => ElMessage.success('Copied'))
-      .catch(() => ElMessage.error('Copy failed'))
+  const app = useAppStore()
+  const copyRedirectUrl = (e) => {
+    handleClipboard(formData.redirect_url, e)
   }
 
   const listRes = reactive({
@@ -203,7 +200,7 @@
   }
 
   const defaultRedirect = () => {
-    return `${window.location.origin}/api/oidc/callback`
+    return `${app.setting.rustdeskConfig.api_server||window.location.origin}/api/oidc/callback`
   }
 
   const toEdit = (row) => {