From ee17debc7eff4af0bbfc1f28a256f2a05993b0c5 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期二, 16 四月 2024 17:19:36 +0800 Subject: [PATCH] feat:添加圆环 --- src/views/screen/components/screen-wrapper/index.vue | 38 ++++++++++++++++++++++---------------- 1 files changed, 22 insertions(+), 16 deletions(-) diff --git a/src/views/screen/components/screen-wrapper/index.vue b/src/views/screen/components/screen-wrapper/index.vue index c501131..680c6d1 100644 --- a/src/views/screen/components/screen-wrapper/index.vue +++ b/src/views/screen/components/screen-wrapper/index.vue @@ -1,8 +1,8 @@ <template> <div class="wrapper-container"> <select-item></select-item> - <div class="return-button"> - <el-button type="primary" @click="returnPath">绠$悊绯荤粺</el-button> + <div class="return-button" @click="returnPath"> + 杩斿洖 </div> <div class="wrapper-content"> <screen-map-three></screen-map-three> @@ -12,7 +12,6 @@ <screen-video class="enter-left animate-delay-2" :class="{ 'animate-enter-x': isEnd }"></screen-video> </div> <div class="center-container center-wrapper"> - <!-- <screen-map></screen-map> --> <screen-map-cover></screen-map-cover> <screen-table class="enter-top" :class="{ 'animate-enter-y': isEnd }"></screen-table> <!-- <screen-detection></screen-detection> --> @@ -20,6 +19,7 @@ </div> <div class="right-container wrapper"> <screen-examine class="enter-right" :class="{ 'animate-enter-x': isEnd }"></screen-examine> + <screen-data class="enter-right animate-delay-1" :class="{ 'animate-enter-x': isEnd }"></screen-data> </div> </div> </div> @@ -27,27 +27,27 @@ <script> import SelectItem from '../select-item/index'; -import ScreenFace from '../screen-face/index'; import ScreenExamine from '../screen-examine/index'; +import ScreenFace from '../screen-face/index'; import ScreenVideo from '../screen-video/index'; import ScreenCar from '../screen-car/index'; -import ScreenMap from '../screen-map/index'; import ScreenMapCover from '../screen-map-cover/index'; import ScreenTable from '../screen-table/index'; -import ScreenMapThree from '../screen-map-three/index.vue'; +import ScreenMapThree from '../screen-map-three/index'; +import ScreenData from '../screen-data/index'; export default { name: 'ScreenWrapper', components: { SelectItem, - ScreenFace, ScreenExamine, - ScreenVideo, - ScreenCar, - ScreenMap, ScreenTable, ScreenMapCover, - ScreenMapThree + ScreenMapThree, + ScreenFace, + ScreenVideo, + ScreenCar, + ScreenData }, data() { return { @@ -80,7 +80,13 @@ .return-button { position: absolute; right: 20px; - top: 40px; + top: 10px; + border-radius: 4px; + border: 1px solid #4481DD; + background-color: rgba(67, 102, 155, 0.4); + color: #4481DD; + padding: 5px 20px; + cursor: pointer; } .wrapper-container { @@ -93,8 +99,8 @@ .wrapper-content { width: 100%; - height: calc(100% - 100px); - margin-top: 100px; + height: calc(100% - 60px); + margin-top: 60px; position: relative; box-sizing: border-box; padding: 20px; @@ -105,7 +111,7 @@ } .wrapper { - width: 20%; + width: 25%; height: 100%; box-sizing: border-box; padding: 0 10px; @@ -123,7 +129,7 @@ } .center-wrapper { - width: 60%; + width: 50%; height: 100%; box-sizing: border-box; padding: 0 10px; -- Gitblit v1.8.0