heads.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <template>
  2. <div id="heads">
  3. <el-row>
  4. <el-col :span="24">
  5. <el-col :span="1" style="width: 35px;padding-top: 20px;">
  6. <el-image style="width: 35px; height: 35px;border-radius: 50%" :src="require('../../assets/top.png')"></el-image>
  7. </el-col>
  8. <el-col :span="17" class="title">
  9. 吉企银通管理后台
  10. </el-col>
  11. <el-col :span="6" class="admin">
  12. <i class="el-icon-user icon"></i>
  13. <span class="name">管理员:{{ user.name }}</span>
  14. <span class="shu">|</span>
  15. <el-link :underline="false" class="out" @click="toLogout()">退出</el-link>
  16. </el-col>
  17. </el-col>
  18. </el-row>
  19. </div>
  20. </template>
  21. <script>
  22. import { mapState, mapMutations, createNamespacedHelpers } from 'vuex';
  23. export default {
  24. name: 'heads',
  25. props: {},
  26. components: {},
  27. data: () => ({}),
  28. created() {},
  29. watch: {},
  30. computed: {
  31. ...mapState(['user']),
  32. },
  33. methods: {
  34. ...mapMutations(['deleteUser']),
  35. async toLogout() {
  36. this.deleteUser();
  37. this.$message({
  38. message: '注销成功',
  39. type: 'success',
  40. });
  41. this.toLogin();
  42. },
  43. async toLogin() {
  44. this.$router.push({ name: 'login' });
  45. },
  46. },
  47. };
  48. </script>
  49. <style lang="less" scoped>
  50. .title {
  51. font-size: 18px;
  52. font-family: Source Han Sans SC;
  53. font-weight: bold;
  54. color: #ffffff;
  55. padding: 23px 10px;
  56. }
  57. .admin {
  58. text-align: right;
  59. padding: 24px 30px;
  60. }
  61. .admin .icon {
  62. color: #fff;
  63. padding: 0 5px;
  64. }
  65. .admin .name {
  66. font-size: 14px;
  67. font-family: Source Han Sans SC;
  68. font-weight: 400;
  69. color: rgba(255, 255, 255, 1);
  70. }
  71. .admin .shu {
  72. padding: 0 10px;
  73. color: rgba(255, 255, 255, 1);
  74. }
  75. .admin .out {
  76. font-size: 14px;
  77. font-family: Source Han Sans SC;
  78. font-weight: 400;
  79. color: rgba(233, 2, 29, 1);
  80. }
  81. </style>