| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6" :xs="24"> |
| | | <el-card class="box-card"> |
| | | <template v-slot:header> |
| | | <div class="clearfix"> |
| | | <span>个人信æ¯</span> |
| | | </div> |
| | | </template> |
| | | <div> |
| | | <div class="text-center"> |
| | | <userAvatar /> |
| | | </div> |
| | | <ul class="list-group list-group-striped"> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="user" />ç¨æ·åç§° |
| | | <div class="pull-right">{{ state.user.userName }}</div> |
| | | </li> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="phone" />ææºå·ç |
| | | <div class="pull-right">{{ state.user.phonenumber }}</div> |
| | | </li> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="email" />ç¨æ·é®ç®± |
| | | <div class="pull-right">{{ state.user.email }}</div> |
| | | </li> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="tree" />æå±é¨é¨ |
| | | <div class="pull-right" v-if="state.user.dept">{{ state.user.dept.deptName }} / {{ state.postGroup }}</div> |
| | | </li> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="peoples" />æå±è§è² |
| | | <div class="pull-right">{{ state.roleGroup }}</div> |
| | | </li> |
| | | <li class="list-group-item"> |
| | | <svg-icon icon-class="date" />åå»ºæ¥æ |
| | | <div class="pull-right">{{ state.user.createTime }}</div> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | <el-col :span="18" :xs="24"> |
| | | <el-card> |
| | | <template v-slot:header> |
| | | <div class="clearfix"> |
| | | <span>åºæ¬èµæ</span> |
| | | </div> |
| | | </template> |
| | | <el-tabs v-model="activeTab"> |
| | | <el-tab-pane label="åºæ¬èµæ" name="userinfo"> |
| | | <userInfo :user="state.user" /> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="ä¿®æ¹å¯ç " name="resetPwd"> |
| | | <resetPwd /> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup name="Profile"> |
| | | import userAvatar from "./userAvatar" |
| | | import userInfo from "./userInfo" |
| | | import resetPwd from "./resetPwd" |
| | | import { getUserProfile } from "@/api/system/user" |
| | | |
| | | const activeTab = ref("userinfo") |
| | | const state = reactive({ |
| | | user: {}, |
| | | roleGroup: {}, |
| | | postGroup: {} |
| | | }) |
| | | |
| | | function getUser() { |
| | | getUserProfile().then(response => { |
| | | state.user = response.data |
| | | state.roleGroup = response.roleGroup |
| | | state.postGroup = response.postGroup |
| | | }) |
| | | } |
| | | |
| | | getUser() |
| | | </script> |