index.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <template>
  2. <div class="box">
  3. <el-container style="height: 100%">
  4. <el-aside>
  5. <NavbarItem></NavbarItem>
  6. </el-aside>
  7. <el-container>
  8. <el-header>
  9. <Navbar></Navbar>
  10. </el-header>
  11. <el-main>
  12. <router-view></router-view>
  13. </el-main>
  14. </el-container>
  15. </el-container>
  16. </div>
  17. </template>
  18. <script>
  19. import NavbarItem from "@/layout/components/NavbarItem";
  20. import Navbar from "@/layout/components/Navbar";
  21. import Cookies from "js-cookie";
  22. export default {
  23. name: "Layout",
  24. components: { NavbarItem, Navbar },
  25. data() {
  26. return {};
  27. },
  28. mounted() {},
  29. methods: {},
  30. };
  31. </script>
  32. <style scoped lang="scss">
  33. .box {
  34. width: 100%;
  35. height: 100%;
  36. .el-header {
  37. color: #333;
  38. text-align: center;
  39. width: 1660px;
  40. padding: 0;
  41. height: 96px !important;
  42. background: rgba(255, 255, 255, 1);
  43. }
  44. .el-aside {
  45. background-color: #d3dce6;
  46. color: #333;
  47. text-align: center;
  48. height: 100%;
  49. width: 260px !important;
  50. background: #fff;
  51. }
  52. .el-main {
  53. background: RGBA(235, 238, 246, 1);
  54. padding: 32px 0 0 25px;
  55. }
  56. }
  57. </style>