<template>
|
<div class="app-container" style="background-color: #FEF7FC;">
|
<el-row :gutter="20">
|
<el-col :span="8" :xs="24" >
|
<el-card class="box-card" style="background-color: #EBF4FE;">
|
<div slot="header" class="clearfix">
|
<span>个人信息</span>
|
</div>
|
<div>
|
<div class="text-center">
|
<userAvatar :user="user" />
|
</div >
|
<ul class="list-group list-group-striped">
|
<li class="list-group-item">
|
用户名称
|
<div class="pull-right">{{ user.nickName }}</div>
|
</li>
|
<li class="list-group-item">
|
手机号码
|
<div class="pull-right">{{ user.phoneNumber }}</div>
|
</li>
|
<li class="list-group-item">
|
用户邮箱
|
<div class="pull-right">{{ user.email }}</div>
|
</li>
|
<li class="list-group-item">
|
所属家庭
|
<div class="pull-right" >{{ user.familyName }} </div>
|
</li>
|
<li class="list-group-item">
|
所属角色
|
<div class="pull-right">{{ user.roleName }}</div>
|
</li>
|
<li class="list-group-item">
|
创建日期
|
<div class="pull-right">{{ user.createTime }}</div>
|
</li>
|
</ul>
|
</div>
|
</el-card>
|
</el-col>
|
<el-col :span="16" :xs="24" >
|
<el-card style="background-color: #FFF5F7;">
|
<div slot="header" class="clearfix">
|
<span>基本资料</span>
|
</div>
|
<el-tabs v-model="activeTab" >
|
<el-tab-pane label="基本资料" name="userinfo">
|
<userInfo :user="user" />
|
</el-tab-pane>
|
<el-tab-pane label="修改密码" name="resetPwd">
|
<resetPwd />
|
</el-tab-pane>
|
</el-tabs>
|
</el-card>
|
</el-col>
|
</el-row>
|
<div style="padding-top: 20px; background-color: #F4FFF8;">
|
|
<el-divider></el-divider>
|
<div >
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
<el-row>
|
<el-col :span="10" :xs="24">
|
<el-form-item label="菜单权限">
|
<el-tree
|
class="tree-border"
|
:data="menuOptions"
|
show-checkbox
|
ref="authr"
|
node-key="id"
|
:default-expand-all="true"
|
|
empty-text="加载中,请稍候"
|
:props="defaultProps"
|
></el-tree> </el-form-item>
|
</el-col>
|
<el-col :span="4" :xs="24" type="flex" align="middle">可以授权相关人员</el-col>
|
<el-col :span="10" :xs="24">
|
<el-tree
|
class="tree-border"
|
:data="menuOptions1"
|
show-checkbox
|
ref="peoInfo"
|
node-key="id"
|
|
empty-text="加载中,请稍候"
|
:props="defaultProps"
|
></el-tree>
|
</el-col>
|
</el-row>
|
<el-button type="primary" @click="upAuthority">授权</el-button>
|
</el-form>
|
</div>
|
<el-divider></el-divider>
|
<div>
|
<el-form>
|
<el-row>
|
<el-col :span="10" :xs="24">
|
<el-form-item label="收回权限">
|
<el-select v-model="st" placeholder="请选择菜单" @change="handleChange">
|
<el-option v-for="mo in menuOptions2" :label="mo.label" :value="mo.id" :key="mo.id"></el-option>
|
</el-select>
|
|
|
</el-form-item>
|
</el-col>
|
<el-col :span="4" :xs="24" class="centered">已经授权相关人员</el-col>
|
<el-col :span="10" :xs="24">
|
<el-form-item label="已经授权相关成员">
|
<el-tree
|
class="tree-border"
|
:data="menuOptionsp"
|
show-checkbox
|
ref="spp"
|
node-key="id"
|
:default-expand-all="true"
|
|
empty-text="加载中,请稍候"
|
:props="defaultProps"
|
></el-tree> </el-form-item>
|
</el-col>
|
</el-row>
|
<el-button type="primary" @click="deleteAuthority">收回授权</el-button>
|
</el-form>
|
</div>
|
</div>
|
|
|
</div>
|
|
</template>
|
|
<script>
|
import userAvatar from "./userAvatar";
|
import userInfo from "./userInfo";
|
import resetPwd from "./resetPwd";
|
import { getAllInfo,getUserProfile ,getSelfPermission,getFamilyids,setAuority
|
,getUserByFidAid,deleteUserByFidAid} from "@/api/system/user";
|
import { getIndividualList } from "@/api/self";
|
import {updateFamilyevent} from "@/api/bignote";
|
|
export default {
|
name: "Profile",
|
components: { userAvatar, userInfo, resetPwd },
|
data() {
|
return {
|
formDat: {
|
familyName: undefined,
|
modelName: undefined,
|
},
|
fid: undefined,
|
st: undefined,
|
menuOptionsp:[
|
{
|
id: 1,
|
label: '家庭成员',
|
children:[]
|
}
|
],
|
menuOptions2:[
|
{
|
id: 2000,
|
label: '家庭资产管理',
|
|
},
|
{
|
id: 2012,
|
label: '家大事记',
|
},
|
{ id:2016,
|
label: '家庭设备',
|
},
|
{
|
id: 2004,
|
label: '收藏和荣誉',
|
|
},
|
{
|
id: 2029,
|
label: '家庭小医生',
|
},
|
{ id:2024,
|
label: '保洁收纳',
|
},
|
{
|
id: 2021,
|
label: '通讯录',
|
},
|
{ id:2033,
|
label: '魅宠',
|
},
|
{id:2008,
|
label: '家庭收支台账',
|
}
|
],
|
menuOptions1:[
|
{
|
id: 1,
|
label: '家庭成员',
|
children:[]
|
}
|
],
|
menuOptions:[
|
{
|
id: 1,
|
label: '家庭模块',
|
children: [
|
{
|
id: 2000,
|
label: '家庭资产管理',
|
|
},
|
{
|
id: 2012,
|
label: '家大事记',
|
},
|
{ id:2016,
|
label: '家庭设备',
|
},
|
{
|
id: 2004,
|
label: '收藏和荣誉',
|
|
},
|
{
|
id: 2029,
|
label: '家庭小医生',
|
},
|
{ id:2024,
|
label: '保洁收纳',
|
},
|
{
|
id: 2021,
|
label: '通讯录',
|
},
|
{ id:2033,
|
label: '魅宠',
|
},
|
{id:2008,
|
label: '家庭收支台账',
|
}
|
],
|
},
|
],
|
FaimlyList:undefined,
|
FaimlyList1:undefined,
|
selectedFamily: "一号家庭",
|
id:'',
|
command1:undefined,
|
selectedTab:"家根网",// 初始化选中的家庭为空字符串
|
selectedTab1:"家根网",// 初始化选中的家庭为空字符串
|
SelfPermission:undefined,
|
SelfPermissionList:{
|
insert:undefined,
|
delete:undefined,
|
search:undefined,
|
update:undefined,
|
},
|
user: {},
|
roleGroup: {},
|
postGroup: {},
|
activeTab: "userinfo",
|
activeTab1:"家根网"
|
};
|
},
|
|
created() {
|
this.getUser();
|
this.getList();
|
},
|
methods: {
|
deleteAuthority(){
|
// alert(this.st)
|
let uidKeys = this.$refs.spp.getCheckedKeys();
|
let auIds = []
|
auIds.push(this.st)
|
let data = {
|
uids: uidKeys,
|
fid: this.fid,
|
authoritys: auIds
|
}
|
let _this = this
|
if(this.st!=undefined&&uidKeys.length!=0){
|
deleteUserByFidAid(data).then(response=>{
|
this.$modal.msgSuccess(response.msg)
|
let data = {
|
"fid": _this.fid,
|
"authority": _this.st
|
}
|
// alert(data.authority)
|
// let _this = this
|
getUserByFidAid(data).then(response=>{
|
console.log(response)
|
let fams = response.data;
|
for(let i = 0 ; i < fams.length; i++)
|
_this.menuOptionsp[0]['children'].push({id:fams[i].userId,label:fams[i].nickName })
|
|
})
|
})
|
}
|
else{
|
this.$modal.msgSuccess("权限或被授权人不能为空!")
|
}
|
},
|
getDeptAllCheckedKeys() {
|
// 目前被选中的部门节点
|
let checkedKeys = this.$refs.authr.getCheckedKeys();
|
// console.log(checkedKeys)
|
},
|
upAuthority(){
|
let checkedKeys = this.$refs.authr.getCheckedKeys();
|
let peoKeys = this.$refs.peoInfo.getCheckedKeys();
|
// console.log(peoKeys)
|
// alert(checkedKeys.length)
|
// this.getDeptAllCheckedKeys()
|
if(checkedKeys.length!=0&&peoKeys.length!=0)
|
{
|
let data = {
|
uids: peoKeys,
|
fid: this.fid,
|
authoritys: checkedKeys
|
}
|
// console.log(data)
|
// alert(123)
|
setAuority(data).then(response=>{
|
// console.log(response)
|
this.$modal.msgSuccess(response.msg)
|
// alert(response.data)
|
})
|
}
|
else{
|
this.$modal.msgSuccess("权限或被授权人不能为空!");
|
}
|
},
|
handleChange(value){
|
|
let data = {
|
"fid": this.fid,
|
"authority": value
|
}
|
alert(data.authority)
|
let _this = this
|
getUserByFidAid(data).then(response=>{
|
console.log(response)
|
let fams = response.data;
|
for(let i = 0 ; i < fams.length; i++)
|
_this.menuOptionsp[0]['children'].push({id:fams[i].userId,label:fams[i].nickName })
|
|
})
|
},
|
handleTabClick(tab) {
|
this.selectedTab = tab.label;
|
if (this.selectedFamily && this.selectedTab) {
|
this.getList();
|
}
|
},
|
handleTabClick1(tab) {
|
this.selectedTab1 = tab.label;
|
},
|
handleDropdownCommand(command) {
|
// this.selectedFamily = command; // 更新选中的家庭
|
// console.log(this.selectedFamily)
|
// // 检查下拉菜单和切片页面是否都被选中
|
// if (this.selectedFamily && this.selectedTab) {
|
// this.getList();
|
// }
|
},
|
handleDropdownCommand1(command1) {
|
// this.command1= command1;
|
// console.log(command1)
|
// let id = null;
|
// if (command1 == '一号家庭') {
|
// id = 1;
|
// } else if (command1 == '二号家庭') {
|
// id = 2;
|
// } else if (command1 == '三号家庭') {
|
// id = 3;
|
// } else if (command1 == '四号家庭') {
|
// id = 4;
|
// }
|
// if (id) {
|
// this.getUser(parseInt(id)); // 将id转换为数字类型
|
// }
|
},
|
|
|
getUser(id) {
|
|
// getUserProfile().then(response => {
|
// this.user = response.data;
|
// this.roleGroup = response.roleGroup;
|
// this.postGroup = response.postGroup;
|
// });
|
|
// getFamilyids(id).then(response => {
|
// console.log(id)
|
// // this.FaimlyList = response.data;
|
// console.log("打印家庭成员序列"+id)
|
// console.log(this.FaimlyList)
|
// });
|
getIndividualList().then(response => {
|
this.user = response.data;
|
// alert(890)
|
this.fid = response.data.familyId
|
// alert(this.fid)
|
this.roleGroup = response.roleGroup;
|
this.postGroup = response.postGroup;
|
});
|
// if (this.user.familyName='一号家庭'){
|
// id=1;
|
// getFamilyids(id).then(response => {
|
// console.log(id)
|
// this.FaimlyList1 = response.data;
|
// console.log("打印家庭成员序列"+id)
|
// console.log(this.FaimlyList)
|
// });
|
// }
|
|
|
|
},
|
getList() {
|
|
let _this = this
|
|
getAllInfo().then(response=>{
|
let fams = response.data
|
for(let i = 0; i < fams.length; i++)
|
_this.menuOptions1[0]['children'].push({id:fams[i].userId,label:fams[i].nickName })
|
})
|
// var formData ={
|
// "familyName": this.selectedFamily,
|
// "modelName":this.selectedTab,
|
// }
|
|
// var jsonString = JSON.stringify(formData);
|
// // console.log(jsonString);
|
|
// getSelfPermission(jsonString).then(response => {
|
// this.SelfPermissionList = response.data;
|
// console.log(this.SelfPermissionList)
|
// });
|
|
}
|
}
|
|
};
|
</script>
|
<style>
|
.container {
|
display: flex;
|
}
|
.centered {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
text-align: center;
|
}
|
.el-icon-arrow-down {
|
font-size: 12px;
|
}
|
</style>
|