base-page.vue 947 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <page-meta :root-font-size="getRootFontSize"></page-meta>
  3. <view>
  4. <view class="status-bar-block"></view>
  5. <view class="container">
  6. <!-- #ifdef APP-PLUS -->
  7. <layout-aside></layout-aside>
  8. <!-- #endif -->
  9. <view class="body-container common-scrollbar">
  10. <layout-top></layout-top>
  11. <view class="layout-content">
  12. <slot></slot>
  13. </view>
  14. </view>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. data() {
  21. return {};
  22. },
  23. created() {}
  24. };
  25. </script>
  26. <style lang="scss">
  27. .status-bar-block {
  28. width: 100vw;
  29. height: $statusbar-height;
  30. }
  31. .container {
  32. width: 100vw;
  33. height: calc(100vh - #{$statusbar-height});
  34. background: $body-bg;
  35. /* #ifdef H5 */
  36. min-width: 1200px;
  37. /* #endif */
  38. }
  39. .body-container {
  40. padding-top: 0;
  41. padding-left: .86rem;
  42. width: 100%;
  43. height: 100%;
  44. box-sizing: border-box;
  45. overflow-y: scroll;
  46. .layout-content{
  47. height: calc(100% - .51rem);
  48. overflow: hidden;
  49. }
  50. }
  51. </style>