login.vue 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <template>
  2. <el-container class="auth-container">
  3. <!-- 头部 -->
  4. <el-header class="ns-login-header">
  5. <div class="header-in">
  6. <!-- <ns-header-mid /> -->
  7. <el-row>
  8. <el-col :span="6">
  9. <router-link to="/" class="logo-wrap"><img :src="$img(siteInfo.logo)" alt /></router-link>
  10. </el-col>
  11. </el-row>
  12. </div>
  13. </el-header>
  14. <el-main>
  15. <transition name="slide"><nuxt /></transition>
  16. </el-main>
  17. <!-- 底部 -->
  18. <!-- <el-footer class="login-footer"><copy-right /></el-footer> -->
  19. </el-container>
  20. </template>
  21. <script>
  22. import CopyRight from './components/CopyRight';
  23. import NsHeaderMid from './components/NsHeaderMid';
  24. import { mapGetters } from 'vuex';
  25. export default {
  26. components: {
  27. CopyRight,
  28. NsHeaderMid
  29. },
  30. created() {
  31. this.$store.dispatch('site/siteInfo');
  32. },
  33. mounted() {},
  34. computed: {
  35. ...mapGetters(['siteInfo'])
  36. },
  37. watch: {},
  38. methods: {},
  39. head() {
  40. return {
  41. title: this.$store.state.site.siteInfo.site_name
  42. };
  43. }
  44. };
  45. </script>
  46. <style lang="scss">
  47. html,
  48. body {
  49. background: #fff !important;
  50. }
  51. </style>
  52. <style lang="scss" scoped>
  53. .ns-login-header {
  54. height: 109px !important;
  55. }
  56. .header-in {
  57. width: $width;
  58. height: 89px;
  59. margin: 0 auto;
  60. padding-top: 20px;
  61. .logo-wrap {
  62. width: 240px;
  63. height: 68px;
  64. display: block;
  65. line-height: 68px;
  66. img {
  67. max-width: 100%;
  68. max-height: 100%;
  69. }
  70. }
  71. }
  72. .login-footer .footer-bottom p .footer-link,
  73. .login-footer .footer-bottom p .el-link.el-link--default {
  74. color: #303133;
  75. }
  76. .login-footer .footer-bottom p .footer-link:hover {
  77. color: $base-color;
  78. }
  79. .el-main {
  80. width: 100% !important;
  81. }
  82. .auth-container {
  83. background: #fff;
  84. min-height: 100vh;
  85. }
  86. </style>