| | |
|---|
| | | <template> |
|---|
| | | <div class="app-main"> |
|---|
| | | <AppHeader :headerTitle="$route.meta.title" /> |
|---|
| | | <router-view :key="key" /> |
|---|
| | | <div class="app-main-content"> |
|---|
| | | <router-view :key="key" /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | |
|---|
| | | <!-- Add "scoped" attribute to limit CSS to this component only --> |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | .app-main { |
|---|
| | | margin-left: 10px; |
|---|
| | | box-sizing: border-box; |
|---|
| | | display: flex; |
|---|
| | | flex: 1; |
|---|
| | | flex-direction: column; |
|---|
| | | background-color: $color-bg; |
|---|
| | | // height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | width: calc(100% - 200px); |
|---|
| | | .app-main-content { |
|---|
| | | width: 100%; |
|---|
| | | overflow-y: hidden; |
|---|
| | | height: calc(100% - 50px); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
