[功能]：1、跳转url 放到配置文件里面 2、优化登录管理界面 3、添加qq登录解绑和重新绑定功能 4、个人中心增加 qq绑定信息 展示view

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', {

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;
+        }
+      }
     }
   }
 };