From 88a22d90e5c918d480d4295afcdd85394b013f85 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Thu, 26 Oct 2023 16:19:22 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E9=92=89=E9=92=89=E7=BB=91?=
 =?UTF-8?q?=E5=AE=9A=E5=A4=B1=E8=B4=A5=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Profile/Index.vue                 | 11 +++++-----
 src/views/Profile/components/UserSocial.vue | 24 ++++++++++++++++-----
 2 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/src/views/Profile/Index.vue b/src/views/Profile/Index.vue
index b05f93cc..8e1695b5 100644
--- a/src/views/Profile/Index.vue
+++ b/src/views/Profile/Index.vue
@@ -15,7 +15,7 @@
         </div>
       </template>
       <div>
-        <el-tabs v-model="activeName" tab-position="top" style="height: 400px" class="profile-tabs">
+        <el-tabs v-model="activeName" class="profile-tabs" style="height: 400px" tab-position="top">
           <el-tab-pane :label="t('profile.info.basicInfo')" name="basicInfo">
             <BasicInfo />
           </el-tab-pane>
@@ -23,17 +23,18 @@
             <ResetPwd />
           </el-tab-pane>
           <el-tab-pane :label="t('profile.info.userSocial')" name="userSocial">
-            <UserSocial />
+            <UserSocial v-model:activeName="activeName" />
           </el-tab-pane>
         </el-tabs>
       </div>
     </el-card>
   </div>
 </template>
-<script setup lang="ts" name="Profile">
-import { BasicInfo, ProfileUser, ResetPwd, UserSocial } from './components/'
-const { t } = useI18n()
+<script lang="ts" setup>
+import { BasicInfo, ProfileUser, ResetPwd, UserSocial } from './components'
 
+const { t } = useI18n()
+defineOptions({ name: 'Profile' })
 const activeName = ref('basicInfo')
 </script>
 <style scoped>
diff --git a/src/views/Profile/components/UserSocial.vue b/src/views/Profile/components/UserSocial.vue
index 2f021abf..7746f510 100644
--- a/src/views/Profile/components/UserSocial.vue
+++ b/src/views/Profile/components/UserSocial.vue
@@ -27,12 +27,15 @@ import { getUserProfile, ProfileVO } from '@/api/system/user/profile'
 import { socialAuthRedirect, socialBind, socialUnbind } from '@/api/system/user/socialUser'
 
 defineOptions({ name: 'UserSocial' })
-
+defineProps<{
+  activeName: string
+}>()
 const message = useMessage()
 const socialUsers = ref<any[]>([])
 const userInfo = ref<ProfileVO>()
 
 const initSocial = async () => {
+  socialUsers.value = [] // 重置避免无限增长
   const res = await getUserProfile()
   userInfo.value = res
   for (const i in SystemUserSocialTypeEnum) {
@@ -49,9 +52,12 @@ const initSocial = async () => {
   }
 }
 const route = useRoute()
+const emit = defineEmits<{
+  (e: 'update:activeName', v: string): void
+}>()
 const bindSocial = () => {
   // 社交绑定
-  const type = route.query.type
+  const type = getUrlValue('type')
   const code = route.query.code
   const state = route.query.state
   if (!code) {
@@ -59,11 +65,20 @@ const bindSocial = () => {
   }
   socialBind(type, code, state).then(() => {
     message.success('绑定成功')
+    emit('update:activeName', 'userSocial')
     initSocial()
   })
 }
+
+// 双层 encode 需要在回调后进行 decode
+function getUrlValue(key: string): string {
+  const url = new URL(decodeURIComponent(location.href))
+  return url.searchParams.get(key) ?? ''
+}
+
 const bind = (row) => {
-  const redirectUri = location.origin + '/user/profile?type=' + row.type
+  // 双层 encode 解决钉钉回调 type 参数丢失的问题
+  const redirectUri = location.origin + '/user/profile?' + encodeURIComponent(`type=${row.type}`)
   // 进行跳转
   socialAuthRedirect(row.type, encodeURIComponent(redirectUri)).then((res) => {
     window.location.href = res
@@ -83,9 +98,8 @@ onMounted(async () => {
 
 watch(
   () => route,
-  (newRoute) => {
+  () => {
     bindSocial()
-    console.log(newRoute)
   },
   {
     immediate: true