From 8a72453608f671d91a481315e4ad32b7b7b4a8ef Mon Sep 17 00:00:00 2001
From: TreeWish <1131093754@qq.com>
Date: 星期四, 16 二月 2023 15:20:44 +0800
Subject: [PATCH] 工程树搜索
---
src/components/Screen/bottom.vue | 54 ++++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 46 insertions(+), 8 deletions(-)
diff --git a/src/components/Screen/bottom.vue b/src/components/Screen/bottom.vue
index be02463..d237236 100644
--- a/src/components/Screen/bottom.vue
+++ b/src/components/Screen/bottom.vue
@@ -20,6 +20,7 @@
v-for="item in projectInfoList"
:key="item.id"
:class="currProject == item.name ? 'active' : ''"
+ @click="handlePopoverClick(item)"
>
{{ item.name }}
</div>
@@ -92,6 +93,9 @@
}
this.YXState = !this.YXState
},
+ handlePopoverClick(params) {
+ this.currProject = params.name
+ },
},
}
</script>
@@ -140,7 +144,7 @@
.bottombtn {
height: 36px;
width: 147px;
- background: url(../../assets/img/Screen/centerbtn.png);
+ background: url(~@/assets/img/Screen/centerbtn.png);
background-size: 100% 100%;
background-repeat: no-repeat;
font-size: 1rem;
@@ -167,25 +171,59 @@
}
}
.popover {
- background-color: aqua;
-
+ display: flex;
+ justify-content: center;
+ width: 163px;
+ height: 239px;
+ background: url(~@/assets/img/Screen/centerTooltip.png);
+ background-size: 100% 100%;
+ border: none;
+ .popper__arrow {
+ display: none;
+ }
.popover-content {
&__header {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ width: 130px;
+ height: 30px;
+ font-size: 18px;
+ color: #fff;
&::before,
&::after {
+ margin: 0 5px;
content: "";
display: inline-block;
- background-color: aqua;
+ background-color: #466c99;
border-radius: 50%;
- width: 10px;
- height: 10px;
+ width: 8px;
+ height: 8px;
}
}
&__list {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-evenly;
+ height: 190px;
+
&__item {
- background-color: orange;
+ color: #fff;
+ width: 130px;
+ height: 30px;
+ line-height: 30px;
+ text-align: center;
+ // background-color: orange;
+ cursor: pointer;
+ background: url(~@/assets/img/Screen/btnbg.png);
+ background-size: 100% 100%;
+
&.active {
- background-color: aqua;
+ // background-color: aqua;
+ background: url(~@/assets/img/Screen/btnc.png);
+ background-size: 100% 100%;
+
}
}
}
--
Gitblit v1.9.3