元气智驾官网前端
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.
 
 
 
 

90 rindas
1.7 KiB

  1. <template>
  2. <el-container>
  3. <el-header>
  4. <div class="header">
  5. <img src="@/assets/logo.png" id="logo" />
  6. <yqheaders/>
  7. <el-button plain class="login" size="small" @click="loginFn">注册 / 登录</el-button>
  8. </div>
  9. </el-header>
  10. <el-main>
  11. <router-view />
  12. </el-main>
  13. <yqfooters/>
  14. <login v-if="loginFlag" />
  15. </el-container>
  16. </template>
  17. <script>
  18. import yqheaders from '@/components/header.vue'
  19. import yqfooters from '@/components/footer.vue'
  20. import login from '@/components/login'
  21. export default {
  22. name: 'layouts',
  23. data () {
  24. return {
  25. loginFlag: false
  26. }
  27. },
  28. components: {
  29. yqheaders,
  30. yqfooters,
  31. login
  32. },
  33. methods: {
  34. loginFn () {
  35. this.loginFlag = true
  36. }
  37. }
  38. }
  39. </script>
  40. <style lang="scss" scoped>
  41. .header{
  42. width: 1200px !important;
  43. }
  44. .el-container {
  45. margin: 0;
  46. padding: 0;
  47. .el-header {
  48. position: fixed;
  49. top: 0;
  50. left: 0;
  51. margin:0;
  52. padding: 0;
  53. width: 100%;
  54. display: flex;
  55. justify-content: center;
  56. height: 77px;
  57. background: #00000081;
  58. align-items: center;
  59. z-index: 99999;
  60. #logo {
  61. width: 163px;
  62. height: 43px;
  63. image-rendering: pixelated;
  64. margin-right: 70px;
  65. float: left;
  66. margin-top: 14px;
  67. }
  68. .login {
  69. background: none !important;
  70. border: 1px solid #00F6BD;
  71. opacity: 0.8;
  72. border-radius: 4px;
  73. color: #fff;
  74. float: right;
  75. margin-top: 20px;
  76. }
  77. }
  78. .el-main {
  79. padding: 0;
  80. margin: 0;
  81. background: #E3E5EA;
  82. }
  83. .el-footer {
  84. margin:0;
  85. padding: 0;
  86. width: 100%;
  87. }
  88. }
  89. </style>