From 66db80bd6679d011c67ae289e4ded4fa4a76e5d4 Mon Sep 17 00:00:00 2001 From: linwenling <3256558519@qq.com> Date: 星期二, 12 九月 2023 09:48:27 +0800 Subject: [PATCH] 修改个人中心 --- ruoyi-ui/src/views/system/user/profile/index.vue | 242 +++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 227 insertions(+), 15 deletions(-) diff --git a/ruoyi-ui/src/views/system/user/profile/index.vue b/ruoyi-ui/src/views/system/user/profile/index.vue index ad530f9..51a17e3 100644 --- a/ruoyi-ui/src/views/system/user/profile/index.vue +++ b/ruoyi-ui/src/views/system/user/profile/index.vue @@ -1,50 +1,50 @@ <template> - <div class="app-container"> + <div class="app-container" style="background-color: #FEF7FC;"> <el-row :gutter="20"> - <el-col :span="6" :xs="24"> - <el-card class="box-card"> + <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> + </div > <ul class="list-group list-group-striped"> <li class="list-group-item"> - <svg-icon icon-class="user" />鐢ㄦ埛鍚嶇О + 鐢ㄦ埛鍚嶇О <div class="pull-right">{{ user.userName }}</div> </li> <li class="list-group-item"> - <svg-icon icon-class="phone" />鎵嬫満鍙风爜 + 鎵嬫満鍙风爜 <div class="pull-right">{{ user.phonenumber }}</div> </li> <li class="list-group-item"> - <svg-icon icon-class="email" />鐢ㄦ埛閭 + 鐢ㄦ埛閭 <div class="pull-right">{{ user.email }}</div> </li> <li class="list-group-item"> - <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" />鎵�灞炶鑹� + 鎵�灞炶鑹� <div class="pull-right">{{ roleGroup }}</div> </li> <li class="list-group-item"> - <svg-icon icon-class="date" />鍒涘缓鏃ユ湡 + 鍒涘缓鏃ユ湡 <div class="pull-right">{{ user.createTime }}</div> </li> </ul> </div> </el-card> </el-col> - <el-col :span="18" :xs="24"> - <el-card> + <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-tabs v-model="activeTab" > <el-tab-pane label="鍩烘湰璧勬枡" name="userinfo"> <userInfo :user="user" /> </el-tab-pane> @@ -55,6 +55,161 @@ </el-card> </el-col> </el-row> + <div style="padding-top: 20px; background-color: #F4FFF8;"> + <div class="container"> + <div> + <span style="font-family: Microsoft YaHei-Regular, Microsoft YaHei; padding-left: 10px;">鏉冮檺鎯呭喌</span> + </div> + <div style="padding-left: 10px;"> + <el-dropdown v-model="selectedFamily" @command="handleDropdownCommand"> + <span class="el-dropdown-link"> + {{ selectedFamily || '涓嬫媺鑿滃崟' }}<i class="el-icon-arrow-down el-icon--right"></i> + </span> + <el-dropdown-menu slot="dropdown"> + <el-dropdown-item command="涓�鍙峰搴�">涓�鍙峰搴�</el-dropdown-item> + <el-dropdown-item command="浜屽彿瀹跺涵">浜屽彿瀹跺涵</el-dropdown-item> + <el-dropdown-item command="涓夊彿瀹跺涵">涓夊彿瀹跺涵</el-dropdown-item> + <el-dropdown-item command="鍥涘彿瀹跺涵">鍥涘彿瀹跺涵</el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> + </div> + </div> + <el-divider></el-divider> + <div > + <el-tabs v-model="activeTab1" style="padding-left: 25px;" @tab-click="handleTabClick"> + <el-tab-pane label="瀹舵牴缃�" prop="瀹舵牴缃�"> + <span >鏌ョ湅鏉冮檺</span> + + <el-divider></el-divider> + <span>鏂板鏉冮檺</span> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> + <el-divider></el-divider> + <span>鍒犻櫎鏉冮檺</span> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> + <el-divider></el-divider> + <span>淇敼鏉冮檺</span> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> + </el-tab-pane> +<!-- <el-tab-pane label="瀹跺ぇ浜嬭">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="瀹跺涵璧勪骇">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="瀹跺涵璁惧">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="鏀惰棌鑽h獕">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="灏忓尰鐢�">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="淇濇磥鏀剁撼">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="閫氳褰�">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="榄呭疇">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> +<!-- <el-tab-pane label="瀹跺涵鏀舵敮鍙拌处">--> +<!-- <span>鏌ョ湅鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.search }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鏂板鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.insert }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>鍒犻櫎鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.delete }}</span>--> +<!-- <el-divider></el-divider>--> +<!-- <span>淇敼鏉冮檺</span>--> +<!-- <span style="padding-left: 1200px;">{{ SelfPermission.update }}</span>--> +<!-- </el-tab-pane>--> + </el-tabs> + </div> + </div> </div> </template> @@ -62,30 +217,87 @@ import userAvatar from "./userAvatar"; import userInfo from "./userInfo"; import resetPwd from "./resetPwd"; -import { getUserProfile } from "@/api/system/user"; +import { getUserProfile ,getSelfPermission} from "@/api/system/user"; export default { name: "Profile", components: { userAvatar, userInfo, resetPwd }, data() { return { + data: { + familyName: undefined, + modelName: undefined, + }, + selectedFamily: '', // 鍒濆鍖栭�変腑鐨勫搴负绌哄瓧绗︿覆 + SelfPermission:undefined, user: {}, roleGroup: {}, postGroup: {}, - activeTab: "userinfo" + activeTab: "userinfo", + activeTab1:"ueserinfopermission" }; }, + created() { this.getUser(); + this.getUserPermission(); }, methods: { + handleTabClick(tab) { + this.selectedTab = tab.label; + if (this.selectedFamily && this.selectedTab) { + this.getUserPermission(); // 璋冪敤 getList 鏂规硶 + } + }, + handleDropdownCommand(command) { + + this.selectedFamily = command; // 鏇存柊閫変腑鐨勫搴� + // 妫�鏌ヤ笅鎷夎彍鍗曞拰鍒囩墖椤甸潰鏄惁閮借閫変腑 + if (this.selectedFamily && this.selectedTab) { + this.getUserPermission(); // 璋冪敤 getList 鏂规硶 + } + }, + + getUser() { getUserProfile().then(response => { this.user = response.data; this.roleGroup = response.roleGroup; this.postGroup = response.postGroup; }); + }, + getUserPermission(){ + console.log(this.selectedTab) + console.log(this.selectedFamily) + this.data = ({ + familyName: this.selectedFamily, + modelName: this.selectedTab + }); + console.log(this.data) + console.log(typeof this.data) + const jsonData = JSON.stringify(this.data); // 灏嗗璞¤浆鎹负 JSON 瀛楃涓� + console.log(jsonData); // 鎵撳嵃 JSON 瀛楃涓� + // debugger + if(jsonData){ + getSelfPermission(jsonData).then(response => { + this.SelfPermission = response.data; + console.log(111); + console.log(this.SelfPermission); + }) + .catch(error => { + // 澶勭悊閿欒 + }); + } } } }; </script> +<style> +.container { + display: flex; +} + +.el-icon-arrow-down { + font-size: 12px; +} +</style> -- Gitblit v1.9.1