!27 qq解绑和重新绑定+ 优化登录管理界面UI

Merge pull request !27 from LemonTree/json_social_login
2025-12-17 16:36:03 +08:00 · 2022-04-24 15:23:36 +00:00
parent e86407130c afa550986a
commit 08b3607123
12 changed files with 571 additions and 84 deletions
--- a/springboot/pom.xml
+++ b/springboot/pom.xml
@@ -208,19 +208,7 @@
                <version>${wumei.version}</version>
            </dependency>

-            <!-- 第三方登录模块-->
-            <dependency>
-                <groupId>me.zhyd.oauth</groupId>
-                <artifactId>JustAuth</artifactId>
-                <version>${justAuth.version}</version>
-            </dependency>

-            <!-- 通用http接口模块-->
-            <dependency>
-                <groupId>com.dtflys.forest</groupId>
-                <artifactId>forest-spring-boot-starter</artifactId>
-                <version>${forest.version}</version>
-            </dependency>

        </dependencies>
    </dependencyManagement>
--- a/springboot/wumei-admin/src/main/java/com/ruoyi/web/controller/system/SysProfileController.java
+++ b/springboot/wumei-admin/src/main/java/com/ruoyi/web/controller/system/SysProfileController.java
@@ -1,15 +1,5 @@
 package com.ruoyi.web.controller.system;

-import java.io.IOException;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.PostMapping;
-import org.springframework.web.bind.annotation.PutMapping;
-import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestParam;
-import org.springframework.web.bind.annotation.RestController;
-import org.springframework.web.multipart.MultipartFile;
 import com.ruoyi.common.annotation.Log;
 import com.ruoyi.common.config.RuoYiConfig;
 import com.ruoyi.common.constant.UserConstants;
@@ -22,34 +12,42 @@ import com.ruoyi.common.utils.SecurityUtils;
 import com.ruoyi.common.utils.StringUtils;
 import com.ruoyi.common.utils.file.FileUploadUtils;
 import com.ruoyi.framework.web.service.TokenService;
+import com.ruoyi.iot.service.IUserSocialProfileService;
 import com.ruoyi.system.service.ISysUserService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.*;
+import org.springframework.web.multipart.MultipartFile;
+
+import java.io.IOException;

 /**
 * 个人信息 业务处理
- * 
+ *
 * @author ruoyi
 */
@RestController
@RequestMapping("/system/user/profile")
-public class SysProfileController extends BaseController
-{
+public class SysProfileController extends BaseController {
    @Autowired
    private ISysUserService userService;

    @Autowired
    private TokenService tokenService;

+    @Autowired
+    private IUserSocialProfileService iUserSocialProfileService;
+
    /**
     * 个人信息
     */
    @GetMapping
-    public AjaxResult profile()
-    {
+    public AjaxResult profile() {
        LoginUser loginUser = getLoginUser();
        SysUser user = loginUser.getUser();
        AjaxResult ajax = AjaxResult.success(user);
        ajax.put("roleGroup", userService.selectUserRoleGroup(loginUser.getUsername()));
        ajax.put("postGroup", userService.selectUserPostGroup(loginUser.getUsername()));
+        ajax.put("socialGroup", iUserSocialProfileService.selectUserSocialProfile(loginUser.getUserId()));
        return ajax;
    }

--- a/springboot/wumei-iot/pom.xml
+++ b/springboot/wumei-iot/pom.xml
@@ -74,17 +74,18 @@
            <version>3.8.0</version>
        </dependency>

-        <!--第三方登录通用接口-->
+        <!-- 第三方登录模块-->
        <dependency>
            <groupId>me.zhyd.oauth</groupId>
            <artifactId>JustAuth</artifactId>
-            <!--            <version>1.16.5</version>-->
+            <version>${justAuth.version}</version>
        </dependency>

-        <!--通用http接口-->
+        <!-- 通用http接口模块-->
        <dependency>
            <groupId>com.dtflys.forest</groupId>
            <artifactId>forest-spring-boot-starter</artifactId>
+            <version>${forest.version}</version>
        </dependency>


--- a/springboot/wumei-iot/src/main/java/com/ruoyi/iot/controller/UserSocialController.java
+++ b/springboot/wumei-iot/src/main/java/com/ruoyi/iot/controller/UserSocialController.java
@@ -0,0 +1,69 @@
+package com.ruoyi.iot.controller;
+
+import com.ruoyi.common.core.controller.BaseController;
+import com.ruoyi.common.core.domain.AjaxResult;
+import com.ruoyi.iot.service.IUserSocialProfileService;
+import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiImplicitParam;
+import io.swagger.annotations.ApiOperation;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+/**
+ * 第三方登录平台控制Controller
+ *
+ * @author json
+ * @date 2022-04-24
+ */
+@Api(tags = "用户社交账户api")
+@RestController
+@RequestMapping("/iot/social/")
+public class UserSocialController extends BaseController {
+
+    @Autowired
+    private IUserSocialProfileService iUserSocialProfileService;
+
+
+    /**
+     * 绑定
+     *
+     * @param bindId 绑定id
+     * @return
+     */
+    @GetMapping("/bindId/{bindId}")
+    @ApiOperation("绑定api")
+    @ApiImplicitParam(name = "bindId", value = "绑定bindId", required = true, dataType = "String", paramType = "path", dataTypeClass = String.class)
+    public AjaxResult bindUser(@PathVariable String bindId) {
+        return iUserSocialProfileService.bindUser(bindId, getUserId());
+    }
+
+
+    /**
+     * 绑定
+     *
+     * @param platform 绑定类型
+     * @return
+     */
+    @GetMapping("/bind/{platform}")
+    @ApiOperation("绑定跳转api")
+    @ApiImplicitParam(name = "platform", value = "绑定platform", required = true, dataType = "String", paramType = "path", dataTypeClass = String.class)
+    public AjaxResult bind(@PathVariable String platform) {
+        return iUserSocialProfileService.bindSocialAccount(platform);
+    }
+
+    /**
+     * 解绑
+     *
+     * @param socialUserId 用户社交平台Id
+     * @return
+     */
+    @GetMapping("/unbind/{socialUserId}")
+    @ApiOperation("解绑api")
+    @ApiImplicitParam(name = "socialUserId", value = "绑定socialId", required = true, dataType = "Long", paramType = "path", dataTypeClass = Long.class)
+    public AjaxResult unbind(@PathVariable Long socialUserId) {
+        return iUserSocialProfileService.unbindSocialAccount(socialUserId, getUserId());
+    }
+}
--- a/springboot/wumei-iot/src/main/java/com/ruoyi/iot/domain/UserSocialProfile.java
+++ b/springboot/wumei-iot/src/main/java/com/ruoyi/iot/domain/UserSocialProfile.java
@@ -0,0 +1,103 @@
+package com.ruoyi.iot.domain;
+
+import com.ruoyi.common.annotation.Excel;
+import org.apache.commons.lang3.builder.ToStringBuilder;
+import org.apache.commons.lang3.builder.ToStringStyle;
+
+public class UserSocialProfile {
+    /**
+     * 第三方系统用户表主键
+     */
+    private Long socialUserId;
+
+    /**
+     * 第三方用户来源
+     */
+    @Excel(name = "第三方用户来源")
+    private String source;
+
+    /**
+     * 用户名
+     */
+    @Excel(name = "用户名")
+    private String username;
+
+    /**
+     * 用户昵称
+     */
+    @Excel(name = "用户昵称")
+    private String nickname;
+
+    /**
+     * 用户头像
+     */
+    @Excel(name = "用户头像")
+    private String avatar;
+
+    /**
+     * 绑定状态(0:未绑定,1:绑定)
+     */
+    @Excel(name = "绑定状态(0:未绑定,1:绑定)")
+    private String status;
+
+    public Long getSocialUserId() {
+        return socialUserId;
+    }
+
+    public void setSocialUserId(Long socialUserId) {
+        this.socialUserId = socialUserId;
+    }
+
+    public String getSource() {
+        return source;
+    }
+
+    public void setSource(String source) {
+        this.source = source;
+    }
+
+    public String getStatus() {
+        return status;
+    }
+
+    public void setStatus(String status) {
+        this.status = status;
+    }
+
+    public String getUsername() {
+        return username;
+    }
+
+    public void setUsername(String username) {
+        this.username = username;
+    }
+
+    public String getNickname() {
+        return nickname;
+    }
+
+    public void setNickname(String nickname) {
+        this.nickname = nickname;
+    }
+
+    public String getAvatar() {
+        return avatar;
+    }
+
+    public void setAvatar(String avatar) {
+        this.avatar = avatar;
+    }
+
+    @Override
+    public String toString() {
+        return new ToStringBuilder(this, ToStringStyle.MULTI_LINE_STYLE)
+                .append("socialUserId", getSocialUserId())
+                .append("source", getSource())
+                .append("status", getStatus())
+                .append("username", getUsername())
+                .append("nickname", getNickname())
+                .append("avatar", getAvatar())
+                .toString();
+    }
+
+}
--- a/springboot/wumei-iot/src/main/java/com/ruoyi/iot/service/IUserSocialProfileService.java
+++ b/springboot/wumei-iot/src/main/java/com/ruoyi/iot/service/IUserSocialProfileService.java
@@ -0,0 +1,42 @@
+package com.ruoyi.iot.service;
+
+import com.ruoyi.common.core.domain.AjaxResult;
+import com.ruoyi.iot.domain.UserSocialProfile;
+
+import java.util.List;
+
+public interface IUserSocialProfileService {
+    /**
+     * 找到用户绑定的社交账户
+     *
+     * @param sysUserId 用户主键
+     * @return
+     */
+    List<UserSocialProfile> selectUserSocialProfile(Long sysUserId);
+
+    /**
+     * 绑定用户
+     *
+     * @param bindId    绑定的Id
+     * @param sysUserId 用户主键
+     * @return
+     */
+    AjaxResult bindUser(String bindId, Long sysUserId);
+
+    /**
+     * 点击绑定跳转api
+     *
+     * @param platform 平台
+     * @return
+     */
+    AjaxResult bindSocialAccount(String platform);
+
+    /**
+     * 解除绑定
+     *
+     * @param socialUserId 要解除的社交账户主键
+     * @param sysUserId    用户主键
+     * @return
+     */
+    AjaxResult unbindSocialAccount(Long socialUserId, Long sysUserId);
+}
--- a/springboot/wumei-iot/src/main/java/com/ruoyi/iot/service/impl/UserSocialProfileServiceImpl.java
+++ b/springboot/wumei-iot/src/main/java/com/ruoyi/iot/service/impl/UserSocialProfileServiceImpl.java
@@ -0,0 +1,104 @@
+package com.ruoyi.iot.service.impl;
+
+import com.ruoyi.common.constant.HttpStatus;
+import com.ruoyi.common.core.domain.AjaxResult;
+import com.ruoyi.common.core.redis.RedisCache;
+import com.ruoyi.common.enums.SocialPlatformType;
+import com.ruoyi.iot.domain.SocialUser;
+import com.ruoyi.iot.domain.UserSocialProfile;
+import com.ruoyi.iot.model.login.BindIdValue;
+import com.ruoyi.iot.service.ISocialPlatformService;
+import com.ruoyi.iot.service.ISocialUserService;
+import com.ruoyi.iot.service.IUserSocialProfileService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import static com.ruoyi.iot.service.impl.SocialLoginServiceImpl.BIND_REDIS_KEY;
+
+@Service
+public class UserSocialProfileServiceImpl implements IUserSocialProfileService {
+
+    @Autowired
+    private RedisCache redisCache;
+    @Autowired
+    private ISocialUserService iSocialUserService;
+    @Autowired
+    private ISocialPlatformService iSocialPlatformService;
+
+    @Override
+    public List<UserSocialProfile> selectUserSocialProfile(Long sysUserId) {
+        SocialUser selectSocialUser = new SocialUser();
+        selectSocialUser.setSysUserId(sysUserId);
+        List<SocialUser> socialUserList = iSocialUserService.selectSocialUserList(selectSocialUser);
+        List<UserSocialProfile> userSocialProfileList = new ArrayList<>();
+        for (SocialUser socialUser : socialUserList) {
+            //如果是删除的标记
+            if (socialUser.getDelFlag().equals("1")) {
+                continue;
+            }
+            UserSocialProfile userSocialProfile = new UserSocialProfile();
+            userSocialProfile.setSocialUserId(socialUser.getSocialUserId());
+            userSocialProfile.setAvatar(socialUser.getAvatar());
+            userSocialProfile.setSource(socialUser.getSource());
+            userSocialProfile.setUsername(socialUser.getUsername());
+            userSocialProfile.setNickname(socialUser.getNickname());
+            userSocialProfile.setStatus(socialUser.getStatus());
+            userSocialProfileList.add(userSocialProfile);
+        }
+        return userSocialProfileList;
+    }
+
+    @Override
+    public AjaxResult bindUser(String bindId, Long sysUserId) {
+        BindIdValue bindValue = redisCache.getCacheObject(BIND_REDIS_KEY + bindId);
+        if (bindValue == null) {
+            //不作提示
+            return AjaxResult.error(HttpStatus.NO_MESSAGE_ALERT, "未知异常");
+        }
+        SocialUser socialUser = findSocialUser(bindValue.getUuid(), bindValue.getSource());
+        SocialUser updateSocialUser = new SocialUser();
+        updateSocialUser.setSocialUserId(socialUser.getSocialUserId());
+        updateSocialUser.setSysUserId(sysUserId);
+        iSocialUserService.updateSocialUser(updateSocialUser);
+        redisCache.deleteObject(BIND_REDIS_KEY + bindId);
+        return AjaxResult.success("绑定成功！");
+    }
+
+    @Override
+    public AjaxResult bindSocialAccount(String platform) {
+        try {
+            SocialPlatformType.valueOf(platform);
+        } catch (Exception e) {
+            return AjaxResult.error("错误平台类型");
+        }
+        return AjaxResult.success();
+    }
+
+    @Override
+    public AjaxResult unbindSocialAccount(Long socialUserId, Long sysUserId) {
+        SocialUser socialUser = iSocialUserService.selectSocialUserBySocialUserId(socialUserId);
+        if (socialUser == null) {
+            return AjaxResult.error("绑定账户不存在！");
+        } else if (!socialUser.getSysUserId().equals(socialUserId)) {
+            return AjaxResult.error("用户账户和绑定账户不匹配！");
+        } else {
+            SocialUser updateSocialUser = new SocialUser();
+            updateSocialUser.setSocialUserId(socialUserId);
+            updateSocialUser.setSysUserId(-1L);
+            iSocialUserService.updateSocialUser(updateSocialUser);
+            return AjaxResult.success("解除绑定成功！");
+        }
+    }
+
+    public SocialUser findSocialUser(String uuid, String source) {
+        SocialUser socialUser = new SocialUser();
+        socialUser.setSource(source);
+        socialUser.setUuid(uuid);
+        List<SocialUser> socialUserList = iSocialUserService.selectSocialUserList(socialUser);
+        return socialUserList == null || socialUserList.isEmpty() ? null : socialUserList.get(0);
+
+    }
+}
--- a/vue/src/api/iot/platform.js
+++ b/vue/src/api/iot/platform.js
@@ -42,3 +42,27 @@ export function delPlatform(socialPlatformId) {
    method: 'delete'
  })
 }
+
+//解除绑定
+export function unbind(socialUserId){
+  return request({
+    url: '/iot/social/unbind/' + socialUserId,
+    method: 'get'
+  })
+}
+
+//绑定跳转
+export function bind(platform){
+  return request({
+    url: '/iot/social/bind/' + platform,
+    method: 'get'
+  })
+}
+
+//绑定
+export function bindUser(bindId){
+  return request({
+    url: '/iot/social/bindId/' + bindId,
+    method: 'get'
+  })
+}
--- a/vue/src/permission.js
+++ b/vue/src/permission.js
@@ -1,11 +1,11 @@
 import router from './router'
 import store from './store'
-import { Message } from 'element-ui'
+import {Message} from 'element-ui'
 import NProgress from 'nprogress'
 import 'nprogress/nprogress.css'
-import { getToken } from '@/utils/auth'
+import {getToken} from '@/utils/auth'

-NProgress.configure({ showSpinner: false })
+NProgress.configure({showSpinner: false})

 const whiteList = ['/login', '/auth-redirect', '/bind', '/register']

@@ -15,7 +15,16 @@ router.beforeEach((to, from, next) => {
    to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
    /* has token*/
    if (to.path === '/login') {
-      next({ path: '/' })
+      if (to.query.bindId) {
+        store.dispatch('BindUser', to.query.bindId).then((res) => {
+          Message.success(res.msg);
+          next({path: '/user/profile'})
+        }).catch(err=>{
+          next({path: '/'})
+        })
+      } else {
+        next({path: '/'})
+      }
      NProgress.done()
    } else {
      if (store.getters.roles.length === 0) {
@@ -24,14 +33,14 @@ router.beforeEach((to, from, next) => {
          store.dispatch('GenerateRoutes').then(accessRoutes => {
            // 根据roles权限生成可访问的路由表
            router.addRoutes(accessRoutes) // 动态添加可访问路由表
-            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
+            next({...to, replace: true}) // hack方法 确保addRoutes已完成
          })
        }).catch(err => {
-            store.dispatch('LogOut').then(() => {
-              Message.error(err)
-              next({ path: '/' })
-            })
+          store.dispatch('LogOut').then(() => {
+            Message.error(err)
+            next({path: '/'})
          })
+        })
      } else {
        next()
      }
--- a/vue/src/store/modules/user.js
+++ b/vue/src/store/modules/user.js
@@ -1,5 +1,6 @@
-import {bindLogin, getInfo, login, logout, redirectLogin} from '@/api/login'
-import {getToken, removeToken, setToken} from '@/utils/auth'
+import {login, logout, getInfo, bindLogin, bindRegister, redirectLogin} from '@/api/login'
+import {bindUser} from '@/api/iot/platform'
+import {getToken, setToken, removeToken} from '@/utils/auth'

 const user = {
  state: {
@@ -69,6 +70,16 @@ const user = {
      })
    },

+    BindUser({commit}, bindId) {
+      return new Promise((resolve, reject) => {
+        bindUser(bindId).then(res => {
+          resolve(res)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
    // 获取用户信息
    GetInfo({commit, state}) {
      return new Promise((resolve, reject) => {
--- a/vue/src/views/iot/platform/index.vue
+++ b/vue/src/views/iot/platform/index.vue
@@ -36,7 +36,8 @@
          size="mini"
          @click="handleAdd"
          v-hasPermi="['iot:platform:add']"
-        >新增</el-button>
+        >新增
+        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
@@ -47,7 +48,8 @@
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['iot:platform:edit']"
-        >修改</el-button>
+        >修改
+        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
@@ -58,7 +60,8 @@
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['iot:platform:remove']"
-        >删除</el-button>
+        >删除
+        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
@@ -68,43 +71,49 @@
          size="mini"
          @click="handleExport"
          v-hasPermi="['iot:platform:export']"
-        >导出</el-button>
+        >导出
+        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="platformList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column align="center" label="登录平台主键" prop="socialPlatformId"/>
-      <el-table-column align="center" label="第三方平台" prop="platform">
+      <el-table-column align="center" label="平台主键" prop="socialPlatformId" width="75"/>
+      <el-table-column align="center" label="平台名称" prop="platform" width="95">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.iot_social_platform" :value="scope.row.platform"/>
        </template>
      </el-table-column>
-      <el-table-column align="center" label="状态" prop="status">
+
+      <el-table-column align="center" label="状态" prop="status" width="75">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.iot_social_platform_status" :value="scope.row.status"/>
        </template>
      </el-table-column>
-      <el-table-column label="第三方平台申请Id" align="center" prop="clientId"/>
-      <el-table-column label="第三方平台密钥" align="center" prop="secretKey"/>
-      <el-table-column label="用户认证后跳转地址" align="center" prop="redirectUri"/>
+      <el-table-column label="平台申请Id" align="center" prop="clientId"/>
+      <el-table-column label="平台密钥" align="center" prop="secretKey" :show-overflow-tooltip="true"/>
+      <el-table-column label="跳转地址" align="center" prop="redirectUri" width="180" :show-overflow-tooltip="true"/>
+
+      <el-table-column align="center" label="绑定登录uri" prop="bindUri" :show-tooltip-when-overflow="true"
+                       :render-header="(h,column)=>renderHeaderMethods(h,column,columnTips.bindId)"/>
+      <el-table-column align="center" label="跳转登录uri" prop="redirectLoginUri" :show-tooltip-when-overflow="true"
+                       :render-header="(h,column)=>renderHeaderMethods(h,column,columnTips.redirectLogin)"/>
+      <el-table-column align="center" label="错误提示uri" prop="errorMsgUri" :show-tooltip-when-overflow="true"
+                       :render-header="(h,column)=>renderHeaderMethods(h,column,columnTips.errorId)"/>
+      <el-table-column align="center" label="备注" prop="remark" width="75" :show-tooltip-when-overflow="true"/>
      <el-table-column align="center" label="创建者" prop="createBy"/>
-      <el-table-column align="center" label="创建时间" prop="createTime" width="180">
+      <el-table-column align="center" label="创建时间" prop="createTime" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
-      <el-table-column align="center" label="更新时间" prop="updateTime" width="180">
+      <el-table-column align="center" label="更新者" prop="updateBy"/>
+      <el-table-column align="center" label="更新时间" prop="updateTime" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
-      <el-table-column align="center" label="更新者" prop="updateBy"/>
-      <el-table-column align="center" label="备注" prop="remark"/>
-      <el-table-column align="center" label="绑定注册登录uri,http://localhost/login?bindId=" prop="bindUri"/>
-      <el-table-column align="center" label="跳转登录uri,http://localhost/login?loginId=" prop="redirectLoginUri"/>
-      <el-table-column align="center" label="错误提示uri,http://localhost/login?errorId=" prop="errorMsgUri"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
@@ -121,7 +130,8 @@
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['iot:platform:remove']"
-          >删除</el-button>
+          >删除
+          </el-button>
        </template>
      </el-table-column>
    </el-table>
@@ -223,6 +233,11 @@ export default {
        platform: null,
        status: null,
      },
+      columnTips: {
+        bindId: "绑定登录uri, http://localhost/login?bindId=,域名换成对应域名即可，本地开发不需要更改",
+        redirectLogin: "跳转登录uri,http://localhost/login?loginId=,域名换成对应域名即可，本地开发不需要更改",
+        errorId: "错误提示获取uri,http://localhost/login?errorId=,域名换成对应域名即可，本地开发不需要更改"
+      },
      // 表单参数
      form: {},
      // 表单校验
@@ -258,6 +273,25 @@ export default {
    this.getList();
  },
  methods: {
+    renderHeaderMethods(h, {column}, content) {
+      return h(
+        'div', [
+          h('span', column.label),
+          h('el-tooltip', {
+            props: {
+              effect: 'dark',
+              content: content,
+              placement: 'top'
+            },
+          }, [
+            h('i', {
+              class: 'el-icon-question',
+              style: 'color:#409EFF;margin-left:5px;'
+            })
+          ])
+        ]
+      );
+    },
    /** 查询第三方登录平台控制列表 */
    getList() {
      this.loading = true;
@@ -266,12 +300,14 @@ export default {
        this.total = response.total;
        this.loading = false;
      });
-    },
+    }
+    ,
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
-    },
+    }
+    ,
    // 表单重置
    reset() {
      this.form = {
@@ -292,29 +328,34 @@ export default {
        errorMsgUri: null
      };
      this.resetForm("form");
-    },
+    }
+    ,
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
-    },
+    }
+    ,
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
-    },
+    }
+    ,
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.socialPlatformId)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
      this.multiple = !selection.length
-    },
+    }
+    ,
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加第三方登录平台控制";
-    },
+    }
+    ,
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
@@ -324,7 +365,8 @@ export default {
        this.open = true;
        this.title = "修改第三方登录平台控制";
      });
-    },
+    }
+    ,
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
@@ -344,17 +386,20 @@ export default {
          }
        }
      });
-    },
+    }
+    ,
    /** 删除按钮操作 */
    handleDelete(row) {
      const socialPlatformIds = row.socialPlatformId || this.ids;
-      this.$modal.confirm('是否确认删除第三方登录平台控制编号为"' + socialPlatformIds + '"的数据项？').then(function() {
+      this.$modal.confirm('是否确认删除第三方登录平台控制编号为"' + socialPlatformIds + '"的数据项？').then(function () {
        return delPlatform(socialPlatformIds);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
-    },
+      }).catch(() => {
+      });
+    }
+    ,
    /** 导出按钮操作 */
    handleExport() {
      this.download('iot/platform/export', {
--- a/vue/src/views/system/user/profile/index.vue
+++ b/vue/src/views/system/user/profile/index.vue
@@ -8,33 +8,62 @@
          </div>
          <div>
            <div class="text-center">
-              <userAvatar :user="user" />
+              <userAvatar :user="user"/>
            </div>
            <ul class="list-group list-group-striped">
              <li class="list-group-item">
-                <svg-icon icon-class="user" />用户名称
+                <svg-icon icon-class="user"/>
+                用户名称
                <div class="pull-right">{{ user.userName }}</div>
              </li>
              <li class="list-group-item">
-                <svg-icon icon-class="phone" />手机号码
+                <svg-icon icon-class="phone"/>
+                手机号码
                <div class="pull-right">{{ user.phonenumber }}</div>
              </li>
              <li class="list-group-item">
-                <svg-icon icon-class="email" />用户邮箱
+                <svg-icon icon-class="email"/>
+                用户邮箱
                <div class="pull-right">{{ user.email }}</div>
              </li>
              <li class="list-group-item">
-                <svg-icon icon-class="tree" />所属部门
+                <svg-icon icon-class="tree"/>
+                所属部门
                <div class="pull-right" v-if="user.dept">{{ user.dept.deptName }} / {{ postGroup }}</div>
              </li>
              <li class="list-group-item">
-                <svg-icon icon-class="peoples" />所属角色
+                <svg-icon icon-class="peoples"/>
+                所属角色
                <div class="pull-right">{{ roleGroup }}</div>
              </li>
              <li class="list-group-item">
-                <svg-icon icon-class="date" />创建日期
+                <svg-icon icon-class="date"/>
+                创建日期
                <div class="pull-right">{{ user.createTime }}</div>
              </li>
+              <li class="list-group-item">
+                <svg-icon icon-class="qq"/>
+                QQ
+                <div class="pull-right" v-if="!this.qqBind">
+                  <el-button size="mini" style="margin-top: -7px" @click="bind(socialAccount.QQ.name)">未绑定</el-button>
+                </div>
+                <div style="float:right;display: flex;" v-else>
+                  <span>{{ this.socialAccount.QQ.value.nickname }}</span>
+                  <el-image style="width: 25px; height: 25px; margin-top: -7px;margin-left: 5px;margin-right: 5px"
+                            :src="this.socialAccount.QQ.value.avatar"/>
+                  <el-button style="margin-top: -5px" size="mini" @click="unbind(socialAccount.QQ.name)">解除绑定
+                  </el-button>
+                </div>
+              </li>
+
+              <li class="list-group-item">
+                <svg-icon icon-class="wechat"/>
+                微信
+                <div class="pull-right">
+                  <el-button style="margin-top: -7px" size="mini">未绑定</el-button>
+                </div>
+
+              </li>
            </ul>
          </div>
        </el-card>
@@ -46,10 +75,10 @@
          </div>
          <el-tabs v-model="activeTab">
            <el-tab-pane label="基本资料" name="userinfo">
-              <userInfo :user="user" />
+              <userInfo :user="user"/>
            </el-tab-pane>
            <el-tab-pane label="修改密码" name="resetPwd">
-              <resetPwd :user="user" />
+              <resetPwd :user="user"/>
            </el-tab-pane>
          </el-tabs>
        </el-card>
@@ -62,17 +91,35 @@
 import userAvatar from "./userAvatar";
 import userInfo from "./userInfo";
 import resetPwd from "./resetPwd";
-import { getUserProfile } from "@/api/system/user";
+import {getUserProfile} from "@/api/system/user";
+import {unbind, bind} from "@/api/iot/platform";

 export default {
  name: "Profile",
-  components: { userAvatar, userInfo, resetPwd },
+  components: {userAvatar, userInfo, resetPwd},
  data() {
    return {
      user: {},
      roleGroup: {},
      postGroup: {},
-      activeTab: "userinfo"
+      activeTab: "userinfo",
+      socialGroup: [],
+      qqBind: false,
+      wechatBind: false,
+      socialAccount: {
+        QQ: {
+          name: "QQ",
+          value: null
+        },
+        Wechat: {
+          name: "Wechat",
+          value: null
+        },
+        Status: {
+          bind: "0",
+          unbind: "1"
+        }
+      },
    };
  },
  created() {
@@ -84,7 +131,53 @@ export default {
        this.user = response.data;
        this.roleGroup = response.roleGroup;
        this.postGroup = response.postGroup;
+        this.socialGroup = response.socialGroup;
+        if (!(this.socialGroup === undefined || this.socialGroup === null)) {
+          this.socialGroup.forEach(social => {
+            if (social.status === this.socialAccount.Status.bind) {
+              switch (social.source) {
+                case this.socialAccount.QQ.name: {
+                  this.qqBind = true;
+                  this.socialAccount.QQ.value = social;
+                  break
+                }
+                case this.socialAccount.Wechat.name: {
+                  this.wechatBind = true;
+                  this.socialAccount.Wechat.value = social;
+                  break
+                }
+              }
+            }
+          })
+        }
      });
+    },
+    bind(type) {
+      switch (type) {
+        case this.socialAccount.QQ.name: {
+          if (!this.qqBind) {
+            bind(type).then((res) => {
+              window.location.href = "http://localhost:8080/auth/render/qq";
+            });
+          }
+          break;
+        }
+      }
+
+    },
+    unbind(type) {
+      switch (type) {
+        case this.socialAccount.QQ.name: {
+          if (this.qqBind) {
+            unbind(this.socialAccount.QQ.value.socialUserId).then((res) => {
+              this.$modal.msgSuccess(res.msg);
+              this.qqBind = false;
+              this.socialAccount.QQ.value = null;
+            })
+          }
+          break;
+        }
+      }
    }
  }
 };