diff --git a/src/assets/styles/global.scss b/src/assets/styles/global.scss index b3acf66..7d0de14 100644 --- a/src/assets/styles/global.scss +++ b/src/assets/styles/global.scss @@ -1,85 +1,93 @@ @use './user.scss'; @use './system.scss'; + * { - margin: 0; - padding: 0; - box-sizing: border-box; + margin: 0; + padding: 0; + box-sizing: border-box; } html, body, #app { - margin: 0; - padding: 0; - width: 100vw; - height: 100vh; - overflow: hidden; - /* 隐藏全局滚动条 */ + margin: 0; + padding: 0; + width: 100vw; + height: 100vh; + overflow: hidden; + /* 隐藏全局滚动条 */ } .app-container { - width: inherit; - height: inherit; - display: flex; - .layout { + width: 100vw; + height: 100vh; display: flex; - flex: 1; - aside { - width: 200px; - height: 100%; - border-right: solid 1px var(--el-menu-border-color); - } + .layout { + width: 100%; + display: flex; + flex: 1; - .main-container { - flex: 1; - height: 100%; - main { - padding: 20px; - overflow: auto; - max-height: calc(1080px - 200px); - height: 100%; - } + aside { + width: 200px; + height: 100%; + border-right: solid 1px var(--el-menu-border-color); + flex: 0 0 auto; + } + + .main-container { + width: calc(100% - 200px); + flex: 1 1 auto; + height: 100%; + + main { + padding: 20px; + overflow: auto; + max-height: calc(1080px - 200px); + height: 100%; + width: 100%; + box-sizing: border-box; + } + } } - } } // 全局通知样式 .global-notification { - left: 50%; - transform: translateX(-50%); + left: 50%; + transform: translateX(-50%); - // 2. 重写动画:从顶部淡入(取消右侧滑入) - &.el-notification-fade-enter-active, - &.el-notification-fade-leave-active { - transition: all 0.3s ease-out !important; - transform: translate(-50%, -150%) !important; - } + // 2. 重写动画:从顶部淡入(取消右侧滑入) + &.el-notification-fade-enter-active, + &.el-notification-fade-leave-active { + transition: all 0.3s ease-out !important; + transform: translate(-50%, -150%) !important; + } } /* 页面级过渡动画样式(name="fade" 对应前缀 fade-) */ /* 1. 进入/离开的初始状态 */ .global-enter-from, .global-leave-to { - opacity: 0; - /* 初始透明 */ - transform: translateX(20px); - /* 初始右移20px */ + opacity: 0; + /* 初始透明 */ + transform: translateX(20px); + /* 初始右移20px */ } /* 2. 进入/离开的过渡过程 */ .global-enter-active, .global-leave-active { - transition: all 0.5s ease; - /* 过渡时长、缓动效果 */ + transition: all 0.5s ease; + /* 过渡时长、缓动效果 */ } /* 3. 进入完成/离开开始的状态 */ .global-enter-to, .global-leave-from { - opacity: 1; - /* 最终不透明 */ - transform: translateX(0); - /* 最终回到原位 */ + opacity: 1; + /* 最终不透明 */ + transform: translateX(0); + /* 最终回到原位 */ } \ No newline at end of file diff --git a/src/components/common/Table.vue b/src/components/common/Table.vue index ad38b52..5cc1b00 100644 --- a/src/components/common/Table.vue +++ b/src/components/common/Table.vue @@ -3,6 +3,7 @@