¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6" :xs="24"> |
| | | <el-card class="box-card"> |
| | | <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"> |
| | | <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> |
| | | <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 :user="user" /> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import userAvatar from "./userAvatar"; |
| | | import userInfo from "./userInfo"; |
| | | import resetPwd from "./resetPwd"; |
| | | import { getUserProfile } from "@/api/system/user"; |
| | | |
| | | export default { |
| | | name: "Profile", |
| | | components: { userAvatar, userInfo, resetPwd }, |
| | | data() { |
| | | return { |
| | | user: {}, |
| | | roleGroup: {}, |
| | | postGroup: {}, |
| | | activeTab: "userinfo" |
| | | }; |
| | | }, |
| | | created() { |
| | | this.getUser(); |
| | | }, |
| | | methods: { |
| | | getUser() { |
| | | getUserProfile().then(response => { |
| | | this.user = response.data.user; |
| | | this.roleGroup = response.data.roleGroup; |
| | | this.postGroup = response.data.postGroup; |
| | | }); |
| | | } |
| | | } |
| | | }; |
| | | </script> |