App.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. <template>
  2. <div id="app">
  3. <transition name="el-fade-in">
  4. <router-view />
  5. </transition>
  6. </div>
  7. </template>
  8. <script>
  9. export default {
  10. watch: {
  11. $route(to) {
  12. this.$store.commit("setPages", to.path);
  13. this.$store.commit("setDefaultActive", unescape(to.fullPath));
  14. },
  15. },
  16. };
  17. </script>
  18. <style lang="scss">
  19. @import "assets/style";
  20. @import "assets/simple";
  21. * {
  22. padding: 0;
  23. margin: 0;
  24. box-sizing: border-box;
  25. // font-family: Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB,
  26. // WenQuanYi Micro Hei, Microsoft Yahei, sans-serif !important;
  27. font-family: "Microsoft YaHei",微软雅黑,Consolas,"LiberationMono",Courier,monospace,simsun !important;
  28. }
  29. html,
  30. body,
  31. #app,
  32. .page {
  33. width: 100%;
  34. min-width: 1000px;
  35. overflow: hidden;
  36. height: 100%;
  37. font-family: "Avenir", Helvetica, Arial, sans-serif;
  38. -webkit-font-smoothing: antialiased;
  39. -moz-osx-font-smoothing: grayscale;
  40. }
  41. .page {
  42. background: rgb(229, 235, 242);
  43. position: relative;
  44. z-index: 0;
  45. background-repeat: repeat-y;
  46. }
  47. .el-header {
  48. padding: 0 !important;
  49. }
  50. // .page:after {
  51. // content: '.';
  52. // color: rgba(0, 0, 0, 0);
  53. // position: absolute;
  54. // left: 0;
  55. // top: 0;
  56. // z-index: 1;
  57. // width: 100%;
  58. // height: 308px;
  59. // background: linear-gradient(to right, #107CFF, #1025FF);
  60. // }
  61. .router-page {
  62. height: 100%;
  63. flex-grow: 1;
  64. }
  65. .query-card {
  66. .el-form--inline {
  67. margin-top: -17px;
  68. padding-left: 20px;
  69. padding-right: 20px;
  70. .el-form-item {
  71. padding-top: 17px;
  72. padding-bottom: 0px;
  73. margin-bottom: 0;
  74. margin-right: 40px;
  75. }
  76. }
  77. }
  78. .el-menu {
  79. border: none;
  80. .el-menu-item,
  81. .el-submenu__title {
  82. height: 47px;
  83. line-height: 47px;
  84. font-family: PingFangSC-Regular;
  85. font-size: 14px;
  86. color: #666666;
  87. letter-spacing: 0;
  88. }
  89. .is-active {
  90. color: #107cff;
  91. }
  92. }
  93. .el-button--primary {
  94. background-color: #107cff;
  95. }
  96. .table-card {
  97. margin-top: 9px;
  98. }
  99. .p-table-header-row {
  100. background-color: rgba(16, 124, 255, 0.05) !important;
  101. }
  102. .p-table-header-cell {
  103. background-color: rgba(16, 124, 255, 0.05) !important;
  104. font-family: PingFangSC-Medium;
  105. font-size: 14px;
  106. color: #333333;
  107. text-align: center !important;
  108. }
  109. .p-table-cell {
  110. font-family: PingFangSC-Regular;
  111. font-size: 14px;
  112. color: #666666;
  113. text-align: center !important;
  114. }
  115. .router-page {
  116. display: flex;
  117. flex-direction: column;
  118. .query-card {
  119. flex-grow: 0;
  120. flex-shrink: 0;
  121. }
  122. .table-card {
  123. flex-grow: 1;
  124. flex-shrink: 1;
  125. height: 100%;
  126. overflow-y: auto;
  127. }
  128. }
  129. .el-image-viewer__close {
  130. color: #fff;
  131. }
  132. .el-menu-item {
  133. overflow: hidden;
  134. text-overflow: ellipsis;
  135. white-space: nowrap;
  136. }
  137. </style>