feat 头像选项 增加账号显示

src/store/modules/user.js

@@ -6,6 +6,7 @@ export default {
   namespaced: true,
   state: {
     token: null,
+    id: null,
     name: null,
     uname: null,
     photo: null,
@@ -19,6 +20,7 @@ export default {
       if (state.token == null) {
         if (localStorage.getItem('token') != null) {
           state.token = localStorage.getItem('token')
+          state.id = localStorage.getItem('id')
           state.name = localStorage.getItem('name')
           state.uname = localStorage.getItem('uname')
           state.photo = localStorage.getItem('photo')
@@ -31,6 +33,7 @@ export default {
     // 清除用户信息
     destroyUser (state) {
       state.token = null
+      state.id = null
       state.name = null
       state.uname = null
       state.photo = null
@@ -57,6 +60,7 @@ export default {
         res => {
           if (res.data.status === 1) {
             localStorage.setItem('token', res.data.token)
+            localStorage.setItem('id', res.data.adminInfo.id)
             localStorage.setItem('name', res.data.adminInfo.name)
             localStorage.setItem('uname', res.data.adminInfo.uname)
             localStorage.setItem('photo', res.data.adminInfo.photo)

src/views/layout/components/headbar.vue

@@ -20,6 +20,11 @@
         </div>
 
         <el-dropdown-menu slot="dropdown" class="user-dropdown">
+          <!-- 账号id显示 -->
+          <el-dropdown-item command="go-adminEdit">
+            <i class="el-icon-user-solid m-r-10"></i>
+            <font class="brandFontColor">{{ this.$store.state.user.name }}</font>
+          </el-dropdown-item>
           <!-- 自定义语言设置为右侧弹出 -->
           <el-dropdown-item>
             <el-popover placement="right-start" width="150" trigger="hover" v-model="languagePopoverVisible">
@@ -28,12 +33,15 @@
                 <!-- 其他语言可继续添加 -->
                 <!-- <el-radio label="en" class="m-t-10">English</el-radio> -->
               </el-radio-group>
-              <span slot="reference" class="mainFontColor f-s-16"><i class="iconfont icon-zhongyingwen m-r-10"></i>语言设置</span>
+              <span slot="reference" class="mainFontColor f-s-16"><i
+                  class="iconfont icon-zhongyingwen m-r-10"></i>语言设置</span>
             </el-popover>
           </el-dropdown-item>
 
-          <el-dropdown-item class="mainFontColor f-s-16" command="go-setting"><i class="iconfont icon-shezhi m-r-10"></i>设置</el-dropdown-item>
+          <el-dropdown-item class="mainFontColor f-s-16" command="go-setting"><i
-          <el-dropdown-item class="mainFontColor f-s-16" divided command="logout"><i class="iconfont icon-logout m-r-10"></i>退出登录</el-dropdown-item>
+              class="iconfont icon-shezhi m-r-10"></i>设置</el-dropdown-item>
+          <el-dropdown-item class="mainFontColor f-s-16" divided command="logout"><i
+              class="iconfont icon-logout m-r-10"></i>退出登录</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
     </div>
@@ -264,7 +272,7 @@ export default {
      * @description: 刷新当前页面
      */
     refreshPage () {
-      /* init 数据接口 */
+    /* init 数据接口 */
       this.$store.commit('app/setIsMobile') // 获取客户端平台类型
       this.$store.dispatch('fetchPlaneClassList')// 获取机型列表
       this.$store.dispatch('fetchAirList') // 获取飞机列表
@@ -278,8 +286,8 @@ export default {
       this.$store.dispatch('fetchMessageList')// 获取管理员公告列表 并弹出公告框
     },
     /**
-     * @description: 登出
+   * @description: 登出
-     */
+   */
     logout () {
       this.$store
         .dispatch('user/destroyUserAsync')
@@ -290,6 +298,8 @@ export default {
         this.$router.push('/home/set')
       } else if (command === 'logout') {
         this.logout()
+      } else if (command === 'go-adminEdit') {
+        this.$router.push(`/admin/edit/${this.$store.state.user.id}`)
       }
     },
     changeLang (lang) {
@@ -304,12 +314,12 @@ export default {
   watch: {
     paidOrderList: {
       handler (newVal, oldVal) {
-        // 面包条订单图标跳动
+      // 面包条订单图标跳动
         if (this.getQuestInterval !== null) {
           clearInterval(this.getQuestInterval)
         }
         if (newVal.length > 0) {
-          // 订单更新时 订单数大于0 面包条订单图标跳动
+        // 订单更新时 订单数大于0 面包条订单图标跳动
           this.getQuestInterval = setInterval(() => {
             this.animationTrumpet = !this.animationTrumpet // 面包条订单图标跳动
           }, 500)
@@ -323,7 +333,7 @@ export default {
     },
     requestedCount: {
       handler (newVal, oldVal) {
-        // 播报退款订单
+      // 播报退款订单
         if (newVal.length > oldVal.length) {
           this.speakText('有订单申请退款')
         }