From 4b7e0eaed4322b0641710df7e81b2a40f570f63d Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期三, 19 十月 2022 14:20:42 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt --- src/views/intellectInspect/intelligentLine/index.vue | 68 +++++++++++++++++++++------------- 1 files changed, 42 insertions(+), 26 deletions(-) diff --git a/src/views/intellectInspect/intelligentLine/index.vue b/src/views/intellectInspect/intelligentLine/index.vue index 6fee9ce..66dd212 100644 --- a/src/views/intellectInspect/intelligentLine/index.vue +++ b/src/views/intellectInspect/intelligentLine/index.vue @@ -17,6 +17,7 @@ <div class="blocks"> <div> <div class="star-pic"> + <dv-decoration-12 scanDur="5" haloDur="4" class="scan"/> <div class="star-bg"><img src="../../../assets/loginPage/star-bg.png" /></div> <div class="star"><img src="../../../assets/loginPage/device-pic.png" /></div> </div> @@ -150,7 +151,7 @@ alert('您的浏览器不支持socket'); } else { // 实例化socket - // debugger + debugger let uid = userInfos.value.uid.toString() var url = state.path + uid + '*' + id; console.log(url,'url',uid,'uid') @@ -186,6 +187,7 @@ // 接口获取数据 const getLine = async (id:string) => { + debugger let res = await lineApi().getLine({ id: id }); if (res.data.code === '200') { userInfos.value.dataList = res.data.data; @@ -237,7 +239,7 @@ }; </script> -<!-- Add "scoped" attribute to limit CSS to this component only --> +<!-- Add "scoped" attribute to limit CSS to this components only --> <style scoped lang="scss"> @media screen and (min-width: 1366px) { .big-title { @@ -317,7 +319,7 @@ height: 24px; border-radius: 50%; position: absolute; - border: 1px solid rgba(0, 225, 255, 0.6); + border: 1px solid rgba(0, 114, 255, 0.6); top: -12px; left: 10px; @@ -331,7 +333,7 @@ -moz-border-radius: 50%; border: 1px solid #0072ff; border-radius: 50%; - background-color: #00e1ff; + background-color: #0072ff; z-index: 2; } .pulse { @@ -340,7 +342,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072ff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -352,7 +354,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072ff; } .pulse1 { position: absolute; @@ -360,7 +362,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072ff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -372,7 +374,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072ff; } } & > div { @@ -525,7 +527,7 @@ height: 24px; border-radius: 50%; position: absolute; - border: 1px solid rgba(0, 225, 255, 0.6); + border: 1px solid rgba(0, 114, 255, 0.6); top: -12px; left: 10px; @@ -537,9 +539,9 @@ top: 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; - border: 1px solid #0072ff; + border: 1px solid #0072FF; border-radius: 50%; - background-color: #00e1ff; + background-color: #0072FF; z-index: 2; } .pulse { @@ -548,7 +550,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072FF; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -560,7 +562,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072FF; } .pulse1 { position: absolute; @@ -568,7 +570,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072FF; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -580,7 +582,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072FF; } } & > div { @@ -734,7 +736,7 @@ height: 24px; border-radius: 50%; position: absolute; - border: 1px solid rgba(0, 225, 255, 0.6); + border: 1px solid rgba(0, 114, 255, 0.6); top: -12px; left: 2px; @@ -748,7 +750,7 @@ -moz-border-radius: 50%; border: 1px solid #0072ff; border-radius: 50%; - background-color: #00e1ff; + background-color: #0072ff; z-index: 2; } .pulse { @@ -757,7 +759,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072ff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -769,7 +771,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072ff; } .pulse1 { position: absolute; @@ -777,7 +779,7 @@ height: 48px; left: -13px; top: -13px; - border: 1px solid #00e1ff; + border: 1px solid #0072ff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; @@ -789,7 +791,7 @@ -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; - box-shadow: 1px 1px 30px #00e1ff; + box-shadow: 1px 1px 30px #0072ff; } } & > div { @@ -1004,9 +1006,10 @@ display: flex; justify-content: center; align-items: flex-start; - overflow: hidden; - overflow-x: auto; - overflow-y: auto; + overflow: auto; + + &::-webkit-scrollbar { width: 0; height: 0; color: transparent; } + &::scrollbar { width: 0; height: 0; color: transparent; } } .line-map { @@ -1365,15 +1368,28 @@ position: absolute; width: calc((100vw - 120px) / 7); height: calc((100vw - 120px) / 7); - z-index: 999999999; + z-index: 9999; bottom: 40px; right: 40px; padding: 20px; + + .scan{ + position: inherit; + width: 65%; + height: 65%; + z-index: 99997; + left: 0; + top: 0; + right: 0; + bottom: 0; + margin: auto; + } .star-bg { position: inherit; width: 100%; height: 100%; + z-index: 99998; left: 0; top: 0; img { @@ -1382,11 +1398,11 @@ animation: circle 30s linear infinite; } } - .star { position: inherit; width: 100%; height: 100%; + z-index: 99999; left: 0; top: 0; img { -- Gitblit v1.9.2