ReportAdmin.vue 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. <template>
  2. <div id="admin">
  3. <header class="header">
  4. <div class="header-left">
  5. <div class="logo-bar">
  6. <img src="@/assets/logo-3.png" class="logo">
  7. </div>
  8. </div>
  9. <div class="header-right">
  10. <!-- <user-bar /> -->
  11. </div>
  12. </header>
  13. <!-- 菜单 -->
  14. <section class="wrapper">
  15. <el-container>
  16. <el-container>
  17. <!-- <el-header></el-header> -->
  18. <el-main class="admin-main-box">
  19. <router-view></router-view>
  20. </el-main>
  21. <el-footer style="height:44px" v-if="aside">
  22. <Footer ></Footer>
  23. </el-footer>
  24. </el-container>
  25. </el-container>
  26. </section>
  27. </div>
  28. </template>
  29. <script>
  30. import { mapGetters } from "vuex";
  31. // import UserBar from "./components/UserBar";
  32. import { webSocket } from "./mixins";
  33. import Footer from "../components/footer/footer.vue";
  34. export default {
  35. components: {
  36. // UserBar,
  37. Footer
  38. },
  39. mixins: [webSocket],
  40. data() {
  41. return {
  42. aside:false,
  43. isCollapse: true,
  44. activeMenu: this.$route.meta.active
  45. }
  46. },
  47. watch: {
  48. // $route(to) {
  49. // this.activeMenu = to.meta.active
  50. // }
  51. },
  52. computed: {
  53. ...mapGetters(['webSocket'])
  54. },
  55. created() {
  56. // this.getPermissionList()
  57. },
  58. async mounted() {
  59. // this.$store.commit('SET_PREFIX', '/admin')
  60. // await this.getUserinfo()
  61. // this.getSelect()
  62. },
  63. methods: {
  64. changePermission() {
  65. this.webSocket.onmessage = (e) => {
  66. if (JSON.parse(e.data).code == '903') {
  67. this.getPermissionList()
  68. }
  69. }
  70. },
  71. getPermissionList() {
  72. var code = "6a8d3f4d1d5f11eda41c00163e2f0200;5051395c24e311eda41c00163e2f0200;2ca26abd37e211eda41c00163e2f0200"
  73. this.$api.getPermissionList({ code: code }).then(response => {
  74. // localStorage.permission =JSON.stringify(JSON.parse(response.data).data)
  75. this.$store.commit('SET_ADMIN_PERMISSION', response.data)
  76. // console.log(response.data)
  77. }).catch(error => {
  78. this.$store.commit('SET_ADMIN_PERMISSION', [])
  79. })
  80. },
  81. getSelect() {
  82. this.$api.getDict().then(response => {
  83. this.$store.commit('SET_ADMIN_DICTIONARIES', response.data)
  84. localStorage.TENANT_TYPE = JSON.stringify(response.data.TENANT_TYPE)
  85. })
  86. },
  87. handleSelect(index, path) {
  88. this.$router.push({
  89. path: '/admin/' + index
  90. })
  91. },
  92. async getUserinfo() {
  93. await this.$api.getUserInfo().then(response => {
  94. // console.log(response)
  95. localStorage.tenant = response.data.tenantId
  96. this.$store.commit('SET_ADMIN_USERINFO', response.data)
  97. this.connectWebSocket( response.data.id)
  98. })
  99. },
  100. }
  101. }
  102. </script>
  103. <style lang="scss">
  104. .tenant .el-input__inner {
  105. height: 32px;
  106. line-height: 32px;
  107. }
  108. .role .el-icon-close {
  109. display: none;
  110. }
  111. .el-table .el-button-group .el-button--primary:first-child {
  112. padding: 0;
  113. p {
  114. margin: 0;
  115. width: 50px;
  116. line-height: 30px;
  117. height: 30px;
  118. }
  119. }
  120. </style>
  121. <style lang="scss">
  122. #admin {
  123. width: 100%;
  124. height: 100%;
  125. .header {
  126. height: 60px;
  127. background: #fff;
  128. box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
  129. border-bottom: 1px solid #d8dce5;
  130. margin-bottom: 10px;
  131. display: flex;
  132. justify-content: space-between;
  133. .logo-bar {
  134. font-size: 20px;
  135. font-weight: bold;
  136. display: flex;
  137. align-items: center;
  138. .logo {
  139. margin-right: 10px;
  140. width: 135px;
  141. height: 35px;
  142. }
  143. }
  144. }
  145. .header-left {
  146. display: flex;
  147. align-items: center;
  148. padding-left: 20px;
  149. }
  150. .header-right {
  151. display: flex;
  152. align-items: center;
  153. }
  154. .wrapper {
  155. width: 100%;
  156. height: calc(100% - 71px);
  157. .el-menu-item.is-active {
  158. background: #ecf5ff !important;
  159. color: #409EFF !important;
  160. }
  161. .admin-main-box {
  162. background: #fff !important;
  163. padding: 10px 10px 45px 10px !important;
  164. }
  165. }
  166. }
  167. </style>