From 2bd38f3c07fa4ec63c5b5fd99bca19d2b1b4ee2d Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期二, 19 三月 2024 14:54:50 +0800 Subject: [PATCH] refactor --- src/views/screen/components/screen-wrapper/index.vue | 22 ++++++++++++++++++---- 1 files changed, 18 insertions(+), 4 deletions(-) diff --git a/src/views/screen/components/screen-wrapper/index.vue b/src/views/screen/components/screen-wrapper/index.vue index c8e55ed..532a79a 100644 --- a/src/views/screen/components/screen-wrapper/index.vue +++ b/src/views/screen/components/screen-wrapper/index.vue @@ -1,14 +1,18 @@ <template> <div class="wrapper-container"> + <div class="wrapper-content"> <div class="left-container wrapper"> <screen-face></screen-face> + <screen-car></screen-car> + <screen-video></screen-video> </div> <div class="center-container wrapper"> + <screen-detection></screen-detection> </div> <div class="right-container wrapper"> - + <screen-examine></screen-examine> </div> </div> </div> @@ -16,10 +20,18 @@ <script> import ScreenFace from '../screen-face/index'; +import ScreenDetection from '../screen-detection/index'; +import ScreenExamine from '../screen-examine/index'; +import ScreenVideo from '../screen-video/index'; +import ScreenCar from '../screen-car/index'; export default { name: 'ScreenWrapper', components: { - ScreenFace + ScreenFace, + ScreenDetection, + ScreenExamine, + ScreenVideo, + ScreenCar }, } </script> @@ -32,16 +44,17 @@ top: 0; left: 0; z-index: 1; + .wrapper-content { width: 100%; height: calc(100% - 100px); margin-top: 100px; - border: 1px solid red; position: relative; box-sizing: border-box; padding: 20px; display: flex; align-items: center; + justify-content: space-between; } } @@ -50,13 +63,14 @@ height: 100%; box-sizing: border-box; padding: 0 10px; - border: 1px solid red; display: flex; flex-direction: column; justify-content: space-between; + &:first-of-type { padding-left: 0; } + &:last-of-type { padding-right: 0; } -- Gitblit v1.8.0