Commit c414e0eb6218336458e460f5ffd2a82eef5213d0
1 parent
2ce22871
v3.7.0 删掉此处代码,使右边栏动画生效。现在是没有动画的
Showing
1 changed file
with
35 additions
and
36 deletions
yudao-ui-admin/src/layout/index.vue
| @@ -8,7 +8,7 @@ | @@ -8,7 +8,7 @@ | ||
| 8 | <tags-view v-if="needTagsView" /> | 8 | <tags-view v-if="needTagsView" /> |
| 9 | </div> | 9 | </div> |
| 10 | <app-main /> | 10 | <app-main /> |
| 11 | - <right-panel v-if="showSettings"> | 11 | + <right-panel> |
| 12 | <settings /> | 12 | <settings /> |
| 13 | </right-panel> | 13 | </right-panel> |
| 14 | </div> | 14 | </div> |
| @@ -39,7 +39,6 @@ export default { | @@ -39,7 +39,6 @@ export default { | ||
| 39 | sideTheme: state => state.settings.sideTheme, | 39 | sideTheme: state => state.settings.sideTheme, |
| 40 | sidebar: state => state.app.sidebar, | 40 | sidebar: state => state.app.sidebar, |
| 41 | device: state => state.app.device, | 41 | device: state => state.app.device, |
| 42 | - showSettings: state => state.settings.showSettings, | ||
| 43 | needTagsView: state => state.settings.tagsView, | 42 | needTagsView: state => state.settings.tagsView, |
| 44 | fixedHeader: state => state.settings.fixedHeader | 43 | fixedHeader: state => state.settings.fixedHeader |
| 45 | }), | 44 | }), |
| @@ -64,45 +63,45 @@ export default { | @@ -64,45 +63,45 @@ export default { | ||
| 64 | </script> | 63 | </script> |
| 65 | 64 | ||
| 66 | <style lang="scss" scoped> | 65 | <style lang="scss" scoped> |
| 67 | - @import "~@/assets/styles/mixin.scss"; | ||
| 68 | - @import "~@/assets/styles/variables.scss"; | 66 | +@import "~@/assets/styles/mixin.scss"; |
| 67 | +@import "~@/assets/styles/variables.scss"; | ||
| 69 | 68 | ||
| 70 | - .app-wrapper { | ||
| 71 | - @include clearfix; | ||
| 72 | - position: relative; | ||
| 73 | - height: 100%; | ||
| 74 | - width: 100%; | 69 | +.app-wrapper { |
| 70 | + @include clearfix; | ||
| 71 | + position: relative; | ||
| 72 | + height: 100%; | ||
| 73 | + width: 100%; | ||
| 75 | 74 | ||
| 76 | - &.mobile.openSidebar { | ||
| 77 | - position: fixed; | ||
| 78 | - top: 0; | ||
| 79 | - } | ||
| 80 | - } | ||
| 81 | - | ||
| 82 | - .drawer-bg { | ||
| 83 | - background: #000; | ||
| 84 | - opacity: 0.3; | ||
| 85 | - width: 100%; | ||
| 86 | - top: 0; | ||
| 87 | - height: 100%; | ||
| 88 | - position: absolute; | ||
| 89 | - z-index: 999; | ||
| 90 | - } | ||
| 91 | - | ||
| 92 | - .fixed-header { | 75 | + &.mobile.openSidebar { |
| 93 | position: fixed; | 76 | position: fixed; |
| 94 | top: 0; | 77 | top: 0; |
| 95 | - right: 0; | ||
| 96 | - z-index: 9; | ||
| 97 | - width: calc(100% - #{$sideBarWidth}); | ||
| 98 | - transition: width 0.28s; | ||
| 99 | } | 78 | } |
| 79 | +} | ||
| 100 | 80 | ||
| 101 | - .hideSidebar .fixed-header { | ||
| 102 | - width: calc(100% - 54px) | ||
| 103 | - } | 81 | +.drawer-bg { |
| 82 | + background: #000; | ||
| 83 | + opacity: 0.3; | ||
| 84 | + width: 100%; | ||
| 85 | + top: 0; | ||
| 86 | + height: 100%; | ||
| 87 | + position: absolute; | ||
| 88 | + z-index: 999; | ||
| 89 | +} | ||
| 104 | 90 | ||
| 105 | - .mobile .fixed-header { | ||
| 106 | - width: 100%; | ||
| 107 | - } | 91 | +.fixed-header { |
| 92 | + position: fixed; | ||
| 93 | + top: 0; | ||
| 94 | + right: 0; | ||
| 95 | + z-index: 9; | ||
| 96 | + width: calc(100% - #{$sideBarWidth}); | ||
| 97 | + transition: width 0.28s; | ||
| 98 | +} | ||
| 99 | + | ||
| 100 | +.hideSidebar .fixed-header { | ||
| 101 | + width: calc(100% - 54px) | ||
| 102 | +} | ||
| 103 | + | ||
| 104 | +.mobile .fixed-header { | ||
| 105 | + width: 100%; | ||
| 106 | +} | ||
| 108 | </style> | 107 | </style> |